开始指挥选择事件等级弹窗

src/types/components.d.ts

@@ -33,11 +33,6 @@ declare module 'vue' {
     ElSkeleton: typeof import('element-plus/es')['ElSkeleton']
     ElSkeletonItem: typeof import('element-plus/es')['ElSkeletonItem']
     ElSlider: typeof import('element-plus/es')['ElSlider']
-    ElStep: typeof import('element-plus/es')['ElStep']
-    ElSteps: typeof import('element-plus/es')['ElSteps']
-    ElSwitch: typeof import('element-plus/es')['ElSwitch']
-    ElTabPane: typeof import('element-plus/es')['ElTabPane']
-    ElTabs: typeof import('element-plus/es')['ElTabs']
     ElText: typeof import('element-plus/es')['ElText']
     ElTimeline: typeof import('element-plus/es')['ElTimeline']
     ElTimelineItem: typeof import('element-plus/es')['ElTimelineItem']

src/views/login.vue

@@ -364,4 +364,7 @@ onMounted(() => {
     right: -5px;
   }
 }
+:deep(.el-form .el-form-item--default .el-form-item__error) {
+  font-size: 14px !important;
+}
 </style>

src/views/routineCommandMap/RightSection/EventReport/EventManage.vue

@@ -166,7 +166,7 @@
         </div>
         <div class="td">{{ item.event_time }}</div>
         <div class="td">
-          <div v-if="item.event_status === '0'" class="btn-box" @click="enterCommand(item)">
+          <div v-if="item.event_status === '0'" class="btn-box" @click="startCommand()">
             <i class="start-icon" />
             <div class="gradient-text3">开始指挥</div>
           </div>
@@ -181,6 +181,34 @@
 <!--          <div class="common-btn2" @click="enterCommand(item)">进入指挥</div>-->
           <!--          <div class="common-btn2" style="margin-left: 20px" @click="handleClose(item)">关闭事件</div>-->
         </div>
+        <Dialog
+          v-if="startPop"
+          type="sm"
+          custom-show
+          :title="title"
+          confirm-text="确 定"
+          confirm-class="common-btn-danger"
+          @confirm="enterCommand1(item)"
+          @close="conmandClose"
+          style="height: 500px"
+          class="two"
+        >
+          <el-form ref="eventFormRef" :model="form" :rules="data.rules" label-width="190px">
+            <el-form-item label="事件等级" prop="event_level">
+              <el-select
+                v-model="queryParams.event_level"
+                placeholder="请选择事件"
+                class="custom-select"
+                size="large"
+                popper-class="custom-select-popper"
+                :teleported="false"
+                clearable
+              >
+                <el-option v-for="item in mm_event_level" :key="item.value" :label="item.label" :value="item.value"></el-option>
+              </el-select>
+            </el-form-item>
+          </el-form>
+        </Dialog>
       </div>
     </div>
     <div class="footer">
@@ -200,6 +228,26 @@
       @update:model-value="handleCloseEventDialog"
     />
   </Dialog>
+
+<!--  <Dialog v-model="startPop" type="xs" title="开始指挥" hide-footer class="two"-->
+<!--          @close="closeDialog"-->
+<!--          @confirm="submitEvent"-->
+<!--          confirm-text="关联事件">-->
+<!--    <el-form-item label="事件等级" prop="event_level" style="margin-top: 40px">-->
+<!--      <el-select-->
+<!--        v-model="queryParams.event_level"-->
+<!--        placeholder="全部"-->
+<!--        class="custom-select"-->
+<!--        style="width: 800px"-->
+<!--        size="large"-->
+<!--        popper-class="custom-select-popper"-->
+<!--        :teleported="false"-->
+<!--      >-->
+<!--        <el-option label="全部" value=""></el-option>-->
+<!--        <el-option v-for="item in mm_event_level" :key="item.value" :label="item.label" :value="item.value"></el-option>-->
+<!--      </el-select>-->
+<!--    </el-form-item>-->
+<!--  </Dialog>-->
 </template>
 
 <script lang="ts" setup>
@@ -256,10 +304,14 @@ const data = reactive({
   },
   event_levelSelection: [],
   event_statusSelection: [],
-  regionSelection: []
+  regionSelection: [],
+  rules: {
+    event_level: [{ required: true, message: '事件等级不能为空', trigger: 'blur' }]
+  }
 });
 
 const { queryParams, form } = toRefs(data);
+
 const getList = () => {
   loading.value = true;
   getEvent(queryParams.value)
@@ -368,6 +420,28 @@ const enterCommand = (item) => {
     });
   }
 };
+const enterCommand1 = (item) => {
+  if (!queryParams.value.event_level) {
+    proxy?.$modal.msgError('请先选择一个等级');
+    return;
+  }
+  if (item) {
+    // 查看事件详情逻辑
+    console.log('进入指挥', item);
+    router.push({
+      path: props.flag ? '/emergencyCommandMap' : '/emergencyCommandMap2',
+      query: { event_id: item.event_id }
+    });
+    startPop.value = false;
+  }
+};
+const startPop = ref(false);
+const startCommand = () => {
+  startPop.value = true;
+};
+const conmandClose = () => {
+  startPop.value = false;
+};
 </script>
 
 <style lang="scss" scoped>
@@ -467,4 +541,48 @@ const enterCommand = (item) => {
   display: flex;
   align-items: flex-start;
 }
+.btn-box {
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  cursor: pointer;
+  .start-icon {
+    display: inline-block;
+    width: 50px;
+    height: 50px;
+    background: url('@/assets/images/routineCommandMap/eventReport/start.png') no-repeat;
+    background-size: 100% 100%;
+    margin-right: 8px;
+  }
+  .record-icon {
+    display: inline-block;
+    width: 46px;
+    height: 50px;
+    background: url('@/assets/images/routineCommandMap/eventReport/record.png') no-repeat;
+    background-size: 100% 100%;
+    margin-right: 8px;
+  }
+}
+
+
+.two {
+  :deep(.dialog-content) {
+    overflow: unset !important;
+  }
+
+  :deep(.el-form-item__label) {
+    color: #fff !important;
+  }
+}
+//:deep(.el-form-item__label) {
+//  font-size: 40px;
+//  color: #ffffff;
+//  margin-right: 10px;
+//}
+//
+//.two {
+//  &:deep(.dialog-content) {
+//    overflow: unset !important;
+//  }
+//}
 </style>