Smart_platform_ui/src/views/approveDataH/index.vue

<template>
  <basic-container>
    <avue-crud :option="option" :data="dataList" ref="crud" v-model="form" :page.sync="page" :search.sync="search"
      :table-loading="loading" :cell-style="cellStyle" @search-change="searchChange" @search-reset="searchReset"
      @selection-change="selectionChange" @current-change="currentChange" @size-change="sizeChange"
      @refresh-change="refreshChange" @on-load="onLoad">
      <template slot="corpIdSearch">
        <!--        <select-component v-model="search.corpId" :configuration="configuration"></select-component>-->
        <el-select v-model="search.corpId" clearable placeholder="请选择">
          <el-option v-for="item in corpsList" :key="item.id" :label="item.cname" :value="item.id">
          </el-option>
        </el-select>
      </template>
      <template slot-scope="scope" slot="checkType">
        <span v-if="scope.row.checkType == 'HYCK-FFSQ'">付费申请</span>
        <span v-if="scope.row.checkType == 'HYCK-FPSQ'">发票申请</span>
        <span v-else-if="scope.row.checkType == 'HYCK-DJ'">海运出口</span>
        <span v-else-if="scope.row.checkType == 'HYCK-FY'">海运出口费用</span>
        <span v-else-if="scope.row.checkType == 'HYJK-DJ'">海运进口</span>
        <span v-else-if="scope.row.checkType == 'HYJK-FY'">海运进口费用</span>
        <span v-else-if="scope.row.checkType == 'sea-approve'">海运出口AMEND</span>
        <span v-else-if="scope.row.checkType == 'sia-approve'">海运进口AMEND</span>
        <span v-else-if="scope.row.checkType == 'aea-approve'">空运出口AMEND</span>
        <span v-else-if="scope.row.checkType == 'aia-approve'">空运进口AMEND</span>
        <span v-else-if="scope.row.checkType == 'KYCK-DJ'">空运出口</span>
        <span v-else-if="scope.row.checkType == 'KYJK-DJ'">空运进口</span>
        <span v-else-if="scope.row.checkType == 'BGSE'">海运出口报关</span>
        <span v-else-if="scope.row.checkType == 'BGSI'">海运进口报关</span>
        <span v-else-if="scope.row.checkType == 'BGAE'">空运出口报关</span>
        <span v-else-if="scope.row.checkType == 'BGAI'">空运进口报关</span>
        <span v-else-if="scope.row.checkType == 'FFSQ-SK'">贸易代理货款付费申请</span>
        <span v-else-if="scope.row.checkType == 'MYDL'">贸易代理单据审核</span>
        <span v-else-if="scope.row.checkType == 'YSQR-C'">贸易代理货款付费确认</span>
        <span v-else-if="scope.row.checkType == 'YSQR-D'">贸易代理货款收费确认</span>
      </template>
      <template slot-scope="scope" slot="billNo">
        <span style="color: #1e9fff;cursor: pointer;" @click="billNoDetails(scope.row)">{{ scope.row.billNo }}</span>
      </template>
      <!-- <template slot="menuLeft">
        <el-button size="small" type="success" :disabled="selectionList.length == 0" @click.stop="batchCheck">批量审批
        </el-button>
      </template> -->
      <template slot-scope="scope" slot="menu">
        <!--        <el-button type="text" size="small" :disabled="scope.row.operate" @click.stop="jumpPage(scope.row)">查看-->
        <!--        </el-button>-->
        <el-button type="text" size="small" :disabled="scope.row.operate" @click.stop="jumpPage(scope.row)">查看
        </el-button>
        <el-button type="text" size="small" v-if="scope.row.checkType == 'HYCK-DJ'"
          :disabled="scope.row.auditStatus != 'S'" @click.stop="printWindowfun(scope.row, 'HYCK-DJ')">审批
        </el-button>
        <el-button type="text" size="small" v-else-if="scope.row.checkType == 'HYJK-DJ'"
          :disabled="scope.row.auditStatus != 'S'" @click.stop="printWindowfun(scope.row, 'HYJK-DJ')">审批
        </el-button>
        <el-button type="text" size="small" v-else-if="scope.row.checkType == 'KYCK-DJ'"
          :disabled="scope.row.auditStatus != 'S'" @click.stop="printWindowfun(scope.row, 'KYCK-DJ')">审批
        </el-button>
        <el-button type="text" size="small" v-else-if="scope.row.checkType == 'KYJK-DJ'"
          :disabled="scope.row.auditStatus != 'S'" @click.stop="printWindowfun(scope.row, 'KYJK-DJ')">审批
        </el-button>
        <el-button type="text" size="small" v-else-if="scope.row.checkType == 'HYCK-FFSQ'"
          :disabled="scope.row.auditStatus != 'S'" @click.stop="printWindowfun(scope.row, 'HYCK-FFSQ')">审批
        </el-button>
        <el-button type="text" size="small" v-else-if="scope.row.checkType == 'sea-approve'"
          :disabled="scope.row.auditStatus != 'S'" @click.stop="printWindowfun(scope.row, 'sea-approve')">审批
        </el-button>
        <el-button type="text" size="small" v-else-if="scope.row.checkType == 'sia-approve'"
          :disabled="scope.row.auditStatus != 'S'" @click.stop="printWindowfun(scope.row, 'sia-approve')">审批
        </el-button>
        <el-button type="text" size="small" v-else-if="scope.row.checkType == 'aea-approve'"
          :disabled="scope.row.auditStatus != 'S'" @click.stop="printWindowfun(scope.row, 'aea-approve')">审批
        </el-button>
        <el-button type="text" size="small" v-else-if="scope.row.checkType == 'aia-approve'"
          :disabled="scope.row.auditStatus != 'S'" @click.stop="printWindowfun(scope.row, 'aia-approve')">审批
        </el-button>
        <el-button type="text" size="small" v-else :disabled="scope.row.auditStatus != 'S'"
          @click.stop="openCheck(scope.row)">审批
        </el-button>
        <el-button type="text" size="small" @click.stop="openCheckSchedule(scope.row)">审批流程
        </el-button>
      </template>
    </avue-crud>
    <el-dialog append-to-body title="审批进度" class="el-dialogDeep" :visible.sync="checkScheduleDialog" width="40%"
      :close-on-click-modal="false" :destroy-on-close="true" :close-on-press-escape="false" v-dialog-drag>
      <check-schedule :checkId="checkId" :batchNo="batchNo" @choceScheduleFun="choceScheduleFun">
      </check-schedule>
    </el-dialog>
    <!--单个审批-->
    <el-dialog append-to-body title="审批" class="el-dialogDeep" :visible.sync="checkDialog" width="50%"
      :close-on-click-modal="false" :destroy-on-close="true" :close-on-press-escape="false" v-dialog-drag>
      <check :checkData="checkData" :checkDetail="true" :idList="idList" @operationType="operationTypeFFSQ"
        @choceCheckFun="choceCheckFFSQ">
      </check>
    </el-dialog>
    <!--报表+审批-->
    <reportContainerlos style="width: 100%; height: 100vh" ref="reportContainer">
      <check :checkData="checkData" :checkDetail="true" :idList="idList" @operationType="operationType"
        @choceCheckFun="choceCheckFun">
      </check>
    </reportContainerlos>
    <!--<el-dialog-->
    <!--    title="打印"-->
    <!--    :visible.sync="selectPrintingDialog"-->
    <!--    append-to-body-->
    <!--    width="70%"-->
    <!--    :before-close="handleClose">-->
    <!--    <div>-->
    <!--        <reportformsList ref="reportformsList" @reportRadio="reportRadio"></reportformsList>-->
    <!--    </div>-->
    <!--    <span slot="footer" class="dialog-footer">-->
    <!--        <el-button size="small" @click="selectPrintingDialog = false;">取 消</el-button>-->
    <!--    </span>-->
    <!--</el-dialog>-->

  </basic-container>
