<template>
|
<div class="notice">
|
<el-dialog
|
v-model="dialogVisible"
|
:title="state.title"
|
width="75%"
|
:before-close="handleClose"
|
:close-on-press-escape="false"
|
:close-on-click-modal="false"
|
>
|
<el-form :model="state.form" size="default" ref="superRef" :rules="state.formRules" label-width="180px">
|
<el-form-item v-if="state.isAdmin" label="企业:" prop="companyId">
|
<el-select v-model="state.form.companyId" placeholder="请选择" :disabled="state.title =='查看'" clearable @change="getDeptList">
|
<el-option
|
v-for="item in state.companyList"
|
:key="item.id"
|
:label="item.name"
|
:value="item.id">
|
</el-option>
|
</el-select>
|
</el-form-item>
|
<el-row>
|
<el-col :span="12">
|
<el-form-item label="年份:" prop="year">
|
<el-date-picker
|
v-model="state.form.year"
|
type="year"
|
value-format="YYYY"
|
placeholder="请选择年份"
|
:disabled="state.title =='查看'"
|
/>
|
</el-form-item>
|
</el-col>
|
<el-col :span="12">
|
<el-form-item label="编号:" prop="number">
|
<el-input v-model.trim="state.form.number" :readonly="state.title =='查看'"></el-input>
|
</el-form-item>
|
</el-col>
|
</el-row>
|
<el-form-item label="年度基础设施维护计划:" prop="annualMaintenanceDeviceSaveDTOReqs">
|
<el-button
|
type="primary"
|
plain
|
icon="Plus"
|
@click="addLine"
|
style="margin-bottom: 10px"
|
v-if="state.title !=='查看'"
|
>新增</el-button>
|
</el-form-item>
|
<!-- <el-table :data="state.form.annualMaintenanceDeviceSaveDTOReqs" class="customedTable" :border="true">-->
|
<!-- <el-table-column label="序号" type="index" width="80" align="center">-->
|
<!-- </el-table-column>-->
|
<!-- <el-table-column label="设备名称" prop="deviceName" align="center">-->
|
<!-- <template #default="scope">-->
|
<!-- <el-input-->
|
<!-- v-model.trim="scope.row.deviceName"-->
|
<!-- size="large"-->
|
<!-- type="textarea"-->
|
<!-- style="width: 100%;"-->
|
<!-- clearable-->
|
<!-- >-->
|
<!-- </el-input>-->
|
<!-- </template>-->
|
<!-- </el-table-column>-->
|
<!-- <el-table-column label="型号" prop="model" align="center">-->
|
<!-- <template #default="scope">-->
|
<!-- <el-input-->
|
<!-- v-model.trim="scope.row.model"-->
|
<!-- size="large"-->
|
<!-- type="textarea"-->
|
<!-- style="width: 100%;"-->
|
<!-- clearable-->
|
<!-- >-->
|
<!-- </el-input>-->
|
<!-- </template>-->
|
<!-- </el-table-column>-->
|
<!-- <el-table-column label="厂内编号" prop="factoryNumber" align="center">-->
|
<!-- <template #default="scope">-->
|
<!-- <el-input-->
|
<!-- v-model.trim="scope.row.factoryNumber"-->
|
<!-- size="large"-->
|
<!-- type="textarea"-->
|
<!-- style="width: 100%;"-->
|
<!-- clearable-->
|
<!-- >-->
|
<!-- </el-input>-->
|
<!-- </template>-->
|
<!-- </el-table-column>-->
|
<!-- <el-table-column label="用途" prop="purpose" align="center">-->
|
<!-- <template #default="scope">-->
|
<!-- <el-input-->
|
<!-- v-model.trim="scope.row.purpose"-->
|
<!-- size="large"-->
|
<!-- type="textarea"-->
|
<!-- style="width: 100%;"-->
|
<!-- clearable-->
|
<!-- >-->
|
<!-- </el-input>-->
|
<!-- </template>-->
|
<!-- </el-table-column>-->
|
<!-- <el-table-column label="使用部门" prop="deptName" align="center">-->
|
<!-- <template #default="scope">-->
|
<!-- <el-input-->
|
<!-- v-model.trim="scope.row.deptName"-->
|
<!-- size="large"-->
|
<!-- type="textarea"-->
|
<!-- style="width: 100%;"-->
|
<!-- clearable-->
|
<!-- >-->
|
<!-- </el-input>-->
|
<!-- </template>-->
|
<!-- </el-table-column>-->
|
<!-- <el-table-column label="操作" align="center" width="70">-->
|
<!-- <template #default="scope">-->
|
<!-- <el-button link type="danger" @click="handleDelete(scope.$index)">删除</el-button>-->
|
<!-- </template>-->
|
<!-- </el-table-column>-->
|
<!-- </el-table>-->
|
<div v-for="(device,deviceIndex) in state.form.annualMaintenanceDeviceSaveDTOReqs" :key="deviceIndex" class="device-table">
|
<table class="seven-col-table">
|
<thead>
|
<tr>
|
<th>序号</th>
|
<th>设备名称</th>
|
<th>型号</th>
|
<th>厂内编号</th>
|
<th>用途</th>
|
<th>使用部门</th>
|
<th v-if="state.title !=='查看'">操作</th>
|
</tr>
|
</thead>
|
<tbody>
|
<tr>
|
<td>{{deviceIndex + 1}}</td>
|
<td>
|
<el-input v-model.trim="device.deviceName" type="textarea" style="width: 100%;" clearable :readonly="state.title =='查看'"></el-input>
|
</td>
|
<td>
|
<el-input v-model.trim="device.model" type="textarea" style="width: 100%;" clearable :readonly="state.title =='查看'"></el-input>
|
</td>
|
<td>
|
<el-input v-model.trim="device.factoryNumber" type="textarea" style="width: 100%;" clearable :readonly="state.title =='查看'"></el-input>
|
</td>
|
<td>
|
<el-input v-model.trim="device.purpose" type="textarea" style="width: 100%;" clearable :readonly="state.title =='查看'"></el-input>
|
</td>
|
<td>
|
<el-input v-model.trim="device.deptName" type="textarea" style="width: 100%;" clearable :readonly="state.title =='查看'"></el-input>
|
</td>
|
<td v-if="state.title !=='查看'">
|
<el-button link type="danger" @click="handleDelete(deviceIndex)">删除</el-button>
|
</td>
|
</tr>
|
</tbody>
|
</table>
|
<table class="maintain-table">
|
<thead>
|
<tr>
|
<th style="width: 120px;">项目</th>
|
<th style="width: 80px;">频度</th>
|
<th v-for="(month,monthIndex) in state.monthList" :key="monthIndex">{{month.label}}</th>
|
</tr>
|
</thead>
|
<tbody>
|
<tr v-for="(line,lineIndex) in state.form.annualMaintenanceDeviceSaveDTOReqs[deviceIndex].annualMaintenanceDeviceTypes" :key="lineIndex">
|
<td>{{line.projectType == 1?'日常例行点检':line.projectType == 2?'一级保养':'二级保养'}}</td>
|
<td>{{line.frequency == 1?'工作日':line.frequency == 2?'1次/3个月':'1次/6个月'}}</td>
|
<td v-for="(month,monthIndex2) in state.monthList" :key="monthIndex2">
|
<el-input v-model.trim="line[month.value]" style="width: 100%;" clearable :readonly="state.title =='查看'"></el-input>
|
</td>
|
</tr>
|
</tbody>
|
</table>
|
</div>
|
<el-form-item label="核准:" prop="approvalId">
|
<el-select clearable v-model="state.form.approvalId" :disabled="state.title =='查看'" filterable placeholder="核准" style="width: 100%">
|
<el-option
|
v-for="item in state.userList"
|
:key="item.userId"
|
:label="item.name"
|
:value="item.userId"
|
/>
|
</el-select>
|
</el-form-item>
|
<el-form-item label="审核:" prop="processId">
|
<el-select clearable v-model="state.form.processId" :disabled="state.title =='查看'" filterable placeholder="审核" style="width: 100%">
|
<el-option
|
v-for="item in state.userList"
|
:key="item.userId"
|
:label="item.name"
|
:value="item.userId"
|
/>
|
</el-select>
|
</el-form-item>
|
<el-form-item label="做成:" prop="finishId">
|
<el-select clearable v-model="state.form.finishId" :disabled="state.title =='查看'" filterable placeholder="做成" style="width: 100%">
|
<el-option
|
v-for="item in state.userList"
|
:key="item.userId"
|
:label="item.name"
|
:value="item.userId"
|
/>
|
</el-select>
|
</el-form-item>
|
</el-form>
|
<template #footer v-if="state.title !='查看'">
|
<span class="dialog-footer">
|
<el-button @click="handleClose" size="default">取 消</el-button>
|
<el-button type="primary" @click="onSubmit" size="default" v-preReClick>确认</el-button>
|
</span>
|
</template>
|
</el-dialog>
|
</div>
|
</template>
|
<script setup>
|
import {reactive, ref, toRefs, defineEmits, nextTick, onMounted} from 'vue'
|
import {ElMessage} from "element-plus";
|
import {Base64} from "js-base64"
|
import {getToken} from "@/utils/auth";
|
import {
|
addInternalAuditCheck, getInternalAuditCheckInfo,
|
updateInternalAuditCheck
|
} from "@/api/innerReview/meetingReview";
|
import {getDepart} from "@/api/orgStructure/depart";
|
import {listUser} from "@/api/system/user";
|
import {getMaintenancePlanDetail, updateMaintenancePlan} from "@/api/infrastructureMng/ledger";
|
|
const emit = defineEmits(["getList"]);
|
const dialogVisible = ref(false)
|
const superRef = ref()
|
const checkList = (rule, value, callback) => {
|
if (state.form.annualMaintenanceDeviceSaveDTOReqs.length == 0) {
|
callback(new Error('维护计划不可为空'))
|
} else {
|
callback()
|
}
|
}
|
const state = reactive({
|
title: '',
|
form: {
|
id: null,
|
companyId: null,
|
name: '',
|
year: '',
|
number: '',
|
annualMaintenanceDeviceSaveDTOReqs: [],
|
approvalId: null,
|
approvalName: '',
|
processId: null,
|
processName: '',
|
finishId: null,
|
finishName: '',
|
delDeviceIds: []
|
},
|
oldDeviceList: [],
|
formRules:{
|
companyId: [{ required: true, message: '请选择企业', trigger: 'blur' }],
|
year: [{ required: true, message: '请选择年份', trigger: 'blur' }],
|
number: [{ required: true, message: '请填写编号', trigger: 'blur' }],
|
approvalId: [{ required: true, message: '请选择核准人', trigger: 'blur' }],
|
processId: [{ required: true, message: '请选择审核人', trigger: 'blur' }],
|
finishId: [{ required: true, message: '请选择做成人', trigger: 'blur' }],
|
annualMaintenanceDeviceSaveDTOReqs: [{ required: true, validator: checkList, trigger: 'blur' }],
|
},
|
isAdmin: false,
|
companyList: [],
|
userList: [],
|
monthList: [
|
{label: '一月',value: 'jan'},
|
{label: '二月',value: 'feb'},
|
{label: '三月',value: 'mar'},
|
{label: '四月',value: 'apr'},
|
{label: '五月',value: 'may'},
|
{label: '六月',value: 'jun'},
|
{label: '七月',value: 'jul'},
|
{label: '八月',value: 'aug'},
|
{label: '九月',value: 'sep'},
|
{label: '十月',value: 'oct'},
|
{label: '十一月',value: 'nov'},
|
{label: '十二月',value: 'decm'}
|
]
|
})
|
onMounted(() => {
|
|
});
|
|
const openDialog = async (type, value,companyId, isAdmin, companyList) => {
|
state.isAdmin = isAdmin
|
if(isAdmin){
|
state.companyList = companyList
|
}
|
await getUserList(companyId)
|
state.title = type === 'add' ? '新增' : type ==='edit' ? '编辑' : '查看'
|
state.form.companyId = companyId
|
if(state.title == '编辑'||state.title == '查看'){
|
await getInfo(value.id)
|
}
|
dialogVisible.value = true
|
}
|
|
const addLine = () => {
|
const obj = {
|
id: null,
|
annualMaintenanceId: null,
|
annualMaintenanceDeviceTypes: [
|
{
|
id: null,
|
annualMaintenanceDeviceId: null,
|
projectType: 1,
|
frequency: 1,
|
jan: '',
|
feb: '',
|
mar: '',
|
apr: '',
|
may: '',
|
jun: '',
|
jul: '',
|
aug: '',
|
sep: '',
|
oct: '',
|
nov: '',
|
decm: ''
|
},
|
{
|
id: null,
|
annualMaintenanceDeviceId: null,
|
projectType: 2,
|
frequency: 2,
|
jan: '',
|
feb: '',
|
mar: '',
|
apr: '',
|
may: '',
|
jun: '',
|
jul: '',
|
aug: '',
|
sep: '',
|
oct: '',
|
nov: '',
|
decm: ''
|
},
|
{
|
id: null,
|
annualMaintenanceDeviceId: null,
|
projectType: 3,
|
frequency: 3,
|
jan: '',
|
feb: '',
|
mar: '',
|
apr: '',
|
may: '',
|
jun: '',
|
jul: '',
|
aug: '',
|
sep: '',
|
oct: '',
|
nov: '',
|
decm: ''
|
}
|
],
|
delDeviceTypeIds: [],
|
deviceName: '',
|
model: '',
|
factoryNumber: '',
|
purpose: '',
|
deptName: ''
|
}
|
state.form.annualMaintenanceDeviceSaveDTOReqs.push(obj);
|
}
|
|
const handleDelete = (i) =>{
|
state.form.annualMaintenanceDeviceSaveDTOReqs = state.form.annualMaintenanceDeviceSaveDTOReqs.filter((item,index) => index != i)
|
}
|
|
const onSubmit = async () => {
|
const valid = await superRef.value.validate();
|
console.log(state.form,'form')
|
// return
|
if(valid){
|
const data = JSON.parse(JSON.stringify(state.form))
|
data.delDeviceIds = state.oldDeviceList.filter(i =>!data.annualMaintenanceDeviceSaveDTOReqs.some(item=>item.id == i.id)).map(i=>i.id)
|
data.approvalName = state.userList.find(i=>i.userId == data.approvalId)?.name
|
data.processName = state.userList.find(i=>i.userId == data.processId)?.name
|
data.finishName = state.userList.find(i=>i.userId == data.finishId)?.name
|
data.name = data.year + '年度基础设施维护计划'
|
if(state.title == '新增'){
|
delete data.id
|
const res = await updateMaintenancePlan(data)
|
if(res.code == 200){
|
ElMessage.success(res.message)
|
emit('getList')
|
handleClose()
|
dialogVisible.value = false;
|
}else{
|
ElMessage.warning(res.message)
|
}
|
}else{
|
const res = await updateMaintenancePlan(data)
|
if(res.code == 200){
|
ElMessage.success(res.message)
|
emit('getList')
|
handleClose()
|
dialogVisible.value = false;
|
}else{
|
ElMessage.warning(res.message)
|
}
|
}
|
}
|
}
|
|
const getInfo = async (id)=> {
|
const res = await getMaintenancePlanDetail({id: id})
|
if(res.code == 200){
|
Object.keys(state.form).forEach(key => {
|
if (key in res.data) {
|
state.form[key] = res.data[key]
|
}
|
})
|
state.form.annualMaintenanceDeviceSaveDTOReqs = res.data.annualMaintenanceDeviceList.map(item=>{
|
return {
|
...item,
|
annualMaintenanceDeviceTypes: [...item.annualMaintenanceDeviceTypeList].sort((a, b) => a.projectType - b.projectType)
|
}
|
})
|
state.oldDeviceList = res.data.annualMaintenanceDeviceList
|
}else{
|
ElMessage.warning(res.message)
|
}
|
}
|
|
const getDeptList = async ()=>{
|
state.form.approvalId = null
|
state.form.processId = null
|
state.form.finishId = null
|
await getUserList(state.form.companyId)
|
}
|
|
const getUserList = async (companyId)=> {
|
const res = await listUser({pageIndex: 1,pageSize: 999,companyId: companyId})
|
if(res.code == 200){
|
state.userList = res.data.list?res.data.list.map(item=>{
|
const user = item.id
|
const {id, ...data} = item
|
return {
|
...data,
|
userId: user
|
}
|
}):[]
|
if(state.form.deptId){
|
state.interUserList = state.userList.filter(i=>i.deptId !== state.form.deptId)
|
}else{
|
state.interUserList = state.userList
|
}
|
}else{
|
ElMessage.warning(res.message)
|
}
|
}
|
|
const handleClose = () => {
|
state.form = {
|
id: null,
|
companyId: null,
|
name: '',
|
year: '',
|
number: '',
|
annualMaintenanceDeviceSaveDTOReqs: [],
|
approvalId: null,
|
approvalName: '',
|
processId: null,
|
processName: '',
|
finishId: null,
|
finishName: '',
|
delDeviceIds: []
|
}
|
superRef.value.clearValidate();
|
superRef.value.resetFields()
|
dialogVisible.value = false;
|
}
|
|
defineExpose({
|
openDialog
|
});
|
|
</script>
|
|
<style scoped lang="scss">
|
.notice{
|
:deep(.el-form .el-form-item__label) {
|
font-size: 15px;
|
}
|
.file {
|
display: flex;
|
flex-direction: column;
|
align-items: flex-start;
|
}
|
.device-table {
|
width: calc(100% - 170px);
|
margin-left: 170px;
|
margin-bottom: 30px;
|
padding: 5px;
|
border: 1px solid #2563eb;
|
border-radius: 5px;
|
background: #fff;
|
box-shadow: 8px 8px 15px rgba(0, 21, 41, 0.08), -8px -8px 15px #fff;
|
}
|
|
table {
|
width: 100%;
|
border-collapse: collapse;
|
margin-bottom: 4px;
|
}
|
|
th, td {
|
border: 1px solid #ebeef5;
|
padding: 0;
|
text-align: center;
|
}
|
|
th {
|
padding: 4px 0;
|
background-color: #f8f8f9;
|
}
|
.maintain-table{
|
margin-bottom: 0;
|
}
|
}
|
</style>
|
<style lang="scss">
|
.device-table {
|
.el-textarea__inner{
|
border: none !important;
|
border-color: rgba(0,0,0,0);
|
border-radius: 0;
|
}
|
.el-input__wrapper{
|
border: none !important;
|
border-color: rgba(0,0,0,0);
|
border-radius: 0;
|
}
|
}
|
</style>
|
