zhgdyun/src/views/projectFront/qualitySafeReport/engineeringManagement.vue

<template>
  <div class="container">
      <!-- 一线公司检查 -->
      <div class="search_box">
          <el-form :model="searchForm">
                <el-form-item label="检查时间">
                    <el-date-picker
                        v-model="searchForm.inspectTime"
                        value-format="yyyy-MM-dd"
                        type="daterange"
                        range-separator="至"
                        start-placeholder="开始日期"
                        end-placeholder="结束日期">
                    </el-date-picker>
                </el-form-item>
                <!-- <el-form-item label="类型">
                    <el-select v-model="searchForm.type" placeholder="请选择">
                        <el-option
                            label="全部"
                            value="">
                        </el-option>
                        <el-option
                        v-for="item in typeOptions"
                        :key="item.value"
                        :label="item.label"
                        :value="item.value">
                        </el-option>
                    </el-select>
                </el-form-item> -->
                <el-form-item>
                    <el-button type="primary" @click="loadList">查询</el-button>
                    <el-button type="primary" @click="openDialog(1)">新增</el-button>
                </el-form-item>
          </el-form>
      </div>
      <el-table class="tables" :data="tableData" style="height: 600px">
          <el-table-column prop="inspectTime" label="检查时间"></el-table-column>
          <!-- <el-table-column label="类型">
              <template slot-scope="scope">
                  {{scope.row.type == '1' ? '安全': scope.row.type == '2' ? '质量':''}}
              </template>
          </el-table-column> -->
          <el-table-column prop="safeProblemNum" label="安全问题数"></el-table-column>
          <el-table-column prop="safeScore" label="安全得分"></el-table-column>
          <el-table-column prop="qualityProblemNum" label="质量问题数"></el-table-column>
          <el-table-column prop="qualityScore" label="质量得分"></el-table-column>
          <el-table-column label="操作">
              <template slot-scope="scope">
                  <el-button type="text" icon="el-icon-edit" style="margin-right: 16px" @click="openDialog(2,scope.row)">编辑</el-button>
                  <el-button type="text" icon="el-icon-delete" style="color: #F56C6C" @click="deleteData(scope.row.id)">删除</el-button>
              </template>
          </el-table-column>
      </el-table>
      <el-pagination
                    class="pagerBox"
                    @size-change="handleSizeChange"
                    @current-change="handleCurrentChange"
                    :current-page="pageNo"
                    :page-sizes="$store.state.PAGESIZRS"
                    :page-size="pageSize"
                    layout="total, sizes, prev, pager, next"
                    :total="Number(total)"
                    background
      ></el-pagination>
      <el-dialog class="dialog_box"
        :title="dialogTitle"
        :visible.sync="dialogVisible"
        :modal-append-to-body="false"
        @close="close">
            <el-form ref="addForm" :model="submitForm" :rules="rules" style="margin-bottom: 60px">
                <el-form-item label="检查时间" prop="inspectTime" label-width="120px">
                     <el-date-picker
                        v-model="submitForm.inspectTime"
                        value-format="yyyy-MM-dd"
                        type="date"
                        placeholder="选择日期">
                    </el-date-picker>
                </el-form-item>
                <el-form-item label="安全问题数" prop="safeProblemNum" label-width="120px">
                    <el-input v-model="submitForm.safeProblemNum" placeholder="请输入" onkeyup="if(isNaN(value))execCommand('undo')"
                        onafterpaste="if(isNaN(value))execCommand('undo')"></el-input>
                </el-form-item>
                <el-form-item label="安全得分" prop="safeScore" label-width="120px">
                    <el-input v-model="submitForm.safeScore" placeholder="请输入" onkeyup="if(isNaN(value))execCommand('undo')"
                        onafterpaste="if(isNaN(value))execCommand('undo')" oninput="if(value > 100) value = 100; if(value < 0 || value == '' || value == null) value = '';"></el-input>
                </el-form-item>
                <el-form-item label="质量问题数" prop="qualityProblemNum" label-width="120px">
                    <el-input v-model="submitForm.qualityProblemNum" placeholder="请输入" onkeyup="if(isNaN(value))execCommand('undo')"
                        onafterpaste="if(isNaN(value))execCommand('undo')"></el-input>
                </el-form-item>
                <el-form-item label="质量得分" prop="qualityScore" label-width="120px">
                    <el-input v-model="submitForm.qualityScore" placeholder="请输入" onkeyup="if(isNaN(value))execCommand('undo')"
                        onafterpaste="if(isNaN(value))execCommand('undo')" oninput="if(value > 100) value = 100; if(value < 0 || value == '' || value == null) value = '';"></el-input>
                </el-form-item>
            </el-form>
            <div class="dialog_footer">
                <el-button type="primary" @click="submit">确认</el-button>
                <el-button @click="close">取消</el-button>
            </div>
      </el-dialog>
  </div>
</template>

