<template>
    <el-container class="problem_list">
        <el-main style="padding: 10px 10px;">
            <div class="content_wrapper" v-if="!showProblemClass">
                <el-form ref="form" :inline="true" label-width="84px">
                    <el-form-item label="专业">
                        <el-select v-model="form.pblmChType" clearable placeholder="请选择" @change="professionChange" style="width: 200px;">
                            <el-option
                            v-for="item in professionList"
                            :key="item.value"
                            :label="item.label"
                            :value="item.value">
                            </el-option>
                        </el-select>
                    </el-form-item>
                    <el-form-item label="问题大类">
                        <el-select v-model="form.class1Name" clearable placeholder="请选择" @change="majorChange" style="width: 200px;">
                            <el-option
                            v-for="item in marjorClassList"
                            :key="item.className"
                            :label="item.className"
                            :value="item.className">
                            </el-option>
                        </el-select>
                    </el-form-item>
                    <el-form-item label="问题小类">
                        <el-select v-model="form.class2Name" clearable placeholder="请选择" style="width: 200px;">
                            <el-option
                            v-for="item in subclassList"
                            :key="item.className"
                            :label="item.className"
                            :value="item.className">
                            </el-option>
                        </el-select>
                    </el-form-item>

                  <el-form-item label="序号">
                    <el-input v-model="form.sn" placeholder="请输入内容" style="width: 200px;" clearable></el-input>
                  </el-form-item>
                  <el-form-item label="问题描述">
                    <el-input v-model="form.pblmsDesc" placeholder="请输入内容" style="width: 200px;" clearable></el-input>
                  </el-form-item>
                  <el-form-item label="相关法规">
                    <el-input v-model="form.relativeLaw" placeholder="请输入内容" style="width: 200px;" clearable></el-input>
                  </el-form-item>
                  <el-form-item label="法规内容">
                    <el-input v-model="form.lawContent" placeholder="请输入内容" style="width: 200px;" clearable></el-input>
                  </el-form-item>
                  <el-form-item label="问题分类">
                    <el-select v-model="form.level" placeholder="请选择" style="width: 200px;" clearable>
                      <el-option label="一般" value="0"></el-option>
                      <el-option label="较重" value="1"></el-option>
                      <el-option label="严重" value="2"></el-option>
                    </el-select>
                  </el-form-item>
                    <el-form-item label="审核状态">
                        <el-select v-model="form.dataStat" placeholder="请选择" style="width: 200px;" clearable>
                            <el-option label="未审核" value="0"></el-option>
                            <el-option label="已审核" value="1"></el-option>
                        </el-select>
                    </el-form-item>
                    <el-form-item label="清单类型">
                      <el-select v-model="form.isNew" clearable placeholder="请选择" style="width: 200px;">
                        <el-option label="清单内" value="0"></el-option>
                        <el-option label="清单外" value="1"></el-option>
                      </el-select>
                    </el-form-item>
                    <div class="operate_btn">
                        <el-button style="margin-left:0;padding:7px 10px;" type="primary" @click="getProblemList()">查询</el-button>
                        <el-button style="margin-left:0;padding:7px 10px;" type="primary" @click="toAddFile" v-if="ownPriv('manage')">添加</el-button>
                      <!--  <el-button style="margin-left:0;padding:7px 10px;" type="success" @click="exportExcel()">导出excel</el-button>
                        <el-button style="margin-left:0;padding:7px 10px;" type="success" @click="exportWord()">导出word</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"
                    width="55">
                    </el-table-column>
                    <el-table-column
                    prop="spfsnlType"
                    label="专业"
                    show-overflow-tooltip
                    min-width="120">
                    </el-table-column>
                    <el-table-column
                    prop="sn"
                    label="序号"
                    min-width="80">
                    </el-table-column>
                    <el-table-column
                    prop="pblmsDesc"
                    label="问题描述"
                    min-width="200">
                    </el-table-column>
                    <el-table-column
                    prop="relativeLaw"
                    label="相关法规"
                    min-width="260">
                    </el-table-column>
                    <el-table-column
                    prop="lawContent"
                    label="法规内容"
                    min-width="420">
                    </el-table-column>
                    <el-table-column
                    label="问题分类">
                        <el-table-column
                        prop="cate0"
                        label="一般"
                        show-overflow-tooltip
                        min-width="60">
                            <template #default="scope">
                                {{scope.row.cate0 == '1' ? '√' : ''}}
                            </template>
                        </el-table-column>
                        <el-table-column
                        prop="cate1"
                        label="较重"
                        show-overflow-tooltip
                        min-width="60">
                            <template #default="scope">
                                {{scope.row.cate1 == '1' ? '√' : ''}}
                            </template>
                        </el-table-column>
                        <el-table-column
                        prop="cate2"
                        label="严重"
                        show-overflow-tooltip
                        min-width="60">
                            <template #default="scope">
                                {{scope.row.cate2 == '1' ? '√' : ''}}
                            </template>
                        </el-table-column>
                    </el-table-column>
                    <el-table-column
                    prop="subName"
                    show-overflow-tooltip
                    min-width="160"
                    label="责任主体">
                    </el-table-column>
                    <el-table-column
                    prop="dataStat"
                    min-width="100"
                    label="审核状态">
                        <template #default="scope">
                            <span v-if="scope.row.dataStat == '0'" style="color: red">未审核</span>
                            <span v-else style="color: rgb(55,196,72)">已审核</span>
                        </template>
                    </el-table-column>
                    <!-- <el-table-column
                    prop="intm"
                    show-overflow-tooltip
                    min-width="160"
                    label="入库时间">
                        <template #default="scope">
                            <span>{{formatDate(scope.row.intm)}}</span>
                        </template>
                    </el-table-column> -->
                    <el-table-column
                    prop="note"
                    show-overflow-tooltip
                    min-width="120"
                    label="备注">
                    </el-table-column>
                    <el-table-column
                    fixed="right"
                    label="操作"
                    v-if="ownPriv('manage')"
                    width="130">
                    <template #default="scope">
                        <el-button type="text" size="small" @click="toEditProblem(scope.row)">编辑</el-button>
                        <el-button v-if="scope.row.dataStat == '0'" type="text" size="small" @click="checkProblem(scope.row)">审核</el-button>
                        <el-button @click="deleteProblem(scope.row)" type="text" size="small">删除</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 style="float:right;position:relative;top:-10px;" v-if="ownPriv('manage')">
                    <el-button type="primary" @click="toQueryDelete">批量删除</el-button>
