Prechádzať zdrojové kódy

修复预案选择弹窗

Hwf 5 mesiacov pred
rodič
commit
ef5f0d6023

+ 19 - 41
src/views/emergencyCommandMap/RightSection/SelectPlan.vue

@@ -1,39 +1,32 @@
 <template>
-  <Dialog ref="dialogRef" :hide-title="false" v-model="isDialogVisible" type="lg" title="预案任务下发" @confirm="startSelectedPlan" @close="handleCloseDialog">
+  <Dialog
+    ref="dialogRef"
+    :hide-title="false"
+    v-model="isDialogVisible"
+    type="sm"
+    title="预案选择"
+    style="height: 500px"
+    @confirm="startSelectedPlan"
+    @close="handleCloseDialog"
+  >
     <div class="dialog-content">
       <div class="dialog-body">
         <!--        <div class="plan-selector">-->
-        <el-form-item label="预案名称:" label-width="200px">
+        <el-form-item label="预案名称:" label-width="205px">
           <el-select
             id="plan-select"
             v-model="selectedPlanId"
             class="custom-select"
             placeholder="请选择预案"
             popper-class="custom-select-popper"
-            size="large"
             :teleported="false"
-            @change="startSelectedPlan"
           >
             <!--        <option value="">请选择预案</option>-->
-            <el-option v-for="plan in plans" :key="plan.plan_id" :value="plan.plan_id">{{ plan.plan_name }}</el-option>
+            <el-option v-for="plan in plans" :key="plan.plan_id" :label="plan.plan_name" :value="plan.plan_id" />
           </el-select>
         </el-form-item>
       </div>
     </div>
-    <!-- 预案选择器 -->
-    <!--    <div class="plan-selector">-->
-    <!--      <label>预案名称:</label>-->
-    <!--      <el-select id="plan-select" v-model="selectedPlanId" class="custom-select" placeholder="请选择预案" popper-class="custom-select-popper" size="large" :teleported=false @change="startSelectedPlan">-->
-    <!--        &lt;!&ndash;        <option value="">请选择预案</option>&ndash;&gt;-->
-    <!--        <el-option v-for="plan in plans" :key="plan.plan_id" :value="plan.plan_id">{{ plan.plan_name }}</el-option>-->
-    <!--      </el-select>-->
-    <!--    </div>-->
-    <!--    <template #footer>-->
-    <!--      <span class="dialog-footer">-->
-    <!--        <button class="com" @click="startSelectedPlan">确定并启动预案</button>-->
-    <!--        <button class="custom-button" @click="hideDialog">取消</button>-->
-    <!--      </span>-->
-    <!--    </template>-->
   </Dialog>
 </template>
 <script lang="ts" setup>
@@ -160,31 +153,16 @@ onMounted(() => {
   vertical-align: middle;
 }
 
-.custom-button {
-  display: inline-block;
-  padding: 8px 16px;
-  font-size: 14px;
-  border-radius: 5px;
-  color: white;
-  background-color: #409eff;
-  box-shadow: none;
-  border: none;
-  cursor: pointer;
-  transition: all 0.3s ease-in-out;
-}
-
-.custom-button:hover {
-  background-color: #73a2ff;
-}
-
-.custom-button:active {
-  transform: translateY(1px);
-}
-
 .dialog-footer button {
   margin-right: 10px;
   width: 120px; /* 根据实际需求调整 */
   text-align: center;
 }
-
+:deep(.dialog-content) {
+  overflow: unset !important;
+}
+:deep(.el-form-item__label) {
+  color: #fff !important;
+  font-size: 38px;
+}
 </style>