签入版本

DjangoAdmin_Tornado_AntdVue/zh/volume7/fe-component.md

@@ -2,11 +2,11 @@
 
 ## 概述
 
-前端基于 Vue3 + ElementPlus + 自定义组件库构建。页面统一使用 `PageWrapper` + `BasicForm` + `BasicTable` + `TableAction` 四件套，分页由 `BasicTable` 内置处理，无需单独引入分页组件。
+前端基于 Vue3 + AntDesign + 自定义组件库构建。页面统一使用 `PageWrapper` + `BasicForm` + `BasicTable` + `TableAction` 四件套，分页由 `BasicTable` 内置处理，无需单独引入分页组件。
 
 :::tip 技术栈
 - Vue3（Composition API + `<script setup>`）
-- ElementPlus
+- AntDesign
 - 自定义组件（BasicTable / BasicForm / TableAction / PageWrapper）
 - Pinia 状态管理
 - Vue Router 路由管理
@@ -56,7 +56,7 @@ ui/src/
 ├── utils/                # 工具函数
 ├── hooks/                # 组合式函数
 ├── styles/               # 全局样式
-├── plugins/              # 插件注册（ElementPlus、自定义组件、指令）
+├── plugins/              # 插件注册（AntDesign、自定义组件、指令）
 └── main.ts               # 入口文件
 ```
 
@@ -79,12 +79,12 @@ ui/src/
 <template>
   <PageWrapper>
     <!-- 搜索表单 -->
-    <el-card :bordered="false" class="pt-3 mb-3 proCard">
+    <a-card :bordered="false" class="pt-3 mb-3 proCard">
       <BasicForm @register="register" @submit="handleSubmit" @reset="handleReset" />
-    </el-card>
+    </a-card>
 
     <!-- 数据表格 -->
-    <el-card :bordered="false" class="proCard">
+    <a-card :bordered="false" class="proCard">
       <BasicTable
         :columns="columns"
         :request="loadDataTable"
@@ -94,22 +94,22 @@ ui/src/
         @selection-change="onSelectionChange"
       >
         <template #tableTitle>
-          <el-button type="primary" @click="handleAdd" v-perm="['sys:param:add']">
-            <el-icon><PlusOutlined /></el-icon>
+          <a-button type="primary" @click="handleAdd" v-perm="['sys:param:add']">
+            <PlusOutlined />
             添加参数
-          </el-button>
-          <el-button
+          </a-button>
+          <a-button
             type="danger"
             @click="handleDelete()"
             :disabled="!selectionData.length"
             v-perm="['sys:param:batchDelete']"
           >
-            <el-icon><Delete /></el-icon>
+            <Delete />
             删除
-          </el-button>
+          </a-button>
         </template>
       </BasicTable>
-    </el-card>
+    </a-card>
 
     <!-- 编辑弹窗（懒加载） -->
     <editDialog
@@ -133,7 +133,7 @@ ui/src/
 ```typescript
 // views/data/param/columns.ts
 import { h } from 'vue';
-import { ElTag } from 'element-plus';
+import { Tag } from 'ant-design-vue';
 
 export const columns = [
   { type: 'selection' },                    // 多选列
@@ -146,7 +146,7 @@ export const columns = [
     prop: 'type',
     minWidth: 100,
     render(record) {
-      return h(ElTag,
+      return h(Tag,
         { type: record.row.type == 0 ? 'primary' : 'warning' },
         { default: () => (record.row.type == 0 ? '系统' : '业务') }
       );
@@ -157,7 +157,7 @@ export const columns = [
     prop: 'status',
     minWidth: 100,
     render(record) {
-      return h(ElTag,
+      return h(Tag,
         { type: record.row.status == 1 ? 'success' : 'danger' },
         { default: () => (record.row.status == 1 ? '正常' : '禁用') }
       );
@@ -172,7 +172,7 @@ export const columns = [
 ```typescript
 // 状态标签
 render(record) {
-  return h(ElTag,
+  return h(Tag,
     { type: record.row.status == 1 ? 'success' : 'danger' },
     { default: () => record.row.statusText }  // 使用后端 serialize_maps 返回的 xxxText
   );
@@ -206,7 +206,7 @@ export const schemas: FormSchema[] = [
     label: '参数类型',
     componentProps: {
       placeholder: '请选择参数类型',
-      clearable: true,
+      allowClear: true,
       options: [
         { label: '系统', value: '0' },
         { label: '业务', value: '1' },
@@ -219,7 +219,7 @@ export const schemas: FormSchema[] = [
     label: '状态',
     componentProps: {
       placeholder: '请选择状态',
-      clearable: true,
+      allowClear: true,
       options: [
         { label: '正常', value: '1' },
         { label: '禁用', value: '2' },