<!--                    <el-button @click="toChangeLibrary" type="primary">更改库别</el-button>-->
<!--                    <el-button @click="toEditProblemClass" type="primary">编辑问题类别</el-button>-->
                </div>
            </div>
            <edit-problem-class v-if="showProblemClass" @goBack="goBack"></edit-problem-class>
            <add-problem-com v-if="addFileVisiual" :titleType="titleType" :rowData="rowData" :currentNodeId="currentNodeId" :objId="objId" :listType="type" :pertype="pertype" @dialogClose="dialogClose"></add-problem-com>
            <export-excel v-if="exportEvent" @dialogClose="dialogClose" :currentNodeId="currentNodeId" :listType="type"></export-excel>
            <export-word v-if="exportWordDialog" @dialogClose="dialogClose" :problemId="problemId" :professionType="type"></export-word>
        </el-main>
        <el-dialog title="请为已选问题选择问题大类和问题小类" v-model="dialogFormVisible" :append-to-body="true">
            <el-form :model="changeClassForm" :rules="rules" ref="form">
                <el-form-item label="请选择问题大类：" prop="class1">
                    <el-select style="width:180px;" v-model="changeClassForm.class1" clearable placeholder="请选择">
                        <el-option
                        v-for="item in marjorClassList"
                        :key="item.classCode"
                        :label="item.className"
                        :value="item.classCode">
                        </el-option>
                    </el-select>
                </el-form-item>
                <el-form-item label="请选择问题小类：" prop="class2">
                    <el-select style="width:180px;" v-model="changeClassForm.class2" clearable placeholder="请选择">
                        <el-option
                        v-for="item in subclassList"
                        :key="item.classCode"
                        :label="item.className"
                        :value="item.classCode">
                        </el-option>
                    </el-select>
                </el-form-item>
            </el-form>
            <div slot="footer" class="dialog-footer">
                <el-button @click="dialogFormVisible = false">取 消</el-button>
                <el-button type="primary" @click="changeClass">确 定</el-button>
            </div>
        </el-dialog>
    </el-container>
