read_opc/chuanyi_client2/src/views/run_config/index.vue

<template>
  <div class="cqcy-content" style="margin: 0; height: calc(100% - 70px)">
    <breadcrumb-view
      :breadcrumbList="breadcrumbList"
      :show-index="false"
    ></breadcrumb-view>
    <div v-if="btnType === ''" class="cy-nav-sx">
      <el-select
        v-model="searchValue"
        style="width: 180px"
        placeholder="请选择报表类型"
        @change="changeReportTypeEvent"
      >
        <el-option
          v-for="item in reportOptions"
          style="margin-left: 5px; width: 180px"
          :key="item.value"
          :label="item.label"
          :value="item.value"
        >
        </el-option>
      </el-select>
      <el-input
        placeholder="请输入报表名称"
        v-model="searchTxt"
        style="margin-left: 5px; width: 180px"
        prefix-icon="el-icon-search"
      >
      </el-input>
      <el-button style="margin-left: 5px" @click="searchReportEvent"
        >查询</el-button
      >
    </div>
    <!--    <el-button v-if="btnType === ''" type="primary" class="cy-nav-btn" icon="el-icon-circle-plus-outline"-->
    <!--               size="mini" @click="addReportEvent">新增-->
    <!--    </el-button>-->
    <!--    <el-button v-if="btnType === ''" type="success" class="cy-nav-btn" icon="el-icon-refresh"-->
    <!--               size="mini" @click="refreshReportEvent">刷新</el-button>-->
    <el-divider></el-divider>
    <div class="cy-main">
      <div class="cy-main-left" v-if="!showMainView">
        <div class="cy-list">
          <el-table
            v-if="reportDataList.length > 0"
            :data="reportDataList"
            border
            :stripe="true"
            :header-cell-style="{ background: '#E8E8E8' }"
            @sort-change="sortChange"
            style="width: 100%"
          >
            <el-table-column
              align="center"
              sortable="custom"
              label="报表名称"
              prop="reportTableName"
            >
              <template slot-scope="scope">
                <span
                  style="color: #409eff; cursor: pointer"
                  @click="
                    handleReportNodeClick(
                      scope.row,
                      scope.row.userId != uid ? 'deny' : ''
                    )
                  "
                  :title="scope.row.reportTableName"
                  >{{ scope.row.reportTableName }}</span
                >
              </template>
            </el-table-column>
            <el-table-column
              align="center"
              label="报表类型"
              prop="reportTableType"
              width="350"
            >
              <template slot-scope="scope">
                <el-tag
                  v-if="scope.row.userId != uid"
                  type="success"
                  style="margin-right: 5px"
                  >被分享</el-tag
                >
                <el-tag
                  v-if="
                    uid == scope.row.userId &&
                    scope.row.userGroupList &&
                    scope.row.userGroupList.length > 0
                  "
                  type="warning"
                  style="margin-right: 5px"
                  >已分享
                </el-tag>
                <el-tag
                  v-if="scope.row.reportTableType == 0"
                  style="margin-right: 5px"
                  >手动报表</el-tag
                >
                <el-tag
                  v-if="scope.row.reportTableType == 1"
                  style="margin-right: 5px"
                  >自动报表</el-tag
                >
                <el-tag
                  v-if="scope.row.reportTableType == 2"
                  style="margin-right: 5px"
                  >事件驱动报表</el-tag
                >
                <el-tag
                  v-if="scope.row.reportTableType == 5"
                  style="margin-right: 5px"
                  >设备报表</el-tag
                >
              </template>
            </el-table-column>
            <el-table-column
              align="center"
              label="创建时间"
              sortable
              prop="createTime"
              width="200"
            >
            </el-table-column>
            <el-table-column label="操作" align="center" width="380">
              <template slot-scope="scope">
                <el-button
                  type="text"
                  v-if="uid == scope.row.userId"
                  size="small"
                  icon="el-icon-setting"
                  @click="editReportItem(scope.row)"
                  >配置
                </el-button>
                <!--                <el-button type="text"-->
                <!--                           v-if="uid == scope.row.userId"-->
                <!--                           size="small"-->
                <!--                           icon="el-icon-edit"-->
                <!--                           @click="editReportItem(scope.row)">修改-->
                <!--                </el-button>-->
                <el-button
                  type="text"
                  v-if="
                    uid == scope.row.userId &&
                    scope.row.reportTableType == 1 &&
                    scope.row.runState == 0
                  "
                  size="small"
                  icon="el-icon-video-play"
                  @click="setReportStatus(scope.row)"
                  >启动
                </el-button>
                <el-button
                  type="text"
                  v-if="
                    uid == scope.row.userId &&
                    scope.row.reportTableType == 1 &&
                    scope.row.runState == 1
                  "
                  size="small"
                  icon="el-icon-video-pause"
                  @click="setReportStatus(scope.row)"
                  >停止
                </el-button>
                <el-button
                  type="text"
                  v-if="uid == scope.row.userId"
                  size="small"
                  icon="el-icon-printer"
                  @click="setAutoPrint(scope.row)"
                  >打印配置
                </el-button>
                <el-button
                  type="text"
                  v-if="uid == scope.row.userId"
                  size="small"
                  icon="el-icon-user"
                  @click="setUserGroupEvent(scope.row)"
                  >授权
                </el-button>
                <el-button
                  type="text"
                  v-if="uid == scope.row.userId"
                  size="small"
                  icon="el-icon-document"
                  @click="getUserGroupEvent(scope.row)"
                  >授权详情
                </el-button>
                <el-button
                  type="text"
                  v-if="uid == scope.row.userId"
                  size="small"
                  icon="el-icon-delete"
                  style="color: red"
                  @click="removeReportItem(scope.row)"
                  >删除
                </el-button>
              </template>
            </el-table-column>
          </el-table>
          <el-empty v-else description="暂无数据"></el-empty>
        </div>
        <el-pagination
          background
          @size-change="handleSizeChange"
          @current-change="handleCurrentChange"
          :current-page="reportPage"
          :page-size="reportLimit"
          layout="sizes, prev, pager, next, total"
          :total="reportTotal"
        >
        </el-pagination>
      </div>
      <div class="cy-main-right" :style="showMainView ? '' : 'display: none;'">
        <el-row v-if="btnType == 'add'" style="margin: 10px 20px">
          <el-button
            type="primary"
            size="mini"
            icon="el-icon-document"
            @click="saveReportInfo"
            >保存报表</el-button
          >
          <el-button
            type="danger"
            size="mini"
            icon="el-icon-circle-close"
            @click="cancelSaveReport"
            >取消</el-button
          >
        </el-row>
        <el-row v-if="btnType == 'show'" style="margin: 10px 20px">
          <el-button
            type="success"
            size="mini"
            icon="el-icon-document-checked"
            @click="updateReport"
            >保存</el-button
          >
          <el-button
            type="primary"
            size="mini"
            icon="el-icon-download"
            @click="downloadReport"
            >下载</el-button
          >
          <el-button
            type="warning"
            size="mini"
            icon="el-icon-printer"
            @click="printExcel"
            >打印</el-button
          >
          <el-button
            type="info"
            size="mini"
            icon="el-icon-document"
            @click="historyReport"
            >运行记录</el-button
          >
          <el-button
            type="danger"
            size="mini"
            icon="el-icon-circle-close"
            @click="cancelSaveReport"
            >关闭</el-button
          >
        </el-row>
        <el-row v-if="btnType == 'showShared'" style="margin: 10px 20px">
          <el-button
            type="primary"
            size="mini"
            icon="el-icon-download"
            @click="downloadReport"
            >下载</el-button
          >
          <el-button
            type="warning"
            size="mini"
            icon="el-icon-printer"
            @click="printExcel"
            >打印</el-button
          >
          <el-button
            v-if="chooseMyReport && chooseMyReport.reportTableType != 0"
            type="info"
            size="mini"
            icon="el-icon-document"
            @click="historyReport"
            >运行记录
          </el-button>
          <el-button
            type="danger"
            size="mini"
            icon="el-icon-circle-close"
            @click="cancelSaveReport"
            >关闭</el-button
          >
          <div
            style="float: right"
            v-if="
              this.showReportTableType == 1 ||
              this.showReportTableType == 0 ||
              this.showReportTableType == 5
            "
          >
            <label>频率：</label>
            <el-select
              style="width: 90px"
              size="mini"
              placeholder="请选择频率"
              v-model="reportInterval"
              @change="reportIntervalChange"
            >
              <el-option
                v-for="item in reportIntervalOptions"
                :key="item"
                :label="item + '秒'"
                :value="item"
              >
              </el-option>
            </el-select>
          </div>
        </el-row>
        <el-row v-if="btnType == 'showChild'" style="margin: 10px 20px">
          <el-button
            type="primary"
            size="mini"
            icon="el-icon-download"
            @click="downloadReport"
            >下载</el-button
          >
          <el-button
            type="warning"
            size="mini"
            icon="el-icon-printer"
            @click="printExcel"
            >打印</el-button
          >
          <el-button
            type="danger"
            size="mini"
            icon="el-icon-circle-close"
            @click="cancelSaveReport2"
            >关闭</el-button
          >
        </el-row>
        <div
          id="luckysheet"
          style="
            margin: 0px;
            padding: 0px;
            position: relative;
            height: calc(100% - 50px);
            width: 100%;
            left: 20px;
            top: 0px;
            bottom: 0px;
          "
        ></div>
      </div>
    </div>

    <!-- 新增报表 -->
    <el-dialog
      :title="reportDialogTitle"
      width="600px"
      top="10vh"
      center
      v-dialog-drag
      v-if="dialogReportTemplateVisible"
      :before-close="dialogClose"
      :visible.sync="dialogReportTemplateVisible"
      :close-on-click-modal="false"
      :append-to-body="true"
    >
      <el-form
        ref="reportForm"
        :model="reportForm"
        :rules="reportRules"
        label-width="80px"
      >
        <el-form-item label="报表名称" prop="reportTableName">
          <el-input
            placeholder="请输入报表名称"
            v-model="reportForm.reportTableName"
            maxlength="20"
          ></el-input>
        </el-form-item>
        <el-form-item
          label="报表类型"
          prop="reportTableType"
          v-if="!reportForm.id"
        >
          <el-radio-group
            v-model="reportForm.reportTableType"
            @input="changeReportType"
          >
            <el-radio label="0">手动报表</el-radio>
            <el-radio label="1">自动报表</el-radio>
            <el-radio label="2">事件驱动报表</el-radio>
            <el-radio label="5">设备报表</el-radio>
          </el-radio-group>
        </el-form-item>
        <el-form-item
          label="报表模板"
          prop="tableTemplateId"
          v-if="!reportForm.id"
        >
          <el-select
            v-model="reportForm.tableTemplateId"
            filterable
            placeholder="请选择报表模板"
            style="width: 100%"
          >
            <el-option
              v-for="item in reportTemplateList"
              :key="item.id"
              :label="item.templateName"
              :value="item.id"
            >
            </el-option>
          </el-select>
        </el-form-item>
        <el-form-item
          label="开始时间"
          prop="dateRange"
          v-if="reportForm.reportTableType == 1"
        >
          <el-date-picker
            v-model="reportForm.startTime"
            style="width: 100%"
            type="datetime"
            :clearable="false"
            placeholder="请选择开始时间"
            prefix-icon=""
            :picker-options="{
              format: 'yyyy-MM-dd HH:mm:ss',
            }"
            value-format="yyyy-MM-dd HH:mm:ss"
          >
          </el-date-picker>
        </el-form-item>
        <el-form-item
          label="运行时间"
          prop="cronLabel"
          v-if="reportForm.reportTableType == 1"
        >
          <el-input
            placeholder="请设置运行时间"
            v-model="reportForm.cronLabel"
            style="width: calc(100% - 105px)"
            readonly
          ></el-input>
          <el-button
            size="mini"
            @click="settingAutoReportTime"
            style="float: right; width: 100px; line-height: 20px"
          >
            设置运行时间
          </el-button>
        </el-form-item>
      </el-form>
      <span slot="footer">
        <el-button
          type="primary"
          @click="chooseReportEvent"
          style="margin-top: 20px"
          >确定</el-button
        >
        <el-button @click="dialogClose" style="margin-top: 20px"
          >取消</el-button
        >
      </span>
    </el-dialog>

    <!-- 配置打印定时任务 -->
    <el-dialog
      :title="printDialogTitle"
      width="700px"
      top="10vh"
      center
      v-dialog-drag
      v-if="dialogAutoPrintVisible"
      :before-close="dialogClose"
      :visible.sync="dialogAutoPrintVisible"
      :close-on-click-modal="false"
      :append-to-body="true"
    >
      <el-form
        ref="reportForm"
        :model="reportForm"
        :rules="reportRules"
        label-width="120px"
      >
        <el-radio-group v-model="radioByCron">
          <el-form-item label="秒">
            <el-radio :label="1">
              <span style="margin-right: 10px">每</span>
              <el-input-number
                size="mini"
                v-model="radioByCronValS"
                :min="1"
                :max="59"
                :precision="0"
              ></el-input-number>
              <span style="margin-left: 10px">秒执行一次</span>
            </el-radio>
          </el-form-item>
          <el-form-item label="分钟">
            <el-radio :label="2">
              <span style="margin-right: 10px">每</span>
              <el-input-number
                size="mini"
                v-model="radioByCronValM"
                :min="1"
                :max="59"
                :precision="0"
              ></el-input-number>
              <span style="margin-left: 10px">分钟执行一次</span>
            </el-radio>
          </el-form-item>
          <el-form-item label="小时">
            <el-radio :label="3">
              <span style="margin-right: 10px">每</span>
              <el-input-number
                size="mini"
                v-model="radioByCronValH"
                :min="1"
                :max="2"
                :precision="0"
              ></el-input-number>
              <span style="margin-left: 10px">小时执行一次</span>
            </el-radio>
          </el-form-item>
          <el-form-item label="指定时间">
            <el-radio :label="4">
              <span style="margin-right: 10px">在每天的</span>
              <el-time-picker
                v-model="radioByCronValD"
                size="mini"
                placeholder="请选择时间"
                :clearable="false"
                :editable="false"
                value-format="HH:mm:ss"
                :picker-options="{
                  format: 'HH:mm:ss',
                }"
              >
              </el-time-picker>
              <span style="margin-left: 10px">执行一次</span>
            </el-radio>
          </el-form-item>
          <el-form-item label="">
            <el-radio :label="5">
              <span style="margin-right: 10px">在每月</span>
              <el-input-number
                size="mini"
                v-model="radioByCronValMo"
                :min="1"
                :max="31"
                :precision="0"
              ></el-input-number>
              <span style="margin-right: 10px; margin-left: 10px">号的</span>
              <el-time-picker
                v-model="radioByCronValMoD"
                size="mini"
                placeholder="请选择时间"
                :clearable="false"
                :editable="false"
                value-format="HH:mm:ss"
                :picker-options="{
                  format: 'HH:mm:ss',
                }"
              >
              </el-time-picker>
              <span style="margin-left: 10px">执行一次</span>
            </el-radio>
          </el-form-item>
          <el-form-item label="打印配置选择">
            <el-select v-model="printForm.printConfigId" placeholder="请选择">
              <el-option
                v-for="item in queryPageData"
                :key="item.id"
                :label="item.jobName"
                :value="item.id"
              >
              </el-option>
            </el-select>
          </el-form-item>
        </el-radio-group>
      </el-form>
      <span slot="footer">
        <el-button
          type="primary"
          @click="chooseCronPrint"
          style="margin-top: 20px"
          >确定</el-button
        >
        <el-button
          type="warning"
          v-if="printForm.runState == 1"
          @click="stopAutoPrint"
          style="margin-top: 20px"
          >停止</el-button
        >
        <el-button
          type="warning"
          disabled
          v-if="printForm.runState != 1"
          @click="stopAutoPrint"
          style="margin-top: 20px"
          >停止</el-button
        >
        <el-button @click="dialogClose" style="margin-top: 20px"
          >取消</el-button
        >
      </span>
    </el-dialog>

    <!-- 用户组选择 -->
    <el-dialog
      title="选择用户组"
      width="840px"
      top="10vh"
      center
      v-dialog-drag
      v-if="dialogUserGroupVisible"
      :before-close="dialogClose"
      :visible.sync="dialogUserGroupVisible"
      :close-on-click-modal="false"
      :append-to-body="true"
    >
      <!--      <el-form label-width="80px">-->
      <!--        <el-form-item label="用户组">-->
      <!--          <el-select v-model="userGroupInfo" filterable clearable multiple placeholder="请选择用户组" style="width: 100%;">-->
      <!--            <el-option-->
      <!--                v-for="item in userGroupList"-->
      <!--                :key="item.id"-->
      <!--                :label="item.userGroupName"-->
      <!--                :value="item.id">-->
      <!--            </el-option>-->
      <!--          </el-select>-->
      <!--        </el-form-item>-->
      <!--      </el-form>-->
      <div class="ug-div">
        <el-transfer
          v-model="userGroupInfo"
          :titles="['用户组列表', '已选择用户组']"
          :data="userGroupList"
          :props="{
            key: 'id',
            label: 'userGroupName',
          }"
        >
        </el-transfer>
      </div>
      <span slot="footer">
        <el-button
          type="primary"
          @click="chooseUserGroupEvent"
          style="margin-top: 20px"
          >确定</el-button
        >
        <el-button @click="dialogClose" style="margin-top: 20px"
          >取消</el-button
        >
      </span>
    </el-dialog>

    <!-- 自动报表CRON定时表达式 -->
    <el-dialog
      title="配置定时任务"
      width="700px"
      top="10vh"
      center
      v-dialog-drag
      v-if="dialogAutoReportVisible"
      :before-close="dialogClose"
      :visible.sync="dialogAutoReportVisible"
      :close-on-click-modal="false"
      :append-to-body="true"
    >
      <el-form label-width="80px">
        <el-radio-group v-model="radioByCron">
          <el-form-item label="秒">
            <el-radio :label="1">
              <span style="margin-right: 10px">每</span>
              <el-input-number
                size="mini"
                v-model="radioByCronValS"
                :min="1"
                :max="59"
                :precision="0"
              ></el-input-number>
              <span style="margin-left: 10px">秒执行一次</span>
            </el-radio>
          </el-form-item>
          <el-form-item label="分钟">
            <el-radio :label="2">
              <span style="margin-right: 10px">每</span>
              <el-input-number
                size="mini"
                v-model="radioByCronValM"
                :min="1"
                :max="59"
                :precision="0"
              ></el-input-number>
              <span style="margin-left: 10px">分钟执行一次</span>
            </el-radio>
          </el-form-item>
          <el-form-item label="小时">
            <el-radio :label="3">
              <span style="margin-right: 10px">每</span>
              <el-input-number
                size="mini"
                v-model="radioByCronValH"
                :min="1"
                :max="2"
                :precision="0"
              ></el-input-number>
              <span style="margin-left: 10px">小时执行一次</span>
            </el-radio>
          </el-form-item>
          <el-form-item label="指定时间">
            <el-radio :label="4">
              <span style="margin-right: 10px">在每天的</span>
              <el-time-picker
                v-model="radioByCronValD"
                size="mini"
                placeholder="请选择时间"
                :clearable="false"
                :editable="false"
                value-format="HH:mm:ss"
                :picker-options="{
                  format: 'HH:mm:ss',
                }"
              >
              </el-time-picker>
              <span style="margin-left: 10px">执行一次</span>
            </el-radio>
          </el-form-item>
          <el-form-item label="">
            <el-radio :label="5">
              <span style="margin-right: 10px">在每月</span>
              <el-input-number
                size="mini"
                v-model="radioByCronValMo"
                :min="1"
                :max="31"
                :precision="0"
              ></el-input-number>
              <span style="margin-right: 10px; margin-left: 10px">号的</span>
              <el-time-picker
                v-model="radioByCronValMoD"
                size="mini"
                placeholder="请选择时间"
                :clearable="false"
                :editable="false"
                value-format="HH:mm:ss"
                :picker-options="{
                  format: 'HH:mm:ss',
                }"
              >
              </el-time-picker>
              <span style="margin-left: 10px">执行一次</span>
            </el-radio>
          </el-form-item>
        </el-radio-group>
        <!--        <el-form-item label="表达式">-->
        <!--          <el-input type="text" placeholder="请输入定时任务表达式" v-model="cronVal" maxlength="50"></el-input>-->
        <!--        </el-form-item>-->
        <!--        <div>-->
        <!--          <label>常用定时任务表达式例子</label>-->
        <!--          <ul>-->
        <!--            <li v-for="(item, i) in cronList" style="margin-bottom: 5px;">-->
        <!--              <span class="cron-txt" @click="cronNodeEvent(item)">{{ item.value }}</span>-->
        <!--              <span class="cron-txt-desc">{{ item.label }}</span>-->
        <!--            </li>-->
        <!--          </ul>-->
        <!--        </div>-->
      </el-form>
      <span slot="footer">
        <el-button type="primary" @click="chooseCronEvent">确定</el-button>
        <!--          <el-button @click="dialogClose">取消</el-button>-->
      </span>
    </el-dialog>

    <!-- 报表类型 -->
    <el-dialog
      title="报表类型选择"
      width="50%"
      top="10vh"
      center
      v-dialog-drag
      v-if="dialogReportTypeVisible"
      :before-close="dialogClose"
      :visible.sync="dialogReportTypeVisible"
      :close-on-click-modal="false"
      :append-to-body="true"
    >
      <div style="text-align: center">
        <el-radio v-model="reportType" label="0">手动报表</el-radio>
        <el-radio v-model="reportType" label="1">自动报表</el-radio>
        <el-radio v-model="reportType" label="2">事件驱动报表</el-radio>
        <el-radio v-model="reportType" label="5">设备报表</el-radio>
      </div>
      <span slot="footer">
        <el-button type="primary" @click="chooseReportTypeEvent"
          >确定</el-button
        >
        <el-button @click="dialogClose">取消</el-button>
      </span>
    </el-dialog>

    <!-- 报表下载类型选择 -->
    <el-dialog
      title="选择下载类型"
      width="500px"
      center
      v-dialog-drag
      v-if="dialogDownloadReportTypeVisible"
      :before-close="dialogClose"
      :visible.sync="dialogDownloadReportTypeVisible"
      :close-on-click-modal="false"
      :append-to-body="true"
    >
      <div style="text-align: center">
        <el-radio v-model="downloadType" label="1">Excel</el-radio>
        <!--        <el-radio v-model="downloadType" label="2" disabled>PDF</el-radio>-->
      </div>
      <div style="text-align: center; margin-top: 40px">
        <el-button type="primary" @click="downloadReportEvent">确定</el-button>
      </div>
    </el-dialog>

    <!-- 历史报表查看 -->
    <el-dialog
      title="运行报表记录"
      width="80%"
      top="10vh"
      center
      v-dialog-drag-and-zoom
      v-if="dialogHistoryReportVisible"
      :before-close="dialogClose"
      :visible.sync="dialogHistoryReportVisible"
      :close-on-click-modal="false"
      :append-to-body="true"
    >
      <div style="height: 60vh">
        <div style="margin-bottom: 10px; float: right">
          <el-input
            placeholder="请输入报表名称"
            v-model="searchHistoryTxt"
            style="margin-left: 5px; width: 300px"
            prefix-icon="el-icon-search"
          >
          </el-input>
          <el-button
            type="primary"
            style="margin-left: 5px"
            @click="searchHistoryReportEvent"
            >查询</el-button
          >
        </div>
        <el-table
          :data="reportHistoryData"
          border
          :stripe="true"
          :header-cell-style="{ background: '#E8E8E8' }"
          @sort-change="sortChange1"
          style="width: 100%; height: calc(100% - 100px); overflow: auto"
        >
          <el-table-column
            align="center"
            sortable="custom"
            label="报表名称"
            prop="reportTableName"
          >
            <template slot-scope="scope">
              <span
                style="color: #409eff; cursor: pointer"
                @click="handleReportNodeClick(scope.row, 'history')"
                :title="scope.row.reportTableName"
                >{{ scope.row.reportTableName }}</span
              >
            </template>
          </el-table-column>
          <!--          <el-table-column-->
          <!--              align="center"-->
          <!--              label="报表状态"-->
          <!--              prop="isAutoReport"-->
          <!--              width="180">-->
          <!--            <template slot-scope="scope">-->
          <!--              <el-tag v-if="scope.row.userId != uid" type="success" style="margin-right: 5px;">被分享</el-tag>-->
          <!--              <el-tag v-if="uid == scope.row.userId && scope.row.userGroupList && scope.row.userGroupList.length > 0"-->
          <!--                      type="warning" style="margin-right: 5px;">已分享</el-tag>-->
          <!--            </template>-->
          <!--          </el-table-column>-->
          <!--          <el-table-column-->
          <!--              align="center"-->
          <!--              label="当前版本"-->
          <!--              sortable="custom"-->
          <!--              prop="version"-->
          <!--              width="120">-->
          <!--          </el-table-column>-->
          <el-table-column
            align="center"
            label="运行时间"
            sortable
            prop="createTime"
            width="200"
          >
          </el-table-column>
          <el-table-column label="操作" align="center" width="300">
            <template slot-scope="scope">
              <el-button
                type="text"
                v-if="uid == scope.row.userId"
                size="small"
                icon="el-icon-delete"
                style="color: red"
                @click="removeReportItem(scope.row, 'record')"
                >删除
              </el-button>
            </template>
          </el-table-column>
        </el-table>
        <el-pagination
          style="margin-top: 20px"
          background
          layout="sizes, prev, pager, next, total"
          :current-page="reportHistoryPage"
          :page-size="reportHistoryLimit"
          @size-change="sizeHistoryChangeEvent"
          @current-change="currentHistoryChangeEvent"
          :total="reportHistoryTotal"
        >
        </el-pagination>
      </div>
    </el-dialog>

    <!-- 用户组用户人员查看 -->
    <el-dialog
      title="授权详情"
      width="600px"
      top="10vh"
      center
      v-dialog-drag
      v-if="dialogGroupUserVisible"
      :before-close="dialogGroupUserClose"
      :visible.sync="dialogGroupUserVisible"
      :close-on-click-modal="false"
      :append-to-body="true"
    >
      <div style="height: 60vh">
        <el-table
          :data="groupUserData"
          border
          :stripe="true"
          :header-cell-style="{ background: '#E8E8E8' }"
          style="width: 100%; height: calc(100% - 50px); overflow: auto"
        >
          <el-table-column
            align="center"
            label="用户组名称"
            prop="userGroupName"
          >
          </el-table-column>
          <el-table-column align="center" label="姓名" prop="userName">
          </el-table-column>
        </el-table>
      </div>
    </el-dialog>

    <div
      id="print-area"
      style="
        display: none;
        position: absolute;
        z-index: 0;
        top: 0;
        width: 100%;
        height: 100vh;
        overflow: hidden;
      "
    >
      <div id="print-html" ref="printPayFeeNew"></div>
    </div>
  </div>
