<template>
  <div class="mainCss">
    <div class="pageRight_none">
      <a-tabs v-model="hasStat" type="card" ref="topContainer" @tabClick="handleClick">
        <a-tab-pane key="113" tab="业务股问题处置" v-if="readOnlyRole == 'display'"></a-tab-pane>
        <a-tab-pane key="111" tab="监督股问题处置" v-if="readOnlyRole == 'display'"></a-tab-pane>
        <a-tab-pane key="112" tab="局领导问题处置" v-if="readOnlyRole == 'display'"></a-tab-pane>
      </a-tabs>
      <div class="content">
        <a-form layout="inline" style="padding-left: 10px; display: flex; flex-wrap: wrap; align-items: flex-end; gap: 8px 24px; margin-bottom: 1%;">
          <a-form-item label="督查事项" style="white-space: nowrap; flex-shrink: 0; margin-bottom: 0;">
            <a-select v-model="cwsCode" placeholder="请选择" allow-clear mode="tags" style="width: 200px;">
              <a-select-option v-for="item in dcTypeList" :key="item.dictTypeNum" :value="item.dictTypeNum">{{ item.nm }}</a-select-option>
            </a-select>
          </a-form-item>
          <a-form-item label="对象名称" style="white-space: nowrap; flex-shrink: 0; margin-bottom: 0;">
            <a-input v-model="searchParam.nm" />
          </a-form-item>
          <a-form-item style="margin-bottom: 0;">
            <a-button type="primary" v-if="(hasStat=='111' || hasStat=='112' || hasStat=='121' || hasStat=='122') && activeName=='approval'" @click="batchSubmit">批量审核</a-button>
          </a-form-item>
          <a-form-item style="margin-bottom: 0;">
            <a-button type="primary" @click="search">查询</a-button>
          </a-form-item>
          <a-form-item style="margin-bottom: 0;">
            <a-button type="primary" @click="resetSearch" v-if="hasStat=='121' && activeName=='list'">重置</a-button>
          </a-form-item>
          <a-form-item style="margin-bottom: 0;">
            <a-button type="primary" @click="batchDelete" v-if="activeName == 'approval'">批量删除</a-button>
          </a-form-item>
        </a-form>
        <a-table
          :columns="columns"
          :data-source="tableData_sum"
          :pagination="false"
          row-key="pblmId"
          :row-class-name="rowClassName"
          style="width: 100%;"
          :row-selection="{
            columnWidth: 30,
            selectedRowKeys: selectedRowKeys,
            onChange: handleSelectionChange,
          }"
          :style="{ height: tableHeight-100 + 'px' }"
          :scroll="{ x: true, y: tableHeight - 160 }"
          bordered>
          <template #bodyCell="{ column, record, text, index }">
            <template v-if="column.slots?.customRender === 'index'">
              <a-tooltip placement="topLeft">
                <template #title>
                <span>{{ (pageNum - 1) * pageSize + (index + 1) }}</span>
              </template>
              <span>{{ (pageNum - 1) * pageSize + (index + 1) }}</span>
            </a-tooltip>
            </template>
            <template v-else-if="column.slots?.customRender === 'tooltipCell'">
              <a-tooltip placement="topLeft" :title="text">
                <span>{{ text }}</span>
              </a-tooltip>
            </template>
            <template v-else-if="column.slots?.customRender === 'zgOrgId'">
              <a-tooltip placement="topLeft">
                <template #title>
                <span v-if="!record.zgXianOrgId"></span>
                <span v-if="record.zgXianOrgId == '1'">县级</span>
                <span v-else-if="record.zgXianOrgId == '2' || record.zgXianOrgId == '3'">市级</span>
                <span v-else>省级</span>
              </template>
              <span v-if="!record.zgXianOrgId"></span>
              <span v-if="record.zgXianOrgId == '1'">县级</span>
              <span v-else-if="record.zgXianOrgId == '2' || record.zgXianOrgId == '3'">市级</span>
              <span v-else>省级</span>
            </a-tooltip>
            </template>
            <template v-else-if="column.slots?.customRender === 'zgXianOrgId'">
              <a-tooltip placement="topLeft">
                <template #title>
                <span v-if="!record.zgXianOrgId"></span>
                <span v-if="record.zgXianOrgId == '1'">县级自查</span>
                <span v-if="record.zgXianOrgId == '2'">市级自查</span>
                <span v-if="record.zgXianOrgId == '3'">市级抽查</span>
                <span v-if="record.zgXianOrgId == '4'">省级抽查-县整改</span>
                <span v-if="record.zgXianOrgId == '5'">省级抽查-市整改</span>
                <span v-if="record.zgXianOrgId == '6'">省级抽查-直管县</span>
                <span v-if="record.zgXianOrgId == '7'">省级处置</span>
              </template>
              <span v-if="!record.zgXianOrgId"></span>
              <span v-if="record.zgXianOrgId == '1'">县级自查</span>
              <span v-if="record.zgXianOrgId == '2'">市级自查</span>
              <span v-if="record.zgXianOrgId == '3'">市级抽查</span>
              <span v-if="record.zgXianOrgId == '4'">省级抽查-县整改</span>
              <span v-if="record.zgXianOrgId == '5'">省级抽查-市整改</span>
              <span v-if="record.zgXianOrgId == '6'">省级抽查-直管县</span>
              <span v-if="record.zgXianOrgId == '7'">省级处置</span>
            </a-tooltip>
            </template>
            <template v-else-if="column.slots?.customRender === 'zgDate'">
              <a-tooltip placement="topLeft">
                <template #title>
                <span>{{ timestampToTime(record.zgDate) }}</span>
              </template>
              <span>{{ timestampToTime(record.zgDate) }}</span>
            </a-tooltip>
            </template>
            <template v-else-if="column.slots?.customRender === 'action'">
              <a-button icon="eye" type="link" @click="showDialog(record)"></a-button>
            <a-button icon="edit" type="link" @click="editDialog(record)" v-if="activeName=='approval'"></a-button>
            </template>
            <template v-else>
              {{ text }}
            </template>
          </template>
        </a-table>
        <a-pagination v-model:pageSize="pageSize" :total="total" :show-total="total => `共${total}条`" @change="handleCurrentChange" style="margin-top: 10px;" />

        <a-modal
          width="80%"
          class="outerDialog custom_dialog"
          :title="editDialogTitle"
          :open="changeSupervisionVisible"
          style="padding: 10px 20px;"
          @cancel="changeSupervisionVisible = false">
          <div class="scroll300">
            <div style="width:40%;overflow-y:auto;max-height:52vh;float:left;border:1px solid #d5d5ff;margin-right:5px;">
              <p style="font-weight:bolder;background-color:#d5d5ff;padding:3px;">基本信息</p>
              <a-form :model="changeSupervision" ref="changeSupFrom">
                <a-form-item label="对象名称" prop="nm">
                  <span>{{ changeSupervision.nm || '' }}</span>
                </a-form-item>
                <a-form-item label="问题类别" prop="inspPblmsName">
                  <span>{{ changeSupervision.inspPblmsName || '' }}</span>
                </a-form-item>
                <a-form-item label="检查项目" prop="checkPoint">
                  <span>{{ changeSupervision.checkPoint || '' }}</span>
                </a-form-item>
                <a-form-item label="问题描述" prop="pblmDesc">
                  <span>{{ changeSupervision.pblmDesc || '' }}</span>
                </a-form-item>
                <a-form-item label="详细描述" prop="inspPblmDesc">
                  <a-textarea v-model="changeSupervision.inspPblmDesc" :rows="2" allow-clear></a-textarea>
                </a-form-item>
                <a-form-item label="是否为典型问题">
                  <a-select v-model="changeSupervision.ifCasePblm" placeholder="请选择" allow-clear style="width: 200px;">
                    <a-select-option v-for="item in supervision" :key="item.value" :value="item.value">{{ item.label }}
                    </a-select-option>
                  </a-select>
                </a-form-item>
                <a-form-item label="严重程度">
                  <span v-if="changeSupervision.inspPblmCate=='0'">一般</span>
                  <span v-if="changeSupervision.inspPblmCate=='1'">较重</span>
                  <span v-if="changeSupervision.inspPblmCate=='2'">严重</span>
                  <span v-if="changeSupervision.inspPblmCate=='3'">特别严重</span>
                </a-form-item>
                <a-form-item label="备注" prop="note">
                  <span>{{ changeSupervision.note || '' }}</span>
                </a-form-item>
                <a-form-item label="上报人" prop="persName">
                  <span>{{ changeSupervision.persName || '' }}</span>
                </a-form-item>
                <a-form-item label="上报时间" prop="collTime">
                  <span>{{ formatD(changeSupervision.collTime) }}</span>
                </a-form-item>
                <a-form-item label="整改时限" prop="zgDate">
                  <span>{{ formatD(changeSupervision.zgDate) }}</span>
                </a-form-item>
                <a-form-item label="整改要求" prop="pblmSggtn">
                  <span>{{ changeSupervision.pblmSggtn || '' }}</span>
                </a-form-item>
              </a-form>
            </div>
            <div
              style="width: 58%;float: left;border: 1px solid rgb(213, 213, 255);margin-right: 5px;overflow-y: auto;max-height: 52vh;height:500px;">
              <p style="font-weight:bolder;background-color:#d5d5ff;padding:3px;">多媒体信息</p>
              <a-tabs style="margin:0px 5px">
                <a-tab-pane key="1" :tab="picturetabName">
                  <!-- <a-row style="text-align: right;">
                    <a-button v-if="!addPicPanel ? addPicPanel : addPicPanel" size="small" type="link"
                      :icon="!addPicPanel ? 'plus-circle' : 'close-circle'" @click="addPic">{{ !addPicPanel ? "添加"
                      : "取消"
                      }}
                    </a-button>
                  </a-row>
                  <a-row v-show="addPicPanel">
                    <upload ref="uploadFile" :url="`/pdcApi/file/insert?bizId=`" @uploadOver="removeNewSupervision">
                    </upload>
                  </a-row> -->
                  <a-row>
                    <div style="overflow-y:auto;overflow-x:hidden;max-height:30vh;padding:10px;">
                      <div class="upload-container">
                        <div v-for="(item, index) in pictureArray" :key="index" class="image-preview image-app-preview">
                          <div class="image-preview-wrapper">
                            <img :src="`${hostUrl}/${item.filePath}`">
                            <div class="image-preview-action">
                              <a-icon type="delete" @click="removeFile(item.id)" />
                            </div>
                          </div>
                        </div>
                      </div>
                    </div>
                  </a-row>
                </a-tab-pane>
                <a-tab-pane key="2" :tab="audiotabName">
                  <a-table bordered :data-source="audioArray" :columns="columns2" style="width: 100%;margin: 0 auto;">
                    <template #bodyCell="{ column, record, text, index }">
                      <template v-if="column.slots?.customRender === 'audio'">
                        <elaudio style="margin-left:15%;width:100px;height:30px;" :theUrl="`${hostUrl}/${record.filePath}`">
                        </elaudio>
                      </template>
                      <template v-else-if="column.slots?.customRender === 'action'">
                        <a-button size="small" @click="removeFile(record.id, index)" type="danger">删除</a-button>
                      </template>
                      <template v-else>
                        {{ text }}
                      </template>
                    </template>
                  </a-table>
                </a-tab-pane>
                <a-tab-pane key="3" :tab="videotabName">
                  <a-table bordered :data-source="videoArray" :columns="columns3" style="width: 100%;margin: 0 auto;">
                    <template #bodyCell="{ column, record, text, index }">
                      <template v-if="column.slots?.customRender === 'video'">
                        <video-player class="vjs-custom-skin" ref="videoPlayer" :options="record" :playsinline="true">
                        </video-player>
                      </template>
                      <template v-else-if="column.slots?.customRender === 'action'">
                        <a-button size="small" @click="removeFile(record.id, index)" type="danger">删除</a-button>
                      </template>
                      <template v-else>
                        {{ text }}
                      </template>
                    </template>
                  </a-table>
                </a-tab-pane>
                <a-tab-pane key="4" :tab="filetabName">
                  <a-table bordered :data-source="videoArray" :columns="columns4" style="width: 100%;margin: 0 auto;">
                    <template #bodyCell="{ column, record, text, index }">
                      <template v-if="column.slots?.customRender === 'txt'">
                        <a :href="`${hostUrl}/${record.filePath}`" target="_blank" rel="noopener noreferrer">
                        {{ record.fileName }}
                      </a>
                      </template>
                      <template v-else-if="column.slots?.customRender === 'action'">
                        <a-button size="small" @click="removeFile(record.id, index)" type="danger">删除</a-button>
                      </template>
                      <template v-else>
                        {{ text }}
                      </template>
                    </template>
                  </a-table>
                </a-tab-pane>
              </a-tabs>
            </div>
          </div>
          <div style="padding: 10px 0px;max-width: 99%;">
            <p style="font-weight:bolder;background-color:#d5d5ff;padding:3px;">处置意见</p>
            <a-table
              :columns="columns5"
              :data-source="ApprovalHistory"
              :loading="loading"
              :pagination="false"
              row-key="id"
              style="width: 100%;"
              bordered>
              <template #bodyCell="{ column, record, text, index }">
                <template v-if="column.slots?.customRender === 'isag'">
                  <span
                  style="padding: 3px 10px;background:#00ff00;border-radius:15px;color:rgba(0,0,0,1)"
                  v-if="record.isag == 1">同意</span>
                <span
                  style="padding: 3px 10px;background:#ffcc33;border-radius:15px;color:rgba(0,0,0,1)"
                  v-if="record.isag == 0">退回</span>
                </template>
                <template v-else-if="column.slots?.customRender === 'moddate'">
                  {{ record.moddate ? formatD(record.moddate) : '' }}
                </template>
                <template v-else>
                  {{ text }}
                </template>
              </template>
            </a-table>
          </div>
          <div v-if="editDialogTitle=='问题审核' && activeName=='approval'">
            <a-textarea
              :rows="2"
              placeholder="请输入您的处置意见"
              v-model="bisInspPblmAudit.auditidea"
              allow-clear
              style="width:100%;"></a-textarea>
          </div>
          <template #footer>
            <a-button type="primary" @click="ProcMoveNext(0)" v-if="editDialogTitle=='问题审核' && activeName=='approval' && hasStat!='113' && hasStat!='123'">退回</a-button>
            <a-button type="primary" @click="ProcMoveNext(1)" v-if="editDialogTitle=='问题审核' && activeName=='approval'">提交</a-button>
            <a-button type="primary" @click="saveBase()" v-if="editDialogTitle=='问题审核' && activeName=='approval'">保存基本信息</a-button>
            <a-button @click="changeSupervisionVisible = false">取消</a-button>
          </template>
        </a-modal>

        <a-modal
          class="outerDialog custom_dialog"
          title="整改信息"
          :open="changeInfoVisible"
          width="500px"
          style="height:400px !important;"
          @cancel="changeInfoVisible = false"
          :footer="null">
          <a-form style="width: 100%;">
            <a-form-item label="整改时限" prop="changeTm">
              <a-date-picker v-model="changeTm" allow-clear style="width: 300px!important;" placeholder="整改时限">
              </a-date-picker>
            </a-form-item>
            <a-form-item label="整改要求" prop="changeRequire">
              <a-textarea
                v-model="changeRequire"
                allow-clear
                :rows="2"
                placeholder="整改要求"
                style="width: 300px !important;"></a-textarea>
            </a-form-item>
            <a-form-item>
              <a-button type="primary" @click="submitRectification">提交</a-button>
              <a-button @click="changeInfoVisible = false">取消</a-button>
            </a-form-item>
          </a-form>
        </a-modal>
      </div>
    </div>
  </div>