<script>
import {
    addManagerialBehaviorScoreApi,
    editManagerialBehaviorScoreApi,
    deleteManagerialBehaviorScoreApi,
    selectManagerialBehaviorScoreTableApi
} from "@/assets/js/api/qualitySafeReport.js"
export default {
    data(){
        return{
            pageNo: 1,
            pageSize: 10,
            total: 0,
            searchForm:{
                inspectTime: []
            },
            typeOptions:[{
                label: '安全',
                value: '1'
            },{
                label: '质量',
                value: '2'
            }],
            tableData:[],
            dialogTitle: "新增",
            dialogVisible: false,
            submitForm:{
                qualityProblemNum: '',
                inspectTime: "",
                qualityScore: ""
            },
             rules:{
               inspectTime: [{ required: true,message: '请选择日期', trigger: 'blur'}],
               qualityProblemNum: [{ required: true, message: '请输入质量问题数', trigger: 'blur'}],
               qualityScore: [{ required: true, message: '请输入质量得分', trigger: 'blur'}],
               safeProblemNum: [{ required: true, message: '请选择安全问题数', trigger: 'blur'}],
               safeScore: [{ required: true, message: '请选择安全得分', trigger: 'blur'}],
            },
            projectSn: "",
            detailId: ""
        }
    },
    created(){
        this.projectSn = this.$store.state.projectSn
        this.loadList()
    },
    methods:{
        handleSizeChange(val){
            this.pageSize = val
            this.loadList()
        },
        handleCurrentChange(val){
            this.pageNo = val
            this.loadList()
        },
        loadList(){
            console.log(this.searchForm)
            let data = {
                startTime: this.searchForm.inspectTime.length>0 ? this.searchForm.inspectTime[0]:'',
                endTime: this.searchForm.inspectTime.length>0 ? this.searchForm.inspectTime[1]:'',
                inspectType: 2,
                pageNo: this.pageNo,
                pageSize: this.pageSize,
                projectSn: this.projectSn
            }
            selectManagerialBehaviorScoreTableApi(data).then(res=>{
                console.log(res)
                if(res.code == 200){
                    this.tableData = res.result.records
                    this.total = res.result.total
                }
            })
        },
        openDialog(type,val){
            console.log(val)
            this.dialogVisible = true
            if(type == 1){
                this.dialogTitle = '新增'
            } else if(type == 2){
                this.dialogTitle = '编辑'
                this.detailId = val.id
                this.submitForm = {
                    inspectTime: val.inspectTime,
                    qualityProblemNum: val.qualityProblemNum,
                    qualityScore: val.qualityScore,
                    safeProblemNum: val.safeProblemNum,
                    safeScore: val.safeScore,
                }
            }
        },
        deleteData(val){
            this.$confirm('此操作将永久删除该条记录, 是否继续?', '提示', {
                confirmButtonText: '确定',
                cancelButtonText: '取消',
                type: 'warning'
            }).then(() => {
                deleteManagerialBehaviorScoreApi({id: val}).then(res=>{
                    if(res.code == 200){
                        this.$message.success('删除成功！')
                        this.loadList()
                    }
                })
            }).catch(() => {
                this.$message({
                    type: 'info',
                    message: '已取消删除'
                });          
            });
        },
        submit(){
            this.$refs['addForm'].validate((valid) => {
                if(valid){
                    let data = this.submitForm
                    data.inspectType = 2
                    data.projectSn = this.projectSn
                    console.log(this.submitForm)
                    if(this.dialogTitle == '新增'){
                        addManagerialBehaviorScoreApi(data).then(res=>{
                            console.log(res)
                            if(res.code == 200){
                                this.$message.success("添加成功！")
                                this.loadList()
                                this.close()
                            }
                        })
                    } else if(this.dialogTitle == '编辑'){
                        data.id = this.detailId
                        editManagerialBehaviorScoreApi(data).then(res=>{
                            console.log(res)
                            if(res.code == 200){
                                this.$message.success("编辑成功！")
                                this.loadList()
                                this.close()
                            }
                        })
                    }
                }
            })
        },
        close(){
            this.dialogVisible = false
            this.$refs['addForm'].resetFields()
            this.submitForm = {
                inspectTime: '',
                qualityProblemNum: '',
                qualityScore: '',
                safeProblemNum: '',
                safeScore: '',
            }
            this.detailId = ''
        }
    }
}
</script>

<style lang="less" scoped>
.container{
    width: 100%;
    height: 100%;
    background: #fff;
    .search_box{
        padding: 20px;
        /deep/.el-form-item{
            display: inline-flex;
            margin-right: 20px;
        }
    }
    .dialog_box{
        /deep/.el-form{
            width: 680px;
            margin: 0 auto;
        }
        /deep/.el-date-editor{
            width: 500px;
        }
        /deep/.el-input__inner{
            width: 500px;
        }
    }
    .dialog_footer{
        display: flex;
        justify-content: space-around;
        align-items: center;
    }
}

</style>