ccl_plm-vue/src/views/modules/customer/customerInformationManagement.vue

<template>
  <div class="mod-config">
    <!-- 查询条件 -->
    <el-form :inline="true" label-position="top" :model="searchData" @keyup.enter.native="getDataList">
      <el-form-item :label="'客户代码'">
        <el-input v-model="searchData.customerNo" clearable style="width: 120px"></el-input>
      </el-form-item>
      <el-form-item :label="'客户名称'">
        <el-input v-model="searchData.customerDesc" clearable style="width: 120px"></el-input>
      </el-form-item>
      <el-form-item :label="'客户状态'">
        <el-select v-model="searchData.customerStatus" style="width: 120px">
          <el-option label="全部" value=""></el-option>
          <el-option label="启用" value="Y"></el-option>
          <el-option label="停用" value="N"></el-option>
        </el-select>
      </el-form-item>
      <el-form-item :label="' '">
        <el-button @click="getDataList">查询</el-button>
        <el-button type="primary" @click="addModal">新增</el-button>
        <el-button type="primary" @click="delModal">删除</el-button>
        <download-excel
          :fields="fields()"
          :data="exportData"
          type="xls"
          :name="exportName"
          :header="exportHeader"
          :footer="exportFooter"
          :fetch="createExportData"
          :before-generate="startDownload"
          :before-finish="finishDownload"
          worksheet="导出信息"
          class="el-button el-button--primary el-button--medium">
          {{ "导出" }}
        </download-excel>
      </el-form-item>
    </el-form>

    <!-- 客户列表 -->
    <el-table
      :height="height - 15"
      :data="dataList"
      border
      ref="customerTable"
      :row-style="rowStyle"
      @row-click="customerClickRow"
      @selection-change="selectionCustomer"
      @current-change="changeCurrentRow"
      style="width: 100%;">
      <el-table-column
        type="selection"
        header-align="center"
        align="center"
        width="50">
      </el-table-column>
      <el-table-column
        v-for="(item,index) in columnList" :key="index"
        :sortable="item.columnSortable"
        :prop="item.columnProp"
        :header-align="item.headerAlign"
        :show-overflow-tooltip="item.showOverflowTooltip"
        :align="item.align"
        :fixed="item.fixed === ''?false:item.fixed"
        :min-width="item.columnWidth"
        :label="item.columnLabel">
        <template slot-scope="scope">
          <span v-if="!item.columnHidden">{{ scope.row[item.columnProp] }}</span>
          <span v-if="item.columnImage"><img :src="scope.row[item.columnProp]"
                                             style="width: 100px; height: 80px"/></span>
        </template>
      </el-table-column>
      <el-table-column
        fixed="right"
        header-align="center"
        align="center"
        width="100"
        label="操作">
        <template slot-scope="scope">
          <el-link style="cursor: pointer" @click="updateModal(scope.row)">编辑</el-link>
          <el-link style="cursor: pointer" @click="detailModal(scope.row)">详情</el-link>
        </template>
      </el-table-column>
    </el-table>

    <!-- 分页插件 -->
    <el-pagination
      @size-change="sizeChangeHandle"
      @current-change="currentChangeHandle"
      :current-page="pageIndex"
      :page-sizes="[20, 50, 100, 200, 500]"
      :page-size="pageSize"
      :total="totalPage"
      layout="total, sizes, prev, pager, next, jumper">
    </el-pagination>

    <!-- 客户模态框 -->
    <el-dialog :title="modalData.title" :close-on-click-modal="false" v-drag :visible.sync="modalFlag" width="500px">
      <el-form :inline="true" label-position="top" :model="modalData" :rules="rules"
               style="margin-left: 7px;margin-top: -5px;">
        <el-form-item label="客户代码" prop="customerNo" :rules="rules.customerNo">
          <el-input v-model="modalData.customerNo" :disabled="modalDisableFlag" style="width: 222px"></el-input>
        </el-form-item>
        <el-form-item label="客户名称" prop="customerDesc" :rules="rules.customerDesc">
          <el-input v-model="modalData.customerDesc" :readonly="detailModalFlag" style="width: 222px"></el-input>
        </el-form-item>
      </el-form>
      <el-form :inline="true" label-position="top" :model="modalData" style="margin-left: 7px;margin-top: -5px;">
        <el-form-item label="年营业额">
          <el-input class="inlineNumber numInput" v-model="modalData.turnoverOfYear" :readonly="detailModalFlag"
                    type="number" style="width: 222px"></el-input>
        </el-form-item>
        <el-form-item label="年预估投入">
          <el-input class="inlineNumber numInput" v-model="modalData.potentialRevenueOfYear" :readonly="detailModalFlag"
                    type="number" style="width: 222px"></el-input>
        </el-form-item>
      </el-form>
      <el-form :inline="true" label-position="top" :model="modalData" :rules="rules"
               style="margin-left: 7px;margin-top: -5px;">
        <el-form-item label="行业">
          <dict-data-select v-if="modalFlag" v-model="modalData.customerIndustry" :disabled="detailModalFlag"
                            style="width: 222px"
                            dict-type="plm_customer_information_customer_industry"></dict-data-select>
        </el-form-item>
        <el-form-item label="币种" prop="customerCurrency" :rules="rules.customerCurrency">
          <dict-data-select v-if="modalFlag" v-model="modalData.customerCurrency" :disabled="detailModalFlag"
                            style="width: 222px"
                            dict-type="plm_customer_information_customer_customer_currency"></dict-data-select>
        </el-form-item>
      </el-form>
      <!--      <el-form :inline="true" label-position="top" :model="modalData" :rules="rules" style="margin-left: 7px;margin-top: -5px;">-->
      <!--        <el-form-item label="联系人" prop="contactName" :rules="rules.contactName">-->
      <!--          <el-input v-model="modalData.contactName" :readonly="detailModalFlag" style="width: 222px"></el-input>-->
      <!--        </el-form-item>-->
      <!--        <el-form-item label="联系电话" prop="contactPhoneNumber1" :rules="rules.contactPhoneNumber1">-->
      <!--          <el-input v-model="modalData.contactPhoneNumber1" :readonly="detailModalFlag" style="width: 222px"></el-input>-->
      <!--        </el-form-item>-->
      <!--      </el-form>-->
      <!--      <el-form :inline="true" label-position="top" :model="modalData" style="margin-left: 7px;margin-top: -5px;">-->
      <!--        <el-form-item label="公司名称">-->
      <!--          <el-input v-model="modalData.companyName" :readonly="detailModalFlag" style="width: 457px"></el-input>-->
      <!--        </el-form-item>-->
      <!--      </el-form>-->
      <!--      <el-form :inline="true" label-position="top" :model="modalData" style="margin-left: 7px;margin-top: -5px;">-->
      <!--        <el-form-item label="岗位描述">-->
      <!--          <el-input v-model="modalData.jobDescription" :readonly="detailModalFlag" style="width: 457px"></el-input>-->
      <!--        </el-form-item>-->
      <!--      </el-form>-->
      <!--      <el-form :inline="true" label-position="top" :model="modalData" style="margin-left: 7px;margin-top: -5px;">-->
      <!--        <el-form-item label="联系地址">-->
      <!--          <el-input v-model="modalData.addressName" :readonly="detailModalFlag" style="width: 457px"></el-input>-->
      <!--        </el-form-item>-->
      <!--      </el-form>-->
      <!--      <el-form :inline="true" label-position="top" :model="modalData" style="margin-left: 7px;margin-top: -5px;">-->
      <!--        <el-form-item label="备注信息">-->
      <!--          <el-input v-model="modalData.remark" :readonly="detailModalFlag" style="width: 457px"></el-input>-->
      <!--        </el-form-item>-->
      <!--      </el-form>-->
      <el-form :inline="true" label-position="top" :model="modalData" style="margin-left: 7px;margin-top: -5px;">
        <el-form-item>
          <span style="cursor: pointer" slot="label" @click="getBaseList(120)"><a herf="#">客户组1</a></span>
          <el-input v-model="modalData.customerGroupId1" @blur="customerGroupBlur(120)" style="width: 124px"></el-input>
          <el-input v-model="modalData.customerGroupName1" disabled style="width: 330px"></el-input>
        </el-form-item>
        <el-form-item>
          <span style="cursor: pointer" slot="label" @click="getBaseList(121)"><a herf="#">客户组2</a></span>
          <el-input v-model="modalData.customerGroupId2" @blur="customerGroupBlur2(121)"
                    style="width: 124px"></el-input>
          <el-input v-model="modalData.customerGroupName2" disabled style="width: 330px"></el-input>
        </el-form-item>
      </el-form>
      <el-form :inline="true" label-position="top" :model="modalData" :rules="rules"
               style="margin-left: 7px;margin-top: -5px;">
        <el-form-item label="重要程度" prop="importantCustomer" :rules="rules.importantCustomer">
          <dict-data-select v-if="modalFlag" v-model="modalData.importantCustomer" :disabled="detailModalFlag"
                            style="width: 145px" dict-type="plm_customer_information_important_customer">
          </dict-data-select>
        </el-form-item>
        <el-form-item label="客户状态" prop="customerStatus" :rules="rules.customerStatus">
          <el-select v-model="modalData.customerStatus" :disabled="detailModalFlag" style="width: 140px">
            <el-option label="启用" value="Y"></el-option>
            <el-option label="停用" value="N"></el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="客户类型" prop="customerStatus" :rules="rules.customerType">
          <el-select v-model="modalData.customerType" :disabled="detailModalFlag" style="width: 145px">
            <el-option label="潜在客户" value="潜在客户"></el-option>
            <el-option label="正式客户" value="正式客户"></el-option>
          </el-select>
        </el-form-item>
      </el-form>
      <el-form :inline="true" label-position="top" :model="modalData" style="margin-left: 7px;margin-top: -5px;">
        <el-form-item label="客户描述">
          <el-input
            type="textarea"
            v-model="modalData.customerDescription"
            readonly
            :rows="2"
            resize='none'
            show-word-limit
            :readonly="detailModalFlag"
            style="width: 457px;height: 20px">
          </el-input>
        </el-form-item>
      </el-form>
      <el-form :inline="true" label-position="top" :model="modalData" style="margin-left: 7px;margin-top: -2px;">-->
        <el-form-item label="客户地址">
          <el-input v-model="modalData.addressName" :readonly="detailModalFlag" style="width: 457px"></el-input>
        </el-form-item>
      </el-form>
      <el-footer style="height:40px;margin-top: 20px;text-align:center">
        <el-button v-if="modalData.flag !== '3'" type="primary" @click="saveData()">保存</el-button>
        <el-button type="primary" @click="modalFlag = false">关闭</el-button>
      </el-footer>
    </el-dialog>

    <!-- 客户联系人模态框 -->
    <el-dialog :title="contactModalData.title" :close-on-click-modal="false" v-drag :visible.sync="contactModalFlag"
               width="500px">
      <el-form :inline="true" label-position="top" :model="contactModalData" :rules="contactRules"
               style="margin-left: 7px;margin-top: -5px;">
        <el-form-item label="联系人" prop="contactName" :rules="contactRules.contactName">
          <el-input v-model="contactModalData.contactName" style="width: 222px"></el-input>
        </el-form-item>
        <el-form-item label="座机">
          <el-input v-model="contactModalData.contactLandlineNumber" :readonly="contactDetailModalFlag"
                    style="width: 222px"></el-input>
        </el-form-item>
      </el-form>
      <el-form :inline="true" label-position="top" :model="contactModalData" :rules="contactRules"
               style="margin-left: 7px;margin-top: -5px;">
        <el-form-item label="联系电话(1)" prop="contactPhoneNumber1" :rules="contactRules.contactPhoneNumber1">
          <el-input v-model="contactModalData.contactPhoneNumber1" :readonly="contactDetailModalFlag"
                    style="width: 222px"></el-input>
        </el-form-item>
        <el-form-item label="联系电话(2)">
          <el-input v-model="contactModalData.contactPhoneNumber2" :readonly="contactDetailModalFlag"
                    style="width: 222px"></el-input>
        </el-form-item>
      </el-form>
      <el-form :inline="true" label-position="top" :model="contactModalData" :rules="contactRules"
               style="margin-left: 7px;margin-top: -5px;">
        <el-form-item label="联系电话(3)">
          <el-input v-model="contactModalData.contactPhoneNumber3" :readonly="contactDetailModalFlag"
                    style="width: 222px"></el-input>
        </el-form-item>
        <el-form-item label="公司职务">
          <el-input v-model="contactModalData.position" :readonly="contactDetailModalFlag"
                    style="width: 222px"></el-input>
        </el-form-item>
      </el-form>
      <el-form :inline="true" label-position="top" :model="contactModalData" :rules="contactRules"
               style="margin-left: 7px;margin-top: -5px;">
        <el-form-item label="部门">
          <el-input v-model="contactModalData.departmentName" :readonly="contactDetailModalFlag"
                    style="width: 144px"></el-input>
        </el-form-item>
        <el-form-item label="默认联系人" prop="primaryContact" :rules="contactRules.primaryContact">
          <el-select v-model="contactModalData.primaryContact" :disabled="contactDetailModalFlag" style="width: 143px">
            <el-option label="是" value="Y"></el-option>
            <el-option label="否" value="N"></el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="状态" prop="contactStatus" :rules="contactRules.contactStatus">
          <el-select v-model="contactModalData.contactStatus" :disabled="contactDetailModalFlag" style="width: 144px">
            <el-option label="启用" value="启用"></el-option>
            <el-option label="停用" value="停用"></el-option>
          </el-select>
        </el-form-item>
      </el-form>
      <el-form :inline="true" label-position="top" :model="contactModalData" style="margin-left: 7px;margin-top: -5px;">
        <el-form-item label="邮箱">
          <el-input v-model="contactModalData.mailbox" :readonly="contactDetailModalFlag"
                    style="width: 457px"></el-input>
        </el-form-item>
      </el-form>
      <el-form :inline="true" label-position="top" :model="contactModalData" style="margin-left: 7px;margin-top: -5px;">
        <el-form-item label="备注信息">
          <el-input
            type="textarea"
            v-model="contactModalData.remark"
            readonly
            :rows="2"
            resize='none'
            show-word-limit
            :readonly="contactDetailModalFlag"
            style="width: 457px;height: 20px">
          </el-input>
        </el-form-item>
      </el-form>
      <!--      <el-form :inline="true" label-position="top" :model="contactModalData" style="margin-left: 7px;margin-top: -5px;">-->
      <!--        <el-form-item label="备注信息">-->
      <!--          <el-input v-model="contactModalData.remark" :readonly="contactDetailModalFlag" style="width: 457px"></el-input>-->
      <!--        </el-form-item>-->
      <!--      </el-form>-->
      <el-footer style="height:40px;margin-top: 34px;text-align:center">
        <el-button v-if="contactModalData.flag !== '3'" type="primary" @click="saveContactData()">保存</el-button>
        <el-button type="primary" @click="contactModalFlag = false">关闭</el-button>
      </el-footer>
    </el-dialog>

    <!-- 客户联系地址模态框 -->
    <el-dialog :title="addressModalData.title" :close-on-click-modal="false" v-drag :visible.sync="addressModalFlag" width="500px">
      <el-form label-position="top" :model="addressModalData" :rules="addressRules">
        <el-row :gutter="10">
          <el-col :span="8">
            <el-form-item label="地址类型" prop="addressType" :rules="addressRules.addressType">
              <dict-data-select v-if="addressModalFlag" v-model="addressModalData.addressType"
                                :disabled="addressDetailModalFlag"
                                dict-type="plm_customer_address_address_type"></dict-data-select>
            </el-form-item>
          </el-col>
          <el-col :span="16">
            <el-form-item label="公司名称">
              <el-input v-model="addressModalData.companyName" :readonly="addressDetailModalFlag"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="24">
            <el-form-item label="地址" prop="addressName" :rules="addressRules.addressName">
              <el-input v-model="addressModalData.addressName"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="状态" prop="addressStatus" :rules="addressRules.addressStatus">
              <el-select v-model="addressModalData.addressStatus" style="width: 100%" :disabled="addressDetailModalFlag">
                <el-option label="启用" value="启用"></el-option>
                <el-option label="停用" value="停用"></el-option>
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label=" " >
              <el-checkbox v-model="addressModalData.defaultAddress" false-label="N" true-label="Y"
                           :disabled="addressDetailModalFlag">默认地址</el-checkbox>
            </el-form-item>
          </el-col>
          <el-col :span="24">
            <el-form-item label="备注信息">
              <el-input type="textarea" v-model="addressModalData.remark" :rows="3" :readonly="addressDetailModalFlag" resize='none' show-word-limit></el-input>
            </el-form-item>
          </el-col>
        </el-row>
      </el-form>
      <el-footer style="height:42px;margin-top: 53px;text-align:center">
        <el-button v-if="addressModalData.flag !== '3'" type="primary" @click="saveAddressData()">保存</el-button>
        <el-button type="primary" @click="addressModalFlag = false">关闭</el-button>
      </el-footer>
    </el-dialog>

    <!-- 客户项目信息模态框 -->
    <el-dialog :title="projectInformationModalData.title" :close-on-click-modal="false" v-drag
               :visible.sync="projectInformationModalFlag" width="40%">
      <el-form ref="saveForm" :model="projectInformationModalData" label-position="top" label-width="100px"
               :rules="projectInformationModalData">
        <el-row :gutter="25">
          <el-col :span="6">
            <el-form-item label="项目号">
              <el-input readonly v-model="projectInformationModalData.projectId" disabled></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="项目名称" prop="projectName">
              <el-input readonly v-model="projectInformationModalData.projectName"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="6">
            <el-form-item prop="projectTypeDb" label="项目类型">
              <dict-data-select disabled dict-type="project_info_type_db" v-if="projectInformationModalFlag"
                                v-model="projectInformationModalData.projectTypeDb"></dict-data-select>
            </el-form-item>
          </el-col>
          <el-col :span="6">
            <el-form-item prop="projectSource" :rules="projectInformationModalData.projectSourceDesc" label="项目来源">
              <dict-data-select disabled dict-type="project_info_source" v-if="projectInformationModalFlag"
                                v-model="projectInformationModalData.projectSource"></dict-data-select>
            </el-form-item>
          </el-col>
          <el-col :span="6">
            <el-form-item prop="priority" label="优先级">
              <dict-data-select disabled dict-type="project_info_priority" v-if="projectInformationModalFlag"
                                v-model="projectInformationModalData.priority"></dict-data-select>
            </el-form-item>
          </el-col>
          <el-col :span="6">
            <el-form-item label="要求日期：" prop="needDate">
              <el-date-picker
                style="width: 100%"
                readonly
                v-model="projectInformationModalData.needDate"
                type="date"
                value-format="yyyy-MM-dd"
                placeholder="选择日期">
              </el-date-picker>
            </el-form-item>
          </el-col>
          <el-col :span="6">
            <el-form-item prop="projectManagerName" :rules="projectInformationModalData.projectManagerName"
                          label="项目经理">
              <el-input v-model="projectInformationModalData.projectManagerName" readonly></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="6">
            <el-form-item prop="projectOwnerName" :rules="projectInformationModalData.projectOwnerName"
                          label="项目负责人">
              <el-input v-model="projectInformationModalData.projectOwnerName" readonly></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="6">
            <el-form-item label="直接客户">
              <el-input v-model="projectInformationModalData.customerId"  readonly></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item prop="customerName" label="直接客户名称：">
              <el-input v-model="projectInformationModalData.customerName" readonly ></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="6">
            <el-form-item label="终端客户：">
              <el-input v-model="projectInformationModalData.finalCustomerId"  readonly></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="终端客户名称：">
              <el-input v-model="projectInformationModalData.finalCustomerName" readonly ></el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-form-item label="项目描述" style="height: 70px">
          <el-input type="textarea" readonly resize="none" :autosize="{minRows: 2, maxRows: 2}"
                    v-model="projectInformationModalData.projectDesc"></el-input>
        </el-form-item>
        <el-form-item label="客户应用/要求" style="height: 70px">
          <el-input type="textarea" readonly resize="none" :autosize="{minRows: 2, maxRows: 2}"
                    v-model="projectInformationModalData.customerRemark"></el-input>
        </el-form-item>
        <el-form-item label="其他要求" style="height: 70px">
          <el-input type="textarea" readonly resize="none" :autosize="{minRows: 2, maxRows: 2}"
                    v-model="projectInformationModalData.remark"></el-input>
        </el-form-item>
        <el-form-item prop="userRoleName" :rules="projectInformationRules.userRoleName" label="项目权限">
          <el-input readonly v-model="projectInformationModalData.userRoleName"></el-input>
        </el-form-item>
      </el-form>
      <el-footer style="height:40px;margin-top: 10px;text-align:center">
        <el-button v-if="projectInformationModalData.flag !== '3'" type="primary" @click="saveProjectInformationData()">
          保存
        </el-button>
        <el-button type="primary" @click="projectInformationModalFlag = false">关闭</el-button>
      </el-footer>
    </el-dialog>

    <!-- 页签 -->
    <el-tabs v-model="activeTable" style="margin-top: 0px; width: 100%; height: 100%;" type="border-card"
             @tab-click="tabClick" class="customer-tab">
      <!-- 联系人页签 -->
      <el-tab-pane label="联系人" name="customer_contact">
        <el-form label-position="top" style="margin-top: 5px; margin-left: 0px;">
          <el-form :inline="true" label-position="top" style="margin-top: 5px">
            <el-button type="primary" @click="contactSaveModal()">新增</el-button>
            <el-button type="primary" @click="contactDeleteModal()">删除</el-button>
          </el-form>
        </el-form>
        <el-table
          :data="contactList"
          :height="secondHeight"
          border
          ref="contactTable"
          @row-click="contactClickRow"
          @selection-change="selectionContact"
          style="width: 100%; ">
          <el-table-column
            type="selection"
            header-align="center"
            align="center"
            width="50">
          </el-table-column>
          <el-table-column
            v-for="(item,index) in customerContactArray" :key="index"
            :sortable="item.columnSortable"
            :prop="item.columnProp"
            :header-align="item.headerAlign"
            :show-overflow-tooltip="item.showOverflowTooltip"
            :align="item.align"
            :fixed="item.fixed === '' ? false : item.fixed"
            :min-width="item.columnWidth"
            :label="item.columnLabel">
            <template slot-scope="scope">
              <span v-if="!item.columnHidden">{{ scope.row[item.columnProp] }}</span>
              <span v-if="item.columnImage"><img :src="scope.row[item.columnProp]" style="width: 100px; height: 80px"/></span>
            </template>
          </el-table-column>
          <el-table-column
            fixed="right"
            header-align="center"
            align="center"
            width="100"
            label="操作">
            <template slot-scope="scope">
              <el-link style="cursor: pointer" @click="updateContactModal(scope.row)">编辑</el-link>
              <el-link style="cursor: pointer" @click="detailContactModal(scope.row)">详情</el-link>
            </template>
          </el-table-column>
        </el-table>
      </el-tab-pane>
      <!-- 联系地址页签 -->
      <el-tab-pane label="联系地址" name="customer_address">
        <el-form :inline="true" label-position="top" style="margin-top: 5px">
          <el-button type="primary" @click="addressSaveModal()">新增</el-button>
          <el-button type="primary" @click="addressDeleteModal()">删除</el-button>
        </el-form>
        <el-table
          :data="addressList"
          :height="secondHeight"
          border
          ref="addressTable"
          @row-click="addressClickRow"
          @selection-change="selectionAddress"
          style="width: 100%;">
          <el-table-column
            type="selection"
            header-align="center"
            align="center"
            width="50">
          </el-table-column>
          <el-table-column
            v-for="(item,index) in customerAddressArray" :key="index"
            :sortable="item.columnSortable"
            :prop="item.columnProp"
            :header-align="item.headerAlign"
            :show-overflow-tooltip="item.showOverflowTooltip"
            :align="item.align"
            :fixed="item.fixed === '' ? false : item.fixed"
            :min-width="item.columnWidth"
            :label="item.columnLabel">
            <template slot-scope="scope">
              <span v-if="!item.columnHidden">{{ scope.row[item.columnProp] }}</span>
              <span v-if="item.columnImage"><img :src="scope.row[item.columnProp]" style="width: 100px; height: 80px"/></span>
            </template>
          </el-table-column>
          <el-table-column
            fixed="right"
            header-align="center"
            align="center"
            width="100"
            label="操作">
            <template slot-scope="scope">
              <el-link style="cursor: pointer" @click="updateAddressModal(scope.row)">编辑</el-link>
              <el-link style="cursor: pointer" @click="detailAddressModal(scope.row)">详情</el-link>
            </template>
          </el-table-column>
        </el-table>
      </el-tab-pane>
      <!-- 项目信息页签 -->
      <el-tab-pane label="项目信息" name="project_information">
        <el-form :inline="true" label-position="top" style="margin-top: 5px">
          <el-button type="primary" @click="projectInformationSaveModal()">新增</el-button>
        </el-form>
        <el-table
          :data="projectInformationList"
          :height="secondHeight"
          border
          ref="projectInformationTable"
          @row-click="projectInformationClickRow"
          @selection-change="selectionProjectInformation"
          style="width: 100%;">
          <el-table-column
            type="selection"
            header-align="center"
            align="center"
            width="50">
          </el-table-column>
          <el-table-column
            header-align="center"
            align="left"
            prop="projectId"
            width="160"
            label="项目号">
            <template slot-scope="{row,$index}">
              <el-link style="cursor: pointer" @click="clickProjectId(row.projectId)">{{ row.projectId }}</el-link>
            </template>
          </el-table-column>
          <el-table-column
            v-for="(item,index) in projectInformationArray" :key="index"
            :sortable="item.columnSortable"
            :prop="item.columnProp"
            :header-align="item.headerAlign"
            :show-overflow-tooltip="item.showOverflowTooltip"
            :align="item.align"
            :fixed="item.fixed === '' ? false : item.fixed"
            :min-width="item.columnWidth"
            :label="item.columnLabel">
            <template slot-scope="scope">
              <span v-if="!item.columnHidden">{{ scope.row[item.columnProp] }}</span>
              <span v-if="item.columnImage"><img :src="scope.row[item.columnProp]" style="width: 100px; height: 80px"/></span>
            </template>
          </el-table-column>
          <el-table-column
            fixed="right"
            header-align="center"
            align="center"
            width="100"
            label="操作">
            <template slot-scope="scope">
              <el-link style="cursor: pointer" @click="updateProjectInformationModal(scope.row)">编辑</el-link>
              <el-link style="cursor: pointer" @click="detailProjectInformationModal(scope.row)">详情</el-link>
            </template>
          </el-table-column>
        </el-table>
      </el-tab-pane>
    </el-tabs>

    <!-- 项目经理选择模态框 -->
    <el-dialog
      width="620px"
      title="项目经理"
      :close-on-click-modal="false"
      :visible.sync="managerFlag">
      <el-transfer
        ref="managerTransfer"
        v-model="projectManagerList"
        :props="{key: 'operatorId',label: 'operatorName'}"
        :data="operatorList"
        :titles="['未选择', '已选择']">
      </el-transfer>
      <span slot="footer" class="dialog-footer">
        <div style="margin-top: 5px">
          <el-button type="primary" @click="saveManagerList()">确定</el-button>
          <el-button type="primary" @click="managerFlag=false">取消</el-button>
        </div>
    </span>
    </el-dialog>

    <!-- 项目负责人选择模态框 -->
    <el-dialog
      width="620px"
      title="项目负责人"
      :close-on-click-modal="false"
      :visible.sync="ownerFlag">
      <el-transfer
        ref="ownerTransfer"
        v-model="projectOwnerList"
        :props="{key: 'operatorId',label: 'operatorName'}"
        :data="operatorList"
        :titles="['未选择', '已选择']">
      </el-transfer>
      <span slot="footer" class="dialog-footer">
        <div style="margin-top: 5px">
          <el-button type="primary" @click="saveOwnerList()">确定</el-button>
          <el-button type="primary" @click="ownerFlag=false">取消</el-button>
        </div>
    </span>
    </el-dialog>

    <!-- 项目权限选择模态框 -->
    <el-dialog
      width="530px"
      title="权限"
      :close-on-click-modal="false"
      :visible.sync="userRoleFlag">
      <el-table
        :data="userRoleList"
        border
        :height="300"
        v-loading="false"
        style="width: 100%;">
        <el-table-column
          prop="username"
          header-align="center"
          align="center"
          min-width="35"
          label="账号">
        </el-table-column>
        <el-table-column
          prop="userDisplay"
          header-align="center"
          align="center"
          min-width="35"
          label="姓名">
        </el-table-column>
        <el-table-column
          prop=""
          header-align="center"
          align="center"
          min-width="30"
          label="">
          <template slot-scope="scope">
            <!-- 如果数据为Y，显示勾选框，否则不勾选 -->
            <el-checkbox v-model="scope.row.checkAll" @change="changeAll(scope.row)"></el-checkbox>
          </template>
        </el-table-column>
        <el-table-column
          prop=""
          header-align="center"
          align="center"
          min-width="30"
          label="查询">
          <template slot-scope="scope">
            <!-- 如果数据为Y，显示勾选框，否则不勾选 -->
            <el-checkbox v-model="scope.row.searchCheck" @change="changeCheck(scope.row,1)"></el-checkbox>
          </template>
        </el-table-column>
        <el-table-column
          prop=""
          header-align="center"
          align="center"
          min-width="30"
          label="修改">
          <template slot-scope="scope">
            <!-- 如果数据为Y，显示勾选框，否则不勾选 -->
            <el-checkbox v-model="scope.row.updateCheck" @change="changeCheck(scope.row,2)"></el-checkbox>
          </template>
        </el-table-column>
        <el-table-column
          prop=""
          header-align="center"
          align="center"
          min-width="30"
          label="下载">
          <template slot-scope="scope">
            <!-- 如果数据为Y，显示勾选框，否则不勾选 -->
            <el-checkbox v-model="scope.row.downCheck" @change="changeCheck(scope.row,3)"></el-checkbox>
          </template>
        </el-table-column>
        <el-table-column
          prop=""
          header-align="center"
          align="center"
          min-width="30"
          label="删除">
          <template slot-scope="scope">
            <!-- 如果数据为Y，显示勾选框，否则不勾选 -->
            <el-checkbox v-model="scope.row.deleteCheck" @change="changeCheck(scope.row,4)"></el-checkbox>
          </template>
        </el-table-column>
      </el-table>
      <span slot="footer" class="dialog-footer">
        <div style="margin-top: 5px">
          <el-button type="primary" @click="saveUserList()">确定</el-button>
          <el-button type="primary" @click="userRoleFlag = false">取消</el-button>
        </div>
    </span>
    </el-dialog>

    <add-or-update v-if="addOrUpdateVisible" v-model="addOrUpdate" ref="addOrUpdate" @refreshDataList="getDataList"
                   v-drag></add-or-update>

    <Chooselist ref="baseList" @getBaseData="getBaseData"></Chooselist>
  </div>