</template>

<script>
import { deleteFileById, showDetailsXq } from '../../api/duChaAPI.js';
import { hostUrl } from '../../utils/global_variable.js';
import request from '../../utils/gw_ajax_request.js';
import { dateFormat, formatD } from '../../utils/gw_date';
import elaudio from '../../widgets/elAudioShort.vue';
export default {
  components: {
    elaudio,
  },
  data() {
    return {
      activeName: 'approval',
      cwsCode: [],
      searchParam: {
        nm: '',
        cwsCode: undefined,
      },
      tableData_sum: [],
      pageNum: 1,
      pageSize: 10,
      total: 0,
      dcTypeList: [],
      tableHeight: window.innerHeight - 245,
      multipleSelection: [],
      selectedRowKeys: [],
      columns: [
        {
          title: '序号',
          slots: { customRender: 'index' },
          width: 50,
          align: 'center',
          customCell: () => {
            return {
              style: {
                maxWidth: '50px',
                overflow: 'hidden',
                whiteSpace: 'nowrap',
                textOverflow: 'ellipsis',
              },
            };
          },
        },
        {
          title: '市',
          dataIndex: 'city',
          width: 100,
          align: 'center',
          slots: { customRender: 'tooltipCell' },
          customCell: () => {
            return {
              style: {
                maxWidth: '100px',
                overflow: 'hidden',
                whiteSpace: 'nowrap',
                textOverflow: 'ellipsis',
              },
            };
          },
        },
        {
          title: '县',
          dataIndex: 'country',
          width: 100,
          align: 'center',
          slots: { customRender: 'tooltipCell' },
          customCell: () => {
            return {
              style: {
                maxWidth: '100px',
                overflow: 'hidden',
                whiteSpace: 'nowrap',
                textOverflow: 'ellipsis',
              },
            };
          },
        },
        {
          title: '督查事项',
          dataIndex: 'cwsName',
          width: 180,
          align: 'center',
          slots: { customRender: 'tooltipCell' },
          customCell: () => {
            return {
              style: {
                maxWidth: '180px',
                overflow: 'hidden',
                whiteSpace: 'nowrap',
                textOverflow: 'ellipsis',
              },
            };
          },
        },
        {
          title: '问题所属',
          slots: { customRender: 'zgOrgId' },
          width: 100,
          align: 'center',
          customCell: () => {
            return {
              style: {
                maxWidth: '100px',
                overflow: 'hidden',
                whiteSpace: 'nowrap',
                textOverflow: 'ellipsis',
              },
            };
          },
        },
        {
          title: '问题来源',
          slots: { customRender: 'zgXianOrgId' },
          width: 130,
          align: 'center',
          customCell: () => {
            return {
              style: {
                maxWidth: '130px',
                overflow: 'hidden',
                whiteSpace: 'nowrap',
                textOverflow: 'ellipsis',
              },
            };
          },
        },
        {
          title: '对象名称',
          dataIndex: 'nm',
          width: 120,
          align: 'center',
          slots: { customRender: 'tooltipCell' },
          customCell: () => {
            return {
              style: {
                maxWidth: '120px',
                overflow: 'hidden',
                whiteSpace: 'nowrap',
                textOverflow: 'ellipsis',
              },
            };
          },
        },
        {
          title: '问题类别',
          dataIndex: 'inspPblmName',
          width: 180,
          align: 'center',
          slots: { customRender: 'tooltipCell' },
          customCell: () => {
            return {
              style: {
                maxWidth: '180px',
                overflow: 'hidden',
                whiteSpace: 'nowrap',
                textOverflow: 'ellipsis',
              },
            };
          },
        },
        {
          title: '检查项目',
          dataIndex: 'checkPointBz',
          width: 180,
          align: 'center',
          slots: { customRender: 'tooltipCell' },
          customCell: () => {
            return {
              style: {
                maxWidth: '180px',
                overflow: 'hidden',
                whiteSpace: 'nowrap',
                textOverflow: 'ellipsis',
              },
            };
          },
        },
        {
          title: '问题描述',
          dataIndex: 'pblmDescBz',
          width: 180,
          align: 'center',
          slots: { customRender: 'tooltipCell' },
          customCell: () => {
            return {
              style: {
                maxWidth: '180px',
                overflow: 'hidden',
                whiteSpace: 'nowrap',
                textOverflow: 'ellipsis',
              },
            };
          },
        },
        {
          title: '整改时限',
          slots: { customRender: 'zgDate' },
          width: 120,
          align: 'center',
          customCell: () => {
            return {
              style: {
                maxWidth: '120px',
                overflow: 'hidden',
                whiteSpace: 'nowrap',
                textOverflow: 'ellipsis',
              },
            };
          },
        },
        {
          title: '整改要求',
          dataIndex: 'pblmSggtn',
          width: 180,
          align: 'center',
          slots: { customRender: 'tooltipCell' },
          customCell: () => {
            return {
              style: {
                maxWidth: '180px',
                overflow: 'hidden',
                whiteSpace: 'nowrap',
                textOverflow: 'ellipsis',
              },
            };
          },
        },
        {
          title: '操作',
          fixed: 'right',
          slots: { customRender: 'action' },
          width: 200,
          align: 'center',
        },
      ],
      currentProblemId: '',
      editDialogTitle: '',
      supervision: [
        {
          value: '1',
          label: '是',
        },
        {
          value: '0',
          label: '否',
        },
      ],
      picturetabName: '',
      pictureArray: [],
      audiotabName: '',
      audioArray: [],
      columns2: [
        {
          title: '音频',
          slots: { customRender: 'audio' },
          align: 'center',
        },
        {
          title: '操作',
          slots: { customRender: 'action' },
          align: 'center',
        },
      ],
      videotabName: '',
      videoArray: [],
      columns3: [
        {
          title: '视频',
          slots: { customRender: 'video' },
          align: 'center',
        },
        {
          title: '操作',
          slots: { customRender: 'action' },
          align: 'center',
        },
      ],
      fileArray: [],
      filetabName: '',
      columns4: [
        {
          title: '文档',
          slots: { customRender: 'txt' },
          align: 'center',
        },
        {
          title: '操作',
          slots: { customRender: 'action' },
          align: 'center',
        },
      ],
      changeSupervision: {},
      changeSupervisionVisible: false,
      ApprovalHistory: [],
      columns5: [
        {
          title: '处理人',
          dataIndex: 'moduserid',
          width: 60,
          align: 'center',
          ellipsis: true,
        },
        {
          title: '处理环节',
          dataIndex: 'name',
          width: 60,
          align: 'center',
          ellipsis: true,
        },
        {
          title: '处理动作',
          slots: { customRender: 'isag' },
          width: 60,
          align: 'center',
          ellipsis: true,
        },
        {
          title: '处理意见',
          dataIndex: 'auditidea',
          width: 60,
          align: 'center',
          ellipsis: true,
        },
        {
          title: '处理时间',
          slots: { customRender: 'moddate' },
          width: 60,
          align: 'center',
          ellipsis: true,
        },
      ],
      bisInspPblmAudit: {},
      loading: false,
      changeInfoVisible: false,
      changeTm: '',
      changeRequire: '',
      hasStat: '113',
      readOnlyRole: localStorage.getItem('readOnlyRole'),
    };
  },
  computed: {
    userId() {
      return localStorage.getItem('persId')
        ? localStorage.getItem('persId')
        : '';
    },
    hostUrl() {
      return hostUrl;
    },
    formatD() {
      return formatD;
    },
  },
  watch: {
    $route(n, o) {
      // this.hasStat = "113"
      this.search();
    },
  },
  created() {
    this.getObjType();
    if (this.readOnlyRole == 'hide') {
      // this.activeName = 'view'
      // this.search()
    }
  },
  mounted() {
    this.search();
  },
  methods: {
    handleClick(name) {
      this.hasStat = name;
      this.pageSize = 10;
      this.pageNum = 1;
      this.clearSelection();
      this.search();
    },
    search() {
      this.searchParam.pageNum = this.pageNum;
      this.searchParam.pageSize = this.pageSize;
      this.searchParam.cwsCode = this.cwsCode.join(',');
      request
        .post(
          `/dc/insp/pblm/detail/list/${this.activeName}/${this.hasStat}`,
          this.searchParam,
        )
        .then((res) => {
          if (res.success) {
            this.tableData_sum = res.data.list;
            this.total = res.data.total;
          }
        });
    },
    batchDelete() {
      if (this.multipleSelection.length > 0) {
        var params = [];
        for (var i = 0; i < this.multipleSelection.length; i++) {
          params.push(this.multipleSelection[i].pblmId);
        }
        this.loading = true;
        this.$confirm({
          title: '提示',
          content: '确定要批量删除吗？',
          okType: 'warning',
          onOk: () => {
            request
              .post('/dc/insp/pblm/del?ids=' + params.join(','))
              .then((res) => {
                if (res.success) {
                  this.clearSelection();
                  this.search();
                  this.loading = false;
                  this.$message.success('操作成功');
                } else {
                  this.loading = false;
                  this.$message.error(res.message);
                }
              });
          },
        });
      } else {
        this.$message.warning('请选择需要操作的问题!');
      }
    },
    getObjType() {
      const params = {
        type: 'other',
        year: new Date().getFullYear().toString(),
      };
      request
        .post('/bis/insp/BisInspProblemRelation/getNewTimePlanList', params)
        .then((res) => {
          if (res.success) {
            this.dcTypeList = res.data;
          }
        });
    },
    rowClassName(record, index) {
      if (record.dataStat == '9') {
        return 'success-delete';
      }
      return '';
    },
    handleSelectionChange(val, row) {
      this.selectedRowKeys = val;
      this.multipleSelection = row;
    },
    clearSelection() {
      this.selectedRowKeys = [];
      this.multipleSelection = [];
    },
    handleCurrentChange(val) {
      this.pageNum = val;
      this.search();
    },
    timestampToTime(val) {
      return dateFormat(val, 'yyyy-MM-dd');
    },
    showDialog(row) {
      this.editDialogTitle = '问题详情';
      this.edit(row);
    },
    editDialog(row) {
      this.editDialogTitle = '问题审核';
      this.edit(row);
    },
    edit(row) {
      this.currentProblemId = row.pblmId;
      this.pictureArray = [];
      this.audioArray = [];
      this.videoArray = [];
      this.fileArray = [];
      showDetailsXq(row.pblmId).then((res) => {
        if (res.success && res.data) {
          this.changeSupervision = res.data;
          this.changeSupervisionVisible = true;
          if (res.data.gwComFiles) {
            res.data.gwComFiles.forEach((item) => {
              if (
                item.fileExt == 'mp3' ||
                item.fileExt == 'MP3' ||
                item.fileExt == 'm4a'
              ) {
                this.audioArray.push(item);
              } else if (
                item.fileExt == 'jpg' ||
                item.fileExt == 'JPG' ||
                item.fileExt == 'png' ||
                item.fileExt == 'PNG' ||
                item.fileExt == 'JPEG' ||
                item.fileExt == 'jpeg'
              ) {
                this.pictureArray.push(item);
              } else if (item.fileExt == 'mp4' || item.fileExt == 'MP4') {
                this.videoArray.push({
                  id: item.id,
                  bizId: item.bizId,
                  width: '130',
                  height: '130',
                  autoplay: false,
                  muted: true,
                  language: 'en',
                  playbackRates: [0.7, 1.0, 1.5, 2.0],
                  sources: [
                    {
                      type: 'video/mp4',
                      src: this.hostUrl + item.filePath,
                    },
                  ],
                });
              } else {
                this.fileArray.push(item);
              }
            });
          }
          this.picturetabName = '图片资料(' + this.pictureArray.length + ')';
          this.audiotabName = '音频资料(' + this.audioArray.length + ')';
          this.videotabName = '视频资料(' + this.videoArray.length + ')';
          this.filetabName = '其它资料(' + this.fileArray.length + ')';
          this.getApprovalHistory();
        }
      });
    },
    // 删除图片文件
    removeFile(id, index) {
      this.$confirm({
        title: '提示',
        content: '此操作将永久删除该文件, 是否继续?',
        okType: 'warning',
        onOk: () => {
          deleteFileById(id, this.userId).then((res) => {
            if (res.success) {
              this.editDialog({ pblmId: this.currentProblemId });
            } else {
              this.$message.error('删除失败');
            }
          });
        },
      });
    },
    getApprovalHistory() {
      request
        .get(
          '/dc/insp/pblmAudit/queryList/' +
            this.changeSupervision.pblmId +
            '/1',
        )
        .then((res) => {
          if (res.success) {
            this.ApprovalHistory = res.data;
          }
        });
    },
    ProcMoveNext(flag) {
      this.bisInspPblmAudit.isag = flag;
      if (flag == 0) {
        this.bisInspPblmAudit.auditidea = this.bisInspPblmAudit.auditidea
          ? this.bisInspPblmAudit.auditidea
          : '不同意';
      }
      if (flag == 1) {
        this.bisInspPblmAudit.auditidea = this.bisInspPblmAudit.auditidea
          ? this.bisInspPblmAudit.auditidea
          : '同意';
      }
      this.bisInspPblmAudit.userId = this.userId;
      this.bisInspPblmAudit.pblmId = this.currentProblemId;
      this.bisInspPblmAudit.flowType = '1';
      if ((this.hasStat == '113' || this.hasStat == '123') && flag == 1) {
        this.changeInfoVisible = true;
      } else {
        this.submit();
      }
    },
    submit() {
      this.loading = true;
      this.$confirm({
        title: '提示',
        content:
          '确定要' +
          (this.bisInspPblmAudit.isag == 0 ? '退回' : '提交') +
          '吗？',
        okType: 'warning',
        onOk: () => {
          request
            .post('/dc/insp/pblm/batchApprove', [this.bisInspPblmAudit])
            .then((res) => {
              if (res.success) {
                this.search();
                this.loading = false;
                this.changeInfoVisible = false;
                this.changeSupervisionVisible = false;
                this.bisInspPblmAudit = {};
                this.currentProblemId = '';
                this.changeTm = '';
                this.changeRequire = '';
                this.$message.success('操作成功');
              } else {
                this.loading = false;
                this.$message.error(res.message);
              }
            });
        },
      });
    },
    saveBase() {
      var obj = {
        inspPblmDesc: this.changeSupervision.inspPblmDesc,
        ifCasePblm: this.changeSupervision.ifCasePblm,
        pblmId: this.changeSupervision.pblmId,
      };
      this.$confirm({
        title: '提示',
        content: '确定要保存基本信息吗？',
        okType: 'warning',
        onOk: () => {
          request.post('/dc/insp/pblm/update', obj).then((res) => {
            if (res.success) {
              this.$message.success('保存基本信息成功');
              this.search();
            } else {
              this.$message.error(res.message);
            }
          });
        },
      });
    },
    submitRectification() {
      if (!this.changeTm) {
        this.$message.warning('请选择整改时限!');
        return;
      }
      if (!this.changeRequire) {
        this.$message.warning('请选择整改要求!');
        return;
      }
      this.bisInspPblmAudit.zgDate = this.changeTm;
      this.bisInspPblmAudit.pblmSggtn = this.changeRequire;
      this.submit();
    },
    batchSubmit() {
      if (this.multipleSelection.length > 0) {
        var params = [];
        for (var i = 0; i < this.multipleSelection.length; i++) {
          var obj = {
            moduserid: this.userId,
            auditidea: '同意',
            pblmId: this.multipleSelection[i].pblmId,
            isag: 1,
            flowType: 1,
          };
          params.push(obj);
        }
        this.loading = true;
        this.$confirm({
          title: '提示',
          content: '确定要批量审核吗？',
          okType: 'warning',
          onOk: () => {
            request.post('/dc/insp/pblm/batchApprove', params).then((res) => {
              if (res.success) {
                this.multipleSelection = [];
                this.clearSelection();
                this.search();
                this.loading = false;
                this.$message.success('操作成功');
              } else {
                this.loading = false;
                this.$message.error(res.message);
              }
            });
          },
        });
      } else {
        this.$message.warning('请选择需要操作的问题!');
      }
    },
    resetSearch() {
      this.search();
    },
    formatCwsCode(val) {
      let name = '';
      this.dcTypeList.forEach((item) => {
        if (item.dictTypeNum == val) {
          name = item.nm;
        }
      });
      return name;
    },
  },
};
</script>

