|
@@ -1,13 +1,26 @@
|
|
|
<template>
|
|
|
- // type分别为sm、md、lg
|
|
|
- <Dialog custom-show type="sm" title="任务登记" @confirm="confirmRegister" @close="closeDialog">
|
|
|
+ <Dialog custom-show type="sm" title="任务下达" height="500px" @confirm="confirmRegister" @close="closeDialog">
|
|
|
<div class="dialog-content">
|
|
|
<div class="dialog-body">
|
|
|
<el-form ref="taskFormRef" :model="newTask">
|
|
|
- <el-form-item label="任务内容" label-width="200px">
|
|
|
+ <el-form-item label="任务内容" label-width="60px">
|
|
|
<el-input v-model="newTask.task_description" class="custom-input2" clearable placeholder="请输入相关任务描述" />
|
|
|
</el-form-item>
|
|
|
- <el-form-item label="执行单位" label-width="200px">
|
|
|
+ <el-form-item label="任务类型" label-width="60px">
|
|
|
+ <el-select
|
|
|
+ v-model="newTask.task_type"
|
|
|
+ placeholder="选择任务类型"
|
|
|
+ class="custom-select"
|
|
|
+ size="large"
|
|
|
+ popper-class="custom-select-popper"
|
|
|
+ :teleported="false"
|
|
|
+ clearable
|
|
|
+ filterable
|
|
|
+ >
|
|
|
+ <el-option v-for="type in taskTypes" :key="type.id" :label="type.name" />
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="执行单位" label-width="60px">
|
|
|
<el-select
|
|
|
v-model="newTask.unit_name"
|
|
|
placeholder="全部"
|
|
@@ -16,13 +29,24 @@
|
|
|
popper-class="custom-select-popper"
|
|
|
:teleported="false"
|
|
|
clearable
|
|
|
+ filterable
|
|
|
+ @input="fetchFilteredUnits"
|
|
|
>
|
|
|
- <el-option v-for="unit in units" :key="unit.id" :label="unit.unit_name" :value="unit.unit_name" />
|
|
|
+ <el-option v-for="unit in filteredUnits" :key="unit.id" :label="unit.unit_name" :value="unit.unit_name" />
|
|
|
</el-select>
|
|
|
</el-form-item>
|
|
|
- <el-form-item label="登记人" label-width="200px">
|
|
|
+ <el-form-item label="执行人" label-width="60px">
|
|
|
<el-input v-model="newTask.registrar" class="custom-input2" type="text" readonly />
|
|
|
</el-form-item>
|
|
|
+ <el-form-item label="登记人" label-width="60px">
|
|
|
+ <el-input v-model="newTask.registrar" class="custom-input2" type="text" readonly />
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="联系电话" label-width="60px">
|
|
|
+ <el-input v-model="newTask.contact_phone" class="custom-input2" placeholder="发布人的联系电话" />
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="完成时限" label-width="60px">
|
|
|
+ <el-date-picker v-model="newTask.complete_time" type="date" class="common-date-picker" popper-class="common-date-popper" placeholder="选择完成时间" style="width: 100%" />
|
|
|
+ </el-form-item>
|
|
|
</el-form>
|
|
|
</div>
|
|
|
</div>
|
|
@@ -33,11 +57,14 @@
|
|
|
import { ref, reactive, onMounted } from 'vue';
|
|
|
import { addTask, getUnits, getUser } from '@/api/emergencyCommandMap/JointDuty.ts';
|
|
|
|
|
|
-const showRegisterDialog = ref(true);
|
|
|
+const taskTypes = ref([{ name: '事件处置' }, { name: '防范措施' }, { name: '险情处理' }, { name: '督办任务' }]);
|
|
|
const newTask = reactive({
|
|
|
task_description: '',
|
|
|
+ task_type: '',
|
|
|
unit_name: '',
|
|
|
- registrar: ''
|
|
|
+ registrar: '',
|
|
|
+ contact_phone: '',
|
|
|
+ complete_time: ''
|
|
|
});
|
|
|
const units = ref([]);
|
|
|
|
|
@@ -52,6 +79,7 @@ const fetchUser = async () => {
|
|
|
if (response.code === 200) {
|
|
|
// 假设返回的用户信息中包含 username 字段
|
|
|
newTask.registrar = response.data.user.userName;
|
|
|
+ newTask.contact_phone = response.data.user.contactPhone;
|
|
|
} else {
|
|
|
console.error('获取用户信息失败:', response.msg);
|
|
|
}
|
|
@@ -101,65 +129,13 @@ onMounted(() => {
|
|
|
</script>
|
|
|
|
|
|
<style lang="scss" scoped>
|
|
|
-.dialog-wrap {
|
|
|
- position: fixed;
|
|
|
- top: 0;
|
|
|
- right: 0;
|
|
|
- left: 0;
|
|
|
- bottom: 0;
|
|
|
- z-index: 2000;
|
|
|
- width: 100%;
|
|
|
- height: 100%;
|
|
|
- display: flex;
|
|
|
- align-items: center;
|
|
|
- justify-content: center;
|
|
|
- .overlay {
|
|
|
- background-color: rgba(0, 0, 0, 0.5);
|
|
|
- position: absolute;
|
|
|
- top: 0;
|
|
|
- left: 0;
|
|
|
- width: 100%;
|
|
|
- height: 100%;
|
|
|
- z-index: -1;
|
|
|
- cursor: pointer;
|
|
|
- }
|
|
|
- .dialog {
|
|
|
- width: 5000px;
|
|
|
- height: 2000px;
|
|
|
- margin: 0 auto;
|
|
|
- background-color: #fff;
|
|
|
- border-radius: 20px;
|
|
|
- }
|
|
|
-}
|
|
|
-.dialog {
|
|
|
- padding: 0 50px;
|
|
|
- .dialog-header {
|
|
|
- width: 100%;
|
|
|
- height: 150px;
|
|
|
- display: flex;
|
|
|
- justify-content: space-between;
|
|
|
- align-items: center;
|
|
|
- .icon-close {
|
|
|
- cursor: pointer;
|
|
|
+.dialog-content {
|
|
|
+ :deep(.el-form) {
|
|
|
+ .el-form-item__label {
|
|
|
+ color: #fff !important;
|
|
|
+ font-weight: bold !important;
|
|
|
+ margin-right: 5px !important;
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
-.footer {
|
|
|
- height: 64px;
|
|
|
- display: flex;
|
|
|
- justify-content: flex-end;
|
|
|
- margin-bottom: 30px;
|
|
|
- .pagination-container {
|
|
|
- height: 64px;
|
|
|
- margin: 0;
|
|
|
- }
|
|
|
- height: 30px;
|
|
|
- display: flex;
|
|
|
- justify-content: flex-end;
|
|
|
- margin-bottom: 30px;
|
|
|
-}
|
|
|
-.flex {
|
|
|
- display: flex;
|
|
|
- align-items: flex-start;
|
|
|
-}
|
|
|
</style>
|