<!--电子设计-->
<template>
  <el-main class="bg_white wrap_box lc_rw">
    <!-- 按钮组 -->
    <div>
      <div class="l-button" @click="handlesave">保存</div>
      <div class="l-button" @click="openKeyshow" v-if="myuserId == leaderUserId">配置表格</div>
      <div class="l-button" @click="noticeOrder" v-if="myuserId == leaderUserId">通知下单</div>
    </div>
    <!--列表-->
    <div style="margin-top: 20px;">
      <vxe-table border resizable show-overflow :edit-config="{ trigger: 'click', mode: 'cell' }" max-height="700"
        :data="data.tableData" width="100%">
        <vxe-column type="seq" title="序号" width="60" align="left" class="ggdycss"></vxe-column>
        <template v-for="(item, index) in data.keylist" :key='item.key'>
          <vxe-column title="品牌" v-if="item.value && item.key == 'brand'" width="140" align="left">
            <template #default="{ row }">
              <span>{{ row.sku.brand }}</span>
            </template>
          </vxe-column>

          <vxe-column title="产品名称" v-if="item.value && item.key == 'name'" width="140" align="left">
            <template #default="{ row }">
              <span>{{ row.sku.name }}</span>
            </template>
          </vxe-column>

          <vxe-column title="产品图片" v-if="item.value && item.key == 'image'" width="130" align="left">
            <template #default="{ row }">
              <img :src="row.sku.image" class="avatar" v-if="row.sku.image" />
            </template>
          </vxe-column>

          <vxe-column title="产品SPU" v-if="item.value && item.key == 'spu'" width="250" align="left">
            <template #default="{ row }">
              <span>{{ row.sku.spu }}</span>
            </template>
          </vxe-column>

          <vxe-column title="产品SKU" v-if="item.value && item.key == 'sku'" width="250" align="left">
            <template #default="{ row }">
              <span>{{ row.sku.sku }}</span>
            </template>
          </vxe-column>

          <vxe-column title="出厂价（TCO成本）" v-if="item.value && item.key == 'mould_cost'" width="130" align="left">
            <template #default="{ row }">
              <span>{{ row.sku.mould_cost }}</span>
            </template>
          </vxe-column>

          <vxe-column title="规格参数" v-if="item.value && item.key == 'params'" width="130" align="left">
            <template #default="{ row }">
              <span>{{ row.sku.params }}</span>
            </template>
          </vxe-column>

          <vxe-column title="产品材质" v-if="item.value && item.key == 'material'" width="120" align="left">
            <template #default="{ row }">
              <span>{{ row.sku.material }}</span>
            </template>
          </vxe-column>

          <vxe-column title="协议" v-if="item.value && item.key == 'protocol'" width="120" align="left">
            <template #default="{ row }">
              <span>{{ row.sku.protocol }}</span>
            </template>
          </vxe-column>

          <vxe-column title="速率" v-if="item.value && item.key == 'rate'" width="120" align="left">
            <template #default="{ row }">
              <span>{{ row.sku.rate }}</span>
            </template>
          </vxe-column>

          <vxe-column title="包装" v-if="item.value && item.key == 'package'" width="120" align="left">
            <template #default="{ row }">
              <span>{{ row.sku.package }}</span>
            </template>
          </vxe-column>

          <vxe-column title="安规" v-if="item.value && item.key == 'safe'" width="120" align="left">
            <template #default="{ row }">
              <span>{{ row.sku.safe }}</span>
            </template>
          </vxe-column>

          <vxe-column title="接口(输入)" v-if="item.value && item.key == 'interface'" width="120" align="left">
            <template #default="{ row }">
              <span>{{ row.sku.interface }}</span>
            </template>
          </vxe-column>

          <vxe-column title="尺码/数量/长度" v-if="item.value && item.key == 'other'" width="120" align="left">
            <template #default="{ row }">
              <span>{{ row.sku.other }}</span>
            </template>
          </vxe-column>

          <vxe-column title="产品颜色" v-if="item.value && item.key == 'color'" width="120" align="left">
            <template #default="{ row }">
              <span>{{ row.sku.color }}</span>
            </template>
          </vxe-column>

          <vxe-column title="功能/版本" v-if="item.value && item.key == 'version'" width="120" align="left">
            <template #default="{ row }">
              <span>{{ row.sku.version }}</span>
            </template>
          </vxe-column>

          <vxe-column title="输出接口" v-if="item.value && item.key == 'output'" width="120" align="left">
            <template #default="{ row }">
              <span>{{ row.sku.output }}</span>
            </template>
          </vxe-column>

          <vxe-column title="69码" v-if="item.value && item.key == 'code69'" width="120" align="left">
            <template #default="{ row }">
              <span>{{ row.sku.code69 }}</span>
            </template>
          </vxe-column>

          <vxe-column title="备料数量" v-if="item.value && item.key == 'material_num'" width="120" align="left">
            <template #default="{ row }">
              <span>{{ row.sku.material_num }}</span>
            </template>
          </vxe-column>

          <vxe-column title="模具费(塑胶)" v-if="item.value && item.key == 'mould_fare_sj'" width="120" align="left">
            <template #default="{ row }">
              <span>{{ row.sku.mould_fare_sj }}</span>
            </template>
          </vxe-column>

          <vxe-column title="模具费(五金)" v-if="item.value && item.key == 'mould_fare_wj'" width="120" align="left">
            <template #default="{ row }">
              <span>{{ row.sku.mould_fare_wj }}</span>
            </template>
          </vxe-column>

          <vxe-column title="电子" v-if="item.value && item.key == 'electron_fare'" width="120" align="left">
            <template #default="{ row }">
              <span>{{ row.sku.electron_fare }}</span>
            </template>
          </vxe-column>

          <vxe-column title="结构/本体" v-if="item.value && item.key == 'structure_fare'" width="120" align="left">
            <template #default="{ row }">
              <span>{{ row.sku.structure_fare }}</span>
            </template>
          </vxe-column>

          <vxe-column title="电源" v-if="item.value && item.key == 'power_fare'" width="120" align="left">
            <template #default="{ row }">
              <span>{{ row.sku.power_fare }}</span>
            </template>
          </vxe-column>

          <vxe-column title="线材" v-if="item.value && item.key == 'line_fare'" width="120" align="left">
            <template #default="{ row }">
              <span>{{ row.sku.line_fare }}</span>
            </template>
          </vxe-column>

          <vxe-column title="包材" v-if="item.value && item.key == 'package_fare'" width="120" align="left">
            <template #default="{ row }">
              <span>{{ row.sku.package_fare }}</span>
            </template>
          </vxe-column>

          <vxe-column title="辅料/配件" v-if="item.value && item.key == 'parts_fare'" width="120" align="left">
            <template #default="{ row }">
              <span>{{ row.sku.parts_fare }}</span>
            </template>
          </vxe-column>

          <vxe-column title="硬盘/运费/其他" v-if="item.value && item.key == 'other_fare'" width="120" align="left">
            <template #default="{ row }">
              <span>{{ row.sku.other_fare }}</span>
            </template>
          </vxe-column>

          <vxe-column title="加工费用" v-if="item.value && item.key == 'process_fare'" width="120" align="left">
            <template #default="{ row }">
              <span>{{ row.sku.process_fare }}</span>
            </template>
          </vxe-column>

          <vxe-column title="认证/测试费用" v-if="item.value && item.key == 'auth_test_fare'" width="120" align="left">
            <template #default="{ row }">
              <span>{{ row.sku.auth_test_fare }}</span>
            </template>
          </vxe-column>

          <vxe-column title="总成本(未摊模具)" v-if="item.value && item.key == 'total_cost'" width="120" align="left">
            <template #default="{ row }">
              <span>{{ row.sku.total_cost }}</span>
            </template>
          </vxe-column>

          <vxe-column title="物料成本价" v-if="item.value && item.key == 'tco_cost'" width="120" align="left">
            <template #default="{ row }">
              <span>{{ row.sku.tco_cost }}</span>
            </template>
          </vxe-column>

          <vxe-column title="TCO毛利率" v-if="item.value && item.key == 'tco_rate'" width="120" align="left">
            <template #default="{ row }">
              <span>{{ row.sku.tco_rate + '%' }}</span>
            </template>
          </vxe-column>

          <vxe-column title="代理商价" v-if="item.value && item.key == 'agent_price'" width="120" align="left">
            <template #default="{ row }">
              <span>{{ row.sku.agent_price }}</span>
            </template>
          </vxe-column>

          <vxe-column title="渠道毛利润率" v-if="item.value && item.key == 'channel_rate'" width="120" align="left">
            <template #default="{ row }">
              <span>{{ row.sku.channel_rate + '%' }}</span>
            </template>
          </vxe-column>

          <vxe-column title="经销价" v-if="item.value && item.key == 'distribution_price'" width="120" align="left">
            <template #default="{ row }">
              <span>{{ row.sku.distribution_price }}</span>
            </template>
          </vxe-column>

          <vxe-column title="经销商毛利率" v-if="item.value && item.key == 'distribution_rate'" width="120" align="left">
            <template #default="{ row }">
              <span>{{ row.sku.distribution_rate + '%' }}</span>
            </template>
          </vxe-column>

          <vxe-column title="建议零售价" v-if="item.value && item.key == 'retail_price'" width="120" align="left">
            <template #default="{ row }">
              <span>{{ row.sku.retail_price }}</span>
            </template>
          </vxe-column>

          <vxe-column title="最低零售价" v-if="item.value && item.key == 'min_retail_price'" width="120" align="left">
            <template #default="{ row }">
              <span>{{ row.sku.min_retail_price }}</span>
            </template>
          </vxe-column>

          <vxe-column title="B2C毛利润率" v-if="item.value && item.key == 'b2c_rate'" width="120" align="left">
            <template #default="{ row }">
              <span>{{ row.sku.b2c_rate + '%' }}</span>
            </template>
          </vxe-column>

          <vxe-column title="国内B2C" v-if="item.key == 'b2c'" :edit-render="{ autofocus: '.vxe-input--inner' }" width="120"
            align="left">
            <template #default="{ row }">
              <span>{{ row.b2c }}</span>
            </template>
            <template #edit="{ row }">
              <vxe-input v-model="row.b2c" type="integer" min="0" clearable></vxe-input>
            </template>
          </vxe-column>

          <vxe-column title="亚马逊" v-if="item.key == 'amazon'" :edit-render="{ autofocus: '.vxe-input--inner' }"
            width="120" align="left">
            <template #default="{ row }">
              <span>{{ row.amazon }}</span>
            </template>
            <template #edit="{ row }">
              <vxe-input v-model="row.amazon" type="integer" min="0" clearable></vxe-input>
            </template>
          </vxe-column>

          <vxe-column title="长沙全球商城" v-if="item.key == 'cs_global_mall'" :edit-render="{ autofocus: '.vxe-input--inner' }"
            width="120" align="left">
            <template #default="{ row }">
              <span>{{ row.cs_global_mall }}</span>
            </template>
            <template #edit="{ row }">
              <vxe-input v-model="row.cs_global_mall" type="integer" min="0" clearable></vxe-input>
            </template>
          </vxe-column>

          <vxe-column title="深圳全球商城" v-if="item.key == 'sz_global_mall'" :edit-render="{ autofocus: '.vxe-input--inner' }"
            width="120" align="left">
            <template #default="{ row }">
              <span>{{ row.sz_global_mall }}</span>
            </template>
            <template #edit="{ row }">
              <vxe-input v-model="row.sz_global_mall" type="integer" min="0" clearable></vxe-input>
            </template>
          </vxe-column>

          <vxe-column title="国内渠道" v-if="item.key == 'nation_channels'" :edit-render="{ autofocus: '.vxe-input--inner' }"
            width="120" align="left">
            <template #default="{ row }">
              <span>{{ row.nation_channels }}</span>
            </template>
            <template #edit="{ row }">
              <vxe-input v-model="row.nation_channels" type="integer" min="0" clearable></vxe-input>
            </template>
          </vxe-column>

          <vxe-column title="海外渠道" v-if="item.key == 'overseas_channels'"
            :edit-render="{ autofocus: '.vxe-input--inner' }" width="120" align="left">
            <template #default="{ row }">
              <span>{{ row.overseas_channels }}</span>
            </template>
            <template #edit="{ row }">
              <vxe-input v-model="row.overseas_channels" type="integer" min="0" clearable></vxe-input>
            </template>
          </vxe-column>

          <vxe-column title="市场部" v-if="item.key == 'market_depart'" :edit-render="{ autofocus: '.vxe-input--inner' }"
            width="120" align="left">
            <template #default="{ row }">
              <span>{{ row.market_depart }}</span>
            </template>
            <template #edit="{ row }">
              <vxe-input v-model="row.market_depart" type="integer" min="0" clearable></vxe-input>
            </template>
          </vxe-column>

          <vxe-column title="F2B211/1688" v-if="item.key == 'f2b211_1688'"
            :edit-render="{ autofocus: '.vxe-input--inner' }" width="120" align="left">
            <template #default="{ row }">
              <span>{{ row.f2b211_1688 }}</span>
            </template>
            <template #edit="{ row }">
              <vxe-input v-model="row.f2b211_1688" type="integer" min="0" clearable></vxe-input>
            </template>
          </vxe-column>

          <vxe-column title="总计" v-if="item.key == 'zj'" width="120" align="left">
            <template #default="{ row }">
              <span>
                {{ parseInt(parseInt(row.b2c) + parseInt(row.amazon) + parseInt(row.cs_global_mall) +
                  parseInt(row.sz_global_mall) + parseInt(row.nation_channels) +
                  parseInt(row.overseas_channels) + parseInt(row.market_depart) + parseInt(row.f2b211_1688)) }}</span>
            </template>
          </vxe-column>

          <vxe-column title="备注" v-if="item.key == 'remark'" :edit-render="{ autofocus: '.vxe-input--inner' }"
            min-width="270" align="left">
            <template #default="{ row }">
              <span>{{ row.remark }}</span>
            </template>
            <template #edit="{ row }">
              <vxe-input v-model="row.remark" type="text"></vxe-input>
            </template>
          </vxe-column>

        </template>

      </vxe-table>
      <!-- 选择显示隐藏弹框-->
      <el-dialog v-model="data.isShowColTable" :close-on-click-modal="false" destroy-on-close :append-to-body="false"
        width="65%" title="表单字段配置" center>
        <div>
          <el-checkbox :indeterminate="data.basecheckAll ? !data.baseisIndeterminate : data.baseisIndeterminate"
            v-model="data.basecheckAll" @change="basehandleCheckAllChange"><span
              style="font-weight: bolder;font-size: 14px;">基础字段</span></el-checkbox>
          <el-checkbox-group v-model="data.basekeychecks" @change="basehandleCheckedCitiesChange">
            <el-checkbox v-for="item in data.baseKeys" :label="item.name" :key="item.key"
              style="width: 135px;"></el-checkbox>
          </el-checkbox-group>
        </div>
        <div style="margin-top: 20px;">
          <el-checkbox :indeterminate="data.naturecheckAll ? !data.natureisIndeterminate : data.naturecheckAll"
            v-model="data.naturecheckAll" @change="naturehandleCheckAllChange"><span
              style="font-weight: bolder;font-size: 14px;">属性字段</span></el-checkbox>
          <el-checkbox-group v-model="data.naturekeychecks" @change="naturehandleCheckedCitiesChange">
            <el-checkbox v-for="item in data.natureKeys" :label="item.name" :key="item.key"
              style="width: 135px;"></el-checkbox>
          </el-checkbox-group>
        </div>
        <template #footer>
          <span class="dialog-footer">
            <div class="l-button" @click="makeSurekeys" style="float: right;">确 定</div>
          </span>
        </template>
      </el-dialog>
      <!--通知下单-->
      <div class="xtdiaog">
        <el-dialog v-model="data.isShowNotice" :close-on-click-modal="false" destroy-on-close :append-to-body="false"
          width="30%" title="通知下单" center>
          <div>
            <el-table :data="data.noticeTableData" border header-row-class-name="xthead" class="xttb"
              @selection-change="handleSelectionChange" ref="multipleTable" @select-all="selectAllChange"
              @select="tableSelect">
              <el-table-column type="selection" width="55" align="center" />
              <el-table-column prop="depart" label="下单部门" width="180" />
              <el-table-column>
                <template #header>
                  <div style="display: flex;flex-direction: row;align-items: center;">
                    <el-icon :size="20" color="#909399">
                      <edit />
                    </el-icon>负责人
                  </div>
                </template>
                <template #default="scope">
                  <div @click="getRowCol(scope.row, scope.column, scope.$index)" class="selectdiv">
                    <el-select v-model="scope.row.user_id" placeholder="请选择" filterable remote
                      :remote-method="remoteMethod" v-if="scope.row.islMainUserIdShow">
                      <el-option v-for="item in data.userlist" :key="item.id" :label="item.nickname" :value="item.id" />
                    </el-select>
                    <span v-else>{{ fullName(scope.row.user_id)
                    }}</span>
                  </div>
                </template>
              </el-table-column>
            </el-table>
          </div>
          <template #footer>
            <div class="dialog-footer">
              <el-button type="primary" @click="makeSureNotice">确定</el-button>
            </div>
          </template>
        </el-dialog>
      </div>
    </div>
  </el-main>
