refactor: 同步通知公告弹窗样式与编辑器高度设置

src/views/system/notice/index.vue

@@ -168,11 +168,31 @@
     <!-- 通知公告表单弹窗 -->
     <el-dialog
       v-model="dialog.visible"
-      :title="dialog.title"
-      top="3vh"
-      width="80%"
+      :show-close="false"
+      :fullscreen="dialog.fullscreen"
+      top="6vh"
+      width="70%"
+      custom-class="notice-dialog"
       @close="handleCloseDialog"
     >
+      <template #header>
+        <div class="flex-x-between">
+          <span>{{ dialog.title }}</span>
+          <div class="dialog-toolbar">
+            <el-button circle @click="toggleDialogFullscreen">
+              <template #icon>
+                <FullScreen v-if="!dialog.fullscreen" />
+                <CopyDocument v-else />
+              </template>
+            </el-button>
+            <el-button circle @click="handleCloseDialog">
+              <template #icon>
+                <Close />
+              </template>
+            </el-button>
+          </div>
+        </div>
+      </template>
       <el-form ref="dataFormRef" :model="formData" :rules="rules" label-width="100px">
         <el-form-item label="通知标题" prop="title">
           <el-input v-model="formData.title" placeholder="通知标题" clearable />
@@ -201,7 +221,7 @@
           </el-select>
         </el-form-item>
         <el-form-item label="通知内容" prop="content">
-          <WangEditor v-model="formData.content" />
+          <WangEditor v-model="formData.content" height="350px" />
         </el-form-item>
       </el-form>
       <template #footer>
@@ -285,6 +305,7 @@ const pageData = ref<NoticeItem[]>([]);
 const dialog = reactive({
   title: "",
   visible: false,
+  fullscreen: false,
 });
 
 // 通知公告表单数据
@@ -351,6 +372,7 @@ function handleSelectionChange(selection: any) {
 
 // 打开通知公告弹窗
 function handleOpenDialog(id?: string) {
+  dialog.fullscreen = false;
   UserAPI.getOptions().then((data) => {
     userOptions.value = data;
   });
@@ -451,9 +473,15 @@ function normalizeTargetUsers(value?: unknown) {
 // 关闭通知公告弹窗
 function handleCloseDialog() {
   dialog.visible = false;
+  dialog.fullscreen = false;
   resetForm();
 }
 
+// 弹窗全屏切换
+function toggleDialogFullscreen() {
+  dialog.fullscreen = !dialog.fullscreen;
+}
+
 // 删除通知公告
 function handleDelete(id?: number) {
   const deleteIds = [id || selectIds.value].join(",");
@@ -482,10 +510,12 @@ function handleDelete(id?: number) {
   );
 }
 
+// 关闭通知详情弹窗
 const closeDetailDialog = () => {
   detailDialog.visible = false;
 };
 
+// 打开通知详情弹窗
 const openDetailDialog = async (id: string) => {
   const noticeDetail = await NoticeAPI.getDetail(id);
   currentNotice.value = noticeDetail;