<template>
  <div class="title">
    <div class="main_left">
      <el-form ref="queryFormRef" :model="tcheckParams">
        <el-form-item>
          <span style="margin-left: 5px;">计划名称：</span>
          <el-input v-model="tcheckParams.checkName" placeholder="计划名称" style="width: 200px;" clearable />
          <el-button type="primary" :disabled="state.search_disabled" @click="queryList" style="margin-left: 10px;">
            查询计划
          </el-button>
          <el-button type="primary" class="button" @click="handleAddTCheck" style="margin-left: 10px;">新增计划
          </el-button>
          <el-checkbox style="margin-left: 10px;width: 40px;text-align:center; vertical-align:middle"
            v-model="tcheckParams.hideFinished" label="隐藏完成" size="large" true-label=1 false-label=0
            @change="queryList" />
        </el-form-item>
      </el-form>
      <el-table v-loading="loading" :data="state.tcheck_tableData" border stripe ref="checkTable"
        style="width: 100%;margin-top: -15px;" :height="tcheck_tableHeight" highlight-current-row
        @current-change="handleCurrentRowChange" @row-click="handleTCheckRowClick" @expand-change="checkExpandChange"
        :header-cell-style="{ background: '#606266', color: '#FFFFFF' }" :show-header="false"
        :row-key="getSelectRowKeys">
        <el-table-column type="index" width="50" align="center" />
        <el-table-column header-align="center" min-width="120">
          <template #default="scope">
            <span v-if="isNull(scope.row.startTime)"
              style="color:red;font-size: 16px; font-weight: bold;margin-right: 4px;margin-bottom: 5px;">●</span>
            <span v-if="!isNull(scope.row.startTime) && isNull(scope.row.endTime)"
              style="color:blue;font-size: 16px; font-weight: bold;margin-right: 4px;margin-bottom: 5px;">●</span>
            <span v-if="!isNull(scope.row.startTime) && !isNull(scope.row.endTime)"
              style="color:limegreen;font-size: 16px; font-weight: bold;margin-right: 4px;margin-bottom: 5px;">●</span>

            <span>{{ scope.row.checkName }}</span>
            <!-- <span v-if="!(isNull(scope.row.endTime))" style="text-decoration: line-through;">{{ scope.row.checkName
              }}</span> -->
            <span v-if="!isNull(scope.row.startTime)"
              :style="scope.row.planEndInfo.includes('超时') ? 'color:red;float: right;font-weight:bold' : 'float: right;'">{{
                  scope.row.planEndInfo
              }}</span>
          </template>
        </el-table-column>

        <el-table-column width="50" label="操作">
          <template #default="scope">
            <el-dropdown placement="bottom-end" trigger="click">
              <span class="el-dropdown-link"> 操作 </span>
              <template #dropdown>
                <el-dropdown-menu>
                  <el-dropdown-item
                    :disabled="!((scope.row.startTime ? false : true) && (scope.row.checkDeviceNum > 0))"
                    @click="handleStart(scope.row)">
                    开始拷机</el-dropdown-item>
                  <el-dropdown-item :disabled="!(isNull(scope.row.endTime) && !isNull(scope.row.startTime))"
                    @click="handleStop(scope.row)">
                    结束拷机</el-dropdown-item>
                  <el-dropdown-item :disabled="!isNull(scope.row.startTime)" divided @click="handleAdd(scope.row)">
                    新增设备</el-dropdown-item>
                  <el-dropdown-item :disabled="!isNull(scope.row.startTime)" divided @click="handleEdit(scope.row)">
                    编辑计划</el-dropdown-item>
                  <el-dropdown-item :disabled="!isNull(scope.row.startTime)" @click="handleDelete(scope.row)">
                    删除计划</el-dropdown-item>
                  <el-dropdown-item @click="addBatchCfgTask(scope.row)">
                    批量配置</el-dropdown-item>
                  <el-dropdown-item @click="checkConfig(scope.row)" v-if="isNull(scope.row.endTime) && !isNull(scope.row.startTime)">
                    校验配置</el-dropdown-item>
                  <el-dropdown-item @click="showCheckRpt(scope.row)">
                    报告预览</el-dropdown-item>
                </el-dropdown-menu>
              </template>
            </el-dropdown>
          </template>
        </el-table-column>

        <el-table-column type="expand" width="5">
          <template #default="scope">
            <div style="margin-left: -38px;margin-top:-15px;margin-right: -40px;">
              <el-descriptions :column="4" border size="small">
                <el-descriptions-item label="计划时间" label-align="right" span="2">{{
                    tool.dateFormatYMDHm(scope.row.startTime)
                }} 至
                  {{ tool.dateFormatYMDHm(scope.row.planEndTime) }}
                </el-descriptions-item>

                <el-descriptions-item label="计划状态" label-align="right" align="center" label-class-name="my-label"
                  class-name="my-content">{{ getStatusByTCheckModel(scope.row) }}</el-descriptions-item>

                <el-descriptions-item label="创建人" label-align="right" align="center">{{ scope.row.createMan }}
                </el-descriptions-item>

                <el-descriptions-item label="工装名称" label-align="right" span="2">
                  {{ scope.row.platName }}
                </el-descriptions-item>

                <el-descriptions-item label="计划天数" label-align="right" align="center">{{ scope.row.checkDays }} 天
                </el-descriptions-item>
                <el-descriptions-item label="上传间隔" label-align="right" align="center">{{ scope.row.checkIntverl }}分钟
                </el-descriptions-item>


                <el-descriptions-item label="校验版本" label-align="right" span="2">
                  {{ scope.row.mcuVersion ? scope.row.mcuVersion : '不校验' }}
                </el-descriptions-item>

                <el-descriptions-item label="拷机数量" label-align="right" align="center">
                  {{ scope.row.checkDeviceNum }}台
                </el-descriptions-item>

                <el-descriptions-item label="批量任务" label-align="right" align="center">
                  {{ global.getTaskBatchState(scope.row.taskBatchRemoteModel) }}
                </el-descriptions-item>

                <el-descriptions-item label="自动配置" label-align="right" span="2">
                  {{ scope.row.autoBatchFlag == '1' ? '启用' : '禁用'
                  }}[{{ tool.stringIsNullOrEmpty(scope.row.autoBatchAntennaType) ? '' :
    Dic.tianxianType[scope.row.autoBatchAntennaType]
}}]
                </el-descriptions-item>

                <el-descriptions-item label="切换天线" label-align="right" align="center">
                  {{ scope.row.delaySwitchAntenna > 0 ? scope.row.delaySwitchAntenna + '小时后' : '禁用' }}
                </el-descriptions-item>
                <el-descriptions-item label="切换类型" label-align="right" align="center">
                  {{ Dic.tianxianType[scope.row.delaySwitchAntennaType] }}
                </el-descriptions-item>
              </el-descriptions>

              <el-divider border-style="dotted"
                style="margin-top: 5px;margin-bottom: 5px;background-color:dodgerblue;" />
              <el-table v-loading="tcheckdetail_loading" :data="state.tcheckdetail_tableData" border stripe
                :row-style="{ height: '0' }" size="small" style="width: 100%" height="660" highlight-current-row
                :cell-style="{ padding: '0' }" @current-change="handleCurrentRowChange"
                @row-click="handleTCheckDetailRowClick">
                <el-table-column type="index" width="45" align="center" />
                <!-- <el-table-column prop="deviceSn" label="设备SN" header-align="center" min-width="105" align="center" /> -->
                <el-table-column prop="deviceSn" label="设备SN" header-align="center" width="110">
                  <template #default="scope">
                    <span style="color:blue;cursor:pointer;text-decoration: underline;" title="点击查看配置"
                      @click="showDevCfg(scope.row)">{{ scope.row.deviceSn }}</span>
                  </template>
                </el-table-column>
                <el-table-column label="标准值" header-align="center" width="95" align="center">
                  <template #default="scope">
                    {{ scope.row.cellStaticFlag == 1
                        ? "[静态]"
                        : "[非静态]"
                    }}
                    {{ scope.row.stdValue }}
                  </template>
                </el-table-column>
                <el-table-column label="接收情况" header-align="center" width="85" align="center">
                  <template #default="scope">
                    <span :title="`当前时间应收:${scope.row.mustRevNum}`">
                      {{ scope.row.realRevNum }} / {{ scope.row.revAllNum }}
                    </span>

                  </template>
                </el-table-column>
                <!-- <el-table-column prop="stdValue" label="标准值" header-align="center" align="center" width="100" /> -->
                <!-- <el-table-column prop="revAllNum" label="总数" header-align="center" align="center" width="90" />
                  <el-table-column prop="realRevNum" label="实收" header-align="center" align="center" width="90" /> -->
                <el-table-column prop="revIntegRate" label="完整" header-align="center" align="center" width="50" />
                <el-table-column prop="recogAccuracy" label="准确" header-align="center" align="center" width="50" />
                <!-- <el-table-column prop="finalAccuracy" label="识别率" header-align="center" align="center" width="90" /> -->

                <el-table-column align="center" width="55" label="图表">
                  <template #default="scope">
                    <el-button size="small" type="text" @click="showChart(scope.row)"
                      :disabled="isNull(scope.row.startTime)">
                      图表
                    </el-button>
                  </template>
                </el-table-column>

                <el-table-column align="center" width="55" label="删除">
                  <template #default="scope">
                    <el-button size="small" type="text" @click="handleDelDev(scope.row)"
                      :disabled="!isNull(scope.row.endTime) || !adminFlag">
                      删除
                    </el-button>
                  </template>
                </el-table-column>
              </el-table>
            </div>
          </template>
        </el-table-column>
      </el-table>

      <el-config-provider :locale="locale">
        <el-pagination v-model:currentPage="tcheckParams.page" v-model:page-size="tcheckParams.rows"
          :page-sizes="[10, 15, 20, 25, 100]" :small="state.small" :disabled="state.disabled"
          :background="state.background" layout="total, sizes, prev, pager, next" :total="state.tcheck_total"
          style="text-align: center; margin-top: 10px; height: 30px" @size-change="handleSizeChange"
          @current-change="handleCurrentChange" />
      </el-config-provider>
    </div>

    <div class="main_right">
      <el-table v-loading="taireadloading" :data="state.tairead_tableData" border stripe style="width: 100%;"
        highlight-current-row @current-change="handleCurrentRowChange" :height="data_tableHeight" ref="aireadTableRef">
        <el-table-column fixed type="index" width="50" align="center" />

        <el-table-column fixed prop="deviceSn" label="设备SN" header-align="center" width="110"
          v-if="!state.currentRowModel.mcuVersion" />
        <el-table-column v-if="state.currentRowModel.mcuVersion" label="设备SN" header-align="center" width="110">
          <template #default="scope">
            <span
              :style="state.currentRowModel.mcuVersion == scope.row.softVer ? 'color:black' : 'color:red;font-weight:bold;'">
              {{ scope.row.deviceSn }}{{ state.currentRowModel.mcuVersion == scope.row.softVer ? '' : '(版本不匹配)' }}
            </span>
          </template>
        </el-table-column>

        <el-table-column label="图片" header-align="center" width="150">
          <template #default="scope">
            <div style="display: flex; align-items: center">
              <el-image :src="scope.row.src" slot="error" :preview-src-list="scope.row.srcList"
                :title="global.getImageNameTip(scope.row.smallJpgUrl)" :hide-on-click-modal="true"
                :close-on-press-escape="true"
                :style="!tool.stringIsNullOrEmpty(scope.row.src) && scope.row.src.includes('bmp') ? 'border:1.5px solid #F00;' : ''">
                <template #error>
                  <div slot="error" class="image-slot">
                    <!-- <el-icon><icon-picture /></el-icon> -->
                    <i class="el-icon-picture-outline"
                      style="font-size: 30px;text-align: center;display: block;width: 120px;"></i>
                    <span style="color: red;text-align: center;display: block;"
                      v-if="scope.row.funCode === '52'">补发报(无图)</span>
                    <span style="color: red;display:inline-block;width:120px;text-align:center;"
                      v-if="scope.row.funCode !== '52'">图片异常</span>
                  </div>
                </template>
              </el-image>
            </div>
          </template>
          <!-- <template #default="scope">
                  <div style="display: flex; align-items: center">
                    <el-image :src="scope.row.src" :preview-src-list="scope.row.srcList" />
                  </div>
                </template> -->
        </el-table-column>
        <el-table-column label="读数信息" header-align="center" width="120">
          <template #default="scope">
            <el-space direction="vertical" alignment="start">
              <el-tag size="small">结果：<span style="color: blue">{{ scope.row.identValue }}</span></el-tag>
              <el-tag size="small">原始：<span style="color: green">{{ scope.row.rawValue }}</span></el-tag>
              <el-tag size="small" :title=global.getServerReadToolTip(scope.row.serverReadModel)>服务：<span
                  style="color: red">{{
                      global.getGoodFlagContent(scope.row.serverReadModel, scope.row.decimalDigits)
                  }}</span></el-tag>
            </el-space>
          </template>
        </el-table-column>
        <el-table-column label="时间" header-align="center" width="155">
          <template #default="scope">
            <el-space direction="vertical" alignment="start">
              <el-tag size="small" style="font-weight: bold;width: 133px">采样：<span
                  style="color: blue;font-weight: bold;">{{
                      tool.dateFormatYMDHm(scope.row.sampleTime)
                  }}</span></el-tag>
              <el-tag size="small">发报：<span style="color: green">{{
                  tool.dateFormat(scope.row.rptTime)
              }}</span>
              </el-tag>
              <el-tag size="small">接收：<span style="color: red">{{
                  tool.dateFormat(scope.row.revTime)
              }}</span>
              </el-tag>
            </el-space>
          </template>
        </el-table-column>
        <el-table-column label="工作状态" header-align="center" width="105">
          <template #default="scope">
            <el-space direction="vertical" alignment="start">
              <el-tag size="small">信号：<span style="color: blue" :title="`NB位置信息:${scope.row.nbRegLocation}`">{{
                  scope.row.rsrp
              }}</span></el-tag>
              <el-tag size="small">电压：<span style="color: green" :title="`电池运行时间:${scope.row.batRumTime}`">{{
                  scope.row.voltage
              }}</span></el-tag>
              <el-tag size="small">信噪比：<span style="color: red">{{ scope.row.snr }}</span></el-tag>
            </el-space>
          </template>
        </el-table-column>
        <el-table-column label="设备版本" header-align="center" width="145">
          <template #default="scope">
            <el-space direction="vertical" alignment="start">
              <el-tag size="small">M：<span style="color: blue" :title="`MCU运行次数:${scope.row.mcuRunNum}`">{{
                  scope.row.softVer
              }}</span></el-tag>
              <el-tag size="small">A：<span style="color: green">{{ scope.row.aiVersion
              }}</span></el-tag>
              <el-tag size="small">C：<span style="color: red">{{ scope.row.hardVersion
              }} / {{ scope.row.nbVersion }}</span></el-tag>
            </el-space>
          </template>
        </el-table-column>

        <el-table-column label="工作情况" header-align="center" width="120">
          <template #default="scope">
            <el-space direction="vertical" alignment="start">
              <span style="color: blue;font-size: 0.95em;">{{ "工作时长:" +
                  tool.getValueFormat(scope.row.intervalMinutes, 's')
              }}</span>
              <span style="color: green;font-size: 0.95em;">{{ "传输时长:" +
                  tool.getValueFormat(scope.row.tranDuration, 's')
              }}</span>
              <span
                :style="scope.row.loseFlag === '1' ? 'color: Red;font-size: 0.95em;font-weight: bold' : 'color: black;font-size: 0.95em;'">{{
                    "计次:" +
                    tool.getValueFormat(scope.row.mcuRunNum, '')
                }}</span>
            </el-space>
          </template>
        </el-table-column>

        <el-table-column fit label="调试信息" header-align="center" width="410">
          <template #default="scope">
            <el-row>
              <el-col>
                <span style="font-size:14px;" v-for="(item, i) in scope.row.alist">{{
                    global.debugInfoFormat(item, i)
                }}</span>
              </el-col>
            </el-row>

            <el-row style="margin-top: 10px;">
              <el-col>
                <span style="font-size:14px;" v-for="(item, i) in scope.row.blist">{{
                    global.debugInfoFormat(item, i)
                }}</span>
              </el-col>
            </el-row>
          </template>
        </el-table-column>
      </el-table>

      <el-config-provider :locale="locale">
        <el-pagination v-model:currentPage="taireadParams.page" v-model:page-size="taireadParams.rows"
          :page-sizes="[10, 15, 20, 25, 100]" :small="state.small" :disabled="state.disabled"
          :background="state.background" layout="total, sizes, prev, pager, next, jumper" :total="state.tairead_total"
          style="text-align: center; margin-top: 10px; height: 30px" @size-change="tAireadhandleSizeChange"
          @current-change="tAireadhandleCurrentChange" />
      </el-config-provider>
    </div>

    <el-dialog :title="tcheck_dialog.title" v-model="tcheck_dialog.visible" width="800px" draggable center>
      <el-form ref="editFormRef" :model="tcheck_formData" label-width="100px" :rules="state.rules">
        <div class="add_big_box">
          <div class="add_left_box">
            <div class="add_right_box_header">
              <span style="font-size:18px;margin-left: 10px;">拷机计划基本信息</span>
            </div>
            <div class="add_right_box_content">
              <el-form-item label="计划名称:" prop="checkName" style="margin-top: 15px;">
                <el-input v-model="tcheck_formData.checkName" placeholder="计划名称" style="width: 280px;" maxlength="30" />
              </el-form-item>
              <el-form-item label="计划天数:" prop="checkDays">
                <el-input v-model.number="tcheck_formData.checkDays" placeholder="计划时长(天)" maxlength="2"
                  style="width: 280px;" oninput="value=value.replace(/[^\d]/g, '')" />
              </el-form-item>
              <el-form-item label="上传间隔:" prop="checkIntverl">
                <el-input v-model="tcheck_formData.checkIntverl" placeholder="上传间隔(分钟)" maxlength="3"
                  style="width: 280px;" oninput="value=value.replace(/[^\d]/g, '')" />
              </el-form-item>
              <el-form-item label="校验版本:">
                <el-input v-model="tcheck_formData.mcuVersion" placeholder="MCU版本号(例:221022154507)"
                  style="width: 280px;" maxlength="12" show-word-limit clearable />
              </el-form-item>
              <el-form-item label="电池供电:">
                <el-checkbox v-model="tcheck_formData.batFlag" true-label="1" false-label="0"></el-checkbox>
              </el-form-item>
            </div>

          </div>
          <div class="add_right_box">
            <div class="add_right_box_header">
              <span style="font-size:18px;margin-left: 10px;">拷机计划托管</span>
            </div>
            <div class="add_right_box_content">
              <el-form-item label="切换天线:" style="margin-top: 15px;">
                <el-input v-model="tcheck_formData.delaySwitchAntenna" placeholder="多少小时后自动切换天线" style="width: 200px;"
                  maxlength="2" oninput="value=value.replace(/[^\d]/g, '')" />
                <el-select v-model="tcheck_formData.delaySwitchAntennaType" class="filter-item" placeholder="天线类型"
                  style="width: 200px;margin-top: 2px;">
                  <el-option v-for="(key, value) in Dic.tianxianType" :key="key" :label="key" :value="value" />
                </el-select>
              </el-form-item>

              <el-form-item label="自动配置:">
                <el-checkbox v-model="tcheck_formData.autoBatchFlag" true-label="1" false-label="0">
                </el-checkbox>
                <span style="color:red;margin-left: 10px;">
                  *[结束后自动创建配置任务]
                </span>
              </el-form-item>
              <el-form-item label="天线类型:" v-if="tcheck_formData.autoBatchFlag === '1'">
                <el-select v-model="tcheck_formData.autoBatchAntennaType" class="filter-item" placeholder="指定天线类型"
                  size="small" style="width: 100px;">
                  <el-option v-for="(key, value) in Dic.tianxianType" :key="key" :label="key" :value="value" />
                </el-select>
                <p style="color:red;margin-top: -8px;">
                  *[结束后配置指定的天线类型]
                </p>
              </el-form-item>
            </div>
          </div>
        </div>
      </el-form>
      <template #footer>
        <span class="dialog-footer">
          <el-button @click="cancel">取消</el-button>
          <el-button type="primary" @click="submitForm">确定</el-button>
        </span>
      </template>
    </el-dialog>

    <el-dialog :title="tcheckstop_dialog.title" v-model="tcheckstop_dialog.visible" width="450px" draggable center>
      <el-form ref="stopFormRef" :model="tcheck_formData" label-width="100px">
        <el-form-item label="计划名称:" prop="checkName">
          <el-input v-model="tcheckstop_formData.checkName" placeholder="计划名称" width="120px" disabled="true" />
        </el-form-item>
        <el-form-item label="计划时长:" prop="checkDays">
          <el-input v-model="tcheckstop_formData.checkDays" placeholder="计划时长" width="120px" disabled="true" />
        </el-form-item>
        <el-form-item label="上传间隔:" prop="checkIntverl">
          <el-input v-model="tcheckstop_formData.checkIntverl" placeholder="上传间隔" width="120px" disabled="true" />
        </el-form-item>
        <el-form-item label="结束标志:">
          <el-radio-group v-model="tcheckstop_formData.earlyFlag">
            <el-radio border label="0">正常</el-radio>
            <el-radio border label="1">提前</el-radio>
          </el-radio-group>
        </el-form-item>
        <el-form-item label="结束原因:">
          <el-input v-model="tcheckstop_formData.earlyBecause" placeholder="结束原因" width="120px" :rows="2"
            type="textarea" />
        </el-form-item>
      </el-form>
      <template #footer>
        <span class="dialog-footer">
          <el-button @click="cancel">取消</el-button>
          <el-button type="primary" @click="submitForm">确定</el-button>
        </span>
      </template>
    </el-dialog>

    <el-dialog :title="tcheckdetail_dialog.title" v-model="tcheckdetail_dialog.visible" width="1000px" draggable center>
      <el-form ref="addFormRef" :model="tcheckdetail_formData" :rules="state.rules" label-width="100px">
        <div class="big_box">
          <div class="left_box">
            <el-table :data="state.barCodeDetails" border stripe style="width: 100%," highlight-current-row size="small"
              height="610px" :header-cell-style="{ background: '#FF000000', color: '#000000' }">
              <el-table-column type="index" width="45" align="center" />
              <el-table-column label="设备SN" align="center" width="180">
                <template #default="scope">
                  <el-input v-model="scope.row.deviceSn" maxlength="11" clearable @blur="inputLostFoucs($event)">
                  </el-input>
                </template>
              </el-table-column>

              <el-table-column label="电池编号" align="center" width="230">
                <template #default="scope">
                  <el-input v-model="scope.row.batCode" maxlength="15" show-word-limit clearable>
                  </el-input>
                </template>
              </el-table-column>

              <el-table-column label="台账" align="center" width="50">
                <template #default="scope">
                  <span style="color: green;font-weight: bold;font-size: 18px;" v-if="scope.row.accFlag === 1">√</span>
                  <span style="color:red;font-weight: bold;font-size: 18px;" v-if="scope.row.accFlag === 0">×</span>
                </template>
              </el-table-column>

              <el-table-column label="版本" align="center" width="50" v-if="state.currentRowModel.mcuVersion">
                <template #default="scope">
                  <span style="color: green;font-weight: bold;font-size: 18px;" v-if="scope.row.verFlag === 1">√</span>
                  <span style="color:red;font-weight: bold;font-size: 18px;" v-if="scope.row.verFlag === 0">×</span>
                </template>
              </el-table-column>
            </el-table>

          </div>
          <div class="right_box">
            <div class="right_box_header">
              <span style="font-size:18px;margin-left: 10px;">请使用扫码枪录入设备SN</span>
            </div>
            <div class="right_box_content">
              <el-form-item label="计划名称:" prop="checkName" style="margin-top: 20px;">
                <el-input v-model="state.currentRowModel.checkName" placeholder="计划名称" disabled="true"
                  style="width: 250px;" />
              </el-form-item>
              <el-form-item label="工装选择:" prop="platId">
                <el-select v-model="tcheckdetail_formData.platId" class="filter-item" placeholder="工装选择"
                  style="width:250px">
                  <el-option v-for="item in DicChkplatData" :key="item.platId" :label="item.platName"
                    :value="item.platId" />
                </el-select>
              </el-form-item>
            </div>
          </div>
        </div>
      </el-form>
      <div style="text-align: center;">
        <el-button @click="cancel()">取消</el-button>
        <el-button type="primary" @click="submitForm">确定</el-button>
      </div>
    </el-dialog>
  </div>

  <el-dialog :title="taskDialog.title" v-model="taskDialog.visible" width="1300px" draggable center
    @close="dialogClose">
    <!-- 使用v-if强制重新渲染 v-if="adddialog.visible" -->
    <batchForm :check-object="state.select_tcheck" :isAdd="state.isAdd" :task-type="state.taskType"
      @change="childMethod" v-if="taskDialog.visible"></batchForm>
  </el-dialog>

  <el-dialog :title="chart_dialog.title" v-model="chart_dialog.visible" draggable width="1050px" center
    @close="chartdialogClose">
    <readChart :query-params="state.taireadParams" :visible="chart_dialog.visible" v-if="chart_dialog.visible">
    </readChart>
  </el-dialog>

  <el-dialog :title="rptView_dialog.title" v-model="rptView_dialog.visible" @Close="rptViewClose" width="985px"
    draggable="true" center=true>
    <checkRptView :checkData="state.rptCheckData" @close="childClose" v-if="rptView_dialog.visible"></checkRptView>
  </el-dialog>

  <el-dialog :title="cfgdialog.title" v-model="cfgdialog.visible" width="1100px" center>
    <DevCfgDialog :stationCode="state.cfgData.stationCode" :deviceSn="state.cfgData.deviceSn" v-if="cfgdialog.visible">
    </DevCfgDialog>
  </el-dialog>

  <!-- <el-image-viewer class="pre_img" v-if="state.showViewer" style="width: 50%;height: 50%;margin-left: 20%;" ref="elViewer"
                     :onClose="closeViewer" :url-list="state.picList"/> -->
