zhgdyun/src/views/projectFront/projectSummary/cooperationUnit.vue

<template>
  <!-- 合作单位 ，该页面还用于企业后台 - 企业库 通过路由来判断页面类型-->
  <div class="cooperator flex" v-if="!showDetail">
    <div class="left whiteBlock">
      <div class="title">{{ $t('message.cooperationUnit.flatType') }}</div>
      <vue-scroll style="height: 95%">
        <!-- <el-menu
          default-active="1"
          class="el-menu-vertical-demo"
          background-color="#fbfbfb"
          text-color="#2A2E3F"
          active-text-color="#2A2E3F"
        >
          <el-menu-item
            :index="setString(item.id)"
            class="el-menu-item"
            :class="checkedId == item.id ? 'checked_item' : ''"
            v-for="(item, index) in enterpriseTypeList"
            @click="selectMenu(item)"
            :key="index"
          >
            <span slot="title">{{ item.companyTypeName }}</span>
          </el-menu-item>
        </el-menu> -->
        <ul>
          <li
            class="el-menu-item2"
            :class="checkedId == item.id ? 'checked_item' : ''"
            v-for="(item, index) in enterpriseTypeList"
            @click="selectMenu(item)"
            :key="index"
          >
            {{ item.companyTypeName }}
          </li>
        </ul>
      </vue-scroll>
    </div>
    <div class="right whiteBlock">
      <div class="title flex2">
        <span>{{ enterpriseTypeName }}</span>
        <span class="right_value">
          <span
            >{{ enterpriseTypeName
            }}{{ $t('message.cooperationUnit.sum') }}：</span
          >
          <span class="value">{{ listData.length }}</span></span
        >
      </div>
      <div class="content">
        <div class="flex2" style="margin-bottom: 10px">
          <el-form :inline="true" class="demo-form-inline" size="small">
            <el-form-item>
              <el-button type="primary" style="height: 32px" @click="addBtn">{{
                $t('message.cooperationUnit.add')
              }}</el-button>
            </el-form-item>
            <!-- <el-form-item>
              <el-button type="primary" style="height: 32px"
                >从企业选择</el-button
              >
            </el-form-item>-->
            <el-form-item>
              <el-button
                type="primary"
                style="height: 32px"
                :disabled="checkedDeleteList.length == 0"
                @click="deleteInBatches"
                >{{ $t('message.cooperationUnit.deleteInBatches') }}</el-button
              >
            </el-form-item>
            <!-- <el-form-item>
              <el-button type="primary" style="height: 32px"
                >显示已删除项</el-button
              >
            </el-form-item> -->
            <el-form-item>
              <el-button
                type="primary"
                style="height: 32px"
                :disabled="checkedDeleteList.length == 0"
                @click="moveInBatches"
              >
                <!-- 批量移动 -->
                {{ $t('message.projectInfo.batchMobile') }}
              </el-button>
            </el-form-item>
          </el-form>
          <el-form :inline="true" class="demo-form-inline" size="small">
            <el-form-item>
              <el-input
                :placeholder="$t('message.laborMange.placeholder1')"
                v-model="enterpriseName"
                style="width: 260px"
                clearable
              >
                ></el-input
              >
            </el-form-item>
            <el-form-item>
              <el-button
                type="primary"
                plain
                style="height: 32px"
                @click="getCooperatorList"
                >{{ $t('message.laborMange.inquire') }}</el-button
              >
            </el-form-item>
          </el-form>
        </div>
        <vue-scroll style="height: 80%" v-if="!noDataList">
          <div class="list_wrap flex">
            <div
              class="list"
              @click="goDetailPage(item.id, item.projectEnterpriseId)"
              v-for="(item, index) in listData"
              :key="index"
            >
              <div class="name">{{ item.enterpriseName }}</div>
              <div class="code">
                {{ $t('message.laborMange.unifiedSocialCreditCode') }}：{{
                  item.socialCode
                }}
              </div>
              <div class="nature">
                <!-- 项目负责人： -->{{
                  $t('message.projectInfo.projectLeader') + ':'
                }}{{ item.projectDirectorName }}
              </div>
              <div class="nature">
                <!-- 项目负责人电话： -->{{
                  $t('message.projectInfo.projectLeaderPhone') + ':'
                }}{{ item.projectDirectorPhone }}
              </div>
              <!-- <div class="nature">
                {{ $t("message.cooperationUnit.enterpriseProperty") }}：{{
                  item.enterpriseProperty == 1
                    ? $t("message.laborMange.stateOwnedBusiness")
                    : item.enterpriseProperty == 2
                    ? $t("message.laborMange.overseasInvestedEnterprises")
                    : item.enterpriseProperty == 3
                    ? $t("message.laborMange.collectiveEnterprises")
                    : item.enterpriseProperty == 4
                    ? $t("message.laborMange.privateEnterprise")
                    : ""
                }}
              </div> -->
              <!-- <div class="encoded">企业编码：5678907</div> -->
              <div class="btn_wrap flex3">
                <div class="flex3" @click.stop="editBtn(item)">
                  <img src="@/assets/images/icon-edit.png" />
                  <el-button type="text" style="margin: 0 18px 0 5px">{{
                    $t('message.laborMange.edit')
                  }}</el-button>
                </div>
                <div class="flex3" @click.stop="deleteBtn(item)">
                  <img
                    src="@/assets/images/icon-delete.png"
                    style="margin-right: 5px"
                  />
                  <el-button type="text" style="color: red">{{
                    $t('message.laborMange.delete')
                  }}</el-button>
                </div>
              </div>
              <div class="deleteList" @click.stop>
                <el-checkbox-group
                  v-model="checkedDeleteList"
                  @change="getDeleteList"
                >
                  <el-checkbox :label="item.projectEnterpriseId"></el-checkbox>
                </el-checkbox-group>
              </div>
            </div>
          </div>
        </vue-scroll>
        <div v-else class="nodata_wrap">
          <img src="@/assets/images/noData.png" />
          <div>{{ $t('message.laborMange.noData') }}</div>
        </div>
        <el-pagination
          class="pagerBox"
          @size-change="handleSizeChange"
          @current-change="handleCurrentChange"
          :current-page="pageNo"
          :page-size="pageSize"
          layout="total, sizes, prev, pager, next"
          :total="Number(total)"
          background
          style="margin-top: 40px"
        ></el-pagination>
      </div>
    </div>
    <!-- 新增 || 编辑 企业弹窗 -->
    <el-dialog
      :modal-append-to-body="false"
      :title="enterpriseDialogTitle"
      :close-on-click-modal="false"
      :visible.sync="addEnterpriseDialog"
      width="750px"
      @close="close"
    >
      <vue-scroll class="adddialog" style="height: 618px">
        <div class="dialog_content" ref="enterpriseDialog">
          <el-form
            size="small"
            ref="enterpriseForm"
            :model="enterpriseForm"
            :rules="enterpriseFormRules"
            label-position="top"
            label-width="80px"
          >
            <el-row :gutter="24">
              <el-col :span="12">
                <el-form-item
                  :label="$t('message.laborMange.theNameOfFirm')"
                  prop="enterpriseName"
                >
                  <el-input
                    v-model="enterpriseForm.enterpriseName"
                    :placeholder="$t('message.laborMange.placeholder2')"
                  ></el-input>
                </el-form-item>
              </el-col>
              <el-col :span="12">
                <el-form-item
                  :label="$t('message.laborMange.legalRepresentative')"
                  prop="enterpriseLegalPerson"
                >
                  <el-input
                    v-model="enterpriseForm.enterpriseLegalPerson"
                    :placeholder="$t('message.laborMange.placeholder2')"
                  ></el-input>
                </el-form-item>
              </el-col>
            </el-row>
            <el-row :gutter="24">
              <!-- 企业类型 -->
              <el-col :span="12">
                <el-form-item
                  :label="$t('message.laborMange.formOfBusiness')"
                  prop="companyTypeName"
                >
                  <el-select
                    v-model="enterpriseForm.companyTypeName"
                    :placeholder="$t('message.laborMange.pleaseChoose')"
                    style="width: 100%"
                    :disabled="true"
                  >
                    <el-option
                      v-for="item in enterpriseTypeList"
                      :key="item.id"
                      :label="item.companyTypeName"
                      :value="item.companyTypeName"
                    ></el-option>
                  </el-select>
                </el-form-item>
              </el-col>
              <el-col :span="12">
                <el-form-item
                  :label="$t('message.laborMange.unifiedSocialCreditCode')"
                  prop="socialCode"
                >
                  <el-input
                    v-model="enterpriseForm.socialCode"
                    :placeholder="$t('message.laborMange.placeholder2')"
                    maxlength="18"
                  ></el-input>
                </el-form-item>
              </el-col>
            </el-row>
            <el-row :gutter="24">
              <el-col :span="12">
                <el-form-item
                  :label="$t('message.projectInfo.projectLeader')"
                  prop="projectDirectorName"
                >
                  <el-input
                    v-model="enterpriseForm.projectDirectorName"
                    :placeholder="$t('message.laborMange.placeholder2')"
                    maxlength="18"
                  ></el-input>
                </el-form-item>
              </el-col>
              <el-col :span="12">
                <el-form-item
                  :label="$t('message.projectInfo.projectLeaderPhone')"
                  prop="projectDirectorPhone"
                >
                  <el-input
                    type="number"
                    v-model="enterpriseForm.projectDirectorPhone"
                    :placeholder="$t('message.laborMange.placeholder2')"
                    maxlength="18"
                  ></el-input>
                </el-form-item>
              </el-col>
            </el-row>
            <el-row :gutter="24">
              <el-col :span="12">
                <el-form-item
                  :label="$t('message.laborMange.openingBank')"
                  prop="bankname"
                >
                  <el-input
                    v-model="enterpriseForm.bankname"
                    :placeholder="$t('message.laborMange.placeholder2')"
                  ></el-input>
                </el-form-item>
              </el-col>
              <el-col :span="12">
                <el-form-item
                  :label="$t('message.laborMange.registeredCapital')"
                  prop="registeredCapital"
                >
                  <el-input
                  type="number"
                    @change="checkValue()"
                    v-model="enterpriseForm.registeredCapital"
                    placeholder="请输入数字类型"
                  ></el-input>
                </el-form-item>
              </el-col>
            </el-row>
            <el-row :gutter="24">
              <el-col :span="12">
                <el-form-item
                  :label="$t('message.laborMange.numberOfRegistrant')"
                  prop="registerPersonPhoneTel"
                >
                  <el-input
                    type="number"
                    v-model="enterpriseForm.registerPersonPhoneTel"
                    maxlength="11"
                    :placeholder="$t('message.laborMange.placeholder2')"
                  ></el-input>
                </el-form-item>
              </el-col>
              <el-col :span="12">
                <el-form-item
                  :label="$t('message.laborMange.bankAccount')"
                  prop="bankcardnumber"
                >
                  <el-input
                    v-model="enterpriseForm.bankcardnumber"
                    :placeholder="$t('message.laborMange.placeholder2')"
                  ></el-input>
                </el-form-item>
              </el-col>
            </el-row>
            <el-row :gutter="24">
              <el-col :span="12">
                <el-form-item
                  :label="$t('message.laborMange.legalPersonPhone')"
                  prop="legalPersonTel"
                >
                  <el-input
                    type="number"
                    v-model="enterpriseForm.legalPersonTel"
                    maxlength="11"
                    :placeholder="$t('message.laborMange.placeholder2')"
                  ></el-input>
                </el-form-item>
              </el-col>
              <el-col :span="12">
                <el-form-item
                  :label="$t('message.laborMange.businessNumber')"
                  prop="businessNumber"
                >
                  <el-input
                    v-model="enterpriseForm.businessNumber"
                    :placeholder="$t('message.laborMange.placeholder2')"
                  ></el-input>
                </el-form-item>
              </el-col>
            </el-row>
            <el-row :gutter="24">
              <el-col :span="12">
                <el-form-item
                  :label="$t('message.laborMange.businessLicense')"
                  prop="businessLicenseEndDate"
                >
                  <el-date-picker
                    v-model="enterpriseForm.businessLicenseEndDate"
                    type="date"
                    :placeholder="$t('message.laborMange.pleaseSelectADate')"
                    value-format="yyyy-MM-dd"
                    style="width: 100%"
                  ></el-date-picker>
                </el-form-item>
              </el-col>
              <el-col :span="12">
                <el-form-item
                  :label="$t('message.laborMange.addressOfPlant')"
                  prop="enterpriseAddress"
                >
                  <el-input
                    v-model="enterpriseForm.enterpriseAddress"
                    :placeholder="$t('message.laborMange.placeholder2')"
                  ></el-input>
                </el-form-item>
              </el-col>
            </el-row>
            <el-row :gutter="24">
              <el-col :span="12">
                <el-form-item
                  :label="$t('message.laborMange.enterpriseMailbox')"
                  prop="enterpriseEmail"
                >
                  <el-input
                    v-model="enterpriseForm.enterpriseEmail"
                    :placeholder="$t('message.laborMange.placeholder2')"
                  ></el-input>
                </el-form-item>
              </el-col>
              <el-col :span="12">
                <el-form-item
                  :label="$t('message.laborMange.safetyProductionLicense')"
                  prop="enterpriseSafeAllow"
                >
                  <el-input
                    v-model="enterpriseForm.enterpriseSafeAllow"
                    :placeholder="$t('message.laborMange.placeholder2')"
                  ></el-input>
                </el-form-item>
              </el-col>
            </el-row>
            <el-row :gutter="24">
              <el-col :span="12">
                <el-form-item
                  :label="$t('message.laborMange.laborCertificateNo')"
                  prop="qualificationNumber"
                >
                  <el-input
                    v-model="enterpriseForm.qualificationNumber"
                    :placeholder="$t('message.laborMange.placeholder2')"
                  ></el-input>
                </el-form-item>
              </el-col>
              <el-col :span="12">
                <el-form-item
                  :label="$t('message.laborMange.natureOfUnit')"
                  prop="enterpriseProperty"
                >
                  <el-select
                    v-model="enterpriseForm.enterpriseProperty"
                    :placeholder="$t('message.laborMange.pleaseChoose')"
                    style="width: 100%"
                  >
                    <el-option
                      :label="$t('message.laborMange.stateOwnedBusiness')"
                      :value="1"
                    ></el-option>
                    <el-option
                      :label="
                        $t('message.laborMange.overseasInvestedEnterprises')
                      "
                      :value="2"
                    ></el-option>
                    <el-option
                      :label="$t('message.laborMange.collectiveEnterprises')"
                      :value="3"
                    ></el-option>
                    <el-option
                      :label="$t('message.laborMange.privateEnterprise')"
                      :value="4"
                    ></el-option>
                  </el-select>
                </el-form-item>
              </el-col>
            </el-row>
            <el-row :gutter="24">
              <el-col :span="12">
                <!-- 父级企业 -->
                <el-form-item
                  :label="$t('message.projectInfo.theParentCompany')"
                  prop="parentEnterpriseId"
                >
                  <el-select
                    v-model="enterpriseForm.parentEnterpriseId"
                    :placeholder="
                      $t('message.projectInfo.pleaseChoose') +
                      $t('message.projectInfo.theParentCompany')
                    "
                    filterable
                    clearable
                    style="width: 100%"
                  >
                    <el-option
                      v-for="(item, index) in parentEnterpriseList"
                      :label="item.enterpriseName"
                      :value="item.id"
                      :key="index"
                    >
                    </el-option>
                  </el-select>
                </el-form-item>
              </el-col>
              <el-col :span="12">
                <!-- 排序 -->
                <el-form-item
                  :label="$t('message.projectInfo.sort')"
                  prop="num"
                >
                  <el-input-number
                    v-model="enterpriseForm.sortNum"
                    @change="handleChangeNum"
                    :min="0"
                  ></el-input-number>
                </el-form-item>
              </el-col>
            </el-row>
            <el-row v-if="company == 'nanchang'" :gutter="24">
              <!-- 企业管理 -->
              <el-col :span="12">
                <el-form-item
                  :label="$t('message.projectInfo.departmentType')"
                  prop="departmentType"
                >
                  <!-- 否 -->
                  <el-radio
                    v-model="enterpriseForm.departmentType"
                    :label="1"
                    >{{ $t('message.laborDev.whetherList')[0] }}</el-radio
                  >
                  <!-- 是 -->
                  <el-radio
                    v-model="enterpriseForm.departmentType"
                    :label="2"
                    >{{ $t('message.laborDev.whetherList')[1] }}</el-radio
                  >
                </el-form-item>
              </el-col>
            </el-row>
            <el-row :gutter="24">
              <el-col :span="12">
                <el-form-item
                  :label="$t('message.laborMange.photosOfQualification')"
                  prop="enterpriseQualificationUrl"
                >
                  <el-upload
                    class="upload-demo"
                    :action="uploadUrl"
                    :on-remove="
                      (file, flexList) => handleRemove(file, flexList, 1)
                    "
                    :on-success="(file) => handleSuccess(file, 1)"
                    :on-error="(file) => handleError(file, 1)"
                    :on-preview="(file) => handlePreview(file, 1)"
                    :before-upload="(file) => handleBeforeUpload(file, 1)"
                    name="files"
                    :file-list="aptitudeFileList"
                  >
                    <el-button size="small" type="primary">{{
                      $t('message.laborMange.clickOnTheUpload')
                    }}</el-button>
                  </el-upload>
                </el-form-item>
              </el-col>
              <el-col :span="12">
                <el-form-item label="logo" prop="logo">
                  <el-upload
                    class="upload-demo"
                    :action="uploadUrl"
                    :on-remove="
                      (file, flexList) => handleRemove(file, flexList, 2)
                    "
                    :on-success="(file) => handleSuccess(file, 2)"
                    :on-error="(file) => handleError(file, 2)"
                    :on-preview="(file) => handlePreview(file, 2)"
                    :before-upload="(file) => handleBeforeUpload(file, 2)"
                    name="files"
                    :file-list="logoFileList"
                  >
                    <el-button size="small" type="primary">{{
                      $t('message.laborMange.clickOnTheUpload')
                    }}</el-button>
                  </el-upload>
                </el-form-item>
              </el-col>
            </el-row>
          </el-form>
          <div class="dialog-footer addpage">
            <el-button
              class="cancleBtn"
              @click="addEnterpriseDialog = false"
              icon="el-icon-circle-close"
              size="medium"
              >{{ $t('message.laborMange.cancel') }}</el-button
            >
            <el-button
              type="primary"
              icon="el-icon-circle-check"
              @click="saveEnterpriseFn('enterpriseForm')"
              size="medium"
              >{{ $t('message.laborMange.confirm') }}</el-button
            >
          </div>
        </div>
      </vue-scroll>
    </el-dialog>
    <el-dialog
      :modal-append-to-body="false"
      :title="$t('message.projectInfo.batchMobile')"
      :close-on-click-modal="false"
      :visible.sync="moveEnterpriseDialog"
      width="750px"
    >
      <el-form :inline="true" size="medium" ref="selectForm">
        <!-- 目标企业类型 -->
        <el-form-item
          :label="$t('message.projectInfo.targetCompanyType')"
          prop="enterpriseType"
        >
          <el-select
            v-model="enterpriseType"
            :placeholder="
              $t('message.projectInfo.pleaseChoose') +
              $t('message.projectInfo.targetCompanyType')
            "
            filterable
            clearable
          >
            <el-option
              v-for="(item, index) in enterpriseTypeList"
              :label="item.companyTypeName"
              :value="item.id"
              :key="index"
            >
            </el-option>
          </el-select>
        </el-form-item>
      </el-form>
      <div class="dialog-footer">
        <el-button
          class="cancleBtn"
          @click="moveEnterpriseDialog = false"
          icon="el-icon-circle-close"
          size="medium"
        >
          <!-- 取消 -->
          {{ $t('message.energyManage.material.cancel') }}
        </el-button>
        <el-button
          type="primary"
          icon="el-icon-circle-check"
          @click="moveEnterpriseFn"
          size="medium"
        >
          <!-- 确定 -->
          {{ $t('message.energyManage.material.confirm') }}
        </el-button>
      </div>
    </el-dialog>
  </div>
  <!-- 企业信息--详情 -->
  <div v-else class="cooperatorDetail">
    <div class="flex3 navigationTitle">
      <el-button
        type="text"
        icon="el-icon-d-arrow-left"
        @click="showDetail = false"
        style="margin-left: 20px"
        >{{ $t('message.cooperationUnit.back') }}</el-button
      >
      <div style="margin-left: 30px">
        {{ $t('message.cooperationUnit.companyDetails') }}
      </div>
    </div>
    <Detail :detailId="detailId" :projectEnterpriseId="projectEnterpriseId" />
  </div>
