修改

马宇豪

2023-05-05 c819024e241b9f7c54cc3786373ad0d2998f2190

 src/views/doublePreventAction/hiddenDanger/inspectionRecord/components/detail.vue

@@ -1,189 +1,41 @@
<template>
    <div class="app-container">
        <el-dialog title="巡检记录详情" :visible.sync="inspectionRecordFormVisible"  append-to-body :close-on-click-modal="false" width="40%">
            <el-form ref="inspectionRecordForm" :model="inspectionRecordForm" label-position="right" label-width="120px" readonly>
                <el-row>
                    <el-col :span="12">
                        <el-form-item label="任务名称" prop="title">
                            <el-input v-model="inspectionRecordForm.title" class="analyseUnit_input" readonly>
                            </el-input>
                        </el-form-item>
                    </el-col>
                    <el-col :span="12">
                        <el-form-item label="检查类型" prop="type">
                            <el-select v-model="inspectionRecordForm.type" class="analyseUnit_input" readonly>
                                <el-option
                                v-for="item in typeList"
                                :key=item.id
                                :label=item.name
                                :value=item.id
                                ></el-option>
                            </el-select>
                        </el-form-item>
                    </el-col>
                </el-row>
                <el-row>
                    <el-col :span="12">
                        <el-form-item label="检查类型" prop="execUname">
                            <el-input v-model="inspectionRecordForm.execUname" class="analyseUnit_input" readonly>
                            </el-input>
                        </el-form-item>
                    </el-col>
                    <el-col :span="12">
                        <el-form-item label="任务状态" prop="status">
                            <el-select v-model="inspectionRecordForm.status" class="analyseUnit_input" readonly>
                                <el-option
                                    v-for="item in statusList"
                                    :key="item.id"
                                    :label="item.name"
                                    :value="item.id"
                                >
                                </el-option>
                            </el-select>
                        </el-form-item>
                    </el-col>
                </el-row>
                <el-row>
                    <el-col :span="12">
                        <el-form-item label="巡检开始时间" prop="expTime">
                            <el-date-picker v-model="inspectionRecordForm.expTime" value-format="yyyy-MM-dd HH:mm:ss" type="datetime" placeholder="巡检开始时间" class="analyseUnit_input" readonly></el-date-picker>
                        </el-form-item>
                    </el-col>
                    <el-col :span="12">
                        <el-form-item label="巡检结束时间" prop="endTime">
                            <el-date-picker v-model="inspectionRecordForm.endTime" value-format="yyyy-MM-dd HH:mm:ss" type="datetime" placeholder="巡检结束时间" class="analyseUnit_input" readonly></el-date-picker>
                        </el-form-item>
                    </el-col>
                </el-row>
                <el-row>
                    <el-col :span="12">
                        <el-form-item label="巡检提交时间" prop="execTime">
                               <el-date-picker v-model="inspectionRecordForm.execTime" value-format="yyyy-MM-dd HH:mm:ss" type="datetime" placeholder="巡检提交时间" class="analyseUnit_input" readonly></el-date-picker>
                        </el-form-item>
                    </el-col>

                </el-row>
            </el-form>
        </el-dialog>
        <el-dialog :title="titleDetail"  :visible.sync="inspectionRecordDetailFormVisible"  append-to-body :close-on-click-modal="false" width="500px">
            <el-form ref="inspectionRecordDetailForm" :rules="inspectionRecordDetailFormRules" :model="inspectionRecordDetailForm" label-position="right" label-width="120px">
                <el-row>
                    <el-col :span="24">
                        <el-form-item label="巡检结果" prop="result">
                            <el-select v-model="inspectionRecordDetailForm.result" :disabled="ifShow" class="input" @change="ifNormal = !ifNormal">
                                <el-option
                                v-for="item in resultList"
                                :key="item.id"
                                :label="item.name"
                                :value="item.id"
                                ></el-option>
                            </el-select>
                        </el-form-item>
                    </el-col>
                </el-row>
                <div v-if="ifNormal">
                    <el-row>
                        <el-col :span="24">
                            <el-form-item label="异常通知人员" prop="noticeUid">
                                <el-select v-model="inspectionRecordDetailForm.noticeUid" clearable filterable :disabled="ifShow" class="input">
                                    <el-option
                                        v-for="item in userList"
                                        :key="item.id"
                                        :value="item.id"
                                        :label="item.realname"
                                    ></el-option>
            <el-dialog title="查看" :visible.sync="isShowRecordDialog" append-to-body :close-on-click-modal="false" width="600px">
                <div class="record-form">
                    <el-form :model="recordForm" ref="recordFormRef" size="default" label-width="100px">
                        <el-row :gutter="35">
                            <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24" class="mb20">
                                <el-form-item label="检查内容" prop="checkContent">
                                    <el-input class="analyseUnit_input" type="textarea" :rows="3" v-model.trim="recordForm.checkContent" placeholder="检查内容"> </el-input>
                                </el-form-item>
                            </el-col>
                        </el-row>
                    </el-form>
                </div>
            </el-dialog>
            <el-dialog title="提交" :visible.sync="isShowSubmitDialog" width="600px">
                <el-form :model="submitForm" ref="rectifyFormRef" size="default" label-width="120px">
                    <el-row :gutter="35">
                        <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24" class="mb20">
                            <el-form-item label="处理结果" prop="checkResult">
                                <el-select class="analyseUnit_input" v-model="checkResults.checkResult" placeholder="请输入处理结果">
                                    <el-option v-for="item in resultList" :label="item.name" :key="item.id" :value="item.id"></el-option>
                                </el-select>
                            </el-form-item>
                        </el-col>
                    </el-row>
                    <el-row>
                        <el-col :span="24">
                            <el-form-item label="整改时间" prop="fixTime">
                                <el-date-picker placeholder="选择时间" v-model="inspectionRecordDetailForm.fixTime" class="input" value-format="yyyy-MM-dd HH:mm:ss" type="datetime" :disabled="ifShow"></el-date-picker>
                            </el-form-item>
                        </el-col>
                    </el-row>
                    <el-row >
                        <el-col :span="24">
                            <el-form-item label="整改人" prop="fixUid">
                                <el-select v-model="inspectionRecordDetailForm.fixUid" clearable filterable :disabled="ifShow" class="input">
                                    <el-option
                                        v-for="item in userList"
                                        :key="item.id"
                                        :value="item.id"
                                        :label="item.realname"
                                    ></el-option>
                                </el-select>
                            </el-form-item>
                        </el-col>
                    </el-row>
                    <el-row>
                        <el-col :span="24">
                            <el-form-item label="巡检结果备注" prop="info">
                                <el-input type="textarea" :rows="3" v-model="inspectionRecordDetailForm.info" :disabled="ifShow" class="input">
                                </el-input>
                            </el-form-item>
                        </el-col>
                    </el-row>
                    <el-row>
                        <el-col :span="24">
                            <el-form-item label="上报图片" prop="img">
                                <el-upload
                                    accept=".pdf,.jpg,.png"
                                    :action="fileRoad"
                                    class="upload-demo"
                                    ref="upload"
                                    :headers="header"
                                    :data="uploadForm"
                                    list-type="picture-card"
                                    :file-list="fileList"
                                    v-model="inspectionRecordDetailForm.img"
                                    :on-change="handleChangeFile"
                                    :on-success="onFileSuccess"
                                    :multiple="false"
                                    :auto-upload="true">
                                    <i slot="default" class="el-icon-plus"></i>
                                    <div slot="file" slot-scope="{file}">
                                        <img
                                            class="el-upload-list__item-thumbnail"
                                            :src="file.url" alt=""
                                        >
                                        <span class="el-upload-list__item-actions">
                                <span
                                    class="el-upload-list__item-preview"
                                    @click="handleFile(file)"
                                >
                                  <i class="el-icon-zoom-in"></i>
                                </span>
                                <span
                                    v-if="!disabled"
                                    class="el-upload-list__item-delete"
                                    @click="handleRemove(file,'one')"
                                >
                                  <i class="el-icon-delete"></i>
                                </span>
                              </span>
                                    </div>
                                </el-upload>
                            </el-form-item>
                        </el-col>
                    </el-row>
                </el-form>
                <div align="right" class="dialog-footer">
                    <el-button @click="isShowSubmitDialog = !isShowSubmitDialog" size="default">取 消</el-button>
                    <el-button type="primary" @click="submitRecord" size="default">确 定</el-button>
                </div>
                <div  style="text-align: center">
                    <el-button @click="inspectionRecordDetailFormVisible = false">取消</el-button>
                    <el-button type="primary" @click="submitInspectionRecordDetail()">确认</el-button>
                </div>
            </el-form>
        </el-dialog>
        <el-dialog :visible.sync="dialogVisible" :append-to-body="true">
            <img width="100%" :src="dialogImageUrl" alt="">
        </el-dialog>
            </el-dialog>
    </div>