</template>

<script>
import {
  customerInformationSearch, // 客户信息列表查询
  customerInformationSave, // 客户信息新增
  customerInformationEdit, // 客户信息编辑
  customerInformationDelete, // 客户信息删除
  checkCustomerGroup, // 客户组ID输入校验
} from '@/api/customer/customerInformation.js'
import {
  customerContactSearch, // 客户联系人列表查询
  customerContactSave, // 客户联系人新增
  customerContactEdit, // 客户联系人编辑
  customerContactDelete, // 客户联系人删除
} from '@/api/customer/customerContact.js'
import {
  customerAddressSearch, // 客户联系地址列表查询
  customerAddressSave, // 客户联系地址新增
  customerAddressEdit, // 客户联系地址编辑
  customerAddressDelete, // 客户联系地址删除
} from '@/api/customer/customerAddress.js'
import {
  projectInformationSearch, // 客户项目信息列表查询
  projectInformationSave, // 客户项目信息新增
  projectInformationEdit, // 客户项目信息编辑
  projectInformationDelete, // 客户项目信息删除
} from '@/api/customer/projectInformation.js'
import {
  searchOperatorWithSite,
  searchProjectTeamStr,
  searchUserRoll,
  saveProjectInfo
} from "@/api/project/project.js"
import Chooselist from '@/views/modules/common/Chooselist'
import {verifyData} from "@/api/chooselist/chooselist.js"
import DictDataSelect from '../sys/dict-data-select.vue'
import saveOrUpdate from '../project/projectInfo/com_projectInfo-add-or-update.vue'
import partUploadFile from '../part/part_upload_file.vue'
import AddOrUpdate from "../project/projectInfo/com_projectInfo-add-or-update.vue";

