289 lines
6.4 KiB
Vue
289 lines
6.4 KiB
Vue
<template>
|
||
<view>
|
||
<view class="u-font-32 font-bold u-m-32 text-center">法人信息</view>
|
||
<view class="container">
|
||
|
||
|
||
|
||
|
||
<view class="form-item required">
|
||
<view class="title"> 身份证正面（国徽）</view>
|
||
<my-upload-img v-model="form.idCardFrontPic.url" :size="200" :maxSize="maxSize"
|
||
@uploadSuccess="uploadSuccess($event,'IdCard','idCardFrontPic')"
|
||
></my-upload-img>
|
||
</view>
|
||
<view class="form-item required">
|
||
<view class="title"> 身份证反面（人像）</view>
|
||
<my-upload-img v-model="form.idCardBackPic.url" :size="200" :maxSize="maxSize"
|
||
@uploadSuccess="uploadSuccess($event,'IdCard','idCardBackPic')"
|
||
></my-upload-img>
|
||
</view>
|
||
|
||
<view class="form-item required">
|
||
<view class="title"> 身份证手持 图片</view>
|
||
<my-upload-img v-model="form.idCardHandPic.url" :size="200" :maxSize="maxSize"></my-upload-img>
|
||
</view>
|
||
|
||
|
||
<view class="form-item required">
|
||
<view class="title"> 法人姓名</view>
|
||
<up-input placeholder="法人姓名" :placeholder-class="placeholderClass"
|
||
v-model="form.legalPersonName"></up-input>
|
||
</view>
|
||
<view class="form-item required">
|
||
<view class="title">法人性别</view>
|
||
<up-radio-group v-model="form.legalGender">
|
||
<up-radio v-for="(value,key) in sexs" :label="value" :name="key">
|
||
</up-radio>
|
||
</up-radio-group>
|
||
</view>
|
||
|
||
|
||
<view class="form-item required">
|
||
<view class="title"> 法人身份证号</view>
|
||
<up-input placeholder="法人身份证号" :placeholder-class="placeholderClass"
|
||
v-model="form.legalPersonId"></up-input>
|
||
</view>
|
||
<view class="form-item required">
|
||
<view class="title"> 法人身份证开始日期</view>
|
||
|
||
<up-datetime-picker hasInput :minDate="minDate" :maxDate="dayjs().valueOf()" format="YYYY-MM-DD"
|
||
placeholder="请选择" v-model="form.legalIdPersonStartDate" mode="date">
|
||
</up-datetime-picker>
|
||
|
||
|
||
|
||
</view>
|
||
|
||
<view class="form-item required">
|
||
<view class="title"> 法人身份证到期日期</view>
|
||
|
||
<view class="u-m-b-16">
|
||
<up-radio-group v-model="endDateType">
|
||
<up-radio :name="1" label="有结束日期"></up-radio>
|
||
<up-radio :name="2" label="长期有效"></up-radio>
|
||
</up-radio-group>
|
||
</view>
|
||
<template v-if="endDateType==1">
|
||
<up-datetime-picker hasInput :minDate="endDataMinDate"
|
||
:maxDate="maxDate" format="YYYY-MM-DD" placeholder="请选择"
|
||
v-model="form.legalPersonIdEndDate" mode="date">
|
||
</up-datetime-picker>
|
||
</template>
|
||
|
||
</view>
|
||
|
||
<view class="form-item required">
|
||
<view class="title"> 法人电话</view>
|
||
<up-input placeholder="法人电话" :placeholder-class="placeholderClass"
|
||
v-model="form.legalPersonPhone"></up-input>
|
||
</view>
|
||
|
||
<view class="form-item required">
|
||
<view class="title">法人地址 </view>
|
||
<up-input placeholder="法人地址" :placeholder-class="placeholderClass"
|
||
v-model="form.legalAddress"></up-input>
|
||
</view>
|
||
|
||
<view class="form-item required">
|
||
<view class="title">法人邮箱 </view>
|
||
<up-input placeholder="法人邮箱" :placeholder-class="placeholderClass"
|
||
v-model="form.legalPersonEmail"></up-input>
|
||
</view>
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
</view>
|
||
</view>
|
||
|
||
</template>
|
||
|
||
<script setup>
|
||
import {
|
||
reactive,
|
||
watch,computed ,
|
||
ref
|
||
} from 'vue';
|
||
import shopSelect from './shop-select.vue'
|
||
import {
|
||
userTypes,
|
||
sexs,
|
||
contactPersonTypes,
|
||
companyChildTypes,
|
||
certTypes
|
||
} from '@/entryManager/data.js'
|
||
const form = reactive({
|
||
"legalPersonName": "",
|
||
"legalPersonId": "",
|
||
"legalIdPersonStartDate":'',
|
||
"legalPersonIdEndDate": '',
|
||
"legalPersonPhone": "",
|
||
"legalPersonEmail": "",
|
||
"legalGender": "",
|
||
"legalAddress": "",
|
||
"idCardHandPic": {
|
||
"url": "",
|
||
"wechatId": "",
|
||
"alipayId": ""
|
||
},
|
||
"idCardFrontPic": {
|
||
"url": "",
|
||
"wechatId": "",
|
||
"alipayId": ""
|
||
},
|
||
"idCardBackPic": {
|
||
"url": "",
|
||
"wechatId": "",
|
||
"alipayId": ""
|
||
}
|
||
})
|
||
|
||
|
||
|
||
import {
|
||
getInfoByImg
|
||
} from '@/http/api/order/entryManager.js'
|
||
|
||
|
||
import dayjs from 'dayjs';
|
||
import { includes } from 'lodash';
|
||
const minDate = dayjs('1970-01-01 00:00:00').valueOf()
|
||
const maxDate = dayjs('2099-12-31 23:59:59').valueOf()
|
||
const endDataMinDate = computed(() => {
|
||
if (!form.legalIdPersonStartDate) {
|
||
return maxDate
|
||
}
|
||
if (form.legalIdPersonStartDate) {
|
||
return dayjs(form.legalIdPersonStartDate).add(10, 'year').valueOf()
|
||
}
|
||
})
|
||
|
||
const endDateType = ref(1)
|
||
watch(() => endDateType.value, (newval) => {
|
||
if (newval == 2) {
|
||
form.legalPersonIdEndDate = maxDate
|
||
} else {
|
||
form.legalPersonIdEndDate = dayjs().valueOf()
|
||
}
|
||
})
|
||
|
||
|
||
|
||
|
||
|
||
function uploadSuccess(url, type, key) {
|
||
uni.showLoading({
|
||
type: '识别中，请稍等……！'
|
||
})
|
||
getInfoByImg({
|
||
url,
|
||
type
|
||
}).then(res => {
|
||
uni.hideLoading()
|
||
if (res) {
|
||
const data = res.subImages[0].kvInfo.data
|
||
if (key == 'idCardFrontPic') {
|
||
if (data.validPeriod) {
|
||
const [start, end] = data.validPeriod.split('-')
|
||
if (start) {
|
||
form.legalIdPersonStartDate = dayjs(start).valueOf()
|
||
}
|
||
if (end) {
|
||
if (end.includes('长期')) {
|
||
endDateType.value = 2
|
||
} else {
|
||
form.legalPersonIdEndDate = dayjs(end).valueOf()
|
||
}
|
||
|
||
}
|
||
}
|
||
}
|
||
if (key == 'idCardBackPic') {
|
||
form.legalPersonName = data.name
|
||
form.legalPersonId = data.idNumber
|
||
form.legalAddress = data.address
|
||
if(data.sex.includes('男')){
|
||
form.legalGender='0'
|
||
}
|
||
if(data.sex.includes('女')){
|
||
form.legalGender='1'
|
||
}
|
||
|
||
}
|
||
}
|
||
})
|
||
}
|
||
|
||
const placeholderClass = ref('u-font-28')
|
||
|
||
|
||
const props = defineProps({
|
||
data: {
|
||
type: Object,
|
||
default: () => {
|
||
|
||
}
|
||
},
|
||
maxSize:{
|
||
|
||
}
|
||
})
|
||
|
||
|
||
watch(() => props.data, (newval) => {
|
||
for (let key in form) {
|
||
if (props.data.hasOwnProperty(key)) {
|
||
form[key] = props.data[key]
|
||
}
|
||
}
|
||
}, {
|
||
deep: true,
|
||
immediate: true
|
||
})
|
||
|
||
const emits = defineEmits(['update'])
|
||
watch(() => form, (newval) => {
|
||
emits('update', newval)
|
||
}, {
|
||
deep: true
|
||
})
|
||
|
||
watch(()=>form.legalPersonIdEndDate,(newval)=>{
|
||
if(dayjs(newval).format('YYYY-MM-DD')==='2099-12-31'){
|
||
endDateType.value=2
|
||
}
|
||
})
|
||
</script>
|
||
|
||
<style lang="scss">
|
||
.container {
|
||
padding: 32rpx 28rpx;
|
||
border-radius: 16rpx;
|
||
margin-bottom: 32rpx;
|
||
background-color: #fff;
|
||
}
|
||
|
||
.form-item {
|
||
margin-bottom: 32rpx;
|
||
|
||
.title {
|
||
font-weight: 700;
|
||
margin-bottom: 16rpx;
|
||
}
|
||
|
||
&.required {
|
||
.title::before {
|
||
content: '*';
|
||
color: red;
|
||
}
|
||
}
|
||
|
||
&:last-child {
|
||
margin-bottom: 0;
|
||
}
|
||
}
|
||
</style> |