</template>

<script lang="ts" setup>

import { reactive, toRefs, toRef, ref, onMounted } from "vue";
import { ElForm, ElMessage, ElMessageBox, ElTable } from "element-plus";
import tool from "@/until/tool"
import TCheckAction from "@/api/qualitymanagement/tcheck";
import DicChkplatAction from "@/api/systemdictionary/dicchkplat";
import TCheckDetailAction from "@/api/qualitymanagement/tcheckdetail";
import TAireadAction from "@/api/tairead";
import DeviceAction from "@/api/deviceacc";
import {
  TCheckQueryParam,
  TCheckModel,
  TCheckDto,
  TCheckDetailModel,
  TCheckFzModel,
  DicChkplatModel,
  TAireadModel,
  TAireadQueryParam,
  Dialog,
  PageResult,
  DeviceAccQueryParam,
  LinkItem,
  DeviceAccModel,
} from "@/types";
import zhCn from "element-plus/lib/locale/lang/zh-cn";
import global from "@/until/global";
import batchForm from '@/components/batchcfg/index.vue';
import DeviceAccAction from '@/api/deviceacc';
import readChart from '@/components/readchart/index.vue';
import checkRptView from '@/components/checkrpt/index.vue';
import DevCfgDialog from "@/components/devcfg/index.vue";
import Dic from "@/dictionary/aicbqcfg";

