antissoft / NetworkInformation

  <template>

    <div class="SystemInfo item-box common-info-box">

      <div class="item-title">核查处置</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="yyyy-MM-dd HH:mm:ss" format="yyyy-MM-dd HH:mm:ss" start-placeholder="登记开始日期" end-placeholder="登记结束日期"/>

                  </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="">

                    <el-select v-model="query.reportSource" placeholder="请选择问题来源" clearable>
                      <el-option v-for="(item, index) in sourceOptions" :key="index" :label="item.FullName" :value="item.Id"/>
                    </el-select>
                  </el-form-item>
                </el-col>
                <el-col :span="3">
                  <el-form-item label="">

                    <el-select v-model="query.questionType" placeholder="请选择问题类型" clearable>
                      <el-option v-for="(item, index) in questionTypeOptions" :key="index" :label="item.fullName" :value="item.id" />
                    </el-select>
                    <!-- <el-input v-model="query.questionType" placeholder="请选择问题类型" clearable/> -->

                  </el-form-item>
                </el-col>
                <el-col :span="3">

                  <el-form-item label="">

                    <el-select v-model="query.state" placeholder="请选择状态" clearable>

                      <el-option v-for="item in stateOptions" :key="item" :label="item" :value="item"/>
                    </el-select>
                  </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"></div>

              </el-form>
            </el-row>

            <div class="btns-box">
              <el-button type="success" icon="el-icon-plus" @click="addForm()" size="mini" >新增</el-button>

              <el-button type="primary" icon="el-icon-download" size="mini" @click="exportDemo()">{{ isSHILevel ? '模板' : '线索上报模板' }}</el-button>

              <el-upload
                  class="uploadXlax"
                  :action="define.APIURl + '/api/Extend/BaseInspectionReport/Actions/ImportByExcel'"
                  :headers="uploadHeaders"
                  :on-success="uploadSuccess"
                  :on-error="uploadError"
                  :show-file-list="false"
                  name="excelfile"
                >
                  <div class="avatar-box">

                    <el-button type="warning" icon="el-icon-upload" size="mini">线索上报导入</el-button>

                  </div>
                </el-upload>
              <el-button type="primary" icon="el-icon-download" size="mini" @click="exportData()" >导出</el-button>

              <el-button v-if="!isSHILevel" type="primary" icon="el-icon-download" size="mini" @click="exportMakeDemo()">处置结果模板</el-button>

              <el-upload
                  v-if="!isSHILevel"
                  class="uploadXlax"
                  :action="define.APIURl + '/api/Extend/BaseInspectionReport/TaskBatchReport'"
                  :headers="uploadHeaders"
                  :on-success="uploadSuccess"
                  :on-error="uploadError"
                  :show-file-list="false"
                  name="excelfile"
                >
                  <div class="avatar-box">

                    <el-button type="warning" icon="el-icon-upload" size="mini">处置结果导入</el-button>

                  </div>
                </el-upload>

            </div>

            <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 label="应用类型" prop="platformType" align="left" show-overflow-tooltip>
                  <template slot-scope="scope">{{ scope.row.platformType | dynamicTextUP(systemTypeOptions) }}</template>

                </el-table-column>

                <el-table-column label="问题来源" prop="reportSource" align="left" show-overflow-tooltip>
                  <template slot-scope="scope">{{ scope.row.reportSource | dynamicTextUP(sourceOptions) }}</template>
                </el-table-column>

                <el-table-column show-overflow-tooltip label="问题类型" prop="questionTypeStr" align="left"/>

                <el-table-column show-overflow-tooltip label="线索编号" prop="leadNumber" align="left" width="180"/>

                <!-- <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="200">

                  <template slot-scope="scope">

                    <template v-if="userId == scope.row.creatorUserId && (scope.row.stage == '577006621985604869' ||  scope.row.stage =='577006641364189019')">
                      <el-button type="text" @click="addForm(scope.row.id)">编辑</el-button>
                      <el-button type="text" @click="handleDel(scope.row.id)" class="NCC-table-delBtn">删除</el-button>

                    </template>
                    <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="scope.row.isYP">研判</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>

  		    <ADDNCCForm v-if="addformVisible" ref="ADDNCCForm" @refresh="refresh" />

          <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 ADDNCCForm from '@/views/baseInspectionReport/Form.vue'

  import HandleForm from "./HandleForm";
  import {
    getListForJudge,
    previewDataInterface,
  } from "@/api/systemData/dataInterface";
  import ReportForm from "@/views/baseInspectionReport/Form.vue"; // 巡查处置
  import define from '@/utils/define'

  import { version } from "vue/types/umd";

  
  export default {

    components: { NCCForm, HandleForm, ReportForm, ADDNCCForm },

    mixins: [infoMixin],
    data() {
      return {
        showAll: false,
        query: {
          platformName: undefined,
          platformNameStr: undefined,
          platformType: undefined,
          department: undefined,
          questionType: undefined,
          questionClass: undefined,
          creatorTime: [],

          state: undefined,

        },
        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: [
          { fullName: "存在有害信息", id: "577006944540165381" },
          { fullName: "内容审核不到位", id: "577006978564359429" },
          { fullName: "错误表述", id: "584886326260663557" },
          { fullName: "删除链接", id: "591435954770674949" },
          { fullName: "样本查删", id: "591436151911351557" },
          { fullName: "其他", id: "0" },
        ],

        questionClassOptions: [
          { fullName: "选项一", id: "1" },
          { fullName: "选项二", id: "2" },
        ],
        stageOptions: [
          { fullName: "选项一", id: "1" },
          { fullName: "选项二", id: "2" },
        ],

        uploadHeaders: { 
          Authorization: this.$store.getters.token,
          IsLogin: true,
        },

  
        HandleFormVisible: false,
        ReportFormVisible: false,

        addformVisible: false,

        stateOptions: ['待研判', '待进一步处置', '已处置待研判', '转执法', '已存档', '不采纳'],

      };
    },
    computed: {
      isSHILevel() {
        // 判断角色是否为‘市级办公室’
        return this.$store.state.user.islader;
      },

      userId() {
        return this.$store.state.user.id
      }

    },
    created() {
      this.initSystemTypeList();

      this.getSourceOptions();

      this.initData();
    },
    methods: {

      async getSourceOptions() {
        let { data } = await request({
          url: `/Extend/baseinspectionreport/GetReportSourceList`,
          method: "GET",
        });
        this.sourceOptions = data;
      },

      getTime() {
        if(!this.query.creatorTime) return;
        return {
          startTime: this.query.creatorTime[0] || '',
          endTime: this.query.creatorTime[1] || '',
        }
      },

      initData() {

        this.list = [];

        this.listLoading = true;
        let _query = {
          ...this.listQuery,
          ...this.query,

          ...this.getTime()

        };
        let query = {};
        for (let key in _query) {
          if (Array.isArray(_query[key])) {
            query[key] = _query[key].join();
          } else {
            query[key] = _query[key];
          }
        }

        query.creatorTime && delete query.creatorTime;

        getListForJudge(query).then((res) => {

          res.data.list.forEach(v => {
            v.isYP = (v.stage != '577006621985604869' && v.stage != '577006641364189019' && v.stage != '577006696312866053')
          });

          this.list = res.data.list;
          this.total = res.data.pagination.total;
          this.listLoading = false;

          this.$forceUpdate()

        });
      },
  
      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();
      },

  		handleDel(id) {
          this.$confirm('此操作将永久删除该数据, 是否继续?', '提示', {
              type: 'warning'
          }).then(() => {
              request({
                  url: `/Extend/BaseInspectionReport/${id}`,
                  method: 'DELETE'
              }).then(res => {
                  this.$message({
                      type: 'success',
                      message: res.msg,
                      onClose: () => {
                          this.initData()
                      }
                  });
              })
          }).catch(() => {
          });
      },

      // 处理
      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.query.creatorTime = [];

        this.listQuery = {
          currentPage: 1,
          pageSize: 20,
          sort: "desc",
          sidx: "",
        };
        this.initData();
      },
      exportData() {

        let _query = {
          ...this.query,
          startTime: this.query.creatorTime[0],
          endTime: this.query.creatorTime[1],
        };
        let query = {};
        for (let key in _query) {
          if (Array.isArray(_query[key])) {
            query[key] = _query[key].join();
          } else {
            query[key] = _query[key];
          }
        }
        delete query.creatorTime;

        let obj = {
          url: "/Extend/BaseInspectionReport/Actions/ExportByJudge",
          method: "POST",

          data: 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();
        });
      },

  
      // 巡查上报列表方法-----------------------------------------------------------------------
      addForm(id, isDetail) {
          this.addformVisible = true
          this.$nextTick(() => {
              this.$refs.ADDNCCForm.init(id, isDetail)
          })
      },
      exportDemo() {
        let obj = {
          url: '/Extend/BaseInspectionReport/Actions/GenerateImportTemplate',
          method: "GET",
          responseType: 'blob',
        };
        request(obj).then((res) => {
          const blob = new Blob([res], {type: 'application/json'});
          const url = window.URL.createObjectURL(blob);
          let link = document.createElement('a');
          link.style.display = 'none';
          link.href = url;
          link.download = '线索录入模板.xlsx';
          link.click();
        });
      },

      exportMakeDemo() {
        let obj = {
          url: '/Extend/BaseInspectionReport/Actions/GenerateImportTemplateBatchReport',
          method: "GET",
          responseType: 'blob',
        };
        request(obj).then((res) => {
          const blob = new Blob([res], {type: 'application/json'});
          const url = window.URL.createObjectURL(blob);
          let link = document.createElement('a');
          link.style.display = 'none';
          link.href = url;
          link.download = '处理表单模板.xlsx';
          link.click();

        });
      },

      uploadSuccess(response, file, fileList) {
        if(response.code == 200) {
          this.$message({
            message: response.msg,
            type: 'success'
          });
        } else {
          this.$message.error(response.msg);
        }
        response.code == 200 && this.initData();
      },

      uploadError() { 
        console.log('erroe');
      },

    },
  };

  </script>
  <style scoped lang="scss">
  .common-info-box {

    :deep(.el-table__body-wrapper.is-scrolling-none) {
      height: calc(100% - 47px);
      overflow-y: scroll;
    }

  }

  .uploadXlax {
    display: inline-block;
    margin: 0 8px;
  }
  .NCC-common-search-box {
    margin-bottom: 0;
  }
  .btns-box {
    margin-bottom: 14px;
  }

  </style>