edit.vue

<template xmlns="">
  <div>
    <el-row type="flex" style="margin-top: 15px;margin-bottom: 15px" justify="center">
      <el-col :xs="24" :sm="24" :md="24" :lg="22" :xl="20">
        <el-form ref="form" :model="form" :rules="rules" label-width="150px">
          <el-row :gutter="10">
            <el-col :span="12">
              <el-form-item :label="$t('客户名称')" prop="name">
                <el-input v-model="form.name" :placeholder="$t('请输入客户名称')" />
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item :label="$t('国家')" prop="country">
                <el-select filterable clearable v-model="form.country" :placeholder="$t('请选择国家')">
                  <el-option v-for="dict in countryList"
                             :key="dict.id" :label="isChinese ? dict.nameZh : dict.nameEn" :value="parseInt(dict.id)" />
                </el-select>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item :label="$t('客户等级')" prop="level">
                <el-select v-model="form.level" :placeholder="$t('请选择客户等级')" disabled>
                  <el-option v-for="dict in getDictDatas(DICT_TYPE.CUSTOMER_LEVEL)"
                             :key="dict.value" :label=" isChinese ? dict.label : dict.labelEn" :value="parseInt(dict.value)" />
                </el-select>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item :label="$t('联系地址')" prop="address">
                <el-input v-model="form.address" :placeholder="$t('请输入联系地址')" />
              </el-form-item>
            </el-col>

            <el-col :span="12">
              <el-form-item :label="$t('出货渠道')" prop="transportType">
                <dict-selector :type="DICT_TYPE.ECW_CUSTOMER_TRANSPORT_TYPE" form-type="checkbox" multiple v-model="form.transportType"></dict-selector>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item :label="$t('客户类别')" prop="type">
                <dict-selector :type="DICT_TYPE.CUSTOMER_TYPE" form-type="checkbox" multiple v-model="form.type"></dict-selector>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item :label="$t('资源类型')" prop="remarks">
                <dict-selector :type="DICT_TYPE.ECW_CUSTOMER_RESOURCE_TYPE" v-model="form.resourceType" formatter="number"></dict-selector>
              </el-form-item>
            </el-col>

            <el-col :span="13" v-show="form.type && form.type.indexOf('2') !== -1">
              <el-form-item :label="$t('所属代理')" prop="agentId">
                <el-select filterable clearable v-model="form.agentId" :placeholder="$t('请选择所属代理')">
                  <el-option v-for="item in serviceUserList"
                             :key="item.id" :label="item.nickname" :value="item.id" />
                </el-select>
              </el-form-item>
            </el-col>
            <el-col :span="12">

              <el-form-item :label="$t('公司名称')" prop="company">
                <el-input v-model="form.company" :placeholder="$t('请输入公司名称')" />
              </el-form-item>
            </el-col>
            <el-col :span="12">

              <el-form-item :label="$t('客户生日')" prop="birthday">
                <el-date-picker
                  v-model="form.birthday"
                  type="date"
                  value-format="timestamp"
                  :placeholder="$t('请输入客户生日')">
                </el-date-picker>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item :label="$t('主营类别')" prop="productType">
                <el-row :gutter="10">
                  <el-col :span="11">
                    <el-select v-model="form.productType" :placeholder="$t('请选择产品类别')" @change="form.productId = ''">
                      <el-option :label="item.titleZh" :value="item.id" v-for="(item) in productTypeList" :key="item.id"/>
                    </el-select>
                  </el-col>
                  <el-col :span="11">
                    <el-select v-model="form.productId" :placeholder="$t('请选择')">
                      <el-option :label="item.titleZh" :value="parseInt(item.id)" v-for="(item) in productListFilter" :key="item.id"/>
                    </el-select>
                  </el-col>
                </el-row>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item :label="$t('客户来源')" prop="source">
                <el-select v-model="form.source" :placeholder="$t('请选择客户来源')">
                  <el-option v-for="dict in getDictDatas(DICT_TYPE.CUSTOMER_SOURCE)"
                             :key="dict.value" :label=" isChinese ? dict.label : dict.labelEn" :value="parseInt(dict.value)" />
                </el-select>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item :label="$t('结算方式')" prop="balance">
                <el-select v-model="form.balance" :placeholder="$t('请选择结算方式')">
                  <el-option v-for="dict in getDictDatas(DICT_TYPE.CUSTOMER_BALANCE)"
                             :key="dict.value" :label=" isChinese ? dict.label : dict.labelEn" :value="parseInt(dict.value)" />
                </el-select>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item :label="$t('客户经理')" prop="customerService">
                <el-select  v-model="form.customerService" :placeholder="$t('请选择客户经理')" :disabled="(customerId !== '0' || isCustomerServiceConfirmed)">
                  <el-option v-for="item in serviceUserList"
                             :key="item.id" :label="item.nickname" :value="item.id" />
                </el-select>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item :label="$t('图片')" prop="picture">
                <upload v-model="form.picture" :limit="1"></upload>
              </el-form-item>

            </el-col>
            <el-col :span="12">
              <el-form-item :label="$t('客户状态')" prop="status">
                <el-select v-model="form.status" :placeholder="$t('请选择客户状态')" disabled>
                  <el-option v-for="dict in getDictDatas(DICT_TYPE.CUSTOMER_STATUS)"
                             :key="dict.value" :label=" isChinese ? dict.label : dict.labelEn" :value="parseInt(dict.value)" />
                </el-select>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item :label="$t('推介人')" prop="promoter">
                <el-select clearable remote :remote-method="remoteMethod"  v-model="form.promoter" :placeholder="$t('请输入推介人')" filterable>
                  <el-option
                    v-for="item in customerSelectFn"
                    :key="item.id"
                    :label="item.name"
                    :value="item.id">
                  </el-option>
                </el-select>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item :label="$t('创建人')" prop="founder">
                <el-select v-model="form.founder" disabled>
                  <el-option
                    v-for="item in serviceUserList"
                    :key="item.id"
                    :label="item.nickname"
                    :value="item.id">
                  </el-option>
                </el-select>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item :label="$t('创建时间')" prop="createTime">
                <el-date-picker
                  v-model="form.createTime"
                  type="datetime"
                  value-format="timestamp"
                  disabled
                  :placeholder="$t('选择创建时间')">
                </el-date-picker>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item :label="$t('备注')" prop="remarks">
                <el-input v-model="form.remarks" :placeholder="$t('请输入备注')"/>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item :label="$t('是否显示提单价格')" prop="remarks">
              <el-switch  v-model="form.isShowTidanPrice"></el-switch>
              </el-form-item>
            </el-col>

            <el-col :span="24">
              <el-form-item :label="$t('到仓确认')" prop="arrivalConfirm">
                <el-switch v-model="form.arrivalConfirm" :active-value="1" :inactive-value="0" />
              </el-form-item>
            </el-col>
            <el-col :span="13">
              <el-form-item :label="$t('重货标准')" prop="weightUnit">
                <el-switch v-model="showZhong"/>
                <el-input v-model="form.weightUnit" :placeholder="$t('请输入重货标准')" v-show="showZhong">
                  <template slot="append">kg/cbm</template>
                </el-input>
              </el-form-item>
            </el-col>
            <el-col :span="24" v-show="showZhong">
              <el-form-item :label="$t('指定线路')" prop="line">
                <el-switch v-model="showZhong1"></el-switch>
                <customer-line-table v-if="showZhong1" :warehouse-list="warehouseList" :import-city-list="importCityList" v-model="zhongLines" :zhong-pao-type="1"></customer-line-table>
              </el-form-item>
            </el-col>
            <el-col :span="13">
              <el-form-item :label="$t('泡货标准')" prop="weightUnit">
                <el-switch v-model="showPao"/>
                <el-input v-model="form.lightUnit" :placeholder="$t('请输入泡货标准')" v-show="showPao">
                  <template slot="append">kg/cbm</template>
                </el-input>
              </el-form-item>
            </el-col>
            <el-col :span="24" v-show="showPao">
              <el-form-item :label="$t('指定线路')" prop="line">
                <el-switch v-model="showPao1"></el-switch>
                <customer-line-table v-if="showPao1" :warehouse-list="warehouseList" :import-city-list="importCityList" v-model="paoLines" :zhong-pao-type="2"></customer-line-table>
              </el-form-item>
            </el-col>
          </el-row>

          <el-card class="box-card">
            <div slot="header" class="clearfix">
              <span>{{$t('联系人')}}</span>
              <el-button style="float: right;" size="small" type="primary" @click="handleAddContact">+</el-button>
            </div>
            <el-form ref="contactForm" :rules="contactRules" :model="form">
            <el-table
              :data="form.customerContacts"
              style="width: 100%"
            >
              <el-table-column
                prop="department"
                :label="$t('部门')"
                width=""
              >
                <template v-slot="{ row }">
                  <el-form-item label="">
                    <el-input v-model="row.department" :placeholder="$t('请输入部门')" size="mini"/>
                  </el-form-item>
                </template>
              </el-table-column>
              <el-table-column
                prop="position"
                :label="$t('职位')"
                width=""
              >
                <template v-slot="{row}">
                  <el-form-item label="">
                    <el-input v-model="row.position" :placeholder="$t('请输入职位')" size="mini"/>
                  </el-form-item>
                </template>
              </el-table-column>
              <el-table-column
                prop="name"
                :label="$t('联系人')"
              >
                <template slot="header">
                  {{$t('联系人')}} <span style="color: #ff0000">*</span>
                </template>
                <template v-slot="{row, cellValue, $index}">
                  <el-form-item :rules="contactRules.name" :prop="'customerContacts.' + $index + '.name'" label="">
                    <el-input v-model="row.name" :placeholder="$t('请输入联系人')" size="mini"/>
                  </el-form-item>
                </template>
              </el-table-column>
              <el-table-column
                prop="areaCode"
                :label="$t('区号')"
              >
                <template slot="header">
                  {{$t('区号')}} <span style="color: #ff0000">*</span>
                </template>
                <template v-slot="{row, cellValue, $index}">
                  <el-form-item :rules="contactRules.areaCode" :prop="'customerContacts.' + $index + '.areaCode'" label="">
                    <el-select v-model="row.areaCode" :placeholder="$t('请选择区号')" filterable size="mini">
                      <el-option v-for="(item, index) in countryList"
                                 :key="index" :label="item.nameShort + (isChinese ? item.nameZh : item.nameEn) + '(' + item.tel + ')'" :value="item.tel" />
                    </el-select>
                  </el-form-item>
                </template>
              </el-table-column>
              <el-table-column
                prop="phoneNew"
                :label="$t('联系方式')"
              >
                <template slot="header">
                  {{$t('联系方式')}} <span style="color: #ff0000">*</span>
                </template>
                <template v-slot="{row, cellValue, $index}">
                  <el-form-item :rules="contactRules.phoneNew" :prop="'customerContacts.' + $index + '.phoneNew'" label="">
                    <el-input v-model="row.phoneNew" :placeholder="$t('请输入联系方式')" size="mini"/>
                  </el-form-item>
                </template>
              </el-table-column>
              <el-table-column
                prop=""
                :label="$t('关联账号')"
              >
               <template v-slot = "{row}">
                 <el-form-item label="">
                   <!-- <el-select v-model="row.userid"  clearable remote :remote-method="getUserMemberUserFn" @change="selectBD" size="mini" filterable>
                     <el-option v-for="(item,index) in userMemberUser" :value="item.id" :key="index"  :label="item.nickname + '(' + item.mobile + ')'" ></el-option>
                   </el-select> -->
                   <MemberSelector v-model="row.userid" size="mini" />
                 </el-form-item>
               </template>
              </el-table-column>
              <el-table-column
                prop="social"
                :label="$t('社交软件')"
              >
                <template v-slot="{row}">
                  <el-form-item label="">
                    <el-select v-model="row.social" :placeholder="$t('请选择社交软件')" size="mini">
                      <el-option v-for="dict in getDictDatas(DICT_TYPE.SOCIAL)"
                                 :key="dict.value" :label=" isChinese ? dict.label : dict.labelEn" :value="parseInt(dict.value)" />
                    </el-select>
                  </el-form-item>
                </template>
              </el-table-column>
              <el-table-column
                prop="socialNumber"
                :label="$t('社交软件号码')"
              >
                <template v-slot="{row}">
                  <el-form-item label="">
                    <el-input v-model="row.socialNumber" :placeholder="$t('请输入社交软件号码')" size="mini"/>
                  </el-form-item>
                </template>
              </el-table-column>
              <el-table-column
                prop="email"
                :label="$t('邮箱')"
              >
                <template v-slot="{row}">
                  <el-form-item label="">
                    <el-input v-model="row.email" :placeholder="$t('请输入邮箱')" size="mini"/>
                  </el-form-item>
                </template>
              </el-table-column>
              <el-table-column
                prop="isDefault"
                :label="$t('设为默认')"
              >
                <template v-slot="{ row, column, $index }">
                  <el-form-item label="">
                    <el-select v-model="row.isDefault" :placeholder="$t('设为默认')" @change="handleDefaultChange($index)" size="mini">
                      <el-option v-for="dict in getDictDatas(DICT_TYPE.IS_DEFAULT)"
                                 :key="dict.value" :label=" isChinese ? dict.label : dict.labelEn" :value="Number(dict.value)" />
                    </el-select>
                  </el-form-item>
                </template>
              </el-table-column>
              <el-table-column
                prop="name"
                :label="$t('操作')"
              >
                <template v-slot="{ row, column, $index }">
                  <el-form-item label="">
                    <el-button type="danger" @click="handleDeleteContact($index)" size="mini">{{$t('删除')}}</el-button>
                  </el-form-item>
                </template>
              </el-table-column>
            </el-table>
            </el-form>
          </el-card>

          <el-row :gutter="10" style="margin-top: 15px">
            <el-col :span="12">
              <el-form-item :label="$t('发票抬头')" prop="invoiceTitle">
                <el-input v-model="form.invoiceTitle" :placeholder="$t('请输入发票抬头')" />
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item :label="$t('纳税人识别号')" prop="licenseNumber">
                <el-input v-model="form.licenseNumber" :placeholder="$t('请输入纳税人识别号')" />
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item :label="$t('开户行')" prop="bank">
                <el-input v-model="form.bank" :placeholder="$t('请输入开户行')" />
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item :label="$t('账户')" prop="bankNumber">
                <el-input v-model="form.bankNumber" :placeholder="$t('请输入账户')" />
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item :label="$t('项目')" prop="project">
                <el-input v-model="form.project" :placeholder="$t('请输入项目')" />
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item :label="$t('开票地址')" prop="billingAddress">
                <el-input v-model="form.billingAddress" :placeholder="$t('请输入开票地址')" />
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item :label="$t('开票电话')" prop="billingTell">
                <el-input v-model="form.billingTell" :placeholder="$t('请输入开票电话')" maxlength="50" />
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item :label="$t('税率')" prop="taxRate">
                <el-input v-model="form.taxRate" :placeholder="$t('请输入税率')" />
              </el-form-item>
            </el-col>
          </el-row>
        </el-form>
        <div style="text-align: center">
          <el-button type="primary" @click="submitForm">{{$t('确 定')}}</el-button>
          <el-button @click="cancel">{{$t('取 消')}}</el-button>
        </div>
      </el-col>
    </el-row>

  </div>
