<template>
  <div>
    <avue-crud :option="option" :table-loading="loading" :data="data" v-model="form" v-model:page="page" ref="crud"
      @row-del="rowDel" @search-change="searchChange" @search-reset="searchReset" @selection-change="selectionChange"
      @current-change="currentChange" @size-change="sizeChange" @refresh-change="refreshChange" @on-load="onLoad"
      @row-update="rowUpdate" @sort-change="sortChange">
      <template #menu-left>
        <el-button type="primary" @click="claseOrder()" v-if="permission.missing_data_close_order">关闭订单</el-button>
      </template>
      <template #menu-right> </template>

      <template #ypCode="{ row }">
        <el-text type="primary">{{ row.ypCode }}</el-text>
      </template>
      <template #productIdent="{ row }">
        <el-tag>{{ row.productIdent }}</el-tag>
      </template>
      <template #curStatusText="{ row }">
        <el-tag v-if="row.curStatusText == '已派工'">{{ row.curStatusText }}</el-tag>
        <el-tag class="ml-2" type="success" v-if="row.curStatusText == '已完工'">
          {{ row.curStatusText }}</el-tag>
        <el-tag class="ml-2" type="info" v-if="row.curStatusText == '已关闭'">{{
          row.curStatusText
        }}</el-tag>
        <el-tag class="ml-2" type="warning" v-if="row.curStatusText == '加工中'">{{
          row.curStatusText
        }}</el-tag>
        <el-tag class="ml-2" type="danger" v-if="row.curStatusText == '已退回'">{{
          row.curStatusText
        }}</el-tag>
        <el-tag class="ml-2" type="danger" v-if="row.curStatusText == '无工艺'">{{
          row.curStatusText
        }}</el-tag>
      </template>
      <template #validationMomo="{ row }">
        <el-text class="mx-1" type="danger">{{ row.validationMomo }}</el-text>
      </template>
      <template #menu="{ row }">
        <el-button type="primary" text @click="editData(row)" v-if="permission.missing_data_edit">修改</el-button>
        <!-- <el-button text @click="editData1(row)">修改1</el-button> -->
        <!-- <el-button type="primary" text plain style="border: 0; background-color: transparent !important"
                @click="lookProcessRoute(row)">查看工艺路线
            </el-button> -->
      </template>
      <template #demandDate="{ row }">
        {{ row.demandDate ? row.demandDate.substring(0, 10) : '' }}
      </template>

    </avue-crud>
    <el-dialog v-model="isEdit" width="80%" title="修改">
      <el-form :model="editForm" ref="form" :rules="formRules" label-width="120">
        <el-row>
          <el-col :span="8">
            <el-form-item label="计划单号：" prop="ypCode">
              <el-input v-model="editForm.ypCode" disabled clearable placeholder="请输入计划单号"></el-input>
            </el-form-item>
          </el-col>
           <el-col :span="8">
          <el-form-item label="生产单号：" prop="yoCode">
            <el-input v-model="editForm.yoCode" disabled />
          </el-form-item>
        </el-col>
          <el-col :span="8">
            <el-form-item label="零件号：" prop="partCode">
              <jhSelect :value="editForm.partCode" disabled @input="val => (editForm.partCode = val)"
                placeholder="请搜索选择" api-url="/blade-desk/dsPart/listNew" echo-api="/blade-desk/dsPart/listNew"
                echoParamsKey="ids" echo-method="get" api-method="get" list-key="records" total-key="total"
                label-key="partCode" value-key="id" search-key="partCode" :debounce-time="500"
                @change="(value, item) => partCodeChange(editForm.partCode, value, item)" />
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="批次号：" prop="batchNo">
              <el-input v-model="editForm.batchNo" />
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="流转编号：" prop="roamNo">
              <el-input v-model="editForm.roamNo" />
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="下级B号：" prop="roamNoNext">
              <el-input v-model="editForm.roamNoNext" />
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="订单类型：" prop="yieldType">
              <el-select v-model="editForm.yieldType" placeholder="请选择" filterable clearable disabled>
                <el-option  :value="12001" label="热表订单" />
              
              </el-select>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="产品型号：" prop="productType">
              <el-input v-model="editForm.productType" disabled placeholder="请输入产品型号"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="产品名称：" prop="partName">
              <el-input v-model="editForm.partName" disabled placeholder="请输入产品名称"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="工艺路线：" prop="primaryCraft">
              <el-input v-model="editForm.primaryCraft" disabled />
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="面积(dm²)：" prop="ypArea">
              <el-input v-model="editForm.ypArea" clearable disabled placeholder="请输入面积(dm²)"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="镀种：" prop="plate">
              <el-input v-model="editForm.plate" clearable disabled placeholder="请输入镀种"></el-input>
            </el-form-item>
          </el-col>


          <el-col :span="8">
            <el-form-item label="生产标识：" prop="productIdent">
              <el-select v-model="editForm.productIdent" placeholder="请选择生产标识" filterable clearable>
                <el-option v-for="item in productIdentList" :key="item.id" :label="item.name"
                  :value="item.name"></el-option>
              </el-select>
            </el-form-item>
          </el-col>

          <el-col :span="8">
            <el-form-item label="使用部门名称：" prop="useDept">
              <el-input v-model="editForm.useDept" clearable disabled placeholder="请输入使用部门"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="使用部门编码：" prop="useDept">
              <el-input v-model="editForm.useDeptCode" clearable disabled placeholder="请输入使用部门"></el-input>
            </el-form-item>
          </el-col>

          <el-col :span="8">
            <el-form-item label="需求数量：" prop="ypQty">
              <el-input v-model="editForm.ypQty" clearable disabled placeholder="请输入需求数量"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="需求交期：" prop="demandDate">
              <el-date-picker style="width: 100%" type="date" placeholder="请选择需求交期" format="YYYY-MM-DD"
                value-format="YYYY-MM-DD" v-model="editForm.demandDate" />
            </el-form-item>
          </el-col>


          <el-col :span="8">
            <el-form-item label="计划部门编码：" prop="planDeptCode">
              <el-input v-model="editForm.planDeptCode" clearable placeholder="请输入"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="计划员：" prop="planUser">
              <el-input v-model="editForm.planUser" clearable placeholder="请输入"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="计划下达时间：" prop="releaseDate">
              <el-date-picker style="width: 100%" type="datetime" placeholder="请选择计划下达时间" format="YYYY-MM-DD HH:mm:ss"
                value-format="YYYY-MM-DD HH:mm:ss" v-model="editForm.releaseDate" />
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="备注：" prop="memo">
              <el-input v-model="editForm.memo" type="textarea" placeholder="请输入备注"></el-input>
            </el-form-item>
          </el-col>
        </el-row>
      </el-form>
      <template #footer>
        <span class="dialog-footer">
          <el-button @click="isEdit = false">取 消</el-button>
          <el-button type="primary" @click="submitEdit">确定</el-button>
        </span>
      </template>
    </el-dialog>
  </div>