const adminFlag = localStorage.getItem("AdminFlag")?.toString() === '1';
const userName = localStorage.getItem("UserName") || "";
let locale = ref(zhCn);
// const queryFormRef = ref(ElForm); // 属性名必须和元素的ref属性值一致
// const dataFormRef = ref(ElForm); // 属性名必须和元素的ref属性值一致
const editFormRef = ref(ElForm);
//const checkTable = ref();
const checkTable = ref<InstanceType<typeof ElTable>>()
const aireadTableRef = ref();

const loading = ref(false);
const tcheckdetail_loading = ref(false);
const taireadloading = ref(false);
const pageSize = (localStorage.getItem("PageSize") == null ? 10 : localStorage.getItem("PageSize") as unknown as number) * 1;

const state = reactive({
  search_disabled: false,
  select_tcheck: {} as TCheckModel,
  select_tcheckdetail: {} as TCheckDetailModel,
  currentType: 0, //val =0 计划新增 =1 计划编辑 =2 明细新增 =3结束拷机
  tcheckParams: { page: 1, rows: pageSize, hideFinished: '1' } as TCheckQueryParam,
  deviceParams: { page: 1, rows: pageSize } as DeviceAccQueryParam,
  taireadParams: { page: 1, rows: pageSize } as TAireadQueryParam,
  tcheck_total: 0,
  tairead_total: 0,
  small: false,
  background: false,
  disabled: false,
  tcheck_dialog: {} as Dialog,
  tcheck_formData: {} as TCheckModel,
  tcheckstop_dialog: {} as Dialog,
  tcheckstop_formData: {} as TCheckModel,
  tcheckdetail_dialog: {} as Dialog,
  tcheckdetail_formData: {} as TCheckDto,
  tcheck_tableData: [] as TCheckModel[],
  tcheckdetail_tableData: [] as TCheckDetailModel[],
  tairead_tableData: [] as TAireadModel[],
  DicChkplatData: [] as DicChkplatModel[],
  links: [] as LinkItem[],
  dynamicTags: [] as string[],
  rules: {
    checkName: [{ required: true, message: "计划名称不能为空", trigger: "blur", },
    { min: 2, max: 30, message: "任务名称长度不合法", trigger: "blur" },],
    checkDays: [{ required: true, message: "计划时长不能为空", trigger: "blur", },],
    checkIntverl: [{ required: true, message: "上传间隔不能为空", trigger: "blur", },],
  },
  taskDialog: {} as Dialog,
  isAdd: true,
  taskType: 0,
  barCodeDetails: [] as TCheckDetailModel[],//扫码添加时的设备明细
  chart_dialog: {} as Dialog,
  currentRowModel: {} as TCheckModel,
  rptCheckData: {} as TCheckModel,
  rptView_dialog: {} as Dialog,
  cfgdialog: {} as Dialog,
  cfgData: {} as TCheckDetailModel,
});