</template>
<script>
import Detail from './cooperatorDatails'
import {
  getEnterpriseTypeList,
  setEnterpriseInfo,
  editEnterpriseInfo,
  deleteEnterprise,
  updateEnterpriseTypeApi,
} from '@/assets/js/api/laborPerson'
import {
  getCooperatorListApi,
  deleteBatchApi,
} from '@/assets/js/api/cooperationUnit'
import {
  CheckSocialCreditCode,
  checkPhone
} from '@/assets/js/util.js'
export default {
  components: {
    Detail,
  },
  data() {
    return {
      checkedId: 1,
      enterpriseTypeId: '',
      enterpriseTypeName: '',
      projectSn: '',
      enterpriseName: '',
      pageNo: 1,
      pageSize: 10,
      total: 0,
      listData: [], //建设单位  列表数据
      addEnterpriseDialog: false,
      enterpriseDialogTitle: this.$t('message.laborMange.theNewEnterprise'),
      enterpriseDialogType: 1,
      //新增企业表单
      enterpriseForm: {
        bankcardnumber: '', //银行卡号
        bankname: '', // 开户行
        businessLicenseEndDate: '', // 营业执照截止日期
        businessNumber: '', //营业执照注册号
        enterpriseAddress: '', //企业地址
        enterpriseEmail: '', //企业邮箱
        enterpriseLegalPerson: '', //法定代表人
        enterpriseName: '', //企业名称
        companyTypeName: '', //企业类型名称
        enterpriseProperty: '', //单位性质 1.国有企业 2三资企业 3集体企业 4私营企业
        enterpriseQualificationUrl: '', //企业资质图片地址
        enterpriseSafeAllow: '', //企业安全生产许可证
        enterpriseTypeId: '', //企业类型Id
        legalPersonTel: '', //法人电话
        logo: '', //logo
        projectSn: '', //项目Sn
        qualificationNumber: '', //资质证书号
        registerPersonPhoneTel: '', //注册人电话
        registeredCapital: '', //注册资金
        socialCode: '', //社会统一信用代码
        projectDirectorPhone: '',
        projectDirectorName: '',
        parentEnterpriseId: '',
        departmentType: '', // 企业管理
        sortNum: 0,
      },
      //校验新增企业表单
      enterpriseFormRules: this.$t('message.laborMange.enterpriseFormRules'),
      enterpriseTypeList: [],
      uploadUrl: '',
      fileUrl: '',
      aptitudeFileList: [], //资质照片列表
      logoFileList: [], // logo
      checkedDeleteList: [], //批量选中的数据
      showDetail: false,
      noDataList: false,
      detailId: '',
      projectEnterpriseId: '',
      pageType: 1, //1项目，2企业
      moveEnterpriseDialog: false,
      enterpriseType: '',
      parentEnterpriseList: [],
      departmentTypeList: [
        { id: 1, name: '是' },
        { id: 2, name: '否' },
      ],
    }
  },
  created() {
    this.company = COMPANY
    this.uploadUrl = this.$store.state.UPLOADURL
    this.fileUrl = this.$store.state.FILEURL
    if (this.$route.path.indexOf('companyAdmin/') != -1) {
      //是企业库页面
      this.projectSn = this.$store.state.projectSn
      // this.projectSn = this.$store.state.userInfo.headquartersSn
      this.pageType = 2
    } else {
      this.projectSn = this.$store.state.projectSn
      this.pageType = 1
    }

    this.getEnterpriseType()
    this.getParentEnterpriseList()
  },
  methods: {
    checkValue() {
      var value = '' + this.enterpriseForm.registeredCapital.toString();
      value = value
        .replace(/[^\d.]/g, '') // 清除“数字”和“.”以外的字符
        .replace(/\.{2,}/g, '.') // 只保留第一个. 清除多余的
        .replace(/^\./g, '')    //保证第一个为数字而不是.
        .replace('.', '$#$')
        .replace(/\./g, '')
        .replace('$#$', '.')
        .replace(/^(\-)*(\d+)\.(\d\d).*$/, '$1$2.$3'); // 只能输入两个小数
      if (value.indexOf('.') < 0 && value != '') {
        // 以上已经过滤，此处控制的是如果没有小数点，首位不能为类似于 01、02的金额
        value = parseFloat(value);

      }
      value = Number(value).toFixed(2); //不足补位
      this.enterpriseForm.registeredCapital = value;

    },
    close() {
      this.getParentEnterpriseList()
      this.addEnterpriseDialog = false
      this.$nextTick(() => {
        this.$refs['enterpriseForm'].clearValidate()
      })
    },
    //获取 单位类型
    getEnterpriseType() {
      let data = {}
      getEnterpriseTypeList(data).then((res) => {
        if (res.code == 200) {
          console.log('获取企业类型列表', res)
          this.enterpriseTypeList = res.result
          this.enterpriseTypeId = res.result[0].id
          console.log('==========单位名称', res)
          this.enterpriseTypeName = res.result[0].companyTypeName
          this.enterpriseForm.companyTypeName = res.result[0].companyTypeName
          console.log(this.enterpriseTypeList)
          this.getCooperatorList()
        }
      })
    },
    //获取列表数据
    getCooperatorList() {
      let data = {
        projectSn: this.projectSn,
        pageNo: this.pageNo,
        pageSize: this.pageSize,
        enterpriseTypeId: this.enterpriseTypeId,
        enterpriseName: this.enterpriseName,
      }
      getCooperatorListApi(data).then((res) => {
        if (res.code == 200) {
          if (res.result.records.length > 0) {
            this.listData = JSON.parse(JSON.stringify(res.result.records))
            this.total = res.result.total
            this.noDataList = false
          } else {
            this.noDataList = true
            this.listData = []
          }
        }
      })
    },
    // 获取父级企业列表
    getParentEnterpriseList() {
      let data = {
        projectSn: this.projectSn,
        pageNo: this.pageNo,
        pageSize: 10000,
        enterpriseTypeId: '',
        enterpriseName: '',
      }
      getCooperatorListApi(data).then((res) => {
        if (res.code == 200) {
          this.parentEnterpriseList = res.result.records
        }
      })
    },
    //转换字符串
    setString(item) {
      return String(item)
    },
    //切换 单位类型
    selectMenu(value) {
      console.log('切换菜单', value)
      this.checkedId = value.id
      this.enterpriseTypeName = value.companyTypeName
      this.enterpriseTypeId = value.id
      this.enterpriseForm.companyTypeName = value.companyTypeName
      this.getCooperatorList()
    },
    //新增按钮
    addBtn() {
      // this.$refs["enterpriseForm"].clearValidate();
      this.enterpriseForm = {
        bankcardnumber: '', //银行卡号
        bankname: '', // 开户行
        businessLicenseEndDate: '', // 营业执照截止日期
        businessNumber: '', //营业执照注册号
        enterpriseAddress: '', //企业地址
        enterpriseEmail: '', //企业邮箱
        enterpriseLegalPerson: '', //法定代表人
        enterpriseName: '', //企业名称
        companyTypeName: this.enterpriseForm.companyTypeName,
        enterpriseProperty: '', //单位性质 1.国有企业 2三资企业 3集体企业 4私营企业
        enterpriseQualificationUrl: '', //企业资质图片地址
        enterpriseSafeAllow: '', //企业安全生产许可证
        enterpriseTypeId: '', //企业类型Id
        legalPersonTel: '', //法人电话
        logo: '', //logo
        projectSn: '', //项目Sn
        qualificationNumber: '', //资质证书号
        registerPersonPhoneTel: '', //注册人电话
        registeredCapital: '', //注册资金
        socialCode: '', //社会统一信用代码
        parentEnterpriseId: '', //父级企业
        departmentType: '', // 企业管理
        sortNum: 0,
      }
      // console.log('==========',this.enterpriseForm.companyTypeName)
      this.aptitudeFileList = []
      this.logoFileList = []
      this.enterpriseDialogType = 1
      this.enterpriseDialogTitle = this.$t(
        'message.laborMange.theNewEnterprise'
      )
      this.addEnterpriseDialog = true
      this.enterpriseForm.enterpriseTypeId = Number(this.checkedId)
    },
    //编辑按钮
    editBtn(value) {
      this.parentEnterpriseList.forEach((item, index) => {
        if (value.id == item.id) {
          this.parentEnterpriseList.splice(index, 1)
        }
      })
      console.log(
        ' this.parentEnterpriseList删除后的',
        this.parentEnterpriseList
      )
      this.enterpriseDialogTitle = this.$t('message.laborMange.editEnterprise')
      this.enterpriseDialogType = 2
      this.aptitudeFileList = []
      this.logoFileList = []
      this.enterpriseForm = JSON.parse(JSON.stringify(value))
      let aptitude = this.enterpriseForm.enterpriseQualificationUrl
        ? this.enterpriseForm.enterpriseQualificationUrl.split(',')
        : []
      for (let i = 0; i < aptitude.length; i++) {
        let obj = {
          name: aptitude[i].split('*')[0],
          url: aptitude[i].split('*')[1],
        }
        this.aptitudeFileList.push(obj)
      }
      let logo = this.enterpriseForm.logo
        ? this.enterpriseForm.logo.split(',')
        : []

      for (let i = 0; i < logo.length; i++) {
        let obj = { name: logo[i].split('*')[0], url: logo[i].split('*')[1] }
        this.logoFileList.push(obj)
      }
      if (this.enterpriseForm.parentEnterpriseId == 0) {
        this.enterpriseForm.parentEnterpriseId = ''
      }
      this.addEnterpriseDialog = true
    },

    //新增 ||编辑 保存
    saveEnterpriseFn(formName) {
      if (!CheckSocialCreditCode(this.enterpriseForm.socialCode)) {
        this.$message.error('请输入正确的统一社会信用代码')
        return
      }
      if (!checkPhone(this.enterpriseForm.projectDirectorPhone)) {
        this.$message.error('请输入正确的手机号码')
        return
      }
      if (!checkPhone(this.enterpriseForm.registerPersonPhoneTel)) {
        this.$message.error('请输入正确的手机号码')
        return
      }
      if (!checkPhone(this.enterpriseForm.legalPersonTel)) {
        this.$message.error('请输入正确的手机号码')
        return
      }
      this.$refs[formName].validate((valid) => {
        if (valid) {
          this.enterpriseForm.projectSn = this.projectSn
          //转换上传图片
          if (this.aptitudeFileList.length > 0) {
            let arr = []
            for (let i = 0; i < this.aptitudeFileList.length; i++) {
              arr.push(
                this.aptitudeFileList[i].name +
                '*' +
                this.aptitudeFileList[i].url
              )
            }
            this.enterpriseForm.enterpriseQualificationUrl = arr.join(',')
          }
          if (this.logoFileList.length > 0) {
            let arr = []
            for (let i = 0; i < this.logoFileList.length; i++) {
              arr.push(
                this.logoFileList[i].name + '*' + this.logoFileList[i].url
              )
            }
            this.enterpriseForm.logo = arr.join(',')
          }
          this.enterpriseForm.type = this.pageType
          if (!this.enterpriseForm.parentEnterpriseId) {
            this.enterpriseForm.parentEnterpriseId = '0'
          }
          if (this.enterpriseDialogType == 1) {
            //新增提交
            setEnterpriseInfo(this.enterpriseForm).then((res) => {
              if (res.code == 200) {
                this.$message.success(this.$t('message.laborMange.addSuccess'))
                this.addEnterpriseDialog = false
                this.$refs[formName].resetFields()
                this.aptitudeFileList = []
                this.logoFileList = []
                this.getCooperatorList()
                this.getParentEnterpriseList()
              }
            })
          } else {
            console.log(this.enterpriseForm)
            if (
              this.enterpriseForm.id == this.enterpriseForm.parentEnterpriseId
            ) {
              this.$message.error(
                this.$t('message.projectInfo.theParentCompany') +
                this.$t('message.projectInfo.cannotChooseSelf')
              )
              return
            }
            //编辑 请求
            editEnterpriseInfo(this.enterpriseForm).then((res) => {
              if (res.code == 200) {
                this.$message.success(
                  this.$t('message.laborMange.modifySuccess')
                )
                this.$refs[formName].resetFields()
                this.addEnterpriseDialog = false
                this.aptitudeFileList = []
                this.logoFileList = []
                this.getCooperatorList()
                this.getParentEnterpriseList()
              }
            })
          }
        } else {
          return false
        }
      })
    },
    //删除按钮
    deleteBtn(value) {
      this.$confirm(
        this.$t('message.laborMange.deleteHint'),
        this.$t('message.laborMange.hint'),
        {
          confirmButtonText: this.$t('message.laborMange.confirm'),
          cancelButtonText: this.$t('message.laborMange.cancel'),
          type: 'warning',
        }
      )
        .then(() => {
          let data = {
            projectSn: this.projectSn,
            enterpriseId: value.id,
          }
          deleteEnterprise(data).then((res) => {
            if (res.code == 200) {
              this.$message({
                type: 'success',
                message: this.$t('message.laborMange.deleteSuccess'),
              })
              this.getCooperatorList()
            }
          })
        })
        .catch(() => {
          // this.$message({
          //   type: "info",
          //   message: "已取消删除",
          // });
        })
    },

    //批量删除
    deleteInBatches() {
      this.$confirm(
        this.$t('message.laborMange.deleteHint'),
        this.$t('message.laborMange.hint'),
        {
          confirmButtonText: this.$t('message.laborMange.confirm'),
          cancelButtonText: this.$t('message.laborMange.cancel'),
          type: 'warning',
        }
      )
        .then(() => {
          let data = {
            ids: this.checkedDeleteList.join(','),
          }
          deleteBatchApi(data).then((res) => {
            if (res.code == 200) {
              this.$message({
                type: 'success',
                message: this.$t('message.laborMange.deleteSuccess'),
              })
              this.checkedDeleteList = []
              this.getCooperatorList()
            }
          })
        })
        .catch(() => {
          // this.$message({
          //   type: "info",
          //   message: "已取消删除",
          // });
        })
    },

    // 批量移动
    moveInBatches() {
      this.moveEnterpriseDialog = true
    },
    // 批量移动确认
    moveEnterpriseFn() {
      // console.log(this.checkedDeleteList.join(","))
      if (!this.enterpriseType) {
        this.$message.error(
          this.$t('message.projectInfo.pleaseChoose') +
          this.$t('message.projectInfo.targetCompanyType')
        )
      } else {
        updateEnterpriseTypeApi({
          enterpriseTypeId: this.enterpriseType,
          ids: this.checkedDeleteList.join(','),
        }).then((res) => {
          // console.log(res)
          if (res.code == 200) {
            this.$message({
              type: 'success',
              message: res.message,
            })
            this.checkedDeleteList = []
            this.getCooperatorList()
            this.enterpriseType = ''
            this.moveEnterpriseDialog = false
          }
        })
      }
    },
    //批量选中的数据
    getDeleteList(value) { },
    //跳转详情页
    goDetailPage(id, projectEnterpriseId) {
      this.detailId = id
      this.projectEnterpriseId = projectEnterpriseId
      this.showDetail = true
      this.checkedDeleteList = []
    },
    //删除文件
    handleRemove(file, fileList, type) {
      if (type == 1) {
        this.aptitudeFileList = fileList
      } else {
        this.logoFileList = fileList
      }
    },
    //文件上传成功
    handleSuccess(file, type) {
      this.$message.success(this.$t('message.laborMange.uploadSuccessful'))
      let data = { name: file.data[0].filename, url: file.data[0].imageUrl }
      if (type == 1) {
        this.aptitudeFileList.push(data)
      } else {
        this.logoFileList.push(data)
      }
    },
    handleError(file) { },
    handlePreview(file) { },
    handleBeforeUpload(file) { },
    //切换每页数量
    handleSizeChange(val) {
      this.pageSize = val
      this.getCooperatorList()
    },
    //切换页数
    handleCurrentChange(val) {
      this.pageNo = val
      this.getCooperatorList()
    },
    // 排序
    handleChangeNum(val) {
      console.log(val, this.enterpriseForm)
      this.enterpriseForm.num = val
    },
  },
}
</script>
<style lang="less" scoped>
.flex {
  display: flex;
}
.flex2 {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.flex3 {
  display: flex;
  align-items: center;
}
.cooperator {
  width: 100%;
  height: 100%;
  .left {
    height: 100%;
    width: 16%;
    margin-right: 15px;
    font-size: 15px;
    // background-color: #fbfbfb;
    .title {
      height: 41px;
      line-height: 41px;
      box-sizing: border-box;
      padding: 0 22px;
      // color: #282e49;
      border-bottom: 2px #ebf0fc solid;
      font-weight: 600;
    }
    .el-menu-item2 {
      border-bottom: 2px #ebf0fc solid;
      height: 43px;
      line-height: 43px;
      padding: 0 30px !important;
    }
    .checked_item {
      border-left: 3px solid #5181f6;
      padding: 0 27px !important;
      background-color: #e1e8fa !important;
    }
  }
  .right {
    height: 100%;
    width: 84%;
    .title {
      font-size: 15px;
      height: 41px;
      line-height: 41px;
      // background-color: #ffffff;
      box-sizing: border-box;
      padding: 0 22px;
      // color: #282e49;
      border-bottom: 2px #ebf0fc solid;
      font-weight: 600;
      .right_value {
        // color: rgba(115, 121, 150, 100);

        font-size: 14px;

        span:first-child {
          opacity: 0.8;
          font-weight: 100;
        }
        .value {
          color: #5181f6;
        }
      }
    }
    .content {
      height: calc(100% - 41px);
      // background-color: #fff;
      box-sizing: border-box;
      padding: 15px 20px;
      .list_wrap {
        width: 100%;
        height: 85%;
        flex-wrap: wrap;
        .list {
          width: 30%;
          height: 150px;
          margin: 8px 18px;
          border: 1px solid rgba(225, 232, 250, 1);
          border-radius: 3px;
          box-sizing: border-box;
          padding: 10px 27px;
          line-height: 28px;
          opacity: 0.8;
          // color: rgba(39, 46, 71, 100);
          font-size: 14px;
          position: relative;
          cursor: pointer;
          .name {
            // color: rgba(39, 46, 71, 100);
            opacity: 1;
            font-size: 15px;
            font-weight: 600;
          }
          .btn_wrap {
            position: absolute;
            bottom: 5px;
            right: 15px;
            z-index: 100;
            // display: none;
          }
          .deleteList {
            position: absolute;
            top: 5px;
            right: 15px;
            z-index: 100;
          }
        }
        .list:hover {
          box-shadow: 0px 6px 12px 2px rgba(81, 129, 246, 0.18);
          border-color: #5181f6;
        }
      }
    }
  }
}
/deep/ .__view {
  min-height: calc(100% - 41px) !important;
}
/deep/ .el-checkbox__label {
  display: none;
}
.el-menu-vertical-demo {
  width: 100%;
}

.cooperatorDetail {
  width: 100%;
  height: 100%;
  background: #ffffff;
  box-sizing: border-box;
  .navigationTitle {
    //    border-bottom: 2px solid #ebf0fc;
    // margin-bottom: 15px;
  }
}

.nodata_wrap {
  width: 100%;
  text-align: center;
  height: 80%;
  padding-top: 20%;
  box-sizing: border-box;
  color: #c3d4fd;
  div {
    margin-top: 10px;
  }
}
.adddialog {
  position: relative;

  .dialog_content {
    height: 500px;
    overflow: auto;
  }
  ::-webkit-scrollbar {
    width: 2px;
  }
  .addpage {
    position: absolute;
    top: 80%;
    left: 60%;
  }
}
</style>