<style lang='less' scoped>
:deep(.ant-table-pagination) {
  float: left;
}

:deep(.ant-layout-sider),
:deep(.ant-layout-content) {
  background: #fff;
}

:deep(.ant-table-thead>tr>th),
:deep(.ant-table-tbody>tr>td) {
  padding: 0;
  height: 60px;
  line-height: 60px;
}

:deep(.ant-table-scroll) {
  position: relative;
  z-index: 1;
}

:deep(.ant-table-fixed-left),
:deep(.ant-table-fixed-right) {
  z-index: 2;
}
.pageRight_none {
  width: calc(100% - 20px);
  margin-left: 10px;
  box-shadow: 0 1px 6px 0 rgb(32 33 36 / 28%);
}
.content {
  width: 100%;
  height: calc(100% - 41px);
}

:deep(.success-delete) {
  background: #ffa3a8 !important;
}

.mainCss {
  width: 100%;
  height: calc(100% - 20px);
  display: flex;
  margin-top: 10px;
}
.pageLeft_none {
  display: none;
}

.pageRight {
  width: calc(100% - 330px);
  margin-left: 10px;
  box-shadow: 0 1px 6px 0 rgb(32 33 36 / 28%);
}

.pageRight_none {
  width: calc(100% - 20px);
  margin-left: 10px;
  box-shadow: 0 1px 6px 0 rgb(32 33 36 / 28%);
}

.custom_dialog .scroll300 {
  max-height: 60vh !important;
}
</style>
