开发更新

jiangping

2025-06-06 a2299a6d4a6f99e9c11132138f5d3e9ec68f03ea

 admin/src/views/client/components/OperaYwCustomerWindow.vue

@@ -1,81 +1,122 @@
<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="类型 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="证件类型 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: '',
@@ -83,38 +124,146 @@
        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>