领导批示弹窗

src/views/emergencyCommandMap/RightSection/LeaderInstruction.vue

@@ -0,0 +1,59 @@
+<template>
+  <Dialog draggable custom-show type="sm" title="领导批示" height="180px" @close="handleClose" @confirm="handleSubmit">
+    <div class="dialog-content">
+      <el-form ref="formRef" :model="form" :rules="rules">
+        <el-form-item label="领导审批" label-width="70px" prop="content">
+          <el-input v-model="form.content" class="custom-input2" clearable placeholder="请输入领导审批意见" />
+        </el-form-item>
+      </el-form>
+    </div>
+  </Dialog>
+</template>
+
+<script lang="ts" setup>
+const props = defineProps({
+  modelValue: {
+    type: Boolean
+  },
+  id: {
+    type: String
+  }
+});
+const emits = defineEmits(['update:modelValue', 'close', 'confirm']);
+const formRef = ref();
+const proxy = getCurrentInstance()?.proxy;
+
+const form = ref({
+  content: ''
+});
+const rules = {
+  content: [{ required: true, message: '领导批示不能为空', trigger: 'blur' }]
+};
+// 弹窗关闭后
+const handleClose = () => {
+  emits('update:modelValue', false);
+};
+
+//
+const handleSubmit = () => {
+  formRef.value?.validate((valid) => {
+    if (valid) {
+      proxy?.$modal.msgSuccess('批示成功');
+      emits('update:modelValue', false);
+      emits('confirm');
+    }
+  });
+};
+</script>
+
+<style lang="scss" scoped>
+.dialog-content {
+  :deep(.el-form) {
+    .el-form-item__label {
+      color: #fff !important;
+      font-weight: bold !important;
+      margin-right: 5px !important;
+    }
+  }
+}
+</style>

src/views/emergencyCommandMap/RightSection/RenWuGenZong.vue

@@ -43,6 +43,8 @@
 
   <!--弹窗-->
   <RenWuGenZongInfo v-if="eventManageState.showListDialog" v-model="eventManageState.showListDialog" :event-id="eventId" />
+
+  <LeaderInstruction v-if="leaderInstructionState.show" v-model="leaderInstructionState.show" :id="leaderInstructionState.id" />
 </template>
 
 <script lang="ts" setup>
@@ -51,6 +53,7 @@ import { selectTask } from '@/api/emergencyCommandMap/JointDuty';
 import { parseTime } from '@/utils/ruoyi';
 import RenWuGengXin from '@/views/emergencyCommandMap/RightSection/RenWuGengXin.vue';
 import RenWuGenZongInfo from '@/views/emergencyCommandMap/RightSection/RenWuGenZongInfo.vue';
+import LeaderInstruction from '@/views/emergencyCommandMap/RightSection/LeaderInstruction.vue';
 
 const newSectionState = reactive({
   showListDialog: false
@@ -83,6 +86,10 @@ const showMoreEventManageList = () => {
 
 let timer;
 let isMounted = ref(false);
+const leaderInstructionState = ref({
+  show: false,
+  id: ''
+});
 // 请求数据
 const fetchData = (unNeedTimeout?: boolean) => {
   selectTask({ event_code: props.eventId })
@@ -111,6 +118,10 @@ const handleUpdateSuccess = (updatedData) => {
 const handleLeaderInstruction = (item) => {
   // 处理领导批示逻辑
   console.log('领导批示:', item);
+  leaderInstructionState.value = {
+    show: true,
+    id: item.id
+  };
 };
 
 const toggleExpand = (item) => {