|  |  |  | 
|---|
|  |  |  | <template> | 
|---|
|  |  |  | <GlobalWindow | 
|---|
|  |  |  | :title="title" | 
|---|
|  |  |  | :visible.sync="visible" | 
|---|
|  |  |  | :confirm-working="isWorking" | 
|---|
|  |  |  | @confirm="confirm" | 
|---|
|  |  |  | > | 
|---|
|  |  |  | <GlobalWindow :title="title" width="800px" :visible.sync="visible" :confirm-working="isWorking" @confirm="confirm"> | 
|---|
|  |  |  | <el-form :model="form" ref="form" :rules="rules"> | 
|---|
|  |  |  | <el-form-item label="创建人编码" prop="creator"> | 
|---|
|  |  |  | <el-input v-model="form.creator" placeholder="请输入创建人编码" v-trim/> | 
|---|
|  |  |  | </el-form-item> | 
|---|
|  |  |  | <el-form-item label="创建时间" prop="createDate"> | 
|---|
|  |  |  | <el-date-picker v-model="form.createDate" value-format="yyyy-MM-dd" placeholder="请输入创建时间"></el-date-picker> | 
|---|
|  |  |  | </el-form-item> | 
|---|
|  |  |  | <el-form-item label="更新人编码" prop="editor"> | 
|---|
|  |  |  | <el-input v-model="form.editor" placeholder="请输入更新人编码" v-trim/> | 
|---|
|  |  |  | </el-form-item> | 
|---|
|  |  |  | <el-form-item label="更新时间" prop="editDate"> | 
|---|
|  |  |  | <el-date-picker v-model="form.editDate" value-format="yyyy-MM-dd" placeholder="请输入更新时间"></el-date-picker> | 
|---|
|  |  |  | </el-form-item> | 
|---|
|  |  |  | <el-form-item label="是否删除0否 1是" prop="isdeleted"> | 
|---|
|  |  |  | <el-input v-model="form.isdeleted" placeholder="请输入是否删除0否 1是" v-trim/> | 
|---|
|  |  |  | </el-form-item> | 
|---|
|  |  |  | <el-form-item label="备注" prop="remark"> | 
|---|
|  |  |  | <el-input v-model="form.remark" placeholder="请输入备注" v-trim/> | 
|---|
|  |  |  | </el-form-item> | 
|---|
|  |  |  | <el-form-item label="所属行业编码(关联category)" prop="industryId"> | 
|---|
|  |  |  | <el-input v-model="form.industryId" placeholder="请输入所属行业编码(关联category)" v-trim/> | 
|---|
|  |  |  | </el-form-item> | 
|---|
|  |  |  | <el-form-item label="类型 0个人 1企业" prop="type"> | 
|---|
|  |  |  | <el-input v-model="form.type" placeholder="请输入类型 0个人 1企业" v-trim/> | 
|---|
|  |  |  | </el-form-item> | 
|---|
|  |  |  | <el-form-item label="客户" prop="name"> | 
|---|
|  |  |  | <el-input v-model="form.name" placeholder="请输入客户" v-trim/> | 
|---|
|  |  |  | </el-form-item> | 
|---|
|  |  |  | <el-form-item label="手机号" prop="phone"> | 
|---|
|  |  |  | <el-input v-model="form.phone" placeholder="请输入手机号" v-trim/> | 
|---|
|  |  |  | </el-form-item> | 
|---|
|  |  |  | <el-form-item label="身份证号(加密)" prop="idcardNo"> | 
|---|
|  |  |  | <el-input v-model="form.idcardNo" placeholder="请输入身份证号(加密)" v-trim/> | 
|---|
|  |  |  | </el-form-item> | 
|---|
|  |  |  | <el-form-item label="证件显示信息" prop="idcardDecode"> | 
|---|
|  |  |  | <el-input v-model="form.idcardDecode" placeholder="请输入证件显示信息" v-trim/> | 
|---|
|  |  |  | </el-form-item> | 
|---|
|  |  |  | <el-form-item label="客户编码" prop="code"> | 
|---|
|  |  |  | <el-input v-model="form.code" placeholder="请输入客户编码" v-trim/> | 
|---|
|  |  |  | </el-form-item> | 
|---|
|  |  |  | <el-form-item label="状态 0正常 1禁用" prop="status"> | 
|---|
|  |  |  | <el-input v-model="form.status" placeholder="请输入状态 0正常 1禁用" v-trim/> | 
|---|
|  |  |  | </el-form-item> | 
|---|
|  |  |  | <el-form-item label="身份 0老板 1超级管理员" prop="highCheckor"> | 
|---|
|  |  |  | <el-input v-model="form.highCheckor" placeholder="请输入身份 0老板 1超级管理员" v-trim/> | 
|---|
|  |  |  | </el-form-item> | 
|---|
|  |  |  | <el-form-item label="最近登录时间" prop="lastLoginDate"> | 
|---|
|  |  |  | <el-date-picker v-model="form.lastLoginDate" value-format="yyyy-MM-dd" placeholder="请输入最近登录时间"></el-date-picker> | 
|---|
|  |  |  | </el-form-item> | 
|---|
|  |  |  | <el-form-item label="登录次数" prop="loginNum"> | 
|---|
|  |  |  | <el-input v-model="form.loginNum" placeholder="请输入登录次数" v-trim/> | 
|---|
|  |  |  | </el-form-item> | 
|---|
|  |  |  | <el-form-item label="系统登录用户编码(关联system_user)" prop="userId"> | 
|---|
|  |  |  | <el-input v-model="form.userId" placeholder="请输入系统登录用户编码(关联system_user)" v-trim/> | 
|---|
|  |  |  | </el-form-item> | 
|---|
|  |  |  | <el-form-item label="证件类型 0身份证 1港澳证件 2护照" prop="idcardType"> | 
|---|
|  |  |  | <el-input v-model="form.idcardType" placeholder="请输入证件类型 0身份证 1港澳证件 2护照" v-trim/> | 
|---|
|  |  |  | </el-form-item> | 
|---|
|  |  |  | <el-form-item label="开户银行" prop="accountBank"> | 
|---|
|  |  |  | <el-input v-model="form.accountBank" placeholder="请输入开户银行" v-trim/> | 
|---|
|  |  |  | </el-form-item> | 
|---|
|  |  |  | <el-form-item label="账号" prop="accountNo"> | 
|---|
|  |  |  | <el-input v-model="form.accountNo" placeholder="请输入账号" v-trim/> | 
|---|
|  |  |  | </el-form-item> | 
|---|
|  |  |  | <el-form-item label="账户电话" prop="accountPhone"> | 
|---|
|  |  |  | <el-input v-model="form.accountPhone" placeholder="请输入账户电话" v-trim/> | 
|---|
|  |  |  | </el-form-item> | 
|---|
|  |  |  | <el-form-item label="统一信用代码" prop="creditCard"> | 
|---|
|  |  |  | <el-input v-model="form.creditCard" placeholder="请输入统一信用代码" v-trim/> | 
|---|
|  |  |  | </el-form-item> | 
|---|
|  |  |  | <el-form-item label="默认发票类型 0增值税普通发票 1增值税专用发票" prop="fpType"> | 
|---|
|  |  |  | <el-input v-model="form.fpType" placeholder="请输入默认发票类型 0增值税普通发票 1增值税专用发票" v-trim/> | 
|---|
|  |  |  | </el-form-item> | 
|---|
|  |  |  | <el-form-item label="账号注册地址" prop="accountAddr"> | 
|---|
|  |  |  | <el-input v-model="form.accountAddr" placeholder="请输入账号注册地址" v-trim/> | 
|---|
|  |  |  | </el-form-item> | 
|---|
|  |  |  | <el-form-item label="身份类型0老板超级管理员;1=人事管理员;2=员工" prop="identityType"> | 
|---|
|  |  |  | <el-input v-model="form.identityType" placeholder="请输入身份类型0老板超级管理员;1=人事管理员;2=员工" v-trim/> | 
|---|
|  |  |  | </el-form-item> | 
|---|
|  |  |  | <el-form-item label="邮箱" prop="email"> | 
|---|
|  |  |  | <el-input v-model="form.email" placeholder="请输入邮箱" v-trim/> | 
|---|
|  |  |  | </el-form-item> | 
|---|
|  |  |  | <el-form-item label="联系人编码(关联member)" prop="memberId"> | 
|---|
|  |  |  | <el-input v-model="form.memberId" placeholder="请输入联系人编码(关联member)" v-trim/> | 
|---|
|  |  |  | </el-form-item> | 
|---|
|  |  |  | <div class="list"> | 
|---|
|  |  |  | <div class="title">基础信息</div> | 
|---|
|  |  |  | <el-form-item label="客户名称" prop="name"> | 
|---|
|  |  |  | <div class="df"> | 
|---|
|  |  |  | <el-input v-model="form.name" placeholder="请输入客户" v-trim /> | 
|---|
|  |  |  | <el-checkbox v-model="form.type" class="ml10" :true-label="0" :false-label="1">个人</el-checkbox> | 
|---|
|  |  |  | </div> | 
|---|
|  |  |  | </el-form-item> | 
|---|
|  |  |  | <el-form-item label="行业分类" prop="industryId"> | 
|---|
|  |  |  | <el-select v-model="form.industryId" clearable filterable> | 
|---|
|  |  |  | <el-option v-for="item in cateList" :value="item.id" :label="item.name" /> | 
|---|
|  |  |  | <div key="21" class="df_center mt10"><el-button type="primary" plain class="w200" | 
|---|
|  |  |  | @click="openTrade">添加</el-button> | 
|---|
|  |  |  | </div> | 
|---|
|  |  |  | </el-select> | 
|---|
|  |  |  | </el-form-item> | 
|---|
|  |  |  | <el-form-item label="客户编号" prop="code"> | 
|---|
|  |  |  | <el-input v-model="form.code" placeholder="请输入" v-trim /> | 
|---|
|  |  |  | </el-form-item> | 
|---|
|  |  |  | <template v-if="!form.id"> | 
|---|
|  |  |  | <div class="title">默认联系人</div> | 
|---|
|  |  |  | <el-form-item label="姓名" prop="member.name"> | 
|---|
|  |  |  | <el-input v-model="form.member.name" placeholder="请输入" v-trim /> | 
|---|
|  |  |  | </el-form-item> | 
|---|
|  |  |  | <el-form-item label="手机号" prop="member.phone"> | 
|---|
|  |  |  | <el-input v-model="form.member.phone" placeholder="请输入手机号" v-trim /> | 
|---|
|  |  |  | </el-form-item> | 
|---|
|  |  |  | <el-form-item label="身份"> | 
|---|
|  |  |  | <el-select v-model="form.member.highCheckor" filterable> | 
|---|
|  |  |  | <el-option :value="0" label="老板/超级管理员" /> | 
|---|
|  |  |  | <el-option :value="1" label="人事/管理员" /> | 
|---|
|  |  |  | <el-option :value="2" label="员工/普通员工" /> | 
|---|
|  |  |  | </el-select> | 
|---|
|  |  |  | </el-form-item> | 
|---|
|  |  |  | <el-form-item label="证件类型"> | 
|---|
|  |  |  | <el-select v-model="form.member.idcardType" filterable> | 
|---|
|  |  |  | <el-option :value="0" label="身份证" /> | 
|---|
|  |  |  | <el-option :value="1" label="港澳证件" /> | 
|---|
|  |  |  | <el-option :value="2" label="护照" /> | 
|---|
|  |  |  | </el-select> | 
|---|
|  |  |  | </el-form-item> | 
|---|
|  |  |  | <el-form-item label="证件号码" prop="member.idcardNo"> | 
|---|
|  |  |  | <el-input v-model="form.member.idcardNo" placeholder="请输入" v-trim /> | 
|---|
|  |  |  | </el-form-item> | 
|---|
|  |  |  | <el-form-item label="邮箱" prop="member.email" :rules="[ | 
|---|
|  |  |  | { required: false, type: 'email', message: '请输入正确的邮箱格式'} | 
|---|
|  |  |  | ]"> | 
|---|
|  |  |  | <el-input v-model="form.member.email" placeholder="请输入邮箱" v-trim /> | 
|---|
|  |  |  | </el-form-item> | 
|---|
|  |  |  | </template> | 
|---|
|  |  |  | <el-form-item v-else label="默认联系人" prop="memberId"> | 
|---|
|  |  |  | <el-select v-model="form.memberId" clearable filterable> | 
|---|
|  |  |  | <el-option v-for="item in clientList" :value="item.id" :label="item.name" /> | 
|---|
|  |  |  | <div key="11" class="df_center mt10"><el-button type="primary" plain class="w200" | 
|---|
|  |  |  | @click="openClient">添加</el-button> | 
|---|
|  |  |  | </div> | 
|---|
|  |  |  | </el-select> | 
|---|
|  |  |  | </el-form-item> | 
|---|
|  |  |  | <template v-if="form.type == 1"> | 
|---|
|  |  |  | <div class="title">账户信息</div> | 
|---|
|  |  |  | <el-form-item label="开户银行" prop="accountBank"> | 
|---|
|  |  |  | <el-input v-model="form.accountBank" placeholder="请输入开户银行" v-trim /> | 
|---|
|  |  |  | </el-form-item> | 
|---|
|  |  |  | <el-form-item label="账号" prop="accountNo"> | 
|---|
|  |  |  | <el-input v-model="form.accountNo" placeholder="请输入账号" v-trim /> | 
|---|
|  |  |  | </el-form-item> | 
|---|
|  |  |  | <el-form-item label="电话" prop="accountPhone"> | 
|---|
|  |  |  | <el-input v-model="form.accountPhone" placeholder="请输入账户电话" v-trim /> | 
|---|
|  |  |  | </el-form-item> | 
|---|
|  |  |  | <el-form-item label="统一信用代码" prop="creditCard"> | 
|---|
|  |  |  | <el-input v-model="form.creditCard" placeholder="请输入统一信用代码" v-trim /> | 
|---|
|  |  |  | </el-form-item> | 
|---|
|  |  |  | <el-form-item label="默认发票类型" prop="fpType"> | 
|---|
|  |  |  | <el-select v-model="form.fpType" clearable filterable> | 
|---|
|  |  |  | <el-option :value="0" label="增值税普通发票" /> | 
|---|
|  |  |  | <el-option :value="1" label="增值税专用发票" /> | 
|---|
|  |  |  | </el-select> | 
|---|
|  |  |  | </el-form-item> | 
|---|
|  |  |  | <el-form-item label="注册地址" prop="accountAddr"> | 
|---|
|  |  |  | <el-input v-model="form.accountAddr" placeholder="请输入账号注册地址" v-trim /> | 
|---|
|  |  |  | </el-form-item> | 
|---|
|  |  |  | <el-form-item label="营业期限"> | 
|---|
|  |  |  | <div class="df"> | 
|---|
|  |  |  | <el-date-picker type="date" v-model="form.validity" value-format="yyyy-MM-dd" placeholder="请选择" /> | 
|---|
|  |  |  | <el-checkbox v-model="form.selLangTime" @change="changeValid" class="ml10">长期</el-checkbox> | 
|---|
|  |  |  | </div> | 
|---|
|  |  |  | </el-form-item> | 
|---|
|  |  |  | </template> | 
|---|
|  |  |  |  | 
|---|
|  |  |  | </div> | 
|---|
|  |  |  | </el-form> | 
|---|
|  |  |  | <!--  --> | 
|---|
|  |  |  | <OperaCategoryWindow ref="OperaCategoryWindowRef" @success="initData" /> | 
|---|
|  |  |  | <StaffEdit ref="StaffEditRef" @success="getClient" /> | 
|---|
|  |  |  | </GlobalWindow> | 
|---|
|  |  |  | </template> | 
|---|
|  |  |  |  | 
|---|
|  |  |  | <script> | 
|---|
|  |  |  | import BaseOpera from '@/components/base/BaseOpera' | 
|---|
|  |  |  | import GlobalWindow from '@/components/common/GlobalWindow' | 
|---|
|  |  |  | import { fetchCateList } from '@/api/business/category' | 
|---|
|  |  |  | import { rules } from './config' | 
|---|
|  |  |  | import { detailById } from '@/api/client/ywCustomer' | 
|---|
|  |  |  | import { fetchList } from '@/api/client/staff' | 
|---|
|  |  |  | import OperaCategoryWindow from './OperaCategoryWindow.vue' | 
|---|
|  |  |  | import StaffEdit from './staffEdit.vue' | 
|---|
|  |  |  | export default { | 
|---|
|  |  |  | name: 'OperaYwCustomerWindow', | 
|---|
|  |  |  | extends: BaseOpera, | 
|---|
|  |  |  | components: { GlobalWindow }, | 
|---|
|  |  |  | data () { | 
|---|
|  |  |  | components: { GlobalWindow, OperaCategoryWindow, StaffEdit }, | 
|---|
|  |  |  | data() { | 
|---|
|  |  |  | return { | 
|---|
|  |  |  | // 表单数据 | 
|---|
|  |  |  | form: { | 
|---|
|  |  |  | id: null, | 
|---|
|  |  |  | validity: '', | 
|---|
|  |  |  | creator: '', | 
|---|
|  |  |  | createDate: '', | 
|---|
|  |  |  | editor: '', | 
|---|
|  |  |  | 
|---|
|  |  |  | isdeleted: '', | 
|---|
|  |  |  | remark: '', | 
|---|
|  |  |  | industryId: '', | 
|---|
|  |  |  | type: '', | 
|---|
|  |  |  | type: 1, | 
|---|
|  |  |  | name: '', | 
|---|
|  |  |  | phone: '', | 
|---|
|  |  |  | idcardNo: '', | 
|---|
|  |  |  | idcardDecode: '', | 
|---|
|  |  |  | code: '', | 
|---|
|  |  |  | status: '', | 
|---|
|  |  |  | highCheckor: '', | 
|---|
|  |  |  | memberName: '', | 
|---|
|  |  |  |  | 
|---|
|  |  |  | lastLoginDate: '', | 
|---|
|  |  |  | loginNum: '', | 
|---|
|  |  |  | userId: '', | 
|---|
|  |  |  | idcardType: '', | 
|---|
|  |  |  | memberId: '', | 
|---|
|  |  |  |  | 
|---|
|  |  |  | accountBank: '', | 
|---|
|  |  |  | accountNo: '', | 
|---|
|  |  |  | accountPhone: '', | 
|---|
|  |  |  | creditCard: '', | 
|---|
|  |  |  | fpType: '', | 
|---|
|  |  |  | accountAddr: '', | 
|---|
|  |  |  | identityType: '', | 
|---|
|  |  |  | // identityType: '0', | 
|---|
|  |  |  | email: '', | 
|---|
|  |  |  | memberId: '' | 
|---|
|  |  |  | member: { | 
|---|
|  |  |  | name: "", | 
|---|
|  |  |  | phone: "", | 
|---|
|  |  |  | highCheckor: 0, | 
|---|
|  |  |  | idcardType: 0, | 
|---|
|  |  |  | idcardNo: '', | 
|---|
|  |  |  | email: '', | 
|---|
|  |  |  | } | 
|---|
|  |  |  | }, | 
|---|
|  |  |  | title: '新增客户', | 
|---|
|  |  |  | isShowTrade: false, | 
|---|
|  |  |  |  | 
|---|
|  |  |  | clientList: [], | 
|---|
|  |  |  | cateList: [], | 
|---|
|  |  |  | // 验证规则 | 
|---|
|  |  |  | rules: { | 
|---|
|  |  |  | } | 
|---|
|  |  |  | rules | 
|---|
|  |  |  | } | 
|---|
|  |  |  | }, | 
|---|
|  |  |  | created () { | 
|---|
|  |  |  | created() { | 
|---|
|  |  |  | this.config({ | 
|---|
|  |  |  | api: '/client/ywCustomer', | 
|---|
|  |  |  | 'field.id': 'id' | 
|---|
|  |  |  | }) | 
|---|
|  |  |  | }, | 
|---|
|  |  |  | methods: { | 
|---|
|  |  |  | openTrade() { | 
|---|
|  |  |  | this.$refs.OperaCategoryWindowRef.open('新增行业') | 
|---|
|  |  |  | }, | 
|---|
|  |  |  | openClient() { | 
|---|
|  |  |  | this.$refs.StaffEditRef.open('新建人员') | 
|---|
|  |  |  | setTimeout(() => { | 
|---|
|  |  |  | this.$refs.StaffEditRef.form.customerId = this.form.id | 
|---|
|  |  |  | console.log('--', this.$refs.StaffEditRef.form); | 
|---|
|  |  |  |  | 
|---|
|  |  |  | // this.$update | 
|---|
|  |  |  | }, 1200) | 
|---|
|  |  |  | this.$refs.StaffEditRef.customerId = this.form.id | 
|---|
|  |  |  | }, | 
|---|
|  |  |  | initData() { | 
|---|
|  |  |  | fetchCateList({ type: 6 }).then(res => { | 
|---|
|  |  |  | this.cateList = res | 
|---|
|  |  |  | }) | 
|---|
|  |  |  | }, | 
|---|
|  |  |  | open(title, target) { | 
|---|
|  |  |  | this.title = title | 
|---|
|  |  |  | this.visible = true | 
|---|
|  |  |  | this.initData() | 
|---|
|  |  |  | // 新建 | 
|---|
|  |  |  | if (target == null) { | 
|---|
|  |  |  | this.$nextTick(() => { | 
|---|
|  |  |  | this.$refs.form.resetFields() | 
|---|
|  |  |  | this.form.validity = '' | 
|---|
|  |  |  | this.form.id = '' | 
|---|
|  |  |  | this.form.member = { | 
|---|
|  |  |  | name: "", | 
|---|
|  |  |  | phone: "", | 
|---|
|  |  |  | highCheckor: 0, | 
|---|
|  |  |  | idcardType: 0, | 
|---|
|  |  |  | idcardNo: '', | 
|---|
|  |  |  | email: '', | 
|---|
|  |  |  | } | 
|---|
|  |  |  | }) | 
|---|
|  |  |  | this.form.type = 1 | 
|---|
|  |  |  | return | 
|---|
|  |  |  | } | 
|---|
|  |  |  | // 编辑 | 
|---|
|  |  |  | this.$nextTick(() => { | 
|---|
|  |  |  | if (title == '编辑客户') { | 
|---|
|  |  |  | this.getClient(target.id) | 
|---|
|  |  |  | detailById(target.id).then(res => { | 
|---|
|  |  |  | this.form = res | 
|---|
|  |  |  | }) | 
|---|
|  |  |  | } | 
|---|
|  |  |  | }) | 
|---|
|  |  |  | }, | 
|---|
|  |  |  | getClient(customerId) { | 
|---|
|  |  |  | fetchList({ | 
|---|
|  |  |  | capacity: 9999, | 
|---|
|  |  |  | page: 1, | 
|---|
|  |  |  | model: {customerId} | 
|---|
|  |  |  | }).then(res => { | 
|---|
|  |  |  | this.clientList = res.records | 
|---|
|  |  |  | }) | 
|---|
|  |  |  | }, | 
|---|
|  |  |  | changeValid(e) { | 
|---|
|  |  |  | this.$set(this.form, 'validity', e ? '2099-12-31' : '') | 
|---|
|  |  |  | }, | 
|---|
|  |  |  | } | 
|---|
|  |  |  | } | 
|---|
|  |  |  | </script> | 
|---|
|  |  |  | <style lang='scss' scoped> | 
|---|
|  |  |  | @import '@/assets/style/variables.scss'; | 
|---|
|  |  |  |  | 
|---|
|  |  |  | div { | 
|---|
|  |  |  | box-sizing: border-box; | 
|---|
|  |  |  | } | 
|---|
|  |  |  |  | 
|---|
|  |  |  | .title { | 
|---|
|  |  |  | width: 100%; | 
|---|
|  |  |  | font-weight: 500; | 
|---|
|  |  |  | font-size: 15px; | 
|---|
|  |  |  | margin-top: 16px; | 
|---|
|  |  |  | } | 
|---|
|  |  |  |  | 
|---|
|  |  |  | .list { | 
|---|
|  |  |  | /* padding-top: 14px; */ | 
|---|
|  |  |  | display: flex; | 
|---|
|  |  |  | flex-wrap: wrap; | 
|---|
|  |  |  |  | 
|---|
|  |  |  | .el-form-item { | 
|---|
|  |  |  | width: 33.33%; | 
|---|
|  |  |  | margin-bottom: 12px; | 
|---|
|  |  |  | padding: 0 12px; | 
|---|
|  |  |  |  | 
|---|
|  |  |  | .la { | 
|---|
|  |  |  | color: #7f7f7f; | 
|---|
|  |  |  | margin-top: 2px; | 
|---|
|  |  |  | } | 
|---|
|  |  |  | } | 
|---|
|  |  |  | } | 
|---|
|  |  |  | </style> | 
|---|