feat(xumu): 完善认证材料页面并优化相关功能

- 新增认证材料页面,支持查看和审核用户提交的认证信息- 优化 axios 配置,修复 URL 替换逻辑
- 更新表格操作按钮,根据认证状态显示不同选项
- 重构页面布局组件,增加返回按钮和内容字符串属性
This commit is contained in:
aixianling
2024-12-19 18:04:12 +08:00
parent 4c72bd2ac9
commit 045449331f
5 changed files with 102 additions and 27 deletions

View File

@@ -11,7 +11,7 @@ instance.interceptors.request.use(config => {
config.url = "/ns" + config.url
}
if (process.env.VUE_APP_IS_SIMPLE_SERVER == 1) {
config.url = config.url.replace(/\/(app|auth|admin)\//, "/api/")
config.url = config.url.replace(/^\/(app|auth|admin)\//, "/api/")
if (['xumu'].includes(process.env.VUE_APP_SCOPE)) {
config.url = config.url.replace("/api/", "/")
}

View File

@@ -1,13 +1,59 @@
<script>
import AiUploader from "dui/packages/basic/AiUploader.vue";
const certificates = [
{label: "身份证(正面)", prop: "frontCard"},
{label: "身份证(反面)", prop: "reverseCard"},
{label: "营业执照", prop: "businessPic", permit: ["breed"]},
{label: "畜禽经营许可证", prop: "breedPic", permit: ["breed"]},
{label: "动物防疫条件许可证", prop: "prevention", permit: ["breed"]},
{label: "组织机构证明", prop: "orgPic", permit: ["bank", "insurance"]},
]
export default {
name: "authAdd"
name: "authAdd",
components: {AiUploader},
props: {
instance: Function,
permissions: Function
},
data() {
return {
certificates,
detail: {},
}
},
methods: {
getDetail() {
const {id} = this.$route.query
this.instance.post("/user/auth/page", null, {params: {id}}).then(res => {
if (res?.data) {
this.detail = res.data|| {}
}
})
},
getNeedCerts(type) {
return certificates.filter(e => !e.permit || e.permit.includes(type))
},
},
created() {
this.getDetail()
}
}
</script>
<template>
<section class="authAdd">
</section>
<ai-page title="认证材料" class="authAdd" showBack content-string="detail">
<el-form size="small">
<ai-card title="认证材料">
<div class="grid">
<el-form-item v-for="(op,i) in getNeedCerts(detail.type)" :key="i" v-bind="op" :rules="{required:true,message:`请上传${op.label}`,trigger:'change'}">
<el-image v-model="detail[op.prop]" :preview-src-list="[detail[op.prop]]"/>
</el-form-item>
</div>
</ai-card>
<ai-card title="审核意见"></ai-card>
</el-form>
</ai-page>
</template>
<style scoped lang="scss">

View File

@@ -1,5 +1,4 @@
<script>
import AiUploader from "dui/packages/basic/AiUploader.vue";
const columns = [
{label: "序号", type: "index"},
@@ -13,14 +12,13 @@ const columns = [
const certificates = [
{label: "身份证(正面)", prop: "frontCard"},
{label: "身份证(反面)", prop: "reverseCard"},
{label: "营业执照", prop: "businessPic", permit: []},
{label: "畜禽经营许可证", prop: "breedPic", permit: []},
{label: "动物防疫条件许可证", prop: "prevention", permit: []},
{label: "组织机构证明", prop: "orgPic", permit: []},
{label: "营业执照", prop: "businessPic", permit: ["breed"]},
{label: "畜禽经营许可证", prop: "breedPic", permit: ["breed"]},
{label: "动物防疫条件许可证", prop: "prevention", permit: ["breed"]},
{label: "组织机构证明", prop: "orgPic", permit: ["bank", "insurance"]},
]
export default {
name: "authList",
components: {AiUploader},
props: {
instance: Function,
dict: Object,
@@ -42,13 +40,24 @@ export default {
params: {...this.page, ...this.search}
}).then(res => {
if (res?.data) {
this.tableData = res.data?.records
this.tableData = res.data?.records.map(e => ({...e, permit: `${e.authStatus}` + e.auditStatus}))
this.page.total = res.data.total
}
})
},
getNeedCerts(type) {
return certificates.filter(e => !e.permit || e.permit.includes(type))
},
handleConfirm() {
this.$refs.form.validate().then(() => {
this.instance.post("/user/auth/update", this.form).then(res => {
if (res?.code == '0' && res?.data != 1) {
this.dialog = false
this.$message.success("提交成功!")
this.getTableData()
}
})
})
}
},
created() {
@@ -74,19 +83,26 @@ export default {
<el-table-column slot="options" label="操作" fixed="right" align="center">
<template slot-scope="{row}">
<div class="table-options">
<el-button type="text" @click="dialog=true,form=row">查看</el-button>
<el-button type="text" @click="$router.push({query:{id:row.id},hash:'#add'})">认证材料</el-button>
<el-button type="text" v-if="'12'.includes(row.permit)"
@click="$router.push({query:{id:row.id},hash:'#add'})">查看
</el-button>
<el-button class="deleteBtn" type="text" v-if="'11'.includes(row.permit)"
@click="$router.push({query:{id:row.id},hash:'#add'})">审核
</el-button>
<el-button type="text" v-if="'00|13'.includes(row.permit)"
@click="dialog=true,form=row">认证材料
</el-button>
</div>
</template>
</el-table-column>
</ai-table>
<ai-dialog v-model="dialog" title="认证材料" width="60%" @close="form=[]">
<ai-dialog v-model="dialog" title="认证材料" width="60%" @close="form=[]" @confirm="handleConfirm">
<el-form class="grid c-3" :model="form" ref="form" label-width="160px">
<el-form-item v-for="(op,i) in getNeedCerts(form.type)" :key="i" v-bind="op" :rules="{required:true,message:`请上传${op.label}`,trigger:'change'}">
<ai-uploader v-model="form[op.prop]" valueIsUrl :limit="1"/>
</el-form-item>
<el-form-item class="row" label="备注说明" prop="orgPic" :rules="{required:true,message:'请上传身份证(正面)',trigger:'change'}">
<el-input type="textarea" :rows="3" v-model="form.remark"/>
<el-form-item class="row" label="备注说明" prop="remark">
<el-input type="textarea" :rows="2" v-model="form.remark" placeholder="备注说明具体情况"/>
</el-form-item>
</el-form>
</ai-dialog>
@@ -96,5 +112,9 @@ export default {
<style scoped lang="scss">
.authList {
height: 100%;
.deleteBtn {
color: $errorColor;
}
}
</style>

View File

@@ -11,7 +11,7 @@ instance.defaults.baseURL = baseURLs[process.env.NODE_ENV]
instance.interceptors.request.use(config => {
config.timeout = 300000
if (extra?.isSingleService) {
config.url = config.url.replace(/\/(app|auth|admin)\//, "/api/")
config.url = config.url.replace(/^\/(app|auth|admin)\//, "/api/")
}
if (config.url.startsWith("/node")) {
config.baseURL = "/ns"

View File

@@ -1,11 +1,12 @@
<script>
import AiTitle from "dui/packages/basic/AiTitle.vue";
import AiTitle from "../basic/AiTitle.vue";
export default {
name: "AiPage",
components: {AiTitle},
props: {
contentString: {default: "card"}
contentString: {default: "card"},
showBack: Boolean
}
}
</script>
@@ -13,7 +14,7 @@ export default {
<template>
<section class="AiPage">
<slot v-if="$slots.title" name="title"/>
<ai-title v-else-if="$attrs.title" :title="$attrs.title" isShowBottomBorder/>
<ai-title v-else-if="$attrs.title" :title="$attrs.title" isShowBottomBorder :isShowBack="showBack" @onBackClick="$router.push({})"/>
<div class="fill main">
<div v-if="$slots.left" class="left">
<slot name="left"/>
@@ -41,13 +42,21 @@ export default {
gap: 10px;
overflow: hidden;
height: 100%;
}
.card {
padding: 12px 16px 12px;
background: #FFFFFF;
border-radius: 2px;
box-shadow: 0 4px 6px -2px rgba(15, 15, 21, 0.15);
& > .fill {
&.card {
padding: 12px 16px 12px;
background: #FFFFFF;
border-radius: 2px;
box-shadow: 0 4px 6px -2px rgba(15, 15, 21, 0.15);
}
&.detail {
margin-left: 50%;
transform: translateX(-50%);
max-width: 1200px;
}
}
}
.left {