</template>

<script>
import BreadcrumbView from "@/components/BreadcrumbView";
import {
  customCompare,
  getLuckysheetConfig,
  getNowFormatDate,
  showAlertMsgWin,
  showAlertWin,
  showConfirmWin,
  showLoading,
  showPromptWin,
  withDateFormatLength,
} from "@/utils/cqcy";
import {
  delReportTableById,
  getAllDataModel,
  getAllOkReportTable,
  getAllTableTemplate,
  getAutoChReportTable,
  getChartData,
  getDataModelById,
  getReportTableById,
  getTableData,
  getTableTemplateById,
  getUserByGroupId,
  runAutoTableById,
  saveReport,
  setAutoTableTime,
  tableAssignUserById,
  tableExchangeTypeById,
  updateReportTable,
  updateTableNameById,
  getPrintByReportId,
  addPrint,
  stopAutoPrintById,
} from "@/api/datasource";
import { getAllPrintConfig } from "@/api/printConfig";
import Print from "print-js";
import { getUsername } from "@/utils/auth";
import { exportExcel } from "@/utils/export";
import { getAllUserGroup } from "@/api/user";
import { mapGetters } from "vuex";
import { insertLuckysheetEChart } from "@/utils/luckysheettool";
import cqcyCode from "@/utils/cqcyCode";

