feat(manager): 表单弹窗统一改为右抽屉，文章添加/编辑改为独立页面，支付方式汇总显示中文名称

manager/src/router/router.js

@@ -471,6 +471,13 @@ export const otherRouter = {
       meta: { title: "商品销售汇总报表" },
       component: () => import("@/views/statistics/goods-sales-summary.vue")
     },
+    {
+      path: "article-edit",
+      title: "文章编辑",
+      name: "article-edit",
+      meta: { title: "文章编辑" },
+      component: () => import("@/views/page/article-manage/articleEdit.vue")
+    },
     {
       path: "distributionImportRecord",
       title: "分销员导入记录",

manager/src/views/custom-words/index.vue

@@ -45,12 +45,13 @@
       </div>
     </el-card>
 
-    <el-dialog
+    <el-drawer
       v-model="modalVisible"
       :title="modalTitle"
-      width="500px"
+      size="500px"
       :close-on-click-modal="false"
       destroy-on-close
+      append-to-body
     >
       <el-form ref="formRef" :model="form" label-width="100px" :rules="formValidate">
         <el-form-item label="自定义分词" prop="name">
@@ -61,7 +62,7 @@
         <el-button @click="modalVisible = false">取消</el-button>
         <el-button type="primary" :loading="submitLoading" @click="handleSubmit">保存</el-button>
       </template>
-    </el-dialog>
+    </el-drawer>
   </div>
 </template>
 

manager/src/views/distribution/distribution.vue

@@ -127,9 +127,9 @@
           </template>
         </el-table-column>
         <el-table-column prop="joinTime" label="加入时间" min-width="160" />
-        <el-table-column label="操作" width="270" align="center" fixed="right">
+        <el-table-column label="操作" width="270" align="right" fixed="right">
           <template #default="{ row }">
-            <template v-if="row">
+            <div v-if="row" class="ops-row">
               <a class="link-text" @click="openEdit(row)">编辑</a>
               <span class="op-split">|</span>
               <a class="link-text" @click="openDetail(row)">详情</a>
@@ -144,7 +144,7 @@
                 <a v-if="row.distributionStatus != 'RETREAT'" class="link-text" @click="retreat(row)">清退</a>
                 <a v-if="row.distributionStatus == 'RETREAT'" class="link-text" @click="resume(row)">恢复</a>
               </template>
-            </template>
+            </div>
           </template>
         </el-table-column>
       </el-table>
@@ -260,10 +260,10 @@
       </div>
     </el-drawer>
 
-    <el-dialog
+    <el-drawer
       v-model="editVisible"
       title="编辑分销员"
-      width="520px"
+      size="520px"
       :close-on-click-modal="false"
       destroy-on-close
       append-to-body
@@ -304,12 +304,12 @@
         <el-button @click="editVisible = false">取消</el-button>
         <el-button type="primary" :loading="editLoading" @click="submitEdit">保存</el-button>
       </template>
-    </el-dialog>
+    </el-drawer>
 
-    <el-dialog
+    <el-drawer
       v-model="createVisible"
       title="新增分销员"
-      width="520px"
+      size="520px"
       :close-on-click-modal="false"
       destroy-on-close
       append-to-body
@@ -345,12 +345,12 @@
         <el-button @click="createVisible = false">取消</el-button>
         <el-button type="primary" :loading="createLoading" @click="submitCreate">确定</el-button>
       </template>
-    </el-dialog>
+    </el-drawer>
 
-    <el-dialog
+    <el-drawer
       v-model="batchGradeVisible"
       title="批量设置等级"
-      width="480px"
+      size="480px"
       :close-on-click-modal="false"
       destroy-on-close
       append-to-body
@@ -380,12 +380,12 @@
         <el-button @click="batchGradeVisible = false">取消</el-button>
         <el-button type="primary" :loading="batchGradeLoading" @click="submitBatchGrade">确定</el-button>
       </template>
-    </el-dialog>
+    </el-drawer>
 
-    <el-dialog
+    <el-drawer
       v-model="importVisible"
       title="批量导入分销员"
-      width="520px"
+      size="520px"
       :close-on-click-modal="false"
       destroy-on-close
       append-to-body
@@ -416,7 +416,7 @@
           开始导入
         </el-button>
       </template>
-    </el-dialog>
+    </el-drawer>
   </div>
 </template>
 
@@ -923,6 +923,9 @@ onMounted(() => {
   margin: 0 8px;
   color: #dcdee2;
 }
+.ops-row {
+  white-space: nowrap;
+}
 .status-tabs {
   margin-bottom: 4px;
 }

manager/src/views/distribution/distributionCustomerRelation.vue

@@ -243,12 +243,13 @@
       </div>
     </el-drawer>
 
-    <el-dialog
+    <el-drawer
       v-model="rebindVisible"
       title="换绑客户关系"
-      width="520px"
+      size="520px"
       :close-on-click-modal="false"
       destroy-on-close
+      append-to-body
     >
       <el-form ref="rebindFormRef" :model="rebindForm" :rules="rebindRules" label-width="110px">
         <el-form-item label="客户">
@@ -273,7 +274,7 @@
         <el-button @click="rebindVisible = false">取消</el-button>
         <el-button type="primary" :loading="rebindLoading" @click="submitRebind">确定</el-button>
       </template>
-    </el-dialog>
+    </el-drawer>
 
     <distribution-selector
       v-model="distributorSelectorVisible"
@@ -281,12 +282,13 @@
       @confirm="onDistributorSelected"
     />
 
-    <el-dialog
+    <el-drawer
       v-model="unbindVisible"
       title="解绑客户关系"
-      width="520px"
+      size="520px"
       :close-on-click-modal="false"
       destroy-on-close
+      append-to-body
     >
       <el-form ref="unbindFormRef" :model="unbindForm" label-width="110px">
         <el-form-item label="客户">
@@ -300,7 +302,7 @@
         <el-button @click="unbindVisible = false">取消</el-button>
         <el-button type="primary" :loading="unbindLoading" @click="submitUnbind">确定</el-button>
       </template>
-    </el-dialog>
+    </el-drawer>
   </div>
 </template>
 

manager/src/views/finance/payment-method.vue

@@ -14,7 +14,11 @@
     <el-card class="mt_10">
       <el-table v-loading="loading" border :data="data">
         <el-table-column prop="period" label="日期" width="120" />
-        <el-table-column prop="paymentName" label="支付方式" width="140" />
+        <el-table-column prop="paymentName" label="支付方式" width="140">
+          <template #default="{ row }">
+            {{ formatPaymentName(row.paymentName) }}
+          </template>
+        </el-table-column>
         <el-table-column prop="payCount" label="支付笔数" width="100" />
         <el-table-column prop="payAmount" label="支付金额" width="120" />
         <el-table-column prop="refundCount" label="退款笔数" width="100" />
@@ -35,6 +39,17 @@ const loading = ref(false);
 const dateRange = ref([]);
 const data = ref([]);
 
+const paymentNameMap = {
+  WECHAT: "微信支付",
+  ALIPAY: "支付宝",
+  WALLET: "余额支付",
+  BANK_TRANSFER: "线下转账",
+};
+
+function formatPaymentName(name) {
+  return paymentNameMap[name] || name || "-";
+}
+
 onMounted(() => {
   loadData();
 });

manager/src/views/logistics/index.vue

@@ -52,10 +52,11 @@
       </div>
     </el-card>
 
-    <el-dialog
+    <el-drawer
       v-model="modalVisible"
       :title="modalTitle"
-      width="500px"
+      size="500px"
+      append-to-body
       :close-on-click-modal="false"
       destroy-on-close
     >
@@ -93,7 +94,7 @@
           提交
         </el-button>
       </template>
-    </el-dialog>
+    </el-drawer>
   </div>
 </template>
 

manager/src/views/page/article-manage/ArticleCategory.vue

@@ -32,12 +32,13 @@
       </el-table>
     </el-card>
 
-    <el-dialog
+    <el-drawer
       v-model="modalVisible"
       :title="modalTitle"
-      width="500px"
+      size="500px"
       :close-on-click-modal="false"
       destroy-on-close
+      append-to-body
     >
       <el-form ref="formRef" :model="formAdd" label-width="100px" :rules="formValidate">
         <el-form-item v-if="showParent" label="上级分类" prop="parentId">
@@ -55,7 +56,7 @@
         <el-button @click="modalVisible = false">取消</el-button>
         <el-button type="primary" :loading="submitLoading" @click="Submit">提交</el-button>
       </template>
-    </el-dialog>
+    </el-drawer>
   </div>
 </template>
 

manager/src/views/page/article-manage/articleEdit.vue

@@ -0,0 +1,170 @@
+<template>
+  <div>
+    <el-card>
+      <template #header>
+        <span>{{ isEdit ? "编辑文章" : "添加文章" }}</span>
+      </template>
+      <el-form ref="formRef" :model="form" label-width="100px" :rules="formValidate">
+        <el-form-item label="文章标题" prop="title">
+          <el-input v-model="form.title" clearable style="width: 40%" />
+        </el-form-item>
+        <el-form-item label="文章分类" prop="categoryId">
+          <el-tree-select
+            v-model="form.categoryId"
+            :data="treeData"
+            :props="{ label: 'title', value: 'value', children: 'children' }"
+            placeholder="请选择"
+            clearable
+            check-strictly
+            style="width: 180px"
+          />
+        </el-form-item>
+        <el-form-item label="文章排序" prop="sort">
+          <el-input v-model="form.sort" type="number" clearable style="width: 10%" />
+        </el-form-item>
+        <el-form-item class="form-item-view-el" label="文章内容" prop="content">
+          <tinymec v-if="!loading" ref="editor" open-xss v-model="form.content" />
+        </el-form-item>
+        <el-form-item label="是否展示" prop="openStatus">
+          <el-switch
+            v-model="form.openStatus"
+            inline-prompt
+            active-text="展示"
+            inactive-text="隐藏"
+          />
+        </el-form-item>
+        <el-form-item>
+          <el-button type="primary" :loading="submitLoading" @click="handleSubmit">提交</el-button>
+          <el-button @click="goBack">返回</el-button>
+        </el-form-item>
+      </el-form>
+    </el-card>
+  </div>
+</template>
+
+<script setup>
+import { onMounted, ref } from "vue";
+import { useRoute, useRouter } from "vue-router";
+import {
+  getArticleCategory,
+  saveArticle,
+  updateArticle,
+  seeArticle,
+} from "@/api/pages";
+import tinymec from "@/components/editor/index.vue";
+import { regular } from "@/utils";
+import { Message } from "@/utils/message";
+
+const validateArticleContent = (rule, value, callback) => {
+  const html = String(value || "").trim();
+  if (!html) {
+    callback(new Error("请填写文章内容"));
+    return;
+  }
+  const text = html
+    .replace(/<[^>]+>/g, "")
+    .replace(/&nbsp;/gi, " ")
+    .trim();
+  const hasImage = /<img[\s>]/i.test(html);
+  if (!text && !hasImage) {
+    callback(new Error("请填写文章内容"));
+    return;
+  }
+  callback();
+};
+
+defineOptions({ name: "articleEdit" });
+
+const route = useRoute();
+const router = useRouter();
+
+const formRef = ref(null);
+const editor = ref(null);
+const loading = ref(false);
+const submitLoading = ref(false);
+const treeData = ref([]);
+const form = ref({
+  openStatus: false,
+  title: "",
+  categoryId: "",
+  sort: 1,
+  content: "",
+  id: "",
+});
+const formValidate = ref({
+  title: [{ required: true, message: "请输入文章标题", trigger: "blur" }],
+  categoryId: [{ required: true, message: "请选择文章分类", trigger: "change" }],
+  sort: [regular.REQUIRED, regular.INTEGER],
+  content: [{ required: true, validator: validateArticleContent, trigger: "change" }],
+});
+
+const isEdit = ref(!!route.query.id);
+
+function getTree(tree = []) {
+  const arr = [];
+  if (!!tree && tree.length !== 0) {
+    tree.forEach((item) => {
+      const obj = {};
+      obj.title = item.articleCategoryName;
+      obj.value = item.id;
+      obj.children = getTree(item.children);
+      arr.push(obj);
+    });
+  }
+  return arr;
+}
+function getCategoryTree() {
+  getArticleCategory(0).then((res) => {
+    if (res.success) {
+      treeData.value = getTree(res.result);
+    }
+  });
+}
+function getDetail(id) {
+  loading.value = true;
+  seeArticle(id)
+    .then((res) => {
+      if (res.result) {
+        form.value.categoryId = res.result.categoryId;
+        form.value.id = id;
+        form.value.content = res.result.content;
+        form.value.title = res.result.title;
+        form.value.sort = res.result.sort;
+        form.value.openStatus = res.result.openStatus;
+      }
+    })
+    .finally(() => {
+      loading.value = false;
+    });
+}
+function handleSubmit() {
+  if (editor.value?.getContent) {
+    form.value.content = editor.value.getContent();
+  }
+  formRef.value.validate((valid) => {
+    if (!valid) return;
+    submitLoading.value = true;
+    const request = isEdit.value ? updateArticle(form.value) : saveArticle(form.value);
+    request
+      .then((res) => {
+        if (res.success) {
+          Message.success("操作成功");
+          goBack();
+        }
+      })
+      .finally(() => {
+        submitLoading.value = false;
+      });
+  });
+}
+function goBack() {
+  router.back();
+}
+
+onMounted(() => {
+  getCategoryTree();
+  if (isEdit.value) {
+    getDetail(route.query.id);
+  }
+});
+</script>

manager/src/views/page/article-manage/articleList.vue

@@ -2,6 +2,9 @@
   <div class="article-page">
     <div class="article-page__aside">
       <el-card class="article-category">
+        <template #header>
+          <span>文章分类</span>
+        </template>
         <el-tree
           :data="treeData"
           :props="{ label: 'title', children: 'children' }"
@@ -13,38 +16,43 @@
       </el-card>
     </div>
     <div class="article-page__main">
-      <el-card class="article-detail">
+      <el-card class="article-search">
-          <el-form
+        <el-form
-            ref="searchFormRef"
+          ref="searchFormRef"
-            :model="searchForm"
+          :model="searchForm"
-            inline
+          inline
-            label-width="70px"
+          label-width="70px"
-            style="width: 100%"
+          class="search-form"
-            class="search-form"
+          @keyup.enter="handleSearch"
-            @keyup.enter="handleSearch"
+        >
-          >
+          <el-form-item label="文章标题" prop="title">
-            <el-form-item label="文章标题" prop="title">
+            <el-input
-              <el-input
+              v-model="searchForm.title"
-                v-model="searchForm.title"
+              placeholder="请输入文章标题"
-                placeholder="请输入文章标题"
+              clearable
-                clearable
+              style="width: 200px"
-                style="width: 200px"
+            />
-              />
+          </el-form-item>
-            </el-form-item>
+          <el-form-item>
-            <el-form-item>
+            <el-button type="primary" class="search-btn" @click="handleSearch">搜索</el-button>
-              <el-button type="primary" class="search-btn" @click="handleSearch">搜索</el-button>
+          </el-form-item>
-            </el-form-item>
+        </el-form>
-          </el-form>
+      </el-card>
 
-          <div class="operation padding-row">
+      <el-card class="article-detail mt_10">
+          <div class="toolbar">
             <el-button v-if="!selected" type="primary" @click="add">添加</el-button>
           </div>
 
           <div class="article-table-wrap">
             <el-table ref="table" v-loading="loading" border :data="data" style="width: 100%">
             <el-table-column prop="articleCategoryName" label="分类名称" width="150" />
-            <el-table-column prop="title" label="文章标题" min-width="200" show-overflow-tooltip />
+            <el-table-column label="文章标题" min-width="200" show-overflow-tooltip>
-            <el-table-column label="是否显示" width="100">
+              <template #default="{ row }">
+                {{ decodeEntities(row.title) }}
+              </template>
+            </el-table-column>
+            <el-table-column label="是否显示" width="100" align="center">
               <template #default="{ row }">
                 <el-switch
                   v-if="row"
@@ -56,10 +64,10 @@
                 />
               </template>
             </el-table-column>
-            <el-table-column prop="sort" label="排序" width="100" />
+            <el-table-column prop="sort" label="排序" width="80" align="center" />
-            <el-table-column label="操作" width="230" align="center">
+            <el-table-column label="操作" width="160" align="right">
               <template #default="{ row, $index }">
-                <template v-if="row">
+                <div v-if="row" class="ops-row">
                   <a
                     v-if="selected"
                     class="link-text"
@@ -71,7 +79,7 @@
                   <a class="link-text" @click="edit(row)">编辑</a>
                   <span class="op-split">|</span>
                   <a class="link-text" @click="remove(row)">删除</a>
-                </template>
+                </div>
               </template>
             </el-table-column>
             </el-table>
@@ -91,92 +99,20 @@
           </div>
         </el-card>
     </div>
-
-    <el-dialog
-      v-if="!selected"
-      v-model="modalVisible"
-      :title="modalTitle"
-      width="1100px"
-      :close-on-click-modal="false"
-      destroy-on-close
-    >
-      <el-form ref="formRef" :model="form" label-width="100px" :rules="formValidate">
-        <el-form-item label="文章标题" prop="title">
-          <el-input v-model="form.title" clearable style="width: 40%" />
-        </el-form-item>
-        <el-form-item label="文章分类" prop="categoryId">
-          <el-tree-select
-            v-model="form.categoryId"
-            :data="treeDataDefault"
-            :props="{ label: 'title', value: 'value', children: 'children' }"
-            placeholder="请选择"
-            clearable
-            check-strictly
-            style="width: 180px"
-            @change="handleCategoryChange"
-          />
-        </el-form-item>
-        <el-form-item label="文章排序" prop="sort">
-          <el-input v-model="form.sort" type="number" clearable style="width: 10%" />
-        </el-form-item>
-        <el-form-item class="form-item-view-el" label="文章内容" prop="content">
-          <tinymec
-            v-if="modalVisible"
-            ref="editor"
-            open-xss
-            v-model="form.content"
-          />
-        </el-form-item>
-        <el-form-item label="是否展示" prop="openStatus">
-          <el-switch
-            v-model="form.openStatus"
-            inline-prompt
-            active-text="展示"
-            inactive-text="隐藏"
-          />
-        </el-form-item>
-      </el-form>
-      <template #footer>
-        <el-button @click="modalVisible = false">取消</el-button>
-        <el-button type="primary" :loading="submitLoading" @click="handleSubmit">提交</el-button>
-      </template>
-    </el-dialog>
   </div>
 </template>
 
 <script setup>
-import { ref, watch, nextTick, onMounted } from "vue";
+import { ref, watch, onMounted } from "vue";
+import { useRouter } from "vue-router";
 import {
   getArticleCategory,
-  saveArticle,
   getArticle,
   delArticle,
-  updateArticle,
-  seeArticle,
   updateArticleStatus,
 } from "@/api/pages";
-import tinymec from "@/components/editor/index.vue";
-import { regular } from "@/utils";
 import { Message, Modal } from "@/utils/message";
 
-const validateArticleContent = (rule, value, callback) => {
-  const html = String(value || "").trim();
-  if (!html) {
-    callback(new Error("请填写文章内容"));
-    return;
-  }
-  const text = html
-    .replace(/<[^>]+>/g, "")
-    .replace(/&nbsp;/gi, " ")
-    .trim();
-  const hasImage = /<img[\s>]/i.test(html);
-  if (!text && !hasImage) {
-    callback(new Error("请填写文章内容"));
-    return;
-  }
-  callback();
-};
-
 defineProps({
   selected: {
     type: Boolean,
@@ -185,19 +121,14 @@ defineProps({
 });
 const emit = defineEmits(["callbacked"]);
 
+const router = useRouter();
+
 // 模板 el-form 的 ref（原 ref="searchForm"，与 data 同名会互相覆盖，改名为 searchFormRef）
 const searchFormRef = ref(null);
 const table = ref(null);
-// 模板 el-form 的 ref（原 ref="form"，与 data 同名会互相覆盖，改名为 formRef）
-const formRef = ref(null);
-const editor = ref(null);
 
 const selectedIndex = ref(99999);
 const loading = ref(true);
-const modalType = ref(0);
-const modalVisible = ref(false);
-const modalTitle = ref("");
-const treeDataDefault = ref([]);
 const searchForm = ref({
   pageNumber: 1,
   pageSize: 20,
@@ -206,24 +137,7 @@ const searchForm = ref({
   categoryId: "",
 });
 const searchTreeValue = ref("");
-const form = ref({
-  openStatus: false,
-  title: "",
-  categoryId: "",
-  sort: 1,
-  content: "",
-  id: "",
-});
-const formValidate = ref({
-  title: [{ required: true, message: "请输入文章标题", trigger: "blur" }],
-  categoryId: [{ required: true, message: "请选择文章分类", trigger: "change" }],
-  sort: [regular.REQUIRED, regular.INTEGER],
-  content: [{ required: true, validator: validateArticleContent, trigger: "change" }],
-});
-const list = ref([]);
-const treeValue = ref("");
 const treeData = ref([]);
-const submitLoading = ref(false);
 const data = ref([]);
 const total = ref(0);
 
@@ -242,15 +156,6 @@ watch(
   { deep: true }
 );
 
-function getDefaultForm() {
-  return {
-    openStatus: false,
-    title: "",
-    categoryId: "",
-    sort: 1,
-    content: "",
-  };
-}
 function init() {
   getDataList();
   getAllList(0);
@@ -268,37 +173,13 @@ function handleCateChange(data) {
 }
 function changeSwitch(v) {
   const params = { status: v.openStatus };
-  updateArticleStatus(v.id, params).then((res) => {
+  updateArticleStatus(v.id, params).then(() => {});
-    submitLoading.value = false;
-    if (res.success) {
-    }
-  });
 }
-function handleCategoryChange(value) {
+function decodeEntities(str) {
-  form.value.categoryId = value;
+  if (!str) return "";
-  const findTitle = (nodes, id) => {
+  const txt = document.createElement("textarea");
-    for (const node of nodes || []) {
+  txt.innerHTML = str;
-      if (node.value === id) return node.title;
+  return txt.value;
-      const childTitle = findTitle(node.children, id);
-      if (childTitle) return childTitle;
-    }
-    return "";
-  };
-  treeValue.value = findTitle(treeDataDefault.value, value);
-}
-function handleCheckChange(data) {
-  let value = "";
-  let title = "";
-  list.value = [];
-  data.forEach((item) => {
-    value += `${item.value},`;
-    title += `${item.title},`;
-  });
-  value = value.substring(0, value.length - 1);
-  title = title.substring(0, title.length - 1);
-  list.value.push({ value, title });
-  form.value.categoryId = value;
-  treeValue.value = title;
 }
 function changePage(v) {
   searchForm.value.pageNumber = v;
@@ -320,7 +201,6 @@ function getAllList(parent_id) {
     loading.value = false;
     if (res.success) {
       treeData.value = getTree(res.result);
-      treeDataDefault.value = getTree(res.result);
       treeData.value.unshift({
         title: "全部",
         level: 0,
@@ -360,8 +240,7 @@ function buildArticleSearchParams() {
   }
   return params;
 }
-function getDataList(val) {
+function getDataList() {
-  if (val) form.value = {};
   loading.value = true;
   getArticle(buildArticleSearchParams())
     .then((res) => {
@@ -374,63 +253,11 @@ function getDataList(val) {
       loading.value = false;
     });
 }
-function handleSubmit() {
-  if (editor.value?.getContent) {
-    form.value.content = editor.value.getContent();
-  }
-  formRef.value.validate((valid) => {
-    if (valid) {
-      submitLoading.value = true;
-      if (modalType.value === 0) {
-        delete form.value.id;
-        saveArticle(form.value).then((res) => {
-          submitLoading.value = false;
-          if (res.success) {
-            Message.success("操作成功");
-            getDataList();
-            modalVisible.value = false;
-          }
-        });
-      } else {
-        updateArticle(form.value).then((res) => {
-          submitLoading.value = false;
-          if (res.success) {
-            Message.success("操作成功");
-            getDataList();
-            modalVisible.value = false;
-          }
-        });
-      }
-    }
-  });
-}
 function add() {
-  modalType.value = 0;
+  router.push({ name: "article-edit" });
-  modalTitle.value = "添加文章";
-  treeValue.value = "";
-  form.value = getDefaultForm();
-  modalVisible.value = true;
-  nextTick(() => {
-    formRef.value?.clearValidate?.();
-  });
 }
-function edit(data) {
+function edit(row) {
-  modalType.value = 1;
+  router.push({ name: "article-edit", query: { id: row.id } });
-  modalTitle.value = "编辑文章";
-  treeValue.value = "";
-  form.value = getDefaultForm();
-  seeArticle(data.id).then((res) => {
-    if (res.result) {
-      modalVisible.value = true;
-      form.value.categoryId = res.result.categoryId;
-      treeValue.value = data.articleCategoryName;
-      form.value.id = data.id;
-      form.value.content = res.result.content;
-      form.value.title = res.result.title;
-      form.value.sort = res.result.sort;
-      form.value.openStatus = res.result.openStatus;
-    }
-  });
 }
 function remove(v) {
   Modal.confirm({
@@ -458,7 +285,7 @@ onMounted(() => {
 .article-page {
   display: flex;
   gap: 10px;
-  align-items: flex-start;
+  align-items: stretch;
   width: 100%;
   min-width: 0;
 }
@@ -468,6 +295,8 @@ onMounted(() => {
   width: 220px;
   min-width: 180px;
   max-width: 260px;
+  display: flex;
+  flex-direction: column;
 }
 
 .article-page__main {
@@ -476,10 +305,25 @@ onMounted(() => {
 }
 
 .article-category,
+.article-search,
 .article-detail {
   width: 100%;
 }
 
+.article-category {
+  flex: 1;
+  height: 100%;
+}
+
+.toolbar {
+  display: flex;
+  margin-bottom: 10px;
+}
+
+.ops-row {
+  white-space: nowrap;
+}
+
 .article-table-wrap {
   width: 100%;
   overflow-x: auto;

manager/src/views/page/article-manage/template/todayHotWords.vue

@@ -25,10 +25,10 @@
       <el-empty v-if="!data.length" description="暂无热词，点击上方按钮设置" :image-size="80" />
     </div>
 
-    <el-dialog
+    <el-drawer
       v-model="modalVisible"
       :title="modalTitle"
-      width="500px"
+      size="500px"
       :close-on-click-modal="false"
       append-to-body
       destroy-on-close
@@ -45,7 +45,7 @@
         <el-button @click="modalVisible = false">取消</el-button>
         <el-button type="primary" :loading="submitLoading" @click="handleSubmit">提交</el-button>
       </template>
-    </el-dialog>
+    </el-drawer>
   </div>
 </template>
 

manager/src/views/page/feedback/feedback.vue

@@ -45,7 +45,7 @@
       </div>
     </el-card>
 
-    <el-dialog v-model="detailVisible" title="详细信息" width="500px" destroy-on-close>
+    <el-drawer v-model="detailVisible" title="详细信息" size="500px" destroy-on-close append-to-body>
       <el-form ref="formValidate" :model="form" label-width="80px">
         <el-form-item label="用户名" prop="userName">
           <span>{{ form.userName }}</span>
@@ -84,7 +84,7 @@
       <template #footer>
         <el-button @click="detailVisible = false">取消</el-button>
       </template>
-    </el-dialog>
+    </el-drawer>
   </div>
 </template>
 

manager/src/views/sensitive-words/index.vue

@@ -102,10 +102,11 @@
       </el-tabs>
     </el-card>
 
-    <el-dialog
+    <el-drawer
       v-model="modalVisible"
       :title="modalTitle"
-      width="500px"
+      size="500px"
+      append-to-body
       :close-on-click-modal="false"
       destroy-on-close
     >
@@ -118,7 +119,7 @@
         <el-button @click="modalVisible = false">取消</el-button>
         <el-button type="primary" :loading="submitLoading" @click="handleSubmit">提交</el-button>
       </template>
-    </el-dialog>
+    </el-drawer>
   </div>
 </template>
 

manager/src/views/sys/app-version/appVersion.vue

@@ -65,10 +65,11 @@
       </div>
     </el-card>
 
-    <el-dialog
+    <el-drawer
       v-model="modalVisible"
       :title="modalTitle"
-      width="1000px"
+      size="1000px"
+      append-to-body
       :close-on-click-modal="false"
       destroy-on-close
     >
@@ -130,7 +131,7 @@
         <el-button @click="modalVisible = false">取消</el-button>
         <el-button type="primary" :loading="submitLoading" @click="saveAppVersion">保存</el-button>
       </template>
-    </el-dialog>
+    </el-drawer>
 
     <el-dialog v-model="queryModalVisible" :title="queryModalTitle" width="700px">
       <el-form label-width="100px">

manager/src/views/sys/department-manage/departmentManage.vue

@@ -59,23 +59,28 @@
           </template>
         </el-table-column>
 
-        <el-table-column label="操作" width="180" fixed="right" align="center">
+        <el-table-column label="操作" width="210" fixed="right" align="center">
           <template #default="{ row }">
-            <a class="link-text" @click="addChild(row)">添加子部门</a>
+            <div class="ops-row">
-            <span class="op-split">|</span>
+              <template v-if="row.parentId === 0 || row.parentId === '0'">
-            <a class="link-text" @click="editRow(row)">编辑</a>
+                <a class="link-text" @click="addChild(row)">添加子部门</a>
-            <span class="op-split">|</span>
+                <span class="op-split">|</span>
-            <a class="link-text error-text" @click="deleteRow(row)">删除</a>
+              </template>
+              <a class="link-text" @click="editRow(row)">编辑</a>
+              <span class="op-split">|</span>
+              <a class="link-text error-text" @click="deleteRow(row)">删除</a>
+            </div>
           </template>
         </el-table-column>
       </el-table>
     </el-card>
 
-    <!-- 部门新建 / 编辑弹窗 -->
+    <!-- 部门新建 / 编辑抽屉 -->
-    <el-dialog
+    <el-drawer
       v-model="modalVisible"
       :title="modalTitle"
-      width="540px"
+      size="540px"
+      append-to-body
       :close-on-click-modal="false"
       destroy-on-close
     >
@@ -125,7 +130,7 @@
           </el-button>
         </div>
       </template>
-    </el-dialog>
+    </el-drawer>
   </div>
 </template>
 
@@ -521,6 +526,10 @@ onMounted(() => {
   }
 }
 
+.ops-row {
+  white-space: nowrap;
+}
+
 .op-split {
   margin: 0 8px;
   color: #dcdee2;

manager/src/views/sys/menu-manage/menu.vue

@@ -77,25 +77,28 @@
           </template>
         </el-table-column>
 
-        <el-table-column label="操作" width="180" fixed="right" align="center">
+        <el-table-column label="操作" width="210" fixed="right" align="right">
           <template #default="{ row }">
-            <template v-if="row.level < 2">
+            <div class="ops-row">
-              <a class="link-text" @click="addChildMenu(row)">添加子菜单</a>
+              <template v-if="row.level < 2">
+                <a class="link-text" @click="addChildMenu(row)">添加子菜单</a>
+                <span class="op-split">|</span>
+              </template>
+              <a class="link-text" @click="editRow(row)">编辑</a>
               <span class="op-split">|</span>
-            </template>
+              <a class="link-text error-text" @click="deleteRow(row)">删除</a>
-            <a class="link-text" @click="editRow(row)">编辑</a>
+            </div>
-            <span class="op-split">|</span>
-            <a class="link-text error-text" @click="deleteRow(row)">删除</a>
           </template>
         </el-table-column>
       </el-table>
     </el-card>
 
-    <!-- 菜单新建 / 编辑弹窗 -->
+    <!-- 菜单新建 / 编辑抽屉 -->
-    <el-dialog
+    <el-drawer
       v-model="modalVisible"
       :title="modalTitle"
-      width="560px"
+      size="560px"
+      append-to-body
       :close-on-click-modal="false"
       destroy-on-close
     >
@@ -156,7 +159,7 @@
           </el-button>
         </div>
       </template>
-    </el-dialog>
+    </el-drawer>
   </div>
 </template>
 
@@ -524,6 +527,10 @@ onMounted(() => {
   }
 }
 
+.ops-row {
+  white-space: nowrap;
+}
+
 .op-split {
   margin: 0 8px;
   color: #dcdee2;

manager/src/views/sys/menu-manage/storeMenu.vue

@@ -77,25 +77,28 @@
           </template>
         </el-table-column>
 
-        <el-table-column label="操作" width="180" fixed="right" align="center">
+        <el-table-column label="操作" width="210" fixed="right" align="right">
           <template #default="{ row }">
-            <template v-if="row.level < 2">
+            <div class="ops-row">
-              <a class="link-text" @click="addChildMenu(row)">添加子菜单</a>
+              <template v-if="row.level < 2">
+                <a class="link-text" @click="addChildMenu(row)">添加子菜单</a>
+                <span class="op-split">|</span>
+              </template>
+              <a class="link-text" @click="editRow(row)">编辑</a>
               <span class="op-split">|</span>
-            </template>
+              <a class="link-text error-text" @click="deleteRow(row)">删除</a>
-            <a class="link-text" @click="editRow(row)">编辑</a>
+            </div>
-            <span class="op-split">|</span>
-            <a class="link-text error-text" @click="deleteRow(row)">删除</a>
           </template>
         </el-table-column>
       </el-table>
     </el-card>
 
-    <!-- 菜单新建 / 编辑弹窗 -->
+    <!-- 菜单新建 / 编辑抽屉 -->
-    <el-dialog
+    <el-drawer
       v-model="modalVisible"
       :title="modalTitle"
-      width="560px"
+      size="560px"
+      append-to-body
       :close-on-click-modal="false"
       destroy-on-close
     >
@@ -156,7 +159,7 @@
           </el-button>
         </div>
       </template>
-    </el-dialog>
+    </el-drawer>
   </div>
 </template>
 
@@ -524,6 +527,10 @@ onMounted(() => {
   }
 }
 
+.ops-row {
+  white-space: nowrap;
+}
+
 .op-split {
   margin: 0 8px;
   color: #dcdee2;

manager/src/views/sys/role-manage/roleManage.vue

@@ -49,10 +49,11 @@
       </div>
     </el-card>
 
-    <el-dialog
+    <el-drawer
       v-model="roleModalVisible"
       :title="modalTitle"
-      width="500px"
+      size="500px"
+      append-to-body
       :close-on-click-modal="false"
       destroy-on-close
     >
@@ -68,7 +69,7 @@
         <el-button @click="roleModalVisible = false">取消</el-button>
         <el-button type="primary" :loading="submitLoading" @click="submitRole">提交</el-button>
       </template>
-    </el-dialog>
+    </el-drawer>
 
     <el-dialog
       v-model="permModalVisible"

manager/src/views/sys/slider/slider.vue

@@ -65,10 +65,11 @@
       </div>
     </el-card>
 
-    <el-dialog
+    <el-drawer
       v-model="modalVisible"
       :title="modalTitle"
-      width="500px"
+      size="500px"
+      append-to-body
       :close-on-click-modal="false"
       destroy-on-close
     >
@@ -97,7 +98,7 @@
           提交
         </el-button>
       </template>
-    </el-dialog>
+    </el-drawer>
   </div>
 </template>
 

manager/src/views/sys/timed-task/index.vue

@@ -142,11 +142,12 @@
       </el-table>
     </el-card>
 
-    <!-- 修改 Cron 表达式弹窗 -->
+    <!-- 修改 Cron 表达式抽屉 -->
-    <el-dialog
+    <el-drawer
       v-model="editDialogVisible"
       :title="`配置任务: ${currentRow?.name || ''}`"
-      width="540px"
+      size="540px"
+      append-to-body
       destroy-on-close
     >
       <el-form label-width="110px" style="margin-top: 10px">
@@ -192,7 +193,7 @@
         <el-button @click="editDialogVisible = false">取消</el-button>
         <el-button type="primary" :loading="saving" @click="handleSave">保存</el-button>
       </template>
-    </el-dialog>
+    </el-drawer>
   </div>
 </template>
 

manager/src/views/sys/user-manage/userManage.vue

@@ -90,11 +90,10 @@
       </div>
     </el-card>
 
-    <el-dialog
+    <el-drawer
       v-model="userModalVisible"
       :title="modalTitle"
-      width="500px"
+      size="500px"
-      align-center
       append-to-body
       :close-on-click-modal="false"
       destroy-on-close
@@ -132,7 +131,7 @@
         <el-button @click="userModalVisible = false">取消</el-button>
         <el-button type="primary" :loading="submitLoading" @click="submitUser">提交</el-button>
       </template>
-    </el-dialog>
+    </el-drawer>
   </div>
 </template>
 
@@ -480,11 +479,6 @@ onMounted(() => {
 
 <style lang="scss">
 .user-manage-dialog {
-  .el-dialog__body {
-    max-height: calc(100vh - 220px);
-    overflow-y: auto;
-  }
-
   .el-input__wrapper {
     background-color: #fff !important;
     box-shadow: 0 0 0 1px var(--el-border-color) inset !important;