任务跟踪样式调整

src/assets/styles/index.scss

@@ -489,3 +489,13 @@ aside {
     transform: translateX(0);
   }
 }
+
+.success-bg {
+  background-color: #38c95a;
+}
+.primary-bg {
+  background-color: #2c81ff;
+}
+.processing-bg {
+  background-color: #ffb000;
+}

src/views/emergencyCommandMap/RightSection/RenWuGenZong.vue

@@ -7,7 +7,7 @@
           <div class="header-left">
             <div class="box-title">{{ item.unit_name ? item.unit_name : '茂名市应急局' }}</div>
             <div class="time">{{ item.update_time }}</div>
-            <div :class="item.processing_status === '已完成' ? 'success' : 'processing'">{{ item.processing_status }}</div>
+            <div :class="item.processing_status === '已完成' ? 'success-bg' : item.processing_status === '已完成' ? 'primary-bg' : 'processing-bg'">{{ item.processing_status }}</div>
           </div>
           <div class="btn" @click="openUpdateDialog(item)">更新</div>
         </div>
@@ -154,8 +154,8 @@ watch(
         margin-left: 70px;
       }
     }
-    .success,
-    .processing,
+    .success-bg,
+    .processing-bg,
     .btn {
       width: 154px;
       height: 56px;
@@ -166,12 +166,6 @@ watch(
       text-align: center;
       margin-left: 30px;
     }
-    .success {
-      background-color: #38c95a;
-    }
-    .processing {
-      background-color: #ffb000;
-    }
     .btn {
       background-color: #247dff;
       cursor: pointer;

src/views/emergencyCommandMap/RightSection/RenWuGenZongInfo.vue

@@ -63,9 +63,10 @@
         <div class="td">{{ item.registrar }}</div>
         <div class="td">{{ formatDateTime(item.creation_time) }}</div>
         <div class="td">{{ formatDateTime(item.update_time) }}</div>
-        <div class="td">{{ item.processing_status }}</div>
         <div class="td">
-          <div>更新</div>
+          <div :class="item.processing_status === '已完成' ? 'success-bg' : item.processing_status === '已完成' ? 'primary-bg' : 'processing-bg'">{{ item.processing_status }}</div></div>
+        <div class="td">
+          <div class="btn" @click="openUpdateDialog(item)">更新</div>
         </div>
       </div>
     </div>
@@ -80,11 +81,19 @@
       />
     </div>
   </Dialog>
+  <RenWuGengXin
+    v-model="newSectionState.showListDialog"
+    :task="selectedTask"
+    :event-id="eventId"
+    title="任务进度更新"
+    @update-success="getList"
+  />
 </template>
 
 <script lang="ts" setup>
 import { ref, reactive } from 'vue';
 import { selectTask } from '@/api/emergencyCommandMap/JointDuty';
+import RenWuGengXin from '@/views/emergencyCommandMap/RightSection/RenWuGengXin.vue';
 
 const taskList = ref([]);
 const total = ref(0);
@@ -131,30 +140,6 @@ const resetQuery = () => {
   getList();
 };
 
-const handleSelectionChange = (selection) => {
-  ids.value = selection.map((item) => item.eventId);
-  selectedRow.value = selection.length === 1 ? selection[0] : null;
-  single.value = selection.length != 1;
-  multiple.value = !selection.length;
-};
-
-const eventEditDialogState = reactive({
-  show: false,
-  title: ''
-});
-const eventDetailsState = reactive({
-  show: false,
-  title: ''
-});
-
-//查看事件详情
-const handleView = (row) => {
-  // 查看事件详情逻辑
-  eventId.value = row.event_id;
-  eventDetailsState.title = '查看事件';
-  eventDetailsState.show = true;
-};
-
 // 关闭事件
 const closeDialogState = reactive({
   show: false,
@@ -167,19 +152,20 @@ const closeDialogState = reactive({
   }
 });
 
-const handleClose = (row) => {
-  if (row) {
-    console.log(row);
-    closeDialogState.form.eventId = row.event_id;
-    closeDialogState.form.deaths = row.deaths;
-    closeDialogState.form.injuries = row.injuries;
-    closeDialogState.form.missing = row.missing;
-    closeDialogState.show = true;
-  }
-};
+// 选中的任务
+const selectedTask = ref({
+  task_id: '',
+  sortBy: 'creation_time',
+  pageNum: 2,
+  pageSize: 20
+});
+const newSectionState = reactive({
+  showListDialog: false
+});
 
-const handleCloseEventDialog = (b) => {
-  console.log('handleCloseEventDialog', b);
+const openUpdateDialog = (task) => {
+  selectedTask.value = { ...task };
+  newSectionState.showListDialog = true;
 };
 const props = defineProps<{
   modelValue?: boolean;
@@ -331,4 +317,20 @@ const closeDialog = () => {
   display: flex;
   align-items: flex-start;
 }
+.success-bg,
+.processing-bg,
+.btn {
+  width: 154px;
+  height: 56px;
+  line-height: 56px;
+  font-size: 32px;
+  color: #ffffff;
+  border-radius: 10px;
+  text-align: center;
+  margin-left: 30px;
+}
+.btn {
+  background-color: #247dff;
+  cursor: pointer;
+}
 </style>

src/views/emergencyCommandMap/RightSection/RenWuGengXin.vue

@@ -6,17 +6,17 @@
           <el-row :gutter="20">
             <el-col :span="24">
               <el-form-item label="任务描述">
-                <el-input v-model="newTask.task_description" class="custom-input2" readonly />
+                <el-input v-model="newTask.task_description" class="custom-input2" />
               </el-form-item>
             </el-col>
             <el-col :span="24">
               <el-form-item label="执行单位">
-                <el-input v-model="newTask.unit_name" class="custom-input2" readonly />
+                <el-input v-model="newTask.unit_name" class="custom-input2" />
               </el-form-item>
             </el-col>
             <el-col :span="24">
               <el-form-item label="完成进度">
-                <el-select v-model="newTask.registrar" class="custom-select" size="large" popper-class="custom-select-popper">
+                <el-select v-model="newTask.registrar" class="custom-select" size="large" :teleported="false" popper-class="custom-select-popper">
                   <el-option v-for="unit in units" :key="unit" :label="unit" :value="unit"></el-option>
                 </el-select>
               </el-form-item>