</template>

<script>
import option from "./configuration/mainList.json";
import option2 from "./configuration/mainList2.json";
import option3 from "./configuration/mainList3.json";
import option4 from "./configuration/mainList4.json";
import { getList, approvePass, financingExcess } from "@/api/approveDataH/main";
import checkSchedule from "@/components/checkH/checkSchedule";
import check from "./check";
import { getUserInfo } from "@/api/system/user";
import { gainUser } from "@/api/basicData/customerInquiry";
import { corpsDescListAll } from "../../api/tirePartsMall/salesManagement/saleOrder";
import { isProcurement } from "@/api/basicData/configuration";
import reportContainerlos from "@/views/iosBasicData/report-container/report-container-los.vue"
import { finstlbillsDetail } from "../../api/iosBasicData/finstlbills";
import { reportsGetReportData } from "@/api/iosBasicData/reports";
import reportformsList from "@/views/iosBasicData/SeafreightExportF/bills/assembly/reportformsList.vue";
import { getList as getreportsList } from "@/api/iosBasicData/reports";
import { selectListLos } from "@/api/approval/processConfig";
let previousRouterName = "";
let checkRefresh = "";
export default {
  components: {
    reportformsList,
    check,
    checkSchedule,
    reportContainerlos
  },
  data() {
    return {
      selectPrintingDialog: false, // 打印弹窗
      reportsData: {}, // 当前要审核数据
      reportlist: [], // 报表数据
      corpsList: [],
      loading: false,
      form: {},
      search: {},
      show: true,
      checkDialog: false,
      checkId: "",
      batchNo: "",
      checkScheduleDialog: false,
      detailData: {},
      option: {},
      parentId: 0,
      checkData: {},
      dataList: [],
      idList: [],
      selectionList: [],
      page: {
        pageSize: 10,
        pagerCount: 5,
        total: 0
      },
      query: {},
      configuration: {
        multipleChoices: false,
        multiple: false,
        disabled: false,
        searchShow: true,
        collapseTags: false,
        clearable: true,
        placeholder: "请点击右边按钮选择",
        dicData: []
      }
    };
  },
  created() {
    getUserInfo().then(res => {
      if (res.data.data.billType == 1) {
        this.option = option2;
      } else {
        if (this.$store.getters.userInfo.tenant_id === "681169") {
          this.option = option3;
        } else if (this.$store.getters.userInfo.tenant_id === "673511") {
          this.option = option4;
        } else if (this.$store.getters.userInfo.tenant_id === "064132") {
          this.option = option4;
        } else {
          this.option = option;
          isProcurement({ "param": "business" }).then(res => {
            this.business = res.data.data
            if (res.data.data == 1) {
              this.option.column.forEach(item => {
                if (item.prop == 'customizeOne' || item.prop == 'customizeTwo'|| item.prop == 'customizeThree'|| item.prop == 'customizeFour'|| item.prop == 'customizeFive'|| item.prop == 'customizeSix') {
                  item.hide = false
                  item.showColumn = true
                }
              })
            }
          })
        }
      }
      this.getWorkDicts("auditStatus").then(res => {
        this.findObject(this.option.column, "auditStatus").dicData =
          res.data.data;
      });
      gainUser().then(res => {
        this.findObject(this.option.column, "sendUserId").dicData =
          res.data.data;
      });
      this.getWorkDicts("tire_audit").then(res => {
        this.findObject(this.option.column, "processType").dicData =
          res.data.data;
      });
      selectListLos('业务员').then(res => {
        this.findObject(this.option.column, "srcCnName").dicData =
          res.data.data;
      });
    });
    // 供应商
    // corpsDescListAll({corpType: "GYS"}).then(res => {
    //   this.corpsList = res.data.data
    // })
  },
  mounted() {
    // option.height = window.innerHeight - 200 ;
  },
  activated() {
    if (this.$route.query.check === "refresh") {
      this.onLoad(this.page, this.search);
    }
  },
  methods: {
    // 点击审核弹出打印表格
    printWindowfun(row, type) {
      // 当时选择的数据
      this.reportsData = row
      this.checkData = row
      let obj = {}
      if (type == 'HYCK-DJ') {
        obj = {
          businessType: 'HYCK',
          classifyCode: '费用',
          groupCode: '销售报告'
        }
      } else if (type == 'HYJK-DJ') {
        obj = {
          businessType: 'HYJK',
          classifyCode: '费用',
          groupCode: '销售报告'
        }
      } else if (type == 'KYCK-DJ') {
        obj = {
          businessType: 'KYCK',
          classifyCode: '费用',
          groupCode: '销售报告'
        }
      } else if (type == 'KYJK-DJ') {
        obj = {
          businessType: 'KYJK',
          classifyCode: '费用',
          groupCode: '销售报告'
        }
      } else if (type == 'HYCK-FFSQ') {
        obj = {
          businessType: 'FFSQ',
          classifyCode: '付费申请',
          groupCode: '付费申请'
        }
      } else if (type == 'sea-approve') {
        obj = {
          businessType: 'AMEND',
          classifyCode: 'AMENDSE',
          groupCode: 'SE'
        }
      } else if (type == 'sia-approve') {
        obj = {
          businessType: 'AMEND',
          classifyCode: 'AMENDSI',
          groupCode: 'SI'
        }
      } else if (type == 'aea-approve') {
        obj = {
          businessType: 'AMEND',
          classifyCode: 'AMENDAE',
          groupCode: 'AE'
        }
      } else if (type == 'aia-approve') {
        obj = {
          businessType: 'AMEND',
          classifyCode: 'AMENDAI',
          groupCode: 'AI'
        }
      } else { }
      getreportsList(1, 10, obj).then(res => {
        this.reportRadio(res.data.data.records[0])
      })
      // this.selectPrintingDialog = true
      // let page = {
      //     pageSize: 10,
      //     currentPage: 1,
      //     total: 0
      // }
      // this.$nextTick(()=>{
      //     this.$refs.reportformsList.onLoad(page,{
      //         businessType:'HYCK',
      //         classifyCode:'费用',
      //         groupCode:'销售报告'
      //     })
      // })
    },
    // 获取报表数据
    reportRadio(val) {
      console.log(val, 240)
      reportsGetReportData({
        billId: this.reportsData.billId,
        reportCode: val.classifyCode,
        groupCode: val.groupCode,
        type: val.businessType
      }).then(res => {
        // 关闭弹窗
        this.selectPrintingDialog = false
        this.handleReportPreview(val.url, res.data.data.data)
      })
    },
    // 关闭弹窗
    handleClose(done) {
      done()
    },
    // 预览报表
    handleReportPreview(url, data) {
      this.reportlist = data // 存一下数据 打印的时候需要传

      Stimulsoft.Base.StiLicense.key = '6vJhGtLLLz2GNviWmUTrhSqnOItdDwjBylQzQcAOiHn0s4gy0Fr5YoUZ9V00Y0igCSFQzwEqYBh/N77k4f0fWXTHW5rqeBNLkaurJDenJ9o97TyqHs9HfvINK18Uwzsc/bG01Rq+x3H3Rf+g7AY92gvWmp7VA2Uxa30Q97f61siWz2dE5kdBVcCnSFzC6awE74JzDcJMj8OuxplqB1CYcpoPcOjKy1PiATlC3UsBaLEXsok1xxtRMQ283r282tkh8XQitsxtTczAJBxijuJNfziYhci2jResWXK51ygOOEbVAxmpflujkJ8oEVHkOA/CjX6bGx05pNZ6oSIu9H8deF94MyqIwcdeirCe60GbIQByQtLimfxbIZnO35X3fs/94av0ODfELqrQEpLrpU6FNeHttvlMc5UVrT4K+8lPbqR8Hq0PFWmFrbVIYSi7tAVFMMe2D1C59NWyLu3AkrD3No7YhLVh7LV0Tttr/8FrcZ8xirBPcMZCIGrRIesrHxOsZH2V8t/t0GXCnLLAWX+TNvdNXkB8cF2y9ZXf1enI064yE5dwMs2fQ0yOUG/xornE'
      // Stimulsoft.Base.StiLicense.Key = '6vJhGtLLLz2GNviWmUTrhSqnOItdDwjBylQzQcAOiHkcgIvwL0jnpsDqRpWg5FI5kt2G7A0tYIcUygBh1sPs7plofUOqPB1a4HBIXJB621mau2oiAIj+ysU7gKUXfjn/D5BocmduNB+ZMiDGPxFrAp3PoD0nYNkkWh8r7gBZ1v/JZSXGE3bQDrCQCNSy6mgby+iFAMV8/PuZ1z77U+Xz3fkpbm6MYQXYp3cQooLGLUti7k1TFWrnawT0iEEDJ2iRcU9wLqn2g9UiWesEZtKwI/UmEI2T7nv5NbgV+CHguu6QU4WWzFpIgW+3LUnKCT/vCDY+ymzgycw9A9+HFSzARiPzgOaAuQYrFDpzhXV+ZeX31AxWlnzjDWqpfluygSNPtGul5gyNt2CEoJD1Yom0VN9fvRonYsMsimkFFx2AwyVpPcs+JfVBtpPbTcZscnzUdmiIvxv8Gcin6sNSibM6in/uUKFt3bVgW/XeMYa7MLGF53kvBSwi78poUDigA2n12SmghLR0AHxyEDIgZGOTbNI33GWu7ZsPBeUdGu55R8w='
      Stimulsoft.Base.Localization.StiLocalization.addLocalizationFile('/reports/stimulsoft/Localization/zh-CHS.xml', true, 'zh-CHS')
      Stimulsoft.Base.Localization.StiLocalization.setLocalizationFile('/reports/stimulsoft/Localization/zh-CHS.xml')

      // 工具栏
      var options = new Stimulsoft.Viewer.StiViewerOptions()
      options.height = '100%'
      options.appearance.scrollbarsMode = true
      options.toolbar.showDesignButton = false
      options.toolbar.showAboutButton = false
      options.toolbar.showResourcesButton = false
      options.toolbar.showFullScreenButton = false
      options.toolbar.showOpenButton = false
      options.appearance.showTooltips = false
      options.appearance.showDialogsHelp = false
      options.exports.showExportToDocument = false
      options.toolbar.showParametersButton = true
      options.appearance.bookmarksPrint = true
      options.toolbar.printDestination = Stimulsoft.Viewer.StiPrintDestination.Direct
      options.appearance.htmlRenderMode = Stimulsoft.Report.Export.StiHtmlExportMode.Table
      let viewer = new Stimulsoft.Viewer.StiViewer(options, 'StiViewer', false)

      // 报表
      console.log("创建一个报表实例");
      let report = new window.Stimulsoft.Report.StiReport();

      // 加载文件
      console.log("从url加载报表");
      // report.loadFile("/reports/stimulsoft/demos/SimpleList.mrt");
      // report.load(row.url)
      report.load(url)

      // 加载数据
      var dataSet = new Stimulsoft.System.Data.DataSet(
        'reportData'
      )
      dataSet.readJson(data)
      report.regData('reportData', 'reportData', dataSet)
      // 从模版和数据加载报表
      // loadReport(report, '', {})

      viewer.report = report;


      this.$refs.reportContainer.showContainer(
        () => {
          setTimeout(() => {
            viewer.renderHtml('reportContainer')
            this.createViewerButtons(viewer)
          }, 50)
        },
        () => {
        },
      )
      console.log(report, 301)
      // var printButton = report.renderedPages[0].components.find(function(c) {
      //     return c.name === 'printButton';
      // });
      // // 为按钮控件添加“PrintReport”事件
      // printButton.events.add('PrintReport', handlePrintReport);
      console.log("加载成功完成!");
    },
    // 报表的按钮
    createViewerButtons(viewer) {
      viewer.jsObject.collections.images['myClose.png'] =
        'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAABmJLR0QA/wD/AP+gvaeTAAAA0ElEQVQ4ja3TO05CQRQG4A8iOwAbtYWETndAaecK7NwCKmETtJZsSBNLobEz8ZFIJQ0UnOGSm3DnYviTybzO/895DQXGWGCVGQuMEqkRcwcfuMOLalziCaf4TIe9UG9nyMJmFRzNGoRK1BU4xxx9G7cfwostciGk+x8MqgySwDXe4tU53hVV+MNtTmAoX84JGv9NYgrHyR6DV8wUSW7hItZLm36ZVoVQxsFJLOMsPOrH/h7dQwR2cdxOTEn8DtUbPGc4V2H7Vb4Yqfedf/GYSGt8VUmxgyfuBAAAAABJRU5ErkJggg=='
      const closeBtn = viewer.jsObject.SmallButton(
        'closeBtn',
        '关闭',
        'myClose.png'
      )

      const toolbarTable = viewer.jsObject.controls.toolbar.firstChild.firstChild
      const buttonsTable = toolbarTable.rows[0].lastChild.lastChild
      const userButtonCell = buttonsTable.rows[0].insertCell(0)
      userButtonCell.className = 'stiJsViewerClearAllStyles'
      userButtonCell.appendChild(closeBtn)

      let that = this
      closeBtn.action = function () {
        console.log(that.$refs.ReportContainer)
        if (that.$refs.reportContainer)
          that.$refs.reportContainer.hideContainer()
      }
    },



    batchCheck() {
      for (let i = 0; i < this.selectionList.length; i++) {
        if (this.selectionList[i].auditStatus != "S") {
          return this.$message.error("审核状态必须都为待审核状态!");
        } else {
          this.idList.push(this.selectionList[i].id);
        }
      }
      //打开cheack
      this.checkDialog = true;
    },
    operationType() {
      // this.checkDialog = false;
      this.$refs.reportContainer.visible = false
      this.refreshChange();
      this.idList = [];
    },
    operationTypeFFSQ() {
      this.checkDialog = false;
      this.refreshChange();
      this.idList = [];
    },
    // 业务编号跳转详情
    billNoDetails(row) {
      this.jumpPage(row)
    },
    //跳转页面
    jumpPage(row) {
      console.log('row', row);
      if (row.url) {
        if (row.pageStatus && eval("(" + row.pageStatus + ")")) {
          this.$alert(
            "" +
            row.pageLabel +
            "页面已存在,请关闭" +
            row.pageLabel +
            "页面再进行操作",
            "温馨提示",
            {
              confirmButtonText: "确定",
              type: "warning",
              callback: action => { }
            }
          );
        } else {
          this.$router.$avueRouter.closeTag(row.url);
          this.$router.push({
            path: row.url,
            query: {
              billId: row.billId
            }
          });
        }
      } else {
        this.$message.warning('当前数据无法跳转')
      }
    },
    //审批通过
    pass(row, operate) {
      row.operate = operate;
      this.loading = true;
      approvePass(row)
        .then(res => {
          this.$message.success("操作成功!");
          this.refreshChange();
        })
        .finally(() => {
          this.loading = false;
        });
    },
    openCheck(row) {
      if (row.checkType == 'CK') {
        financingExcess({ id: row.corpId }).then(res => {
          if (res.data.data == '操作成功') {
            this.batch = false; //单条操作
            this.checkDialog = true;
            this.checkData = row;
          } else {
            this.$confirm(res.data.data, {
              confirmButtonText: "确定",
              cancelButtonText: "取消",
              type: "warning"
            }).then(() => {
              this.batch = false; //单条操作
              this.checkDialog = true;
              this.checkData = row;
            })
          }
        })
      } else {
        this.batch = false; //单条操作
        this.checkDialog = true;
        this.checkData = row;
      }
    },
    choceCheckFun() {
      // this.checkDialog = false;
      this.$refs.reportContainer.visible = false
      this.refreshChange();
    },
    choceCheckFFSQ() {
      this.checkDialog = false;
      this.refreshChange();
    },
    openCheckSchedule(row) {
      this.checkId = row.srcBillId;
      this.batchNo = row.batchNo;
      this.checkScheduleDialog = true;
    },
    //关闭审批流程页面
    choceScheduleFun() {
      this.checkScheduleDialog = false;
    },
    //新单打开
    addReceipt(row) { },
    //编辑打开
    editOpen(row, status) {
      this.detailData = {
        id: row.id,
        status: status
      };
      this.show = false;
    },
    //点击搜索按钮触发
    searchChange(params, done) {
      this.query = params;
      this.page.currentPage = 1;
      this.onLoad(this.page, params);
      done();
    },
    searchReset() {
      console.log("1");
    },
    selectionChange(list) {
      this.idList = []
      this.selectionList = list;
    },
    currentChange(val) {
      this.page.currentPage = val;
    },
    sizeChange() {
      console.log("1");
    },
    refreshChange(params) {
      this.onLoad(this.page, params);
    },
    paramsAdjustment(params) {
      params = Object.assign({}, this.search);
      if (!params.auditStatus && params.auditStatus !== "") {
        params.auditStatus = "S";
      }
      return params;
    },
    onLoad(page, params) {
      this.loading = true;
      params = this.paramsAdjustment(params);
      if (params.sendTime) {
        params.applybegintime = params.sendTime[0]
        params.applyendtime = params.sendTime[1]
        delete params.sendTime
      }
      getList(page.currentPage, page.pageSize, params).then(res => {
        this.dataList = res.data.data.records;
        this.page.total = res.data.data.total;
      }).finally(() => {
        this.loading = false;
      });
    },
    cellStyle() {
      return "padding:0;height:40px;";
    }
  }
};
</script>

<style scoped></style>