</template>

<script>
import {
  getList,
  closeBatchs,
  updateData,
  getPartList,
  getProductionIdentificationList,
} from '@/api/orderManagement/exceptionOrder';
import jhSelect from '@/components/jh-select/index.vue';
import { mapGetters } from 'vuex';
export default {
  components: { jhSelect },
  computed: {
    ...mapGetters(['permission']),
  },
  data() {
    return {
      editForm: {},
      formRules: {
        partCode: [{ required: true, message: '请选择零件号', trigger: 'change' }],
        productIdent: [{ required: true, message: '请选择生产标识', trigger: 'change' }],
        ypQty: [{ required: true, message: '请输入需求数量', trigger: 'change' }],
        demandDate: [{ required: true, message: '请选择需求交期', trigger: 'change' }],
        planUser: [{ required: true, message: '请输入计划员', trigger: 'change' }],
        releaseDate: [{ required: true, message: '请选择计划下达时间', trigger: 'change' }],
        planDeptCode: [{ required: true, message: '请输入计划部门编码', trigger: 'change' }],
        // productType:[{required: true, message: '请输入产品型号', trigger: 'blur'}]
      },
      partCodeList: [],
      productIdentList: [],
      isEdit: false,
      isOpen: false,
      rowItem: {},
      poId: null,
      form: {},
      box: false,
      props: {
        label: 'title',
        value: 'key',
      },
      menuGrantList: [],
      dataScopeGrantList: [],
      apiScopeGrantList: [],
      apiGrantList: [],
      menuTreeObj: [],
      dataScopeTreeObj: [],
      apiScopeTreeObj: [],
      selectionList: [],
      query: {},
      loading: true,
      page: {
        pageSize: 10,
        currentPage: 1,
        total: 0,
      },
      option: {
        columnSort: true,
        tip: false,
        height: 'auto',
        calcHeight: 32,
        simplePage: false,
        searchShow: true,
        searchMenuSpan: 6,
        searchIcon: true,
        searchIndex: 3,
        tree: false,
        border: true,
        index: false,
        selection: true,
        viewBtn: false,
        delBtn: false,
        addBtn: false,
        editBtn: false,
        editBtnText: '修改',
        labelWidth: 120,
        // searchLabelWidth: 120,
        menuWidth: 80,
        dialogWidth: 900,
        dialogClickModal: false,
        searchEnter: true,
        excelBtn: false,
        filterBtn: true,
        searchShowBtn: false,
        excelBtn: true,
        showOverflowTooltip: true,
        addBtnIcon: ' ',
        viewBtnIcon: ' ',
        delBtnIcon: ' ',
        editBtnIcon: ' ',
        menuAlign: 'left',
        gridBtn: false,
        searchLabelPosition: 'left',
        searchGutter: 24,
        searchSpan: 6,
        menuAlign: 'center',
        gridBtn: false,
        searchMenuPosition: 'right',
        searchLabelWidth: 'auto',
        align: 'center',

        column: [
          {
            label: '异常原因',
            prop: 'validationMomo',
            search: true,
            sortable: 'custom',
            width: 240,
            span: 12,
            headerAlign: 'center',
            align: 'center',
            rules: [
              {
                required: true,
                message: '请输入计划单号',
                trigger: 'blur',
              },
            ],
          },
          {
            label: '计划单号',
            prop: 'ypCode',
            search: true,
            sortable: 'custom',
            width: 150,
            span: 12,
            headerAlign: 'center',
            align: 'center',
            rules: [
              {
                required: true,
                message: '请输入计划单号',
                trigger: 'blur',
              },
            ],
          },
          {
            label: '生产订单',
            prop: 'yoCode',
            search: true,
            sortable: 'custom',
            width: 150,
            span: 12,
            headerAlign: 'center',
            align: 'center',
            rules: [
              {
                required: true,
                message: '请输入生产订单',
                trigger: 'blur',
              },
            ],
          },
          {
            label: '零件号',
            prop: 'partCode1',
            search: true,
            sortable: 'custom',
            addDisplay: false,
            editDisplay: false,
            width: 150,
            span: 12,
            hide: true,
            headerAlign: 'center',
            align: 'center',
            // rules: [
            //   {
            //     required: true,
            //     message: '请输入零件号',
            //     trigger: 'blur',
            //   },
            // ],
          },
          {
            label: '零件号',
            prop: 'partCode',
            // type:"select",
            search: false,
            sortable: 'custom',
            width: 150,
            span: 12,
            headerAlign: 'center',
            align: 'center',
            // dicUrl:'/api/blade-desk/dsPart/getPartList',
            // props:{
            //   label: 'partCode',
            //   value:'partCode'
            // },
            // onChange:val =>{
            //   this.form.partName = val && val.item && val.item.partName
            // },
            rules: [
              {
                required: true,
                message: '请选择零件号',
                trigger: 'blur',
              },
            ],
          },
          {
            label: '产品型号',
            prop: 'productType',
            search: false,
            sortable: 'custom',
            disabled: true,
            width: 150,
            span: 12,
            headerAlign: 'center',
            align: 'center',
            rules: [
              {
                required: false,
                message: '请输入产品型号',
                trigger: 'blur',
              },
            ],
          },
          {
            label: '产品名称',
            prop: 'partName',
            search: false,
            sortable: 'custom',
            disabled: true,
            span: 12,
            width: 150,
            headerAlign: 'center',
            align: 'left',
            rules: [
              {
                required: false,
                message: '请输入产品名称',
                trigger: 'blur',
              },
            ],
          },
          {
            label: '流程卡号',
            prop: 'cardNo',
            search: true,
            sortable: 'custom',
            disabled: true,
            span: 12,
            width: 150,
            searchOrder: 20,
            headerAlign: 'center',
            rules: [
              {
                required: false,
                message: '请输入流程卡号',
                trigger: 'blur',
              },
            ],
          },
          {
            label: '批次号',
            prop: 'batchNo',
            search: true,
            sortable: 'custom',
            disabled: true,
            span: 12,
            width: 150,
            headerAlign: 'center',
            rules: [
              {
                required: false,
                message: '请输入批次号',
                trigger: 'blur',
              },
            ],
          },
          {
            label: '镀种',
            prop: 'plate',
            search: false,
            sortable: 'custom',
            disabled: true,
            width: 150,
            span: 12,
            headerAlign: 'center',
            align: 'center',
            rules: [
              {
                required: false,
                message: '请输入镀种',
                trigger: 'blur',
              },
            ],
          },
          // {
          //   label: '镀种小类',
          //   prop: 'plate1',
          //   search: false,
          //   sortable: 'custom',
          //   width: 120,
          //   display: false,
          //   span: 12,
          //   headerAlign: 'center',
          //   align: 'center',
          //   rules: [
          //     {
          //       required: true,
          //       message: '请输入镀种小类',
          //       trigger: 'blur',
          //     },
          //   ],
          // },
          {
            label: '面积(d㎡)',
            prop: 'ypArea',
            search: false,
            sortable: 'custom',
            width: 120,
            span: 12,
            disabled: true,
            headerAlign: 'center',
            align: 'center',
            rules: [
              {
                required: false,
                message: '请输入面积(d㎡)',
                trigger: 'blur',
              },
            ],
          },
          {
            label: '生产标识',
            prop: 'productIdent',
            type: 'select',
            search: false,
            sortable: 'custom',
            width: 120,
            span: 12,
            headerAlign: 'center',
            align: 'center',
            dicUrl: '/api/blade-desk/BA/ProdMark/listForSelect',
            props: {
              label: 'name',
              value: 'name',
            },
            rules: [
              {
                required: true,
                message: '请输入生产标识',
                trigger: 'blur',
              },
            ],
          },
          {
            label: '使用部门编码',
            prop: 'useDeptCode',
            search: false,
            sortable: 'custom',
            disabled: true,
            width: 120,
            span: 12,
            headerAlign: 'center',
            align: 'center',
            rules: [
              {
                required: true,
                message: '请输入使用部门',
                trigger: 'blur',
              },
            ],
          },
          {
            label: '使用部门名称',
            prop: 'useDept',
            search: false,
            sortable: 'custom',
            disabled: true,
            width: 120,
            span: 12,
            headerAlign: 'center',
            align: 'center',
            rules: [
              {
                required: true,
                message: '请输入使用部门',
                trigger: 'blur',
              },
            ],
          },
          {
            label: '需求数量',
            prop: 'ypQty',
            search: false,
            sortable: 'custom',
            width: 120,
            span: 12,
            headerAlign: 'center',
            align: 'center',
            rules: [
              {
                required: true,
                message: '请输入需求数量',
                trigger: 'blur',
              },
            ],
          },

          {
            label: '需求交期',
            prop: 'demandDate',
            search: false,
            sortable: 'custom',
            width: 180,
            span: 12,
            headerAlign: 'center',
            align: 'center',
            type: 'datetime', // 改成 datetime
            valueFormat: 'YYYY-MM-DD HH:mm:ss', // 输出格式
            rules: [
              {
                required: true,
                message: '请输入需求交期',
                trigger: 'blur',
              },
            ],
          },
          {
            label: '计划部门编码',
            prop: 'planDeptCode',
            search: false,
            sortable: 'custom',
            width: 120,
            span: 12,
            headerAlign: 'center',
            align: 'center',
            rules: [
              {
                required: true,
                message: '请输入计划员',
                trigger: 'blur',
              },
            ],
          },
          {
            label: '计划员',
            prop: 'planUser',
            search: false,
            sortable: 'custom',
            width: 120,
            span: 12,
            headerAlign: 'center',
            align: 'center',
            rules: [
              {
                required: true,
                message: '请输入计划员',
                trigger: 'blur',
              },
            ],
          },
          {
            label: '计划下达时间',
            prop: 'releaseDate',
            search: false,
            sortable: 'custom',
            searchLabelWidth: 100,
            width: 180,
            span: 12,
            type: 'datetime', // 改成 datetime
            valueFormat: 'YYYY-MM-DD HH:mm:ss', // 输出格式
            headerAlign: 'center',
            align: 'center',
            rules: [
              {
                required: true,
                message: '请输入计划下达时间',
                trigger: 'blur',
              },
            ],
          },
          {
            label: '订单状态',
            prop: 'status',
            search: false,
            sortable: 'custom',
            span: 12,
            display: false,
            type: 'select',
            width: '140',
            headerAlign: 'center',
            align: 'center',
            dicData: [
              {
                value: 10000,
                label: '已同步',
              },
              {
                value: 10001,
                label: '订单异常',
              },
              {
                value: 10002,
                label: '未下达',
              },
              {
                value: 10003,
                label: '待排产',
              },
              {
                value: 10004,
                label: '待生产',
              },
              {
                value: 10005,
                label: '加工中',
              },
              {
                value: 10006,
                label: '排产异常',
              },
              {
                value: 10015,
                label: '已完工',
              },
              {
                value: 10021,
                label: '已关闭',
              },
            ],
          },
          // receiveStatus
          {
            label: '接收状态',
            prop: 'receiveStatus',
            search: false,
            sortable: 'custom',
            span: 24,
            width: 100,
            type: 'select',
            dicData: [
              {
                value: '11000',
                label: '未接收',
              },
              {
                value: '11001',
                label: '已接收',
              },
            ],
          },
          {
            label: '接收人',
            prop: 'receiveUserName',
            search: false,
            sortable: 'custom',
            span: 24,
            width: 100,
          },
          {
            label: '接收时间',
            prop: 'receiveTime',
            search: false,
            sortable: 'custom',
            span: 24,
            width: 150,
          },
          {
            label: '创建时间',
            prop: 'createTime',
            width: '140',
            sortable: 'custom',
          },
          {
            label: '备注',
            prop: 'memo',
            search: false,
            sortable: 'custom',
            span: 24,
            type: 'textarea',
            width: 150,
            headerAlign: 'center',
            align: 'left',
          },
        ],
      },

      data: [],
      partLoading: false,
    };
  },

  methods: {
    sortChange({ prop, order }) {
      if (!prop) {
        // 如果取消排序，清空排序参数
        this.query.orderByField = undefined;
        this.query.asc = undefined;
      } else {
        const orderByField = prop.replace(/([a-z])([A-Z0-9])/g, '$1_$2').toUpperCase();

        this.query.orderByField = orderByField;
        this.query.asc = order === 'ascending' ? true : false;
      }
      // // 重新加载数据
      this.onLoad(this.page, this.query);
    },
    async editData(row) {
      // row.yieldType = row.yieldType
      this.editForm = JSON.parse(JSON.stringify(row));
      const partRes = await getPartList({
        current: 1,
        size: 50,
      });
      this.partCodeList = partRes.data.data.records;
      let tmp = this.partCodeList.find(item => item.partCode == row.partCode);
      if (!tmp) {
        const partRes = await getPartList({
          current: 1,
          size: 50,
          partCode: row.partCode,
        });
        this.partCodeList = [...this.partCodeList, ...partRes.data.data.records];
      }
      const productRes = await getProductionIdentificationList();
      this.productIdentList = productRes.data.data;
      this.isEdit = true;
    },
    queryCode(query) {
      this.partLoading = true;
      if (query) {
        getPartList({
          current: 1,
          size: 50,
          partCode: val,
        }).then(res => {
          this.partCodeList = res.data.data.records;
          this.partLoading = false;
        });
      } else {
        getPartList({
          current: 1,
          size: 50,
        }).then(res => {
          this.partCodeList = res.data.data.records;
          let tmp = this.partCodeList.find(item => item.partCode == this.editForm.partCode);
          if (!tmp) {
            getPartList({
              current: 1,
              size: 50,
              partCode: this.editForm.partCode,
            }).then(res => {
              this.partCodeList = [...this.partCodeList, ...res.data.data.records];
              this.partLoading = false;
            });
          } else {
            this.partLoading = false;
          }
        });
      }
    },
    partCodeChange(val, value, item) {
      this.editForm.partName = item.partName
    },
    submitEdit() {
      this.$refs.form.validate(valid => {
        if (valid) {
          // this.editData1(this.editForm)
          updateData(this.editForm).then(res => {
            if (res.data.code == 200) {
              this.$message.success('修改成功');
              this.onLoad();
              this.isEdit = false;
            }
          });
        }
      });
    },
    editData1(row) {
      updateData(row).then(res => {
        if (res.data.code == 200) {
          this.$message.success('修改成功');
          this.onLoad();
        }
      });
    },
    // 关闭订单
    claseOrder() {
      // 检查是否选择了数据
      if (this.selectionList.length === 0) {
        this.$message.error('请选择至少一条数据');
        return;
      }

      let tmp = this.selectionList.filter(item => item.status === 10015 || item.status === 10021);
      if (tmp.length > 0) {
        this.$message.error('请勿选择状态为【已完工】或【已关闭】的数据');
        return;
      }

      this.$confirm('确定将选择数据批量关闭?', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning',
      })
        .then(() => {
          const ids = this.selectionList.map(item => item.id).join(',');
          closeBatchs({ ...{ ids } }).then(res => {
            if (res.data.code === 200) {
              this.$message.success('关闭成功');
              this.$refs.crud.toggleSelection();
              this.onLoad(this.page);
            }
          });
        })
        .catch(() => {
          // this.onLoad(this.page);
          // this.$message({
          //     type: 'success',
          //     message: '操作成功!',
          // });
        });
    },
    searchReset() {
      this.query = {};
      this.onLoad();
    },
    searchChange(params, done) {
      this.query = params;
      this.page.currentPage = 1;
      this.onLoad();
      done();
    },
    selectionChange(list) {
      this.selectionList = list;
    },
    currentChange(currentPage) {
      this.page.currentPage = currentPage;
    },
    sizeChange(pageSize) {
      this.page.pageSize = pageSize;
    },
    refreshChange() {
      this.onLoad();
    },

    onLoad() {
      this.loading = true;
      this.query.partCode = this.query.partCode1;
      if (this.query.partCode1) {
        delete this.query.partCode1;
      }
      getList({
        current: this.page.currentPage,
        size: this.page.pageSize,
        validationResult: '16002',
        yieldType: '12001',
        ...this.query,
      }).then(res => {
        if (res.data.code) {
          this.data = res.data.data.records;
          this.page.total = res.data.data.total;
          this.loading = false;
        }
      });
      // try {
      //   const res = await getList({
      //     current:this.page.currentPage,
      //     size:this.page.pageSize,
      //     validationResult: '16002',
      //     ...this.query,
      //   });
      //   // if (res.data.code) {
      //     this.data = res.data.data.records;
      //     this.page.total = res.data.data.total;
      //     this.selectionClear();
      //     this.loading = false;
      //   // }
      // } catch (err) {
      //   console.log(err);
      // }
    },
    // rowUpdate( row, index, done, loading) {
    //   updateData(row).then(res =>{
    //     if(res.data.code == 200){
    //       this.$message.success('修改成功')
    //       this.onLoad()
    //       done()
    //     }
    //   })
    // },
  },
  mounted() {
    // this.option.column = orderCol['exceptionOrder']
  },
};
</script>
<style scoped>
:deep(.el-dialog) {
  max-height: 90vh;
  margin-top: 5vh;
}
</style>
