|
|
@@ -0,0 +1,239 @@
|
|
|
+<template>
|
|
|
+ <el-drawer v-model="visible" size="800px" destroy-on-close :close-on-click-modal="false" :with-header="false">
|
|
|
+ <el-container class="flex-column">
|
|
|
+ <div class="drawer-detail-main">
|
|
|
+ <div class="drawer-detail-header">
|
|
|
+ <div class="drawer-detail-header-body">
|
|
|
+ <div class="drawer-detail-header-left">{{titleMap[mode]}}</div>
|
|
|
+ <div class="drawer-detail-header-left">
|
|
|
+ <el-button type="default" icon="el-icon-close" @click="visible=false"></el-button>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <el-main>
|
|
|
+ <el-form ref="dialogForm" :model="formData" :rules="rules" label-width="100px" label-position="top">
|
|
|
+ <fieldset>
|
|
|
+ <legend><el-button>商户主体信息</el-button></legend>
|
|
|
+ <el-form-item label="企业名称" prop="company_name">
|
|
|
+ <el-input v-model="formData.company_name" clearable placeholder="请输入"></el-input>
|
|
|
+ <div class="el-form-item-msg"></div>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="企业简称" prop="company_sub_name">
|
|
|
+ <el-input v-model="formData.company_sub_name" clearable placeholder="请输入"></el-input>
|
|
|
+ <div class="el-form-item-msg"></div>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="统一社会信用码" prop="company_number">
|
|
|
+ <el-input v-model="formData.company_number" clearable placeholder="请输入"></el-input>
|
|
|
+ <div class="el-form-item-msg"></div>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="营业执照" prop="company_license">
|
|
|
+ <sc-upload v-model="formData.company_license" title="营业执照"></sc-upload>
|
|
|
+ <div class="el-form-item-msg">营业执照原件或加盖公章的副本复印件</div>
|
|
|
+ </el-form-item>
|
|
|
+ </fieldset>
|
|
|
+ <fieldset>
|
|
|
+ <legend><el-button>经营地址</el-button></legend>
|
|
|
+ <el-form-item label="所在省市区" prop="city" v-loading="cityLoad">
|
|
|
+ <el-cascader ref="cascaderRef" v-model="formData.city" :options="cityData" :props="deptsProps" @change="getTemplate" clearable style="width: 100%;" />
|
|
|
+ <div class="el-form-item-msg"></div>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="详细地址" prop="address">
|
|
|
+ <el-input v-model="formData.address" clearable placeholder="无需再填省市区"></el-input>
|
|
|
+ <div class="el-form-item-msg"></div>
|
|
|
+ </el-form-item>
|
|
|
+ </fieldset>
|
|
|
+ <fieldset>
|
|
|
+ <legend><el-button>商户法人信息</el-button></legend>
|
|
|
+ <el-form-item label="法人姓名" prop="legal_name">
|
|
|
+ <el-input v-model="formData.legal_name" clearable placeholder="请输入"></el-input>
|
|
|
+ <div class="el-form-item-msg"></div>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="法人手机号" prop="legal_mobile">
|
|
|
+ <el-input v-model="formData.legal_mobile" clearable placeholder="请输入"></el-input>
|
|
|
+ <div class="el-form-item-msg"></div>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="法人证件号" prop="legal_idcard">
|
|
|
+ <el-input v-model="formData.legal_idcard" clearable placeholder="请输入"></el-input>
|
|
|
+ <div class="el-form-item-msg"></div>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="联系人邮箱" prop="email">
|
|
|
+ <el-input v-model="formData.email" clearable placeholder="请输入"></el-input>
|
|
|
+ <div class="el-form-item-msg"></div>
|
|
|
+ </el-form-item>
|
|
|
+ <el-row :gutter="15">
|
|
|
+ <el-col :span="12">
|
|
|
+ <el-form-item label="法人证件照正面" prop="legal_id_front">
|
|
|
+ <sc-upload v-model="formData.legal_id_front" title="法人证件照正面"></sc-upload>
|
|
|
+ <div class="el-form-item-msg"></div>
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="12">
|
|
|
+ <el-form-item label="法人证件照反面" prop="legal_id_back">
|
|
|
+ <sc-upload v-model="formData.legal_id_back" title="法人证件照反面"></sc-upload>
|
|
|
+ <div class="el-form-item-msg"></div>
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
+ </fieldset>
|
|
|
+ <fieldset>
|
|
|
+ <legend><el-button>结算账户信息</el-button></legend>
|
|
|
+ <el-form-item label="企业银行卡号" prop="bank_number">
|
|
|
+ <el-input v-model="formData.bank_number" clearable placeholder="请输入"></el-input>
|
|
|
+ <div class="el-form-item-msg"></div>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="企业开户行编码" prop="bank_code">
|
|
|
+ <el-select v-model="formData.bank_code" clearable filterable remote remote-show-suffix :remote-method="remoteMethod" :loading="codeLoad" style="width: 100%;" placeholder="请选择">
|
|
|
+ <el-option
|
|
|
+ v-for="item in codeData"
|
|
|
+ :key="item.bank_code"
|
|
|
+ :label="item.name"
|
|
|
+ :value="item.bank_code"
|
|
|
+ >
|
|
|
+ <span style="float: left">{{ item.name }}</span>
|
|
|
+ <span
|
|
|
+ style="
|
|
|
+ float: right;
|
|
|
+ color: var(--el-text-color-secondary);
|
|
|
+ font-size: 13px;
|
|
|
+ "
|
|
|
+ >
|
|
|
+ {{ item.bank_code }}
|
|
|
+ </span>
|
|
|
+ </el-option>
|
|
|
+ </el-select>
|
|
|
+ <div class="el-form-item-msg">如:输入中国银行,根据下拉选择</div>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="开户许可证照片" prop="bank_img">
|
|
|
+ <sc-upload v-model="formData.bank_img" title="开户许可证照片"></sc-upload>
|
|
|
+ <div class="el-form-item-msg"></div>
|
|
|
+ </el-form-item>
|
|
|
+ </fieldset>
|
|
|
+ </el-form>
|
|
|
+ </el-main>
|
|
|
+ <el-footer>
|
|
|
+ <el-button @click="visible=false" size="large">取 消</el-button>
|
|
|
+ <el-button size="large" type="primary" :loading="isSaveing" @click="submitEdit()">提 交</el-button>
|
|
|
+ </el-footer>
|
|
|
+ </el-container>
|
|
|
+ </el-drawer>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script>
|
|
|
+export default {
|
|
|
+ data(){
|
|
|
+ return {
|
|
|
+ loading: false,
|
|
|
+ isSaveing: false,
|
|
|
+ mode:"add",
|
|
|
+ titleMap:{
|
|
|
+ add:"新增进件管理",
|
|
|
+ edit:"进件管理"
|
|
|
+ },
|
|
|
+ visible:false,
|
|
|
+ formData:{},
|
|
|
+ deptsProps:{
|
|
|
+ value: "value",
|
|
|
+ label: "text"
|
|
|
+ },
|
|
|
+ cityData:[],
|
|
|
+ cityLoad:false,
|
|
|
+ codeLoad:false,
|
|
|
+ codeData:[],
|
|
|
+ rules:{
|
|
|
+ company_name: [
|
|
|
+ {required: true, message: '请输入'}
|
|
|
+ ],
|
|
|
+ company_number: [
|
|
|
+ {required: true, message: '请输入'}
|
|
|
+ ],
|
|
|
+ company_sub_name: [
|
|
|
+ {required: true, message: '请输入'}
|
|
|
+ ],
|
|
|
+ company_license: [
|
|
|
+ {required: true, message: '请上传'}
|
|
|
+ ],
|
|
|
+ city: [
|
|
|
+ {required: true, message: '请选择'}
|
|
|
+ ],
|
|
|
+ address: [
|
|
|
+ {required: true, message: '请输入'}
|
|
|
+ ],
|
|
|
+ legal_name: [
|
|
|
+ {required: true, message: '请输入'}
|
|
|
+ ],
|
|
|
+ legal_mobile: [
|
|
|
+ {required: true, message: '请输入'}
|
|
|
+ ],
|
|
|
+ legal_idcard: [
|
|
|
+ {required: true, message: '请输入'}
|
|
|
+ ],
|
|
|
+ legal_id_front: [
|
|
|
+ {required: true, message: '请上传'}
|
|
|
+ ],
|
|
|
+ legal_id_back: [
|
|
|
+ {required: true, message: '请上传'}
|
|
|
+ ],
|
|
|
+ email: [
|
|
|
+ {required: true, message: '请输入'}
|
|
|
+ ],
|
|
|
+ bank_number: [
|
|
|
+ {required: true, message: '请输入'}
|
|
|
+ ],
|
|
|
+ bank_code: [
|
|
|
+ {required: true, message: '请输入'}
|
|
|
+ ],
|
|
|
+ bank_img: [
|
|
|
+ {required: true, message: '请上传'}
|
|
|
+ ]
|
|
|
+ }
|
|
|
+ }
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ open(mode = 'add'){
|
|
|
+ this.mode = mode;
|
|
|
+ this.visible = true;
|
|
|
+ this.getCity()
|
|
|
+ return this
|
|
|
+ },
|
|
|
+ async remoteMethod(data){
|
|
|
+ this.codeLoad = true;
|
|
|
+ var resp = await this.$API.finance.code.get({name:data})
|
|
|
+ this.codeLoad = false;
|
|
|
+ if (resp.code == 0) return ;
|
|
|
+ this.codeData = resp.data;
|
|
|
+ },
|
|
|
+ async getCity(){
|
|
|
+ this.cityLoad = true;
|
|
|
+ var resp = await this.$API.finance.city.get();
|
|
|
+ this.cityLoad = false;
|
|
|
+ if (resp.code == 0) return this.$message.error(resp.msg)
|
|
|
+ this.cityData = resp.data;
|
|
|
+ },
|
|
|
+ getTemplate(v){
|
|
|
+ const nodes = this.$refs.cascaderRef.getCheckedNodes()
|
|
|
+ this.formData.city_name = nodes[0].text;
|
|
|
+ },
|
|
|
+ //表单注入数据
|
|
|
+ setData(data){
|
|
|
+ this.formData = JSON.parse(JSON.stringify(data));
|
|
|
+ this.formData.city = data.city_code;
|
|
|
+ },
|
|
|
+ async submitEdit(){
|
|
|
+ var { formData, $message } = this;
|
|
|
+ var validate = await this.$refs.dialogForm.validate().catch(()=>{});
|
|
|
+ if(!validate){ return false }
|
|
|
+ this.isSaveing = true;
|
|
|
+ var resp = await this.$API.finance.save.post(formData);
|
|
|
+ this.isSaveing = false;
|
|
|
+ if (resp.code == 0) {
|
|
|
+ return $message.error(resp.msg)
|
|
|
+ }
|
|
|
+ $message.success(resp.msg)
|
|
|
+ this.visible = false;
|
|
|
+ this.formData = {};
|
|
|
+ this.$emit("success");
|
|
|
+ }
|
|
|
+ }
|
|
|
+}
|
|
|
+</script>
|