rmLayGaoujU9O46l603ccl_plm-vue/src/views/modules/project/projectInfo/projectInfo.vue

<template>
  <div class="mod-config">
    <el-form :inline="true" label-position="top" label-width="100px" style="margin-top: 0px;">
      <el-form-item :label="'项目编号'">
        <el-input v-model="searchData.projectId" style="width: 130px"></el-input>
      </el-form-item>
      <el-form-item >
        <span slot="label" style="" @click="getBaseList(1010,1)"><a herf="#">项目类型</a></span>
        <el-input v-model="searchData.projectType" style="width: 120px"></el-input>
      </el-form-item>
      <el-form-item :label="'项目责任人'">
        <el-input v-model="searchData.projectOwnerName" style="width: 130px"></el-input>
      </el-form-item>
      <el-form-item label=" ">
        <el-button @click="search()" type="primary" style="margin-left: 2px;margin-top:0px">查询</el-button>
        <el-button @click="addOrUpdateHandle('save')" type="primary" style="margin-left: 2px;margin-top: 0px">新增</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"
      :data="dataList1"
      border
      ref="mainTable"
      @row-click="changeData"
      highlight-current-row
      v-loading="dataListLoading"
      style="width: 100%;">
      <el-table-column
        header-align="center"
        align="center"
        width="150"
        fixed="right"
        label="操作">
        <template slot-scope="scope">
          <a type="text" size="small" @click="addOrUpdateHandle(scope.row.projectId)">新增</a>
          <a type="text" size="small" @click="UpdateHandle(scope.row)">修改</a>
          <a type="text" size="small" @click="deleteProjectInfo(scope.row)">删除</a>
        </template>
      </el-table-column>
      <el-table-column
        v-for="(item,index) in columnList1" :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>
    <el-pagination
      @size-change="sizeChangeHandle"
      @current-change="currentChangeHandle"
      :current-page="pageIndex"
      :page-sizes="[20, 50, 100, 1000]"
      :page-size="pageSize"
      :total="totalPage"
      layout="total, sizes, prev, pager, next, jumper">
    </el-pagination>
    <el-tabs style="font-size: 12px;min-height: 330px" class="customer-tab" v-model="activeName"  type="border-card"  @tab-click="tabClick">
      <el-tab-pane label="项目信息" name="info">
        <el-form label-position="top" style="margin-top: 0px; margin-left: 0px;">
          <el-row :gutter="20">
            <el-col :span="5"><div class="grid-content bg-purple">
              <el-form-item :label="'项目号'">
                <el-input v-model="projectData.projectId" readonly  ></el-input>
              </el-form-item>
            </div></el-col>
            <el-col :span="5"><div class="grid-content bg-purple">
              <el-form-item :label="'项目类型'">
                <el-input v-model="projectData.projectType" readonly  ></el-input>
              </el-form-item>
            </div></el-col>
            <el-col :span="5"><div class="grid-content bg-purple">
              <el-form-item :label="'项目来源'">
                <el-input v-model="projectData.projectSourceDesc" readonly  ></el-input>
              </el-form-item>
            </div></el-col>
            <el-col :span="5"><div class="grid-content bg-purple">
              <el-form-item :label="'优先级'">
                <el-input v-model="projectData.priorityDesc" readonly></el-input>
              </el-form-item>
            </div></el-col>
            <el-col :span="4"><div class="grid-content bg-purple">
              <el-form-item :label="'需求日期'">
                <el-input v-model="projectData.needDate" readonly  ></el-input>
              </el-form-item>
            </div></el-col>
          </el-row>

          <el-row :gutter="20">
            <el-col :span="5"><div class="grid-content bg-purple">
              <el-form-item :label="'BU'">
                <el-input v-model="projectData.buDesc" readonly style="" ></el-input>
              </el-form-item>
            </div></el-col>
            <el-col :span="5"><div class="grid-content bg-purple">
              <el-form-item :label="'项目名称'">
                <el-input v-model="projectData.projectName" readonly style="" ></el-input>
              </el-form-item>
            </div></el-col>
            <el-col :span="14"><div class="grid-content bg-purple">
              <el-form-item :label="'项目描述'">
                <el-input v-model="projectData.projectDesc" readonly style="" ></el-input>
              </el-form-item>
            </div></el-col>
          </el-row>

          <el-row :gutter="20">
            <el-col :span="8"><div class="grid-content bg-purple">
              <el-form-item :label="'项目经理'">
                <el-input v-model="projectData.projectManagerName" readonly style="" ></el-input>
              </el-form-item>
            </div></el-col>
            <el-col :span="8"><div class="grid-content bg-purple">
              <el-form-item :label="'项目责任人'">
                <el-input v-model="projectData.projectOwnerName" readonly style="" ></el-input>
              </el-form-item>
            </div></el-col>
            <el-col :span="8"><div class="grid-content bg-purple">
              <el-form-item :label="'项目权限'">
                <el-input v-model="projectData.userRoleName" readonly style="" ></el-input>
              </el-form-item>
            </div></el-col>
          </el-row>

          <el-row :gutter="20">
            <el-col :span="24"><div class="grid-content bg-purple">
              <el-form-item :label="'客户应用/要求'">
                <el-input v-model="projectData.customerRemark" readonly style="" ></el-input>
              </el-form-item>
            </div></el-col>
          </el-row>

          <el-row :gutter="20">
            <el-col :span="24"><div class="grid-content bg-purple">
              <el-form-item :label="'其他特殊要求'">
                <el-input v-model="projectData.remark" readonly style="" ></el-input>
              </el-form-item>
            </div></el-col>
          </el-row>
        </el-form>

      </el-tab-pane>
      <el-tab-pane label="客户信息" name="customer">
        <el-form  label-position="top" label-width="100px" >
          <el-row :gutter="20">
            <el-col :span="4"><div class="grid-content bg-purple">
              <el-form-item :label="'客户代码'">
                <el-input v-model="customerData.customerNo" readonly  ></el-input>
              </el-form-item>
            </div></el-col>
            <el-col :span="8"><div class="grid-content bg-purple">
              <el-form-item :label="'客户名称'">
                <el-input v-model="customerData.customerDesc" readonly  ></el-input>
              </el-form-item>
            </div></el-col>
            <el-col :span="4"><div class="grid-content bg-purple">
              <el-form-item :label="'客户币种'">
                <el-input v-model="customerData.customerCurrency" readonly ></el-input>
              </el-form-item>
            </div></el-col>
            <el-col :span="4"><div class="grid-content bg-purple">
              <el-form-item :label="'年营业额'">
                <el-input v-model="customerData.turnoverOfYear" readonly  ></el-input>
              </el-form-item>
            </div></el-col>
            <el-col :span="4"><div class="grid-content bg-purple">
              <el-form-item :label="'年度潜在收入'">
                <el-input v-model="customerData.potentialRevenueOfYear" readonly  ></el-input>
              </el-form-item>
            </div></el-col>
          </el-row>
          <el-row :gutter="20">
            <el-col :span="4"><div class="grid-content bg-purple">
              <el-form-item :label="'关键客户'">
                <el-input v-model="customerData.importantCustomer" readonly ></el-input>
              </el-form-item>
            </div></el-col>
            <el-col :span="4"><div class="grid-content bg-purple">
              <el-form-item :label="'客户状态'">
                <el-input v-model="customerData.customerStatus" readonly ></el-input>
              </el-form-item>
            </div></el-col>
            <el-col :span="16"><div class="grid-content bg-purple">
              <el-form-item :label="'备注信息'">
                <el-input v-model="customerData.remark" readonly ></el-input>
              </el-form-item>
            </div></el-col>
          </el-row>
        </el-form>
      </el-tab-pane>
      <el-tab-pane label="客户联系人" name="customer_contact">
        <el-form label-position="top" style="margin-top: 1px; margin-left: 0px;">
          <el-form :inline="true" label-position="top" style="margin-top: 0px">
            <el-button type="primary" @click="contactChooseModal()">编辑</el-button>
            <download-excel
              :fields="fields2()"
              :data="exportData2"
              type="xls"
              :name="exportName2"
              :header="exportHeader2"
              :footer="exportFooter2"
              :fetch="createExportData2"
              :before-generate="startDownload2"
              :before-finish="finishDownload2"
              worksheet="导出信息"
              class="el-button el-button--primary el-button--medium">
              {{ '导出' }}
            </download-excel>
          </el-form>
        </el-form>
        <el-table
          :data="contactList"
          height="240"
          border
          v-loading="dataListLoading"
          style="width: 100%; ">
          <el-table-column
            v-for="(item,index) in columnList2" :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>
      </el-tab-pane>
      <el-tab-pane label="文档管理" name="down">
        <!--文件上传-->
        <el-form label-position="top" style="margin-top: 1px; margin-left: 0px;">
          <el-form :inline="true" label-position="top" style="margin-top: 0px">
            <el-button type="primary" @click="addUploadFileModal()">上传文件</el-button>
          </el-form>
        </el-form>
        <el-table
          :data="fileContentList"
          height="240"
          border
          v-loading="dataListLoading"
          style="width: 100%; ">
          <el-table-column
            v-for="(item,index) in columnFileContentArray" :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">
              <!--              <a :href="'http://192.168.1.130:80/file/'+scope.row.url" :download="scope.row.fileName">下载</a>-->
              <a  @click="downloadFile(scope.row)" >下载</a>
              <a type="text" size="small"  @click="deleteFile(scope.row)">删除</a>
            </template>
          </el-table-column>
        </el-table>
      </el-tab-pane>
      <el-tab-pane label="项目物料" name="part">
        <projectPart ref="projectPart"  ></projectPart>
      </el-tab-pane>
      <el-tab-pane label="询价信息" name="quotation">
        <projectQuotation ref="projectQuotation"  ></projectQuotation>
      </el-tab-pane>
      <el-tab-pane label="报价信息" name="quotationHeader">
        <quotationHeader ref="quotationHeader"></quotationHeader>
      </el-tab-pane>
      <el-tab-pane label="打样信息" name="sample">
        <sample ref="sample"  ></sample>
      </el-tab-pane>
      <el-tab-pane label="测试记录" name="test">
        <test ref="test"  ></test>
      </el-tab-pane>
      <el-tab-pane label="刀模申请" name="purchase">
        <purchase ref="purchase"  ></purchase>
      </el-tab-pane>
      <el-tab-pane label="技术参数卡" name="technicalSpecification">
        <technicalSpecification ref="technicalSpecification"  ></technicalSpecification>
      </el-tab-pane>
    </el-tabs>
    <el-dialog
      width="530px"
      title="项目联系人"
      :close-on-click-modal="false"
      :visible.sync="contactChooseFlag">
      <el-transfer v-model="contactChooseList1"  :props="{
      key: 'contactName',
      label: 'contactName'
    }" :data="contactChooseList2" :titles="['未选择', '已选择']"></el-transfer>
      <span slot="footer" class="dialog-footer">
        <div style="margin-top: 5px">
                <el-button type="primary" @click="saveProjectContactList()">确定</el-button>
                <el-button @click="contactChooseFlag = false" type="primary">取消</el-button>
        </div>
    </span>
    </el-dialog>
    <!-- 上传文件的modal   -->
    <projectUploadFile  ref="projectUploadFile" @refreshPageTables="getFileContentData()" v-drag></projectUploadFile>
    <add-or-update v-if="addOrUpdateVisible" v-model="addOrUpdate" ref="addOrUpdate" @refreshDataList="search" v-drag></add-or-update>
    <Chooselist ref="baseList"  @getBaseData="getBaseData"></Chooselist>
  </div>