</template>

<script>
    import Cookies from "js-cookie";
    import {submitUnitOne} from "../../../../../api/inspectionTask";
    import {submitTaskRecord, submitUnitOne} from "../../../../../api/inspectionTask";

    export default {
        name: "detail",
@@ -212,12 +64,14 @@
                    execUid: null,
                    fixTime: null,
                    fixUid: null,
                    img: null,
                    imgInfoList: [],
                    info: null,
                    noticeUid: null,
                    result: 1,
                    result: null,
                    taskId: null,
                    unitId: null
                    unitId: null,
                    fixDepId:null,
                    noticeDepId:null,
                },
                inspectionRecordDetailFormRules:{
                    img: [{ required: true, validator: validateImg, trigger: 'blur' }],
@@ -226,66 +80,123 @@
                    fixTime: [{ required: true, message: '整改时间不能为空', trigger: 'change' }],
                    fixUid: [{ required: true, message: '描整改人员不能为空', trigger: 'change' }],
                    info: [{ required: true, message: '巡检结果备注不能为空', trigger: 'blur' }],
                    fixDepId: [{ required: true, message: '异常整改部门不能为空', trigger: 'blur' }],
                    noticeDepId: [{ required: true, message: '异常通知部门不能为空', trigger: 'blur' }],
                },
                inspectionRecordDetailFormVisible:false,
                ifShow:true,
                ifNormal:false,
                ifLook:false,
                ifConfirm:false,
                userList:[],
                noticeUserList:[],
                fixUserList:[],
                departmentList:[],
                fileList:[],
                resultList:[{id:0,name:'未操作'},{id:1,name:'正常'},{id:2,name:'异常'}],
                typeList:[{id:1,name:'日常检查'},{id:2,name:'周期检查'}],
                statusList:[{id:1,name:'待巡检'},{id:2,name:'巡检中'},{id:3,name:'已完成'},{id:4,name:'超时未巡检'},{id:5,name:'已取消'}],
                isShowSubmitDialog: false,
                isShowRecordDialog: false,
                recordForm: {
                    taskCode: null,
                    checkContent: null,
                    checkResult: null,
                    checkTaskId: null,
                    classify1: null,
                    classify2: null,
                    classify3: null,
                    controlMeasureCode: null,
                    controlMeasureId: null,
                    controlType: null,
                    measureDesc: null
                },
                submitForm: {
                    id: null,
                    execUserId: null,
                    checkResults: []
                },
                checkResults: {
                    id: null,
                    controlMeasureId: null,
                    checkResult: null
                },
                resultList: [
                    { id: 1, name: '正常' },
                    { id: 2, name: '不正常' }
                ]
            }
        },
        components:{

        },
        methods:{
            showInspectionRecordForm(value) {
                this.inspectionRecordFormVisible = true
                this.inspectionRecordForm = JSON.parse(JSON.stringify(value))
            showInspectionRecordForm(type,value) {
                if (type === '查看') {
                    this.isShowRecordDialog = true;
                    let recordFormValue = JSON.parse(JSON.stringify(value));
                    this.recordForm.taskCode = recordFormValue.taskCode;
                    this.recordForm.checkContent = recordFormValue.checkContent;
                } else {
                    this.title = '提交';
                    this.isShowSubmitDialog = true;
                    this.submitForm.id = JSON.parse(JSON.stringify(value)).checkTaskId;
                    this.checkResults.id = JSON.parse(JSON.stringify(value)).id;
                    this.checkResults.controlMeasureId = JSON.parse(JSON.stringify(value)).controlMeasureId;
                }

            },
            showInspectionRecordDetailForm(value,type,userList) {
                this.inspectionRecordDetailFormVisible = true
                this.userList = userList
                if(type === '查看'){
                    this.titleDetail = '巡检单元查看'
                    this.ifShow = true
                    this.inspectionRecordDetailForm = JSON.parse(JSON.stringify(value))
                    if(value.result !== 1){
                        this.ifNormal = true
                        this.fileList = []
                        this.fileList =(value.img === null ? [] : [ {url:process.env.IMG_API + value.img} ])

            async submitRecord(){
                if (this.checkResults.checkResult !== null) {

                        this.submitForm.checkResults.push(this.checkResults);
                        let res = await submitTaskRecord(this.submitForm);
                        if (res.data.code === '200') {
                            this.$message({
                                type: 'success',
                                message: '排查记录提交成功',
                                duration: 2000
                            });
                            this.isShowSubmitDialog = false;
                            this.$emit('refreshRecord');
                        } else {
                            this.$message({
                                type: 'warning',
                                message: res.data.msg
                            });

                    }
                }else{
                    this.titleDetail = '巡检单元上报'
                    this.ifShow = false
                    this.inspectionRecordDetailForm = {
                        execUid: Cookies.get('userId'),
                        fixTime: null,
                        fixUid: null,
                        img: null,
                        info: null,
                        noticeUid: null,
                        result: 1,
                        taskId: value.taskId,
                        unitId: value.id
                    }
                } else {
                    this.$message({
                        type: 'warning',
                        message: '请完善基本信息'
                    });
                }
            },
            submitInspectionRecordDetail() {
                if(this.ifNormal = false){
                if(this.ifNormal === false){
                    this.inspectionRecordDetailForm.noticeUid = null
                    this.inspectionRecordDetailForm.fixTime = null
                    this.inspectionRecordDetailForm.fixUid = null
                    this.inspectionRecordDetailForm.info = null
                    this.inspectionRecordDetailForm.img = null
                    this.inspectionRecordDetailForm.imgInfoList = []
                    this.inspectionRecordDetailForm.noticeDepId = null
                    this.inspectionRecordDetailForm.fixDepId = null
                }
                this.$refs["inspectionRecordDetailForm"].validate((valid) =>{
                    if(valid){
                        if(this.inspectionRecordDetailForm.result === 0){
                            this.$message({
                                type:'warning',
                                message:'请选择正确的巡检结果'
                            })
                            return
                        }
                        this.inspectionRecordDetailForm.imgInfoList = this.inspectionRecordDetailForm.imgInfoList.map(item =>{ return { imagePath:item.imagePath}})
                        submitUnitOne(this.inspectionRecordDetailForm).then( res =>{
                            if(res.data.code === '200'){

                                this.inspectionRecordDetailFormVisible = false
                                this.$emit('getList')
                                this.$message({
                                    type:'success',
                                    message:'上报成功',
@@ -299,7 +210,6 @@
                                    type:'warning'
                                })
                            }
                            this.inspectionRecordDetailFormVisible = false
                        })
                    }else{
                        this.$message({
@@ -309,13 +219,30 @@
                    }
                })
            },
            changeDepartment(type){
              if(type === 'notice'){
                  if(this.inspectionRecordDetailForm.noticeDepId === ''){
                      this.noticeUserList = []
                  }else{
                      let department = this.departmentList.find(item => item.id === this.inspectionRecordDetailForm.noticeDepId).department
                      this.noticeUserList = this.userList.filter ( item => item.department === department)
                  }
              }else{
                  if(this.inspectionRecordDetailForm.fixDepId === ''){
                      this.fixUserList = []
                  }else{
                      let department = this.departmentList.find(item => item.id === this.inspectionRecordDetailForm.fixDepId).department
                      this.fixUserList = this.userList.filter ( item => item.department === department)
                  }
              }
            },
            handleChangeFile(){
                this.header.Authorization = Cookies.get('token')
            },
            onFileSuccess(response){
                if(response.code === '200'){
                    this.inspectionRecordDetailForm.img = response.result.path
                    this.fileList.push({url:process.env.IMG_API + response.result.path})
                    this.inspectionRecordDetailForm.imgInfoList.push({imagePath:response.result.path,name:response.result.name,})
                    this.fileList.push({url:process.env.IMG_API + response.result.path,name:response.result.name,})
                    this.$notify({
                        type:'success',
                        duration:2000,
@@ -339,8 +266,8 @@
                    cancelButtonText:'取消',
                    type:'warning',
                }).then(()=> {
                    this.inspectionRecordDetailForm.img = null
                    this.fileList = []
                    this.inspectionRecordDetailForm.imgInfoList.splice(this.inspectionRecordDetailForm.imgInfoList.findIndex(item =>item.name === file.name),1)
                    this.fileList.splice(this.inspectionRecordDetailForm.imgInfoList.findIndex(item =>item.name === file.name),1)
                })
            },
        }
@@ -357,4 +284,14 @@
    .input{
        width:300px;
    }
.basic_search{
    display:inline-block;
    padding-bottom: 10px;
}
.analyseUnit_input{
    width:90%;
}
.analyseUnit_box{
    width:200px;
}
</style>