submit

2024-02-21 11:30:59 +08:00 · 2024-02-21 11:30:59 +08:00 · a321ece681
commit a321ece681
parent 1a731a61e1
6 changed files with 184 additions and 76 deletions
--- a/src/components/operateTitle/index.vue
+++ b/src/components/operateTitle/index.vue
@ -1,65 +1,72 @@
 <script setup>
-import { useRouter } from 'vue-router';
-import { useRoute } from 'vue-router';
+import {useRouter} from 'vue-router';
+import {useRoute} from 'vue-router';
 import {watch} from "vue";
+
 const router = useRouter();
-const goBack=()=>{
+const goBack = () => {
  router.go(-1)
 }
 const route = useRoute();
-watch(route,()=>{
-if (route.path.includes('title-forward/upload-id-card')){
-switch (route.params.active){
+watch(route, () => {
+  if (route.path.includes('title-forward/upload-id-card')) {
+    switch (route.params.active) {
      case '0':
-    route.meta.title='上传身份证照片'
+        route.meta.title = '上传身份证照片'
        break;
      case '1':
-    route.meta.title='添加近照'
+        route.meta.title = '添加近照'
        break;
      case '2':
-    route.meta.title='填写通讯录信息'
+        route.meta.title = '填写通讯录信息'
        break;
-  case '4':
+      case '3':
+        route.meta.title = '完成登记'
        break;

-}
-}
+    }
+  }
+}, {
+  immediate: true
 })
 </script>

 <template>
-<div class="container1">
-<div class="content1" @click="goBack">
+  <div class="container1">
+    <div class="content1" @click="goBack">
      <img src="@/assets/images/back@3x.png"/>
-</div>
-  <div class="content2">{{route.meta.title}}</div>
-</div>
+    </div>
+    <div class="content2">{{ route.meta.title }}</div>
+  </div>

 </template>

 <style scoped lang="scss">
-.container1{
+.container1 {
  background: #000;
  width: 375px;
  height: 44px;
  position: relative;
-  .content2{
+
+  .content2 {
    font-size: 14px;
    color: #fff;
    position: absolute;
    left: 50%;
    top: 50%;
-    transform: translate(-50%,-50%);
+    transform: translate(-50%, -50%);
  }
-.content1{
-  left:16px;
+
+  .content1 {
+    left: 16px;
    top: 50%;
    transform: translateY(-50%);
    position: absolute;
-  img{
+
+    img {
      width: 12px;
      height: 24px;
    }
-}
+  }
 }
 </style>
--- a/src/views/reg-details/index.vue
+++ b/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="wrap1">*身份证即将到期/已到期，请及时更换→→→</div>
+    <div class="content7" v-if="compareDate(submitReturnData.idCardEndDate)">
+      <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">
--- a/src/views/replace-id-card/index.vue
+++ b/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-left: 22px;
-  padding-right: 22px;
+  padding: 22px 22px 30px;

+  .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>
--- a/src/views/upload-id-card/content/one.vue
+++ b/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);
-  const isWithinThreeMonths = now.diff(targetDate, 'month') < 3;
-  return isEarlier && isWithinThreeMonths;
+
+  if (inputDate.isBefore(now)) {
+    return  '证件已到期，请尽快更新，否则将影响部分功能使用！';
+  } 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>
--- a/src/views/upload-id-card/content/two.vue
+++ b/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;
--- a/src/views/upload-id-card/index.vue
+++ b/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
  }