import { print } from "@/utils/print.js";

export default {
  name: "index",
  components: {
    BreadcrumbView,
  },
  computed: {
    ...mapGetters(["name", "uid"]),
  },
  data() {
    return {
      breadcrumbList: ["运行配置"],
      groupProps: {
        isLeaf: "leaf",
      },
      reportDialogTitle: "新增报表",
      showMainView: false,
      chooseMyReport: null,
      chooseCurrMyReport: null,
      dialogReportTemplateVisible: false,
      dialogDownloadReportTypeVisible: false,
      dialogAutoReportVisible: false,
      dialogReportTypeVisible: false,
      dialogUserGroupVisible: false,
      dialogHistoryReportVisible: false,
      dialogGroupUserVisible: false,
      dialogAutoPrintVisible: false,
      reportType: "0",
      downloadType: "1",
      btnType: "",
      hasUserGroup: false,
      userGroupInfo: null,
      userGroupList: [],
      radioByCron: null,
      radioByCronValS: "",
      radioByCronValM: "",
      radioByCronValH: "",
      radioByCronValD: null,
      radioByCronValMo: "",
      radioByCronValMoD: null,
      cronVal: "",
      cronList: [],
      reportId: null,
      reportTableId: null,
      reportTemplateList: [],
      dataModelList: [],
      chooseReportTemplate: null,
      chooseReportTemplateId: null,
      chooseIsAutoReport: null,
      delFlag: 0,
      dateByRange: null,
      reportForm: {
        id: null,
        reportTableName: "",
        reportTableType: null,
        tableTemplateId: null,
        reportTableData: "",
        cronLabel: "",
        startTime: "",
        cron: "",
      },
      printDialogTitle: "打印任务配置",
      printForm: {
        id: null,
        reportTableId: null,
        cronId: "",
        cron: "",
        runState: null,
        printConfigId: null,
      },
      searchValue: null,
      searchTxt: "",
      searchHistoryTxt: "",
      sessionName: "device_report_index_",
      reportOptions: [
        {
          label: "所有报表",
          value: -1,
        },
        {
          label: "手动报表",
          value: 0,
        },
        {
          label: "自动报表",
          value: 1,
        },
        {
          label: "事件驱动报表",
          value: 2,
        },
        {
          label: "设备报表",
          value: 5,
        },
      ],
      groupUserData: [],
      reportHistoryData: [],
      reportHistoryTotal: 0,
      reportHistoryPage: 1,
      reportHistoryLimit: 10,
      reportTotal: 0,
      reportPage: 1,
      reportLimit: 10,
      reportDataList: [],
      reportIntervalOptions: [5, 10, 15, 20, 25, 30],
      reportInterval: 30, // 手动报表更新数据频率
      reportIntervalTag: null,
      showReportTableType: null,
      reportRules: {
        reportTableName: [
          { required: true, message: "请输入报表名称", trigger: "blur" },
        ],
        reportTableType: [
          { required: true, message: "请选择报表类型", trigger: "change" },
        ],
        tableTemplateId: [
          { required: true, message: "请选择报表模板", trigger: "change" },
        ],
      },
      luckysheetOption: {
        container: "luckysheet", // 设定 DOM 容器的 id
        title: "报表模板", // 设定表格名称
        lang: "zh", // 设定表格语言
        showinfobar: false, // 是否显示顶部信息栏
        showtoolbar: false, // 是否显示工具栏
        showtoolbarConfig: {
          paintFormat: true, //格式刷
          moreFormats: true, // 单元格格式
          font: true, // 字体
          fontSize: true, // 字号大小
          bold: true, // 粗体 (Ctrl+B)
          italic: true, // 斜体 (Ctrl+I)
          strikethrough: true, // 删除线 (Alt+Shift+5)
          underline: true, // 下划线 (Alt+Shift+6)
          textColor: true, // 文本颜色
          fillColor: true, // 单元格颜色
          border: true, // 边框
          mergeCell: true, // 合并单元格
          horizontalAlignMode: true, // 水平对齐方式
          verticalAlignMode: true, // 垂直对齐方式
          function: true, // 公式
          // image: true
          // chart: true
        },
        showsheetbar: false, // 是否显示底部 sheet 页按钮
        sheetFormulaBar: false, // 是否显示公式
        row: 120, // 是否显示底部 sheet 页按钮
        data: [
          {
            name: "统计报表", //工作表名称
          },
        ],
        cellRightClickConfig: {
          // 自定义配置单元格右击菜单
          copy: true, // 复制
          copyAs: false, // 复制为
          paste: true, // 粘贴
          insertRow: true, // 插入行
          insertColumn: true, // 插入列
          deleteRow: true, // 删除选中行
          deleteColumn: true, // 删除选中列
          deleteCell: false, // 删除单元格
          hideRow: false, // 隐藏选中行和显示选中行
          hideColumn: false, // 隐藏选中列和显示选中列
          rowHeight: true, // 行高
          columnWidth: true, // 列宽
          clear: false, // 清除内容
          matrix: false, // 矩阵操作选区
          sort: false, // 排序选区
          filter: false, // 筛选选区
          chart: true, // 图表生成
          image: false, // 插入图片
          link: false, // 插入链接
          data: false, // 数据验证
          cellFormat: false, // 设置单元格格式
        },
        plugins: ["chart"],
      },
      queryPage: {
        page: 1,
        limit: 999,
      },
      queryPageData: [],
      queryPageId: null,
      printId:null
    };
  },
  watch: {},
  beforeDestroy() {
    this.chooseMyReport = null;
    this.chooseCurrMyReport = null;
  },
  mounted() {
    let _this = this;
    document.onkeyup = function (event) {
      let e = event || window.event || arguments.callee.caller.arguments[0];
      if (!e) return;
      const { key, keyCode } = e;
      if (keyCode === 46 || keyCode === 8) {
        _this.forceRefreshLuckysheet();
      }
    };
  },
  created() {
    luckysheet.destroy();
    this.loadReport();
    this.initCronList();
  },
  destroyed() {
    if (this.reportIntervalTag) {
      clearInterval(this.reportIntervalTag);
      // sessionStorage.removeItem(this.sessionName + this.reportTableId)
    }
    luckysheet.destroy();
  },
  methods: {
    getAllPrintConfig() {
      console.log(this.queryPage);
      getAllPrintConfig(this.queryPage).then((res) => {
        if (res.code === 200) {
          this.queryPageData = res.data.printConfigList;
        }
      });
    },
    reportIntervalChange(val) {
      this.reportInterval = val;
      this.pollingReportData();
    },
    /** 实现类似刷新效果 */
    forceRefreshLuckysheet() {
      if (luckysheet) {
        luckysheet.setCellValue(49, 0, luckysheet.getCellValue(49, 0));
      }
    },
    sortChange({ prop, order }) {
      this.reportDataList.sort(customCompare(prop, order));
    },
    sortChange1({ prop, order }) {
      this.reportHistoryData.sort(customCompare(prop, order));
    },
    handleSizeChange(val) {
      this.reportPage = 1;
      this.reportLimit = val;
      this.loadReport();
    },
    handleCurrentChange(val) {
      this.reportPage = val;
      this.loadReport();
    },
    sizeHistoryChangeEvent(val) {
      this.reportHistoryPage = 1;
      this.reportHistoryLimit = val;
      this.historyReport();
    },
    currentHistoryChangeEvent(val) {
      this.reportHistoryPage = val;
      this.historyReport();
    },
    searchHistoryReportEvent() {
      this.reportHistoryPage = 1;
      this.historyReport();
    },
    changeReportTypeEvent(val) {
      this.reportPage = 1;
      this.searchValue = val;
      this.loadReport();
    },
    searchReportEvent() {
      this.reportPage = 1;
      this.loadReport();
    },
    /** 验证CRON是否正确 */
    validCron(value) {
      const cronParse = require("cron-parser");
      try {
        const interval = cronParse.parseExpression(value);
        console.log("cronDate:", interval.next().toDate());
        return true;
      } catch (e) {}
      return false;
    },
    /** 解析数据运行表达式 */
    analysisCron(val) {
      if (!val) return;
      let s = val.split(" ");
      if (s[0].indexOf("/") > -1) {
        this.radioByCron = 1;
        this.radioByCronValS = parseInt(s[0].split("/")[1]);
      } else if (s[1].indexOf("/") > -1) {
        this.radioByCron = 2;
        this.radioByCronValM = parseInt(s[1].split("/")[1]);
      } else if (s[2].indexOf("/") > -1) {
        this.radioByCron = 3;
        this.radioByCronValH = parseInt(s[2].split("/")[1]);
      } else if (s[3] === "*") {
        this.radioByCron = 4;
        this.radioByCronValD = s[2] + ":" + s[1] + ":" + s[0];
      } else {
        this.radioByCron = 5;
        this.radioByCronValMo = parseInt(s[3]);
        this.radioByCronValMoD = s[2] + ":" + s[1] + ":" + s[0];
      }
    },
    /** 获取自动报表运行表达式 */
    getCron() {
      let result = null;
      switch (this.radioByCron) {
        // 按每秒执行：0/2 * * * * ?
        case 1:
          if (Number.isInteger(this.radioByCronValS)) {
            result = "0/#{cron} * * * * ?";
            result = result.replace("#{cron}", this.radioByCronValS);
          }
          break;
        // 按每分钟执行：0 0/2 * * * ?
        case 2:
          if (Number.isInteger(this.radioByCronValM)) {
            result = "0 0/#{cron} * * * ?";
            result = result.replace("#{cron}", this.radioByCronValM);
          }
          break;
        // 按每小时执行：0 0 0/2 * * ?
        case 3:
          if (Number.isInteger(this.radioByCronValH)) {
            result = "0 0 0/#{cron} * * ?";
            result = result.replace("#{cron}", this.radioByCronValH);
          }
          break;
        // 每天定时执行：0 15 10 * * ?
        case 4:
          if (this.radioByCronValD) {
            let times = this.radioByCronValD.split(":");
            result = "#{cron1} #{cron2} #{cron3} * * ?";
            result = result.replace("#{cron1}", times[2]);
            result = result.replace("#{cron2}", times[1]);
            result = result.replace("#{cron3}", times[0]);
            result = result.replace(/00/g, "0");
          }
          break;
        // 每月定时执行：0 0 2 1 * ?
        case 5:
          if (
            Number.isInteger(this.radioByCronValMo) &&
            this.radioByCronValMoD
          ) {
            let times = this.radioByCronValMoD.split(":");
            result = "#{cron1} #{cron2} #{cron3} #{cron4} * ?";
            result = result.replace("#{cron1}", times[2]);
            result = result.replace("#{cron2}", times[1]);
            result = result.replace("#{cron3}", times[0]);
            result = result.replace("#{cron4}", this.radioByCronValMo);
            result = result.replace(/00/g, "0");
          }
          break;
        default:
          break;
      }
      return result;
    },
    /** 获取自动报表运行表达式名称 */
    getCronLabel() {
      let result = null;
      switch (this.radioByCron) {
        // 按每秒执行：0/2 * * * * ?
        case 1:
          if (Number.isInteger(this.radioByCronValS)) {
            result = "每#{cron}秒执行一次";
            result = result.replace("#{cron}", this.radioByCronValS);
          }
          break;
        // 按每分钟执行：0 0/2 * * * ?
        case 2:
          if (Number.isInteger(this.radioByCronValM)) {
            result = "每#{cron}分钟执行一次";
            result = result.replace("#{cron}", this.radioByCronValM);
          }
          break;
        // 按每小时执行：0 0 0/2 * * ?
        case 3:
          if (Number.isInteger(this.radioByCronValH)) {
            result = "每#{cron}小时执行一次";
            result = result.replace("#{cron}", this.radioByCronValH);
          }
          break;
        // 每天定时执行：0 15 10 * * ?
        case 4:
          if (this.radioByCronValD) {
            let times = this.radioByCronValD.split(":");
            result = "每天#{cron3}:#{cron2}:#{cron1}执行一次";
            result = result.replace(
              "#{cron1}",
              times[2].length < 2 && parseInt(times[2]) < 10
                ? "0" + times[2]
                : times[2]
            );
            result = result.replace(
              "#{cron2}",
              times[1].length < 2 && parseInt(times[1]) < 10
                ? "0" + times[1]
                : times[1]
            );
            result = result.replace(
              "#{cron3}",
              times[0].length < 2 && parseInt(times[0]) < 10
                ? "0" + times[0]
                : times[0]
            );
            // result = result.replace(/00/g, '0')
          }
          break;
        // 每月定时执行：0 0 2 1 * ?
        case 5:
          if (
            Number.isInteger(this.radioByCronValMo) &&
            this.radioByCronValMoD
          ) {
            let times = this.radioByCronValMoD.split(":");
            result = "每月#{cron4}号的#{cron3}:#{cron2}:#{cron1}执行一次";
            result = result.replace(
              "#{cron1}",
              times[2].length < 2 && parseInt(times[2]) < 10
                ? "0" + times[2]
                : times[2]
            );
            result = result.replace(
              "#{cron2}",
              times[1].length < 2 && parseInt(times[1]) < 10
                ? "0" + times[1]
                : times[1]
            );
            result = result.replace(
              "#{cron3}",
              times[0].length < 2 && parseInt(times[0]) < 10
                ? "0" + times[0]
                : times[0]
            );
            result = result.replace("#{cron4}", this.radioByCronValMo);
            // result = result.replace(/00/g, '0')
          }
          break;
        default:
          break;
      }
      return result;
    },
    /** 选择定时任务表达式 */
    chooseCronEvent() {
      if (!this.getCron()) {
        showAlertMsgWin(this, null, "请指定定时任务类型或运行时间！");
        return;
      }
      this.reportForm.cron = this.getCron();
      this.reportForm.cronLabel = this.getCronLabel();
      if (!this.validCron(this.reportForm.cron)) {
        showAlertMsgWin(this, null, "定时任务表达式格式不正确！");
        return;
      }
      this.dialogAutoReportVisible = false;
    },
    resetRadioVal() {
      this.radioByCron = null;
      this.radioByCronValS = "";
      this.radioByCronValM = "";
      this.radioByCronValH = "";
      this.radioByCronValD = null;
      this.radioByCronValMo = "";
      this.radioByCronValMoD = null;
      this.cronVal = "";
    },
    chooseReportTypeEvent() {
      if (!this.reportType) {
        showAlertMsgWin(this, null, "请选择报表类型！");
        return;
      }
      // 自动报表
      if (this.reportType == "1") {
        this.resetRadioVal();
        getReportTableById(this.reportId)
          .then((res) => {
            this.dialogAutoReportVisible = true;
            this.cronVal = res.data.cron;
            this.analysisCron(this.cronVal);
          })
          .catch((e) => {
            showAlertWin(this, null, e);
          });
        return;
      }
      const loading = showLoading(this, "请稍候···");
      let params = {
        id: this.reportId,
        isAutoReport: this.reportType,
      };
      tableExchangeTypeById(params)
        .then((res) => {
          loading.close();
          this.dialogClose();
          this.loadReport();
        })
        .catch((e) => {
          loading.close();
          showAlertWin(this, null, e);
        });
    },
    switchChangeEvent(val, data) {
      this.reportId = data.id;
      if (val) {
        this.resetRadioVal();
        this.dialogAutoReportVisible = true;
        getReportTableById(data.id)
          .then((res) => {
            this.cronVal = res.data.cron;
            this.analysisCron(this.cronVal);
          })
          .catch((e) => {
            showAlertWin(this, null, e);
          });
        return;
      }
      this.dialogReportTypeVisible = true;
    },
    /** 修改自动报表运行状态 */
    setReportStatus(data) {
      let status = data.runState == 0 ? "启动" : "停止";
      let tips = "您确定要" + status + "该报表吗？";
      showConfirmWin(this, null, tips, () => {
        const loading = showLoading(this, status + "中，请稍候···");
        let params = {
          id: data.id,
          runState: data.runState == 0 ? 1 : 0,
        };
        runAutoTableById(params)
          .then((res) => {
            loading.close();
            let msg = res.data ? status + "成功！" : status + "失败！";
            showAlertMsgWin(this, null, msg);
            this.reportPage = 1;
            this.loadReport();
          })
          .catch((e) => {
            loading.close();
            showAlertWin(this, null, e);
          });
      });
    },
    /** 初始化报表信息 */
    resetReportFormVal() {
      this.reportForm = {
        id: null,
        reportTableName: "",
        reportTableType: null,
        tableTemplateId: null,
        reportTableData: "",
        cronLabel: "",
        startTime: "",
        cron: "",
      };
      this.dateByRange = null;
    },
    /** 报表类型更改事件 */
    changeReportType() {
      this.reportForm.tableTemplateId = null;
      this.getAllReportTemplate(this.reportForm.reportTableType);
    },
    /** 新增报表 */
    addReportEvent() {
      this.resetReportFormVal();
      this.reportDialogTitle = "新增报表";
      this.dialogReportTemplateVisible = true;
    },
    /** 刷新报表 */
    refreshReportEvent() {
      this.reportPage = 1;
      this.loadReport();
    },
    /** 设置自动报表运行时间 */
    settingAutoReportTime() {
      if (this.reportForm.cron) {
        this.analysisCron(this.reportForm.cron);
      } else {
        this.resetRadioVal();
      }
      this.dialogAutoReportVisible = true;
    },
    /** 模版报表选择 */
    chooseReportEvent() {
      // 判断是否自动报表
      // if (this.reportForm.reportTableType == 1 && this.dateByRange.length == 0) {
      //   showAlertMsgWin(this, null, '请选择时间范围！')
      //   return
      // }
      if (this.reportForm.reportTableType == 1 && !this.reportForm.startTime) {
        showAlertMsgWin(this, null, "请选择开始时间！");
        return;
      }
      if (this.reportForm.reportTableType == 1 && !this.reportForm.cron) {
        showAlertMsgWin(this, null, "请设置自动报表运行时间！");
        return;
      }
      this.$refs["reportForm"].validate((valid) => {
        if (valid) {
          const loading = showLoading(this, "数据加载中，请稍候···");
          getTableTemplateById(this.reportForm.tableTemplateId)
            .then((res) => {
              if (!res.data) {
                loading.close();
                showAlertMsgWin(this, null, "选择的报表模板不存在！");
                return;
              }
              let luckyData = JSON.parse(res.data.templateData);
              if (this.reportForm.id) {
                this.updateReportInfo(loading, luckyData);
              } else {
                this.saveReportInfo(loading, luckyData);
              }
            })
            .catch((e) => {
              loading.close();
              showAlertWin(this, null, e);
            });
        }
      });
    },
    /** 根据 ID 查询数据模型 */
    getDataModelById(loading, reportData) {
      if (!loading) {
        loading = showLoading(this, "数据加载中，请稍候···");
      }
      getDataModelById(this.reportForm.operationRule)
        .then((res) => {
          loading.close();
          if (!res.data) {
            showAlertMsgWin(this, null, "选择的四则运算表达式不存在！");
            return;
          }
          let luckyData = JSON.parse(reportData.templateData);
          this.drawLuckyExcel(luckyData);
          this.btnType = "add";
          this.dialogReportTemplateVisible = false;
        })
        .catch((e) => {
          loading.close();
          showAlertWin(this, null, e);
        });
    },
    /** 绘制 Excel 表 */
    drawLuckyExcel(luckyData, callback) {
      let _this = this;
      luckysheet.destroy();
      let option = luckyData.option;
      option.data = luckyData.data;
      let charts = luckyData.charts;
      let tables = luckyData.tables;
      option.hook = {
        workbookCreateAfter() {
          console.log(luckyData);
          for (let i in charts) {
            _this.insertEChartInfo(charts[i]);
          }
          for (let i in tables) {
            _this.insertTableInfo(tables[i]);
          }
          _this.drawBaseInfo();
          if (callback) {
            callback();
          }
        },
        cellUpdated(r, c, newV, oldV) {
          if (!(r === 49 && c === 0)) {
            _this.forceRefreshLuckysheet();
          }
        },
      };
      luckysheet.create(option);
    },
    /** 获取图表数据 */
    getChartData(data, callback) {
      getChartData(data)
        .then((res) => {
          if (!res.data) {
            if (callback) callback([]);
            return;
          }
          if (callback) callback(res.data);
        })
        .catch((e) => {
          if (callback) callback([]);
          showAlertWin(this, null, e);
        });
    },
    /** 获取表格数据 */
    getTableData(data, callback) {
      getTableData(data)
        .then((res) => {
          if (!res.data) {
            if (callback) callback([]);
            return;
          }
          if (callback) callback(res.data);
        })
        .catch((e) => {
          if (callback) callback([]);
          showAlertWin(this, null, e);
        });
    },
    /** 向 Excel 插入表格 */
    insertTableInfo(tableData) {
      let params = [];
      let itemList = tableData.item;
      for (let i in itemList) {
        let temp = itemList[i];
        params.push({
          itemGroupId: temp.itemGroupId,
          itemName: temp.itemName,
        });
      }
      let p = {
        reportValueFormat: this.reportForm.reportValueFormat,
        valueCondition: this.reportForm.valueCondition,
        tableDataDtoChList: params,
        showType: tableData.showType,
      };
      if (this.reportForm.reportDate && this.reportForm.reportDate.length > 0) {
        p.startBelongTime = this.reportForm.reportDate[0];
        p.endBelongTime = this.reportForm.reportDate[1];
      } else {
        p.startBelongTime = getNowFormatDate("yyyy-MM-dd") + " 08:00:00";
        p.endBelongTime = getNowFormatDate("yyyy-MM-dd") + " 18:00:00";
      }

      this.getTableData(p, (res) => {
        // console.log('option==>', luckysheet.getAllSheets()[0])
        // console.log('table1==>', res)
        // const optionData = packtable(res, luckysheet.getAllSheets()[0])
        // console.log('table2==>', optionData)
        setTimeout(() => {
          // this.drawTableData(res, p.showType, luckysheet.getAllSheets()[0])
        }, 500);
      });
    },
    /** 初始化表格基础数据项值 */
    initBaseInfoData(data) {
      let currDate = getNowFormatDate("yyyy-MM-dd");
      let currDateTime = getNowFormatDate("yyyy-MM-dd HH:mm:ss");
      data.baseItem = {
        currDate: currDate,
        currDateTime: currDateTime,
        userName: getUsername(),
        winUserName: process.env.VUE_APP_WINNAME,
      };
      return data;
    },
    /** 绘制基础数据项布局信息 */
    drawBaseInfo(baseData) {
      if (!baseData) {
        baseData = {
          currDate: getNowFormatDate("yyyy-MM-dd"),
          currDateTime: getNowFormatDate("yyyy-MM-dd HH:mm:ss"),
          userName: getUsername(),
          winUserName: process.env.VUE_APP_WINNAME,
        };
      }
      let option = luckysheet.getAllSheets()[0];
      option.celldata.map((item) => {
        if (item.v.v) {
          item.v.v = String(item.v.v).trim();
          if (item.v.v.match(/\${([^}]+)}/g)) {
            // 替换${xxx}内部数据
            if (item.v.v.indexOf("${currDate}") > -1) {
              let val = item.v.v;
              val = val.replace("${currDate}", baseData.currDate);
              luckysheet.setCellValue(item.r, item.c, val);
            }
            if (item.v.v.indexOf("${currDateTime}") > -1) {
              let val = item.v.v;
              val = val.replace("${currDateTime}", baseData.currDateTime);
              luckysheet.setCellValue(item.r, item.c, val);
            }
            if (item.v.v.indexOf("${userName}") > -1) {
              let val = item.v.v;
              val = val.replace("${userName}", baseData.userName);
              luckysheet.setCellValue(item.r, item.c, val);
            }
            if (item.v.v.indexOf("${winUserName}") > -1) {
              let val = item.v.v;
              val = val.replace("${winUserName}", baseData.winUserName);
              luckysheet.setCellValue(item.r, item.c, val);
            }
          }
        }
      });
    },
    /** 删除不合理数据值 */
    updateLocalExcelContent() {
      let option = luckysheet.getAllSheets()[0];
      option.celldata.map((item) => {
        if (item.v.v) {
          item.v.v = String(item.v.v).trim();
          if (item.v.ct && item.v.ct.t && item.v.ct.t === "d") {
            item.v.ct = {
              fa: "@",
              t: "s",
            };
          }
          // 替换${xxx}内部数据
          if (item.v.v.match(/\${([^}]+)}/g)) {
            luckysheet.setCellValue(item.r, item.c, "");
          }
        }
      });
    },
    /** 绘制表格数据 */
    drawTableData(tableItemList, type, tableInfo) {
      if (!tableItemList || tableItemList.length == 0) {
        this.updateLocalExcelContent();
        return;
      }
      // 事件驱动报表
      if (type == 2 || type == 4) {
        tableItemList.forEach((tableItem, i) => {
          if (i == 0) {
            let valueTimeList = tableItem.valueTimeList
              ? tableItem.valueTimeList.split(",")
              : [];
            valueTimeList = withDateFormatLength(valueTimeList);
            let xAxis = tableItem.xaxis;
            let yAxis = tableItem.yaxis - 1;
            if (valueTimeList.length == 0) {
              luckysheet.setCellValue(xAxis, yAxis, "");
            } else {
              valueTimeList.forEach((v, j) => {
                luckysheet.setCellValue(xAxis + j, yAxis, v);
              });
            }
          }
          let valueList = tableItem.valueList
            ? tableItem.valueList.split(",")
            : [];
          let xAxis = tableItem.xaxis;
          let yAxis = tableItem.yaxis;
          if (valueList.length == 0) {
            luckysheet.setCellValue(xAxis, yAxis, "");
          } else {
            valueList.forEach((v, j) => {
              luckysheet.setCellValue(xAxis + j, yAxis, v);
            });
          }
        });
        this.updateLocalExcelContent();
        return;
      }
      // 设备报表
      if (type == 5 || type == 6) {
        let startTimeList = [];
        tableItemList.forEach((tableItem, i) => {
          let standby = tableItem.standby ? JSON.parse(tableItem.standby) : {};
          let dataIndex = standby.index != null ? standby.index : -1;
          let valueList = tableItem.valueList
            ? tableItem.valueList.split(",")
            : [];
          let xAxis = tableItem.xaxis;
          let yAxis = tableItem.yaxis;
          this.reportTableId = tableInfo.id;
          // 序号、时间处理
          if (tableItem.timeItemType == 0) {
            // 序号、开始时间
            let valueIndexList = tableItem.valueIndexList
              ? tableItem.valueIndexList.split(",")
              : [];
            this.deviceReportUpdateData("${index}", valueIndexList, false);
            let valueTimeList = tableItem.valueTimeList
              ? tableItem.valueTimeList.split(",")
              : [];
            valueTimeList = withDateFormatLength(valueTimeList);
            startTimeList = valueTimeList;
            this.deviceReportUpdateData("${startTime}", valueTimeList, false);
          }
          if (tableItem.timeItemType == 1) {
            // 结束时间
            let valueTimeList = tableItem.valueTimeList
              ? tableItem.valueTimeList.split(",")
              : [];
            valueTimeList = withDateFormatLength(valueTimeList);
            this.deviceReportUpdateData(
              "${stopTime}",
              valueTimeList,
              tableInfo.isGenCountTime == 1,
              startTimeList
            );
          }
          if (valueList.length == 0) {
            luckysheet.setCellValue(xAxis, yAxis, "");
          } else {
            valueList.forEach((v, j) => {
              luckysheet.setCellValue(xAxis + j, yAxis, v);
            });
          }
        });
        this.updateLocalExcelContent();
        return;
      }
      // 其余报表信息
      tableItemList.forEach((tableItem, i) => {
        // let standby = tableItem.standby ? JSON.parse(tableItem.standby) : {}
        // let dataIndex = standby.index != null ? standby.index : -1
        let valueList = tableItem.valueList
          ? tableItem.valueList.split(",")
          : [];
        // let val = (dataIndex == -1 || (dataIndex + 1) > valueList.length)
        //     ? cqcyCode['invalidData'] : valueList[dataIndex]
        let xAxis = tableItem.xaxis;
        let yAxis = tableItem.yaxis;
        if (valueList.length == 0) {
          luckysheet.setCellValue(xAxis, yAxis, "");
        } else {
          valueList.forEach((v, j) => {
            luckysheet.setCellValue(xAxis + j, yAxis, v);
          });
        }
      });
      this.updateLocalExcelContent();
    },
    /** 设备报表时间特殊处理 */
    deviceReportUpdateData(field, dataList, hasCalc, startTimeList) {
      let indexPos = sessionStorage.getItem(
        this.sessionName + this.reportTableId
      );
      console.log(123, this.reportId);
      console.log(666, indexPos);
      if (indexPos) {
        console.log(6, field);
        let pos = indexPos.split(",");
        if (field == "${index}") {
          let yAxis = parseInt(pos[0]);
          let xAxis = parseInt(pos[1]);
          console.log(777, dataList);
          dataList.forEach((v, j) => {
            luckysheet.setCellValue(yAxis + j, xAxis, j + 1);
          });
        } else if (field == "${startTime}") {
          let yAxis = parseInt(pos[0]);
          let xAxis = parseInt(pos[1]) + 1;
          console.log(888, dataList);
          dataList.forEach((v, j) => {
            luckysheet.setCellValue(yAxis + j, xAxis, v);
          });
        } else if (field == "${stopTime}") {
          let yAxis = parseInt(pos[0]);
          let xAxis = parseInt(pos[1]) + 2;
          console.log(999, dataList);
          dataList.forEach((v, j) => {
            luckysheet.setCellValue(yAxis + j, xAxis, v);
            if (hasCalc) {
              // let startDate = luckysheet.getCellValue(yAxis + j, xAxis - 1)
              let startDate = startTimeList[j];
              let minutes = this.calculateMinutes(startDate, v);
              luckysheet.setCellValue(yAxis + j, xAxis + 1, minutes);
            }
          });
        }
        return;
      }
      let option = luckysheet.getAllSheets()[0];
      option.celldata.map((item) => {
        if (item.v.v) {
          item.v.v = String(item.v.v).trim();
          // 替换${xxx}内部数据
          if (item.v.v.match(/\${([^}]+)}/g)) {
            if (item.v.v.indexOf(field) > -1) {
              let yAxis = item.r;
              let xAxis = item.c;
              if (field == "${index}") {
                console.log(1, field);
                sessionStorage.setItem(
                  this.sessionName + this.reportTableId,
                  yAxis + "," + xAxis
                );
                dataList.forEach((v, j) => {
                  luckysheet.setCellValue(yAxis + j, xAxis, j + 1);
                });
              } else {
                console.log(111, field);
                console.log(111, dataList);
                dataList.forEach((v, j) => {
                  luckysheet.setCellValue(yAxis + j, xAxis, v);
                  if (hasCalc) {
                    let startDate = luckysheet.getCellValue(
                      yAxis + j,
                      xAxis - 1
                    );
                    let minutes = this.calculateMinutes(startDate, v);
                    luckysheet.setCellValue(yAxis + j, xAxis + 1, minutes);
                  }
                });
              }
            }
          }
        }
      });
    },
    /** 计算分钟数 */
    calculateMinutes(time1, time2) {
      // 将时间字符串转换为Date对象
      let date1 = new Date(time1);
      let date2 = new Date(time2);
      // 计算时间差（以毫秒为单位）
      let diffInMilliseconds = Math.abs(date2.getTime() - date1.getTime());
      // 将时间差转换为分钟
      let minutes = Math.floor(diffInMilliseconds / 1000 / 60);
      return minutes;
    },
    /** 向 Excel 插入图表 */
    insertEChartInfo(chart) {
      let _self = this;
      let info = JSON.parse(chart.standby);
      let reportChartItemList = chart.reportChartItemList;
      let chartType = chart.chartType;
      // 系列
      let series = info.option.series;
      for (let i in series) {
        let temp = series[i];
        temp.data = [];
        for (let j in reportChartItemList) {
          let _name = reportChartItemList[j].describe
            ? reportChartItemList[j].describe
            : reportChartItemList[j].itemName;
          if (chartType == "pie") {
            info.option.legend = null;
            info.option.tooltip = {
              trigger: "item",
              formatter: "{b0}<br /> <b>{c0}</b>",
            };
            temp.name = _name;
            let names = reportChartItemList[i].valueTimeList
              ? reportChartItemList[i].valueTimeList.split(",")
              : [];
            names = withDateFormatLength(names);
            let vals = reportChartItemList[i].valueList
              ? reportChartItemList[i].valueList.split(",")
              : [];
            names.forEach((name, j) => {
              temp.data.push({
                name: name,
                value: vals[j],
              });
            });
          } else {
            let _t = [];
            let t = reportChartItemList[i].valueList
              ? reportChartItemList[i].valueList.split(",")
              : [];
            t.forEach((temp) => {
              _t.push(parseFloat(temp));
            });
            temp.data = _t;
          }
        }
      }
      if (chartType != "pie") {
        // x 轴
        let xAxis = info.option.xAxis;
        let legend = info.option.legend;
        // xAxis.data = []
        legend.data = [];
        let axisLabel = {};
        axisLabel.rotate = 20;
        xAxis.axisLabel = axisLabel;
        let times = reportChartItemList[0].valueTimeList
          ? reportChartItemList[0].valueTimeList.split(",")
          : [];
        xAxis.data =
          reportChartItemList && reportChartItemList.length > 0
            ? withDateFormatLength(times)
            : [];
        // xAxis.data = xAxis.data.slice(0, 7)
        for (let i in reportChartItemList) {
          let name = reportChartItemList[i].describe
            ? reportChartItemList[i].describe
            : reportChartItemList[i].itemName;
          // xAxis.data.push(name)
          legend.data.push(name);
        }
      }
      console.log(chartType, info);
      setTimeout(() => {
        const sheet = luckysheet.getLuckysheetfile()[0];
        let optionData = sheet.data;
        let elements = document.getElementsByClassName(info.className);
        for (let i = 0; i < elements.length; i++) {
          elements[i].parentNode.removeChild(elements[i]);
        }
        try {
          let flag = true;
          insertLuckysheetEChart({
            selector: "#luckysheet",
            info,
            sheet,
            optionData,
            echarts,
            luckysheet,
            $,
            _self,
            flag,
          });
        } catch (e) {
          console.log(999, e == "echarts is not defined");
          console.error(e);
        }
      }, 200);
    },
    /** 查询所有报表模板信息 */
    getAllReportTemplate(templateType) {
      const loading = showLoading(this, "数据加载中，请稍候···");
      let params = {
        page: 1,
        limit: 1000,
      };
      if (templateType != null) {
        params.templateType = templateType;
      }
      getAllTableTemplate(params)
        .then((res) => {
          loading.close();
          if (!res.data) {
            return;
          }
          this.reportTemplateList = res.data.tableTemplateList;
        })
        .catch((e) => {
          loading.close();
          showAlertWin(this, null, e);
        });
    },
    /** 查询所有数据模型 */
    getAllDataModel() {
      let params = {
        page: 1,
        limit: 1000,
      };
      getAllDataModel(params)
        .then((res) => {
          if (!res.data) {
            return;
          }
          this.dataModelList = res.data.dataModelList;
        })
        .catch((e) => {
          showAlertWin(this, null, e);
        });
    },
    /** 查询我的报表列表 */
    loadReport() {
      const loading = showLoading(this, "加载中，请稍候···");
      let params = {
        page: this.reportPage,
        limit: this.reportLimit,
      };
      if (this.searchValue != "-1") {
        params.isAutoReport = this.searchValue;
      }
      if (this.searchTxt && this.searchTxt.trim()) {
        params.reportTableName = this.searchTxt;
      }
      params.isDelete = 0;
      getAllOkReportTable(params)
        .then((res) => {
          loading.close();
          if (!res || !res.data) {
            return;
          }
          this.reportTotal = res.data.count;
          this.reportDataList = res.data.reportTableList;
        })
        .catch((e) => {
          loading.close();
          showAlertWin(this, null, e);
        });
    },
    /** 设置自动打印 */
    setAutoPrint(data) {
      this.resetPrint();
      const loading = showLoading(this, "设置中，请稍候···");
      this.printForm.reportTableId = data.id;
      getPrintByReportId(data.id)
        .then((res) => {
          loading.close();
          if (res.data) {
            this.printForm.id = res.data.id;
            this.printForm.printConfigId = res.data.printConfigId;
            this.printForm.cronId = res.data.cronId;
            this.printForm.cron = res.data.cron;
            this.printForm.runState = res.data.runState;
            this.analysisCron(res.data.cron);
          }
          this.dialogAutoPrintVisible = true;
        })
        .catch((e) => {
          loading.close();
        });
      this.getAllPrintConfig();
    },
    resetPrint() {
      this.printForm.id = null;
      this.printForm.reportTableId = null;
      this.printForm.cronId = "";
      this.printForm.cron = "";
      this.printForm.runState = null;
      this.printForm.printConfigId = null;
    },
    /** 选择定时打印 */
    chooseCronPrint() {
      if (!this.getCron()) {
        showAlertMsgWin(this, null, "请指定定时任务类型或运行时间！");
        return;
      }
      this.printForm.cron = this.getCron();
      if (!this.validCron(this.printForm.cron)) {
        showAlertMsgWin(this, null, "定时任务表达式格式不正确！");
        return;
      }
      addPrint(this.printForm)
        .then((res) => {
          let msg = res.data ? "配置成功！" : "配置失败！";
          showAlertMsgWin(this, null, msg);
          this.showMainView = false;
          this.dialogAutoPrintVisible = false;
        })
        .catch((e) => {
          showAlertWin(this, null, e);
        });
    },
    /** 停止打印 */
    stopAutoPrint() {
      console.log(this.printForm.reportTableId);
      stopAutoPrintById(this.printForm.reportTableId)
        .then((res) => {
          showAlertWin(this, null, res.data);
          if (res.code == 200) {
            this.dialogAutoPrintVisible = false;
          }
        })
        .catch((e) => {
          showAlertWin(this, null, e);
        });
    },
    /** 设置用户组信息 */
    setUserGroupEvent(data) {
      if (data.userId != this.uid) {
        showAlertMsgWin(this, null, "您没有权限进行设置！");
        return;
      }
      this.reportId = data.id;
      this.dialogUserGroupVisible = true;
      getAllUserGroup()
        .then((res) => {
          this.$nextTick(() => {
            this.userGroupList = res.data;
            // this.userGroupInfo = data.userGroupList
            this.userGroupInfo = [];
            for (let i = 0; i < data.userGroupList.length; i++) {
              this.userGroupInfo.push(data.userGroupList[i].id);
            }
            if (data.userGroupList && data.userGroupList.length > 0) {
              this.hasUserGroup = true;
            }
          });
        })
        .catch((e) => {
          showAlertWin(this, null, e);
        });
    },
    getUserGroupEvent(data) {
      this.groupUserData = [];
      if (!data.userGroupList || data.userGroupList.length == 0) {
        showAlertMsgWin(this, null, "该报表还未进行授权操作！");
        return;
      }
      let _this = this;
      data.userGroupList.forEach((group) => {
        getUserByGroupId(group.id)
          .then((res) => {
            let users = res.data;
            users.forEach((u) => {
              _this.groupUserData.push({
                userGroupName: group.userGroupName,
                userName: u.userName,
              });
            });
          })
          .catch((e) => {
            showAlertWin(_this, null, e);
          });
      });
      this.dialogGroupUserVisible = true;
    },
    chooseUserGroupEvent() {
      // if (!this.userGroupInfo) {
      //   this.$message({
      //     message: '请选择用户组！',
      //     type: 'warning'
      //   })
      //   return
      // }
      let params = {
        id: this.reportId,
        userGroupList: [],
      };
      for (let i = 0; i < this.userGroupInfo.length; i++) {
        params.userGroupList.push({
          id: this.userGroupInfo[i],
        });
      }
      tableAssignUserById(params)
        .then((res) => {
          if (this.hasUserGroup || this.userGroupInfo) {
            showAlertMsgWin(this, null, "保存成功！");
            this.hasUserGroup = false;
          }
          this.dialogClose();
          this.loadReport();
        })
        .catch((e) => {
          showAlertWin(this, null, e);
        });
    },
    /** 处理自动报表数据信息 */
    drawAutoReportData(datas) {
      if (!datas || datas.length == 0) {
        return;
      }
      datas.forEach((data) => {
        if (!data || !data.item) {
          return;
        }
        let showInfo = data.showType;
        let fieldList = data.field;
        data.item.forEach((item, i) => {
          if (!item || !item.dataList) {
            return;
          }
          let itemName = item.itemName;
          itemName = itemName.substring(itemName.lastIndexOf(".") + 1);
          let tempName =
            "${" +
            item.itemGroupId +
            "." +
            itemName +
            "." +
            showInfo.dataId +
            "}";
          let p_r, p_c;
          if (fieldList[i] && tempName == fieldList[i].name) {
            p_r = parseInt(fieldList[i].r);
            p_c = parseInt(fieldList[i].c);
          } else {
            for (let n = 0; n < fieldList.length; n++) {
              if (fieldList[n].name == tempName) {
                p_r = parseInt(fieldList[n].r);
                p_c = parseInt(fieldList[n].c);
                break;
              }
            }
          }
          // 数据信息
          let dataList = item.dataList;
          for (let j = 0; j < showInfo.valLine; j++) {
            let c = p_c;
            let r = p_r;
            if (showInfo.valType == "2") r += j;
            else c += j;
            luckysheet.setCellValue(
              r,
              c,
              dataList[j] != null && dataList[j] != undefined
                ? dataList[j] + ""
                : cqcyCode["invalidData"]
            );
          }
        });
      });
    },
    /** 报表点击事件 */
    handleReportNodeClick(data, type) {
      this.printId=data.id
      if (data.id == -1 || this.delFlag == 1) {
        return;
      }
      const loading = showLoading(this, "加载中，请稍候···");
      getReportTableById(data.id)
        .then((res) => {
          let _data = res.data;
          if (!_data) {
            loading.close();
            showAlertMsgWin(this, null, "选择的报表不存在！");
            return;
          }
          this.showMainView = true;
          this.breadcrumbList = [_data.reportTableName];
          this.chooseCurrMyReport = _data;
          // 判断是否运行记录
          if (type === "history") {
            this.dialogHistoryReportVisible = false;
            this.btnType = "showChild";
          } else {
            this.chooseMyReport = res.data;
            this.btnType = "showShared";
          }
          this.setLuckysheetStatus(_data, true, type, loading);
          // 手动报表，循环查询数据
          this.showReportTableType = _data.reportTableType;
          this.pollingReportData();
        })
        .catch((e) => {
          loading.close();
          showAlertWin(this, null, e);
        });
    },
    /** 轮询更新报表数据 */
    pollingReportData() {
      if (this.reportIntervalTag) {
        clearInterval(this.reportIntervalTag);
        // sessionStorage.removeItem(this.sessionName + this.reportTableId)
      }
      if (
        this.showReportTableType == 0 ||
        this.showReportTableType == 1 ||
        this.showReportTableType == 5
      ) {
        this.reportIntervalTag = setInterval(() => {
          this.reloadReportNode();
        }, this.reportInterval * 1000);
      }
    },
    /** 报表reload事件 */
    reloadReportNode() {
      if (!this.chooseMyReport || !this.chooseMyReport.id) {
        if (this.reportIntervalTag) {
          clearInterval(this.reportIntervalTag);
          // sessionStorage.removeItem(this.sessionName + this.reportTableId)
        }
        return;
      }
      const loading = showLoading(this, "加载中，请稍候···");
      getReportTableById(this.chooseMyReport.id)
        .then((res) => {
          let _data = res.data;
          if (!_data) {
            loading.close();
            // if (this.reportIntervalTag) clearInterval(this.reportIntervalTag)
            return;
          }
          this.chooseCurrMyReport = _data;
          this.chooseMyReport = res.data;
          // this.setLuckysheetStatus(_data, true, '', loading)
          // 报表数据
          let reportTableData = _data.reportTableData;
          let luckyData = JSON.parse(reportTableData);
          // 基础数据项值
          let baseItem = luckyData.baseItem;
          // 数据项
          let reportTableItemList = _data.reportTableItemList;
          let reportChartList = _data.reportChartList;
          // 报表类型
          let reportTableType = _data.reportTableType;
          for (let i in reportChartList) {
            this.insertEChartInfo(reportChartList[i]);
          }
          // 绘制基础数据项
          this.drawBaseInfo(baseItem);
          // 绘制数据值
          this.drawTableData(reportTableItemList, reportTableType, _data);
          luckysheet.setRangeShow("BH1");
          loading.close();
        })
        .catch((e) => {
          if (this.reportIntervalTag) {
            clearInterval(this.reportIntervalTag);
            // sessionStorage.removeItem(this.sessionName + this.reportTableId)
          }
          loading.close();
          showAlertWin(this, null, e);
        });
    },
    /** 设置工作表状态 */
    setLuckysheetStatus(dataInfo, isReadOnly, type, loading) {
      let _this = this;
      // 报表数据
      let reportTableData = dataInfo.reportTableData;
      let luckyData = JSON.parse(reportTableData);
      // 基础数据项值
      let baseItem = luckyData.baseItem;
      // 数据项
      let reportTableItemList = dataInfo.reportTableItemList;
      let reportChartList = dataInfo.reportChartList;
      // 报表类型
      let reportTableType = dataInfo.reportTableType;

      luckysheet.destroy();
      let option = luckyData.option;
      if (!option) option = JSON.parse(JSON.stringify(this.luckysheetOption));
      option.data = luckyData.data;
      if (isReadOnly) {
        // 设置工作表保护
        option.data[0].config.authority = {
          sheet: 1, // 如果为 1 或 true，则该工作表受到保护；如果为 0 或 false，则该工作表不受保护。
          hintText: "该工作表受到保护，无法操作", // 弹窗提示的文字
        };
        // 关闭右键菜单
        option.cellRightClickConfig.chart = false;
        option.cellRightClickConfig.columnWidth = false;
        option.cellRightClickConfig.rowHeight = false;
        option.cellRightClickConfig.deleteColumn = false;
        option.cellRightClickConfig.deleteRow = false;
        option.cellRightClickConfig.insertColumn = false;
        option.cellRightClickConfig.insertRow = false;
        // 关闭工具栏
        option.showtoolbar = false;
        option.enableAddRow = false;
        option.showtoolbarConfig = {
          bold: false,
          border: false,
          fillColor: false,
          font: false,
          fontSize: false,
          function: false,
          horizontalAlignMode: false,
          italic: false,
          mergeCell: false,
          moreFormats: false,
          paintFormat: false,
          strikethrough: false,
          textColor: false,
          underline: false,
          verticalAlignMode: false,
        };
        // 钩子函数
        option.hook = {
          workbookCreateAfter() {
            for (let i in reportChartList) {
              _this.insertEChartInfo(reportChartList[i]);
            }
            // 绘制基础数据项
            _this.drawBaseInfo(baseItem);
            // 绘制数据值
            _this.drawTableData(reportTableItemList, reportTableType, dataInfo);
            luckysheet.setRangeShow("BH1");
            if (loading) loading.close();
          },
        };
      } else {
        let charts = luckyData.charts;
        // 钩子函数
        option.hook = {
          workbookCreateAfter() {
            for (let i in charts) {
              _this.insertEChartInfo(charts[i]);
            }
            // 绘制基础数据项
            _this.drawBaseInfo(baseItem);
            // 绘制数据值
            _this.drawTableData(reportTableItemList, reportTableType, dataInfo);
            luckysheet.setRangeShow("BH1");
            if (loading) loading.close();
          },
          cellUpdated(r, c, newV, oldV) {
            if (!(r === 49 && c === 0)) {
              _this.forceRefreshLuckysheet();
            }
          },
        };
      }
      luckysheet.create(option);
    },
    /** 绘制事件驱动报表信息 */
    drawEventReportData(eventTables) {
      if (!eventTables || eventTables.length == 0) {
        return;
      }
      let x = 0,
        y = 0;
      eventTables.forEach((data, i) => {
        x += 1;
        y = 0;
        let { dataList, dataTimeList, itemName } = data;
        itemName =
          itemName != null && itemName != undefined
            ? itemName
            : cqcyCode["invalidData"];
        luckysheet.setCellValue(x, y, itemName);
        dataList.forEach((val, j) => {
          y = j + 1;
          let _date = luckysheet.getCellValue(0, y);
          if (!_date) {
            let text =
              dataTimeList[j] != null && dataTimeList[j] != undefined
                ? dataTimeList[j]
                : cqcyCode["invalidData"];
            if (text.length > 19) text = text.substring(0, 19);
            luckysheet.setCellValue(0, y, text);
          }
          val = val != null && val != undefined ? val : cqcyCode["invalidData"];
          luckysheet.setCellValue(x, y, val);
        });
      });
    },
    /** 修改报表信息 */
    editReportItem(data) {
      let _data = JSON.parse(JSON.stringify(data));
      this.$nextTick(() => {
        this.resetRadioVal();
        this.cronVal = _data.cron;
        this.analysisCron(this.cronVal);
        this.reportForm = _data;
        // if (_data.startTime && _data.endTime) {
        //   this.dateByRange = [_data.startTime, _data.endTime]
        // } else {
        //   this.dateByRange = ''
        // }
        this.reportForm.startTime = _data.startTime;
        this.reportForm.cronLabel = this.getCronLabel();
      });
      this.reportDialogTitle = "配置报表";
      this.dialogReportTemplateVisible = true;
      // const loading = showLoading(this, '修改中，请稍候···')
      // getReportTableById(data.id).then(res => {
      //   loading.close()
      //   this.cronVal = res.data.cron
      //   this.analysisCron(this.cronVal)
      //   this.reportForm = res.data
      //   this.reportForm.cronLabel = this.getCronLabel()
      //   this.reportDialogTitle = '配置报表'
      //   this.dialogReportTemplateVisible = true
      // }).catch((e) => {
      //   loading.close()
      //   showAlertWin(this, null, e)
      // })
    },
    /** 报表移除 */
    removeReportItem(data, type) {
      showConfirmWin(this, null, "您确定要删除该报表吗？", () => {
        const loading = showLoading(this, "删除中，请稍候···");
        delReportTableById(data.id)
          .then((res) => {
            loading.close();
            let msg = res.data ? "删除成功！" : "删除失败！";
            showAlertMsgWin(this, null, msg);
            if (type == "record") {
              this.reportHistoryPage = 1;
              this.historyReport();
              return;
            }
            this.reportPage = 1;
            this.loadReport();
            this.cancelSaveReport();
          })
          .catch((e) => {
            loading.close();
            showAlertWin(this, null, e);
          });
      });
    },
    /** 获取单元格大小 */
    getCellSize(celldata, r, c, luckysheet) {
      const { cs, rs } = celldata.data[r][c].mc;
      const rowhidden =
        (celldata.config.rowhidden && Object.keys(celldata.config.rowhidden)) ||
        "";
      const rowArr = [];
      for (let i = 0; i < rs; i++) {
        let rowIndex = r + i;
        if (rowhidden.indexOf(String(rowIndex)) < 0) {
          rowArr.push(rowIndex);
        }
      }
      const colArr = [];
      for (let j = 0; j < cs; j++) {
        colArr.push(c + j);
      }
      const totalHeight = Object.values(luckysheet.getRowHeight(rowArr)).reduce(
        (a, b) => a + b
      );
      const totalWidth = Object.values(
        luckysheet.getColumnWidth(colArr)
      ).reduce((a, b) => a + b);
      return {
        w: totalWidth,
        h: totalHeight,
      };
    },
    /** 获取图片位置 */
    getImagePosition(num, arr) {
      let index = 0;
      let minIndex;
      let maxIndex;
      for (let i = 0; i < arr.length; i++) {
        if (num < arr[i]) {
          index = i;
          break;
        }
      }
      if (index == 0) {
        minIndex = 0;
        maxIndex = 1;
      } else if (index == arr.length - 1) {
        minIndex = arr.length - 2;
        maxIndex = arr.length - 1;
      } else {
        minIndex = index - 1;
        maxIndex = index;
      }
      let min = arr[minIndex];
      let max = arr[maxIndex];
      let radio = Math.abs((num - min) / (max - min)) + index;
      return radio;
    },
    /** 图表转换为图片 */
    convertChart(luckyData) {
      const optionData = luckysheet.getLuckysheetfile()[0];
      let {
        visibledatacolumn, // 所有行的位置
        visibledatarow, // 所有列的位置
      } = optionData;
      // 动态图表
      if (luckyData.charts && luckyData.charts.length > 0) {
        luckyData.charts.forEach((chart, i) => {
          let myChart = echarts.init(
            document.getElementsByClassName(chart.info.className)[0]
          );
          let baseData = myChart.getConnectedDataURL({
            type: "png",
            pixelRatio: 2,
            backgroundColor: "#ffffff",
          });
          // luckysheet.cancelRangeMerge(chart.info.pos)
          luckysheet.insertImage(baseData, {
            rowIndex: chart.info.pos[0],
            colIndex: chart.info.pos[1],
            cellSize: this.getCellSize(
              optionData,
              chart.info.pos[0],
              chart.info.pos[1],
              luckysheet
            ),
            success: function () {
              console.log("插入成功");
            },
          });
        });
      }
      // 静态图表
      if (luckyData.data && luckyData.data.length > 0) {
        luckyData.data.forEach((data, i) => {
          if (data.chart && data.chart.length > 0) {
            data.chart.forEach((chart, j) => {
              let myChart = echarts.init(
                document.getElementById(chart.chart_id)
              );
              myChart.setOption(chart.chartOptions);
              let baseData = myChart.getConnectedDataURL({
                type: "png",
                pixelRatio: 2,
                backgroundColor: "#ffffff",
              });
              let col_st = this.getImagePosition(chart.left, visibledatacolumn);
              let row_st = this.getImagePosition(chart.top, visibledatarow);
              luckysheet.insertImage(baseData, {
                rowIndex: parseInt(row_st),
                colIndex: parseInt(col_st),
                cellSize: {
                  w: chart.width,
                  h: chart.height,
                },
                success: function () {
                  console.log("插入成功");
                },
              });
            });
          }
        });
      }
    },
    /** 处理日期显示数字问题 */
    withDateData(excelData) {
      if (!excelData) {
        return;
      }
      try {
        excelData.map((item) => {
          if (item) {
            item.map((ll) => {
              if (ll && ll.ct && ll.ct.t && ll.ct.t === "d") {
                (ll.m = ll.m),
                  (ll.v = ll.m),
                  (ll.ct = {
                    fa: "@",
                    t: "s",
                  });
              }
            });
          }
        });
      } catch (error) {
        console.log(error);
      }
    },
    /** 保存报表信息 */
    saveReportInfo(loading, dataInfo) {
      if (!loading) loading = showLoading(this, "保存中，请稍候···");
      let _excelData = this.initBaseInfoData(dataInfo);
      let params = JSON.parse(JSON.stringify(this.reportForm));
      params.reportTableData = JSON.stringify(_excelData);
      // if (this.dateByRange && this.dateByRange.length > 0) {
      //   params.startTime = this.dateByRange[0]
      //   params.endTime = this.dateByRange[1]
      // }
      saveReport(params)
        .then((res) => {
          loading.close();
          let msg = res.data ? "保存成功！" : "保存失败！";
          showAlertMsgWin(this, null, msg);
          this.showMainView = false;
          this.dialogReportTemplateVisible = false;
          this.loadReport();
          this.cancelSaveReport();
        })
        .catch((e) => {
          loading.close();
          showAlertWin(this, null, e);
        });
    },
    /** 修改报表信息 */
    updateReportInfo(loading, dataInfo) {
      let _content = "修改";
      if (this.reportForm.reportTableType == 1) _content = "配置";
      if (!loading) loading = showLoading(this, _content + "中，请稍候···");
      let params = JSON.parse(JSON.stringify(this.reportForm));
      // if (this.dateByRange && this.dateByRange.length > 0) {
      //   params.startTime = this.dateByRange[0]
      //   params.endTime = this.dateByRange[1]
      // }
      setAutoTableTime(params)
        .then((res) => {
          loading.close();
          let msg = res.data ? _content + "成功！" : _content + "失败！";
          showAlertMsgWin(this, null, msg);
          this.showMainView = false;
          this.dialogReportTemplateVisible = false;
          this.loadReport();
          this.cancelSaveReport();
        })
        .catch((e) => {
          loading.close();
          showAlertWin(this, null, e);
        });
    },
    /** 更新报表信息 */
    updateReport() {
      if (!this.chooseMyReport || !this.chooseMyReport.id) {
        showAlertMsgWin(this, null, "保存失败，请刷新后重试！");
        return;
      }
      showPromptWin(
        this,
        "保存",
        "请输入报表名称",
        this.chooseMyReport.reportTableName,
        (val) => {
          if (!val) {
            return "报表名称不能为空";
          }
          if (val.length > 20) {
            return "报表名称必须在20字以内";
          }
        },
        (value) => {
          const loading = showLoading(this, "保存中，请稍候···");
          let _data2 = JSON.parse(this.chooseMyReport.reportTableData);
          let excelTable = _data2.tables;
          excelTable.forEach((table) => {
            table.field.forEach((field) => {
              luckysheet.setCellValue(field.r, field.c, field.name);
            });
          });
          let _data = JSON.parse(getLuckysheetConfig());
          let excelData = _data[0].data;
          this.withDateData(excelData);
          _data2.data = _data;
          // this.convertChart(_data2)
          let data = this.chooseMyReport;
          data.reportTableName = value;
          data.reportTableData = JSON.stringify(_data2);
          updateReportTable(data)
            .then((res) => {
              loading.close();
              let msg = res.data ? "保存成功！" : "保存失败！";
              showAlertMsgWin(this, null, msg);
              this.showMainView = false;
              this.loadReport();
              this.cancelSaveReport();
            })
            .catch((e) => {
              loading.close();
              showAlertWin(this, null, e);
            });
        }
      );
    },
    /** 报表下载 */
    downloadReport() {
      this.dialogDownloadReportTypeVisible = true;
    },
    /** 报表下载事件 */
    downloadReportEvent() {
      if (!this.chooseCurrMyReport) {
        showAlertMsgWin(this, null, "请选择报表！");
        return;
      }
      let reportName = this.chooseCurrMyReport.reportTableName
        ? this.chooseCurrMyReport.reportTableName
        : "统计报表";
      if (this.downloadType == "1") {
        // exportExcel(luckysheet, reportName, ExcelJS).then((res) => {
        //   console.log("result==>", res)
        //   // this.$message({
        //   //   message: res,
        //   //   type: 'success'
        //   // })
        //   this.dialogDownloadReportTypeVisible = false
        // }).catch((err) => {
        // })
        exportExcel(luckysheet.getAllSheets(), reportName);
        setTimeout(() => {
          this.dialogDownloadReportTypeVisible = false;
        }, 500);
      }
    },
    /** 报表记录 */
    historyReport() {
      const loading = showLoading(this, "加载中，请稍候···");
      let params = {
        page: this.reportHistoryPage,
        limit: this.reportHistoryLimit,
        reportTableName: this.searchHistoryTxt,
        autoTableId: this.chooseMyReport.id,
      };
      getAutoChReportTable(params)
        .then((res) => {
          loading.close();
          this.dialogHistoryReportVisible = true;
          if (!res.data) return;
          this.reportHistoryData = res.data.reportTableList;
          this.reportHistoryTotal = res.data.count;
        })
        .catch((e) => {
          loading.close();
          showAlertWin(this, null, e);
        });
    },
    getPrintSheetArea() {
      const sheetData = luckysheet.getSheetData();
      let objRowColumn = {
        row: [0, 0], //行
        column: [0, 0], //列
      };
      // * item是行、index是行索引、it是一行里的一格、itemIndex是这一格在这一行里的列索引
      sheetData.forEach((item, index) => {
        //行数
        item.forEach((it, itemIndex) => {
          if (it !== null && it.v) {
            // console.log(index, it)
            if (objRowColumn.row[1] < index) {
              objRowColumn.row[1] = index; //row第二位
            }
            if (objRowColumn.column[1] < itemIndex) {
              objRowColumn.column[1] = itemIndex; //column第二位
            }
          }
        });
      });
      return objRowColumn;
    },
    /** 打印操作 */
    printExcel() {
      const loading = showLoading(this, "请稍候···");
      document.querySelector("#print-area").style =
        "display:block;margin:20px;";
      window.luckysheet.hideGridLines();
      //获取当前选中区域
      let currentSelected = luckysheet.getRange();
      //如果当前选中区只是一个单元格，则认为选取无效。
      if (
        currentSelected[0] != null &&
        (currentSelected[0].row[1] - currentSelected[0].row[0] >= 1 ||
          currentSelected[0].column[1] - currentSelected[0].column[0] >= 1)
      ) {
        // 将打印区域生成base64图片（*将生成的base64编码复制粘贴到浏览器地址框，是可以预览图片样式的），生成后执行的后续打印操作，取用匿名委托函数做为参数传入
        luckysheet.getScreenshotNew((imgSrc) => {
          window.luckysheet.showGridLines();
          // * Lodop中的ADD_PRINT_IMAGE，也可以直接输出base64码图片，不用加img标签（如果加了img标签，会被当做超文本对待，受浏览器引擎解析的影响）
          let $img = `<img src=${imgSrc} />`;
          this.$nextTick(() => {
            console.log(imgSrc);
            document.querySelector("#print-html").innerHTML = $img;
            setTimeout(() => {
              // Print({
              //   printable: "print-html",
              //   type: "html",
              //   documentTitle: "文档标题",
              //   maxWidth: 1150, // 最大宽度
              //   header: "",
              //   headerStyle: "font-weight:400;text-align:center;",
              //   style: "", // 不打印页眉和页脚
              //   honorColor: true, // 是否打印彩色文本
              //   targetStyles: ["*"], // 允许打印所有样式属性
              // }); // Print.js插件
              print(this.printId)
              if (document.querySelector("#print-area"))
                document.querySelector("#print-area").style = "display:none";
              loading.close();
            }, 1000);
          });
        });
      } else {
        // 获取打印区域的行列
        let RowColumn = this.getPrintSheetArea();
        // 因需要打印左边的边框，需重新设置第一列
        //RowColumn.column[0] = 0;
        // 进行选区操作
        luckysheet.setRangeShow(RowColumn);
        // 将打印区域生成base64图片（*将生成的base64编码复制粘贴到浏览器地址框，是可以预览图片样式的），生成后执行的后续打印操作，取用匿名委托函数做为参数传入
        luckysheet.getScreenshotNew((imgSrc) => {
          window.luckysheet.showGridLines();
          // * Lodop中的ADD_PRINT_IMAGE，也可以直接输出base64码图片，不用加img标签（如果加了img标签，会被当做超文本对待，受浏览器引擎解析的影响）
          let $img = `<img src=${imgSrc} />`;
          this.$nextTick(() => {
            document.querySelector("#print-html").innerHTML = $img;
            setTimeout(() => {
              // Print({
              //   printable: "print-html",
              //   type: "html",
              //   documentTitle: "文档标题",
              //   maxWidth: 1150, // 最大宽度
              //   header: "",
              //   headerStyle: "font-weight:400;text-align:center;",
              //   style: "", // 不打印页眉和页脚
              //   honorColor: true, // 是否打印彩色文本
              //   targetStyles: ["*"], // 允许打印所有样式属性
              // }); // Print.js插件
              print(this.printId)
              if (document.querySelector("#print-area"))
                document.querySelector("#print-area").style = "display:none";
              loading.close();
            }, 1000);
          });
        });
      }
    },
    // printSheet() {
    //   const loading = showLoading(this, "请稍候···");
    //   document.querySelector("#print-area").style = "display:block";
    //   window.luckysheet.hideGridLines();
    //   // 获取当前选中区域
    //   let currentSelected = luckysheet.getRange();
    //   // 如果当前选中区只是一个单元格，则认为选取无效。
    //   if (
    //     currentSelected[0] != null &&
    //     (currentSelected[0].row[1] - currentSelected[0].row[0] >= 1 ||
    //       currentSelected[0].column[1] - currentSelected[0].column[0] >= 1)
    //   ) {
    //     // 生成base64图片
    //     let imgSrc = luckysheet.getScreenshot();
    //     window.luckysheet.showGridLines();
    //     // * Lodop中的ADD_PRINT_IMAGE，也可以直接输出base64码图片，不用加img标签（如果加了img标签，会被当做超文本对待，受浏览器引擎解析的影响）
    //     let $img = `<img src=${imgSrc} style="" />`;
    //     this.$nextTick(() => {
    //       document.querySelector("#print-html").innerHTML = $img;
    //       setTimeout(() => {
    //         Print({
    //           printable: "print-html",
    //           type: "html",
    //           documentTitle: "文档标题",
    //           maxWidth: 1150, // 最大宽度
    //           header: "",
    //           headerStyle: "font-weight:400;text-align:center;",
    //           style: "", // 不打印页眉和页脚
    //           honorColor: true, // 是否打印彩色文本
    //           targetStyles: ["*"], // 允许打印所有样式属性
    //         }); // Print.js插件
    //         document.querySelector("#print-area").style.display = "none";
    //         loading.close();
    //       }, 1000);
    //     });
    //   } else {
    //     // 获取打印区域的行列
    //     let RowColumn = this.getPrintSheetArea();
    //     // 因需要打印左边的边框，需重新设置第一列
    //     RowColumn.column[0] = 0;
    //     // 进行选区操作
    //     luckysheet.setRangeShow(RowColumn);
    //     let imgSrc = luckysheet.getScreenshot(); // 生成base64图片
    //     window.luckysheet.showGridLines();
    //     // * Lodop中的ADD_PRINT_IMAGE，也可以直接输出base64码图片，不用加img标签（如果加了img标签，会被当做超文本对待，受浏览器引擎解析的影响）
    //     let $img = `<img src=${imgSrc} style="" />`;
    //     this.$nextTick(() => {
    //       document.querySelector("#print-html").innerHTML = $img;
    //       setTimeout(() => {
    //         Print({
    //           printable: "print-html",
    //           type: "html",
    //           documentTitle: "文档标题",
    //           maxWidth: 1150, // 最大宽度
    //           header: "",
    //           headerStyle: "font-weight:400;text-align:center;",
    //           style: "", // 不打印页眉和页脚
    //           honorColor: true, // 是否打印彩色文本
    //           targetStyles: ["*"], // 允许打印所有样式属性
    //         }); // Print.js插件
    //         document.querySelector("#print-area").style.display = "none";
    //         loading.close();
    //       }, 1000);
    //     });
    //   }
    // },
    /** 自定义选中区域 */
    getExcelRowColumn() {
      const sheetData = luckysheet.getSheetData();
      let objRowColumn = {
        row: [null, null], //行
        column: [null, null], //列
      };
      sheetData.forEach((item, index) => {
        //行数
        item.forEach((it, itemIndex) => {
          console.log(it);
          if (it !== null) {
            if (objRowColumn.row[0] == null) objRowColumn.row[0] = index; // row第一位
            objRowColumn.row[1] = index; //row第二位
            if (objRowColumn.column[0] == null)
              objRowColumn.column[0] = itemIndex; //column第一位
            objRowColumn.column[1] = itemIndex; //column第二位
          }
        });
      });
      return objRowColumn;
    },
    cronNodeEvent(obj) {
      this.cronVal = obj.value;
    },
    initCronList() {
      this.cronList = [];
      this.cronList.push({
        value: "0/2 * * * * ?",
        label: "表示每2秒钟执行一次任务",
      });
      this.cronList.push({
        value: "0 0/2 * * * ?",
        label: "表示每2分钟执行一次任务",
      });
      this.cronList.push({
        value: "0 0 0/2 * * ?",
        label: "表示每2小时执行一次任务",
      });
      this.cronList.push({
        value: "0 15 10 * * ?",
        label: "表示在每天上午10点15分执行一次任务",
      });
      this.cronList.push({
        value: "0 0 10,14,16 * * ?",
        label: "表示在每天的上午10点、下午2点、下午4点分别执行一次任务",
      });
      this.cronList.push({
        value: "0 0/30 9-17 * * ?",
        label: "表示在每天的上午9点到下午5点的范围内每30分钟执行一次任务",
      });
      this.cronList.push({
        value: "0 0 12 ? * WED",
        label: "表示在每周星期三中午12点执行一次任务",
      });
      this.cronList.push({
        value: "0 0 2 1 * ?",
        label: "表示在每月的1日的凌晨2点执行一次任务",
      });
    },
    /** 取消保存报表 */
    cancelSaveReport2() {
      this.handleReportNodeClick(
        this.chooseMyReport,
        this.chooseMyReport.userId !== this.uid ? "deny" : ""
      );
    },
    /** 取消保存报表 */
    cancelSaveReport() {
      if (this.reportIntervalTag) {
        clearInterval(this.reportIntervalTag);
        // sessionStorage.removeItem(this.sessionName + this.reportTableId)
      }
      luckysheet.destroy();

      this.breadcrumbList = ["运行配置"];
      this.showMainView = false;
      this.btnType = "";
      this.chooseMyReport = null;
      if (this.$refs["reportForm"]) this.$refs["reportForm"].resetFields();
    },
    /** 弹出层关闭事件 */
    dialogClose(done) {
      this.cronVal = "";
      this.searchHistoryTxt = "";
      this.reportId = null;
      // this.userGroupInfo = null
      if (typeof done === "function") {
        done();
      } else {
        this.dialogReportTemplateVisible = false;
        this.dialogDownloadReportTypeVisible = false;
        this.dialogAutoReportVisible = false;
        this.dialogReportTypeVisible = false;
        this.dialogUserGroupVisible = false;
        this.dialogAutoPrintVisible = false;
      }
    },
    /** 弹出层关闭事件 */
    dialogGroupUserClose(done) {
      if (typeof done === "function") {
        done();
      } else {
        this.dialogGroupUserVisible = false;
      }
    },
  },
};
</script>