const {
  tcheckParams,
  deviceParams,
  taireadParams,
  tcheck_dialog,
  tcheck_formData,
  tcheckstop_dialog,
  tcheckstop_formData,
  tcheckdetail_dialog,
  tcheckdetail_formData,
  tcheck_tableData,
  tcheckdetail_tableData,
  tairead_tableData,
  DicChkplatData,
  links,
  dynamicTags,
  taskDialog,
  isAdd,
  taskType,
  chart_dialog,
  rptView_dialog,
  cfgdialog
} = toRefs(state);

const tcheck_tableHeight = ref(document.documentElement.clientHeight - 190);
const data_tableHeight = ref(
  //document.documentElement.clientHeight - 275 - 20 - 50
  document.documentElement.clientHeight - 120
);

const currentRow = ref();

const isAllowStart = (val: any) => {
  if (val) {
    return false;
  } else {
    return true;
  }
};

const isNull = (val: any) => {
  if (val) {
    return false;
  } else {
    return true;
  }
};

const formatPercent = (data: any) => {
  if (data != null && data != undefined) {
    return data + "%";
  }
  else {
    return "";
  }
};
const handleCurrentRowChange = (val: TCheckModel | undefined) => {
  currentRow.value = val;
};

const handleTCheckRowClick = (row: TCheckModel, column: any, event: any) => {
  state.currentRowModel = row;
  if (column.label !== '操作') {
    toogleExpand(row);
  }
};

