注册 短信发送失败

src/api/index.ts

@@ -144,11 +144,11 @@ export async function getlivelist(data?:any) {
  * 列表统计
  */
 
- interface StatisticList{
+interface StatisticList{
-    liveInfo: any;
+liveInfo: any;
-    videoInfo: any;
+videoInfo: any;
-    studentInfo: any;
+studentInfo: any;
- }
+}
 
 export async function getstatisticlist() {
     const res = await get<StatisticList>('statistics');
@@ -166,8 +166,31 @@ export async function getstatisticlist() {
 interface Liveaddrule{
     code:number,
     msg:string
- }
+}
- export async function liveadd(data:any) {
+export async function liveadd(data:any) {
     const res = await post<Liveaddrule>('live',data);
     console.log(res)
- }
+}
+
+
+/**
+ * 发送验证码 
+ * @param phone 手机号 
+ * @param type 国外1 国内0
+ */
+interface SendSms{
+    code: number;
+    msg: string;
+}
+
+export async function sendsms(phone: string, type: number): Promise<boolean>{
+    const res = await post<SendSms>("SendSms", {phone, type});
+    console.log(res);
+    if(res.code == 0){
+        message.success(res.msg);
+        return true;
+    }else{
+        message.error(res.msg);
+        return false;
+    }
+}

src/views/login/Login.vue

@@ -7,7 +7,7 @@
           您好，欢迎来到 <span class="orgname">Beelink</span>
         </div>
         <div class="nosign">
-          还没有账号？ <span class="tosign"> 成为一名Beelink老师 </span>
+          还没有账号？ <span class="tosign"><router-link to="/sign"> 成为一名Beelink老师 </router-link></span>
         </div>
         <div class="tab">
           <LoginTab @sel="Selectnum"></LoginTab>
@@ -260,7 +260,7 @@ export default defineComponent({
         margin-top: 17px;
         margin-bottom: 35px;
       }
-      .tosign {
+      .tosign > a {
         color: #0dbba4;
         cursor: pointer;
       }

src/views/login/Sign.vue

@@ -1,6 +1,6 @@
 <template>
   <div class="login">
-     <NavTop :type="0" style="flex-shrink:0"></NavTop>
+    <NavTop :type="0" style="flex-shrink: 0"></NavTop>
     <div class="box">
       <div :class="stepnow != 2 ? 'left' : 'left left1'">
         <div class="title">
@@ -17,26 +17,26 @@
             <a-form-item label="手机号" class="form-item">
               <a-input-group compact>
                 <a-select
-                  default-value="Zhejiang"
                   class="getcode"
                   style="width: 50%"
+                  v-model:value="phone.quhao"
                 >
-                  <a-select-option value="Zhejiang">
+                  <a-select-option value="86">
                     中国+0086
                   </a-select-option>
                   <a-select-option value="Jiangsu"> Jiangsu </a-select-option>
                 </a-select>
                 <div class="line"></div>
-                <a-input style="width: 50%" placeholder="请输入您的手机号" />
+                <a-input v-model:value="phone.phone" style="width: 50%" placeholder="请输入您的手机号" />
               </a-input-group>
             </a-form-item>
             <a-form-item label="验证码" class="form-item">
               <a-input-group compact>
-                <div class="getcode" @click="getcode">
+                <div class="getcode" style="width: 50%" @click="getcode">
                   点击获取验证码{{ time == 60 ? "" : "(" + time + ")" }}
                 </div>
                 <div class="line"></div>
-                <a-input style="width: 50%" placeholder="请输入您的验证码" />
+                <a-input v-model:value="phone.code" style="width: 50%" placeholder="请输入您的验证码" />
               </a-input-group>
             </a-form-item>
             <div class="submit" @click="next(2)">下一步</div>
@@ -62,10 +62,18 @@
           <a-form :layout="formLayout">
             <div class="signform">
               <a-form-item label="设置密码" class="form-item">
-                <a-input class="shuru" placeholder="请输入您的密码" type="password"/>
+                <a-input
+                  class="shuru"
+                  placeholder="请输入您的密码"
+                  type="password"
+                />
               </a-form-item>
               <a-form-item label="设置密码" class="form-item">
-                <a-input class="shuru" placeholder="请再次输入您的密码" type="password"/>
+                <a-input
+                  class="shuru"
+                  placeholder="请再次输入您的密码"
+                  type="password"
+                />
               </a-form-item>
               <a-form-item label="姓名" class="form-item">
                 <a-input class="shuru" placeholder="请输入您的姓名" />
@@ -93,7 +101,7 @@
 
         <div v-if="stepnow == 3">
           <div class="nosign">您已完成注册</div>
-          <img src="@/static/images/success.png" alt="" class="success">
+          <img src="@/static/images/success.png" alt="" class="success" />
           <div class="ale">恭喜您注册成功，点击跳转到我的档案页面</div>
         </div>
       </div>
@@ -107,7 +115,7 @@
           <div class="step">
             <div :class="stepnow == 2 ? 'circle step1' : 'circle'">02</div>
             <div :class="stepnow == 2 ? 'stepnow' : ''">填写帐号信息</div>
-            <div class="back" @click="next(1)" v-if="stepnow==2">
+            <div class="back" @click="next(1)" v-if="stepnow == 2">
               返回上一步
             </div>
           </div>
@@ -128,41 +136,52 @@
 </template>
 
 <script lang="ts">
-import { defineComponent, ref } from "vue";
+import { defineComponent, reactive, ref } from "vue";
-import NavTop from "@/components/NavTop.vue"
+import NavTop from "@/components/NavTop.vue";
+import { sendsms } from '@/api';
 
 export default defineComponent({
   name: "Sign",
-  components: {NavTop},
+  components: { NavTop },
   setup() {
     const formLayout = {
       labelCol: 4,
       wrapperCol: 14,
     };
     const time = ref(60); //倒计时初始化
+    const phone = reactive({
+        quhao:"86",
+        phone: "",
+        code: ""
+    });
 
     /**
      * @param
      * 点击获取验证码  触发60S倒计时
      */
+    let lock = false;
     const getcode: () => void = () => {
-      console.log(11111);
+        console.log(11111);
-      const timestep = setInterval(() => {
+        if (lock) {
-        console.log(11112);
+        return;
-        time.value = time.value - 1;
-        if (time.value > 0) {
-          console.log();
-        } else {
-          time.value = 60;
-          clearInterval(timestep);
         }
-      }, 1000);
+        lock = true;
+        sendsms(phone.quhao + phone.phone, 0);
+        const timestep = setInterval(() => {
+        console.log(phone);
+        time.value = time.value - 1;
+        if (time.value <= 0) {
+            time.value = 60;
+            clearInterval(timestep);
+            lock = false;
+        }
+        }, 1000);
     };
     const ifagree = ref(true); //是否同意用户协议
 
     /**
      *@param
-     * 用户协议前面radio 的点击效果 
+     * 用户协议前面radio 的点击效果
      */
     const agree: () => void = () => {
       ifagree.value = ifagree.value == true ? false : true;
@@ -173,7 +192,7 @@ export default defineComponent({
 
     /**
      *@param  e 跳到哪一步
-     * 步骤条跳到某一步 
+     * 步骤条跳到某一步
      */
     const next: (e: number) => void = (e: number) => {
       stepnow.value = e;
@@ -186,6 +205,7 @@ export default defineComponent({
       ifagree,
       stepnow,
       next,
+      phone
     };
   },
 });
@@ -266,6 +286,7 @@ export default defineComponent({
         font-size: 15px;
         color: #08ae98;
         width: 313px;
+        // width: 50%;
         line-height: 30px;
         cursor: pointer;
       }
@@ -377,12 +398,12 @@ export default defineComponent({
       float: right;
     }
   }
-  .success{
+  .success {
     width: 250px;
     height: 233px;
   }
-  .ale{
+  .ale {
-    color:#08AE98;
+    color: #08ae98;
     font-size: 14px;
     font-weight: 800;
     margin-top: 34px;