| | |
| | | </el-col> |
| | | <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20"> |
| | | <el-form-item label="事故部门" placeholder="请选择" prop="accidentDepartmentId"> |
| | | <el-tree-select v-model="ruleForm.accidentDepartmentId" :data="data" class="w100" placeholder="请选择" /> |
| | | <el-tree-select v-model="ruleForm.accidentDepartmentId" :props="propse" :data="newTreeList" class="w100" placeholder="请选择" /> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20"> |
| | |
| | | </el-col> |
| | | <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20"> |
| | | <el-form-item label="发生时间" prop="occurrenceTime"> |
| | | <el-date-picker v-model="ruleForm.occurrenceTime" value-format="YYYY-MM-DD HH:mm:ss" type="datetime" class="w100" placeholder="选择日期时间" /> |
| | | <el-date-picker |
| | | v-model="ruleForm.occurrenceTime" |
| | | value-format="YYYY-MM-DD HH:mm:ss" |
| | | type="datetime" |
| | | class="w100" |
| | | placeholder="选择日期时间" |
| | | /> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20"> |
| | |
| | | </el-col> |
| | | <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24" class="mb20"> |
| | | <el-form-item label="事故照片"> |
| | | <el-input v-model="ruleForm.describe" type="textarea" placeholder="请填写应急防范措施" maxlength="150"></el-input> |
| | | <el-input v-model="ruleForm.fileList" type="textarea" placeholder="请填写应急防范措施" maxlength="150"></el-input> |
| | | </el-form-item> |
| | | </el-col> |
| | | </el-row> |
| | |
| | | </template> |
| | | |
| | | <script lang="ts"> |
| | | import { reactive, ref, defineComponent, defineEmits } from 'vue'; |
| | | import { reactive, ref, defineComponent, defineEmits,onMounted} from 'vue'; |
| | | |
| | | import type { UploadUserFile, FormInstance, FormRules } from 'element-plus'; |
| | | import { ElMessage } from 'element-plus'; |
| | |
| | | import CheckTemplate from '/@/components/checkTemplate/index.vue'; |
| | | import RegionsDialog from '/@/components/regionsDialog/index.vue'; |
| | | import { accidentManagementSystemApi } from '/@/api/accidentManagementSystem'; |
| | | import { goalManagementApi } from '/@/api/goalManagement'; |
| | | export default defineComponent({ |
| | | name: 'openAdd', |
| | | components: { |
| | |
| | | const fileList = ref<UploadUserFile[]>([]); |
| | | // 可选择树 |
| | | const treeSelect = ref(); |
| | | const tree = [ |
| | | { |
| | | value: '1', |
| | | label: 'Level one 1', |
| | | children: [ |
| | | { |
| | | value: '1-1', |
| | | label: 'Level two 1-1', |
| | | children: [ |
| | | { |
| | | value: '1-1-1', |
| | | label: 'Level three 1-1-1', |
| | | }, |
| | | ], |
| | | }, |
| | | ], |
| | | }, |
| | | { |
| | | value: '2', |
| | | label: 'Level one 2', |
| | | children: [ |
| | | { |
| | | value: '2-1', |
| | | label: 'Level two 2-1', |
| | | children: [ |
| | | { |
| | | value: '2-1-1', |
| | | label: 'Level three 2-1-1', |
| | | }, |
| | | ], |
| | | }, |
| | | { |
| | | value: '2-2', |
| | | label: 'Level two 2-2', |
| | | children: [ |
| | | { |
| | | value: '2-2-1', |
| | | label: 'Level three 2-2-1', |
| | | }, |
| | | ], |
| | | }, |
| | | ], |
| | | }, |
| | | { |
| | | value: '3', |
| | | label: 'Level one 3', |
| | | children: [ |
| | | { |
| | | value: '3-1', |
| | | label: 'Level two 3-1', |
| | | children: [ |
| | | { |
| | | value: '3-1-1', |
| | | label: 'Level three 3-1-1', |
| | | }, |
| | | ], |
| | | }, |
| | | { |
| | | value: '3-2', |
| | | label: 'Level two 3-2', |
| | | children: [ |
| | | { |
| | | value: '3-2-1', |
| | | label: 'Level three 3-2-1', |
| | | }, |
| | | ], |
| | | }, |
| | | ], |
| | | }, |
| | | ]; |
| | | |
| | | //定义树形下拉框 |
| | | const responsibleDepartment = ref(); |
| | | const data = [ |
| | | { |
| | | value: '1', |
| | | label: '广汇能源综合物流发展有限责任公司', |
| | | children: [ |
| | | { |
| | | value: '11', |
| | | label: '经营班子', |
| | | children: [], |
| | | }, |
| | | ], |
| | | "value": 1, |
| | | "deptName": "总部门", |
| | | "children": [] |
| | | }, |
| | | { |
| | | value: '2', |
| | | label: '生产运行部', |
| | | children: [ |
| | | "value": 3, |
| | | "deptName": "根部门2", |
| | | "children": [ |
| | | { |
| | | value: '21', |
| | | label: '灌装一班', |
| | | children: [], |
| | | }, |
| | | { |
| | | value: '22', |
| | | label: '工艺四班', |
| | | children: [], |
| | | }, |
| | | ], |
| | | }, |
| | | { |
| | | value: '3', |
| | | label: '设备部', |
| | | children: [ |
| | | { |
| | | value: '31', |
| | | label: '仪表班', |
| | | children: [], |
| | | }, |
| | | { |
| | | value: '32', |
| | | label: '机修班', |
| | | children: [], |
| | | }, |
| | | ], |
| | | }, |
| | | "value": 7, |
| | | "deptName": "子部门88", |
| | | "children": [] |
| | | } |
| | | ] |
| | | } |
| | | ]; |
| | | //el-tree-select回显 |
| | | const propse = { |
| | | label: 'depName', |
| | | children: 'children' |
| | | }; |
| | | const newTreeList = [] |
| | | //得到部门树 |
| | | const department = async() => { |
| | | await goalManagementApi() |
| | | .getTreedepartment() |
| | | .then((res) => { |
| | | if (res.data.code == 200) { |
| | | data.value = res.data.data; |
| | | getTreeList(res.data.data,newTreeList) |
| | | } else { |
| | | ElMessage.error(res.data.msg); |
| | | } |
| | | }); |
| | | }; |
| | | // 递归树状数据且修改字段名 |
| | | const getTreeList = (treeList,newTreeList) => { |
| | | treeList.map(c=>{ |
| | | let tempData={ |
| | | depName:c.depName, |
| | | value:c.depId, |
| | | children:[] |
| | | } |
| | | if(c.children && c.children.length>0){ |
| | | tempData.children=[] |
| | | getTreeList(c.children,tempData.children) |
| | | } |
| | | newTreeList.push(tempData) |
| | | }) |
| | | } |
| | | onMounted(() => { |
| | | department() |
| | | }); |
| | | // 必填项提示 |
| | | const rules = reactive<FormRules>({ |
| | | accidentName: [ |
| | |
| | | console.log('error submit!', fields); |
| | | } |
| | | }); |
| | | } |
| | | else if (title == '修改事故快报') { |
| | | } else if (title == '修改事故快报') { |
| | | if (!formEl) return; |
| | | await formEl.validate((valid, fields) => { |
| | | if (valid) { |
| | | isShowDialog.value = false; |
| | | ruleForm.value.fileList = [ |
| | | { |
| | | fileUrl: 'url', |
| | | fileName: 'name', |
| | | }, |
| | | ]; |
| | | accidentManagementSystemApi() |
| | | .accidentView(ruleForm.value) |
| | | .then((res) => { |
| | |
| | | ruleForm, |
| | | value1, |
| | | treeSelect, |
| | | tree, |
| | | daiInpt, |
| | | Shows, |
| | | ruleFormRef, |
| | |
| | | titles, |
| | | disabled, |
| | | emit, |
| | | propse, |
| | | department, |
| | | getTreeList, |
| | | newTreeList |
| | | }; |
| | | }, |
| | | }); |
| | |
| | | .el-select { |
| | | width: 100%; |
| | | } |
| | | </style> |
| | | </style> |