const handleTCheckDetailRowClick = (row: TCheckDetailModel) => {
  state.select_tcheckdetail = row;
  state.taireadParams.page = 1;
  if (!isNull(state.select_tcheckdetail.startTime)) {
    state.taireadParams.deviceSn = state.select_tcheckdetail.deviceSn;
    state.taireadParams.startTime = state.select_tcheckdetail.startTime;
    state.taireadParams.endTime = state.select_tcheckdetail.endTime;
    queryTAireadList();
    if (Object.keys(aireadTableRef).length > 0) { if (aireadTableRef.value != null) { (aireadTableRef.value as any).$refs.bodyWrapper.scrollTop = 0; } }
  }
};

async function handleAdd(row: TCheckModel) {
  await queryDicChkplatList();
  state.currentType = 2;
  state.tcheckdetail_formData = {} as TCheckDto;
  state.tcheckdetail_formData.id = row.id;
  state.deviceParams.deviceSn = "";
  state.tcheckdetail_dialog.title = "拷机设备";
  state.tcheckdetail_dialog.visible = true;

  state.barCodeDetails = [] as TCheckDetailModel[];
  for (let i = 0; i < 20; i++) {
    state.barCodeDetails.push({} as TCheckDetailModel);
  }
}

const handleStart = (row: TCheckModel) => {
  TCheckAction.StartTCheck(row.id)
    .then((result) => {
      if (result.status === 200) {
        const { res, flag, error } = result.data;
        if (flag === "1") {
          ElMessage.success("拷机已开始...");
          queryList();
        } else {
          ElMessage.error(error || "未知异常...");
        }
      }
    }).catch((error) => {
      //请求失败时的操作
      ElMessage.error(error || "未知异常...");
    });
};

const handleStop = (row: TCheckModel) => {
  state.currentType = 3;
  state.tcheckstop_formData = JSON.parse(JSON.stringify(row));
  state.tcheckstop_formData.earlyFlag = "0";
  state.tcheckstop_dialog.title = "拷机计划";
  state.tcheckstop_dialog.visible = true;
};

const handleAddTCheck = () => {
  state.currentType = 0;
  state.tcheck_formData = {} as TCheckModel;
  state.tcheck_dialog.title = "拷机计划";
  state.tcheck_dialog.visible = true;

  state.tcheck_formData.autoBatchFlag = '1';//默认结束后自动创建配置任务
  state.tcheck_formData.autoBatchAntennaType = '0';//自动创建的配置任务,天线默认外置
};

const handleEdit = (row: TCheckModel) => {
  state.currentType = 1;
  state.tcheck_formData = JSON.parse(JSON.stringify(row));;
  state.tcheck_dialog.title = "拷机计划";
  state.tcheck_dialog.visible = true;
};

const handleSizeChange = (val: number) => {
  tcheckParams.value.rows = val;
  queryList();
};

const handleCurrentChange = (val: number) => {
  tcheckParams.value.page = val;
  queryList();
};

const tAireadhandleSizeChange = (val: number) => {
  taireadParams.value.rows = val;
  queryTAireadList();
};

const tAireadhandleCurrentChange = (val: number) => {
  taireadParams.value.page = val;
  queryTAireadList();
};

const queryTCheckDetailList = () => {
  if (!state.select_tcheck.checkId) return;
  tcheckdetail_loading.value = true;
  TCheckAction.QueryTCheckDetail(state.select_tcheck.checkId)
    .then((result) => {
      if (result.status === 200) {
        const { res, flag, error } = result.data;
        if (flag === "1") {
          const data = res as TCheckFzModel;
          state.tcheckdetail_tableData = data.detailList;
          tcheckdetail_loading.value = false;
          // if (data.detailList.length > 0) {  //展示第一个设备明细
          //   handleTCheckDetailRowClick(data.detailList[0]);
          // }
          getDetailsLatestAiread(state.select_tcheck);
        } else {
          ElMessage.error(error || "未知异常...");
          tcheckdetail_loading.value = false;
        }
      }
      else {
        tcheckdetail_loading.value = false;
      }
    }).catch((error) => {
      //请求失败时的操作
      ElMessage.error(error || "未知异常...");
      tcheckdetail_loading.value = false;
    });
};

