fj-dc-ui/.svn/pristine/79/79af1c8a1440721ab89bc06eedce543e5ec3b4c5.svn-base

<template>
    <div class="zj_plan_wrapper">
        <el-form ref="form" :model="formObj" :rules="rules" label-width="120px">
            <el-form-item label="选择年月">
                <el-date-picker type="month" placeholder="选择月" v-model="yearAndMonth" value-format="yyyy-MM" :disabled="isDisabled" style="width: 100%;"></el-date-picker>
            </el-form-item>
            <!-- <el-form-item label="责任处室" prop="departId">
                <el-select v-model="formObj.departId" placeholder="请选择责任处室" :disabled="isDisabled">
                    <el-option :label="obj.departNm" :value="obj.id" v-for="obj in orgList" :key="obj.id"></el-option>
                </el-select>
                <span style="color: #5cb6ff; font-size: 14px; margin-left: 10px; cursor: pointer" @click="addNewDepart" v-if="!isDisabled">
                    <i class="el-icon-circle-plus"></i>
                    添加
                </span>
            </el-form-item> -->
            <el-form-item label="事项名称" prop="wokerNm">
                <el-input v-model="formObj.wokerNm" :disabled="isDisabled"></el-input>
            </el-form-item>
            <el-form-item label="详细名称" prop="workerNmDesc">
                <el-input v-model="formObj.workerNmDesc" :disabled="isDisabled"></el-input>
            </el-form-item>
            <el-form-item label="检查内容" prop="content">
                <el-input type="textarea" v-model="formObj.content" :disabled="isDisabled"></el-input>
            </el-form-item>
            <el-form-item label="检查项" prop="inspType">
                <el-select v-model="formObj.inspType" placeholder="请选择督查对象" :disabled="isDisabled">
                    <el-option :label="obj.name" :value="obj.code" v-for="obj in objList" :key="obj.code"></el-option>
                </el-select>
            </el-form-item>
            <el-form-item label="检查方式" prop="checkWay">
                <el-select v-model="formObj.checkWay" placeholder="请选择检查方式" :disabled="isDisabled">
                    <el-option label="明查" value="1"></el-option>
                    <el-option label="暗访" value="2"></el-option>
                    <el-option label="明查暗访相结合" value="3"></el-option>
                </el-select>
            </el-form-item>
            <el-form-item label="检查依据" prop="checkRelay">
                <el-input v-model="formObj.checkRelay" :disabled="isDisabled"></el-input>
            </el-form-item>
            <el-form-item label="检查开始时间" prop="checkSttdDate">
                <el-date-picker type="date" placeholder="选择开始时间" v-model="formObj.checkSttdDate" value-format="yyyy-MM-dd" :disabled="isDisabled" style="width: 100%;"></el-date-picker>
            </el-form-item>
            <el-form-item label="检查结束时间" prop="checkEndDate">
                <el-date-picker type="date" placeholder="选择结束时间" v-model="formObj.checkEndDate" value-format="yyyy-MM-dd" :disabled="isDisabled" style="width: 100%;"></el-date-picker>
            </el-form-item>
            <el-form-item v-if="!isDisabled && titleText != '反馈'">
                <el-button type="primary" @click="onSubmit">确定</el-button>
                <el-button @click="closeDialog">取消</el-button>
            </el-form-item>
        </el-form>
        <!-- 流程跟踪 -->
        <div class="procedure_wrapper" v-if="showProcedure">
            <h3>流程跟踪</h3>
            <el-table
                    border
                    ref="multipleTable"
                    :height="tableHeight"
                    :data="tableData"
                    tooltip-effect="dark"
                    style="width: 100%"
                    v-loading="loading">
                <el-table-column align="center" type="index" label="序号" min-width="25">
                    <template slot-scope="scope">{{scope.$index + 1}}</template>
                </el-table-column>
                <el-table-column
                        header-align="center"
                        align="center"
                        min-width="150"
                        prop="persName"
                        label="操作人"
                        show-overflow-tooltip>
                </el-table-column>
                <el-table-column
                        header-align="center"
                        align="center"
                        min-width="200"
                        prop="workStep"
                        label="操作步骤"
                        :formatter="workStepFormatter"
                        show-overflow-tooltip
                ></el-table-column>
                <el-table-column
                        header-align="center"
                        align="center"
                        min-width="100"
                        prop="checkNote"
                        label="意见"
                        show-overflow-tooltip
                ></el-table-column>
                <el-table-column
                        header-align="center"
                        align="center"
                        min-width="150"
                        prop="intm"
                        label="时间"
                        show-overflow-tooltip>
                        <template slot-scope="scope">
                            <span>{{formatDate(scope.row.intm,'yyyy-MM-dd HH:mm:ss')}}</span>
                        </template>
                </el-table-column>
            </el-table>
        </div>
        <!-- 审核 -->
        <div class="review" v-if="titleText == '审核'">
            <el-form label-width="100px" :model="checkProcess">
                <el-form-item label="是否下发">
                    <el-select v-model="checkProcess.isSend" placeholder="请选择是否下发">
                        <el-option label="是" value="1"></el-option>
                        <el-option label="否" value="2"></el-option>
                    </el-select>
                </el-form-item>
                <el-form-item label="审核意见" v-if="checkProcess.isSend == '2'">
                    <el-input type="textarea" v-model="checkProcess.checkNote"></el-input>
                </el-form-item>
                <el-form-item>
                    <el-button type="primary" @click="checkSubmit">确定</el-button>
                    <el-button @click="closeDialog">取消</el-button>
                </el-form-item>
            </el-form>
        </div>
        <!-- 反馈 -->
        <div class="feedback" v-if="titleText == '反馈'">
            <el-form label-width="100px" :model="checkProcess">
                <el-form-item label="反馈意见">
                    <el-input type="textarea" v-model="checkProcess.checkNote"></el-input>
                </el-form-item>
                <el-form-item>
                    <el-button type="primary" @click="checkSubmit">确定</el-button>
                    <el-button @click="closeDialog">取消</el-button>
                </el-form-item>
            </el-form>
        </div>
    </div>
