<template>
  <div class="SystemInfo item-box common-info-box">
    <div class="item-title">{{ isSHILevel ? "线索研判" : "巡查处理" }}</div>
    <div class="item-body">
      <div class="NCC-common-layout">
        <div class="NCC-common-layout-center">
          <el-row class="NCC-common-search-box" :gutter="16">
            <el-form @submit.native.prevent size="mini">
              <el-col :span="5">
                <el-form-item label="">
                  <el-date-picker
                    v-model="query.creatorTime"
                    type="datetimerange"
                    value-format="timestamp"
                    format="yyyy-MM-dd HH:mm:ss"
                    start-placeholder="登记开始日期"
                    end-placeholder="登记结束日期"
                  >
                  </el-date-picker>
                </el-form-item>
              </el-col>
              <el-col :span="3">
                <el-form-item label="">
                  <el-input
                    v-model="query.platformName"
                    placeholder="请输入应用名称"
                    clearable
                  />
                </el-form-item>
              </el-col>
              <el-col :span="3">
                <el-form-item label="">
                  <el-select
                    v-model="query.platformType"
                    placeholder="请选择应用类型"
                    clearable
                  >
                    <el-option
                      v-for="(item, index) in systemTypeOptions"
                      :key="index"
                      :label="item.FullName"
                      :value="item.Id"
                    />
                  </el-select>
                </el-form-item>
              </el-col>
              <!-- <el-col :span="3">
                       <el-form-item label="">
                           <depSelect v-model="query.department" placeholder="请选择部门" />
                       </el-form-item>
                   </el-col> -->
              <el-col :span="3">
                <el-form-item label="">
                  <el-input
                    v-model="query.questionType"
                    placeholder="请选择问题类型"
                    clearable
                  />
                </el-form-item>
              </el-col>
              <el-col :span="3">
                <el-form-item>
                  <el-button
                    type="primary"
                    icon="el-icon-search"
                    @click="search()"
                    >查询</el-button
                  >
                  <el-button icon="el-icon-refresh-right" @click="reset()"
                    >重置</el-button
                  >
                </el-form-item>
              </el-col>
              <div class="NCC-common-search-box-right">
                <el-button
                  type="primary"
                  icon="el-icon-download"
                  size="mini"
                  @click="exportData()"
                  >导出</el-button
                >
              </div>
            </el-form>
          </el-row>
          <div class="NCC-common-layout-main NCC-flex-main">
            <NCC-table v-loading="listLoading" :data="list">
              <el-table-column
                show-overflow-tooltip
                prop="platformNameStr"
                label="应用名称"
                align="left"
              />
              <el-table-column
                show-overflow-tooltip
                label="应用类型"
                prop="platformType"
                align="left"
              >
                <template slot-scope="scope">{{
                  scope.row.platformNameStr || scope.row.platformName
                }}</template>
              </el-table-column>
              <el-table-column
                show-overflow-tooltip
                label="问题类型"
                prop="questionType"
                align="left"
              ></el-table-column>
              <el-table-column
                show-overflow-tooltip
                label="线索编号"
                prop="leadNumber"
                align="left"
              ></el-table-column>
              <!-- <el-table-column show-overflow-tooltip prop="link" label="有害链接" align="left" /> -->
              <!-- <el-table-column show-overflow-tooltip prop="questionClass" label="关键词" align="left" /> -->
              <el-table-column
                show-overflow-tooltip
                prop="creatorTime"
                label="录入时间"
                align="left"
                :formatter="ncc.tableDateFormat"
              />
              <el-table-column
                show-overflow-tooltip
                prop="state"
                label="状态"
                align="left"
              />
              <!-- <el-table-column show-overflow-tooltip prop="disposalSuggestions" label="处置建议" align="left" />
                   <el-table-column show-overflow-tooltip prop="id" label="主键" align="left" />
                   <el-table-column show-overflow-tooltip prop="department" label="部门" align="left" />
                   <el-table-column show-overflow-tooltip label="问题分类" prop="questionClass" align="left">
                           <template slot-scope="scope">{{ scope.row.questionClass | dynamicText(questionClassOptions) }}</template>
                   </el-table-column>
                   <el-table-column show-overflow-tooltip label="阶段" prop="stage" align="left">
                           <template slot-scope="scope">{{ scope.row.stage | dynamicText(stageOptions) }}</template>
                   </el-table-column> -->
              <el-table-column label="操作" fixed="right" width="150">
                <template slot-scope="scope">
                  <el-button
                    type="text"
                    @click="addOrUpdateHandle(scope.row.id, false, 'edit')"
                    v-if="isSHILevel && scope.row.stage == '577006666214540549'"
                    >编辑</el-button
                  >
                  <!-- 未研判 ‘577006621985604869’/未下发 ‘577006641364189019’ / 已处置 ‘577006696312866053’ 可以研判 -->
                  <!-- <el-button type="text" v-if="isSHILevel" @click="addOrUpdateHandle(scope.row.id)" :disabled="['577006621985604869', '577006641364189019', '577006696312866053'].includes(scope.row.stage) == -1">{{ scope.row.stage == '577006641364189019' ? '下发' : '研判'}}</el-button> -->
                  <el-button
                    type="text"
                    v-if="isSHILevel && scope.row.stage != '577006666214540549'"
                    @click="addOrUpdateHandle(scope.row.id)"
                    :disabled="
                      ![
                        '577006621985604869',
                        '577006641364189019',
                        '577006696312866053',
                      ].includes(scope.row.stage)
                    "
                    >研判</el-button
                  >
                  <!-- 待处置进行处理 -->
                  <el-button
                    type="text"
                    v-if="!isSHILevel"
                    @click="toHandle(scope.row.id)"
                    :disabled="scope.row.stage != '577006131314196155'"
                    >处理</el-button
                  >
                  <el-button type="text" @click="toDetail(scope.row.id)"
                    >详情</el-button
                  >
                </template>
              </el-table-column>
            </NCC-table>
            <pagination
              :total="total"
              :page.sync="listQuery.currentPage"
              :limit.sync="listQuery.pageSize"
              @pagination="initData"
            />
          </div>
        </div>
        <NCC-Form v-if="formVisible" ref="NCCForm" @refresh="refresh" />
        <HandleForm
          v-if="HandleFormVisible"
          ref="HandleForm"
          @refresh="refresh"
        />
        <ReportForm
          v-if="ReportFormVisible"
          ref="ReportForm"
          @refresh="refresh"
        />
      </div>
    </div>
  </div>
