feat: 完善plugin功能

src/api/dashboard.ts

@@ -9,7 +9,7 @@ export interface DataRes {
 }
 export interface DataList {
   id?: number;
-  userId?: number;
+  userId?: number | null;
   server?: string;
   user?: string;
   password?: string;
@@ -50,8 +50,18 @@ export async function getPluginDetails(params: object): Promise<DataRes> {
   const res = await instance.post('/api/Plugin/PluginDetail', params);
   return res.data;
 }
-export async function savePluginDetails(params: object): Promise<DataRes> {
-  const res = await instance.post('/api​/Plugin​/SavePlugin', params);
+export async function savePluginDetails(
+  params: Record<string, any>
+): Promise<DataRes> {
+  const formData = new URLSearchParams();
+  Object.keys(params).forEach(key => {
+    formData.append(key, params[key]);
+  });
+  const res = await instance.post('/api/Plugin/SavePlugin', formData, {
+    headers: {
+      'Content-Type': 'application/x-www-form-urlencoded',
+    },
+  });
   return res.data;
 }
 export async function exportPluginList(params: object): Promise<ExportUrl> {

src/api/user.ts

@@ -39,23 +39,18 @@ export interface RefreshToken {
   code: string;
 }
 export interface UserParams {
-  name: string;
+  user: string;
   desc: string;
   privilege: number | null;
   pageIndex: number;
   pageSize: number;
 }
 export interface UserData {
-  data: {
-    id?: number;
-    name?: string;
-    password?: string;
-    desc?: string;
-    privilege?: number | null;
-  };
-  success: boolean;
-  message: string;
-  code?: any;
+  id?: number;
+  user?: string;
+  password?: string;
+  desc?: string;
+  privilege?: number | null;
 }
 
 export interface UserRes {

src/views/dashboard/plugin/edit.vue

@@ -12,7 +12,7 @@
           <a-col :span="12">
             <a-form-item
               field="user"
-              :label="t('dashboard.form.user')"
+              :label="t('dashboard.form.name')"
               :rules="getRules(t).required"
             >
               <a-input v-model="form.user" />
@@ -38,13 +38,40 @@
               <a-input v-model="form.location" />
             </a-form-item>
           </a-col>
+          <a-col :span="12">
+            <a-form-item field="hostName" :label="t('dashboard.form.hostName')">
+              <a-input v-model="form.hostName" />
+            </a-form-item>
+          </a-col>
+        </a-row>
+        <a-row :gutter="8">
           <a-col :span="12">
             <a-form-item
-              field="hostName"
-              :label="t('dashboard.form.hostName')"
+              field="userId"
+              :label="t('dashboard.form.user')"
               :rules="getRules(t).required"
             >
-              <a-input v-model="form.hostName" />
+              <a-select
+                v-model="form.userId"
+                :placeholder="t('dashboard.form.user')"
+                allow-clear
+                @clear="form.userId = null"
+              >
+                <a-option
+                  v-for="item of userList"
+                  :value="item.id"
+                  :label="item.user"
+                />
+              </a-select>
+            </a-form-item>
+          </a-col>
+          <a-col :span="12">
+            <a-form-item
+              field="password"
+              :label="t('dashboard.form.password')"
+              :rules="getRules(t).required"
+            >
+              <a-input v-model="form.password" />
             </a-form-item>
           </a-col>
         </a-row>
@@ -56,9 +83,11 @@
 import { reactive, ref, shallowRef, watch, getCurrentInstance } from 'vue';
 import { getPluginDetails, savePluginDetails } from '@/api/dashboard';
 import type { DataList } from '@/api/dashboard';
-import { privilegeList } from '@/utils/const';
+import { privilegeList, getRules } from '@/utils/const';
 import { useI18n } from 'vue-i18n';
-import { getRules } from '@/utils/const';
+import type { UserData, UserParams } from '@/api/user';
+import { getUserList, fetchDeleteUser } from '@/api/user';
+
 const formRef = ref();
 const { t } = useI18n();
 
@@ -78,7 +107,7 @@ const props = withDefaults(defineProps<EditDialogProps>(), {
 });
 const emit = defineEmits<EditDialogEmits>();
 const visible = shallowRef<boolean>(false);
-
+const userList = ref<UserData[]>([] as UserData[]);
 watch(
   () => props.modelValue,
   value => {
@@ -92,18 +121,22 @@ watch(
 );
 const formModel = () => {
   return {
+    id: 0,
+    userId: null,
     server: '',
     user: '',
-    password: '',
     location: '',
     hostName: '',
   } as DataList;
 };
 const form = ref<DataList>(formModel());
-
+getUserList({}).then(res => {
+  userList.value.push(...res.data);
+});
 const handleBeforeOk = (done: (closed: boolean) => void) => {
   formRef.value.validate().then((data: DataList) => {
     if (!data) {
+      form.value.id = props.id || 0;
       savePluginDetails(form.value)
         .then(res => {
           if (res.success) {

src/views/dashboard/plugin/index.vue

@@ -72,7 +72,7 @@
         row-key="name"
         :loading="loading"
         :pagination="pagination"
-        :columns="cloneColumns as TableColumnData[]"
+        :columns="cloneColumns"
         :data="renderData"
         :bordered="false"
         :size="size"
@@ -281,7 +281,7 @@ const handleCancel = () => {
   visible.value = false;
 };
 const updateListFun = () => {
-  pluginId.value = null;
+  pluginId.value = 0;
   searchTable();
 };
 const handleDeleteFun = (id: number) => {

src/views/dashboard/plugin/locale/en-US.ts

@@ -4,6 +4,8 @@ export default {
   'dashboard.dialog.title': 'Device Information',
   'dashboard.form.location': 'Location',
   'dashboard.form.user': 'User',
+  'dashboard.form.name': 'Name',
+  'dashboard.form.password': 'Password',
   'dashboard.form.server': 'Server',
   'dashboard.form.hostName': 'HostName',
   'dashboard.form.timeRange': 'TimeRange',

src/views/dashboard/plugin/locale/zh-CN.ts

@@ -3,7 +3,9 @@ export default {
   'workplace.welcome': '欢迎回来！',
   'dashboard.dialog.title': '设备信息',
   'dashboard.form.location': 'IP地址',
-  'dashboard.form.user': '账号',
+  'dashboard.form.user': '用户',
+  'dashboard.form.name': '账号',
+  'dashboard.form.password': '密码',
   'dashboard.form.server': '服务器',
   'dashboard.form.hostName': '主机名',
   'dashboard.form.timeRange': '时间范围',

src/views/user/manage/index.vue

@@ -71,10 +71,10 @@
       </a-row>
       <a-table
         class="table-list"
-        row-key="name"
+        row-key="id"
         :loading="loading"
         :pagination="pagination"
-        :columns="(cloneColumns as TableColumnData[])"
+        :columns="cloneColumns"
         :data="paginatedData"
         :bordered="false"
         :size="size"
@@ -85,12 +85,7 @@
           {{ rowIndex + 1 + (pagination.current - 1) * pagination.pageSize }}
         </template>
         <template #privilege="{ record }">
-          {{
-            t(
-              privilegeList.find(item => item.value === record.privilege)
-                ?.label as string
-            ) || '-'
-          }}
+          {{ getPrivilegeLabel(record.privilege) }}
         </template>
 
         <template #optional="{ record }">
@@ -143,8 +138,8 @@ const cloneColumns = computed(() => [
   },
   {
     title: t('manage.form.name'),
-    dataIndex: 'name',
-    slotName: 'name',
+    dataIndex: 'user',
+    slotName: 'user',
   },
   {
     title: t('manage.form.desc'),
@@ -234,6 +229,13 @@ const handleDeleteFun = (id: number) => {
     },
   });
 };
+const getPrivilegeLabel = computed(() => {
+  return (privilegeValue: string | number) => {
+    if (!privilegeValue || !privilegeList) return '-';
+    const privilege = privilegeList.find(item => item.value === privilegeValue);
+    return privilege ? t(privilege.label as string) : '-';
+  };
+});
 </script>
 <style scoped lang="less">
 .container {