</template>
<script>
import request from '@util/gw_ajax_request.js'
import {dateFormat} from '@util/gw_date.js'
export default {
    props: {
        RowId:{},
        titleText:{}
    },
    data(){
        return {
            tableHeight: '200',
            loading: false,
            tableData: [],  //跟踪列表数据
            formObj:{
            },
            yearAndMonth: null,
            objList:[],
            rules: {
                wokerNm: [
                    { required: true, message: '请填写事项名称', trigger: 'blur' }
                ],
                workerNmDesc: [
                    { required: true, message: '请填写详细名称', trigger: 'blur' }
                ],
                content: [
                    { required: true, message: '请填写检查内容', trigger: 'blur' }
                ],
                checkRelay: [
                    { required: true, message: '请填写检查依据', trigger: 'blur' }
                ],
                departId: [
                    { required: true, message: '请选择责任处室', trigger: 'change' }
                ],
                inspType: [
                    { required: true, message: '请选择检查项', trigger: 'change' }
                ],
                checkWay: [
                    { required: true, message: '请选择检查方式', trigger: 'change' }
                ],
                checkSttdDate: [
                    { required: true, message: '请选择开始时间', trigger: 'change' }
                ],
                checkEndDate: [
                    { required: true, message: '请选择结束时间', trigger: 'change' }
                ],
            },
            checkProcess:{
                isSend: '',
                checkNote: '',
                planId: '',
                workStep: ''
            },
        }
    },
    computed:{
        persId(){
            return localStorage.getItem('userid') ? localStorage.getItem('userid') : ''
        },
        // 只有添加和反馈操作才可填写信息
        isDisabled(){
            return this.titleText != '添加' && this.titleText != '反馈'
        },
        showProcedure(){
            return this.titleText != '添加'
        },
        formatDate(){
            return dateFormat
        },
        departId(){
            return localStorage.getItem('departId') ? localStorage.getItem('departId') : ''
        },
        departNm(){
            return localStorage.getItem('departNm') ? localStorage.getItem('departNm') : ''
        },
    },
    mounted(){
        this.getObjList()
        if(this.isDisabled || this.titleText == '反馈'){
            this.getPlanInfo()
        }
    },
    methods:{
        // 获取督查事项列表
        getObjList(){
            request.get('/bis/insp/listInspType').then(res=>{
                if(res.success){
                    this.objList = res.data
                }else{
                    this.$message.warning(res.message)
                }
            })
        },
        // 获取计划详情信息
        getPlanInfo(){
            request.get(`/bis/zhejiang/check/plan/${this.RowId}`).then(res=>{
                if(res.success){
                    this.formObj = res.data
                    this.yearAndMonth = `${this.formObj.year}-${this.formObj.month}`
                    // 流程跟踪信息
                    this.tableData = this.formObj.checkProcessList
                }else{
                    this.$message.warning(res.message)
                }
            })
        },
        // 添加保存
        onSubmit(){
            this.$refs.form.validate((valid)=>{
                if(valid){
                    // 选择年月 分开传入两个字段 year month
                    if(this.titleText == '添加' || this.titleText == '反馈'){
                        if(this.yearAndMonth){
                            let yearAndMonth = this.yearAndMonth.split('-')
                            this.formObj['year'] = yearAndMonth[0]
                            this.formObj['month'] = yearAndMonth[1]
                        }
                        this.formObj['persId'] = this.persId
                    }
                    this.objList.forEach(ele=>{
                        if(this.formObj.inspType == ele.code){
                            this.formObj['inspName'] = ele.name
                        }
                    })
                    this.formObj['departId'] = this.departId
                    this.formObj['departNm'] = this.departNm
                    request.post('/bis/zhejiang/check/plan',this.formObj).then(res=>{
                        if(res.success){
                            this.$message.success('保存成功')
                            this.$emit('closeDialog','success')
                        }else{
                            this.$message.warning(res.message)
                        }
                    })
                }else{
                    return false
                }
            })
        },
        // 审核/反馈提交
        checkSubmit(){
            let data
            if(this.titleText == '审核'){
                if(!this.checkProcess.isSend){
                    this.$message.warning('请选择审核是否下发')
                    return
                }
                if(this.checkProcess.isSend == '1'){
                    data = {
                        isSend: '3',
                        planId: this.RowId
                    }
                }else{
                    data = {
                        planId: this.RowId,
                        checkNote: this.checkProcess.checkNote,
                        workStep: '2'
                    }
                }
            }else{
                data = {
                    planId: this.RowId,
                    checkNote: this.checkProcess.checkNote,
                    workStep: '1'
                }
                delete this.formObj.isSend
                this.onSubmit()
            }
            request.post('/bis/zhejiang/check/process',data).then(res=>{
                if(res.success){
                    if(this.titleText == '审核'){
                        this.$message.success('保存成功')
                    }
                    this.$emit('closeDialog','success')
                }else{
                    this.$message.warning(res.message)
                }
            })
        },
        closeDialog(){
            this.$emit('closeDialog')
        },
        // 格式化
        workStepFormatter(val){
            switch (val.workStep){
                case '1':
                    return '反馈';
                    break;
                case '2': 
                    return '审核';
                    break;
                default: 
                    return ''
            }
            
        },
    },
    watch:{
        titleText(val){
            if(val && isDisabled){
                this.getPlanInfo()
            }else{
                // 添加问题时清空之前展示内容
                this.formObj = {}
            }
        }
    }
}
</script>
<style lang="scss">
    .zj_plan_wrapper{
        .procedure_wrapper{
            h3{
                text-align: center;
                margin-bottom: 10px;
            }
        }
        .review,.feedback{
            margin-top: 10px;
        }
    }
</style>