submit

src/components/operateTitle/index.vue

@@ -2,6 +2,7 @@
 import {useRouter} from 'vue-router';
 import {useRoute} from 'vue-router';
 import {watch} from "vue";
+
 const router = useRouter();
 const goBack = () => {
   router.go(-1)
@@ -19,11 +20,14 @@ switch (route.params.active){
       case '2':
         route.meta.title = '填写通讯录信息'
         break;
-  case '4':
+      case '3':
+        route.meta.title = '完成登记'
         break;
 
     }
   }
+}, {
+  immediate: true
 })
 </script>
 
@@ -43,6 +47,7 @@ switch (route.params.active){
   width: 375px;
   height: 44px;
   position: relative;
+
   .content2 {
     font-size: 14px;
     color: #fff;
@@ -51,11 +56,13 @@ switch (route.params.active){
     top: 50%;
     transform: translate(-50%, -50%);
   }
+
   .content1 {
     left: 16px;
     top: 50%;
     transform: translateY(-50%);
     position: absolute;
+
     img {
       width: 12px;
       height: 24px;

src/views/reg-details/index.vue

@@ -1,16 +1,17 @@
 <script setup>
+import { showImagePreview } from 'vant';
 import {ref,computed} from "vue";
 import {useUserStore} from '@/stores/userStore.js'
 import {storeToRefs} from "pinia";
 import dayjs from "dayjs";
 import {showToast} from "vant";
-import {save_register_info, send_code, upload_img} from "@/apis/index.js";
+import {check_code, save_register_info, send_code, upload_img} from "@/apis/index.js";
 import {areaList} from "@vant/area-data";
 import { cloneDeep } from 'lodash';
 import {useRouter} from "vue-router";
 const router = useRouter();
 const userStore = useUserStore()
-const {submitReturnData,telNum,selectAddress,temSubmitReturnData} = storeToRefs(userStore);
+const {submitReturnData,telNum,iDCardImage,temSubmitReturnData,idCardInfo} = storeToRefs(userStore);
 const btnStatus=ref(0)
 const isCountingDown = ref(false);
 const countdownInterval = ref(null);
@@ -19,13 +20,13 @@ const timeLeft = ref(60);
 const showBottom = ref(false)
 const sendCodeApi=async ()=>{
   const data={
-    TelNum:telNum.value
+    TelNum:submitReturnData.value.phoneNum
   }
   const res=await send_code(data)
   if (res.status===0){
   }
 }
-const rightClick=async ()=>{
+const saveInfo=async ()=>{
   const res=await save_register_info(submitReturnData.value)
   if (res.status===0){
     showToast({
@@ -34,6 +35,16 @@ const rightClick=async ()=>{
     });
   }
 }
+const rightClick=async ()=>{
+  const data={
+    telNum:submitReturnData.value.phoneNum,
+    code:code.value
+  }
+  const res=await check_code(data)
+  if (res.status===0){
+    saveInfo()
+  }
+}
 const leftClick=()=>{
   switch (btnStatus.value){
     case 0:
@@ -64,13 +75,20 @@ const afterRead = async (file) => {
     submitReturnData.value.artistPhoto=res.data.ori_url
   }
 }
+const isWithinThreeMonths=(dateStr)=> {
+  const now = dayjs();
+  const targetDate = dayjs(dateStr);
+  const isEarlier = targetDate.isBefore(now);
+  const isWithinThreeMonths = now.diff(targetDate, 'month') < 3;
+  return isEarlier && isWithinThreeMonths;
+}
 const confirmAddress = (data) => {
   submitReturnData.value.address=JSON.stringify(data.selectedOptions)
   showBottom.value = false
 }
 const sendCode = async () => {
   if (!isCountingDown.value){
-    if(!/^1[3-9]\d{9}$/.test(telNum.value)){
+    if(!/^1[3-9]\d{9}$/.test(submitReturnData.value.phoneNum)){
       showToast({
         message:'请输入合规的手机号码',
         className:'particulars-detail-popup'
@@ -91,7 +109,26 @@ const sendCode = async () => {
     }
   }, 1000);
 };
+const compareDate=(givenDate)=> {
+  const inputDate = dayjs(givenDate);
+  const now = dayjs();
+
+  if (inputDate.isBefore(now)) {
+    return  '*身份证已到期，请及时更换→→→';
+  } else if (inputDate.isBefore(now.add(3, 'month'))) {
+    return  '*身份证即将到期，请及时更换→→→';
+  } else {
+    return ''
+  }
+}
 const goRouter=()=>{
+  idCardInfo.value.realName=submitReturnData.value.artistName
+  idCardInfo.value.sex=submitReturnData.value.gender===1?'男':'女'
+  idCardInfo.value.iDNum=submitReturnData.value.idCard
+  idCardInfo.value.issueDate=submitReturnData.value.idCardStartDate
+  idCardInfo.value.expirationDate=submitReturnData.value.idCardEndDate
+  iDCardImage.value.front=submitReturnData.value.idCardPhoto
+  iDCardImage.value.back=submitReturnData.value.idCardBackPhoto
   router.push(`/title-forward/replace-id-card`)
 }
 </script>
@@ -104,13 +141,13 @@ const goRouter=()=>{
       <div class="wrap1">
         <div class="wrap1_1">身份证人像面</div>
         <div class="wrap1_2"><img class="wrap1_2_1" :src="submitReturnData.idCardPhoto">
-          <img class="wrap1_2_2" src="@/assets/images/zu1179@2x.png" alt="">
+          <img class="wrap1_2_2" @click="showImagePreview([submitReturnData.idCardPhoto])" src="@/assets/images/zu1179@2x.png" alt="">
         </div>
       </div>
       <div class="wrap1">
         <div class="wrap1_1">身份证国徽面</div>
         <div class="wrap1_2"><img class="wrap1_2_1" :src="submitReturnData.idCardBackPhoto">
-          <img class="wrap1_2_2" src="@/assets/images/zu1179@2x.png" alt="">
+          <img class="wrap1_2_2" @click="showImagePreview([submitReturnData.idCardBackPhoto])" src="@/assets/images/zu1179@2x.png" alt="">
         </div>
       </div>
     </div>
@@ -140,8 +177,8 @@ const goRouter=()=>{
         </div>
       </div>
     </div>
-    <div class="content7">
+    <div class="content7" v-if="compareDate(submitReturnData.idCardEndDate)">
-      <div class="wrap1">*身份证即将到期/已到期，请及时更换→→→</div>
+      <div class="wrap1">{{compareDate(submitReturnData.idCardEndDate)}}</div>
       <div class="wrap2" @click="goRouter">更换身份证</div>
     </div>
     <div class="content4">
@@ -151,7 +188,7 @@ const goRouter=()=>{
           <img :src="submitReturnData.artistPhoto" alt="">
         </div>
         <div v-show="btnStatus===0" class="wrap2_2">
-          <img src="@/assets/images/zu1181@2x.png" alt="">
+          <img src="@/assets/images/zu1181@2x.png" @click="showImagePreview([submitReturnData.artistPhoto])" alt="">
         </div>
         <div  class="wrap2_3" v-show="btnStatus===1">
           <van-uploader :afterRead="afterRead">

src/views/replace-id-card/index.vue

@@ -1,5 +1,24 @@
 <script setup>
 import one from '@/views/upload-id-card/content/one.vue'
+import {useUserStore} from "@/stores/userStore.js";
+import {storeToRefs} from "pinia";
+import router from "@/router/index.js";
+
+const userStore = useUserStore()
+const {submitReturnData, iDCardImage, idCardInfo} = storeToRefs(userStore);
+const cancel=()=>{
+  router.back()
+}
+const submitIdCard = () => {
+  submitReturnData.value.artistName = idCardInfo.value.realName
+  submitReturnData.value.gender = idCardInfo.value.sex === '男' ? 1 : 2
+  submitReturnData.value.idCard = idCardInfo.value.iDNum
+  submitReturnData.value.idCardStartDate = idCardInfo.value.issueDate
+  submitReturnData.value.idCardEndDate = idCardInfo.value.expirationDate
+  submitReturnData.value.idCardPhoto = iDCardImage.value.front
+  submitReturnData.value.idCardBackPhoto = iDCardImage.value.back
+  router.back()
+}
 </script>
 
 <template>
@@ -8,16 +27,44 @@ import one from '@/views/upload-id-card/content/one.vue'
       <one></one>
     </div>
     <div class="content2">
-
+      <div class="wrap1" @click="cancel">取消</div>
+      <div class="wrap2" @click="submitIdCard">提交</div>
     </div>
   </div>
 </template>
 
 <style scoped lang="scss">
 .container {
-  padding-top: 22px;
+  padding: 22px 22px 30px;
-  padding-left: 22px;
-  padding-right: 22px;
 
+  .content2 {
+    margin-top: 42px;
+    display: flex;
+
+    .wrap2 {
+      margin-left: auto;
+      width: 200px;
+      height: 30px;
+      border-radius: 15px;
+      display: flex;
+      justify-content: center;
+      align-items: center;
+      color: #fff;
+      font-size: 14px;
+      background-color: #2159C4;
+    }
+
+    .wrap1 {
+      border-radius: 15px;
+      width: 116px;
+      height: 30px;
+      display: flex;
+      justify-content: center;
+      align-items: center;
+      font-size: 14px;
+      color: #fff;
+      background-color: #5A5A5A;
+    }
+  }
 }
 </style>

src/views/upload-id-card/content/one.vue

@@ -24,12 +24,17 @@ const afterRead = async (file, num) => {
     await cardFace(res.data.ori_url, num)
   }
 }
-const isWithinThreeMonths=(dateStr)=> {
+const compareDate=(givenDate)=> {
+  const inputDate = dayjs(givenDate);
   const now = dayjs();
-  const targetDate = dayjs(dateStr);
+
-  const isEarlier = targetDate.isBefore(now);
+  if (inputDate.isBefore(now)) {
-  const isWithinThreeMonths = now.diff(targetDate, 'month') < 3;
+    return  '证件已到期，请尽快更新，否则将影响部分功能使用！';
-  return isEarlier && isWithinThreeMonths;
+  } else if (inputDate.isBefore(now.add(3, 'month'))) {
+    return  '证件即将到期，请尽快更新，否则将影响部分功能使用！';
+  } else {
+    return ''
+  }
 }
 const cardFace = async (img, num) => {
   const res = await scan_id_card({
@@ -55,7 +60,7 @@ const cardFace = async (img, num) => {
             <div class="wrap1_1_1">
               <img :src="iDCardImage.front || defaultImage1" alt="">
             </div>
-            <div class="wrap1_1_2">更换</div>
+            <div class="wrap1_1_2" v-if="iDCardImage.front">更换</div>
           </div>
           <div class="wrap1_2">上传身份证人像面</div>
         </div>
@@ -68,13 +73,13 @@ const cardFace = async (img, num) => {
             <div class="wrap1_1_1">
               <img :src="iDCardImage.back || defaultImage1" alt="">
             </div>
-            <div class="wrap1_1_2">更换</div>
+            <div class="wrap1_1_2" v-if="iDCardImage.back">更换</div>
           </div>
           <div class="wrap1_2">上传身份证国徽面</div>
         </div>
       </van-uploader>
     </div>
-  <div class="content4">
+  <div class="content4" v-if="iDCardImage.front&&iDCardImage.back">
     <div class="wrap1">
       <div class="wrap1_1">
         <div class="wrap1_1_1">姓名</div>
@@ -94,21 +99,15 @@ const cardFace = async (img, num) => {
         <div class="wrap1_1_2">{{idCardInfo.iDNum}}</div>
       </div>
     </div>
-    <div class="wrap1">
-      <div class="wrap1_1">
-        <div class="wrap1_1_1">身份证地址</div>
-        <div class="wrap1_1_2">{{idCardInfo.path}}</div>
-      </div>
-    </div>
     <div class="wrap1">
       <div class="wrap1_1">
         <div class="wrap1_1_1">有效日期</div>
-        <div class="wrap1_1_2">{{dayjs(idCardInfo.issueDate).format('YYYY年MM月DD日')}}-{{dayjs(idCardInfo.expirationDate).format('YYYY年MM月DD日')}}</div>
+        <div class="wrap1_1_2">{{idCardInfo.issueDate?dayjs(idCardInfo.issueDate).format('YYYY年MM月DD日'):''}}-{{idCardInfo.expirationDate?dayjs(idCardInfo.expirationDate).format('YYYY年MM月DD日'):''}}</div>
       </div>
     </div>
   </div>
   <div class="content5">*自动识别内容，请仔细核对</div>
-  <div class="content6"  v-if="isWithinThreeMonths(idCardInfo.expirationDate)">证件即将过期，请尽快更新，否则将影响部分功能使用！</div>
+  <div class="content6"  v-if="iDCardImage.front&&iDCardImage.back&&compareDate(idCardInfo.expirationDate)">{{compareDate(idCardInfo.expirationDate)}}</div>
 
 
   </div>

src/views/upload-id-card/content/two.vue

@@ -29,7 +29,7 @@ const afterRead = async (file) => {
           <div v-show="recentPhoto" class="wrap1_2">
             <img  class="wrap1_2_1"  :src="recentPhoto">
           </div>
-          <div class="wrap1_3">更换</div>
+          <div class="wrap1_3" v-show="recentPhoto">更换</div>
         </div>
         <div class="wrap2">上传近照</div>
       </div>
@@ -67,6 +67,7 @@ const afterRead = async (file) => {
     font-size: 10px;
   }
   .wrap1 {
+    overflow: hidden;
     width: 100%;
     height: 100%;
     box-sizing: border-box;

src/views/upload-id-card/index.vue

@@ -29,6 +29,7 @@ const contentComputed = computed(() => {
   }
 })
 const submitClick =async () => {
+
   const data={
     artistName:idCardInfo.value.realName,
     gender:idCardInfo.value.sex==='男'?1:2,
@@ -56,8 +57,10 @@ watch(active,()=>{
     case 2:
       buttons.value = [{label: "上一步", type: "back"}, {label: "提交", type: "submit"}]
       break
+    case 3:
+      buttons.value = [{label: "完成", type: "finish"}]
+      break
   }
-  console.log(active.value,'active')
 },{
   immediate:true
 })
@@ -74,7 +77,6 @@ const stepsClick = (item) => {
 
       active.value=1
       router.replace(`/title-forward/upload-id-card/${1}`)
-      buttons.value = [{label: "上一步", type: "back"}, {label: "下一步", type: "next"}]
       break
     case 1:
       if (item.type === 'next') {
@@ -87,27 +89,42 @@ const stepsClick = (item) => {
         }
         active.value=2
         router.replace(`/title-forward/upload-id-card/${2}`)
-        buttons.value = [{label: "上一步", type: "back"}, {label: "提交", type: "submit"}]
       } else if (item.type === 'back') {
         active.value=0
         router.replace(`/title-forward/upload-id-card/${0}`)
-        buttons.value = [{label: "下一步", type: "next"}]
       }
       break
     case 2:
       if (item.type === 'next') {
         active.value=3
         router.replace(`/title-forward/upload-id-card/${3}`)
-        buttons.value = [{label: "上一步", type: "back"}, {label: "提交", type: "submit"}]
       } else if (item.type === 'back') {
         active.value=1
         router.replace(`/title-forward/upload-id-card/${1}`)
-        buttons.value = [{label: "上一步", type: "back"}, {label: "下一步", type: "next"}]
+
       }else if (item.type === 'submit'){
+        if (selectAddress.value?.selectedOptions?.length<3 || !selectAddress.value?.selectedOptions){
+          showToast({
+            message:'请选择通讯地址',
+            className:'particulars-detail-popup'
+          });
+          return
+        }
+        if (!detailAddress.value){
+          showToast({
+            message:'请输入详细地址',
+            className:'particulars-detail-popup'
+          });
+          return
+        }
         submitClick()
         active.value=3
         router.replace(`/title-forward/upload-id-card/${3}`)
-        buttons.value = [{label: "完成", type: "finish"}]
+      }
+      break
+    case 3:
+      if (item.type === 'finish') {
+        router.push('/title-forward/reg-details')
       }
       break
   }