feat: 增加 api 开发和 designer的 按钮列表 api 权限

src/views/apihub/apilist.vue

@@ -8,7 +8,7 @@
             <div class="card-header">
               <span>API分组</span>
               <div class="header-actions">
-                <el-button type="primary" size="small" @click="addGroup" v-auth="'add_group'">
+                <el-button type="primary" size="small" @click="addGroup" v-auth="'add'">
                   <el-icon><ele-Plus /></el-icon>
                 </el-button>
                 <el-button type="primary" size="small" @click="refreshGroups">
@@ -31,9 +31,9 @@
                       <el-icon><ele-More /></el-icon>
                       <template #dropdown>
                         <el-dropdown-menu>
-                          <el-dropdown-item command="edit" v-auth="'edit_group'">编辑</el-dropdown-item>
-                          <el-dropdown-item command="add_child" v-auth="'add_group'">添加子分组</el-dropdown-item>
-                          <el-dropdown-item command="delete" v-auth="'delete_group'">删除</el-dropdown-item>
+                          <el-dropdown-item command="edit" v-auth="'edit'">编辑</el-dropdown-item>
+                          <el-dropdown-item command="add_child" v-auth="'add'">添加子分组</el-dropdown-item>
+                          <el-dropdown-item command="delete" v-auth="'del'">删除</el-dropdown-item>
                         </el-dropdown-menu>
                       </template>
                     </el-dropdown>
@@ -98,15 +98,15 @@
         <el-table :data="tableData" style="width: 100%" v-loading="loading" row-key="id">
           <el-table-column type="selection" width="40" align="center" />
 <!--          <el-table-column prop="id" label="ID" width="80" align="center" />-->
-          <el-table-column prop="method" label="请求" width="85" align="center">
+          <el-table-column prop="method" v-col="'method'" label="请求" width="85" align="center">
             <template #default="scope">
               <el-tag :type="getMethodTagType(scope.row.method)" size="small">
                 {{ scope.row.method }}
               </el-tag>
             </template>
           </el-table-column>
-          <el-table-column prop="name" label="API名称" min-width="140" show-overflow-tooltip></el-table-column>
-          <el-table-column prop="path" label="API路径" min-width="150" show-overflow-tooltip></el-table-column>
+          <el-table-column prop="name" v-col="'name'" label="API名称" min-width="140" show-overflow-tooltip></el-table-column>
+          <el-table-column prop="path" v-col="'path'" label="API路径" min-width="150" show-overflow-tooltip></el-table-column>
 <!--          <el-table-column prop="dataSourceName" label="数据源" width="120" show-overflow-tooltip></el-table-column>-->
 <!--          <el-table-column prop="sqlType" label="SQL类型" width="100" align="center">-->
 <!--            <template #default="scope">-->
@@ -116,9 +116,9 @@
 <!--            </template>-->
 <!--          </el-table-column>-->
 <!--          <el-table-column prop="version" label="版本" width="80" align="center"></el-table-column>-->
-          <el-table-column prop="description" label="描述" width="140" show-overflow-tooltip/>
+          <el-table-column prop="description" v-col="'description'" label="描述" width="140" show-overflow-tooltip/>
 
-          <el-table-column prop="status" label="状态" width="100" align="center">
+          <el-table-column prop="status" v-col="'status'" label="状态" width="100" align="center">
             <template #default="scope">
               <el-tag size="small" v-if="scope.row.status === 'Draft'">草稿</el-tag>
               <el-tag size="small" type="success" v-else-if="scope.row.status === 'Published'">已发布</el-tag>
@@ -127,13 +127,13 @@
             </template>
           </el-table-column>
 <!--          <el-table-column prop="createdAt" label="创建时间" width="160" align="center"></el-table-column>-->
-          <el-table-column label="操作" width="190" align="center" fixed="right">
+          <el-table-column label="操作" width="190" align="center" fixed="right" v-col="'handle'">
             <template #default="scope">
               <div class="flex-row">
-                <el-button size="small" text type="primary" @click="viewDetail(scope.row)" v-auth="'view'">查看</el-button>
+                <el-button size="small" text type="primary" @click="viewDetail(scope.row)" v-auth="'detail'">查看</el-button>
                 <el-button size="small" text type="warning" @click="addOrEdit(scope.row)" v-auth="'edit'">编辑</el-button>
                 <el-button size="small" text type="success" @click="testApi(scope.row)" v-auth="'test'">测试</el-button>
-                <el-dropdown @command="(command: string) => handleCommand(command, scope.row)">
+                <el-dropdown @command="(command: string) => handleCommand(command, scope.row)" v-auth="'more'">
                   <el-button size="small" text type="primary" style="margin-left: 12px; vertical-align: top">
                     更多<el-icon class="el-icon--right" style="font-size: 12px !important"><arrow-down /></el-icon>
                   </el-button>
@@ -141,7 +141,7 @@
                     <el-dropdown-menu>
                       <el-dropdown-item command="publish" v-if="scope.row.status === 'Draft'" v-auth="'publish'">发布</el-dropdown-item>
                       <el-dropdown-item command="deprecate" v-if="scope.row.status === 'Published'" v-auth="'deprecate'">废弃</el-dropdown-item>
-                      <el-dropdown-item command="delete" v-auth="'delete'">删除</el-dropdown-item>
+                      <el-dropdown-item command="delete" v-auth="'del'">删除</el-dropdown-item>
                     </el-dropdown-menu>
                   </template>
                 </el-dropdown>

