<template>
  <a-modal
      class="funcNetDialog"
      :title="$t('functional-analysis.top-modal.failure-matrix')"
      :visible="modalVisible"
      :maskClosable="false"
      @cancel="close"
      :keyboard="false"
      width="100%"
      destroyOnClose
      :footer="false"
      @afterClose="close">
    <div ref="failureMatrixModal">
      <div class="failureMatrixModal-from">
        <a-form layout="vertical">
          <a-row :gutter="24">
            <a-col :xl="6" :lg="8" :md="12" :sm="24" :xs="24">
              <a-form-item :label="$t('functional-analysis.top-modal.structure')">
                <a-tree-select
                    ref="leftTree"
                    :v-model="leftTreeSelectValue"
                    :dropdown-style="{ maxHeight: '400px', overflow: 'auto' }"
                    :placeholder="$t('functional-analysis.top-modal.please-select-a-structure')"
                    allow-clear
                    show-search
                    tree-default-expand-all
                    :replaceFields="replaceFields"
                    :filterTreeNode="filterTreeNode"
                    :tree-data="leftTreeData"
                    @change="leftTreeSelectChange">
                  <template #title="{ value: val, title }">
                    <template>{{ title }}</template>
                  </template>
                </a-tree-select>
              </a-form-item>
            </a-col>
            <a-col :xl="6" :lg="8" :md="12" :sm="24" :xs="24">
              <a-form-item :label="$t('functional-analysis.top-modal.child')">
                <a-select
                    ref="rightTree"
                    v-model="rightTreeSelectValue"
                    mode="tags"
                    :placeholder="$t('functional-analysis.top-modal.please-select-a-structure')"
                    allow-clear
                    @change="rightTreeSelectChange">
                  <a-select-option
                      v-for="item in rightTreeData"
                      :key="item.id">
                    {{ item.name }}
                  </a-select-option>
                </a-select>
              </a-form-item>
            </a-col>
          </a-row>
          <a-row>
        <span class="fr">
          <a-button @click="search" type="primary">
            {{ $t('global-btn.search') }}
          </a-button>
        </span>
          </a-row>
        </a-form>
      </div>

      <!-- 失效矩阵表格 -->
      <div class="mt10">
        <a-table
            v-if="topTableColumns && topTableColumns.length > 0"
            :data-source="tableData"
            :columns="tableColumns"
            :rowKey="(row, index) => {return row.key;}"
            bordered
            size="small"
            :loading="tableLoading"
            :scroll="{ x: tableScrollX, y: tableScrollY }"
            :pagination="false"
            @expand="click()">
            <template
                    slot="name"
                    slot-scope="text, record">
                <span v-if="record.leftStruTypeCode === '02'">
                  <span>
                    <i :class=" record.show ? 'iconfont iconrenwuweizhi-xiayi' : 'iconfont iconxialaanniu'" @click="leftDropDowen(record)"></i>
                  </span>
                  <span style="color: rgb(66, 167, 94)">{{ text }}</span>
                </span>
                <span v-else-if="record.leftStruTypeCode === '04'">
                  <span>
                    <i :class=" record.show ? 'iconfont iconrenwuweizhi-xiayi' : 'iconfont iconxialaanniu'" @click="leftDropDowen(record)"></i>
                  </span>
                  <span style="color: #5b9bd5">{{ text }}</span>
                </span>
              <span v-else-if="record.leftStruTypeCode === '05'">
                  <span>
                    <i :class=" record.show ? 'iconfont iconrenwuweizhi-xiayi' : 'iconfont iconxialaanniu'" @click="leftDropDowen(record)"></i>
                  </span>
                  <span style="color: #5b9bd5">{{ text }}</span>
                </span>
                <span v-else-if="record.leftStruTypeCode === '01'" style="padding-left: 15px">{{ text }}</span>
                <span v-else style="color: rgb(200, 77, 60); padding-left: 15px">{{ text }}</span>
            </template>
        </a-table>
        <!-- 表格无数据 -->
        <a-table v-if="!topTableColumns"/>
      </div>
    </div>
  </a-modal>
</template>

<script>

import {arrayToTree} from "@/utils/tree";

const defaultTopTableColumns = [{
  title: '',
  dataIndex: 'leftStructure',
  width: 150,
  fixed: 'left',
  align: 'center',
}];