</template>

<script>
import { getDictDatas, DICT_TYPE } from '@/utils/dict';
import upload from '@/components/ImageUpload'
import {
  createCustomer,
  getCustomer,
  getCustomerList,
  getCustomerPage, memberUserList,
  updateCustomer,
  userMemberUserList,
  getCustomerLines, fillupCustomeInfo
} from '@/api/ecw/customer'
import {getNodeList} from "@/api/ecw/node"
import { getProductTypeList } from '@/api/ecw/productType'
import { getProductList } from '@/api/ecw/product'
import {getTradeCityList} from "@/api/ecw/region"
import {getWarehouseList} from "@/api/ecw/warehouse"
import CustomerLineTable from '@/components/CustomerLineTable'
import {getCustomerSelect} from "@/api/ecw/customer"
import {listServiceUser, listSimpleUsers} from "@/api/system/user"
import { getZhongPaoBest, getZhongPaoPage } from '@/api/ecw/zhongPao'
import { getCustomerContactsListByCustomer } from '@/api/ecw/customerContacts'
import { getCountryListAll } from '@/api/ecw/country'
import Template from "@/views/cms/template";
import {validatorMobile} from "@/api/ecw/validate"
// import {customerDropDownList} from "@/api/ecw/customerCommissionInfo";
import MemberSelector from '@/components/MemberSelector'