</template>

<script>
  import {
    customerInformationSearch, // 客户信息列表查询`
  } from '@/api/customer/customerInformation.js'
  import AddOrUpdate from './com_projectInfo-add-or-update'
  import {
    getTableDefaultListLanguage,
    getTableUserListLanguage,
  } from "@/api/table.js"
  import Chooselist from '@/views/modules/common/Chooselist'
  import {projectInfoSearch,
    deleteProjectFile,
    getFileContentList,
    downLoadProjectFile,
    getCustomerContactData,
    getContactChooseData,
    saveProjectContactList,
    deleteProjectInfo,
    getProjectUserRole,
  } from "@/api/project/project.js"
  import projectUploadFile from "./com_project_upload_file";/*上传文件的組件*/
  import projectPart from "./com_project_info_part";/*組件*/
  import projectQuotation from "./com_project_puotation";/*組件*/
  import sample from "./com_project_sample";/*組件*/
  import test from "./com_project_test";/*組件*/
  import purchase from "./com_project_info_purchase_request";/*組件*/
  import technicalSpecification from "./com_project_technicalSpecification";
  import quotationHeader from "./com_project_info_quotation.vue";
  /*組件*/
  export default {
    components: {
      Chooselist,
      AddOrUpdate,
      projectUploadFile,
      projectPart,
      projectQuotation,
      sample,
      test,
      purchase,
      technicalSpecification,
      quotationHeader,
    },
    name: "null",
    data() {
      return {
        // addOrUpdate
        addOrUpdate:'0',
        //项目已选联系人
        contactChooseList1:[],
        //客户可选联系人
        contactChooseList2:[],
        contactList: [],
        fileContentList: [],
        activeName: 'info',
        addOrUpdateVisible:false,
        searchData:{
          page: 1,
          limit: 100,
          site:this.$store.state.user.site,
          projectId:'',
          projectType:'',
          projectOwnerName:'',
          userName:this.$store.state.user.name,
        },
        contactChooseFlag:false,
        currentRow:'',
        height: 200,
        dataList1:[],
        dataListLoading: false,
        // 导出 start
        exportData: [],
        exportName: "项目清单" + this.dayjs().format('YYYYMMDDHHmmss'),
        exportHeader: ["项目清单"],
        exportFooter: [],
        exportList:[],
        // 导出 start
        exportData2: [],
        exportName2: "项目客户联系人" + this.dayjs().format('YYYYMMDDHHmmss'),
        exportHeader2: ["项目客户联系人"],
        exportFooter2: [],
        exportList2:[],
        tagNo:'',
        tagNo2:'',
        pageIndex: 1,
        pageSize: 100,
        totalPage: 0,
        // 导出 end
        columnList1: [
          {
            userId: this.$store.state.user.name,
            functionId: 101002001,
            serialNumber: '101002001Table1ProjectId',
            tableId: "101002001Table1",
            tableName: "项目信息主表",
            columnProp: "projectId",
            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: 101002001,
            serialNumber: '101002001Table1ProjectType',
            tableId: "101002001Table1",
            tableName: "项目信息主表",
            columnProp: "projectType",
            headerAlign: "center",
            align: "left",
            columnLabel: "项目类型",
            columnHidden: false,
            columnImage: false,
            columnSortable: false,
            sortLv: 0,
            status: true,
            fixed: '',
            columnWidth: 80
          },
          {
            userId: this.$store.state.user.name,
            functionId: 101002001,
            serialNumber: '101002001Table1ProjectName',
            tableId: "101002001Table1",
            tableName: "项目信息主表",
            columnProp: "projectName",
            headerAlign: "center",
            align: "left",
            columnLabel: "项目名称",
            columnHidden: false,
            columnImage: false,
            columnSortable: false,
            sortLv: 0,
            status: true,
            fixed: '',
            columnWidth: 80
          },
          {
            userId: this.$store.state.user.name,
            functionId: 101002001,
            serialNumber: '101002001Table1Status',
            tableId: "101002001Table1",
            tableName: "项目信息主表",
            columnProp: "status",
            headerAlign: "center",
            align: "left",
            columnLabel: "项目状态",
            columnHidden: false,
            columnImage: false,
            columnSortable: false,
            sortLv: 0,
            status: true,
            fixed: '',
            columnWidth: 80
          },
          {
            userId: this.$store.state.user.name,
            functionId: 101002001,
            serialNumber: '101002001Table1Priority',
            tableId: "101002001Table1",
            tableName: "项目信息主表",
            columnProp: "priority",
            headerAlign: "center",
            align: "left",
            columnLabel: "优先级",
            columnHidden: false,
            columnImage: false,
            columnSortable: false,
            sortLv: 0,
            status: true,
            fixed: '',
            columnWidth: 40
          },
          {
            userId: this.$store.state.user.name,
            functionId: 101002001,
            serialNumber: '101002001Table1BuNo',
            tableId: "101002001Table1",
            tableName: "项目信息主表",
            columnProp: "buNo",
            headerAlign: "center",
            align: "left",
            columnLabel: "BU编码",
            columnHidden: false,
            columnImage: false,
            columnSortable: false,
            sortLv: 0,
            status: true,
            fixed: '',
            columnWidth: 40
          },
          {
            userId: this.$store.state.user.name,
            functionId: 101002001,
            serialNumber: '101002001Table1BuDesc',
            tableId: "101002001Table1",
            tableName: "项目信息主表",
            columnProp: "buDesc",
            headerAlign: "center",
            align: "left",
            columnLabel: "BU名称",
            columnHidden: false,
            columnImage: false,
            columnSortable: false,
            sortLv: 0,
            status: true,
            fixed: '',
            columnWidth: 40
          },
          {
            userId: this.$store.state.user.name,
            functionId: 101002001,
            serialNumber: '101002001Table1ProjectOwnerName',
            tableId: "101002001Table1",
            tableName: "项目信息主表",
            columnProp: "projectOwnerName",
            headerAlign: "center",
            align: "left",
            columnLabel: "项目负责人",
            columnHidden: false,
            columnImage: false,
            columnSortable: false,
            sortLv: 0,
            status: true,
            fixed: '',
            columnWidth: 80
          },
          {
            userId: this.$store.state.user.name,
            functionId: 101002001,
            serialNumber: '101002001Table1ProjectSource',
            tableId: "101002001Table1",
            tableName: "项目信息主表",
            columnProp: "projectSource",
            headerAlign: "center",
            align: "left",
            columnLabel: "项目来源",
            columnHidden: false,
            columnImage: false,
            columnSortable: false,
            sortLv: 0,
            status: true,
            fixed: '',
            columnWidth: 80
          },
          {
            userId: this.$store.state.user.name,
            functionId: 101002001,
            serialNumber: '101002001Table1CustomerId',
            tableId: "101002001Table1",
            tableName: "项目信息主表",
            columnProp: "customerId",
            headerAlign: "center",
            align: "left",
            columnLabel: "客户代码",
            columnHidden: false,
            columnImage: false,
            columnSortable: false,
            sortLv: 0,
            status: true,
            fixed: '',
            columnWidth: 80
          },
          {
            userId: this.$store.state.user.name,
            functionId: 101002001,
            serialNumber: '101002001Table1CustomerName',
            tableId: "101002001Table1",
            tableName: "项目信息主表",
            columnProp: "customerName",
            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: 101002001,
            serialNumber: '101002001Table1CreateDate',
            tableId: "101002001Table1",
            tableName: "项目信息主表",
            columnProp: "createDate",
            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: 101002001,
            serialNumber: '101002001Table1CreateBy',
            tableId: "101002001Table1",
            tableName: "项目信息主表",
            columnProp: "createBy",
            headerAlign: "center",
            align: "left",
            columnLabel: "创建人",
            columnHidden: false,
            columnImage: false,
            columnSortable: false,
            sortLv: 0,
            status: true,
            fixed: '',
            columnWidth: 80
          },
          {
            userId: this.$store.state.user.name,
            functionId: 101002001,
            serialNumber: '101002001Table1UpdateDate',
            tableId: "101002001Table1",
            tableName: "项目信息主表",
            columnProp: "updateDate",
            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: 101002001,
            serialNumber: '101002001Table1UpdateBy',
            tableId: "101002001Table1",
            tableName: "项目信息主表",
            columnProp: "updateBy",
            headerAlign: "center",
            align: "left",
            columnLabel: "修改人",
            columnHidden: false,
            columnImage: false,
            columnSortable: false,
            sortLv: 0,
            status: true,
            fixed: '',
            columnWidth: 80
          },
        ],
        columnList2: [
          {
            userId: this.$store.state.user.name,
            functionId: 101002001,
            serialNumber: '101002001Table2ContactName',
            tableId: '101002001Table2',
            tableName: '项目联系人表',
            columnProp: 'contactName',
            headerAlign: 'center',
            align: 'center',
            columnLabel: '联系人',
            columnHidden: false,
            columnImage: false,
            columnSortable: false,
            sortLv: 0,
            status: true,
            fixed: '',
            columnWidth: 80
          },
          {
            userId: this.$store.state.user.name,
            functionId: 101002001,
            serialNumber: '101002001Table2ContactPhoneNumber1',
            tableId: '101002001Table2',
            tableName: '项目联系人表',
            columnProp: 'contactPhoneNumber1',
            headerAlign: 'center',
            align: 'center',
            columnLabel: '联系电话',
            columnHidden: false,
            columnImage: false,
            columnSortable: false,
            sortLv: 0,
            status: true,
            fixed: '',
            columnWidth: 80
          },
          {
            userId: this.$store.state.user.name,
            functionId: 101002001,
            serialNumber: '101002001Table2ContactLandlineNumber',
            tableId: '101002001Table2',
            tableName: '项目联系人表',
            columnProp: 'contactLandlineNumber',
            headerAlign: 'center',
            align: 'center',
            columnLabel: '座机',
            columnHidden: false,
            columnImage: false,
            columnSortable: false,
            sortLv: 0,
            status: true,
            fixed: '',
            columnWidth: 80
          },
          {
            userId: this.$store.state.user.name,
            functionId: 101002001,
            serialNumber: '101002001Table2Position',
            tableId: '101002001Table2',
            tableName: '项目联系人表',
            columnProp: 'position',
            headerAlign: 'center',
            align: 'center',
            columnLabel: '公司职务',
            columnHidden: false,
            columnImage: false,
            columnSortable: false,
            sortLv: 0,
            status: true,
            fixed: '',
            columnWidth: 80
          },
          {
            userId: this.$store.state.user.name,
            functionId: 101002001,
            serialNumber: '101002001Table2Mailbox',
            tableId: '101002001Table2',
            tableName: '项目联系人表',
            columnProp: 'mailbox',
            headerAlign: 'center',
            align: 'center',
            columnLabel: '邮箱',
            columnHidden: false,
            columnImage: false,
            columnSortable: false,
            sortLv: 0,
            status: true,
            fixed: '',
            columnWidth: 80
          },
          {
            userId: this.$store.state.user.name,
            functionId: 101002001,
            serialNumber: '101002001Table2PrimaryContact',
            tableId: '101002001Table2',
            tableName: '项目联系人表',
            columnProp: 'primaryContact',
            headerAlign: 'center',
            align: 'center',
            columnLabel: '主联系人',
            columnHidden: false,
            columnImage: false,
            columnSortable: false,
            sortLv: 0,
            status: true,
            fixed: '',
            columnWidth: 40
          },
          {
            userId: this.$store.state.user.name,
            functionId: 101002001,
            serialNumber: '101002001Table2ContactStatus',
            tableId: '101002001Table2',
            tableName: '项目联系人表',
            columnProp: 'contactStatus',
            headerAlign: 'center',
            align: 'center',
            columnLabel: '状态',
            columnHidden: false,
            columnImage: false,
            columnSortable: false,
            sortLv: 0,
            status: true,
            fixed: '',
            columnWidth: 40
          },
          {
            userId: this.$store.state.user.name,
            functionId: 101002001,
            serialNumber: '101002001Table2CreateDate',
            tableId: '101002001Table2',
            tableName: '项目联系人表',
            columnProp: 'createDate',
            headerAlign: 'center',
            align: 'center',
            columnLabel: '创建时间',
            columnHidden: false,
            columnImage: false,
            columnSortable: false,
            sortLv: 0,
            status: true,
            fixed: '',
            columnWidth: 120
          },
          {
            userId: this.$store.state.user.name,
            functionId: 101002001,
            serialNumber: '101002001Table2CreateBy',
            tableId: '101002001Table2',
            tableName: '项目联系人表',
            columnProp: 'createBy',
            headerAlign: 'center',
            align: 'center',
            columnLabel: '创建人',
            columnHidden: false,
            columnImage: false,
            columnSortable: false,
            sortLv: 0,
            status: true,
            fixed: '',
            columnWidth: 80
          },
          {
            userId: this.$store.state.user.name,
            functionId: 101002001,
            serialNumber: '101002001Table2UpdateDate',
            tableId: '101002001Table2',
            tableName: '项目联系人表',
            columnProp: 'updateDate',
            headerAlign: 'center',
            align: 'center',
            columnLabel: '更新时间',
            columnHidden: false,
            columnImage: false,
            columnSortable: false,
            sortLv: 0,
            status: true,
            fixed: '',
            columnWidth: 120
          },
          {
            userId: this.$store.state.user.name,
            functionId: 101002001,
            serialNumber: '101002001Table2UpdateBy',
            tableId: '101002001Table2',
            tableName: '项目联系人表',
            columnProp: 'updateBy',
            headerAlign: 'center',
            align: 'center',
            columnLabel: '更新人',
            columnHidden: false,
            columnImage: false,
            columnSortable: false,
            sortLv: 0,
            status: true,
            fixed: '',
            columnWidth: 80
          }
        ],
        projectData: {
          id: 0,
          site:this.$store.state.user.site,
          projectLevel:'',
          projectId:'',
          projectTypeDb:'',
          projectType:'',
          customerName:'',
          customerId:'',
          projectName:'',
          projectDesc:'',
          needDate:'',
          priority:'',
          projectSource:'',
          priorityDesc:'',
          projectSourceDesc:'',
          projectManagerName:'',
          projectOwnerName:'',
          customerRemark:'',
          remark:'',
          userRoleName:'',
          buDesc:'',
          buNo:'',
        },
        customerData:{
          site: '',
          customerNo: '',
          customerDesc: '',
          customerDescription: '',
          customerIndustry: '',
          customerCurrency: '',
          turnoverOfYear: '',
          potentialRevenueOfYear: '',
          importantCustomer: '',
          customerStatus: '',
          companyName: '',
          jobDescription: '',
          remark: '',
          contactName: '',
          contactPhoneNumber1: '',
          primaryContact: '',
          contactStatus: '',
          addressName: ''
        },
        columnFileContentArray: [
          {
            columnProp: 'fileName',
            headeralign: 'left',
            align: 'left',
            columnLabel: '文件名称',
            columnHidden: false,
            columnImage: false,
            columnSortable: false,
            sortLv: 0,
            status: true,
            fixed: false
          // }, {
          //   columnProp: 'createdBy',
          //   headeralign: 'left',
          //   align: 'left',
          //   columnLabel: '上传人',
          //   columnHidden: false,
          //   columnImage: false,
          //   columnSortable: true,
          //   sortLv: 0,
          //   status: true,
          //   fixed: false
          }, {
            columnProp: 'createDate',
            headeralign: 'left',
            align: 'left',
            columnLabel: '上传时间',
            columnHidden: false,
            columnImage: false,
            columnSortable: true,
            sortLv: 0,
            status: true,
            fixed: false
          }, {
            columnProp: 'orderRef3',
            headeralign: 'left',
            align: 'left',
            columnLabel: '类型',
            columnHidden: false,
            columnImage: false,
            columnSortable: true,
            sortLv: 0,
            status: true,
            fixed: false
          },
        ],

      }
    },
    watch: {
      // columnList1: {
      //   deep: true,
      //   handler: function (newV, oldV) {
      //     debugger
      //
      //   }
      // }
    },
    mounted() {
      this.$nextTick(() => {
        this.height = window.innerHeight - 520;
      })
    },
    methods: {
      // 获取基础数据列表S
      getBaseList (val, type) {
        this.tagNo = val
        this.tagNo2 = type
        this.$nextTick(() => {
          let strVal = ''
          if (val === 1010) {
            if(type==1) {
              strVal = this.searchData.projectType
            }
          }
          this.$refs.baseList.init(val, strVal)
        })
      },
      /* 列表方法的回调 */
      getBaseData (val) {
        if (this.tagNo === 1010) {
          if(this.tagNo2==1) {
            this.searchData.projectType = val.Base_desc
          }
        }
      },
      // 新增 / 修改
      addOrUpdateHandle (id) {
        this.addOrUpdateVisible = true
        this.addOrUpdate = id;
        this.$nextTick(() => {
          this.$refs.addOrUpdate.init();
          if (id && id !== 'save' && id !== 'update'){
            this.$refs.addOrUpdate.updateDataForm(id);
          }
        })
      },
      UpdateHandle (row) {
        let inData={
          site:row.site,
          username:this.$store.state.user.name,
          projectId:row.projectId
        }
        getProjectUserRole(inData).then(({data}) => {
          if(this.$store.state.user.name=='admin'||data.row.updateFlag=='Y') {
            this.addOrUpdateVisible = true
            this.addOrUpdate = 'update';
            this.$nextTick(() => {
              this.$refs.addOrUpdate.init(row.id)
            })
          }else {
            this.$alert('没有权限修改这个项目信息！', '错误', {
              confirmButtonText: '确定'
            })
          }
        })
      },
      //导出excel
      async createExportData() {
        this.searchData.limit = -1
        this.searchData.page = 1
        await projectInfoSearch(this.searchData).then(({data}) => {
          this.exportList= data.page.list;
        })

        return this.exportList;
      },
      startDownload() {
        //  this.exportData = this.dataList

      },
      finishDownload() {

      },
      fields() {
        let json = "{"
        this.columnList1.forEach((item, index) => {
          if (index == this.columnList1.length - 1) {
            json += "\"" + item.columnLabel + "\"" + ":" + "\"" + item.columnProp + "\""
          } else {
            json += "\"" + item.columnLabel + "\"" + ":" + "\"" + item.columnProp + "\"" + ","
          }
        })
        json += "}"
        let s = eval("(" + json + ")")

        return s
      },
      //导出excel
      async createExportData2() {

        return this.contactList;
      },
      startDownload2() {
        //  this.exportData = this.dataList

      },
      finishDownload2() {

      },
      fields2() {
        let json = "{"
        this.columnList2.forEach((item, index) => {
          if (index == this.columnList2.length - 1) {
            json += "\"" + item.columnLabel + "\"" + ":" + "\"" + item.columnProp + "\""
          } else {
            json += "\"" + item.columnLabel + "\"" + ":" + "\"" + item.columnProp + "\"" + ","
          }
        })
        json += "}"
        let s = eval("(" + json + ")")

        return s
      },
      // 导出 end
      // 获取数据列表
      search () {
        this.searchData.limit = this.pageSize
        this.searchData.page = this.pageIndex
        projectInfoSearch(this.searchData).then(({data}) => {
          if (data.code == 0) {
            this.dataList1 = data.page.list
            this.pageIndex = data.page.currPage
            this.pageSize = data.page.pageSize
            this.totalPage = data.page.totalCount
            if(this.dataList1.length>0){
              this.$refs.mainTable.setCurrentRow(this.dataList1[0]);
              this.changeData(this.dataList1[0])
            }
          }
          this.dataListLoading = false
        })
      },
      //单击切换订单
      changeData(row) {
        this.currentRow = JSON.parse(JSON.stringify(row));
        this.projectData=row;
        let inData= {
          site:row.site,
          customerNo:row.customerId,
          page: 1,
          limit: 10,
        }
        this.refreshCurrentTabTable ();
        customerInformationSearch(inData).then(({data}) => {
          if (data.code == 0) {
            if(data.page.list.length>0){
              this.customerData=data.page.list[0]
            }
            }
          })
        },
      addUploadFileModal(){
        let currentData = {
          site: this.currentRow.site,
          createBy: this.$store.state.user.name,
          projectId: this.currentRow.projectId,
          projectName: this.currentRow.projectName,
          remark: '',
        };
        //打开组件 去做新增业务
        this.$nextTick(() => {
          this.$refs.projectUploadFile.init(currentData);
        })
      },
      deleteFile(row){
        this.$confirm('确定要删除此文件?', '提示', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'warning'
        }).then(() => {
          deleteProjectFile(row).then(({data}) => {
            if (data && data.code == 0) {
              this.getFileContentData();
              this.$message({
                message: '操作成功',
                type: 'success',
                duration: 1500,
                onClose: () => {
                }
              })
            } else {
              this.$alert(data.msg, '错误', {
                confirmButtonText: '确定'
              })
            }
          })
        }).catch(() => {
        })
      },
      // 刷新页签的table数据
      refreshCurrentTabTable () {
        if (this.activeName == 'down') {
          this.getFileContentData();
        }
        if (this.activeName == 'customer_contact') {
          this.getCustomerContactData();
        }
        if (this.activeName == 'part') {
          this.refreshPartTable();
        }
        if (this.activeName == 'quotation') {
          this.refreshQuotationTable();
        }
        if (this.activeName == 'quotationHeader') {
          this.refreshQuotationHeaderTable();
        }
        if (this.activeName == 'sample') {
          this.refreshSampleTable();
        }
        if (this.activeName == 'test') {
          this.refreshTestTable();
        }
        if (this.activeName == 'purchase') {
          this.refreshPurchaseTable();
        }
        if (this.activeName == 'technicalSpecification') {
          this.refreshTechnicalSpecificationTable();
        }
      },
      refreshPartTable(){
        let inData={
          site: this.currentRow.site,
          projectId: this.currentRow.projectId,
          username:this.$store.state.user.name
        }
        this.$refs.projectPart.init(inData)
      },
      refreshTechnicalSpecificationTable(){
        let inData={
          site: this.currentRow.site,
          projectId: this.currentRow.projectId,
          page: 1,
          limit: 1000
        }
        this.$refs.technicalSpecification.init(inData)
      },
      refreshQuotationHeaderTable(){
        let inData={
          site: this.currentRow.site,
          projectId: this.currentRow.projectId,
          username:this.$store.state.user.name,
          no: 1,
          size: 1000
        }
        this.$refs.quotationHeader.init(inData)
      },
      refreshQuotationTable(){
        let inData={
          site: this.currentRow.site,
          projectId: this.currentRow.projectId,
          username:this.$store.state.user.name,
          page: 1,
          limit: 1000
        }
        this.$refs.projectQuotation.init(inData)
      },
      refreshSampleTable(){
        let inData={
          site: this.currentRow.site,
          projectId: this.currentRow.projectId,
          username:this.$store.state.user.name,
          page: 1,
          limit: 1000
        }
        this.$refs.sample.init(inData)
      },
      refreshTestTable(){
        let inData={
          site: this.currentRow.site,
          projectId: this.currentRow.projectId,
          username:this.$store.state.user.name,
          page: 1,
          limit: 1000
        }
        this.$refs.test.init(inData)
      },
      refreshPurchaseTable(){
        let inData={
          site: this.currentRow.site,
          projectId: this.currentRow.projectId,
          username:this.$store.state.user.name,
        }
        this.$refs.purchase.init(inData)
      },
      //刷新派设备文档的列表
      getFileContentData() {
        let currentData = {orderRef2: this.currentRow.projectId};
        getFileContentList(currentData).then(({data}) => {
          //区分请求成功和失败的状况
          if (data && data.code == 200) {
            this.fileContentList = data.rows;
          } else {
            this.fileContentList = [];
          }
        });
      },
      // 下载
      downloadFile(row){
        // axios.get('/proxyApi/pms/eamProject/downLoadProjectFile/' + row.id, {
        //   responseType: 'blob',
        //   headers: {
        //     'Content-Type': 'application/json',
        //     'token': Vue.cookie.get('token')
        //   }
        // })
        let inData={
          site:this.currentRow.site,
          username:this.$store.state.user.name,
          projectId:this.currentRow.projectId
        }
        getProjectUserRole(inData).then(({data}) => {
          if(this.$store.state.user.name=='admin'||data.row.downFlag=='Y') {
            downLoadProjectFile(row)
              .then(({data}) => {
                // 不限制文件下载类型
                const blob = new Blob([data], {type:'application/octet-stream;charset=utf-8'})
                // 下载文件名称
                const fileName = row.fileName
                // a标签下载
                const linkNode = document.createElement('a')
                linkNode.download = fileName // a标签的download属性规定下载文件的名称
                linkNode.style.display = 'none'
                linkNode.href = URL.createObjectURL(blob) // 生成一个Blob URL
                console.log(linkNode)
                // if(val == 'Y'){
                //   this.pdfVisible = true
                //   this.pdfUrl = linkNode.href
                // }else {
                document.body.appendChild(linkNode)
                linkNode.click() // 模拟在按钮上的一次鼠标单击
                URL.revokeObjectURL(linkNode.href) // 释放URL 对象
                document.body.removeChild(linkNode)
                // }
              })
          }else {
            this.$alert('没有权限下载这个项目的文件！', '错误', {
              confirmButtonText: '确定'
            })
          }
        })
      },
      // 每页数
      sizeChangeHandle (val) {
        this.pageSize = val
        this.pageIndex = 1
        this.search()
      },
      // 当前页
      currentChangeHandle (val) {
        this.pageIndex = val
        this.search()
      },
     // 动态列开始 获取 用户保存的 格式列
      async getTableUserColumn(tableId, columnId) {
        let queryTableUser = {
          userId: this.$store.state.user.name,
          functionId: this.$route.meta.menuId,
          tableId: tableId,
          status: true,
          languageCode: this.$i18n.locale
        }

        await getTableUserListLanguage(queryTableUser).then(({data}) => {
          if (data.rows.length > 0) {
            //this.columnList = []
            switch (columnId) {
              case 1:
                this.columnList1 = data.rows
                this.checkField();
                break;
              // case 2:
              //   this.columnList1 = data.rows
              //   break;
              // case 3:
              //   this.columnList2 = data.rows
              //   break;
              // case 4:
              //   this.columnList3 = data.rows
              //   break;
            }

          } else {
            this.getColumnList(tableId, columnId)
          }
        })

      },

      // 获取 tableDefault 列
      async getColumnList(tableId, columnId) {
        let   queryTable= {
          functionId: this.$route.meta.menuId,
          tableId: tableId,
          languageCode: this.$i18n.locale
        }
        await getTableDefaultListLanguage(queryTable).then(({data}) => {
          if (!data.rows.length == 0) {
            switch (columnId) {
              case 1:
                this.columnList1 = data.rows
                this.checkField();
                break;
              // case 2:
              //   this.columnList1 = data.rows
              //   break;
              // case 3:
              //   this.columnList2 = data.rows
              //   break;
              // case 4:
              //   this.columnList3 = data.rows
              //   break;
            }
          } else {
            // this.showDefault = true.
          }
        })

      },
      //动态列结束
      // 列表表格选择替换
      tabClick (tab, event) {
        // 刷新列表数据
        this.refreshCurrentTabTable()
      },
      getCustomerContactData(){
        let inData={
          site:this.currentRow.site,
          customerId:this.currentRow.customerId,
          projectId:this.currentRow.projectId,
        }
        getCustomerContactData(inData).then(({data}) => {
          //区分请求成功和失败的状况
          if (data && data.code == 0) {
            this.contactList = data.rows;
          } else {
            this.contactList = [];
          }
        });
      },
      contactChooseModal(){
        if(this.currentRow==null||this.currentRow==''){
          this.$alert('请选择项目！', '错误', {
            confirmButtonText: '确定'
          })
          return false;
        }
        let inData={
          site:this.currentRow.site,
          customerId:this.currentRow.customerId,
          projectId:this.currentRow.projectId,
        }
        getContactChooseData(inData).then(({data}) => {
          //区分请求成功和失败的状况
          if (data && data.code == 0) {
            this.contactChooseList1 = data.rows1;
            this.contactChooseList2 = data.rows2;

          } else {
            this.contactChooseList1 = [];
            this.contactChooseList2 = [];
          }
        });
        this.contactChooseFlag=true;
      },
      saveProjectContactList(){
        let data={
          site:this.currentRow.site,
          customerId:this.currentRow.customerId,
          projectId:this.currentRow.projectId,
          contactList:this.contactChooseList1
        }
        saveProjectContactList(data).then(({data}) => {
          if (data && data.code === 0) {
            this.$message.success( '操作成功')
            this.contactChooseFlag = false
            this.refreshCurrentTabTable()
          } else {
            this.$message.error(data.msg)
          }
        })

      },

      deleteProjectInfo(row){
        let inData={
          site:row.site,
          username:this.$store.state.user.name,
          projectId:row.projectId
        }
        getProjectUserRole(inData).then(({data}) => {
          if(this.$store.state.user.name=='admin'||data.row.deleteFlag=='Y') {
            this.$confirm(`确定删除当前记录?`, '提示', {
              confirmButtonText: '确定',
              cancelButtonText: '取消',
              type: 'warning'
            }).then(() => {
              deleteProjectInfo(row).then(({data}) => {
                if (data && data.code === 0) {
                  this.$message.success( '操作成功')
                  this.contactChooseFlag = false
                  this.search()
                } else {
                  this.$message.error(data.msg)
                }
              })
            }).catch(() => {})
          }else {
            this.$alert('没有权限删除这个项目信息！', '错误', {
              confirmButtonText: '确定'
            })
          }
        })

      },

      checkField(){

        if(!this.accessField('10202001')){
          this.columnList1=this.columnList1.filter(item => item.columnProp !== 'customerId');
          this.columnList1=this.columnList1.filter(item => item.columnProp !== 'customerName');
        }
        if(!this.accessField('10202002')){
          this.columnList1=this.columnList1.filter(item => item.columnProp !== 'projectSource');
        }

      },
    },
    activated() {
      if (this.$route.params.projectId){
        this.searchData.projectId = this.$route.params.projectId
      }
      this.getTableUserColumn(this.$route.meta.menuId+'table1',1)
    },
  }
</script>

<style >
  .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;
  }
</style>