const queryDicChkplatList = () => {
  DicChkplatAction.QueryDicChkplatList(1, 999)
    .then((result) => {
      if (result.status === 200) {
        const { res, flag, error } = result.data;
        if (flag === "1") {
          const pageData = res as PageResult<DicChkplatModel[]>;
          state.DicChkplatData = pageData.list;
        } else {
          ElMessage.error(error || "未知异常...");
        }
      }
    })
    .catch((error) => {
      //请求失败时的操作
      ElMessage.error(error);
    });
};

const queryTAireadList = () => {
  taireadloading.value = true;
  TAireadAction.QueryTAireadListByDevice(state.taireadParams)
    .then((result) => {
      if (result.status === 200) {
        const { res, flag, error } = result.data;
        if (flag === "1") {
          const pageData = res as PageResult<TAireadModel[]>;

          pageData.list.forEach(element => {
            element.srcList = [];
            element.alist = [];
            element.blist = [];
            if (element.smallJpgUrl) {
              element.src = element.smallJpgUrl;
              element.srcList.push(element.smallJpgUrl);
            }

            if (element.bigJpgUrl) {
              element.src = element.bigJpgUrl;
              element.srcList.push(element.bigJpgUrl);
            }

            if (element.szsbz) {
              let alist = element.szsbz.split(",");
              element.alist = alist;
            }

            if (element.szsbgl) {
              let blist = element.szsbgl.split(",");
              element.blist = blist;
            }

            if (element.serverReadModel != null) {
              if (!tool.stringIsNullOrEmpty(element.serverReadModel.jpgUrl)) {
                element.srcList.push(element.serverReadModel.jpgUrl);
              }

              if (!tool.stringIsNullOrEmpty(element.serverReadModel.smallJpgUrl)) {
                element.srcList.push(element.serverReadModel.smallJpgUrl);
              }
            }
          });

          state.tairead_tableData = pageData.list;
          state.tairead_total = pageData.total;
          taireadloading.value = false;
        } else {
          ElMessage.error(error || "未知异常...");
          taireadloading.value = false;
        }
      }
      else {
        taireadloading.value = false;
      }
    })
    .catch((error) => {
      ElMessage.error(error || "未知异常...");
      //请求失败时的操作
      taireadloading.value = false;
    });
};

const queryList = () => {
  loading.value = true;

  if (!adminFlag) {//非管理员看自己的
    state.tcheckParams.createMan = userName;
  }
  TCheckAction.QueryTCheckList(state.tcheckParams)
    .then((result) => {
      if (result.status === 200) {
        const { res, flag, error } = result.data;
        if (flag === "1") {
          const pageData = res as PageResult<TCheckModel[]>;
          state.tcheck_tableData = pageData.list;
          state.tcheck_total = pageData.total;
        } else {
          ElMessage.error(error || "未知异常...");
        }
      }
    })
    .catch((error) => {
      //请求失败时的操作
      ElMessage.error(error);
    });
  loading.value = false;
};

const submitForm = () => {
  if (state.tcheck_formData.delaySwitchAntenna && !state.tcheck_formData.delaySwitchAntennaType) {
    ElMessage.warning("切换天线的类型不能为空");
    return;
  }
  if (state.currentType === 0) {
    state.tcheck_formData.createMan = localStorage.getItem("UserName") || "";
    editFormRef.value.validate((valid: any) => {
      if (valid) {
        TCheckAction.AddTCheck(state.tcheck_formData)
          .then((result) => {
            if (result.status == 200) {
              const { res, flag, error } = result.data;
              if (flag === "1") {
                ElMessage.success("新增成功");
                cancel();
                queryList();
              } else {
                ElMessage.error(error || "未知异常...");
              }
            }
          });
      }
    })
  } else if (state.currentType === 1) {
    editFormRef.value.validate((valid: any) => {
      if (valid) {
        TCheckAction.EditTCheck(state.tcheck_formData)
          .then((result) => {
            if (result.status == 200) {
              const { res, flag, error } = result.data;
              if (flag === "1") {
                ElMessage.success("编辑成功");
                cancel();
                queryList();
              } else {
                ElMessage.error(error || "未知异常...");
              }
            }
          });
      }
    })
  } else if (state.currentType === 2) {
    //let deviceSns = state.dynamicTags.join(",")
    //state.tcheckdetail_formData.deviceSns = deviceSns;

    if (state.tcheckdetail_formData.platId === '' || state.tcheckdetail_formData.platId === undefined) {
      ElMessage.warning("请选择工装");
      return;
    }

    let details=[] as TCheckDetailModel[];
    let arrSn = [] as string[];
    state.barCodeDetails.forEach(s => {
      if (!tool.stringIsNullOrEmpty(s.deviceSn)){
        arrSn.push(s.deviceSn)

        let detail={} as TCheckDetailModel;
        detail.deviceSn=s.deviceSn;
        detail.batCode=s.batCode;
        detail.chkpaltId=state.tcheckdetail_formData.platId==undefined?0:state.tcheckdetail_formData.platId as unknown as number;
        details.push(detail);      
      }
    });

    if (arrSn.length === 0) {
      ElMessage.warning("请选择设备");
      return;
    }

    state.tcheckdetail_formData.deviceSns = arrSn.join(",")

    /* POST方式开始 */
    let checkModel={} as TCheckModel;
    checkModel.id=state.tcheckdetail_formData.id as number;
    checkModel.detailList=details;

    TCheckAction.AddTCheckDetailPost(checkModel).then(
      (result) => {
        if (result.status == 200) {
          const { res, flag, error } = result.data;
          if (flag === "1") {
            ElMessage.success("新增成功");
            cancel();
            queryTCheckDetailList();
            updateCheckView(currentRow.value.checkId);
          } else {
            ElMessage.error(error || "未知异常...");
          }
        }
      }
    );
    /* POST方式结束 */

/*     TCheckAction.AddTCheckDetail(state.tcheckdetail_formData).then(
      (result) => {
        if (result.status == 200) {
          const { res, flag, error } = result.data;
          if (flag === "1") {
            ElMessage.success("新增成功");
            cancel();
            queryTCheckDetailList();
            updateCheckView(currentRow.value.checkId);
          } else {
            ElMessage.error(error || "未知异常...");
          }
        }
      }
    ); */
  } else if (state.currentType === 3) {
    state.tcheckstop_formData.earlyMan = localStorage.getItem("UserName") || "";
    TCheckAction.StopTCheck(state.tcheckstop_formData)
      .then((result) => {
        if (result.status === 200) {
          const { res, flag, error } = result.data;
          if (flag === "1") {
            ElMessage.success("拷机已结束...");
            queryList();
            cancel();
          } else {
            ElMessage.error(error || "未知异常...");
          }
        }
      }).catch((error) => {
        //请求失败时的操作
        ElMessage.error(error || "未知异常...");
      });
  }
};

const handleDelete = (row: TCheckModel) => {
  ElMessageBox.confirm(" 是否拷机计划[" + row.checkName + "]? ", "提示", {
    cancelButtonText: "取消",
    confirmButtonText: "确认",
    type: "warning",
    center: true,
  })
    .then(() => {
      TCheckAction.DeleteTCheck(row.id).then((result) => {
        const { res, flag, error } = result.data;
        if (flag === "1") {
          ElMessage.success("删除成功");
          queryList();
        } else {
          ElMessage.success(error || "未知异常...");
        }
      });
    })
    .then(() => {
      queryList();
    })
    .catch(() => {
      ElMessage({
        type: "info",
        message: "取消删除成功!",
      });
    });
};