<style rel="stylesheet/scss" lang="scss">
.breadcrumb-content {
  padding-bottom: 0;
}

.cy-nav-sx {
  float: left !important;
  margin-top: -23px !important;
  margin-left: 120px !important;
  display: flex;
}

.cy-nav-btn {
  float: right !important;
  margin-right: 20px !important;
  margin-top: -20px !important;
}

.cy-main {
  margin: 10px 20px;
  width: calc(100% - 40px);
  height: calc(100% - 100px);

  .cy-btn {
    margin-bottom: 10px;
  }

  .cy-btn .el-link {
    margin-right: 15px;
  }

  .cy-main-left {
    width: 100%;
    height: 100%;
    overflow: auto;
    //float: left;
    padding: 5px 10px;
    //border-right: 1px solid #d4d4d4;

    .cy-list {
      overflow: auto;
      height: 100%;
      height: calc(100% - 40px);

      ul {
        display: flex;
        flex-wrap: wrap;
        padding: 0;
        margin-top: 0;

        li {
          list-style-type: none;
          background: #41aed7;
          width: 23%;
          margin: 10px 1%;
          border-radius: 8px;
          height: 110px;
          padding: 15px;
          color: #ffffff;

          .cy-item-name {
            font-size: 14px;
            text-overflow: ellipsis;
            white-space: nowrap;
            overflow: hidden;
            margin-bottom: 15px;
            cursor: pointer;
          }

          .cy-item-val {
            font-size: 12px;
          }

          .cy-list-item {
            font-size: 12px;
            color: #f6f6f6;
            width: 100%;
            //display: flex;
            margin-top: 40px;
          }
        }
      }
    }
  }

  .cy-main-right {
    width: 100%;
    height: 100%;
    float: left;
    overflow: hidden;
  }
}

.cy-group-tree1 {
  font-size: 14px;

  .custom-tree-node1 {
    height: 28px;
    line-height: 28px;
  }
}

.cron-txt {
  color: blue;
  margin-right: 20px;
  cursor: pointer;
  font-weight: bold;
  font-size: 16px;
}

.cron-txt-desc {
}

.ug-div {
  .el-transfer-panel {
    width: 300px;
  }
}
</style>