<template>
  <el-container class="problem_list">
    <el-main style="padding: 0 0 10px 0;">
      <div class="content_wrapper">
        <el-form ref="form" :inline="true" label-width="84px">
          <el-form-item label="问题名称">
            <el-input v-model="pblmNm" clearable autocomplete="off" style="width: 130px;"></el-input>
          </el-form-item>
          <el-form-item label="单位名称">
            <el-input v-model="subjectNames" clearable autocomplete="off" style="width: 130px;"></el-input>
          </el-form-item>
          <el-form-item label="严重程度">
            <el-select v-model="pblmPasi" clearable placeholder="请选择" style="width: 130px;">
              <el-option
                v-for="item in problemType"
                :key="item.value"
                :label="item.label"
                :value="item.value">
              </el-option>
            </el-select>
          </el-form-item>
          <el-form-item label="是否典型">
            <el-select v-model="ifCasePblm" clearable placeholder="请选择" style="width: 130px;">
              <el-option label="是" value="1"></el-option>
              <el-option label="否" value="0"></el-option>
            </el-select>
          </el-form-item>
          <div class="operate_btn">
            <el-button style="margin-left:0;padding:7px 10px;" type="primary" @click="submitCon" v-if="label=='中心修改阶段'">确认</el-button>
            <el-button style="margin-left:0;padding:7px 10px;" type="primary" @click="openPageoffice" >生成报告</el-button>
            <el-button style="margin-left:0;padding:7px 10px;" type="primary" @click="openReviewPageoffice" v-if="isZj">生成复查报告</el-button>
            <el-button style="margin-left:0;padding:7px 10px;" type="primary" @click="getProblemList()">查 询</el-button>
            <el-button v-if="isShowaddrollback" style="margin-left:0;padding:7px 10px;" type="primary"
                       @click="toAddFile">添加问题
            </el-button>
          </div>
        </el-form>
        <el-table
          :data="tableData"
          border
          stripe
          v-loading='loading'
          :height="tableHeight"
          style="width: 100%"
          @selection-change="handleSelectionChange">
          <el-table-column
            type="selection"
            align="center"
            width="55">
          </el-table-column>
          <el-table-column align="center" label="序号" min-width="50">
            <template #default="scope">{{ (pageIndex - 1) * pageSize + (scope.$index + 1) }}</template>
          </el-table-column>
          <el-table-column
            prop="pblmNm"
            label="问题名称"
            show-overflow-tooltip
            min-width="120">
          </el-table-column>
          <el-table-column
            prop="pblmDesc"
            label="问题阐述"
            show-overflow-tooltip
            min-width="180">
          </el-table-column>
          <el-table-column
            prop="pblmPasi"
            show-overflow-tooltip
            min-width="100"
            label="严重程度">
            <template #default="scope">
              <p v-if="scope.row.pblmPasi == 0"><span class="inspPblmCate" style="background: #27C19F;">一般</span></p>
              <p v-if="scope.row.pblmPasi == 1"><span class="inspPblmCate" style="background: #E6A23C;">较重</span></p>
              <p v-if="scope.row.pblmPasi == 2"><span class="inspPblmCate" style="background: #F56C6C;">严重</span></p>
            </template>
          </el-table-column>
          <el-table-column
            prop="ifCasePblm"
            show-overflow-tooltip
            min-width="100"
            label="是否典型">
            <template #default="scope">
              <p v-if="scope.row.ifCasePblm == 0"><span>否</span></p>
              <p v-if="scope.row.ifCasePblm == 1"><span>是</span></p>
            </template>
          </el-table-column>
          <el-table-column
            prop="pblmReason"
            show-overflow-tooltip
            min-width="160"
            label="主要原因分析">
          </el-table-column>
          <el-table-column
            v-if="isRevision=='1'"
            prop="pblmRevision"
            show-overflow-tooltip
            min-width="160"
            label="问题修改理由">
          </el-table-column>
          <el-table-column
            prop="pblmMendState"
            show-overflow-tooltip
            min-width="160"
            label="复查状态">
            <template #default="scope">
              <span v-if="scope.row.pblmMendState=='1'">已整改落实</span>
              <span v-if="scope.row.pblmMendState=='2'">部分整改落实</span>
              <span v-if="scope.row.pblmMendState=='3'">未整改</span>
              <span v-if="scope.row.pblmMendState=='4'">不具备整改条件</span>
            </template>
          </el-table-column>
          <el-table-column
            prop="pblmMendNote"
            show-overflow-tooltip
            min-width="160"
            label="复查情况">
          </el-table-column>
          <!-- <el-table-column
          prop="note"
          show-overflow-tooltip
          label="备注">
          </el-table-column> -->
          <el-table-column
            label="操作"
            width="180">
            <template #default="scope">
              <el-button type="text" size="small" @click="toCheckDetail(scope.row)">查看</el-button>
              <el-button v-if="isShowaddrollback && scope.row.isPoverty!='1'" type="text" size="small" @click="toEditProblem(scope.row)">编辑
              </el-button>
              <el-button v-if="isShowaddrollback && scope.row.isPoverty!='1'" @click="deleteProblem(scope.row)" type="text" size="small">删除
              </el-button>
              <el-button @click="review(scope.row)" type="text" size="small" v-if="isShowRc">复查</el-button>
              <!--  <el-button type="text" size="small">
                    <span @click="curBtn(scope.row)">
                        {{stepId == 1 ? (scope.row.state == 0 ? '' : scope.row.state == 1 ? '提交' : '') : (stepId != 1 && stepId != '') ? (scope.row.state == 0 ? '驳回' : '提交') : ''}}
                    </span>
                </el-button>-->
            </template>
          </el-table-column>
        </el-table>
        <el-pagination style="margin-left: 30px;" :pager-count="5" :current-page="pageIndex" background
                       :page-size="pageSize" layout="total, sizes, prev, pager, next, jumper" :total="total"
                       :page-sizes="[10, 20, 50, 100]"
                       @current-change="pageIndexChange" @size-change="handleSizeChange"
        ></el-pagination>
        <div class="dialog-footer" style="text-align: right;">
          <span>将选中问题是否典型批量修改为</span>
          <el-select v-model="ifModel" clearable placeholder="请选择" style="width:180px;">
            <el-option :label="item.label" :value="item.value" v-for="(item,index) in modelTypeData"
                       :key="index"></el-option>
          </el-select>
          <!--</el-form-item>-->
          <el-button type="primary" @click="changeModel">确 定</el-button>
        </div>
      </div>
      <add-problem-com v-if="addFileVisiual" :currentNodeId="newCurrentNodeId" :stepId='stepId' :objId="objId"
                       :listType="type" :pertype="pertype" :isRevision="isRevision"
                       @dialogClose="dialogClose"></add-problem-com>
      <problem-modify-com v-if="modifyFileVisiual" :problemId="problemId" :listType="type" :isRevision="isRevision"
                          @dialogClose="dialogClose" :pertype="pertype"></problem-modify-com>
      <problem-detail-com v-if="showFileVisiual" :problemId="problemId" @dialogClose="dialogClose"></problem-detail-com>
      <reviewDialog v-if="reviewVisiual" :problemId="problemId" @dialogClose="dialogClose"
                    :problData="problemRowData"></reviewDialog>
    </el-main>
  </el-container>