export default {
  name: "edit",
  props: {
    customerId: String,
  },
  components: {
    Template,
    upload,
    CustomerLineTable,
    MemberSelector
  },
   created() {
    this.isCustomerServiceConfirmed =  this.$route.query.isCustomerServiceConfirmed ? true : false
    this.getCustomerSelect()
    this.reset()
    // this.getUserMemberUserFn()
    if(this.customerId !== '0') {
      // 编辑客户
      this.getCustomer(this.customerId).then(() => {
        getCustomerContactsListByCustomer({customerId: this.customerId}).then(r => {
          this.form.customerContacts = r.data
          let list = this.form.customerContacts.map(item => item.userid);
          if(list.length >0){
            memberUserList({ids:list.join(',')}).then(r=>{
              this.selectMemberList = r.data
            })
          }
          if(this.form.promoter){
           getCustomerList({ids:this.form.promoter}).then(r => {
             this.recommended = r.data;
           })
         }
        })

        // 打开重泡货开关
        if(this.form.weightUnit){
          this.showZhong = true
        }
        if(this.form.lightUnit){
          this.showPao = true
        }

        // 获取重泡货路线
        getCustomerLines(this.customerId).then(res => {
          this.zhongLines = res.data.filter(item => item.zhongPaoType == 1)
          this.paoLines = res.data.filter(item => item.zhongPaoType == 2)
          if(this.zhongLines.length)this.showZhong1 = true
          if(this.paoLines.length) this.showPao1 = true
          // /admin-api/customer-line/get-by-customer
          // /admin-api/customer-line/get-by-customer?customerId=29564
        })
      })
    } else {
      this.getZhongPao()
      // 新建客户
      this.handleAddContact()
      if(this.isCustomerServiceConfirmed){
        this.form.customerService = this.userId
      }
    }

    getNodeList().then(r => {
      this.nodeList = r.data
    })
    getProductTypeList().then(r => {
      this.productTypeList = r.data
    })
    getProductList().then(r => {
      this.productList = r.data
    })
    getTradeCityList({type: 1}).then(r => {
      this.importCityList = r.data.filter(item => item.type === '1')
    })
    getWarehouseList().then(r => {
      this.warehouseList = r.data
    })
    listServiceUser().then(r => {
      this.serviceUserList = r.data
    })
    getCountryListAll().then(r => {
      this.countryList = r.data
    })
  },
  data(){
    return {
      isCustomerServiceConfirmed:false,
      getDictDatas,
      DICT_TYPE,

      // 表单参数
      form: {},
      // 表单校验
      rules: {
        name: [{ required: true, message: this.$t('客户名称不能为空'), trigger: "blur" }],
        country: [{ required: true, message: this.$t('国家不能为空'), trigger: "blur" }],
        level: [{ required: true, message: this.$t('客户等级不能为空'), trigger: "blur" }],
        type: [{ required: true, message: this.$t('客户类别不能为空'), trigger: "blur" }],
        createTime: [{ required: true, message: this.$t('创建时间不能为空'), trigger: "blur" }],
        source: [{ required: true, message: this.$t('客户来源不能为空'), trigger: "blur" }],
        customerService: [{ required:this.customerId === '0', message: this.$t('客户经理不能为空'), trigger: "blur" }],
        status: [{ required: true, message: this.$t('客户状态不能为空'), trigger: "blur" }],


      },
      contactRules: {
        name: [{ required: true, message: this.$t('请输入联系人'), trigger: "blur" }],
        areaCode: [{ required: true, message: this.$t('请选择区号'), trigger: "change" }],
        phoneNew: [{
          required: true,
          trigger: "blur",
          validator: this.phoneValidator
        }],
      },
      // 网点
      nodeList: [],
      productTypeList: [],
      productList: [],
      showZhong: false,
      showZhong1: false,
      showPao: false,
      showPao1: false,
      warehouseList: [], // 仓库列表
      importCityList: [], // 进口地址
      customerSelect: [],
      recommended:[],
      serviceUserList: [],
      countryList: [],

      zhongLines: [], // 重货线路
      paoLines: [], // 泡货线路
      memberList:[],//会员列表
      selectMemberList:[]//选中会员列表
    }
  },

  methods: {
    /* getUserMemberUserFn(val){
      userMemberUserList({pageNo:1,pageSize:100,searchKey:val}).then(r => {
        this.memberList = r.data.list
      })
    }, */
    remoteMethod(val){
      this.getCustomerSelect(val);
    },
    getCustomerSelect(val = ''){
      getCustomerSelect({pageNo:1,pageSize:30,searchKey:val}).then(res => {
            this.customerSelect = res.data.list
      })
    },
    phoneValidator(rule, value, callback){
      if (!value) {
        return callback(new Error(this.$t('请输入联系方式')));
      }
      validatorMobile({
        code: this.form.customerContacts.find(e => e.phoneNew === value).areaCode,
        mobile: value
      }).then(r => {
        if (r.data){
          callback()
        } else {
          callback(new Error(r.msg || this.$t('手机号验证失败')))
        }
      }).catch(e => {
        console.error(e)
        callback(new Error(this.$t('手机号验证失败')))
      })
    },
    handleDefaultChange($index){
      // 只有一个联系人，设置成非默认
      if (this.form.customerContacts.length === 1 && this.form.customerContacts[0].isDefault === 0){
        this.$modal.msgWarning(this.$t('至少拥有一个默认联系人'))
        this.form.customerContacts[0].isDefault = 1
        return
      }

      // 设置默认联系人
      if (this.form.customerContacts[$index].isDefault === 1) {
        // 其他的置否
        let i = 0
        this.form.customerContacts.forEach(e => {
          if (i !== $index){
            e.isDefault = 0
          }
          i++
        })
      } else {
        // 第一个置是
        this.form.customerContacts[0].isDefault = 1
      }
    },
    /* selectBD(val){
      if(!val){
        return
      }
      let i = this.selectMemberList.find(item => item.id === val);
      if(i === undefined){
        this.selectMemberList.push(this.memberList.find(item => item.id === val))
      }
      // this.getUserMemberUserFn()
    }, */
    /** 取消按钮 */
    cancel() {
      this.$tab.closePage()
      this.open = false;
      this.reset();
    },
    /** 提交按钮 */
    submitForm() {
      if(this.form.customerContacts.length === 0){
        this.$modal.alert(this.$t('至少添加一位联系人'))
        return
      }
      this.$refs["contactForm"].validate((valid1,err1) => {
        this.$refs["form"].validate((valid2,err2) => {
          if (!valid1 || !valid2) {
            this.$showFormValidateErrors({...err1,...err2})
            return;
          }
          if (this.form.customerContacts.length === 0){
              this.$modal.msgError(this.$t('至少填写一个联系人信息'));
            return
          }

          const form = {...this.form, type: this.form.type?.join(','), transportType: (this.form.transportType || [])?.join(','), taxRate: Number(this.form.taxRate)}

          // 检查路线是否启用了但是没选择目的仓
          let errors = 0
          form.customerLines.forEach(line => {
            if(!line.objectiveIds || line.objectiveIds == ''){
              errors ++
            }
          })
          if(errors){
            return this.$message.error('有两条路线未选择目的地')
          }
          //我的客户页面跳转直接，完善客户
          if(this.isCustomerServiceConfirmed){
            form.isCustomerServiceConfirmed = this.isCustomerServiceConfirmed;
          }
          // 修改的提交
          if (this.form.id != null) {
            this.form.customerContacts.forEach(e => {
              e.customerId = this.customerId
            })
             if(this.$route.name === 'perfect'){
               fillupCustomeInfo(form).then(r => {
                 this.$modal.msgSuccess(this.$t('修改成功'));
                 this.open = false;
                 const obj = { path: "/customer/customer" };
                 this.$tab.closeOpenPage(obj);
               })
             }else {
               updateCustomer(form).then(response => {
                 this.$modal.msgSuccess(this.$t('修改成功'));
                 this.open = false;
                 // this.getList();
                 const obj = { path: "/customer/customer" };
                 this.$tab.closeOpenPage(obj);
               })
             }

            return;
          }
          // 添加的提交
          createCustomer(form).then(response => {
            this.$modal.msgSuccess(this.$t('新增成功'));
            this.open = false;
            // this.getList();
            const obj = { path: "/customer/customer" };
            this.$tab.closeOpenPage(obj);
          })
        });
      })
    },
    /** 表单重置 */
    reset() {
      this.form = {
        id: undefined,
        number: undefined,
        name: undefined,
        level: 1,
        country: undefined,
        type: undefined,
        transportType:[],
        agentId: undefined,
        company: undefined,
        address: undefined,
        productType: undefined,
        productId: undefined,
        pickupPoint: undefined,
        memberId: undefined,
        birthday: undefined,
        balance: undefined,
        source: undefined,
        picture: undefined,
        customerService: undefined,
        customerContacts: [],
        customerLines: [],
        lightUnit: undefined,
        promoter: undefined,
        status: 1,
        founder: this.$store.getters.userId,
        department: undefined,
        invoiceTitle: undefined,
        licenseNumber: undefined,
        bank: undefined,
        bankNumber: undefined,
        project: undefined,
        billingAddress: undefined,
        billingTell: undefined,
        taxRate: undefined,
        remarks: undefined,
        arrivalConfirm: undefined,
        weightUnit: undefined,
        createTime: undefined,
        isShowTidanPrice:true,
      };
      this.form.createTime = (new Date()).getTime()
      this.resetForm("form");
    },
    getCustomer(id) {
      return getCustomer(id).then(response => {
        this.form = { ...this.form, ...response.data, id: this.customerId };
        this.open = true;
        this.title = this.$t('修改客户');
        this.getZhongPao()
      });
    },
    updateCustomerLines() {
      let zhongLines = [], paoLines = []
      if (this.zhongLines.length > 0) {
        zhongLines = this.zhongLines
      }
      if (this.paoLines.length > 0) {
        paoLines = this.paoLines
      }
      this.form.customerLines = [...zhongLines, ...paoLines]
    },
    handleAddContact() {
      this.form.customerContacts.push({
        "areaCode": "",
        // "customerId": 0,
        "department": "",
        "email": "",
        "isDefault": this.form.customerContacts.length === 0 ? 1 : 0,
        "name": "",
        "phoneNew": "",
        "position": "",
        "social": undefined,
        "socialNumber": "",
        "userid": undefined,
        // "username": ""
      })
    },
    handleDeleteContact($index){
      this.form.customerContacts.splice($index, 1)
      if (this.form.customerContacts.length > 0) {
        this.$refs['contactForm'].clearValidate()

        if (!this.form.customerContacts.find(e => e.isDefault)){
          this.form.customerContacts[0].isDefault = 1
        }
      }
    },
    getZhongPao(){
      getZhongPaoBest({
        customerId: this.customerId,
        // departureId: this.departureId,
        // objectiveId: this.objectiveId
      }).then(r => {
        if(!this.form.weightUnit) this.form.weightUnit = r.data.zhongEdge
        if(!this.form.lightUnit) this.form.lightUnit = r.data.paoEdge
      })
    }
  },
  computed: {
    isChinese(){
      return this.$i18n.locale === 'zh_CN'
    },
    userId(){
      return  this.$store.state.user.id
    },
    /* userMemberUser(){
     let list = this.memberList.filter(item => {
        return this.selectMemberList.findIndex(i => i.id === item.id) < 0
      })
      return [...this.selectMemberList,...list]
    }, */
    productListFilter(){
      return this.productList.filter((p) => p.typeId === this.form.productType)
    },
    customerSelectFn(){
          if(this.recommended.length > 0){
            let i = this.customerSelect.find(item => item.id === this.recommended[0].id)
            if(!i){
              this.customerSelect.push(this.recommended[0])
            }
            return this.customerSelect
          }else {
            return this.customerSelect
          }
    }
  },
  watch: {
    zhongLines() {
      console.log('zhongLines', this.zhongLines)
      this.updateCustomerLines()
    },
    paoLines() {
      console.log('paoLines', this.paoLines)
      this.updateCustomerLines()
    }
  }
}
</script>

<style scoped lang="scss">
::v-deep .el-table__cell {
  padding-bottom: 0;
  .cell {
    .el-form-item {
      margin-bottom: 9px;
    }

    .el-form-item__error {
      z-index: 1;
      padding-top: 0;
      top: 32px;
    }
  }
}
</style>