export default {
  components: {
    AddOrUpdate,
    DictDataSelect,
    Chooselist,
    saveOrUpdate
  },
  watch: {
    searchData: {
      deep: true,
      handler: function (newV, oldV) {
        this.searchData.customerNo = this.searchData.customerNo.toUpperCase()
      }
    },
    modalData: {
      deep: true,
      handler: function (newV, oldV) {
        this.modalData.customerNo = this.modalData.customerNo.toUpperCase()
        this.modalData.customerGroupId1 = this.modalData.customerGroupId1.toUpperCase()
        this.modalData.customerGroupId2 = this.modalData.customerGroupId2.toUpperCase()
        if (this.modalData.customerGroupId1 == null || this.modalData.customerGroupId1 === '') {
          this.modalData.customerGroupName1 = ''
        }
        if (this.modalData.customerGroupId2 == null || this.modalData.customerGroupId2 === '') {
          this.modalData.customerGroupName2 = ''
        }
      }
    }
  },
  data() {
    return {
      // 新增 项目
      addOrUpdateVisible: false,
      // addOrUpdate
      addOrUpdate: '0',
      components: {
        DictDataSelect,
        Chooselist
      },
      // 导出
      exportData: [],
      exportName: '客户信息' + this.dayjs().format('YYYYMMDDHHmmss'),
      exportHeader: ['客户信息'],
      exportFooter: [],
      resultList: [],
      // ======== 行高 ========
      height: 200,
      secondHeight: 200,
      // ======== 分页 ========
      pageIndex: 1,
      pageSize: 20,
      totalPage: 0,
      // 条件查询
      searchData: {
        site: this.$store.state.user.site,
        customerNo: '',
        customerDesc: '',
        customerStatus: '',
        active: 'Y',
        page: 1,
        limit: 10
      },
      // 初始页签
      activeTable: 'customer_contact',
      // ======== 数据对象 ========
      modalData: {
        flag: '',
        title: '',
        site: this.$store.state.user.site,
        customerNo: '',
        customerDesc: '',
        customerDescription: '',
        customerIndustry: '',
        customerCurrency: '',
        turnoverOfYear: '',
        potentialRevenueOfYear: '',
        importantCustomer: '',
        customerType: '',
        customerStatus: '',
        companyName: '',
        jobDescription: '',
        remark: '',
        contactName: '',
        contactPhoneNumber1: '',
        createDate: '',
        createBy: '',
        updateDate: '',
        updateBy: '',
        primaryContact: '',
        contactStatus: '',
        addressName: '',
        customerAddress: '',
        customerGroupId1: '',
        customerGroupId2: '',
        customerGroupName1: '',
        customerGroupName2: '',
        type: ''
      },
      contactModalData: {
        flag: '',
        title: '',
        site: this.$store.state.user.site,
        customerNo: '',
        customerDesc: '',
        contactId: '',
        contactName: '',
        contactLandlineNumber: '',
        contactPhoneNumber1: '',
        contactPhoneNumber2: '',
        contactPhoneNumber3: '',
        position: '',
        departmentName: '',
        mailbox: '',
        primaryContact: '',
        contactStatus: '',
        remark: '',
        createDate: '',
        createBy: '',
        updateDate: '',
        updateBy: ''
      },
      addressModalData: {
        flag: '',
        title: '',
        site: this.$store.state.user.site,
        customerNo: '',
        customerDesc: '',
        addressId: '',
        addressName: '',
        companyName: '',
        defaultAddress: '',
        addressStatus: '',
        addressType: '',
        remark: '',
        createDate: '',
        createBy: '',
        updateDate: '',
        updateBy: ''
      },
      projectInformationModalData: {
        flag: '',
        title: '',
        site: this.$store.state.user.site,
        customerNo: '',
        customerDesc: '',
        addressId: '',
        addressName: '',
        companyName: '',
        defaultAddress: '',
        addressStatus: '',
        addressType: '',
        remark: '',
        createDate: '',
        createBy: '',
        updateDate: '',
        updateBy: '',
        projectManagerList: []
      },
      // ======== 数据列表 ========
      dataList: [],
      contactList: [],
      addressList: [],
      projectInformationList: [],
      // ======== 列表表头 ========
      columnList: [
        {
          userId: this.$store.state.user.name,
          functionId: 101001,
          serialNumber: '101001Table1CustomerDesc',
          tableId: '101001Table1',
          tableName: '客户信息表',
          columnProp: 'customerDesc',
          headerAlign: 'center',
          align: 'left',
          columnLabel: '客户名称',
          columnHidden: false,
          columnImage: false,
          columnSortable: false,
          sortLv: 0,
          status: true,
          fixed: '',
          columnWidth: 160
        },
        {
          userId: this.$store.state.user.name,
          functionId: 101001,
          serialNumber: '101001Table1CustomerGroupName1',
          tableId: '101001Table1',
          tableName: '客户信息表',
          columnProp: 'customerGroupName1',
          headerAlign: 'center',
          align: 'left',
          columnLabel: '客户组1',
          columnHidden: false,
          columnImage: false,
          columnSortable: false,
          sortLv: 0,
          status: true,
          fixed: '',
          columnWidth: 160
        },
        {
          userId: this.$store.state.user.name,
          functionId: 101001,
          serialNumber: '101001Table1CustomerGroupName2',
          tableId: '101001Table1',
          tableName: '客户信息表',
          columnProp: 'customerGroupName2',
          headerAlign: 'center',
          align: 'left',
          columnLabel: '客户组2',
          columnHidden: false,
          columnImage: false,
          columnSortable: false,
          sortLv: 0,
          status: true,
          fixed: '',
          columnWidth: 160
        },
        {
          userId: this.$store.state.user.name,
          functionId: 101001,
          serialNumber: '101001Table1CustomerCurrency',
          tableId: '101001Table1',
          tableName: '客户信息表',
          columnProp: 'customerCurrency',
          headerAlign: 'center',
          align: 'center',
          columnLabel: '客户币种',
          columnHidden: false,
          columnImage: false,
          columnSortable: false,
          sortLv: 0,
          status: true,
          fixed: '',
          columnWidth: 100
        },
        {
          userId: this.$store.state.user.name,
          functionId: 101001,
          serialNumber: '101001Table1TurnoverOfYear',
          tableId: '101001Table1',
          tableName: '客户信息表',
          columnProp: 'turnoverOfYear',
          headerAlign: 'center',
          align: 'right',
          columnLabel: '年营业额',
          columnHidden: false,
          columnImage: false,
          columnSortable: false,
          sortLv: 0,
          status: true,
          fixed: '',
          columnWidth: 100
        },
        {
          userId: this.$store.state.user.name,
          functionId: 101001,
          serialNumber: '101001Table1PotentialRevenueOfYear',
          tableId: '101001Table1',
          tableName: '客户信息表',
          columnProp: 'potentialRevenueOfYear',
          headerAlign: 'center',
          align: 'right',
          columnLabel: '年潜在投入',
          columnHidden: false,
          columnImage: false,
          columnSortable: false,
          sortLv: 0,
          status: true,
          fixed: '',
          columnWidth: 100
        },
        {
          userId: this.$store.state.user.name,
          functionId: 101001,
          serialNumber: '101001Table1ImportantCustomer',
          tableId: '101001Table1',
          tableName: '客户信息表',
          columnProp: 'importantCustomer',
          headerAlign: 'center',
          align: 'center',
          columnLabel: '重要程度',
          columnHidden: false,
          columnImage: false,
          columnSortable: false,
          sortLv: 0,
          status: true,
          fixed: '',
          columnWidth: 100
        },
        {
          userId: this.$store.state.user.name,
          functionId: 101001,
          serialNumber: '101001Table1CustomerStatus',
          tableId: '101001Table1',
          tableName: '客户信息表',
          columnProp: 'customerStatusDesc',
          headerAlign: 'center',
          align: 'center',
          columnLabel: '客户状态',
          columnHidden: false,
          columnImage: false,
          columnSortable: false,
          sortLv: 0,
          status: true,
          fixed: '',
          columnWidth: 100
        },
        {
          userId: this.$store.state.user.name,
          functionId: 101001,
          serialNumber: '101001Table1CustomerType',
          tableId: '101001Table1',
          tableName: '客户信息表',
          columnProp: 'customerType',
          headerAlign: 'center',
          align: 'center',
          columnLabel: '客户类型',
          columnHidden: false,
          columnImage: false,
          columnSortable: false,
          sortLv: 0,
          status: true,
          fixed: '',
          columnWidth: 100
        },
        {
          userId: this.$store.state.user.name,
          functionId: 101001,
          serialNumber: '101001Table1CreateDate',
          tableId: '101001Table1',
          tableName: '客户信息表',
          columnProp: 'createDate',
          headerAlign: 'center',
          align: 'center',
          columnLabel: '创建时间',
          columnHidden: false,
          columnImage: false,
          columnSortable: false,
          sortLv: 0,
          status: true,
          fixed: '',
          columnWidth: 170
        },
        {
          userId: this.$store.state.user.name,
          functionId: 101001,
          serialNumber: '101001Table1CreateBy',
          tableId: '101001Table1',
          tableName: '客户信息表',
          columnProp: 'createBy',
          headerAlign: 'center',
          align: 'center',
          columnLabel: '创建人',
          columnHidden: false,
          columnImage: false,
          columnSortable: false,
          sortLv: 0,
          status: true,
          fixed: '',
          columnWidth: 100
        },
        {
          userId: this.$store.state.user.name,
          functionId: 101001,
          serialNumber: '101001Table1UpdateDate',
          tableId: '101001Table1',
          tableName: '客户信息表',
          columnProp: 'updateDate',
          headerAlign: 'center',
          align: 'center',
          columnLabel: '更新时间',
          columnHidden: false,
          columnImage: false,
          columnSortable: false,
          sortLv: 0,
          status: true,
          fixed: '',
          columnWidth: 170
        },
        {
          userId: this.$store.state.user.name,
          functionId: 101001,
          serialNumber: '101001Table1UpdateBy',
          tableId: '101001Table1',
          tableName: '客户信息表',
          columnProp: 'updateBy',
          headerAlign: 'center',
          align: 'center',
          columnLabel: '更新人',
          columnHidden: false,
          columnImage: false,
          columnSortable: false,
          sortLv: 0,
          status: true,
          fixed: '',
          columnWidth: 100
        }
      ],
      customerContactArray: [
        {
          userId: this.$store.state.user.name,
          functionId: 101001,
          serialNumber: '101001Table2ContactName',
          tableId: '101001Table2',
          tableName: '客户联系人表',
          columnProp: 'contactName',
          headerAlign: 'center',
          align: 'left',
          columnLabel: '联系人',
          columnHidden: false,
          columnImage: false,
          columnSortable: false,
          sortLv: 0,
          status: true,
          fixed: '',
          columnWidth: 120
        },
        {
          userId: this.$store.state.user.name,
          functionId: 101001,
          serialNumber: '101001Table2ContactPhoneNumber1',
          tableId: '101001Table2',
          tableName: '客户联系人表',
          columnProp: 'contactPhoneNumber1',
          headerAlign: 'center',
          align: 'left',
          columnLabel: '联系电话',
          columnHidden: false,
          columnImage: false,
          columnSortable: false,
          sortLv: 0,
          status: true,
          fixed: '',
          columnWidth: 160
        },
        {
          userId: this.$store.state.user.name,
          functionId: 101001,
          serialNumber: '101001Table2ContactLandlineNumber',
          tableId: '101001Table2',
          tableName: '客户联系人表',
          columnProp: 'contactLandlineNumber',
          headerAlign: 'center',
          align: 'left',
          columnLabel: '座机',
          columnHidden: false,
          columnImage: false,
          columnSortable: false,
          sortLv: 0,
          status: true,
          fixed: '',
          columnWidth: 160
        },
        {
          userId: this.$store.state.user.name,
          functionId: 101001,
          serialNumber: '101001Table2Position',
          tableId: '101001Table2',
          tableName: '客户联系人表',
          columnProp: 'position',
          headerAlign: 'center',
          align: 'left',
          columnLabel: '公司职务',
          columnHidden: false,
          columnImage: false,
          columnSortable: false,
          sortLv: 0,
          status: true,
          fixed: '',
          columnWidth: 100
        },
        {
          userId: this.$store.state.user.name,
          functionId: 101001,
          serialNumber: '101001Table2DepartmentName',
          tableId: '101001Table2',
          tableName: '客户联系人表',
          columnProp: 'departmentName',
          headerAlign: 'center',
          align: 'left',
          columnLabel: '部门',
          columnHidden: false,
          columnImage: false,
          columnSortable: false,
          sortLv: 0,
          status: true,
          fixed: '',
          columnWidth: 100
        },
        {
          userId: this.$store.state.user.name,
          functionId: 101001,
          serialNumber: '101001Table2Mailbox',
          tableId: '101001Table2',
          tableName: '客户联系人表',
          columnProp: 'mailbox',
          headerAlign: 'center',
          align: 'left',
          columnLabel: '邮箱',
          columnHidden: false,
          columnImage: false,
          columnSortable: false,
          sortLv: 0,
          status: true,
          fixed: '',
          columnWidth: 160
        },
        {
          userId: this.$store.state.user.name,
          functionId: 101001,
          serialNumber: '101001Table2PrimaryContact',
          tableId: '101001Table2',
          tableName: '客户联系人表',
          columnProp: 'primaryContact',
          headerAlign: 'center',
          align: 'center',
          columnLabel: '默认联系人',
          columnHidden: false,
          columnImage: false,
          columnSortable: false,
          sortLv: 0,
          status: true,
          fixed: '',
          columnWidth: 100
        },
        {
          userId: this.$store.state.user.name,
          functionId: 101001,
          serialNumber: '101001Table2ContactStatus',
          tableId: '101001Table2',
          tableName: '客户联系人表',
          columnProp: 'contactStatus',
          headerAlign: 'center',
          align: 'center',
          columnLabel: '状态',
          columnHidden: false,
          columnImage: false,
          columnSortable: false,
          sortLv: 0,
          status: true,
          fixed: '',
          columnWidth: 100
        },
        {
          userId: this.$store.state.user.name,
          functionId: 101001,
          serialNumber: '101001Table2CreateDate',
          tableId: '101001Table2',
          tableName: '客户联系人表',
          columnProp: 'createDate',
          headerAlign: 'center',
          align: 'center',
          columnLabel: '创建时间',
          columnHidden: false,
          columnImage: false,
          columnSortable: false,
          sortLv: 0,
          status: true,
          fixed: '',
          columnWidth: 170
        },
        {
          userId: this.$store.state.user.name,
          functionId: 101001,
          serialNumber: '101001Table2CreateBy',
          tableId: '101001Table2',
          tableName: '客户联系人表',
          columnProp: 'createBy',
          headerAlign: 'center',
          align: 'center',
          columnLabel: '创建人',
          columnHidden: false,
          columnImage: false,
          columnSortable: false,
          sortLv: 0,
          status: true,
          fixed: '',
          columnWidth: 100
        },
        {
          userId: this.$store.state.user.name,
          functionId: 101001,
          serialNumber: '101001Table2UpdateDate',
          tableId: '101001Table2',
          tableName: '客户联系人表',
          columnProp: 'updateDate',
          headerAlign: 'center',
          align: 'center',
          columnLabel: '更新时间',
          columnHidden: false,
          columnImage: false,
          columnSortable: false,
          sortLv: 0,
          status: true,
          fixed: '',
          columnWidth: 170
        },
        {
          userId: this.$store.state.user.name,
          functionId: 101001,
          serialNumber: '101001Table2UpdateBy',
          tableId: '101001Table2',
          tableName: '客户联系人表',
          columnProp: 'updateBy',
          headerAlign: 'center',
          align: 'center',
          columnLabel: '更新人',
          columnHidden: false,
          columnImage: false,
          columnSortable: false,
          sortLv: 0,
          status: true,
          fixed: '',
          columnWidth: 100
        }
      ],
      customerAddressArray: [
        {
          userId: this.$store.state.user.name,
          functionId: 101001,
          serialNumber: '101001Table3AddressType',
          tableId: '101001Table3',
          tableName: '客户联系地址表',
          columnProp: 'addressTypeName',
          headerAlign: 'center',
          align: 'center',
          columnLabel: '地址类型',
          columnHidden: false,
          columnImage: false,
          columnSortable: false,
          sortLv: 0,
          status: true,
          fixed: '',
          columnWidth: 100
        },
        {
          userId: this.$store.state.user.name,
          functionId: 101001,
          serialNumber: '101001Table3CompanyName',
          tableId: '101001Table3',
          tableName: '客户联系地址表',
          columnProp: 'companyName',
          headerAlign: 'center',
          align: 'left',
          columnLabel: '公司名称',
          columnHidden: false,
          columnImage: false,
          columnSortable: false,
          sortLv: 0,
          status: true,
          fixed: '',
          columnWidth: 160
        },
        {
          userId: this.$store.state.user.name,
          functionId: 101001,
          serialNumber: '101001Table3AddressName',
          tableId: '101001Table3',
          tableName: '客户联系地址表',
          columnProp: 'addressName',
          headerAlign: 'center',
          align: 'left',
          columnLabel: '地址',
          columnHidden: false,
          columnImage: false,
          columnSortable: false,
          sortLv: 0,
          status: true,
          fixed: '',
          columnWidth: 160
        },
        {
          userId: this.$store.state.user.name,
          functionId: 101001,
          serialNumber: '101001Table3DefaultAddress',
          tableId: '101001Table3',
          tableName: '客户联系地址表',
          columnProp: 'defaultAddress',
          headerAlign: 'center',
          align: 'center',
          columnLabel: '默认地址',
          columnHidden: false,
          columnImage: false,
          columnSortable: false,
          sortLv: 0,
          status: true,
          fixed: '',
          columnWidth: 100
        },
        {
          userId: this.$store.state.user.name,
          functionId: 101001,
          serialNumber: '101001Table3AddressStatus',
          tableId: '101001Table3',
          tableName: '客户联系地址表',
          columnProp: 'addressStatus',
          headerAlign: 'center',
          align: 'center',
          columnLabel: '状态',
          columnHidden: false,
          columnImage: false,
          columnSortable: false,
          sortLv: 0,
          status: true,
          fixed: '',
          columnWidth: 100
        },
        {
          userId: this.$store.state.user.name,
          functionId: 101001,
          serialNumber: '101001Table3CreateDate',
          tableId: '101001Table3',
          tableName: '客户联系地址表',
          columnProp: 'createDate',
          headerAlign: 'center',
          align: 'center',
          columnLabel: '创建时间',
          columnHidden: false,
          columnImage: false,
          columnSortable: false,
          sortLv: 0,
          status: true,
          fixed: '',
          columnWidth: 170
        },
        {
          userId: this.$store.state.user.name,
          functionId: 101001,
          serialNumber: '101001Table3CreateBy',
          tableId: '101001Table3',
          tableName: '客户联系地址表',
          columnProp: 'createBy',
          headerAlign: 'center',
          align: 'center',
          columnLabel: '创建人',
          columnHidden: false,
          columnImage: false,
          columnSortable: false,
          sortLv: 0,
          status: true,
          fixed: '',
          columnWidth: 100
        },
        {
          userId: this.$store.state.user.name,
          functionId: 101001,
          serialNumber: '101001Table3UpdateDate',
          tableId: '101001Table3',
          tableName: '客户联系地址表',
          columnProp: 'updateDate',
          headerAlign: 'center',
          align: 'center',
          columnLabel: '更新时间',
          columnHidden: false,
          columnImage: false,
          columnSortable: false,
          sortLv: 0,
          status: true,
          fixed: '',
          columnWidth: 170
        },
        {
          userId: this.$store.state.user.name,
          functionId: 101001,
          serialNumber: '101001Table3UpdateBy',
          tableId: '101001Table3',
          tableName: '客户联系地址表',
          columnProp: 'updateBy',
          headerAlign: 'center',
          align: 'center',
          columnLabel: '更新人',
          columnHidden: false,
          columnImage: false,
          columnSortable: false,
          sortLv: 0,
          status: true,
          fixed: '',
          columnWidth: 100
        }
      ],
      projectInformationArray: [
        {
          userId: this.$store.state.user.name,
          functionId: 101001,
          serialNumber: '101001Table4ProjectName',
          tableId: '101001Table4',
          tableName: '客户项目信息表',
          columnProp: 'projectName',
          headerAlign: 'center',
          align: 'left',
          columnLabel: '项目名称',
          columnHidden: false,
          columnImage: false,
          columnSortable: false,
          sortLv: 0,
          status: true,
          fixed: '',
          columnWidth: 160
        },
        {
          userId: this.$store.state.user.name,
          functionId: 101001,
          serialNumber: '101001Table4ProjectType',
          tableId: '101001Table4',
          tableName: '客户项目信息表',
          columnProp: 'projectType',
          headerAlign: 'center',
          align: 'center',
          columnLabel: '项目类型',
          columnHidden: false,
          columnImage: false,
          columnSortable: false,
          sortLv: 0,
          status: true,
          fixed: '',
          columnWidth: 100
        },
        {
          userId: this.$store.state.user.name,
          functionId: 101001,
          serialNumber: '101001Table4ProjectDesc',
          tableId: '101001Table4',
          tableName: '客户项目信息表',
          columnProp: 'projectDesc',
          headerAlign: 'center',
          align: 'left',
          columnLabel: '项目描述',
          columnHidden: false,
          columnImage: false,
          columnSortable: false,
          sortLv: 0,
          status: true,
          fixed: '',
          columnWidth: 160
        },
        {
          userId: this.$store.state.user.name,
          functionId: 101001,
          serialNumber: '101001Table4Status',
          tableId: '101001Table4',
          tableName: '客户项目信息表',
          columnProp: 'status',
          headerAlign: 'center',
          align: 'center',
          columnLabel: '项目状态',
          columnHidden: false,
          columnImage: false,
          columnSortable: false,
          sortLv: 0,
          status: true,
          fixed: '',
          columnWidth: 100
        },
        {
          userId: this.$store.state.user.name,
          functionId: 101001,
          serialNumber: '101001Table4ProjectOwnerName',
          tableId: '101001Table4',
          tableName: '客户项目信息表',
          columnProp: 'projectOwnerName',
          headerAlign: 'center',
          align: 'left',
          columnLabel: '项目负责人',
          columnHidden: false,
          columnImage: false,
          columnSortable: false,
          sortLv: 0,
          status: true,
          fixed: '',
          columnWidth: 130
        },
        {
          userId: this.$store.state.user.name,
          functionId: 101001,
          serialNumber: '101001Table4CreateDate',
          tableId: '101001Table4',
          tableName: '客户项目信息表',
          columnProp: 'createDate',
          headerAlign: 'center',
          align: 'center',
          columnLabel: '创建时间',
          columnHidden: false,
          columnImage: false,
          columnSortable: false,
          sortLv: 0,
          status: true,
          fixed: '',
          columnWidth: 170
        },
        {
          userId: this.$store.state.user.name,
          functionId: 101001,
          serialNumber: '101001Table4CreateBy',
          tableId: '101001Table4',
          tableName: '客户项目信息表',
          columnProp: 'createBy',
          headerAlign: 'center',
          align: 'center',
          columnLabel: '创建人',
          columnHidden: false,
          columnImage: false,
          columnSortable: false,
          sortLv: 0,
          status: true,
          fixed: '',
          columnWidth: 100
        },
        {
          userId: this.$store.state.user.name,
          functionId: 101001,
          serialNumber: '101001Table4UpdateDate',
          tableId: '101001Table4',
          tableName: '客户项目信息表',
          columnProp: 'updateDate',
          headerAlign: 'center',
          align: 'center',
          columnLabel: '更新时间',
          columnHidden: false,
          columnImage: false,
          columnSortable: false,
          sortLv: 0,
          status: true,
          fixed: '',
          columnWidth: 170
        },
        {
          userId: this.$store.state.user.name,
          functionId: 101001,
          serialNumber: '101001Table4UpdateBy',
          tableId: '101001Table4',
          tableName: '客户项目信息表',
          columnProp: 'updateBy',
          headerAlign: 'center',
          align: 'center',
          columnLabel: '更新人',
          columnHidden: false,
          columnImage: false,
          columnSortable: false,
          sortLv: 0,
          status: true,
          fixed: '',
          columnWidth: 100
        }
      ],
      // ======== 必填规则 ========
      rules: {
        customerNo: [
          {
            required: true,
            message: ' ',
            trigger: ['blur', 'change']
          }
        ],
        customerDesc: [
          {
            required: true,
            message: ' ',
            trigger: ['blur', 'change']
          }
        ],
        customerCurrency: [
          {
            required: true,
            message: ' ',
            trigger: ['blur', 'change']
          }
        ],
        contactName: [
          {
            required: true,
            message: ' ',
            trigger: ['blur', 'change']
          }
        ],
        contactPhoneNumber1: [
          {
            required: true,
            message: ' ',
            trigger: ['blur', 'change']
          }
        ],
        importantCustomer: [
          {
            required: true,
            message: ' ',
            trigger: ['blur', 'change']
          }
        ],
        customerStatus: [
          {
            required: true,
            message: ' ',
            trigger: ['blur', 'change']
          }
        ],
        customerType: [
          {
            required: true,
            message: ' ',
            trigger: ['blur', 'change']
          }
        ],
      },
      contactRules: {
        contactName: [
          {
            required: true,
            message: ' ',
            trigger: ['blur', 'change']
          }
        ],
        position: [
          {
            required: true,
            message: ' ',
            trigger: ['blur', 'change']
          }
        ],
        primaryContact: [
          {
            required: true,
            message: ' ',
            trigger: ['blur', 'change']
          }
        ],
        contactStatus: [
          {
            required: true,
            message: ' ',
            trigger: ['blur', 'change']
          }
        ],
        contactPhoneNumber1: [
          {
            required: true,
            message: ' ',
            trigger: ['blur', 'change']
          }
        ]
      },
      addressRules: {
        addressName: [
          {
            required: true,
            message: ' ',
            trigger: ['blur', 'change']
          }
        ],
        defaultAddress: [
          {
            required: true,
            message: ' ',
            trigger: ['blur', 'change']
          }
        ],
        addressStatus: [
          {
            required: true,
            message: ' ',
            trigger: ['blur', 'change']
          }
        ],
        addressType: [
          {
            required: true,
            message: ' ',
            trigger: ['blur', 'change']
          }
        ]
      },
      projectInformationRules: {
        projectType: [
          {
            required: true,
            message: ' ',
            trigger: ['blur', 'change']
          }
        ],
        projectName: [
          {
            required: true,
            message: ' ',
            trigger: ['blur', 'change']
          }
        ],
        projectSourceDesc: [
          {
            required: true,
            message: ' ',
            trigger: ['blur', 'change']
          }
        ],
        priorityDesc: [
          {
            required: true,
            message: ' ',
            trigger: ['blur', 'change']
          }
        ],
        needDate: [
          {
            required: true,
            message: ' ',
            trigger: ['blur', 'change']
          }
        ],
        projectManagerName: [
          {
            required: true,
            message: ' ',
            trigger: ['blur', 'change']
          }
        ],
        projectOwnerName: [
          {
            required: true,
            message: ' ',
            trigger: ['blur', 'change']
          }
        ],
        userRoleName: [
          {
            required: true,
            message: ' ',
            trigger: ['blur', 'change']
          }
        ]
      },
      // ======== 复选数据集 ========
      customerSelections: [],
      contactSelections: [],
      addressSelections: [],
      projectInformationSelections: [],
      // ======== 选中的当前行数据 ========
      customerCurrentRow: {},
      contactCurrentRow: {},
      addressCurrentRow: {},
      projectInformationCurrentRow: {},
      // ======== 模态框开关控制 ========
      modalFlag: false,
      modalDisableFlag: false,
      detailModalFlag: false,
      contactModalFlag: false,
      contactDetailModalFlag: false,
      addressModalFlag: false,
      addressDetailModalFlag: false,
      projectInformationModalFlag: false,
      projectInformationDetailModalFlag: false,
      // ======== 客户项目相关 ========
      operatorList: [],
      projectManagerList: [],
      projectOwnerList: [],
      userRoleList: [],
      managerFlag: false,
      ownerFlag: false,
      userRoleFlag: false,
    }
  },

  mounted() {
    this.$nextTick(() => {
      this.height = window.innerHeight / 2 - 30
      /*第二个表格高度的动态调整*/
      this.secondHeight = window.innerHeight / 2 - 206
    })
  },

  created() {
    this.getDataList()
  },

  methods: {
    // ======== 分页相关方法 ========
    /**
     * 每页数
     * @param val
     */
    sizeChangeHandle(val) {
      this.pageSize = val
      this.pageIndex = 1
      this.getDataList()
    },
    /**
     * 当前页
     * @param val
     */
    currentChangeHandle(val) {
      this.pageIndex = val
      this.getDataList()
    },

    // ======== 页签切换相关方法 ========
    /**
     * 列表表格选择替换
     * @param tab
     * @param event
     */
    tabClick(tab, event) {
      // 刷新列表数据
      this.refreshCurrentTabTable()
    },
    /**
     * 当前值发生变化的时候修改
     * @param row
     * @param oldRow
     */
    changeCurrentRow(row, oldRow) {
      // 判断是否是获取焦点的事件
      if (row) {
        this.customerCurrentRow = JSON.parse(JSON.stringify(row))
        //刷新当前页表
        this.refreshCurrentTabTable()
      }
    },
    /**
     * 刷新页签的table数据
     */
    refreshCurrentTabTable() {
      if (this.activeTable === 'customer_contact') {
        this.getCustomerContactList()
      } else if (this.activeTable === 'customer_address') {
        this.getCustomerAddressList()
      } else if (this.activeTable === 'project_information') {
        this.getProjectInformationList()
      }
    },

    // ======== 列表数据刷新方法 ========
    /**
     * 获取数据列表
     */
    getDataList() {
      this.searchData.limit = this.pageSize
      this.searchData.page = this.pageIndex
      customerInformationSearch(this.searchData).then(({data}) => {
        if (data.code === 0) {
          this.dataList = data.page.list
          this.pageIndex = data.page.currPage
          this.pageSize = data.page.pageSize
          this.totalPage = data.page.totalCount
          // 判断是否全部存在数据
          if (this.totalPage > 0) {
            // 设置选中行
            this.$refs.customerTable.setCurrentRow(this.dataList[0])
            // 加载当前的页签的table
            this.refreshCurrentTabTable()
          }
        }
      })
    },
    /**
     * 刷新客户联系人的列表
     */
    getCustomerContactList() {
      let tempData = {
        site: this.$store.state.user.site,
        customerNo: this.customerCurrentRow.customerNo
      }
      customerContactSearch(tempData).then(({data}) => {
        if (data && data.code === 0) {
          this.contactList = data.rows
        } else {
          this.contactList = []
        }
      });
    },
    /**
     * 刷新客户联系地址的列表
     */
    getCustomerAddressList() {
      let tempData = {
        site: this.$store.state.user.site,
        customerNo: this.customerCurrentRow.customerNo,
        customerDesc: this.customerCurrentRow.customerDesc
      }
      customerAddressSearch(tempData).then(({data}) => {
        if (data && data.code === 0) {
          this.addressList = data.rows
        } else {
          this.addressList = []
        }
      });
    },
    /**
     * 刷新客户项目信息的列表
     */
    getProjectInformationList() {
      let tempData = {
        site: this.$store.state.user.site,
        customerId: this.customerCurrentRow.customerNo
      }
      projectInformationSearch(tempData).then(({data}) => {
        if (data && data.code === 0) {
          this.projectInformationList = data.rows
        } else {
          this.projectInformationList = []
        }
      });
    },

    // ======== 新增模态框 ========
    /**
     * 客户信息新增模态框
     */
    addModal() {
      this.modalData = {
        flag: '1',
        title: '客户新增',
        site: this.$store.state.user.site,
        customerNo: '',
        customerDesc: '',
        customerDescription: '',
        customerIndustry: '',
        customerCurrency: '',
        turnoverOfYear: '',
        potentialRevenueOfYear: '',
        importantCustomer: '',
        customerGroupId1: '',
        customerGroupId2: '',
        customerGroupName1: '',
        customerGroupName2: '',
        customerStatus: 'Y',
        customerType: '潜在客户',
        addressName: '',
        defaultAddress: '',
        addressStatus: '启用',
        addressType: '类型一',
        createBy: this.$store.state.user.name,
        type: ''
      }
      this.modalDisableFlag = false
      this.detailModalFlag = false
      this.modalFlag = true
    },
    /**
     * 客户联系人新增模态框
     */
    contactSaveModal() {
      this.contactModalData = {
        flag: '1',
        title: '联系人新增',
        site: this.$store.state.user.site,
        customerNo: this.customerCurrentRow.customerNo,
        contactId: '',
        contactName: '',
        contactLandlineNumber: '',
        contactPhoneNumber1: '',
        contactPhoneNumber2: '',
        contactPhoneNumber3: '',
        position: '',
        departmentName: '',
        mailbox: '',
        primaryContact: 'N',
        contactStatus: '启用',
        remark: '',
        createDate: '',
        createBy: this.$store.state.user.name,
      }
      if (this.contactList.length === 0) {
        this.contactModalData.primaryContact = 'Y'
      }
      this.contactDetailModalFlag = false
      this.contactModalFlag = true
    },
    /**
     * 客户联系地址新增模态框
     */
    addressSaveModal() {
      this.addressModalData = {
        flag: '1',
        title: '联系地址新增',
        site: this.$store.state.user.site,
        customerNo: this.customerCurrentRow.customerNo,
        addressId: '',
        addressName: '',
        companyName: this.customerCurrentRow.customerDesc,
        defaultAddress: 'N',
        addressStatus: '启用',
        addressType: '',
        remark: '',
        createDate: '',
        createBy: this.$store.state.user.name,
      }
      if (this.addressList.length === 0) {
        this.addressModalData.defaultAddress = 'Y'
      }
      this.addressDetailModalFlag = false
      this.addressModalFlag = true
    },
    /**
     * 客户项目信息新增模态框
     */
    projectInformationSaveModal() {
      this.projectInformationModalData = {
        flag: '1',
        title: '项目信息新增',
        site: this.$store.state.user.site,
        id: 0,
        projectLevel: '',
        projectId: '',
        projectType: '',
        projectTypeDb: '',
        customerId: this.customerCurrentRow.customerNo,
        customerName: this.customerCurrentRow.customerDesc,
        projectName: '',
        projectDesc: '',
        projectSource: '',
        projectSourceDesc: '',
        priority: '',
        priorityDesc: '',
        needDate: '',
        projectManagerName: '',
        projectOwnerName: '',
        customerRemark: '',
        remark: '',
        status: '',
        userRoleName: '',
        projectManagerList: [],
        projectOwnerList: [],
        userRoleList: [],
        createDate: '',
        createBy: this.$store.state.user.name
      }
      this.projectInformationDetailModalFlag = false
      // this.projectInformationModalFlag = true
      this.addOrUpdateVisible = true;
      this.addOrUpdate = "save";
      this.$nextTick(() => {
        this.$refs.addOrUpdate.initCustomer(this.projectInformationModalData);
        this.$refs.addOrUpdate.init();
      })
    },

    // ======== 编辑模态框 ========
    /**
     * 客户信息编辑模态框
     * @param row
     */
    updateModal(row) {
      this.modalData = {
        flag: '2',
        title: '客户编辑',
        site: row.site,
        customerNo: row.customerNo,
        customerDesc: row.customerDesc,
        customerDescription: row.customerDescription,
        customerIndustry: row.customerIndustry,
        customerCurrency: row.customerCurrency,
        turnoverOfYear: row.turnoverOfYear,
        potentialRevenueOfYear: row.potentialRevenueOfYear,
        customerGroupId1: row.customerGroupId1,
        customerGroupId2: row.customerGroupId2,
        customerGroupName1: row.customerGroupName1,
        customerGroupName2: row.customerGroupName2,
        importantCustomer: row.importantCustomer,
        customerStatus: row.customerStatus,
        customerType: row.customerType,
        companyName: row.companyName,
        jobDescription: row.jobDescription,
        contactStatus: row.contactStatus,
        addressName: row.addressName,
        defaultAddress: 'Y',
        updateBy: this.$store.state.user.name,
        type: ''
      }
      this.modalDisableFlag = true
      this.detailModalFlag = false
      this.modalFlag = true
    },
    /**
     * 客户联系人编辑模态框
     * @param row
     */
    updateContactModal(row) {
      this.contactModalData = {
        flag: '2',
        title: '联系人编辑',
        site: row.site,
        customerNo: row.customerNo,
        contactId: row.contactId,
        contactName: row.contactName,
        contactLandlineNumber: row.contactLandlineNumber,
        contactPhoneNumber1: row.contactPhoneNumber1,
        contactPhoneNumber2: row.contactPhoneNumber2,
        contactPhoneNumber3: row.contactPhoneNumber3,
        position: row.position,
        departmentName: row.departmentName,
        mailbox: row.mailbox,
        primaryContact: row.primaryContact,
        contactStatus: row.contactStatus,
        remark: row.remark,
        updateDate: '',
        updateBy: this.$store.state.user.name
      }
      this.contactDetailModalFlag = false
      this.contactModalFlag = true
    },
    /**
     * 客户联系地址编辑模态框
     * @param row
     */
    updateAddressModal(row) {
      this.addressModalData = {
        flag: '2',
        title: '联系地址编辑',
        site: row.site,
        customerNo: row.customerNo,
        addressId: row.addressId,
        addressName: row.addressName,
        companyName: row.companyName,
        defaultAddress: row.defaultAddress,
        addressStatus: row.addressStatus,
        addressType: row.addressType,
        remark: row.remark,
        updateDate: '',
        updateBy: this.$store.state.user.name
      }
      this.addressDetailModalFlag = false
      this.addressModalFlag = true
    },
    /**
     * 客户项目信息编辑模态框
     * @param row
     */
    updateProjectInformationModal(row) {
      this.projectInformationModalData = {
        flag: '2',
        title: '项目信息编辑',
        site: row.site,
        id: row.id,
        projectLevel: row.projectLevel,
        projectId: row.projectId,
        projectType: row.projectType,
        projectTypeDb: row.projectTypeDb,
        customerId: row.customerId,
        customerName: row.customerName,
        projectName: row.projectName,
        projectDesc: row.projectDesc,
        projectSource: row.projectSource,
        projectSourceDesc: row.projectSourceDesc,
        priority: row.priority,
        priorityDesc: row.priorityDesc,
        needDate: row.needDate,
        projectManagerName: row.projectManagerName,
        projectOwnerName: row.projectOwnerName,
        customerRemark: row.customerRemark,
        remark: row.remark,
        status: row.status,
        userRoleName: row.userRoleName,
        projectManagerList: [],
        projectOwnerList: [],
        userRoleList: [],
        updateDate: '',
        updateBy: this.$store.state.user.name
      }
      // 查询项目经理、负责人、权限列表
      let inData = {
        site: this.projectInformationModalData.site,
        projectId: this.projectInformationModalData.projectId,
        type: 'manager'
      }
      searchProjectTeamStr(inData).then(({data}) => {
        this.projectInformationModalData.projectManagerList = data.rows
      })
      let inData2 = {
        site: this.projectInformationModalData.site,
        projectId: this.projectInformationModalData.projectId,
        type: 'owner'
      }
      searchProjectTeamStr(inData2).then(({data}) => {
        this.projectInformationModalData.projectOwnerList = data.rows
      })
      let inData3 = {
        site: this.projectInformationModalData.site,
        projectId: this.projectInformationModalData.projectId
      }
      searchUserRoll(inData3).then(({data}) => {
        this.projectInformationModalData.userRoleList = data.rows
      })
      this.projectInformationDetailModalFlag = false
      // this.projectInformationModalFlag = true
      this.addOrUpdateVisible = true
      this.addOrUpdate = "update";
      this.$nextTick(() => {
        this.$refs.addOrUpdate.init(row.id)
      })
    },

    // ======== 详情模态框 ========
    /**
     * 客户信息详情模态框
     * @param row
     */
    detailModal(row) {
      this.modalData = {
        flag: '3',
        title: '客户详情',
        site: row.site,
        customerNo: row.customerNo,
        customerDesc: row.customerDesc,
        customerDescription: row.customerDescription,
        customerIndustry: row.customerIndustry,
        customerCurrency: row.customerCurrency,
        turnoverOfYear: row.turnoverOfYear,
        potentialRevenueOfYear: row.potentialRevenueOfYear,
        customerGroupId1: row.customerGroupId1,
        customerGroupId2: row.customerGroupId2,
        customerGroupName1: row.customerGroupName1,
        customerGroupName2: row.customerGroupName2,
        importantCustomer: row.importantCustomer,
        customerStatus: row.customerStatus,
        customerType: row.customerType,
        companyName: row.companyName,
        jobDescription: row.jobDescription,
        contactStatus: row.contactStatus,
        addressName: row.addressName,
        type: ''
      }
      this.modalDisableFlag = true
      this.detailModalFlag = true
      this.modalFlag = true
    },
    /**
     * 客户联系人详情模态框
     * @param row
     */
    detailContactModal(row) {
      this.contactModalData = {
        flag: '3',
        title: '联系人详情',
        site: row.site,
        customerNo: row.customerNo,
        contactId: row.contactId,
        contactName: row.contactName,
        contactLandlineNumber: row.contactLandlineNumber,
        contactPhoneNumber1: row.contactPhoneNumber1,
        contactPhoneNumber2: row.contactPhoneNumber2,
        contactPhoneNumber3: row.contactPhoneNumber3,
        position: row.position,
        departmentName: row.departmentName,
        mailbox: row.mailbox,
        primaryContact: row.primaryContact,
        contactStatus: row.contactStatus,
        remark: row.remark
      }
      this.contactDetailModalFlag = true
      this.contactModalFlag = true
    },
    /**
     * 客户联系地址详情模态框
     * @param row
     */
    detailAddressModal(row) {
      this.addressModalData = {
        flag: '3',
        title: '联系地址详情',
        site: row.site,
        customerNo: row.customerNo,
        addressId: row.addressId,
        addressName: row.addressName,
        companyName: row.companyName,
        defaultAddress: row.defaultAddress,
        addressStatus: row.addressStatus,
        addressType: row.addressType,
        remark: row.remark,
      }
      this.addressDetailModalFlag = true
      this.addressModalFlag = true
    },
    /**
     * 客户项目信息详情模态框
     * @param row
     */
    detailProjectInformationModal(row) {
      this.projectInformationModalData = {
        flag: '3',
        title: '项目信息详情',
        site: row.site,
        projectId: row.projectId,
        projectType: row.projectType,
        projectTypeDb: row.projectTypeDb,
        customerId: row.customerId,
        customerName: row.customerName,
        projectName: row.projectName,
        projectDesc: row.projectDesc,
        projectSource: row.projectSource,
        projectSourceDesc: row.projectSourceDesc,
        priority: row.priority,
        priorityDesc: row.priorityDesc,
        needDate: row.needDate,
        projectManagerName: row.projectManagerName,
        projectOwnerName: row.projectOwnerName,
        customerRemark: row.customerRemark,
        remark: row.remark,
        status: row.status,
        userRoleName: row.userRoleName,
        buNo: row.buNo,
        buDesc: row.buDesc
      }
      this.projectInformationDetailModalFlag = true
      this.projectInformationModalFlag = true
    },

    // ======== 删除方法 ========
    /**
     * 客户信息删除
     */
    delModal() {
      if (this.customerSelections.length === 0) {
        this.$message.warning('请勾选要删除的客户！')
        return
      }
      this.$confirm(`是否删除这 ` + this.customerSelections.length + ` 条客户信息?`, '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
        let tempData = {
          informationList: this.customerSelections
        }
        customerInformationDelete(tempData).then(({data}) => {
          if (data && data.code === 0) {
            this.getDataList()
            this.customerSelections = []
            this.$message({
              message: '操作成功',
              type: 'success',
              duration: 1500,
              onClose: () => {
              }
            })
          } else {
            this.$alert(data.msg, '错误', {
              confirmButtonText: '确定'
            })
          }
        })
      }).catch(() => {
      })
    },
    /**
     * 客户联系人删除
     */
    contactDeleteModal() {
      if (this.contactSelections.length === 0) {
        this.$message.warning('请勾选要删除的联系人！')
        return
      }
      this.$confirm(`是否删除这 ` + this.contactSelections.length + ` 条联系人信息？`, '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
        let tempContactName = null
        for (let i = 0; i < this.contactSelections.length; i++) {
          // 判断是否有默认联系人
          if (this.contactSelections[i].primaryContact === 'Y') {
            tempContactName = this.contactSelections[i].contactName
          }
        }
        if (tempContactName !== '' || tempContactName != null) {
          this.$confirm(tempContactName + ` 为默认联系人，是否确认删除？`, '提示', {
            confirmButtonText: '确定',
            cancelButtonText: '取消',
            type: 'warning'
          }).then(() => {
            let tempData = {
              contactList: this.contactSelections
            }
            customerContactDelete(tempData).then(({data}) => {
              if (data && data.code === 0) {
                this.getCustomerContactList()
                this.contactSelections = []
                this.$message({
                  message: '操作成功',
                  type: 'success',
                  duration: 1500,
                  onClose: () => {
                  }
                })
              } else {
                this.$alert(data.msg, '错误', {
                  confirmButtonText: '确定'
                })
              }
            })
          }).catch(() => {
          })
        } else {
          let tempData = {
            contactList: this.contactSelections
          }
          customerContactDelete(tempData).then(({data}) => {
            if (data && data.code === 0) {
              this.getCustomerContactList()
              this.contactSelections = []
              this.$message({
                message: '操作成功',
                type: 'success',
                duration: 1500,
                onClose: () => {
                }
              })
            } else {
              this.$alert(data.msg, '错误', {
                confirmButtonText: '确定'
              })
            }
          })
        }
      }).catch(() => {
      })
    },
    /**
     * 客户联系地址删除
     */
    addressDeleteModal() {
      if (this.addressSelections.length === 0) {
        this.$message.warning('请勾选要删除的地址！')
        return
      }
      this.$confirm(`是否删除这 ` + this.addressSelections.length + ` 条地址?`, '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
        let tempAddressName = null
        for (let i = 0; i < this.addressSelections.length; i++) {
          // 判断是否有主联系地址
          if (this.addressSelections[i].defaultAddress === 'Y') {
            tempAddressName = this.addressSelections[i].addressName
          }
        }
        if (tempAddressName !== '' || tempAddressName != null) {
          this.$confirm(tempAddressName + ` 为主联系地址，是否确认删除？`, '提示', {
            confirmButtonText: '确定',
            cancelButtonText: '取消',
            type: 'warning'
          }).then(() => {
            let tempData = {
              addressList: this.addressSelections
            }
            customerAddressDelete(tempData).then(({data}) => {
              if (data && data.code === 0) {
                this.getCustomerAddressList()
                this.addressSelections = []
                this.$message({
                  message: '操作成功',
                  type: 'success',
                  duration: 1500,
                  onClose: () => {
                  }
                })
              } else {
                this.$alert(data.msg, '错误', {
                  confirmButtonText: '确定'
                })
              }
            })
          }).catch(() => {
          })
        } else {
          let tempData = {
            addressList: this.addressSelections
          }
          customerAddressDelete(tempData).then(({data}) => {
            if (data && data.code === 0) {
              this.getCustomerAddressList()
              this.addressSelections = []
              this.$message({
                message: '操作成功',
                type: 'success',
                duration: 1500,
                onClose: () => {
                }
              })
            } else {
              this.$alert(data.msg, '错误', {
                confirmButtonText: '确定'
              })
            }
          })
        }
      }).catch(() => {
      })
    },

    // ======== 新增/编辑方法 ========
    /**
     * 客户信息新增/编辑
     */
    saveData() {
      if (this.modalData.customerNo === '' || this.modalData.customerNo == null) {
        this.$message.warning('请输入客户代码！')
        return
      }
      if (this.modalData.customerDesc === '' || this.modalData.customerDesc == null) {
        this.$message.warning('请输入客户名称！')
        return
      }
      // if (this.modalData.customerIndustry === '' || this.modalData.customerIndustry == null) {
      //   this.$message.warning('请输入行业！')
      //   return
      // }
      if (this.modalData.customerCurrency === '' || this.modalData.customerCurrency == null) {
        this.$message.warning('请输入币种！')
        return
      }
      if (this.modalData.importantCustomer === '' || this.modalData.importantCustomer == null) {
        this.$message.warning('请选择重要程度！')
        return
      }
      if (this.modalData.customerStatus === '' || this.modalData.customerStatus == null) {
        this.$message.warning('请选择客户状态！')
        return
      }
      if (this.modalData.customerType === '' || this.modalData.customerType == null) {
        this.$message.warning('请选择客户类型！')
        return
      }
      if (this.modalData.flag === '1') {
        // this.modalData.primaryContact = 'Y'
        // this.modalData.contactStatus = '启用'
        customerInformationSave(this.modalData).then(({data}) => {
          if (data && data.code === 0) {
            this.getDataList()
            this.modalFlag = false
            this.$message({
              message: '操作成功',
              type: 'success',
              duration: 1500,
              onClose: () => {
              }
            })
          } else {
            this.$alert(data.msg, '错误', {
              confirmButtonText: '确定'
            })
          }
        })
      } else {
        customerInformationEdit(this.modalData).then(({data}) => {
          if (data && data.code === 0) {
            this.getDataList()
            this.modalFlag = false
            this.$message({
              message: '操作成功',
              type: 'success',
              duration: 1500,
              onClose: () => {
              }
            })
          } else {
            this.$alert(data.msg, '错误', {
              confirmButtonText: '确定'
            })
          }
        })
      }
    },
    /**
     * 客户联系人新增/编辑
     */
    saveContactData() {
      if (this.contactModalData.contactName === '' || this.contactModalData.contactName == null) {
        this.$message.warning('请输入联系人！')
        return
      }
      if (this.contactModalData.contactPhoneNumber1 === '' || this.contactModalData.contactPhoneNumber1 == null) {
        this.$message.warning('请输入联系人电话(1)！')
        return
      }
      if (this.contactModalData.primaryContact === '' || this.contactModalData.primaryContact == null) {
        this.$message.warning('请选择是否为默认联系人！')
        return
      }
      if (this.contactModalData.contactStatus === '' || this.contactModalData.contactStatus == null) {
        this.$message.warning('请选择状态！')
        return
      }
      if (this.contactModalData.flag === '1') {
        customerContactSave(this.contactModalData).then(({data}) => {
          if (data && data.code === 0) {
            this.getCustomerContactList()
            this.contactModalFlag = false
            this.$message({
              message: '操作成功',
              type: 'success',
              duration: 1500,
              onClose: () => {
              }
            })
          } else {
            this.$alert(data.msg, '错误', {
              confirmButtonText: '确定'
            })
          }
        })
      } else {
        customerContactEdit(this.contactModalData).then(({data}) => {
          if (data && data.code === 0) {
            this.getCustomerContactList()
            this.contactModalFlag = false
            this.$message({
              message: '操作成功',
              type: 'success',
              duration: 1500,
              onClose: () => {
              }
            })
          } else {
            this.$alert(data.msg, '错误', {
              confirmButtonText: '确定'
            })
          }
        })
      }
    },
    /**
     * 客户联系地址新增/编辑
     */
    saveAddressData() {
      if (this.addressModalData.addressName === '' || this.addressModalData.addressName == null) {
        this.$message.warning('请输入地址！')
        return
      }
      if (this.addressModalData.defaultAddress === '' || this.addressModalData.defaultAddress == null) {
        this.$message.warning('请选择是否为主要地址！')
        return
      }
      if (this.addressModalData.addressStatus === '' || this.addressModalData.addressStatus == null) {
        this.$message.warning('请选择状态！')
        return
      }
      if (this.addressModalData.addressType === '' || this.addressModalData.addressType == null) {
        this.$message.warning('请选择地址类型！')
        return
      }
      if (this.addressModalData.flag === '1') {
        customerAddressSave(this.addressModalData).then(({data}) => {
          if (data && data.code === 0) {
            this.getCustomerAddressList()
            this.addressModalFlag = false
            this.$message({
              message: '操作成功',
              type: 'success',
              duration: 1500,
              onClose: () => {
              }
            })
          } else {
            this.$alert(data.msg, '错误', {
              confirmButtonText: '确定'
            })
          }
        })
      } else {
        customerAddressEdit(this.addressModalData).then(({data}) => {
          if (data && data.code === 0) {
            this.getCustomerAddressList()
            this.addressModalFlag = false
            this.$message({
              message: '操作成功',
              type: 'success',
              duration: 1500,
              onClose: () => {
              }
            })
          } else {
            this.$alert(data.msg, '错误', {
              confirmButtonText: '确定'
            })
          }
        })
      }
    },
    /**
     * 客户项目信息新增/编辑
     */
    saveProjectInformationData() {
      if (this.projectInformationModalData.projectTypeDb === '' || this.projectInformationModalData.projectTypeDb == null) {
        this.$message.warning('请选择项目类型！')
        return
      }
      if (this.projectInformationModalData.projectName === '' || this.projectInformationModalData.projectName == null) {
        this.$message.warning('请输入项目名称！')
        return
      }
      if (this.projectInformationModalData.projectSource === '' || this.projectInformationModalData.projectSource == null) {
        this.$message.warning('请选择项目来源！')
        return
      }
      if (this.projectInformationModalData.priority === '' || this.projectInformationModalData.priority == null) {
        this.$message.warning('请选择优先级！')
        return
      }
      if (this.projectInformationModalData.needDate === '' || this.projectInformationModalData.needDate == null) {
        this.$message.warning('请选择要求日期！')
        return
      }
      if (this.projectInformationModalData.projectManagerName === '' || this.projectInformationModalData.projectManagerName == null) {
        this.$message.warning('请选择项目经理！')
        return
      }
      if (this.projectInformationModalData.projectOwnerName === '' || this.projectInformationModalData.projectOwnerName == null) {
        this.$message.warning('请选择项目负责人！')
        return
      }
      if (this.projectInformationModalData.userRoleName === '' || this.projectInformationModalData.userRoleName == null) {
        this.$message.warning('请选择权限！')
        return
      }
      saveProjectInfo(this.projectInformationModalData).then(({data}) => {
        if (data && data.code === 0) {
          this.getProjectInformationList()
          this.projectInformationModalFlag = false
          this.$message({
            message: '操作成功',
            type: 'success',
            duration: 1500,
            onClose: () => {
            }
          })
        } else {
          this.$alert(data.msg, '错误', {
            confirmButtonText: '确定'
          })
        }
      })
    },

    // ======== 列表单机选中方法 ========
    /**
     * 单机选中客户信息
     * @param row
     */
    customerClickRow(row) {
      this.customerCurrentRow = JSON.parse(JSON.stringify(row))
    },
    /**
     * 单机选中客户联系人
     * @param row
     */
    contactClickRow(row) {
      this.$refs.contactTable.toggleRowSelection(row)
      this.contactCurrentRow = JSON.parse(JSON.stringify(row))
    },
    /**
     * 单机选中客户联系地址
     * @param row
     */
    addressClickRow(row) {
      this.$refs.addressTable.toggleRowSelection(row)
      this.addressCurrentRow = JSON.parse(JSON.stringify(row))
    },
    /**
     * 单机选中客户项目信息
     * @param row
     */
    projectInformationClickRow(row, column) {
      if (column.label !== '项目号') {
        this.$refs.projectInformationTable.toggleRowSelection(row)
        this.projectInformationCurrentRow = JSON.parse(JSON.stringify(row))
      }
    },

    // ======== 列表复选方法 ========
    /**
     * 复选客户信息
     * @param val
     */
    selectionCustomer(val) {
      this.customerSelections = val
    },
    /**
     * 复选客户联系人
     * @param val
     */
    selectionContact(val) {
      this.contactSelections = val
    },
    /**
     * 复选客户联系人
     * @param val
     */
    selectionAddress(val) {
      this.addressSelections = val
    },
    /**
     * 复选客户项目信息
     * @param val
     */
    selectionProjectInformation(val) {
      this.projectInformationSelections = val
    },

    // 客户组1输入校验
    customerGroupBlur(tagNo) {
      if (this.modalData.customerGroupId1 != null && this.modalData.customerGroupId1 !== '') {
        let tempData = {
          tagno: tagNo,
          conditionSql: " and customer_group_id = '" + this.modalData.customerGroupId1 + "'" + " and site = '" + this.modalData.site + "'"
        }
        verifyData(tempData).then(({data}) => {
          if (data && data.code === 0) {
            if (data.baseListData.length > 0) {
              this.modalData.customerGroupId1 = data.baseListData[0].customer_group_id
              this.modalData.customerGroupName1 = data.baseListData[0].customer_group_name
              return
            }
          }
        })
      }
      this.modalData.customerGroupName1 = ''
    },

    // 客户组2输入校验
    customerGroupBlur2(tagNo) {
      if (this.modalData.customerGroupId2 != null && this.modalData.customerGroupId2 !== '') {
        let tempData = {
          tagno: tagNo,
          conditionSql: " and customer_group_id = '" + this.modalData.customerGroupId2 + "'" + " and site = '" + this.modalData.site + "'"
        }
        verifyData(tempData).then(({data}) => {
          if (data && data.code === 0) {
            if (data.baseListData.length > 0) {
              this.modalData.customerGroupId2 = data.baseListData[0].customer_group_id
              this.modalData.customerGroupName2 = data.baseListData[0].customer_group_name
              return
            }
          }
        })
      }
      this.modalData.customerGroupName2 = ''
    },

    // ======== chooseList相关方法 ========
    /**
     * 获取基础数据列表S
     * @param val
     * @param type
     */
    getBaseList(val, type) {
      this.tagNo = val
      this.tagNo1 = type
      this.$nextTick(() => {
        let strVal = ''
        if (val === 1010) {
          if (type === 1) {
            strVal = this.projectInformationModalData.projectTypeDb
          }
        }
        if (val === 102) {
          if (type === 1) {
            strVal = this.projectInformationModalData.customerId
          }
        }
        if (val === 1011) {
          if (type === 1) {
            strVal = this.projectInformationModalData.projectSource
          }
        }
        if (val === 1012) {
          if (type === 1) {
            strVal = this.projectInformationModalData.priority
          }
        }
        if (val === 120) {
          strVal = this.modalData.customerGroupId1
        } else if (val === 121) {
          strVal = this.modalData.customerGroupId2
        }
        this.$refs.baseList.init(val, strVal)
      })
    },
    /**
     * 列表方法的回调
     * @param val
     */
    getBaseData(val) {
      if (this.tagNo === 1010) {
        if (this.tagNo1 === 1) {
          this.projectInformationModalData.projectTypeDb = val.Base_id
          this.projectInformationModalData.projectType = val.Base_desc
        }
      }
      if (this.tagNo === 102) {
        if (this.tagNo1 === 1) {
          this.projectInformationModalData.customerId = val.Customer_no
          this.projectInformationModalData.customerName = val.Customer_desc
        }
      }
      if (this.tagNo === 1011) {
        if (this.tagNo1 === 1) {
          this.projectInformationModalData.projectSource = val.Base_id
          this.projectInformationModalData.projectSourceDesc = val.Base_desc
        }
      }
      if (this.tagNo === 1012) {
        if (this.tagNo1 === 1) {
          this.projectInformationModalData.priority = val.Base_id
          this.projectInformationModalData.priorityDesc = val.Base_desc
        }
      }
      if (this.tagNo === 120) {
        this.modalData.customerGroupId1 = val.customer_group_id
        this.modalData.customerGroupName1 = val.customer_group_name
      } else if (this.tagNo === 121) {
        this.modalData.customerGroupId2 = val.customer_group_id
        this.modalData.customerGroupName2 = val.customer_group_name
      }
    },
    /**
     * 项目经理选择模态框
     */
    managerChooseModal() {
      // 清空穿梭框的选中值
      this.$nextTick(() => {
        this.$refs.managerTransfer.$refs.leftPanel.checked = []
        this.$refs.managerTransfer.$refs.rightPanel.checked = []
      })
      let inData = {
        site: this.projectInformationModalData.site,
        projectId: this.projectInformationModalData.projectId,
      }
      searchOperatorWithSite(inData).then(({data}) => {
        this.operatorList = data.rows
      })
      this.projectManagerList = JSON.parse(JSON.stringify(this.projectInformationModalData.projectManagerList))
      this.managerFlag = true
    },
    /**
     * 项目经理选择
     */
    saveManagerList() {
      let projectManagerName = ''
      for (let i = 0; i < this.projectManagerList.length; i++) {
        let select = this.operatorList.filter(item => item.operatorId === this.projectManagerList[i])
        if (select.length > 0) {
          projectManagerName += select[0].operatorName + ';'
        }
      }
      this.projectInformationModalData.projectManagerName = projectManagerName
      this.projectInformationModalData.projectManagerList = JSON.parse(JSON.stringify(this.projectManagerList))
      this.managerFlag = false
    },
    /**
     * 项目负责人选择模态框
     */
    ownerChooseModal() {
      // 清空穿梭框的选中值
      this.$nextTick(() => {
        this.$refs.ownerTransfer.$refs.leftPanel.checked = []
        this.$refs.ownerTransfer.$refs.rightPanel.checked = []
      })
      let inData = {
        site: this.projectInformationModalData.site,
        projectId: this.projectInformationModalData.projectId,
      }
      searchOperatorWithSite(inData).then(({data}) => {
        this.operatorList = data.rows
      })
      this.projectOwnerList = JSON.parse(JSON.stringify(this.projectInformationModalData.projectOwnerList))
      this.ownerFlag = true
    },
    /**
     * 项目负责人选择
     */
    saveOwnerList() {
      let projectOwnerName = ''
      for (let i = 0; i < this.projectOwnerList.length; i++) {
        let select = this.operatorList.filter(item => item.operatorId === this.projectOwnerList[i])
        if (select.length > 0) {
          projectOwnerName += select[0].operatorName + ';'
        }
      }
      this.projectInformationModalData.projectOwnerName = projectOwnerName
      this.projectInformationModalData.projectOwnerList = JSON.parse(JSON.stringify(this.projectOwnerList))
      this.ownerFlag = false
    },
    /**
     * 项目权限模态框
     */
    userRollModal() {
      this.userRoleList = JSON.parse(JSON.stringify(this.projectInformationModalData.userRoleList))
      this.userRoleFlag = true
    },
    changeAll(row) {
      if (row.checkAll) {
        row.searchCheck = true
        row.updateCheck = true
        row.downCheck = true
        row.deleteCheck = true
        row.searchFlag = 'Y'
        row.updateFlag = 'Y'
        row.downFlag = 'Y'
        row.deleteFlag = 'Y'
      } else {
        row.searchCheck = false
        row.updateCheck = false
        row.downCheck = false
        row.deleteCheck = false
        row.searchFlag = 'N'
        row.updateFlag = 'N'
        row.downFlag = 'N'
        row.deleteFlag = 'N'
      }
    },
    changeCheck(row, type) {
      if (type === 1) {
        if (row.searchCheck) {
          row.searchFlag = 'Y'
        } else {
          row.searchFlag = 'N'
        }
      }
      if (type === 2) {
        if (row.updateCheck) {
          row.updateFlag = 'Y'
        } else {
          row.updateFlag = 'N'
        }
      }
      if (type === 3) {
        if (row.downCheck) {
          row.downFlag = 'Y'
        } else {
          row.downFlag = 'N'
        }
      }
      if (type === 4) {
        if (row.deleteCheck) {
          row.deleteFlag = 'Y'
        } else {
          row.deleteFlag = 'N'
        }
      }
      if (row.searchCheck && row.updateCheck && row.downCheck && row.deleteCheck) {
        row.checkAll = true
      } else {
        row.checkAll = false
      }
      this.$forceUpdate();
    },
    saveUserList() {
      let name = ''
      for (let i = 0; i < this.userRoleList.length; i++) {
        if (this.userRoleList[i].searchCheck || this.userRoleList[i].updateCheck || this.userRoleList[i].downCheck || this.userRoleList[i].deleteCheck) {
          name += this.userRoleList[i].userDisplay + ';'
        }
      }
      this.projectInformationModalData.userRoleName = name
      this.projectInformationModalData.userRoleList = JSON.parse(JSON.stringify(this.userRoleList))
      this.userRoleFlag = false
    },

    // ======== 导出相关方法 ========
    /**
     * 导出excel
     */
    async createExportData() {
      this.searchData.limit = -1
      this.searchData.page = 1
      await customerInformationSearch(this.searchData).then(({data}) => {
        this.resultList = data.page.list
      })
      return this.resultList
    },
    startDownload() {
    },
    finishDownload() {
    },
    fields() {
      let json = '{'
      this.columnList.forEach((item, index) => {
        if (index == this.columnList.length - 1) {
          json += '"' + item.columnLabel + '"' + ':' + '"' + item.columnProp + '"'
        } else {
          json += '"' + item.columnLabel + '"' + ':' + '"' + item.columnProp + '"' + ','
        }
      })
      json += '}'
      let s = eval('(' + json + ')')
      return s
    },
    clickProjectId(projectId) {
      if (this.$router.resolve('project-projectInfo/projectInfo').resolved.name === '404') {
        this.$alert('权限不足,访问失败', '警告', {confirmButtonText: '确定',});
      } else {
        this.$router.push({name: "project-projectInfo/projectInfo", params: {projectId: projectId},})
      }
    },
    rowStyle({row}) {
      if (this.customerCurrentRow.customerNo === row.customerNo) {
        return {'background-color': '#E8F7F6', cursor: 'pointer'};
      }
    },
  }
}
</script>

<style scoped lang="scss">
/deep/ .customer-tab .el-tabs__content {
  padding: 0px !important;
}

.el-transfer-panel {
  border: 2px solid #17b3a3;
  border-radius: 4px;
  overflow: hidden;
  background: #fff;
  display: inline-block;
  vertical-align: middle;
  width: 200px;
  max-height: 100%;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  position: relative;
}

.el-transfer-panel .el-transfer-panel__header {
  height: 40px;
  line-height: 40px;
  background: #17b3a3;
  margin: 0;
  padding-left: 15px;
  border-bottom: 1px solid #17b3a3;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  color: #000;
}

.el-transfer-panel .el-transfer-panel__header .el-checkbox .el-checkbox__label {
  font-size: 14px;
  color: #303133;
  font-weight: 400;
}

.numInput /deep/ .el-input__inner {
  text-align: right;
}

/deep/ .inlineNumber input::-webkit-outer-spin-button,
/deep/ .inlineNumber input::-webkit-inner-spin-button {
  -webkit-appearance: none;

}

/deep/ .inlineNumber input[type="number"] {
  -moz-appearance: textfield;
  padding-right: 5px !important;
}
</style>