</template>
<script>
import { hostUrl } from '@/utils/global_variable.js';
import request from '@/utils/gw_ajax_request.js';
import addProblemCom from './dialogCom/addProblemComTwo.vue';
import ExportExcel from './dialogCom/ExportExcel.vue';
import ExportWord from './dialogCom/ExportWord.vue';
import ProblemDetailCom from './dialogCom/ProblemDetails1.vue';
import ProblemModifyCom from './dialogCom/ProblemModifyComTwo.vue';
import reviewDialog from './dialogCom/reviewDialog.vue';

export default {
  props: [
    'currentNodeId',
    'type',
    'objId',
    'pertype',
    'backStatus',
    'flag',
    'isEdit',
    'groupId',
    'areaId',
    'stepId',
    'activeName',
    'curprvId',
    'curnextId',
    'isShowaddrollback',
    'isRevision',
    'isShowRc',
    'label',
    'year',
    'batch',
  ],
  data() {
    return {
      problemType: [
        { label: '一般', value: '0' },
        { label: '较重', value: '1' },
        { label: '严重', value: '2' },
      ],
      pblmPasi: '', //严重程度
      pblmNm: '',
      subjectNames: '', //单位名称，多个单位逗号拼接字符串
      ifCasePblm: '',
      tableData: [],
      baseInfo: {
        nm: '',
        condition: '',
        comment: '',
      },
      problemId: '',
      pageIndex: 1,
      pageSize: 20,
      total: 0,
      loading: false,
      addFileVisiual: false,
      modifyFileVisiual: false,
      exportEvent: false, //导出对话框v-if
      exportWordDialog: false,
      name: '',
      tableHeight: window.innerHeight - 350,
      newCurrentNodeId: '',
      submitStatus: '',
      editable: false,
      multipleSelection: [],
      ifModel: 1,
      showFileVisiual: false,
      modelTypeData: [
        {
          label: '是',
          value: 1,
        },
        {
          label: '否',
          value: 0,
        },
      ],
      reviewVisiual: false,
      problemRowData: '',
    };
  },
  components: {
    addProblemCom,
    ProblemModifyCom,
    ExportExcel,
    ExportWord,
    ProblemDetailCom,
    reviewDialog,
  },
  computed: {
    persId() {
      return localStorage.getItem('userid')
        ? localStorage.getItem('userid')
        : '1098101939614724096';
    },
    isZj() {
      if (localStorage.getItem('currentRlcode').substring(0, 2) == '33') {
        return true;
      } else {
        return false;
      }
    },
  },
  mounted() {
    if (this.currentNodeId) {
      this.newCurrentNodeId = this.currentNodeId;
      this.getProblemList();
      this.getSubmitStatus();
    } else {
      this.newCurrentNodeId = '';
    }
    if (this.type == '6') {
      this.name = '安全管理';
    } else if (this.type == '5') {
      this.name = '工程质量管理-工程实体质量';
    } else if (this.type == '4') {
      this.name = '资金使用与管理';
    } else if (this.type == '3') {
      this.name = '计划下达与执行';
    } else if (this.type == '2') {
      this.name = '建设管理';
    } else if (this.type == '1') {
      this.name = '前期与设计';
    }
  },
  activated() {},
  methods: {
    submitCon() {
      this.$confirm(`确认要定稿吗?`, '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning',
      }).then(() => {
        var obj = {
          id: this.currentNodeId,
          isPoverty: '1',
        };
        request.post(`/tac/pawp/rgstr`, obj).then((res) => {
          if (res.success) {
            this.getProblemList();
          } else {
            this.$message.error(res.message);
          }
        });
      });
    },
    curBtn(row) {
      if (this.stepId == 1) {
        if (row.state == 1) {
          //提交
          request
            .get(`/tac/province/pblm/info/planPblm/${row.id}/${this.curnextId}`)
            .then((res) => {
              if (res.success) {
                this.$message({
                  type: 'success',
                  message: '问题提交成功',
                });
                this.getProblemList();
              } else {
                this.$message.error(res.message);
              }
            })
            .catch((err) => {
              this.$message.error(err);
            });
        }
      } else {
        if (row.state == 1) {
          //提交
          request
            .get(`/tac/province/pblm/info/planPblm/${row.id}/${this.curnextId}`)
            .then((res) => {
              if (res.success) {
                this.$message({
                  type: 'success',
                  message: '问题提交成功',
                });
                this.getProblemList();
              } else {
                this.$message.error(res.message);
              }
            })
            .catch((err) => {
              this.$message.error(err);
            });
        } else if (row.state == 0) {
          //驳回
          request
            .get(`/tac/province/pblm/info/rollback/${row.id}/${this.curprvId}`)
            .then((res) => {
              if (res.success) {
                this.$message({
                  type: 'success',
                  message: '问题驳回成功',
                });
                this.getProblemList();
              } else {
                this.$message.error(res.message);
              }
            })
            .catch((err) => {
              this.$message.error(err);
            });
        }
      }
    },
    getProblemList() {
      this.loading = true;
      const paramsObj = {
        groupId: this.groupId,
        adCode: this.areaId,
        rgstrId: this.currentNodeId,
        // persId:this.persId,
        listType: this.type,
        pblmNm: this.pblmNm,
        subjectNames: this.subjectNames,
        pblmPasi: this.pblmPasi,
        ifCasePblm: this.ifCasePblm,
        // orderBy: 'SN',
        pageNum: this.pageIndex,
        pageSize: this.pageSize,
        stepId: this.stepId,
        year: this.year,
        batch: this.batch,
      };
      request
        .post(`/tac/province/pblm/info/pagecg`, paramsObj)
        .then((res) => {
          if (res.success) {
            this.loading = false;
            this.tableData = res.data.list;

            this.total = res.data.total;
          } else {
            this.loading = false;
            this.$message.error(res.message);
          }
        })
        .catch((err) => {
          this.$message.error(err);
        });
    },
    getSubmitStatus() {
      if (this.type) {
        request
          .get(`/tac/pawp/rgstr/getState/${this.currentNodeId}/${this.type}`)
          .then((res) => {
            if (res.success) {
              this.submitStatus = res.data.state;
              if (this.flag >= this.submitStatus) {
                this.editable = true;
              } else {
                this.editable = false;
              }
              this.$emit('sendSubmitStatus', this.editable);
            } else {
              this.$message.error(res.message);
            }
          });
      }
    },
    toAddFile() {
      if (!this.type) {
        this.$message.warning('请选择专业');
        return;
      }
      this.addFileVisiual = true;
    },
    //导出Excel
    exportExcel() {
      this.exportEvent = true;
    },
    //导出Word
    exportWord() {
      this.exportWordDialog = true;
    },
    toEditProblem(row) {
      this.problemId = row.id;
      this.modifyFileVisiual = true;
    },
    deleteProblem(row) {
      this.$confirm('确认删除该问题吗?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning',
      }).then(() => {
        request
          .get(`/tac/province/pblm/info/del/${row.id}`)
          .then((res) => {
            if (res.success) {
              this.$message({
                type: 'success',
                message: '删除成功!',
              });
              this.getProblemList();
            } else {
              this.$message({
                type: 'error',
                message: '删除失败!',
              });
            }
          })
          .catch((err) => {
            this.$message({
              type: 'error',
              message: err.message,
            });
          });
        // deleteProblemApi(row.id).then(res=>{
        //     if(res.success){
        //         this.$message({
        //             type: 'success',
        //             message: '删除成功!'
        //         });
        //         this.getProblemList()
        //     }else{
        //         this.$message({
        //             type: 'error',
        //             message: res.message
        //         });
        //     }
        // })
      });
    },
    // 查看问题详情
    toCheckDetail(row) {
      this.problemId = row.id;
      this.showFileVisiual = true;
    },
    pageIndexChange(val) {
      this.pageIndex = val;
      this.getProblemList();
    },
    handleSizeChange(val) {
      this.pageSize = val;
      this.getProblemList();
    },
    dialogClose() {
      this.addFileVisiual = false;
      this.modifyFileVisiual = false;
      this.showFileVisiual = false;
      this.exportEvent = false;
      this.exportWordDialog = false;
      this.reviewVisiual = false;
      this.getProblemList();
    },
    pblmPasiChange(val) {
      this.getProblemList();
    },
    openPageoffice() {
      const host = hostUrl;
      const nginx = '/pageofficePath/';
      // let rgstrId = this.currentNodeId;
      const rgstrId = this.newCurrentNodeId;
      const type = '400';
      const persId = this.persId;
      const stepId = this.stepId;
      // let href = 'pageoffice://|'+host+nginx+'/pageoffice/tacReport/word/'+type+'/'+rgstrId+'?persId='+persId+'|width=1100px;height=800px;ismodal=false;||91A4EE66EC1921F376873E85D6C74FFA|A890649B44577C32CE1930797E1299F9';
      // let href = 'pageoffice://|' + host + nginx + '/pageoffice/tacComReport/pdc/word/' + type + '/' + rgstrId + '/' + stepId + '?persId=' + persId + '|width=1100px;height=800px;ismodal=false;||91A4EE66EC1921F376873E85D6C74FFA|A890649B44577C32CE1930797E1299F9';
      const href =
        nginx +
        '/pageoffice/tacReport/pdc/wordNew/' +
        type +
        '/' +
        rgstrId +
        '?persId=' +
        stepId +
        '.0.1,2,3,4,5,6.listType';
      // let a = document.createElement('a'); // 创建a标签
      // a.setAttribute('href', href);// href链接
      // a.click();// 自执行点击事件
      POBrowser.openWindowModeless(href, 'width=1100px;height=800px;');
    },
    openReviewPageoffice() {
      const host = hostUrl;
      const nginx = '/pageofficePath/';
      // let rgstrId = this.currentNodeId;
      const rgstrId = this.newCurrentNodeId;
      const type = '400';
      const persId = this.persId;
      const stepId = this.stepId;

      // let href = 'pageoffice://|' + host + '/pageoffice/tacReport/review/wordNew/' + type + '/' + rgstrId + '?persId=' + stepId + '.0.1,2,3,4,5,6.listType|width=1100px;height=800px;ismodal=false;||91A4EE66EC1921F376873E85D6C74FFA|A890649B44577C32CE1930797E1299F9';
      const href =
        nginx +
        '/pageoffice/tacReport/review/wordNew/' +
        type +
        '/' +
        rgstrId +
        '?persId=' +
        stepId +
        '.0.1,2,3,4,5,6.listType';
      // let a = document.createElement('a'); // 创建a标签
      // a.setAttribute('href', href);// href链接
      // a.click();// 自执行点击事件
      POBrowser.openWindowModeless(href, 'width=1100px;height=800px;');
    },
    //全选
    handleSelectionChange(val) {
      this.multipleSelection = val;
    },
    changeModel() {
      if (this.multipleSelection.length > 0) {
        request
          .post(`/tac/province/pblm/info/updatePblmInfoList`, {
            ifCasePblm: this.ifModel,
            list: this.multipleSelection,
          })
          .then((res) => {
            if (res.success) {
              this.$message.success('修改成功');
              this.getProblemList();
            }
          });
      } else {
        this.$message.warning('请选择要修改的问题');
      }
      //   if(this.multipleSelection.length > 0){
      //     request.post(`/tac/pblm/info/updatePblmInfoList`,{
      //       "ifCasePblm": this.ifModel,
      //       "list": this.multipleSelection
      //     }).then(res =>{
      //       if(res.success){
      //         this.$message.success("修改成功");
      //         this.getProblemList();
      //       }
      //     })
      //   }else{
      //     this.$message.warning("请选择要修改的问题");
      //   }
    },
    //  浙江复查2021年5月1日09:19:41 by thy
    review(row) {
      this.problemRowData = row;
      this.problemId = row.id;
      this.reviewVisiual = true;
    },
  },
  watch: {
    groupId() {},
    areaId() {
      this.getProblemList();
    },
    currentNodeId(val) {
      if (val) {
        this.newCurrentNodeId = `${val}`;
        this.getSubmitStatus();
      } else {
        this.newCurrentNodeId = '';
      }
      this.getProblemList();
    },
    flag(val) {
      if (this.currentNodeId) {
        this.newCurrentNodeId = this.currentNodeId;
      } else {
        this.newCurrentNodeId = '';
      }
      this.getProblemList();
      this.getSubmitStatus();
    },
    type(val) {
      this.getProblemList();
      this.getSubmitStatus();
    },
    isEdit(val) {
      this.editable = val;
    },
    hasPriv1(item) {
      return this.ownPriv(item);
    },
  },
};
</script>
<style>
  .problem_list {
    .project_title {
      line-height: 50px;
      text-align: center;
      color: #333;
      border-bottom: solid 1px #eee;
    }

    h4 {
      line-height: 50px;
      color: #444;
    }

    .operate_btn {
      float: right;
      margin-bottom: 10px;
    }

    .inspPblmCate {
      padding: 2px 10px;
      border-radius: 10px;
      color: #ffffff;
      -webkit-border-radius: 10px;
      -moz-border-radius: 10px;
      border-radius: 10px;
    }

    .el-form-item__label {
      font-size: 16px;
      color: #333;
    }

    .el-form--inline .el-form-item {
      margin-right: 6px;
    }

    .el-table__header th {
      font-size: large !important;
    }

    tr.el-table__row {
      font-size: large;
    }
  }
</style>