src/views/apihub/client.vue

@@ -26,12 +26,6 @@
               </el-icon>
               查询
             </el-button>
-<!--            <el-button @click="resetQuery()">-->
-<!--              <el-icon>-->
-<!--                <ele-Refresh />-->
-<!--              </el-icon>-->
-<!--              重置-->
-<!--            </el-button>-->
             <el-button type="primary" @click="addOrEdit()" v-auth="'add'">
               <el-icon>
                 <ele-Plus />
@@ -42,25 +36,25 @@
         </el-form>
         <el-table :data="tableData" style="width: 100%" v-loading="loading" row-key="id">
           <el-table-column type="selection" width="40" align="center" />
-          <el-table-column prop="clientId" label="客户端标识" min-width="140" show-overflow-tooltip></el-table-column>
-          <el-table-column prop="name" label="客户端名称" min-width="140" show-overflow-tooltip></el-table-column>
-          <el-table-column prop="remark" label="备注"  show-overflow-tooltip></el-table-column>
-          <el-table-column prop="status" label="状态" width="100" align="center">
+          <el-table-column prop="clientId" label="客户端标识" v-col="'clientId'" min-width="140" show-overflow-tooltip></el-table-column>
+          <el-table-column prop="name" label="客户端名称" v-col="'name'" min-width="140" show-overflow-tooltip></el-table-column>
+          <el-table-column prop="remark" label="备注" v-col="'remark'" show-overflow-tooltip></el-table-column>
+          <el-table-column prop="status" label="状态" v-col="'status'" width="100" align="center">
             <template #default="scope">
               <el-tag size="small" type="success" v-if="scope.row.status === 'Active'">激活</el-tag>
               <el-tag size="small" type="info" v-else-if="scope.row.status === 'Inactive'">未激活</el-tag>
               <span v-else>{{ scope.row.status }}</span>
             </template>
           </el-table-column>
-<!--          <el-table-column prop="createdAt" label="创建时间" width="160" align="center"></el-table-column>-->
-          <el-table-column label="操作" width="300" align="center" fixed="right">
+          <!--          <el-table-column prop="createdAt" label="创建时间" width="160" align="center"></el-table-column>-->
+          <el-table-column label="操作" width="300" align="center" fixed="right" v-col="'handle'">
             <template #default="scope">
               <div class="flex-row">
                 <el-button size="small" text type="primary" @click="viewDetail(scope.row)" v-auth="'view'">查看</el-button>
                 <el-button size="small" text type="warning" @click="addOrEdit(scope.row)" v-auth="'edit'">编辑</el-button>
                 <el-button size="small" text type="primary" @click="manageApiAuth(scope.row)" v-auth="'edit'">API权限</el-button>
-                <el-button size="small" text type="success" @click="resetSecret(scope.row)" v-auth="'reset_secret'">重置密钥</el-button>
-                <el-button size="small" text type="danger" @click="deleteClient(scope.row)" v-auth="'delete'">删除</el-button>
+                <el-button size="small" text type="success" @click="resetSecret(scope.row)" v-auth="'reset'">重置密钥</el-button>
+                <el-button size="small" text type="danger" @click="deleteClient(scope.row)" v-auth="'del'">删除</el-button>
               </div>
             </template>
           </el-table-column>
@@ -106,14 +100,7 @@
     </el-dialog>
 
     <!-- API权限管理对话框 -->
-    <el-dialog
-      v-model="apiAuthVisible"
-      :title="`客户端 '${currentClient.name}' 的API权限管理`"
-      width="1100px"
-      append-to-body
-      destroy-on-close
-      class="api-permission-dialog"
-    >
+    <el-dialog v-model="apiAuthVisible" :title="`客户端 '${currentClient.name}' 的API权限管理`" width="1100px" append-to-body destroy-on-close class="api-permission-dialog">
       <client-api-relation :client-id="currentClient.clientId" @update:apiKeys="handleApiKeysUpdate" />
       <template #footer>
         <span class="dialog-footer">
@@ -141,9 +128,9 @@
           </div>
           <span v-else>-</span>
         </el-descriptions-item>
-        <el-descriptions-item label="IP白名单">{{ detail.ipWhitelist || '-' }}</el-descriptions-item>
-        <el-descriptions-item label="IP黑名单">{{ detail.ipBlacklist || '-' }}</el-descriptions-item>
-        <el-descriptions-item label="备注">{{ detail.remark || '-' }}</el-descriptions-item>
+        <el-descriptions-item label="IP白名单">{{ detail.ipWhitelist || "-" }}</el-descriptions-item>
+        <el-descriptions-item label="IP黑名单">{{ detail.ipBlacklist || "-" }}</el-descriptions-item>
+        <el-descriptions-item label="备注">{{ detail.remark || "-" }}</el-descriptions-item>
         <el-descriptions-item label="创建时间">{{ detail.createdAt }}</el-descriptions-item>
         <el-descriptions-item label="更新时间">{{ detail.updatedAt }}</el-descriptions-item>
       </el-descriptions>
@@ -157,12 +144,7 @@
     <!-- 密钥重置结果弹窗 -->
     <el-dialog v-model="secretVisible" title="客户端密钥" width="600px" destroy-on-close>
       <div class="secret-result">
