xingyy
/
sign-stream
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

submit

Browse Source
master
Phoenix 7 months ago
parent 1a731a61e1
commit a321ece681
6 changed files with 184 additions and 76 deletions
Show Stats Download Patch File Download Diff File

83
src/components/operateTitle/index.vue
Unescape Escape View File

@ -1,65 +1,72 @@
<script setup> <script setup>
import { useRouter } from 'vue-router'; import {useRouter} from 'vue-router';
import { useRoute } from 'vue-router'; import {useRoute} from 'vue-router';
import {watch} from "vue"; import {watch} from "vue";
const router = useRouter(); const router = useRouter();
const goBack=()=>{ const goBack = () => {
router.go(-1) router.go(-1)
} }
const route = useRoute(); const route = useRoute();
watch(route,()=>{ watch(route, () => {
if (route.path.includes('title-forward/upload-id-card')){ if (route.path.includes('title-forward/upload-id-card')) {
switch (route.params.active){ switch (route.params.active) {
case '0': case '0':
route.meta.title='上传身份证照片' route.meta.title = '上传身份证照片'
break; break;
case '1': case '1':
route.meta.title='添加近照' route.meta.title = '添加近照'
break; break;
case '2': case '2':
route.meta.title='填写通讯录信息' route.meta.title = '填写通讯录信息'
break; break;
case '4': case '3':
break; route.meta.title = '完成登记'
break;
} }
} }
}, {
immediate: true
}) })
</script> </script>
<template> <template>
<div class="container1"> <div class="container1">
<div class="content1" @click="goBack"> <div class="content1" @click="goBack">
<img src="@/assets/images/back@3x.png"/> <img src="@/assets/images/back@3x.png"/>
</div> </div>
<div class="content2">{{route.meta.title}}</div> <div class="content2">{{ route.meta.title }}</div>
</div> </div>
</template> </template>
<style scoped lang="scss"> <style scoped lang="scss">
.container1{ .container1 {
background: #000; background: #000;
width: 375px; width: 375px;
height: 44px; height: 44px;
position: relative; position: relative;
.content2{
.content2 {
font-size: 14px; font-size: 14px;
color: #fff; color: #fff;
position: absolute; position: absolute;
left: 50%; left: 50%;
top: 50%; top: 50%;
transform: translate(-50%,-50%); transform: translate(-50%, -50%);
} }
.content1{
left:16px; .content1 {
top: 50%; left: 16px;
transform: translateY(-50%); top: 50%;
position: absolute; transform: translateY(-50%);
img{ position: absolute;
width: 12px;
height: 24px; img {
width: 12px;
height: 24px;
}
} }
} }
}
</style> </style>

57
src/views/reg-details/index.vue
Unescape Escape View File