//val =0 计划新增 =1 计划编辑 =2 明细新增 =3 明细编辑
const cancel = () => {
  if (state.currentType === 0) {
    state.tcheck_formData = {} as TCheckModel;
    state.tcheck_dialog.visible = false;
  } else if (state.currentType === 1) {
    state.tcheck_formData = {} as TCheckModel;
    state.tcheck_dialog.visible = false;
  } else if (state.currentType === 2) {
    state.dynamicTags = [] as string[],
      state.tcheckdetail_formData = {} as TCheckDto;
    state.tcheckdetail_dialog.visible = false;
  } else if (state.currentType === 3) {
    state.tcheckstop_formData = {} as TCheckModel;
    state.tcheckstop_dialog.visible = false;
  }
};

let timeout: NodeJS.Timeout;
const querySearchAsync = (
  queryString: string,
  callback: (arg: any) => void
) => {
  links.value = [] as LinkItem[];
  if (!isNull(queryString)) {
    DeviceAction.QueryDeviceAccList(state.deviceParams)
      .then((result) => {
        if (result.status === 200) {
          const { res, flag, error } = result.data;
          if (flag === "1") {
            const pageData = res as PageResult<DeviceAccModel[]>;
            pageData.list.forEach(element => {
              let link = {} as LinkItem;
              link.link = (element as DeviceAccModel).id.toString();
              link.value = (element as DeviceAccModel).deviceSn;
              links.value.push(link);
            });

            clearTimeout(timeout);
            timeout = setTimeout(() => {
              callback(links.value);
            }, 2000);
          } else {
            ElMessage.success(error || "未知异常...");
          }
        }
      }).catch((error) => {
        ElMessage.success(error || "未知异常...");
      });
  }
};

const createFilter = (queryString: string) => {
  return (restaurant: LinkItem) => {
    return (
      restaurant.value.toLowerCase().indexOf(queryString.toLowerCase()) === 0
    )
  }
}

const handleSelect = (item: LinkItem) => {
  if (state.dynamicTags.indexOf(item.value) === -1) {
    dynamicTags.value.push(item.value)
  } else {
    ElMessage.warning("该设备已添加!!");
  }
};

//根据传进来的状态改变建议输入框的状态（展开|隐藏）
const changeStyle = (status: any, className: any) => {
  let dom = document.querySelectorAll(className);
  dom[0].style.display = status;
};

const handleKeyup = (item: any) => {
  changeStyle("none", ".el-autocomplete-suggestion");
  if (state.deviceParams.deviceSn?.length == 11) {
    if (state.dynamicTags.indexOf(state.deviceParams.deviceSn) === -1) {
      if (links.value.length === 1) {
        dynamicTags.value.push(state.deviceParams.deviceSn)
      } else {
        ElMessage.warning("编号不在台账中!!");
      }
    } else {
      ElMessage.warning("该设备已添加!!");
    }
  }
};

const handleClose = (tag: string) => {
  dynamicTags.value.splice(dynamicTags.value.indexOf(tag), 1)
}

onMounted(() => {
  window.onresize = function () {
    tcheck_tableHeight.value = document.documentElement.clientHeight - 190;
    data_tableHeight.value = document.documentElement.clientHeight - 120;
  };
  queryList();
});

const handleDelDev = (row: TCheckDetailModel) => {
  ElMessageBox.confirm(" 是否删除设备[" + row.deviceSn + "]? ", "提示", {
    cancelButtonText: "取消",
    confirmButtonText: "确认",
    type: "warning",
    center: true,
  })
    .then(() => {
      TCheckAction.DeleteTCheckDetail(row.id).then((result) => {
        const { res, flag, error } = result.data;
        if (flag === "1") {
          ElMessage.success("删除成功");
          queryTCheckDetailList();
          updateCheckView(row.checkId);
        } else {
          ElMessage.success(error || "未知异常...");
        }
      });
    })
    .then(() => {
      //queryList();
    })
    .catch(() => {
      ElMessage({
        type: "info",
        message: "取消删除成功!",
      });
    });
};

//增加和删除明细后,刷新当前主记录
const updateCheckView = (checkId: string) => {
  TCheckAction.FindBycheckByIdWithMx(checkId).then((result) => {
    const { res, flag, error } = result.data;
    if (flag === "1") {
      let checkModel = res as TCheckModel;

      let index = state.tcheck_tableData.findIndex(s => s.checkId === checkId);
      if (index !== -1) {
        state.tcheck_tableData[index] = checkModel;
        currentRow.value = checkModel;
      }
    }
  });
}

//添加批量拷机任务 2022-10-15 guozhao
const addBatchCfgTask = (val: TCheckModel) => {
  state.select_tcheck = val;
  if (val.startTime) {
    if (val.endTime) {
      state.taskType = 2;
    } else {
      state.taskType = 1;
    }
  } else {
    state.taskType = 0;
  }
  state.isAdd = true;
  state.taskDialog = {
    title: "新增批量任务",
    visible: true,
    disabled: false,
  };
}

const dialogClose = () => {
  state.taskDialog = {
    title: "",
    visible: false,
    disabled: true,
  };
}

//子组件保存或取消的返回值
const childMethod = (val: Boolean) => {
  queryList();
  dialogClose();
}

const inputLostFoucs = (event: any) => {
  if (event.target.value.length === 10) {
    event.target.value = '0' + event.target.value;
  }
  else if (event.target.value.length < 10) {
    return;
  }

  state.barCodeDetails.forEach(s => {
    if (s.deviceSn && event.target.value.includes(s.deviceSn)) {
      DeviceAccAction.FindDeviceAccBysn(event.target.value).then((result) => {
        const { res, flag, error } = result.data;
        if (flag != undefined && flag == 1) {
          s.accFlag = res ? 1 : 0;
          s.deviceSn = event.target.value;
        }
      });

      if (state.currentRowModel.mcuVersion) {
        TAireadAction.QueryLatestTAireadByDeviceSn(event.target.value).then((result) => {
          const { res, flag, error } = result.data;
          if (flag != undefined && flag == 1) {
            let readModel = res as TAireadModel;
            s.verFlag = readModel && readModel.softVer === state.currentRowModel.mcuVersion ? 1 : 0;
          }
        });
      }
    }
  }
  )
}

const checkExpandChange = (row: any, expandedRows: any, exexpanded: boolean) => {
  if (expandedRows.length > 0 && row) {//展开了
    state.select_tcheck = row;
    state.tcheckdetail_tableData = [] as TCheckDetailModel[];
    state.tairead_tableData = [] as TAireadModel[];
    queryTCheckDetailList();
  }
}

/**
 * 获取展开计划所有设备最新的一条数据
 * @param row 
 */
