1
MrShi
2025-01-06 d7dca690cedd12e271f0ee0b9050679d73796f5c
admin/src/views/client/components/OperaYwCustomerWindow.vue
@@ -1,81 +1,100 @@
<template>
  <GlobalWindow :title="title" width="900px" :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">
      <div class="list">
        <div class="title">基础信息</div>
        <el-form-item label="客户" prop="name">
        <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>
            <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>
        <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="员工/普通员工" />
        <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>
        <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="email">
          <el-input v-model="form.member.email" placeholder="请输入邮箱" v-trim />
        </el-form-item>
        <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 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>
@@ -85,10 +104,13 @@
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 },
  components: { GlobalWindow, OperaCategoryWindow, StaffEdit },
  data() {
    return {
      // 表单数据
@@ -102,7 +124,7 @@
        isdeleted: '',
        remark: '',
        industryId: '',
        type: '1',
        type: 1,
        name: '',
        phone: '',
        idcardNo: '',
@@ -110,11 +132,12 @@
        code: '',
        status: '',
        memberName: '',
        lastLoginDate: '',
        loginNum: '',
        userId: '',
        memberId: '',
        accountBank: '',
        accountNo: '',
        accountPhone: '',
@@ -123,7 +146,6 @@
        accountAddr: '',
        // identityType: '0',
        email: '',
        memberId: '',
        member: {
          name: "",
          phone: "",
@@ -133,6 +155,10 @@
          email: '',
        }
      },
      title: '新增客户',
      isShowTrade: false,
      clientList: [],
      cateList: [],
      // 验证规则
      rules
@@ -145,12 +171,25 @@
    })
  },
  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) {
    open(title, target) {
      this.title = title
      this.visible = true
      this.initData()
@@ -158,16 +197,37 @@
      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 == '编辑客户'){
        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) {
@@ -206,4 +266,4 @@
    }
  }
}
</style>
</style>