export default {
  name: "FailureMatrixModal",
  props: {
    showFailureMatrixModal: {
      type: Boolean,
      default: false
    }
  },
  data() {
    return {
      /** 初始的左侧表头数据 */
      initLeftStru: [],
      /** 初始的上方表头数据 */
      initTopStru: [],
      /** 暂存的上方表头数据 */
      stagingTopStruList: [],
      /** 左侧表头暂存数据 */
      nowTableData: [],
      /** 表格数据 */
      tableData: [],
      /** 表格表头据 */
      tableColumns: [],
      /** 初始的顶部表头失效数据 */
      initTopFailList: [],
      /** 实时的顶部表头失效数据 */
      stagingTopFailList: [],
      /** 顶部表格列数据 */
      topTableColumns: defaultTopTableColumns,
      /** 表格数据 */
      funNet: [],
      /** 左侧树数据 */
      leftTreeData: [],
      /** 左侧树选中值 */
      leftTreeSelectValue: undefined,
      /** 左侧树选中ID */
      leftTreeSelectId: undefined,
      /** 右侧树数据 */
      rightTreeData: [],
      /** 右侧树选中值 */
      rightTreeSelectValue: undefined,
      /** 右侧树选中ID数组 */
      rightTreeSelectIds: [],
      /** 替换 treeNode 中 title,key,children,value 字段为 treeData 中对应的字段 */
      replaceFields: {children: 'children', label: 'name', key: 'id', value: 'id'},
      /** 模态框是否可见 */
      modalVisible: false,
      /** 表格Loading */
      tableLoading: false,
      /** 表格动态宽度 */
      tableScrollX: 0,
      /** 表格动态高度 */
      tableScrollY: 0,
      /** 顶部功能索引 */
      topFunctionIndex: 0,
      /** 顶部失效索引 */
      topFailureIndex: 0,
    };
  },
  watch: {
    showFailureMatrixModal(val) {
      this.rightTreeSelectValue = undefined;
      this.rightTreeSelectIds = [];
      this.modalVisible = val;
    },
  },
  methods: {
    /**
     * 点击上部表头下拉或者收缩的操作
     */
    topDropDowen(funcNode){
      funcNode.topFuncShow = !funcNode.topFuncShow
      let topFalseNode = [];//存放顶部伸缩起来的功能的id集合
      if (this.stagingTopStruList.length > 0){
        for (let i = 0, len = this.stagingTopStruList.length; i < len; i++){//循环暂存的顶部数据
          if (this.stagingTopStruList[i].funList.length > 0) {
            let tableColumn = this.stagingTopStruList[i].funList
            for (let j = 0, len = tableColumn.length; j < len; j++){
              if (tableColumn[j].topFuncShow === false) {
                topFalseNode.push(tableColumn[j].id)//取所有伸缩起来的功能id集合
              }
            }
          }
        }
      }
      this.stagingTopStruList = JSON.parse(JSON.stringify(this.initTopStru));//对顶部数据进行重置更新
      if (this.stagingTopStruList.length > 0){
        for (let i = 0, len = this.stagingTopStruList.length; i < len; i++){
          if (this.stagingTopStruList[i].funList.length > 0) {
            let tableColumn = this.stagingTopStruList[i].funList
            for (let j = 0, len = tableColumn.length; j < len; j++){
              if (topFalseNode.includes(tableColumn[j].id) && tableColumn[j].funList.length > 0) {
                tableColumn[j].topFuncShow = false;
                tableColumn[j].funList = tableColumn[j].funList.slice(0,1);//伸缩起来的只保留第一个失效
              }else {
                tableColumn[j].topFuncShow = true;
              }
            }
          }
        }
      }
      let topFailList = [];//用来存放顶部失效集合
      if (this.stagingTopStruList != null && this.stagingTopStruList.length > 0){
        this.stagingTopStruList.forEach(function (stru) {
           if (stru.funList != null && stru.funList.length > 0){
             stru.funList.forEach(function (func) {
               if (func.funList != null && func.funList.length > 0){
                 func.funList.forEach(function (fail) {
                   topFailList.push(fail);
                 })
               }
             })
           }
         }
        )
      }
      this.stagingTopFailList = topFailList;//保存实时的顶部失效集合
      //先刷新左侧表格数据
      let resLeftStru = this.initLeftStru;
      let falseStruNode = [];//存储所有收缩的功能id集合
      if (this.tableData != null){//查询所有伸缩的功能id集合
        for (let i = 0, len = this.tableData.length; i < len; i++){
          if (this.tableData[i].show === false) falseStruNode.push(this.tableData[i].leftStruId);
        }
      }
      this.handleTableData(resLeftStru, this.stagingTopFailList, falseStruNode);
      //重新整理表格头数据
      this.handleTableColumns(this.stagingTopStruList, topFailList.length);
    },
    /**
     * 点击左侧表头下拉或者收缩的操作
     */
    leftDropDowen(record) {
      record.show = !record.show;
      let resTopFailList = this.stagingTopFailList.length > 0 ? this.stagingTopFailList : this.initTopFailList;//取顶部失效数据
      let resLeftStru = this.initLeftStru;
      let falseStruNode = [];//存储所有收缩的功能id集合
      if (this.tableData != null){//查询所有伸缩的功能id集合
        for (let i = 0, len = this.tableData.length; i < len; i++){
          if (this.tableData[i].leftStruId === record.leftStruId) this.tableData[i].show = record.show;
          if (this.tableData[i].show === false) falseStruNode.push(this.tableData[i].leftStruId);
        }
      }
      let topFailList = [];//用来存放顶部失效集合
      if (this.stagingTopStruList != null && this.stagingTopStruList.length > 0){
        this.stagingTopStruList.forEach(function (stru) {
            if (stru.funList != null && stru.funList.length > 0){
              stru.funList.forEach(function (func) {
                if (func.funList != null && func.funList.length > 0){
                  func.funList.forEach(function (fail) {
                    topFailList.push(fail);
                  })
                }
              })
            }
          }
        )
      }
      this.handleTableData(resLeftStru, resTopFailList, falseStruNode);
      //重新整理表格头数据
      this.handleTableColumns(this.stagingTopStruList, topFailList.length);
    },
    /**
     * 用来计算顶部失效集合的方法
     */
    computerTopFailList(initTopStru) {
      this.stagingTopStruList = JSON.parse(JSON.stringify(initTopStru));
      let topFailList = [];//用来存放顶部失效集合
      if (this.stagingTopStruList != null && this.stagingTopStruList.length > 0){
        this.stagingTopStruList.forEach(function (stru) {
           if (stru.funList != null && stru.funList.length > 0){
             stru.funList.forEach(function (func) {
               if (func.funList != null && func.funList.length > 0){
                 func.funList.forEach(function (fail) {
                   topFailList.push(fail);
                 })
               }
             })
           }
         }
        )
      }
      this.stagingTopFailList = topFailList;
    },
    /**
     * 取得表格高度
     */
    getTableHeight() {
      this.$nextTick(() => {
        let dom = this.$refs.failureMatrixModal;
        let failureMatrixModalFromH = dom.querySelector(".failureMatrixModal-from").offsetHeight;
        let otherDomH = 300 + failureMatrixModalFromH;
        this.tableScrollY = "calc(100vh - " + otherDomH + "px)";
      });
    },
    /**
     * 关闭模态框
     */
    close() {
      this.$emit("closeModal");
      this.$emit("initRightTree");
    },
    /**
     * 获取左侧下拉值
     */
    getLeftSelect() {
      let _that = this;
      _that.$api.getLeftTree({
        fmeaId: _that.$store.getters.rfmeaId
      }).then(res => {
        if (res.flag) {
          let targetNode = res.data.mfmeaStruTreeModels.filter((item) => {
            return item.pid === '00000000000000000000000000000000';
          })[0];
          _that.leftTreeSelectId = targetNode.id;
          // 获取下级下拉
          _that.getChildSelect(targetNode.id);
          // 数组转Tree
          _that.leftTreeData = arrayToTree(targetNode, res.data.mfmeaStruTreeModels);
        } else {
          _that.$message.error(res.message, 1);
        }
      }).catch((error) => {
        _that.$message.error(error.response.data.message, 1);
      });
    },
    /**
     * 获取下级下拉
     * @param leftId 左侧结构ID
     */
    getChildSelect(leftId) {
      let _that = this;
      _that.$api.getFunctionMatrixChild({
        fmeaId: _that.$store.getters.rfmeaId,
        struId: leftId
      }).then(res => {
        if (res.flag) {
          _that.rightTreeData = res.data.mfmeaStruTreeModels;
        } else {
          _that.$message.error(res.message, 1);
        }
      }).catch((error) => {
        _that.$message.error(error.response.data.message, 1);
      });
    },
    /**
     * 列表
     *@param rootNodeId 根节点ID
     */
    list(rootNodeId) {
      let _that = this;
      _that.tableLoading = true;
      _that.$api.getFailureMatrix({
        fmeaId: _that.$store.getters.rfmeaId,
        struId: rootNodeId ? rootNodeId : _that.leftTreeSelectId,
        childStruId: _that.rightTreeSelectIds && _that.rightTreeSelectIds.length > 0
            ? _that.rightTreeSelectIds.toString() : _that.rightTreeSelectIds,
      }).then(res => {
        if (res.flag) {
          _that.initTopStru = res.data.topStruList;//初始的顶部数据树
          this.computerTopFailList(res.data.topStruList);//计算顶部失效集合
          _that.stagingTopStruList = res.data.topStruList;//暂存的顶部数据树
          _that.initLeftStru = res.data.leftTreeList;//初始的左侧数据集合
          let topFail = this.computeTopFail(res.data.topStruList);//计算实际顶部的失效数据集合
          _that.initTopFailList = topFail;
          let resFunNet = res.data.funNet;
          // 顶部表格列数据
          _that.topTableColumns = _that.stagingTopStruList;
          if (!_that.stagingTopStruList) return;
          // 表格数据
          if (resFunNet) _that.funNet = Object.keys(resFunNet);
          // 表格宽度默认300（左侧结构 + 左侧功能，两列宽度）
          _that.tableScrollX = 400;
          // 处理表格列
          _that.handleTableColumns(_that.stagingTopStruList, null);
          // 处理表格数据
          _that.handleTableData(res.data.leftTreeList, _that.initTopFailList, []);
          // 取得表格高度
          _that.getTableHeight();
        } else {
          _that.$message.error(res.message, 1);
        }
      }).catch((error) => {
        _that.$message.error(error.response.data.message, 1);
      }).finally(() => {
        _that.tableLoading = false;
      })
    },
    /**
     * 输入项筛选
     * @param inputValue
     * @param treeNode
     */
    filterTreeNode(inputValue, treeNode) {
      return treeNode.data.props.name.includes(inputValue)
    },
    /**
     * 搜索
     */
    search() {
      this.list();
    },
    /**
     * 保存
     * @param leftFuncId 左侧功能ID
     * @param topFuncId 顶部功能ID
     * @param checkFlag 选中标识
     */
    save(leftFuncId, topFuncId, checkFlag) {
      let _that = this;
      _that.$api.saveFailureMatrix({
        fmeaId: _that.$store.getters.rfmeaId,
        failureId: [leftFuncId, topFuncId].toString(),
        checkFlag: checkFlag,
      }).then(res => {
        if (res.flag) {
          _that.$message.success(res.message, 1);
          let k = leftFuncId + topFuncId;
          if (checkFlag) { // 追加
            _that.funNet.push(k);
          } else { // 删除
            for (let i = _that.funNet.length - 1; i >= 0; i--) {
              if (k === _that.funNet[i]) _that.funNet.splice(i, 1);
            }
          }
        } else {
          _that.$message.error(res.message, 1);
        }
      }).catch((error) => {
        _that.$message.error(error.response.data.message, 1);
      });
    },
    /**
     * 计算实际顶部表头下的失效数据
     */
    computeTopFail(topStru) {
      let topFailList = [];
      if (topStru != null){
        for (let i = 0, len = topStru.length; i < len; i++){
          if (topStru[i].funList != null) {
            for (let j = 0, len = topStru[i].funList.length; j < len; j++){
              if (topStru[i].funList[j].funList != null) {
                for (let k = 0, len = topStru[i].funList[j].funList.length; k < len; k++){
                  topFailList.push(topStru[i].funList[j].funList[k]);
                }
              }
            }
          }
        }
      }
      return topFailList;
    },
    /**
     * 处理表格列
     * @param leftStru 左侧结构
     * @param topStruList 顶部结构数组
     */
    handleTableColumns(topStruList, total) {
      let topTotal = 0;//取所有头部失效总条数为表格总行数
      if (total === null){
        for (let i = 0, len = topStruList.length; i < len; i++){
          if (topStruList[i].funList != null && topStruList[i].funList != undefined){
            topTotal += topStruList[i].funList.length;
          }
        }
      }else {
        topTotal = total;
      }
      let _that = this;
      let tableColumns = [
        //处理左侧结构列
        _that.handleLeftStructureTableColumns(),//左侧第一列总标题
      ];
      let topTableColumns = _that.handleTopStructureTableColumns(topStruList, topTotal);//加载头部数据以及下方单选框
      (topTableColumns || []).forEach(item => {//循环添加拼接表格
        tableColumns.push(item);
      });
      _that.tableColumns = tableColumns;
    },
    /**
     * 处理表格数据
     * @param leftStru 左侧结构数据
     */
    handleTableData(leftStru, topFailList, falseStruNode) {
      let _that = this;
      let tableData = [];
      let key = 0;
      //取得对应头部的数据然后跟表头进行合并
      let topFunctionData = _that.handleTopFunctionIdTableData(topFailList);
      let funCodeList = ['02', '04', '05'];
      if (leftStru.length > 0){
        for (let i = 0, len = leftStru.length; i < len; i++) {
          let data = {}
          if (funCodeList.includes(leftStru[i].struTypeCode) && falseStruNode.length > 0 && falseStruNode.includes(leftStru[i].struId)){//加入功能数据，加入伸缩的show属性
            data = {//对应添加伸缩的功能数据
              key: key,
              leftName: leftStru[i].name,
              leftStruId: leftStru[i].struId,
              leftStruTypeCode: leftStru[i].struTypeCode,
              show: false,
            };
          }else if (funCodeList.includes(leftStru[i].struTypeCode)){
            data = {//添加展开的功能数据
              key: key,
              leftName: leftStru[i].name,
              leftStruId: leftStru[i].struId,
              leftStruTypeCode: leftStru[i].struTypeCode,
              show: true,
            };
          }else if (falseStruNode != null && !falseStruNode.includes(leftStru[i].parentStruId)){
            data = {//添加跟结构和失效数据
              key: key,
              leftName: leftStru[i].name,
              leftStruId: leftStru[i].struId,
              leftStruTypeCode: leftStru[i].struTypeCode,
            };
          }else if (falseStruNode === null){
            data = {//添加跟结构和失效数据
              key: key,
              leftName: leftStru[i].name,
              leftStruId: leftStru[i].struId,
              leftStruTypeCode: leftStru[i].struTypeCode,
            };
          }
          key++;
          // 合并
          if (leftStru[i].struTypeCode === '06' && data.leftName != null){
            Object.assign(data, topFunctionData);
            tableData.push(data);
          }else if (leftStru[i].struTypeCode != '06'){
            tableData.push(data);
          }
        }
      }
      _that.tableData = tableData;
      //把当前数据放入暂存
      _that.nowTableData = tableData;
    },
    /**
     * 处理顶部功能表格数据
     * @param leftStru 左侧结构数据
     */
    handleTopFunctionIdTableData(topFailList) {//拼接顶部表头的下方数据
      let tableData = {};
      for (let i = 0, len = topFailList.length; i < len; i++) {
        tableData['topFailureId' + i] = topFailList[i].id;
      }
      return tableData;
    },
    /**
     * 处理左侧结构表格列
     * @param rowSpan 合并行数
     */
    handleLeftStructureTableColumns() {
      return {
        title: '',
        dataIndex: 'leftName',
        width: 200,
        fixed: 'left',
        align: 'left',
        ellipsis: false,
        scopedSlots: { customRender: 'name' },
        /*customRender: (value, row, index) => {
          const obj = {
            children: value,
            attrs: {},
          };
          return obj;
        },*/
        customCell: (row, index) => {
          return {
            style: {
              'background-color': '#fafafa'
            }
          };
        },
      }
    },
    /**
     * 处理顶部结构表格列
     * @param topStruList 顶部结构数据
     */
    handleTopStructureTableColumns(topStruList, topTotal) {
      let tableColumns = [];
      this.topFailureIndex = 0;
      for (let i = 0, len = topStruList.length; i < len; i++) {//遍历顶部第一层数据
        let children = []
        if (topStruList[i].funList && topStruList[i].funList.length > 0) {
          // 默认追加动态列宽度：200px
          this.tableScrollX = topTotal * 100;
          children = this.handleTopFunctionTableColumns(topStruList[i].funList);//整理结构下功能子集
          if (children.length != 0 && children != null && children != undefined){//判断如果有子节点数据才会加载到页面
            tableColumns.push({
              title: () => {
                return  <span title={topStruList[i].name}>
                        {topStruList[i].name}
                        </span>
              },
              align: 'center',
              ellipsis: true,
              children: children,
            })
          }
        }
      }
      return tableColumns;
    },
    /**
     * 处理顶部功能表格列
     * @param topFunList 数据数据
     */
    handleTopFunctionTableColumns(topFunList) {
      let tableColumns = [];
      for (let i = 0, len = topFunList.length; i < len; i++) {
        let children = []
        if (topFunList[i].funList && topFunList[i].funList.length > 0) {
          children = this.handleTopFailureTableColumns(topFunList[i].funList);//整理功能下失效的子集
          if (children.length != 0 && children != null && children != undefined){//判断如果有失效子节点才会加载页面
            tableColumns.push({
              title: () => {
                return <span title={topFunList[i].name}>
                        <span class={topFunList[i].topFuncShow ? 'iconfont iconrenwuweizhi-xiayi' : 'iconfont iconxialaanniu' } onclick={(e) => this.topDropDowen(topFunList[i])}></span>
                        <span class={topFunList[i].struTypeCode === '02' ? 'function-color' : 'productFeature-color'}>{topFunList[i].name}</span>
                       </span>
              },
              align: 'center',
              ellipsis: true,
              children: children,
            },)
          }
        }
      }
      return tableColumns;
    },
    /**
     * 处理顶部失效表格列
     * @param topFunList 数据数据
     */
    handleTopFailureTableColumns(topFunList) {
      let tableColumns = [];
      for (let i = 0, len = topFunList.length; i < len; i++) {//遍历最后失效节点
        tableColumns.push({
          title: () => {
            return <span class={topFunList[i].struTypeCode === '06' ? 'fault-color' : 'productFeature-color'}
            title={topFunList[i].name}>
                    {topFunList[i].name}
                    </span>
          },
          dataIndex: 'topFailureId' + this.topFailureIndex,//为失效对应的id加位置
          customRender: (value, row, index) => {
            if (value && row.leftStruTypeCode != '02' && row.leftStruTypeCode != '01' && row.leftStruTypeCode != '99') {// 添加下方单选框
              return <a-checkbox
              checked={this.isCheck(row.leftStruId, value)}
              onChange={(e) => this.checkboxChange(e, row.leftStruId, value)}/>;
            } else {
              return '';
            }
          },
          width: 50,
          align: 'center',
          ellipsis: true
        },)
        this.topFailureIndex++;
      }
      return tableColumns;
    },
    /**
     * 左侧树选中事件
     * @param value
     * @param label
     * @param extra
     */
    leftTreeSelectChange(value, label, extra) {
      this.leftTreeSelectId = value;
      this.rightTreeSelectValue = undefined;
      this.rightTreeSelectIds = undefined;
      this.getChildSelect(value);
    },
    /**
     * 左侧树选中事件
     * @param value
     * @param option
     */
    rightTreeSelectChange(value, option) {
      this.rightTreeSelectIds = value;
    },
    /**
     * 复选框：是否选中
     * @param leftFuncId 左侧功能ID
     * @param topFuncId 顶部功能ID
     */
    isCheck(leftFuncId, topFuncId) {
      let k = leftFuncId + topFuncId;
      return this.funNet.indexOf(k) !== -1;
    },
    /**
     * 复选框改变事件
     * @param e
     * @param leftFuncId 左侧功能ID
     * @param topFuncId 顶部功能ID
     */
    checkboxChange(e, leftFuncId, topFuncId) {
      if (this.$api.isLook !== '1') {
        this.save(leftFuncId, topFuncId, e.target.checked);
      }
    },
  },
  destroyed() {
    this.$emit("closeModal");
  }
}
</script>
<style lang="less" scoped>

// 设置model 全屏
/deep/ .ant-modal {
  top: 0 !important;
}

// 设置model 全屏
/deep/ .ant-modal-content {
  height: calc(100vh);
}

// 不加上弹窗就会有滚动条;
/deep/ .ant-modal-wrap {
  overflow: hidden !important
}

/*/deep/ .ant-modal-close-x {
  font-size: 40px;
  color: white;
}

/deep/ .ant-modal-header {
  background: #5170b7;
}

/deep/ .ant-modal-title {
  color: white;
}*/

/*/deep/ .ant-table-fixed-left .ant-table-fixed {

  .ant-table-thead tr {
    height: 76px !important;
  }

  .ant-table-tbody tr {
    height: 38px !important;
  }

  .ant-table-tbody td {
    border-bottom: 1px solid #e8e8e8;
  }
}*/

</style>