-        <el-alert
-          title="请妥善保管以下密钥信息，它仅会显示一次！"
-          type="warning"
-          :closable="false"
-          show-icon
-        />
+        <el-alert title="请妥善保管以下密钥信息，它仅会显示一次！" type="warning" :closable="false" show-icon />
         <div class="secret-info" v-if="secretResult.clientSecret">
           <div class="secret-item">
             <div class="secret-label">客户端密钥:</div>
@@ -212,18 +194,18 @@ const selectedApiKeys = ref<string[]>([]);
 const apiAuthVisible = ref(false);
 const currentClient = ref<ClientInfo>({} as ClientInfo);
 const params = reactive({
-  keyWord: '',
-  status: '',
+  keyWord: "",
+  status: "",
   dateRange: [],
   pageNum: 1,
   pageSize: 20,
-  total: 0
+  total: 0,
 });
 const tableData = ref<ClientInfo[]>([]);
 
 // 获取列表数据
 const getList = async (pageNum?: number) => {
-  if (typeof pageNum === 'number') {
+  if (typeof pageNum === "number") {
     params.pageNum = pageNum;
   }
   loading.value = true;
@@ -238,7 +220,7 @@ const getList = async (pageNum?: number) => {
       params.total = 0;
     }
   } catch (error) {
-    ElMessage.error('获取客户端列表失败');
+    ElMessage.error("获取客户端列表失败");
     tableData.value = [];
     params.total = 0;
   } finally {
@@ -248,35 +230,35 @@ const getList = async (pageNum?: number) => {
 
 // 表单相关
 const dialogVisible = ref(false);
-const formTitle = ref('');
+const formTitle = ref("");
 const submitLoading = ref(false);
 const form = reactive<ClientInfo>({
-  clientId: '',
-  name: '',
+  clientId: "",
+  name: "",
   apiIds: [],
-  status: 'Active',
-  ipWhitelist: '',
-  ipBlacklist: '',
-  remark: ''
+  status: "Active",
+  ipWhitelist: "",
+  ipBlacklist: "",
+  remark: "",
 });
 const rules = {
-  clientId: [{ required: false, message: '请输入客户端标识', trigger: 'blur' }],
-  name: [{ required: true, message: '请输入客户端名称', trigger: 'blur' }],
-  status: [{ required: true, message: '请选择状态', trigger: 'change' }]
+  clientId: [{ required: false, message: "请输入客户端标识", trigger: "blur" }],
+  name: [{ required: true, message: "请输入客户端名称", trigger: "blur" }],
+  status: [{ required: true, message: "请选择状态", trigger: "change" }],
 };
 
 // 详情弹窗
 const detailVisible = ref(false);
 const detail = ref<ClientInfo>({
-  clientId: '',
-  name: '',
-  status: '',
+  clientId: "",
+  name: "",
+  status: "",
 });
 
 // 密钥结果弹窗
 const secretVisible = ref(false);
 const secretResult = ref({
-  clientSecret: ''
+  clientSecret: "",
 });
 
 // 初始化
@@ -287,8 +269,8 @@ onMounted(() => {
 // 重置查询表单
 const resetQuery = () => {
   queryRef.value?.resetFields();
-  params.keyWord = '';
-  params.status = '';
+  params.keyWord = "";
+  params.status = "";
   params.dateRange = [];
   getList(1);
 };
@@ -297,7 +279,7 @@ const resetQuery = () => {
 const addOrEdit = (row?: ClientInfo) => {
   resetForm();
   if (row && row.id) {
-    formTitle.value = '编辑客户端';
+    formTitle.value = "编辑客户端";
     // 获取详细信息
     api.client.get(row.id).then((res: any) => {
       if (res) {
@@ -306,7 +288,7 @@ const addOrEdit = (row?: ClientInfo) => {
       }
     });
   } else {
-    formTitle.value = '新增客户端';
+    formTitle.value = "新增客户端";
     dialogVisible.value = true;
   }
 };
@@ -318,12 +300,12 @@ const resetForm = () => {
   }
   Object.assign(form, {
     id: undefined,
-    clientId: '',
-    name: '',
-    status: 'Active',
-    ipWhitelist: '',
-    ipBlacklist: '',
-    remark: ''
+    clientId: "",
+    name: "",
+    status: "Active",
+    ipWhitelist: "",
+    ipBlacklist: "",
+    remark: "",
   });
 };
 
@@ -336,20 +318,20 @@ const submitForm = () => {
         const apiMethod = form.id ? api.client.edit : api.client.add;
         const res = await apiMethod(form);
         if (res) {
-          ElMessage.success(form.id ? '编辑成功' : '添加成功');
+          ElMessage.success(form.id ? "编辑成功" : "添加成功");
           dialogVisible.value = false;
           getList(1);
 
           // 如果是新增，显示密钥信息
           if (!form.id && res.clientSecret) {
             secretResult.value = {
-              clientSecret: res.clientSecret
+              clientSecret: res.clientSecret,
             };
             secretVisible.value = true;
           }
         }
       } catch (error) {
-        ElMessage.error(form.id ? '编辑失败' : '添加失败');
+        ElMessage.error(form.id ? "编辑失败" : "添加失败");
       } finally {
         submitLoading.value = false;
       }
@@ -370,17 +352,17 @@ const viewDetail = (row: ClientInfo) => {
 // 重置客户端密钥
 const resetSecret = async (row: ClientInfo) => {
   try {
-    await ElMessageBox.confirm(`确定要重置客户端"${row.name}"的密钥吗？\n注意：重置后原密钥将失效！`, '提示', {
-      confirmButtonText: '确定',
-      cancelButtonText: '取消',
-      type: 'warning'
+    await ElMessageBox.confirm(`确定要重置客户端"${row.name}"的密钥吗？\n注意：重置后原密钥将失效！`, "提示", {
+      confirmButtonText: "确定",
+      cancelButtonText: "取消",
+      type: "warning",
     });
 
     const res = await api.client.resetSecret(row.id as number);
     if (res) {
-      ElMessage.success('密钥重置成功');
+      ElMessage.success("密钥重置成功");
       secretResult.value = {
-        clientSecret: res.clientSecret
+        clientSecret: res.clientSecret,
       };
       secretVisible.value = true;
     }
@@ -391,19 +373,19 @@ const resetSecret = async (row: ClientInfo) => {
 
 // 删除客户端
 const deleteClient = (row: ClientInfo) => {
-  ElMessageBox.confirm(`确定要删除客户端「${row.name}」吗？`, '警告', {
-    confirmButtonText: '确定',
-    cancelButtonText: '取消',
-    type: 'warning'
+  ElMessageBox.confirm(`确定要删除客户端「${row.name}」吗？`, "警告", {
+    confirmButtonText: "确定",
+    cancelButtonText: "取消",
+    type: "warning",
   })
     .then(async () => {
       loading.value = true;
       try {
         await api.client.delete([row.id as number]);
-        ElMessage.success('删除成功');
+        ElMessage.success("删除成功");
         getList();
       } catch (error) {
-        ElMessage.error('删除失败');
+        ElMessage.error("删除失败");
       } finally {
         loading.value = false;
       }
@@ -415,11 +397,14 @@ const deleteClient = (row: ClientInfo) => {
 
 // 复制文本
 const copyText = (text: string) => {
-  navigator.clipboard.writeText(text).then(() => {
-    ElMessage.success('复制成功');
-  }).catch(() => {
-    ElMessage.error('复制失败，请手动复制');
-  });
+  navigator.clipboard
+    .writeText(text)
+    .then(() => {
+      ElMessage.success("复制成功");
+    })
+    .catch(() => {
+      ElMessage.error("复制失败，请手动复制");
+    });
 };
 
 // 处理API Keys更新
@@ -429,24 +414,24 @@ const handleApiKeysUpdate = (apiKeys: string[]) => {
 
 // 打开API权限管理窗口
 const manageApiAuth = (row: ClientInfo) => {
-  currentClient.value = {...row};
+  currentClient.value = { ...row };
   apiAuthVisible.value = true;
 };
 
 // 保存API关联
 const saveApiRelations = async () => {
   if (!currentClient.value.clientId) {
-    ElMessage.warning('客户端信息不完整');
+    ElMessage.warning("客户端信息不完整");
     return;
   }
 
   apiSaveLoading.value = true;
   try {
     await api.client.save_apis(currentClient.value.clientId, selectedApiKeys.value);
-    ElMessage.success('API权限关联保存成功');
+    ElMessage.success("API权限关联保存成功");
     apiAuthVisible.value = false;
   } catch (error) {
-    ElMessage.error('API权限关联保存失败');
+    ElMessage.error("API权限关联保存失败");
   } finally {
     apiSaveLoading.value = false;
   }
@@ -494,7 +479,7 @@ const saveApiRelations = async () => {
   padding: 15px;
 }
 /* 深色主题下的样式 */
-[data-theme='dark'] .secret-info {
+[data-theme="dark"] .secret-info {
   margin-top: 20px;
   background-color: #2f3030;
   border-radius: 4px;
@@ -523,7 +508,7 @@ const saveApiRelations = async () => {
   margin-right: 10px;
 }
 /* 深色主题下的样式 */
-[data-theme='dark'] .secret-value {
+[data-theme="dark"] .secret-value {
   flex: 1;
   word-break: break-all;
   font-family: monospace;
@@ -533,8 +518,6 @@ const saveApiRelations = async () => {
   margin-right: 10px;
 }
 
-
-
 .client-detail-tabs {
   margin-top: 20px;
 }

src/views/apihub/datasource.vue

@@ -16,7 +16,7 @@
 <!--          <el-button @click="resetQuery">-->
 <!--            <el-icon><ele-Refresh /></el-icon>重置-->
 <!--          </el-button>-->
-          <el-button type="primary" @click="addOrEdit()" v-auth="'add_datasource'">
+          <el-button type="primary" @click="addOrEdit()" v-auth="'add'">
             <el-icon><ele-Plus /></el-icon>新增
           </el-button>
         </el-form-item>
@@ -25,19 +25,19 @@
       <!-- 数据表格 -->
       <el-table :data="tableData" style="width: 100%" v-loading="loading" row-key="id">
         <el-table-column type="selection" width="50" align="center" />
-        <el-table-column prop="id" label="ID" width="80" align="center" />
-        <el-table-column prop="name" label="数据源名称" min-width="150" show-overflow-tooltip />
-        <el-table-column prop="type" label="数据库类型" width="120" />
+        <el-table-column prop="id" label="ID" width="80" v-col="'id'" align="center" />
+        <el-table-column prop="name" label="数据源名称" min-width="150" v-col="'name'" show-overflow-tooltip />
+        <el-table-column prop="type" label="数据库类型" width="120" v-col="'type'" />
         <!--        <el-table-column prop="host" label="主机地址" min-width="120" show-overflow-tooltip />-->
         <!--        <el-table-column prop="port" label="端口" width="80" align="center" />-->
         <!--        <el-table-column prop="database" label="数据库名" min-width="120" show-overflow-tooltip />-->
-        <el-table-column prop="remark" label="备注" min-width="150" show-overflow-tooltip />
-        <el-table-column prop="createdAt" label="创建时间" width="160" />
-        <el-table-column label="操作" width="160" align="center" fixed="right">
+        <el-table-column prop="remark" label="备注" min-width="150" v-col="'remark'" show-overflow-tooltip />
+        <el-table-column prop="createdAt" label="创建时间" width="160" v-col="'createdAt'" />
+        <el-table-column label="操作" width="160" align="center" fixed="right" v-col="'handle'">
           <template #default="{ row }">
-            <el-button type="primary" size="small" text @click="testConnection(row)" v-auth="'test_datasource'"> 测试连接 </el-button>
-            <el-button type="primary" size="small" text @click="addOrEdit(row)" v-auth="'edit_datasource'"> 编辑 </el-button>
-            <el-button type="danger" size="small" text @click="deleteDataSource(row)" v-auth="'delete_datasource'"> 删除 </el-button>
+            <el-button type="primary" size="small" text @click="testConnection(row)" v-auth="'test'"> 测试连接 </el-button>
+            <el-button type="primary" size="small" text @click="addOrEdit(row)" v-auth="'edit'"> 编辑 </el-button>
+            <el-button type="danger" size="small" text @click="deleteDataSource(row)" v-auth="'del'"> 删除 </el-button>
           </template>
         </el-table-column>
       </el-table>

src/views/apihub/plugin.vue

@@ -44,8 +44,8 @@
         </el-form>
         <el-table :data="tableData" style="width: 100%" v-loading="loading" row-key="id">
           <el-table-column type="selection" width="40" align="center" />
-          <el-table-column prop="name" label="插件名称" min-width="140" show-overflow-tooltip></el-table-column>
-          <el-table-column prop="type" label="类型" width="120" align="center">
+          <el-table-column prop="name" label="插件名称" v-col="'name'" min-width="140" show-overflow-tooltip></el-table-column>
+          <el-table-column prop="type" label="类型" v-col="'type'" width="120" align="center">
             <template #default="scope">
               <el-tag size="small" type="success" v-if="scope.row.type === 'Go'">Go</el-tag>
               <el-tag size="small" type="primary" v-else-if="scope.row.type === 'JavaScript'">JavaScript</el-tag>
@@ -53,22 +53,22 @@
               <span v-else>{{ scope.row.type }}</span>
             </template>
           </el-table-column>
-          <el-table-column prop="category" label="分类" width="120" align="center">
+          <el-table-column prop="category" label="分类" v-col="'category'" width="120" align="center">
             <template #default="scope">
               <el-tag size="small" type="info" v-if="scope.row.category === 'Before'">前置插件</el-tag>
               <el-tag size="small" type="info" v-else-if="scope.row.category === 'After'">后置插件</el-tag>
               <span v-else>{{ scope.row.category }}</span>
             </template>
           </el-table-column>
-          <el-table-column prop="description" label="描述" show-overflow-tooltip></el-table-column>
+          <el-table-column prop="description" label="描述" v-col="'description'" show-overflow-tooltip></el-table-column>
           <!-- <el-table-column prop="createdAt" label="创建时间" width="160" align="center"></el-table-column> -->
-          <el-table-column label="操作" width="250" align="center" fixed="right">
+          <el-table-column label="操作" width="250" align="center" fixed="right" v-col="'handle'">
             <template #default="scope">
               <div class="flex-row">
                 <el-button size="small" text type="primary" @click="viewDetail(scope.row)" v-auth="'view'">查看</el-button>
                 <el-button size="small" text type="warning" @click="addOrEdit(scope.row)" v-auth="'edit'">编辑</el-button>
                 <el-button size="small" text type="success" @click="testPlugin(scope.row)" v-auth="'test'">测试</el-button>
-                <el-button size="small" text type="danger" @click="deletePlugin(scope.row)" v-auth="'delete'">删除</el-button>
+                <el-button size="small" text type="danger" @click="deletePlugin(scope.row)" v-auth="'del'">删除</el-button>
               </div>
             </template>
           </el-table-column>

src/views/designer/index.vue

@@ -31,28 +31,28 @@
 				</el-form>
 			</div>
 			<el-table :data="tableData" style="width: 100%" v-loading="loading">
-				<el-table-column prop="name" label="名称" show-overflow-tooltip></el-table-column>
-				<el-table-column prop="ext01" label="说明" show-overflow-tooltip></el-table-column>
-				<el-table-column prop="menuId" label="绑定菜单" width="100" align="center">
+				<el-table-column prop="name" v-col="'name'" label="名称" show-overflow-tooltip></el-table-column>
+				<el-table-column prop="ext01" v-col="'ext01'" label="说明" show-overflow-tooltip></el-table-column>
+				<el-table-column prop="menuId" v-col="'menuId'" label="绑定菜单" width="100" align="center">
 					<template #default="{ row }">
 						<el-tag :type="row.menuId ? 'success' : 'info'" size="small">{{ row.menuId ? '已绑定' : '未绑定' }}</el-tag>
 					</template>
 				</el-table-column>
-				<el-table-column prop="status" label="发布状态" width="100" align="center">
+				<el-table-column prop="status" v-col="'status'" label="发布状态" width="100" align="center">
 					<template #default="{ row }">
 						<el-tag :type="row.status ? 'success' : 'info'" size="small">{{ row.status ? '已发布' : '未发布' }}</el-tag>
 					</template>
 				</el-table-column>
-				<el-table-column prop="createdAt" label="创建时间" width="170" align="center"></el-table-column>
-				<el-table-column prop="updatedAt" label="更新时间" width="170" align="center"></el-table-column>
-				<el-table-column label="操作" width="280" align="center">
+				<el-table-column prop="createdAt" v-col="'createdAt'" label="创建时间" width="170" align="center"></el-table-column>
+				<el-table-column prop="updatedAt" v-col="'updatedAt'" label="更新时间" width="170" align="center"></el-table-column>
+				<el-table-column label="操作" width="280" align="center" v-col="'handle'">
 					<template #default="scope">
-						<el-button size="small" text type="primary" v-if="!scope.row.folderName" @click="view(scope.row)">预览</el-button>
+						<el-button size="small" text type="primary" v-auth="'detail'" v-if="!scope.row.folderName" @click="view(scope.row)">预览</el-button>
 						<el-button size="small" text type="warning" v-auth="'edit'" @click="addOrEdit(scope.row)">编辑</el-button>
-						<el-button size="small" text type="warning" @click="edit(scope.row)">设计</el-button>
-						<el-button size="small" text type="success" v-if="scope.row.menuId" @click="bindMenu(scope.row)">编辑菜单</el-button>
-						<el-button size="small" text type="success" v-if="scope.row.status === 0" @click="publish(scope.row, 1)">发布</el-button>
-						<el-button size="small" text type="info" v-if="scope.row.status === 1" @click="publish(scope.row, 0)">取消发布</el-button>
+						<el-button size="small" text type="warning" v-auth="'design'" @click="edit(scope.row)">设计</el-button>
+						<el-button size="small" text type="success" v-auth="'edit_menu'" v-if="scope.row.menuId" @click="bindMenu(scope.row)">编辑菜单</el-button>
+						<el-button size="small" text type="success" v-auth="'publish'" v-if="scope.row.status === 0" @click="publish(scope.row, 1)">发布</el-button>
+						<el-button size="small" text type="info" v-auth="'cancel_publish'" v-if="scope.row.status === 1" @click="publish(scope.row, 0)">取消发布</el-button>
 						<el-button size="small" text type="info" v-auth="'del'" @click="del(scope.row)">删除</el-button>
 					</template>
 				</el-table-column>

src/views/system/api/index.vue

@@ -1,140 +1,165 @@
 <template>
-	<div class="page">
-		<el-card shadow="nover">
-			<el-form :model="params" inline ref="queryRef">
-				<el-form-item label="接口名称" prop="name">
-					<el-input v-model="params.name" placeholder="请输入接口名称" clearable style="width: 180px" @keyup.enter.native="getList(1)" />
-				</el-form-item>
-				<el-form-item label="接口地址" prop="address">
-					<el-input v-model="params.address" placeholder="请输入接口地址" clearable style="width: 180px" @keyup.enter.native="getList(1)" />
-				</el-form-item>
-				<el-form-item label="状态" prop="status">
-					<el-select v-model="params.status" placeholder="接口状态" clearable style="width: 120px">
-						<el-option label="全部" :value="-1" />
-						<el-option label="启用" :value="1" />
-						<el-option label="禁用" :value="0" />
-					</el-select>
-				</el-form-item>
-				<el-form-item>
-					<el-button type="primary" class="ml10" @click="getList(1)">
-						<el-icon>
-							<ele-Search />
-						</el-icon>
-						查询
-					</el-button>
-					<!-- <el-button @click="resetQuery()">
+  <div class="page">
+    <el-card shadow="nover">
+      <el-form :model="params" inline ref="queryRef">
+        <el-form-item label="接口名称" prop="name">
+          <el-input v-model="params.name" placeholder="请输入接口名称" clearable style="width: 180px" @keyup.enter.native="getList(1)" />
+        </el-form-item>
+        <el-form-item label="接口地址" prop="address">
+          <el-input v-model="params.address" placeholder="请输入接口地址" clearable style="width: 180px" @keyup.enter.native="getList(1)" />
+        </el-form-item>
+        <el-form-item label="状态" prop="status">
+          <el-select v-model="params.status" placeholder="接口状态" clearable style="width: 120px">
+            <el-option label="全部" :value="-1" />
+            <el-option label="启用" :value="1" />
+            <el-option label="禁用" :value="0" />
+          </el-select>
+        </el-form-item>
+        <el-form-item>
+          <el-button type="primary" class="ml10" @click="getList(1)">
+            <el-icon>
+              <ele-Search />
+            </el-icon>
+            查询
+          </el-button>
+          <!-- <el-button @click="resetQuery()">
 							<el-icon>
 								<ele-Refresh />
 							</el-icon>
 							重置
 						</el-button> -->
-					<el-button type="primary" @click="addOrEdit()" v-auth="'add'">
-						<el-icon>
-							<ele-FolderAdd />
-						</el-icon>
-						新增接口
-					</el-button>
-					<el-button type="primary" :disabled="!ids.length" @click="bindMenus()" v-auth="'batch'">
-						<el-icon>
-							<ele-Grid />
-						</el-icon>
-						批量绑定菜单
-					</el-button>
-					<el-button type="primary" @click="apiImport()" :loading="importing" v-auth="'import'">
-						<el-icon>
-							<ele-Download />
-						</el-icon>
-						系统API同步
-					</el-button>
-				</el-form-item>
-			</el-form>
-			<el-table :data="tableData" @selection-change="handleSelectionChange" style="width: 100%" v-loading="loading" :expand-row-keys="[]" row-key="id" :tree-props="{ children: 'children', hasChildren: 'hasChildren' }">
-				<el-table-column v-col="'selection'" type="selection" width="55" align="center" />
-				<!-- <el-table-column type="index" label="序号" width="60" align="center" /> -->
-				<el-table-column prop="id" label="ID" width="120" align="center" />
-				<el-table-column prop="name" v-col="'name'" label="接口名称" show-overflow-tooltip></el-table-column>
-				<el-table-column prop="address" v-col="'address'" label="接口地址" show-overflow-tooltip></el-table-column>
-				<el-table-column prop="status" v-col="'status'" label="状态" min-width="100" align="center">
-					<template #default="scope">
-						<el-tag type="success" size="small" v-if="scope.row.status">启用</el-tag>
-						<el-tag type="info" size="small" v-else>禁用</el-tag>
-					</template>
-				</el-table-column>
-				<!-- <el-table-column prop="menuIds" label="绑定菜单" show-overflow-tooltip></el-table-column> -->
-				<el-table-column label="操作" width="100" align="center" v-col="'handle'">
-					<template #default="scope">
-						<el-button size="small" text type="warning" @click="addOrEdit(scope.row)" v-auth="'edit'">修改</el-button>
-						<el-button size="small" text type="info" @click="onDel(scope.row)" v-auth="'del'">删除</el-button>
-					</template>
-				</el-table-column>
-			</el-table>
-			<pagination v-if="params.total" :total="params.total" v-model:page="params.pageNum" v-model:limit="params.pageSize" @pagination="getList()" />
-		</el-card>
-		<EditForm ref="editFormRef" @getList="getList(1)"></EditForm>
-		<bindVue ref="bindRef" @getList="getList(1)"></bindVue>
-	</div>
+          <el-button type="primary" @click="addOrEdit()" v-auth="'add'">
+            <el-icon>
+              <ele-FolderAdd />
+            </el-icon>
+            新增接口
+          </el-button>
+          <el-button type="primary" :disabled="!ids.length" @click="bindMenus()" v-auth="'batch'">
+            <el-icon>
+              <ele-Grid />
+            </el-icon>
+            批量绑定菜单
+          </el-button>
+          <el-button type="primary" @click="apiImport()" :loading="importing" v-auth="'import'">
+            <el-icon>
+              <ele-Download />
+            </el-icon>
+            系统API同步
+          </el-button>
+        </el-form-item>
+      </el-form>
+      <el-table :data="tableData" @selection-change="handleSelectionChange" style="width: 100%" v-loading="loading" :expand-row-keys="[]" row-key="id" :tree-props="{ children: 'children', hasChildren: 'hasChildren' }">
+        <el-table-column v-col="'selection'" type="selection" width="55" align="center" />
+        <!-- <el-table-column type="index" label="序号" width="60" align="center" /> -->
+        <el-table-column prop="id" label="ID" width="120" align="center" />
+        <el-table-column prop="name" v-col="'name'" label="接口名称" show-overflow-tooltip></el-table-column>
+        <el-table-column prop="address" v-col="'address'" label="接口地址" show-overflow-tooltip></el-table-column>
+        <el-table-column prop="status" v-col="'status'" label="状态" min-width="100" align="center">
+          <template #default="scope">
+            <el-tag type="success" size="small" v-if="scope.row.status">启用</el-tag>
+            <el-tag type="info" size="small" v-else>禁用</el-tag>
+          </template>
+        </el-table-column>
+        <!-- <el-table-column prop="menuIds" label="绑定菜单" show-overflow-tooltip></el-table-column> -->
+        <el-table-column label="操作" width="100" align="center" v-col="'handle'">
+          <template #default="scope">
+            <el-button size="small" text type="warning" @click="addOrEdit(scope.row)" v-auth="'edit'">修改</el-button>
+            <el-button size="small" text type="info" @click="onDel(scope.row)" v-auth="'del'">删除</el-button>
+          </template>
+        </el-table-column>
+      </el-table>
+      <pagination v-if="params.total" :total="params.total" v-model:page="params.pageNum" v-model:limit="params.pageSize" @pagination="getList()" />
+    </el-card>
+    <EditForm ref="editFormRef" @getList="getList(1)"></EditForm>
+    <bindVue ref="bindRef" @getList="getList(1)"></bindVue>
+  </div>
 </template>
 
 <script lang="ts" setup>
-import { ref } from 'vue'
-import EditForm from './component/edit.vue'
-import bindVue from './component/bind.vue'
-import { ApiRow } from '/@/api/model/system/menu'
-import api from '/@/api/system'
-import { ElMessageBox, ElMessage } from 'element-plus'
-import { useSearch } from '/@/hooks/useCommon'
+import { ref } from "vue";
+import EditForm from "./component/edit.vue";
+import bindVue from "./component/bind.vue";
+import { ApiRow } from "/@/api/model/system/menu";
+import api from "/@/api/system";
+import { ElMessageBox, ElMessage } from "element-plus";
+import { useSearch } from "/@/hooks/useCommon";
 
-const editFormRef = ref()
-const bindRef = ref()
-const queryRef = ref()
-const importing = ref(false)
-const ids = ref<number[]>([])
+const editFormRef = ref();
+const bindRef = ref();
+const queryRef = ref();
+const importing = ref(false);
+const ids = ref<number[]>([]);
 
-const { params, tableData, getList, loading } = useSearch<ApiRow[]>(api.api.getList, 'Info', { name: '', address: '', types: -1 })
+const { params, tableData, getList, loading } = useSearch<ApiRow[]>(api.api.getList, "Info", { name: "", address: "", types: -1 });
 
-getList()
+getList();
 
 const addOrEdit = async (row?: ApiRow) => {
-	if (row) {
-		const res = await api.api.detail(row.id as number)
-		editFormRef.value.open(res)
-		return
-	} else {
-		editFormRef.value.open()
-	}
-}
+  if (row) {
+    const res = await api.api.detail(row.id as number);
+    editFormRef.value.open(res);
+    return;
+  } else {
+    editFormRef.value.open();
+  }
+};
 
 const handleSelectionChange = (selection: any[]) => {
-	ids.value = selection.filter(item => item.types === 2).map((item) => item.id);
+  ids.value = selection.filter((item) => item.types === 2).map((item) => item.id);
 };
 
 const apiImport = () => {
-	importing.value = true
-	api.api.import().then(() => {
-		ElMessage.success('导入成功')
-	}).finally(() => importing.value = false)
+  importing.value = true;
+  api.api
+    .import()
+    .then(() => {
+      ElMessage.success("导入成功");
+    })
+    .finally(() => (importing.value = false));
 };
 
 // 重置表单
 const resetQuery = () => {
-	queryRef.value.resetFields()
-	getList(1)
-}
+  queryRef.value.resetFields();
+  getList(1);
+};
 
 // 重置表单
 const bindMenus = () => {
-	bindRef.value.open(ids.value)
-}
+  bindRef.value.open(ids.value);
+};
 
 const onDel = (row: ApiRow) => {
-	ElMessageBox.confirm(`此操作将删除接口：“${row.name}”，是否继续?`, '提示', {
-		confirmButtonText: '确认',
-		cancelButtonText: '取消',
-		type: 'warning',
-	}).then(async () => {
-		await api.api.del(row.id as number)
-		ElMessage.success('删除成功')
-		getList()
-	})
-}
+  ElMessageBox.confirm(`此操作将删除接口：“${row.name}”，是否继续?`, "提示", {
+    confirmButtonText: "确认",
+    cancelButtonText: "取消",
+    type: "warning",
+  }).then(async () => {
+    await api.api.del(row.id as number);
+    ElMessage.success("删除成功");
+    getList();
+  });
+};
+
+// const autoAddList = [
+// 	{
+// 		menuIds: [240],
+// 		name: "插件测试",
+// 		types: 2,
+// 		apiTypes: "IOT",
+// 		address: "/api/v1/plugin/test",
+// 		method: "POST",
+// 		remark: "",
+// 		status: 1,
+// 		parentId: 708,
+// 	},
+// ];
+
+// function autoAddApi() {
+//   autoAddList.forEach((item) => {
+//     api.api.add(item);
+//   });
+// }
+
+// autoAddApi();
 </script>

src/views/system/menu/component/btn.vue

@@ -27,6 +27,11 @@
             <el-dropdown-item command="save-保存">保存</el-dropdown-item>
             <el-dropdown-item command="startOrStop-启用停用">启用停用</el-dropdown-item>
             <el-dropdown-item command="status-切换状态">切换状态</el-dropdown-item>
+            <el-dropdown-item command="publish-发布">发布</el-dropdown-item>
+            <el-dropdown-item command="deprecate-废弃">废弃</el-dropdown-item>
+            <el-dropdown-item command="test-测试">测试</el-dropdown-item>
+            <el-dropdown-item command="view-查看">查看</el-dropdown-item>
+            <el-dropdown-item command="reset-重置">重置</el-dropdown-item>
           </el-dropdown-menu>
         </template>
       </el-dropdown>

src/views/system/menu/component/list.vue

@@ -17,8 +17,14 @@
 					<el-dropdown-menu>
 						<el-dropdown-item command="status-状态">状态</el-dropdown-item>
 						<el-dropdown-item command="createdAt-创建时间">创建时间</el-dropdown-item>
+						<el-dropdown-item command="updatedAt-更新时间">更新时间</el-dropdown-item>
 						<el-dropdown-item command="handle-操作">操作</el-dropdown-item>
 						<el-dropdown-item command="selection-复选框">复选框</el-dropdown-item>
+						<el-dropdown-item command="description-描述">描述</el-dropdown-item>
+						<el-dropdown-item command="id-ID">ID</el-dropdown-item>
+						<el-dropdown-item command="name-名称">名称</el-dropdown-item>
+						<el-dropdown-item command="type-类型">类型</el-dropdown-item>
+						<el-dropdown-item command="remark-备注">备注</el-dropdown-item>
 					</el-dropdown-menu>
 				</template>
 			</el-dropdown>