187 lines
6.8 KiB
Vue
187 lines
6.8 KiB
Vue
<template>
|
|
<div class="card">
|
|
<el-form ref="formRef" :model="form" label-width="120" label-position="left">
|
|
<el-row :gutter="gutter">
|
|
<el-col :span="span">
|
|
<el-form-item label="手机号">
|
|
<el-input v-model="form.phone" placeholder="请输入手机号" />
|
|
</el-form-item>
|
|
</el-col>
|
|
</el-row>
|
|
<div class="title_wrap">
|
|
<el-text>支付宝</el-text>
|
|
</div>
|
|
<el-row :gutter="gutter" class="mt15">
|
|
<el-col :span="span">
|
|
<el-form-item label="支付宝名称">
|
|
<el-input v-model="form.cashAccount.accountname" placeholder="请输入支付宝名称" />
|
|
</el-form-item>
|
|
</el-col>
|
|
<el-col :span="span">
|
|
<el-form-item label="支付宝账号">
|
|
<el-input v-model="form.cashAccount.accountno" placeholder="请输入支付宝账号" />
|
|
</el-form-item>
|
|
</el-col>
|
|
</el-row>
|
|
<div class="title_wrap">
|
|
<el-text>实名身份证</el-text>
|
|
</div>
|
|
<el-row :gutter="gutter" class="mt15">
|
|
<el-col :span="span">
|
|
<el-form-item label="实名类型">
|
|
<el-select style="width: 100%;" v-model="form.idCard.usertype" placeholder="请选择实名类型">
|
|
<el-option value="01" label="实名人" />
|
|
<el-option value="02" label="结算人" />
|
|
<el-option value="03" label="法人" />
|
|
</el-select>
|
|
</el-form-item>
|
|
</el-col>
|
|
<el-col :span="span">
|
|
<el-form-item label="证件类型">
|
|
<el-select style="width: 100%;" v-model="form.idCard.certtype" placeholder="请选择证件类型">
|
|
<el-option value="00" label="身份证" />
|
|
<el-option value="03" label="军人证" />
|
|
<el-option value="04" label="警察证" />
|
|
<el-option value="05" label="港澳居民往来内地通行证" />
|
|
<el-option value="06" label="台湾居民来往大陆通行证" />
|
|
<el-option value="07" label="护照" />
|
|
</el-select>
|
|
</el-form-item>
|
|
</el-col>
|
|
</el-row>
|
|
<el-row :gutter="gutter">
|
|
<el-col :span="span">
|
|
<el-form-item label="证件姓名">
|
|
<el-input v-model="form.idCard.certname" placeholder="请输入证件姓名" />
|
|
</el-form-item>
|
|
</el-col>
|
|
<el-col :span="span">
|
|
<el-form-item label="证件号">
|
|
<el-input v-model="form.idCard.certno" placeholder="请输入证件号" />
|
|
</el-form-item>
|
|
</el-col>
|
|
</el-row>
|
|
<el-row :gutter="gutter">
|
|
<el-col :span="span">
|
|
<el-form-item label="有效期开始时间">
|
|
<el-date-picker style="width: 100%;" value-format="YYYYMMDD" v-model="form.idCard.certstarttime" type="date"
|
|
placeholder="请选择有效期开始时间" />
|
|
</el-form-item>
|
|
</el-col>
|
|
<el-col :span="span">
|
|
<el-form-item label="有效期结束时间">
|
|
<el-date-picker style="width: 100%;" value-format="YYYYMMDD" v-model="form.idCard.certendtime" type="date"
|
|
placeholder="请选择有效期结束时间" />
|
|
</el-form-item>
|
|
</el-col>
|
|
</el-row>
|
|
<el-row :gutter="gutter">
|
|
<el-col :span="span">
|
|
<el-form-item label="人像面">
|
|
<uploadCard ref="idCardRef1" @selectFile="file => form.idCard.imgpositive = file"
|
|
@removeFile="form.idCard.imgpositive = ''" />
|
|
</el-form-item>
|
|
</el-col>
|
|
<el-col :span="span">
|
|
<el-form-item label="国徽面">
|
|
<uploadCard ref="idCardRef2" @selectFile="file => form.idCard.imgnegative = file"
|
|
@removeFile="form.idCard.imgnegative = ''" />
|
|
</el-form-item>
|
|
</el-col>
|
|
</el-row>
|
|
<el-form-item>
|
|
<el-button type="primary" @click="submitHandle">立即提交</el-button>
|
|
</el-form-item>
|
|
</el-form>
|
|
</div>
|
|
</template>
|
|
|
|
<script setup>
|
|
import { ElMessage } from 'element-plus'
|
|
import { uploadOSS } from '@/api/home.js'
|
|
import uploadCard from './components/uploadCard.vue'
|
|
|
|
import { agencyInfo, updateAgency } from '@/api/shop.js'
|
|
|
|
import { useRoute } from 'vue-router'
|
|
const route = useRoute()
|
|
|
|
const span = ref(10)
|
|
const gutter = ref(50)
|
|
|
|
const formRef = ref(null)
|
|
|
|
const idCardRef1 = ref(null)
|
|
const idCardRef2 = ref(null)
|
|
|
|
const form = reactive({
|
|
id: '',
|
|
phone: '',
|
|
cashAccount: {
|
|
id: '',
|
|
userid: '',
|
|
accountno: '',
|
|
accountname: '',
|
|
status: '',
|
|
createtime: ''
|
|
},
|
|
idCard: {
|
|
id: '',
|
|
userid: '',
|
|
usertype: '',
|
|
certtype: '',
|
|
certno: '',
|
|
certname: '',
|
|
certstarttime: '',
|
|
certendtime: '',
|
|
certaddress: '',
|
|
createtime: '',
|
|
updatetime: '',
|
|
imgpositive: '',
|
|
imgnegative: '',
|
|
virtypeflag: ''
|
|
}
|
|
})
|
|
|
|
// 提交表单
|
|
async function submitHandle() {
|
|
try {
|
|
if (form.idCard.imgpositive.uid) {
|
|
form.idCard.imgpositive = await uploadOSS(form.idCard.imgpositive.raw)
|
|
}
|
|
if (form.idCard.imgnegative.uid) {
|
|
form.idCard.imgnegative = await uploadOSS(form.idCard.imgnegative.raw)
|
|
}
|
|
await updateAgency(form)
|
|
ElMessage.success('提交成功')
|
|
} catch (error) {
|
|
console.log('提交表单===', error)
|
|
}
|
|
}
|
|
|
|
// 机构详情信息
|
|
async function agencyInfoAjax() {
|
|
try {
|
|
const res = await agencyInfo({
|
|
userId: route.query.id
|
|
})
|
|
form.id = res.userId
|
|
form.phone = res.phone
|
|
form.cashAccount = res.cashAccount
|
|
form.idCard = res.idCard
|
|
|
|
idCardRef1.value.pselectFile({ url: res.idCard.imgpositive })
|
|
idCardRef2.value.pselectFile({ url: res.idCard.imgnegative })
|
|
} catch (error) {
|
|
console.error('agencyInfoAjax===', error)
|
|
}
|
|
}
|
|
|
|
onMounted(() => {
|
|
agencyInfoAjax()
|
|
})
|
|
</script>
|
|
|
|
<style scoped lang="scss">
|
|
@import './components/common.scss';
|
|
</style> |