</template>
<script>
import request from "@/utils/request";
import infoMixin from "@/mixins/info";
import NCCForm from "./Form";
import HandleForm from "./HandleForm";
import {
  getListForJudge,
  previewDataInterface,
} from "@/api/systemData/dataInterface";
import ReportForm from "@/views/baseInspectionReport/Form.vue"; // 巡查处置
import define from '@/utils/define'

export default {
  components: { NCCForm, HandleForm, ReportForm },
  mixins: [infoMixin],
  data() {
    return {
      showAll: false,
      query: {
        platformName: undefined,
        platformNameStr: undefined,
        platformType: undefined,
        department: undefined,
        questionType: undefined,
        questionClass: undefined,
        creatorTime: [],
      },
      list: [],
      listLoading: true,
      multipleSelection: [],
      total: 0,
      listQuery: {
        currentPage: 1,
        pageSize: 20,
        sort: "desc",
        sidx: "",
      },
      formVisible: false,
      exportBoxVisible: false,
      columnList: [
        { prop: "platformName", label: "平台名称" },
        { prop: "platformType", label: "平台类型" },
        { prop: "questionType", label: "问题类型" },
        { prop: "link", label: "有害链接" },
        { prop: "disposalSuggestions", label: "处置建议" },
        { prop: "id", label: "主键" },
        { prop: "department", label: "部门" },
        { prop: "questionClass", label: "问题分类" },
        { prop: "stage", label: "阶段" },
      ],
      sourceOptions: [
        { fullName: "市网信办线索", id: "市网信办线索" },
        { fullName: "自主巡查发现", id: "自主巡查发现" },
      ],
      systemTypeOptions: [],
      questionTypeOptions: [],
      questionClassOptions: [
        { fullName: "选项一", id: "1" },
        { fullName: "选项二", id: "2" },
      ],
      stageOptions: [
        { fullName: "选项一", id: "1" },
        { fullName: "选项二", id: "2" },
      ],

      HandleFormVisible: false,
      ReportFormVisible: false,
    };
  },
  computed: {
    isSHILevel() {
      // 判断角色是否为‘市级办公室’
      return this.$store.state.user.islader;
    },
  },
  created() {
    this.initSystemTypeList();
    this.initData();
  },
  methods: {
    initData() {
      this.listLoading = true;
      let _query = {
        ...this.listQuery,
        ...this.query,
      };
      let query = {};
      for (let key in _query) {
        if (Array.isArray(_query[key])) {
          query[key] = _query[key].join();
        } else {
          query[key] = _query[key];
        }
      }
      getListForJudge(query).then((res) => {
        this.list = res.data.list;
        this.total = res.data.pagination.total;
        this.listLoading = false;
      });
    },

    addOrUpdateHandle(id, isDetail, type) {
      this.formVisible = true;
      this.$nextTick(() => {
        this.$refs.NCCForm.init(id, isDetail, type);
      });
    },
    search() {
      this.listQuery = {
        currentPage: 1,
        pageSize: 20,
        sort: "desc",
        sidx: "",
      };
      this.initData();
    },
    refresh(isrRefresh) {
      this.formVisible = false;
      this.HandleFormVisible = false;
      this.ReportFormVisible = false;
      if (isrRefresh) this.reset();
    },
    // 处理
    toHandle(id, isDetail) {
      this.HandleFormVisible = true;
      this.$nextTick(() => {
        this.$refs.HandleForm.init(id, isDetail);
      });
    },

    // 详情
    toDetail(id) {
      this.ReportFormVisible = true;
      this.$nextTick(() => {
        this.$refs.ReportForm.init(id, true);
      });
    },

    reset() {
      for (let key in this.query) {
        this.query[key] = undefined;
      }
      this.listQuery = {
        currentPage: 1,
        pageSize: 20,
        sort: "desc",
        sidx: "",
      };
      this.initData();
    },
    exportData() {
      let obj = {
        url: "/Extend/BaseInspectionReport/Actions/ExportByJudge",
        method: "POST",
        data: {
          ...this.query,
        },
      };
      request(obj).then((res) => {
        if (res.code != 200) return;
        const url = define.APIURl + res.data.url;
        const link = document.createElement("a");
        link.href = url;
        link.download = res.data ? res.data.name : "研判列表.xlsx";
        link.click();
      });
    },
  },
};
</script>
<style scoped lang="scss">
.common-info-box {
  :deep(.el-table__body-wrapper.is-scrolling-none) {
    height: calc(100% - 47px);
    overflow-y: scroll;
  }
}
</style>