const getDetailsLatestAiread = (row: any) => {
  TCheckAction.FindCheckDetailLatestAiRead(row).then((result) => {
    const { res, flag, error } = result.data;
    if (flag != undefined && flag == 1) {
      const pageData = res as PageResult<TAireadModel[]>;

      pageData.list.forEach(element => {
        element.srcList = [];
        element.alist = [];
        element.blist = [];
        if (element.smallJpgUrl) {
          element.src = element.smallJpgUrl;
          element.srcList.push(element.smallJpgUrl);
        }

        if (element.bigJpgUrl) {
          element.src = element.bigJpgUrl;
          element.srcList.push(element.bigJpgUrl);
        }

        if (element.szsbz) {
          let alist = element.szsbz.split(",");
          element.alist = alist;
        }

        if (element.szsbgl) {
          let blist = element.szsbgl.split(",");
          element.blist = blist;
        }

        if (element.serverReadModel != null) {
          if (!tool.stringIsNullOrEmpty(element.serverReadModel.jpgUrl)) {
            element.srcList.push(element.serverReadModel.jpgUrl);
          }

          if (!tool.stringIsNullOrEmpty(element.serverReadModel.smallJpgUrl)) {
            element.srcList.push(element.serverReadModel.smallJpgUrl);
          }
        }
      });
      state.tairead_tableData = pageData.list;
      state.tairead_total = pageData.total;
    }
  });
}

/**
 * 翻译拷机状态
 * @param val
 */
const getStatusByTCheckModel = (val: TCheckModel) => {
  if (isNull(val.startTime)) {
    return '[未开始]';
  } else if (isNull(val.endTime)) {
    return '[拷机中]';
  } else {
    return '[已完成]';
  }
}

const getSelectRowKeys = (row: any) => {
  return row.id.toString();
};

const expandStatus = ref(false);
const toogleExpand = (row: any) => {
  if (!checkTable.value) return;

  if (checkTable != null && checkTable.value != null) {

    state.tcheck_tableData.map((item) => {
      if (row.id != item.id) {
        checkTable.value!.toggleRowExpansion(item, false)
      }
    })
    //如果是展开的则收缩
    checkTable.value!.toggleRowExpansion(row, !expandStatus.value);
    expandStatus.value = !expandStatus.value;
    if (!expandStatus.value) {//收缩起来的,清空明细
      state.tcheckdetail_tableData = [];
      state.tcheck_total = 0;
      state.tairead_tableData = [];
      state.tairead_total = 0;
    }
  }
}

const showChart = (row: TCheckDetailModel) => {
  if (!state.taireadParams.deviceSn) {//防止第一次点击时,还未赋上值
    state.taireadParams.deviceSn = row.deviceSn;
    state.taireadParams.startTime = row.startTime;
    state.taireadParams.endTime = row.endTime;
  }

  state.chart_dialog = {
    title: "拷机数据图表[" + row.deviceSn + "]",
    visible: true,
    disabled: false,
  };
}

const chartdialogClose = () => {
  state.chart_dialog = {
    title: "",
    visible: false,
    disabled: true,
  };
}

//弹出报告预览
const showCheckRpt = (row: TCheckModel) => {
  state.rptView_dialog = {
    title: "",
    visible: true,
    disabled: false,
  };
  state.rptCheckData = row;
}

//预览后街主窗体关闭后触发的事件
const rptViewClose = () => {
  state.rptView_dialog = {
    title: "",
    visible: false,
    disabled: true,
  };
  state.rptCheckData = {} as TCheckModel;
}

//预览报告子窗体点击了关闭
const childClose = (val: Boolean) => {
  rptViewClose();
}

//显示参数配置
const showDevCfg = (row: any) => {
  state.cfgData = row as TCheckDetailModel;

  state.cfgdialog = {
    title: "设备参数预览[" + state.cfgData.deviceSn + "]",
    visible: true,
    disabled: false,
  };
}

//校验设备配置(现在只判断采样间隔)
const checkConfig = (row: any) => {
  TCheckAction.CheckSampleIntervalByCheckDetails(row).then((result) => {
    const { res, flag, error } = result.data;
    if (flag != undefined && flag == 1) {
      ElMessageBox.alert(res);
    }
  });
}

// const closeViewer=()=>{
//   state.showViewer=false;
//   state.picList=[];
// }

// const imgClick = (list: string[]) => {
//   state.showViewer=true;
//   state.picList=list;
// }
</script>

<style lang="scss" scoped>
.card-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

::v-deep .el-checkbox__label {
  display: inline-grid;
  white-space: pre-line;
  word-wrap: break-word;
  overflow: hidden;
  line-height: 20px;
  vertical-align: middle;
}

.button {
  margin: 10px 0;
}

.infinite-list {
  height: 300px;
  padding: 0;
  margin: 0;
  list-style: none;
}

.infinite-list .infinite-list-item {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 50px;
  background: var(--el-color-primary-light-9);
  margin: 10px;
  color: var(--el-color-primary);
}

.infinite-list .infinite-list-item+.list-item {
  margin-top: 10px;
}

.el-row {
  margin-bottom: 20px;
}

.el-row:last-child {
  margin-bottom: 0;
}

.el-col {
  border-radius: 4px;
}

.grid-content {
  border-radius: 4px;
  min-height: 36px;
}

.el-dropdown {
  margin-left: 15px;
}

.el-dropdown-link {
  cursor: pointer;
  color: var(--el-color-primary);
  display: flex;
  align-items: center;
}

::v-deep .el-table__body tr.current-row>td {
  color: #fff;
  background: #6db3fa !important;
}

.big_box {
  width: 100%;
  height: 640px;
  display: flex;
  justify-content: space-between;
}

/* 设置大盒子的布局为flex布局 */
.left_box {
  width: 60%;
  height: 100%;
  display: flex;
  flex-direction: column;
}

.left_box_full {
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;
}

.right_box {
  width: 45%;
  height: 95%;
  border-radius: 5px 5px 0 0;
  border: 1px solid rgb(204, 204, 204);
  margin-left: 5px;
}

.right_box_header {
  width: 100%;
  height: 60px;
  display: flex;
  justify-content: left; //水平居中
  align-items: center; //垂直居中
}

.right_box_content {
  width: 100%;
  height: 40px;
  border-top: 1px solid rgb(204, 204, 204);
}

// 页面大容器
.title {
  font-size: 30px;
  width: 100%;
}

.main_left {
  float: left;
  width: 580px;
}

.main_right {
  margin-left: 590px;
  // display: flex;
  // justify-content:left;
  // width: 50%;
  //width: calc(100vw - 820px);
  //width: 100%;
}

.my-label {
  background: var(--el-color-success-light-9);
}

.my-content {
  background: var(--el-color-danger-light-9);
}

//ADD时的样式
.add_big_box {
  width: 100%;
  height: 450px;
  display: flex;
  justify-content: space-between;
}

.add_left_box {
  width: 55%;
  height: 100%;
  display: flex;
  flex-direction: column;
  border-radius: 5px 5px 0 0;
  border: 1px solid rgb(204, 204, 204);
}

.add_left_box_full {
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;
}

.add_right_box {
  width: 45%;
  height: 100%;
  border-radius: 5px 5px 0 0;
  border: 1px solid rgb(204, 204, 204);
  margin-left: 5px;
}

.add_right_box_header {
  width: 100%;
  height: 60px;
  display: flex;
  justify-content: left; //水平居中
  align-items: center; //垂直居中
  margin-left: 15px;
}

.add_right_box_content {
  width: 100%;
  height: 40px;
  border-top: 1px solid rgb(204, 204, 204);
}
</style>