</template>
<script>
import { defineComponent, reactive, ref, onMounted, getCurrentInstance, provide, computed } from 'vue';
import { useRouter } from 'vue-router'
import { spsdmqKeylist, spsdmqKeylistMr, thenoticeTableData } from '../../../utils/lc_data'// 获取人员
import { ElMessage } from 'element-plus'
import { getUsers } from '../../../utils/lc'

export default defineComponent({
  name: 'spxdxqMx',
  setup (props) {
    let route = useRouter()
    provide('project_id', route.currentRoute.value.query.id)
    let { proxy } = getCurrentInstance()
    const ids = ref(route.currentRoute.value.query.prBasetaskId)
    const myuserId = localStorage.getItem('userId')
    const leaderUserId = ref(route.currentRoute.value.query.leader_user_id)
    let data = reactive({
      tableData: [],
      keylist: [],
      baseisIndeterminate: false,
      natureisIndeterminate: false,
      basecheckAll: false, // 基础字段全选
      isShowColTable: false,
      baseKeys: [],
      basekeychecks: [],
      naturecheckAll: false,
      natureKeys: [],
      naturekeychecks: [],
      isShowNotice: false,
      userlist: [],
      userlistall: [],
      multipleSelection: [],// 通知表格选中
      selecttag: true,//判断单前行是否选择还是取消选中
      noticeTableData: JSON.parse(JSON.stringify(thenoticeTableData))
    })
    data.baseKeys = spsdmqKeylist.baseKeys
    data.natureKeys = spsdmqKeylistMr.natureKeys
    data.keylist = spsdmqKeylist.baseKeys.concat(spsdmqKeylist.natureKeys)
    getUsers({ page: 1, size: 9999999, nickname: '' }).then(res => {
      res.data.forEach(it => {
        it.islMainUserIdShow = false
      })
      data.userlist = JSON.parse(JSON.stringify(res.data))
      data.userlistall = JSON.parse(JSON.stringify(res.data))
    })
    const fullName = computed(() => {
      return function (id) {
        if (id && data.userlistall && data.userlistall.length > 0) {
          let item = data.userlistall.filter(it => {
            return it.id == id
          })
          return item && item.length > 0 ? item[0].nickname : ''
        }
      }
    })
    onMounted(() => {
      getkeyConfig()
      getPageInfo()
    })
    // 确定下单通知
    function makeSureNotice () {
      if (data.multipleSelection && data.multipleSelection.length > 0) {
        let nulluseridtag = data.multipleSelection.filter(k => {
          return k.user_id == ''
        })
        if (nulluseridtag && nulluseridtag.length > 0) {
          ElMessage({ type: 'error', message: '请设置勾选部门的任务负责人！' })
          return
        }
        data.multipleSelection.forEach(item => {
          if (data.noticeTableData.includes(item)) {
            data.noticeTableData.filter(it => {
              if (it.depart_code == item.depart_code) {
                it.checked = true
                it.user_id = item.user_id
              }
            })
          }
        })
        proxy.$http.post("project/task/first_order_demand/notice", { task_id: ids.value, notice: JSON.stringify(data.noticeTableData) }).then(res => {
          if (res.errno == 200) {
            ElMessage({ type: 'success', message: res.errmsg })
          } else {
            ElMessage({ type: 'error', message: res.errmsg })
          }
          data.isShowNotice = false
        })
      } else {
        ElMessage({ type: 'error', message: '请勾选在确定' })
      }
      console.log('确定下单通知', data.multipleSelection)
    }
    // 表格选择
    function handleSelectionChange (val, tag) {
      data.multipleSelection = val
    }
    function remoteMethod (query) {
      getUsers({ page: 1, size: 9999999, nickname: query }).then(res => {
        res.data.forEach(it => {
          it.islMainUserIdShow = false
        })
        data.userlist = JSON.parse(JSON.stringify(res.data))
      })
    }
    function getRowCol (row, column, index) {
      data.noticeTableData.forEach(it => {
        it.islMainUserIdShow = false
      })
      data.userlist = JSON.parse(JSON.stringify(data.userlistall))
      data.noticeTableData[index].islMainUserIdShow = true
    }
    function tableSelect (rows, row) {
      // data.multipleSelection = rows
      // proxy.$refs.multipleTable.doLayout();
    }
    // 选中全部 -下单通知
    function selectAllChange (value) {
      let checkdids = value.map(v => v.depart_code)
      data.noticeTableData.forEach(it => {
        if (!checkdids.includes(it.depart_code)) {
          it.user_id = null
          it.checked = false
        }
      })
    }
    // 保存
    function handlesave () {
      if (data.tableData && data.tableData.length > 0) {
        let order = []
        data.tableData.forEach(it => {
          order.push({
            id: it.id ? it.id : 0,
            b2c: it.b2c,
            amazon: it.amazon,
            create_time: it.create_time,
            cs_global_mall: it.cs_global_mall,
            f2b211_1688: it.f2b211_1688,
            market_depart: it.market_depart,
            nation_channels: it.nation_channels,
            overseas_channels: it.overseas_channels,
            project_id: it.project_id,
            remark: it.remark,
            sku_id: it.sku_id,
            sz_global_mall: it.sz_global_mall,
            total: parseInt(parseInt(it.b2c) + parseInt(it.amazon) + parseInt(it.cs_global_mall) + parseInt(it.sz_global_mall) + parseInt(it.nation_channels) +
              parseInt(it.overseas_channels) + parseInt(it.market_depart) + parseInt(it.f2b211_1688)),
            update_time: it.update_time
          })
        })
        proxy.$http.post("project/task/first_order_demand/save_order", { task_id: ids.value, order: order }).then(res => {
          if (res.errno == 200) {
            getPageInfo()
            ElMessage({ type: 'success', message: '保存成功' })
          } else {
            ElMessage({ type: 'error', message: res.errmsg })
          }
        })
      }
    }
    // 确认通知下单
    function noticeOrder () {
      data.isShowNotice = true
      proxy.$http.get("project/task/first_order_demand/config", { task_id: ids.value }).then(res => {
        if (res.data.notice) {
          data.noticeTableData = JSON.parse(JSON.stringify(res.data.notice))
          data.noticeTableData.forEach(it => {
            it.checked = false
          })
        } else {
          data.noticeTableData = JSON.parse(JSON.stringify(thenoticeTableData))
        }
      })
    }
    // 配置字段
    function getkeyConfig () {
      proxy.$http.get("project/task/first_order_demand/config", { task_id: ids.value }).then(res => {
        if (res.errno == 200 && res.data && res.data.table_title && res.data.table_title.length > 0) {
          if (res.data.notice) {
            data.noticeTableData = JSON.parse(JSON.stringify(res.data.notice))
          } else {
            data.noticeTableData = JSON.parse(JSON.stringify(thenoticeTableData))
          }
          let arr = res.data.table_title.split(',')
          data.basekeychecks = []
          data.baseKeys.forEach(i => {
            if (arr.includes(i.key)) {
              data.basekeychecks.push(i.name)
            }
          })
          data.baseisIndeterminate = data.basekeychecks.length > 0 ? true : false
          data.basecheckAll = (data.basekeychecks.length === data.baseKeys.length)

          data.naturekeychecks = []
          data.natureKeys.forEach(i => {
            if (arr.includes(i.key)) {
              data.naturekeychecks.push(i.name)
            }
          })
          data.natureisIndeterminate = data.naturekeychecks.length > 0 ? true : false
          data.naturecheckAll = (data.naturekeychecks.length === data.natureKeys.length)

          data.keylist.forEach(i => {
            if (arr.includes(i.key)) {
              i.value = true
            } else {
              i.value = false
            }
          })
        }

      })
    }
    //首批订单信息展示
    function getPageInfo () {
      proxy.$http.get("project/task/first_order_demand/order", { task_id: ids.value }).then(res => {
        data.tableData = res.data.list
      })
    }
    // 基础字段全选
    function basehandleCheckAllChange (val) {
      let allarr = []
      data.baseKeys.forEach(it => {
        allarr.push(it.name)
      })
      data.basekeychecks = val ? allarr : []
      data.baseisIndeterminate = false
    }
    // 基础字段选择
    function basehandleCheckedCitiesChange (value) {
      let checkedCount = value.length
      data.basecheckAll = (checkedCount === data.baseKeys.length)
      data.baseisIndeterminate = (checkedCount > 0 && checkedCount < data.baseKeys.length)
    }
    // 属性字段全选
    function naturehandleCheckAllChange (val) {
      let allarr1 = []
      data.natureKeys.forEach(it => {
        allarr1.push(it.name)
      })
      data.naturekeychecks = val ? allarr1 : []
      data.natureisIndeterminate = false
    }
    // 属性字段选择
    function naturehandleCheckedCitiesChange (value) {
      let checkedCount1 = value.length
      data.naturecheckAll = (checkedCount1 === data.natureKeys.length)
      data.natureisIndeterminate = (checkedCount1 > 0 && checkedCount1 < data.natureKeys.length)
    }
    // 配置表格
    function openKeyshow () {
      data.isShowColTable = true
      getkeyConfig()
    }
    // 确认显示隐藏字段
    function makeSurekeys () {
      data.isShowColTable = false
      let newArry = JSON.parse(JSON.stringify(spsdmqKeylist))
      let thekeys = []
      newArry.natureKeys.forEach(k => {
        if (data.naturekeychecks && data.naturekeychecks.includes(k.name)) {
          k.value = true
          thekeys.push(k.key)
        } else {
          k.value = false
        }
      })
      newArry.baseKeys.forEach(k => {
        if (data.basekeychecks && data.basekeychecks.includes(k.name)) {
          k.value = true
          thekeys.push(k.key)
        } else {
          k.value = false
        }
      })
      data.keylist = newArry.baseKeys.concat(newArry.natureKeys)
      proxy.$http.get("project/task/first_order_demand/set_table_title", { project_id: route.currentRoute.value.query.id, task_id: ids.value, title: thekeys.join(',') }).then(res => {
        if (res.errno == 200) {
          ElMessage({ type: 'success', message: '设置成功' })
        } else {
          ElMessage({ type: 'error', message: res.message })
        }
      })
    }
    return {
      data,
      ids,
      fullName,
      myuserId,
      leaderUserId,
      getPageInfo,
      handlesave,
      noticeOrder,
      getkeyConfig,
      basehandleCheckAllChange,
      basehandleCheckedCitiesChange,
      naturehandleCheckAllChange,
      naturehandleCheckedCitiesChange,
      openKeyshow,
      makeSurekeys,
      selectAllChange,
      tableSelect,
      getRowCol,
      remoteMethod,
      handleSelectionChange,
      makeSureNotice
    }
  }
})
</script>
<style scoped lang="scss">
@import '../../../assets/style/lc.scss';

.xthead {
  background: red;
}

.xtdiaog {
  ::v-deep(.el-dialog__body) {
    padding: 0px 16px 30px 16px;
  }
}

.xttb {
  ::v-deep(.el-table__cell) {
    padding: 5px 0 !important;
  }
}

.selectdiv {
  width: 190px;
  height: 40px;
  font-size: 16px important;
  display: flex;
  align-items: center;
}
</style>