@ -1,16 +1,17 @@
<script setup> <script setup>
import { showImagePreview } from 'vant';
import {ref,computed} from "vue"; import {ref,computed} from "vue";
import {useUserStore} from '@/stores/userStore.js' import {useUserStore} from '@/stores/userStore.js'
import {storeToRefs} from "pinia"; import {storeToRefs} from "pinia";
import dayjs from "dayjs"; import dayjs from "dayjs";
import {showToast} from "vant"; 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 {areaList} from "@vant/area-data";
import { cloneDeep } from 'lodash'; import { cloneDeep } from 'lodash';
import {useRouter} from "vue-router"; import {useRouter} from "vue-router";
const router = useRouter(); const router = useRouter();
const userStore = useUserStore() const userStore = useUserStore()
const {submitReturnData,telNum,selectAddress,temSubmitReturnData} = storeToRefs(userStore); const {submitReturnData,telNum,iDCardImage,temSubmitReturnData,idCardInfo} = storeToRefs(userStore);
const btnStatus=ref(0) const btnStatus=ref(0)
const isCountingDown = ref(false); const isCountingDown = ref(false);
const countdownInterval = ref(null); const countdownInterval = ref(null);
@ -19,13 +20,13 @@ const timeLeft = ref(60);
const showBottom = ref(false) const showBottom = ref(false)
const sendCodeApi=async ()=>{ const sendCodeApi=async ()=>{
const data={ const data={
TelNum:telNum.value TelNum:submitReturnData.value.phoneNum
} }
const res=await send_code(data) const res=await send_code(data)
if (res.status===0){ if (res.status===0){
} }
} }
const rightClick=async ()=>{ const saveInfo=async ()=>{
const res=await save_register_info(submitReturnData.value) const res=await save_register_info(submitReturnData.value)
if (res.status===0){ if (res.status===0){
showToast({ 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=()=>{ const leftClick=()=>{
switch (btnStatus.value){ switch (btnStatus.value){
case 0: case 0:
@ -64,13 +75,20 @@ const afterRead = async (file) => {
submitReturnData.value.artistPhoto=res.data.ori_url 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) => { const confirmAddress = (data) => {
submitReturnData.value.address=JSON.stringify(data.selectedOptions) submitReturnData.value.address=JSON.stringify(data.selectedOptions)
showBottom.value = false showBottom.value = false
} }
const sendCode = async () => { const sendCode = async () => {
if (!isCountingDown.value){ if (!isCountingDown.value){
if(!/^1[3-9]\d{9}$/.test(telNum.value)){ if(!/^1[3-9]\d{9}$/.test(submitReturnData.value.phoneNum)){
showToast({ showToast({
message:'请输入合规的手机号码', message:'请输入合规的手机号码',
className:'particulars-detail-popup' className:'particulars-detail-popup'
@ -91,7 +109,26 @@ const sendCode = async () => {
} }
}, 1000); }, 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=()=>{ 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`) router.push(`/title-forward/replace-id-card`)
} }
</script> </script>
@ -104,13 +141,13 @@ const goRouter=()=>{
<div class="wrap1"> <div class="wrap1">
<div class="wrap1_1">身份证人像面</div> <div class="wrap1_1">身份证人像面</div>
<div class="wrap1_2"><img class="wrap1_2_1" :src="submitReturnData.idCardPhoto"> <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> </div>
<div class="wrap1"> <div class="wrap1">
<div class="wrap1_1">身份证国徽面</div> <div class="wrap1_1">身份证国徽面</div>
<div class="wrap1_2"><img class="wrap1_2_1" :src="submitReturnData.idCardBackPhoto"> <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> </div>
</div> </div>
@ -140,8 +177,8 @@ const goRouter=()=>{
</div> </div>
</div> </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 class="wrap2" @click="goRouter">更换身份证</div>
</div> </div>
<div class="content4"> <div class="content4">
@ -151,7 +188,7 @@ const goRouter=()=>{
<img :src="submitReturnData.artistPhoto" alt=""> <img :src="submitReturnData.artistPhoto" alt="">
</div> </div>
<div v-show="btnStatus===0" class="wrap2_2"> <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>
<div class="wrap2_3" v-show="btnStatus===1"> <div class="wrap2_3" v-show="btnStatus===1">
<van-uploader :afterRead="afterRead"> <van-uploader :afterRead="afterRead">

55
src/views/replace-id-card/index.vue
Unescape Escape View File

@ -1,5 +1,24 @@
<script setup> <script setup>
import one from '@/views/upload-id-card/content/one.vue' 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> </script>
<template> <template>
@ -8,16 +27,44 @@ import one from '@/views/upload-id-card/content/one.vue'
<one></one> <one></one>
</div> </div>
<div class="content2"> <div class="content2">
<div class="wrap1" @click="cancel">取消</div>
<div class="wrap2" @click="submitIdCard">提交</div>
</div> </div>
</div> </div>
</template> </template>
<style scoped lang="scss"> <style scoped lang="scss">
.container { .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> </style>

31
src/views/upload-id-card/content/one.vue
Unescape Escape View File

@ -24,12 +24,17 @@ const afterRead = async (file, num) => {
await cardFace(res.data.ori_url, num) await cardFace(res.data.ori_url, num)
} }
} }
const isWithinThreeMonths=(dateStr)=> { const compareDate=(givenDate)=> {
const inputDate = dayjs(givenDate);
const now = dayjs(); 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 cardFace = async (img, num) => {
const res = await scan_id_card({ const res = await scan_id_card({
@ -55,7 +60,7 @@ const cardFace = async (img, num) => {
<div class="wrap1_1_1"> <div class="wrap1_1_1">
<img :src="iDCardImage.front || defaultImage1" alt=""> <img :src="iDCardImage.front || defaultImage1" alt="">
</div> </div>
<div class="wrap1_1_2">更换</div> <div class="wrap1_1_2" v-if="iDCardImage.front">更换</div>
</div> </div>
<div class="wrap1_2">上传身份证人像面</div> <div class="wrap1_2">上传身份证人像面</div>
</div> </div>
@ -68,13 +73,13 @@ const cardFace = async (img, num) => {
<div class="wrap1_1_1"> <div class="wrap1_1_1">
<img :src="iDCardImage.back || defaultImage1" alt=""> <img :src="iDCardImage.back || defaultImage1" alt="">
</div> </div>
<div class="wrap1_1_2">更换</div> <div class="wrap1_1_2" v-if="iDCardImage.back">更换</div>
</div> </div>
<div class="wrap1_2">上传身份证国徽面</div> <div class="wrap1_2">上传身份证国徽面</div>
</div> </div>
</van-uploader> </van-uploader>
</div> </div>
<div class="content4"> <div class="content4" v-if="iDCardImage.front&&iDCardImage.back">
<div class="wrap1"> <div class="wrap1">
<div class="wrap1_1"> <div class="wrap1_1">
<div class="wrap1_1_1">姓名</div> <div class="wrap1_1_1">姓名</div>
@ -94,21 +99,15 @@ const cardFace = async (img, num) => {
<div class="wrap1_1_2">{{idCardInfo.iDNum}}</div> <div class="wrap1_1_2">{{idCardInfo.iDNum}}</div>
</div> </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">
<div class="wrap1_1"> <div class="wrap1_1">
<div class="wrap1_1_1">有效日期</div> <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>
</div> </div>
<div class="content5">*自动识别内容，请仔细核对</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> </div>

3
src/views/upload-id-card/content/two.vue
Unescape Escape View File

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

31
src/views/upload-id-card/index.vue
Unescape Escape View File

@ -29,6 +29,7 @@ const contentComputed = computed(() => {
} }
}) })
const submitClick =async () => { const submitClick =async () => {
const data={ const data={
artistName:idCardInfo.value.realName, artistName:idCardInfo.value.realName,
gender:idCardInfo.value.sex==='男'?1:2, gender:idCardInfo.value.sex==='男'?1:2,
@ -56,8 +57,10 @@ watch(active,()=>{
case 2: case 2:
buttons.value = [{label: "上一步", type: "back"}, {label: "提交", type: "submit"}] buttons.value = [{label: "上一步", type: "back"}, {label: "提交", type: "submit"}]
break break
case 3:
buttons.value = [{label: "完成", type: "finish"}]
break
} }
console.log(active.value,'active')
},{ },{
immediate:true immediate:true
}) })
@ -74,7 +77,6 @@ const stepsClick = (item) => {
active.value=1 active.value=1
router.replace(`/title-forward/upload-id-card/${1}`) router.replace(`/title-forward/upload-id-card/${1}`)
buttons.value = [{label: "上一步", type: "back"}, {label: "下一步", type: "next"}]
break break
case 1: case 1:
if (item.type === 'next') { if (item.type === 'next') {
@ -87,27 +89,42 @@ const stepsClick = (item) => {
} }
active.value=2 active.value=2
router.replace(`/title-forward/upload-id-card/${2}`) router.replace(`/title-forward/upload-id-card/${2}`)
buttons.value = [{label: "上一步", type: "back"}, {label: "提交", type: "submit"}]
} else if (item.type === 'back') { } else if (item.type === 'back') {
active.value=0 active.value=0
router.replace(`/title-forward/upload-id-card/${0}`) router.replace(`/title-forward/upload-id-card/${0}`)
buttons.value = [{label: "下一步", type: "next"}]
} }
break break
case 2: case 2:
if (item.type === 'next') { if (item.type === 'next') {
active.value=3 active.value=3
router.replace(`/title-forward/upload-id-card/${3}`) router.replace(`/title-forward/upload-id-card/${3}`)
buttons.value = [{label: "上一步", type: "back"}, {label: "提交", type: "submit"}]
} else if (item.type === 'back') { } else if (item.type === 'back') {
active.value=1 active.value=1
router.replace(`/title-forward/upload-id-card/${1}`) router.replace(`/title-forward/upload-id-card/${1}`)
buttons.value = [{label: "上一步", type: "back"}, {label: "下一步", type: "next"}]
}else if (item.type === 'submit'){ }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() submitClick()
active.value=3 active.value=3
router.replace(`/title-forward/upload-id-card/${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 break
} }

Write Preview
Loading…
Cancel
Save