</template>
<script>
import request from '@/utils/gw_ajax_request.js'
import {formatDateTime2} from '@/utils/gw_date.js'
import addProblemCom from './dialogCom/addInspectionProblem.vue'
import editProblemClass from './dialogCom/editProblemClass.vue'
import ExportExcel from './dialogCom/ExportExcel.vue'
import ExportWord from './dialogCom/ExportWord.vue'
export default {
    props:['currentNodeId','type','objId','projectName','pertype','backStatus'],
    data(){
        return{
            form:{
                pblmChType: '',
                class1Name: '',
                class2Name: '',
                dataStat: '',
                pageSize: 20,
                pageNum: 1,
                isNew:"",
                sn:"",
                pblmsDesc:"",
                relativeLaw:"",
                lawContent:"",
                level:""
            },
            marjorClass: '',
            subclass: '',
            professionList:[
                {label: '前期与设计',value: '1'},
                {label: '建设管理',value: '2'},
                {label: '计划下达与执行',value: '3'},
                {label: '资金使用与管理',value: '4'},
                {label: '质量行为',value: '5'},
                {label: '质量实体',value: '6'},
                {label: '工程安全',value: '7'}
            ],
            marjorClassList:[
            ],
            subclassList:[
            ],
            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,
            problemId: '',
            name: '',
            tableHeight: window.innerHeight - 245,
            dialogFormVisible: false,
            showProblemClass: false,
            titleType: '添加',
            pcode: '',
            changeClassForm: {
                class1: "",
                class2: "",
                class1Name: '',
                class2Name: '',
                ids: [],
            },
            rowData: {},
            rules: {
                class1: [
                    { required: true, message: '请选择问题大类', trigger: 'change' }
                ],
                class2: [
                    { required: true, message: '请选择问题小类', trigger: 'change' }
                ]
            }
        }
    },
    components:{
        addProblemCom,
        ExportExcel,
        ExportWord,
        editProblemClass
    },
    computed: {
        persId() {
            return localStorage.getItem("userid") ? localStorage.getItem("userid") : "1098101939614724096";
        }
    },
    mounted(){
        this.getProblemList()
    },
    activated(){
    },
    methods:{
        getProblemList(){
            this.form.cate0 = "";
            this.form.cate1 = "";
            this.form.cate2 = "";
            this.loading = true
            if(this.form.level=="0"){
                this.form.cate0 = "1";
            }
            if(this.form.level=="1"){
                this.form.cate1 = "1";
            }
            if(this.form.level=="2"){
                this.form.cate2 = "1";
            }
            request.post(`/tac/obj/pblmstb/page`,this.form).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)
            })
        },
        professionChange(){
            this.getMajorClassList()
        },
        getMajorClassList(){
            let majorParams = {
                spfsnlChType: this.form.pblmChType,
                type: '1',
                pageSize: 1000,
            }

            request.post(`/tac/pblm/class/dic/page`,majorParams).then(res=>{
                if(res.success){
                    this.marjorClassList = res.data.list
                }else{
                    this.$message.error(res.message)
                }
            })
        },
        majorChange(val){
            this.marjorClassList.forEach(ele=>{
                if(val == ele.className){
                    this.pcode = ele.id
                }
            })
            this.getSubClassList()
        },
        getSubClassList(){
            let subParams = {
                spfsnlChType: this.form.pblmChType,
                type: '2',
                pageSize: 1000,
                pcode: this.pcode
            }
            request.post(`/tac/pblm/class/dic/page`,subParams).then(res=>{
                if(res.success){
                    this.subclassList = res.data.list
                }else{
                    this.$message.error(res.message)
                }
            })
        },
        toAddFile(){
            this.titleType = '添加'
            this.addFileVisiual = true
        },
        //导出Excel
        exportExcel(){
            this.exportEvent = true
        },
        //导出Word
        exportWord(){
            this.exportWordDialog = true
        },
        toEditProblem(row){
            this.titleType = '编辑'
            Object.assign(this.rowData,row)
            this.addFileVisiual = true
        },
        checkProblem(row){
            this.$confirm('确认审核通过该问题标准吗?', '提示', {
                confirmButtonText: '确定',
                cancelButtonText: '取消',
                type: 'warning'
            }).then(() => {
                let data = {
                    id: row.id,
                    dataStat: '1'
                }
                request.post(`/tac/obj/pblmstb/update`, data).then(res=>{
                    if(res.success){
                        this.$message({
                            type: 'success',
                            message: '审核成功!'
                        });
                        this.getProblemList()
                    }else{
                        this.$message({
                            type: 'error',
                            message: res.message
                        });
                    }
                })
            })
        },
        deleteProblem(row){
            this.$confirm('确认删除该问题吗?', '提示', {
                confirmButtonText: '确定',
                cancelButtonText: '取消',
                type: 'warning'
            }).then(() => {
                request.get(`/tac/obj/pblmstb/del/${row.id}`).then(res=>{
                    if(res.success){
                        this.$message({
                            type: 'success',
                            message: '删除成功!'
                        });
                        this.getProblemList()
                    }else{
                        this.$message({
                            type: 'error',
                            message: res.message
                        });
                    }
                })
            })
        },
        pageIndexChange(val) {
            this.form.pageNum = val;
            this.getProblemList();
        },
        handleSizeChange(val) {
            this.form.pageSize = val;
            this.getProblemList();
        },
        dialogClose(){
            this.addFileVisiual = false
            this.modifyFileVisiual = false
            this.exportEvent = false
            this.exportWordDialog = false
            this.getProblemList()
        },
        pblmPasiChange(val){
            this.getProblemList()
        },
        handleSelectionChange(val){
            let problemArr = []
            val.forEach(ele=>{
                problemArr.push(ele.id)
            })
            this.changeClassForm.ids = problemArr
        },
        // 批量删除
        toQueryDelete() {
            if(!this.changeClassForm.ids.length){
                this.$message.warning('请选择需要删除的问题')
                return
            }
            this.$confirm('请问是否删除已选问题?', '提示', {
                confirmButtonText: '确定',
                cancelButtonText: '取消',
                type: 'warning'
                }).then(() => {
                    request.post(`/tac/obj/pblmstb/delList`,this.changeClassForm.ids).then(res=>{
                        if(res.success){
                            this.$message.success('删除成功')
                            this.getProblemList()
                        }else{
                            this.$message.error(res.message)
                        }
                    })
                }).catch(() => {
            });
        },
        // 更改库别
        toChangeLibrary(){
            if(!this.changeClassForm.ids.length){
                this.$message.warning('请选择需要更改库别的问题')
                return
            }
            this.dialogFormVisible = true
        },
        changeClass(){
            this.$refs['form'].validate((valid) => {
                if(valid){
                    this.marjorClassList.forEach(ele=>{
                        if(this.changeClassForm.class1 == ele.classCode){
                            this.changeClassForm.class1Name = ele.className
                        }
                    })
                    this.subclassList.forEach(ele=>{
                        if(this.changeClassForm.class2 == ele.classCode){
                            this.changeClassForm.class2Name = ele.className
                        }
                    })
                    request.post(`/tac/obj/pblmstb/updateList`,this.changeClassForm).then(res=>{
                        if(res.success){
                            this.$message.success('更改成功')
                            this.dialogFormVisible = false
                            this.getProblemList()
                        }else{
                            this.$message.error(res.message)
                        }
                    })
                } else {
                    return false;
                }
            })
        },
        // 编辑问题类别
        toEditProblemClass(){
            this.showProblemClass = true
        },
        goBack(){
            this.showProblemClass = false
        },

        formatDate(date){
            return formatDateTime2(date)
        }
    },
    watch:{
        currentNodeId(val){
            this.getProblemList()
        },
        type(val){
            this.getProblemList()
        },
        backStatus(val){
            if(val){
                //回退状态为成功时
                this.getProblemList()
            }
        }
    }
}
</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: large;
            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>


