src/api/index.ts

@@ -446,6 +446,9 @@ export async function getarchives(): Promise<[Countries[],Willsay[]]>{
     return [(await get<Countries[]>("countries")).data, (await get<Willsay[]>("willsay")).data];
 }
 
+export async function getwillsay(): Promise<Willsay[]>{
+    return (await get<Willsay[]>("willsay")).data;
+}
 
 /**
  * 客户端语言
@@ -570,3 +573,51 @@ export async function cancellive(id: number, status: number){
         return false;
     }
 }
+
+
+
+
+/**
+ * 验证验证码
+ */
+
+export async function checksmscode(phone: string, smscode: string){
+    const res = await get("checkSmscode",{phone, smscode});
+    if(res.code == 0){
+        return true;
+    }else{
+        message.error(res.msg);
+        return false;
+    }
+}
+
+
+
+export async function register(data: any){
+    const res = await post<any>("register",{
+        mobile: data.phone,
+        code: data.quhao,
+        password: data.pass,
+        topassword: data.passtow,
+        name: data.name,
+        email: data.emil,
+        mtongue: data.muyu,
+        tlanguage: data.jiaoshou
+    })
+    if(res.code == 0){
+        message.success(res.msg)
+        if(!saveValue("token", res.data.api_token) && !saveValue("memberid", res.data.memberid) ){
+            message.error("存储错误, 请允许网页使用本地存储！")
+            return false;
+        }else{
+            setToken();
+            store.commit("login", true);
+            store.dispatch("setUserInfo");
+            // router.push("/mine/archives")
+        }
+        return true;
+    }else{
+        message.error(res.msg)
+        return false;
+    }
+}

src/views/login/Sign.vue

@@ -66,6 +66,7 @@
                   class="shuru"
                   placeholder="请输入您的密码"
                   type="password"
+                  v-model:value="userinfo.pass"
                 />
               </a-form-item>
               <a-form-item label="设置密码" class="form-item">
@@ -73,23 +74,23 @@
                   class="shuru"
                   placeholder="请再次输入您的密码"
                   type="password"
+                  v-model:value="userinfo.passtow"
                 />
               </a-form-item>
               <a-form-item label="姓名" class="form-item">
-                <a-input class="shuru" placeholder="请输入您的姓名" />
+                <a-input class="shuru" placeholder="请输入您的姓名" v-model:value="userinfo.name" />
               </a-form-item>
               <a-form-item label="邮箱" class="form-item">
-                <a-input class="shuru" placeholder="请输入您的邮箱" />
+                <a-input class="shuru" placeholder="请输入您的邮箱" v-model:value="userinfo.emil" />
               </a-form-item>
               <a-form-item label="母语" class="form-item">
-                <a-input class="shuru" placeholder="请输入您的母语" />
+                <a-input class="shuru" placeholder="请输入您的母语" v-model:value="userinfo.muyu" />
               </a-form-item>
               <a-form-item label="教授" class="form-item">
-                <a-select class="getcode" placeholder="请选择您的教授">
-                  <a-select-option value="Zhejiang">
-                    中国+0086
+                <a-select v-model:value="userinfo.jiaoshou" class="getcode" style="color: #111;" placeholder="请选择您的教授">
+                 <a-select-option v-for="(item, index) in willsay" :key="index" :value="item.languageid" >
+                      {{ item.name }}
                   </a-select-option>
-                  <a-select-option value="Jiangsu"> Jiangsu </a-select-option>
                 </a-select>
               </a-form-item>
             </div>
@@ -136,9 +137,10 @@
 </template>
 
 <script lang="ts">
-import { defineComponent, reactive, ref } from "vue";
+import { defineComponent, reactive, ref, toRaw } from "vue";
 import NavTop from "@/components/NavTop.vue";
-import { sendsms } from '@/api';
+import { checksmscode, getwillsay, register, sendsms } from '@/api';
+import { message } from 'ant-design-vue';
 
 export default defineComponent({
   name: "Sign",
@@ -149,12 +151,23 @@ export default defineComponent({
       wrapperCol: 14,
     };
     const time = ref(60); //倒计时初始化
-    const phone = reactive({
+    const phone = ref({
         quhao:"86",
         phone: "",
         code: ""
     });
-
+    const userinfo = ref({
+      pass: "",
+      passtow: "",
+      name: "",
+      emil: "",
+      muyu: "",
+      jiaoshou: ""
+    })
+    const willsay = ref<any>();
+    getwillsay().then((res) => {
+      willsay.value = res;
+    })
     /**
      * @param
      * 点击获取验证码  触发60S倒计时
@@ -163,10 +176,14 @@ export default defineComponent({
     const getcode: () => void = () => {
         console.log(11111);
         if (lock) {
-        return;
+          return;
+        }
+        if(phone.value.phone == ""){
+          message.error("手机号不能为空");
+          return ;
         }
         lock = true;
-        sendsms(phone.quhao + phone.phone, 0);
+        sendsms(phone.value.quhao + phone.value.phone, 0);
         const timestep = setInterval(() => {
         console.log(phone);
         time.value = time.value - 1;
@@ -190,13 +207,67 @@ export default defineComponent({
 
     const stepnow = ref(1); // 步骤条初始
 
+    function yanzheng(){
+      if(userinfo.value.pass == ""){
+        message.error("密码不能为空")
+        return false
+      }
+      if(userinfo.value.passtow == ""){
+        message.error("密码不能为空")
+        return false
+      }
+      if(userinfo.value.name == ""){
+        message.error("姓名不能为空")
+        return false
+      }
+      if(userinfo.value.emil == ""){
+        message.error("邮箱不能为空")
+        return false
+      }
+      if(userinfo.value.muyu == ""){
+        message.error("母语不能为空")
+        return false
+      }
+      if(userinfo.value.jiaoshou == ""){
+        message.error("请选择教授语言")
+        return false
+      }
+      return true;
+    }
     /**
      *@param  e 跳到哪一步
      * 步骤条跳到某一步
      */
-    const next: (e: number) => void = (e: number) => {
-      stepnow.value = e;
-    };
+
+    async function next (e: number) {
+       switch (e) {
+        case 2:{
+          console.log(e)
+          if(phone.value.phone == ""){
+            message.error("手机号不能为空")
+            return ;
+          }else if(phone.value.code == ""){
+            message.error("验证码不能为空")
+            return ;
+          }
+          const res =  await checksmscode(phone.value.quhao + phone.value.phone, phone.value.code);
+          if(res){
+            stepnow.value = e;
+          }
+          break;
+        }
+        case 3: {
+          console.log(userinfo.value)
+          const yz = yanzheng();
+          if(yz){
+            const res = await register({...toRaw(phone.value), ...toRaw(userinfo.value)});
+            if(res){
+              stepnow.value = e;
+            }
+          }
+        }
+      }
+    }
     return {
       formLayout,
       getcode,
@@ -205,7 +276,9 @@ export default defineComponent({
       ifagree,
       stepnow,
       next,
-      phone
+      phone,
+      userinfo,
+      willsay
     };
   },
 });