<template>
|
<div class="system-add-menu-container">
|
<el-dialog :title="title" v-model="isShowWorkDialog" append-to-body :close-on-click-modal="false" width="50%">
|
<div class="work-form">
|
<el-form :model="workForm" :rules="workFormRules" ref="workFormRef" size="default" label-width="150px">
|
<el-row :gutter="35">
|
<el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="12" class="mb20">
|
<el-form-item label="排查类型" prop="checkWorkType">
|
<el-select class="input-add" v-model="workForm.checkWorkType" placeholder="请输入排查类型" clearable>
|
<el-option v-for="item in checkWorkTypeList" :key="item.id" :label="item.name" :value="item.id"></el-option
|
></el-select>
|
</el-form-item>
|
</el-col>
|
<el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="12" class="mb20">
|
<el-form-item label="排查名称" prop="checkWorkName">
|
<el-input class="input-add" v-model.trim="workForm.checkWorkName" placeholder="请输入排查名称" clearable></el-input>
|
</el-form-item>
|
</el-col>
|
<el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="12" class="mb20">
|
<el-form-item label="整改部门" prop="depId">
|
<el-cascader
|
@change="achieveUserList"
|
:options="departmentList"
|
:props="{ emitPath: false, checkStrictly: true, value: 'depId', label: 'depName' }"
|
placeholder="请选择部门"
|
clearable
|
filterable
|
class="input-add"
|
v-model="workForm.depId"
|
>
|
</el-cascader>
|
</el-form-item>
|
</el-col>
|
<el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="12" class="mb20">
|
<el-form-item label="执行人" prop="execUserId">
|
<el-select class="input-add" v-model="workForm.execUserId" placeholder="请输入执行人" clearable filterable>
|
<el-option v-for="item in userList" :key="item.uid" :label="item.username" :value="item.uid"></el-option>
|
</el-select>
|
</el-form-item>
|
</el-col>
|
<el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="12" class="mb20">
|
<el-form-item label="排查周期" prop="checkCycle">
|
<el-input
|
class="input-add"
|
type="number"
|
v-model.trim="workForm.checkCycle"
|
placeholder="请输入排查周期"
|
clearable
|
></el-input>
|
</el-form-item>
|
</el-col>
|
<el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="12" class="mb20">
|
<el-form-item label="时间单位" prop="checkCycleUnit">
|
<el-select class="input-add" v-model="workForm.checkCycleUnit" placeholder="请输入时间单位" clearable>
|
<el-option v-for="item in timeType" :key="item.id" :label="item.name" :value="item.id"></el-option>
|
</el-select>
|
</el-form-item>
|
</el-col>
|
<el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="12" class="mb20">
|
<el-form-item label="有效时间" prop="validTime">
|
<el-input
|
class="input-add"
|
type="number"
|
v-model.trim="workForm.validTime"
|
placeholder="请输入有效时间"
|
clearable
|
></el-input>
|
</el-form-item>
|
</el-col>
|
<el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="12" class="mb20">
|
<el-form-item label="时间单位" prop="validTimeUnit">
|
<el-select class="input-add" v-model="workForm.validTimeUnit" placeholder="请输入时间单位" clearable>
|
<el-option v-for="item in timeType" :key="item.id" :label="item.name" :value="item.id"></el-option>
|
</el-select>
|
</el-form-item>
|
</el-col>
|
<el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="12" class="mb20">
|
<el-form-item label="提醒时间" prop="noticeTime">
|
<el-input
|
class="input-add"
|
type="number"
|
v-model.trim="workForm.noticeTime"
|
placeholder="请输入提醒时间"
|
clearable
|
></el-input>
|
</el-form-item>
|
</el-col>
|
<el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="12" class="mb20">
|
<el-form-item label="时间单位" prop="noticeTimeUnit">
|
<el-select class="input-add" v-model="workForm.noticeTimeUnit" placeholder="请输入时间单位" clearable>
|
<el-option v-for="item in timeType" :key="item.id" :label="item.name" :value="item.id"></el-option>
|
</el-select>
|
</el-form-item>
|
</el-col>
|
<el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="12" class="mb20">
|
<el-form-item label="任务单元" prop="taskUnitId">
|
<el-select class="input-add" v-model="workForm.taskUnitId" placeholder="请输入任务单元" clearable filterable>
|
<el-option v-for="item in taskUnitList" :key="item.id" :label="item.taskUnitName" :value="item.id"></el-option>
|
</el-select>
|
</el-form-item>
|
</el-col>
|
<el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="12" class="mb20">
|
<el-form-item label="首次任务开始时间" prop="firstStartTime">
|
<el-date-picker
|
class="input-add"
|
type="datetime"
|
value-format="YYYY-MM-DD HH:mm:ss"
|
v-model="workForm.firstStartTime"
|
placeholder="请选择首次任务开始时间"
|
clearable
|
></el-date-picker>
|
</el-form-item>
|
</el-col>
|
</el-row>
|
</el-form>
|
</div>
|
|
<template #footer>
|
<span class="dialog-footer">
|
<el-button @click="isShowWorkDialog = !isShowWorkDialog" size="default">取 消</el-button>
|
<el-button type="primary" @click="submitWork" v-throttle size="default">确 实</el-button>
|
</span>
|
</template>
|
</el-dialog>
|
</div>
|
</template>
|
|
<script lang="ts">
|
import { getUserByDepartment } from '/@/assets/methods';
|
|
interface stateType {
|
isShowWorkDialog: Boolean;
|
workForm: {
|
checkWorkType: number | null;
|
checkWorkName: string | null;
|
taskUnitId: number | null;
|
execUserId: number | null;
|
checkCycle: number | null;
|
checkCycleUnit: number | null;
|
validTime: number | null;
|
validTimeUnit: number | null;
|
noticeTime: number | null;
|
noticeTimeUnit: number | null;
|
depId: number | null;
|
firstStartTime: string | null;
|
};
|
title: string;
|
activeName: string;
|
checkWorkTypeList: [];
|
departmentList: [];
|
taskUnitList: [];
|
userList: [];
|
timeType: Array<timeState>;
|
workFormRules: {};
|
}
|
interface timeState {
|
id: number;
|
name: string;
|
}
|
import { reactive, toRefs, ref } from 'vue';
|
import { workApi } from '/@/api/doublePreventSystem/work';
|
import { ElMessage } from 'element-plus';
|
export default {
|
name: 'workDialog',
|
setup(props: any, context: any) {
|
const workFormRef = ref();
|
const state = reactive<stateType>({
|
title: '',
|
activeName: 'inspectionPoint',
|
checkWorkTypeList: [],
|
departmentList: [],
|
taskUnitList: [],
|
userList: [],
|
timeType: [
|
{ id: 1, name: '分' },
|
{ id: 2, name: '小时' },
|
{ id: 3, name: '日' },
|
{ id: 4, name: '月' },
|
{ id: 5, name: '年' }
|
],
|
isShowWorkDialog: false,
|
workForm: {
|
checkWorkType: null,
|
checkWorkName: null,
|
taskUnitId: null,
|
execUserId: null,
|
checkCycle: null,
|
checkCycleUnit: null,
|
validTime: null,
|
validTimeUnit: null,
|
noticeTime: null,
|
noticeTimeUnit: null,
|
firstStartTime: null,
|
depId: null
|
},
|
workFormRules: {
|
produceDeviceName: [{ required: true, message: '请填写生产装置名称', trigger: 'blur' }],
|
depId: [{ required: true, message: '请选择部门', trigger: 'change' }],
|
riskLevel: [{ required: true, message: '请选择风险等级', trigger: 'change' }],
|
location: [{ required: true, message: '请填写区域位置', trigger: 'blur' }]
|
}
|
});
|
|
//打开模态框
|
const openWorkDialog = (type: string, value: object, department: [], checkWorkTypeList: [], taskUnitList: []) => {
|
state.isShowWorkDialog = true;
|
state.departmentList = department;
|
state.taskUnitList = JSON.parse(JSON.stringify(taskUnitList));
|
state.checkWorkTypeList = JSON.parse(JSON.stringify(checkWorkTypeList));
|
setTimeout(() => {
|
workFormRef.value.clearValidate();
|
});
|
if (type === '新增') {
|
state.title = '新增生产装置';
|
state.workForm = {
|
checkWorkType: null,
|
checkWorkName: null,
|
taskUnitId: null,
|
execUserId: null,
|
checkCycle: null,
|
checkCycleUnit: null,
|
validTime: null,
|
validTimeUnit: null,
|
noticeTime: null,
|
noticeTimeUnit: null,
|
firstStartTime: null,
|
depId: null
|
};
|
} else {
|
state.title = '修改生产装置';
|
state.workForm = JSON.parse(JSON.stringify(value));
|
}
|
};
|
|
//新增修改提交
|
const submitWork = async () => {
|
workFormRef.value.validate(async (valid: Boolean) => {
|
if (valid) {
|
if (state.title === '新增生产装置') {
|
let res = await workApi().addWork(state.workForm);
|
if (res.data.code === '200') {
|
ElMessage({
|
type: 'success',
|
message: '生产装置新增成功',
|
duration: 2000
|
});
|
state.isShowWorkDialog = false;
|
context.emit('refreshWork');
|
} else {
|
ElMessage({
|
type: 'warning',
|
message: res.data.msg
|
});
|
}
|
} else {
|
let res = await workApi().modWork(state.workForm);
|
if (res.data.code === '200') {
|
ElMessage({
|
type: 'success',
|
message: '生产装置修改成功',
|
duration: 2000
|
});
|
state.isShowWorkDialog = false;
|
context.emit('refreshWork');
|
} else {
|
ElMessage({
|
type: 'warning',
|
message: res.data.msg
|
});
|
}
|
}
|
} else {
|
ElMessage({
|
type: 'warning',
|
message: '请完善基本信息'
|
});
|
}
|
});
|
};
|
|
const achieveUserList = async () => {
|
state.workForm.execUserId = null;
|
const user: unknown = await getUserByDepartment(state.workForm.depId);
|
state.userList = user as [];
|
};
|
|
return {
|
...toRefs(state),
|
workFormRef,
|
submitWork,
|
openWorkDialog,
|
achieveUserList
|
};
|
}
|
};
|
</script>
|
|
<style scoped>
|
::v-deep.el-divider--horizontal {
|
margin-top: 0px !important;
|
}
|
|
::v-deep.el-dialog__body {
|
padding-top: 10px !important;
|
}
|
.filter-container {
|
padding: 10px 0px;
|
}
|
</style>
|
