dvcp_v2_webapp/project/xumu/AppAuthManage/authAdd.vue

<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",
  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>
  <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">
.authAdd {
}
</style>