From 987dddf55af3c0d5e3cb25209fdafa3ea6baec79 Mon Sep 17 00:00:00 2001
From: Charles7c <charles7c@126.com>
Date: Sun, 13 Apr 2025 16:36:36 +0800
Subject: [PATCH] =?UTF-8?q?refactor(system/client):=20=E7=A7=BB=E9=99=A4?=
 =?UTF-8?q?=E7=BB=88=E7=AB=AF=E9=83=A8=E5=88=86=E9=85=8D=E7=BD=AE=E5=AD=97?=
 =?UTF-8?q?=E6=AE=B5?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/apis/system/type.ts                       | 12 ++---
 src/views/open/app/AppDetailDrawer.vue        |  7 ++-
 .../system/config/client/ClientAddModal.vue   | 44 +++----------------
 .../config/client/ClientDetailDrawer.vue      | 11 +++--
 src/views/system/config/client/index.vue      | 35 ++++++---------
 5 files changed, 32 insertions(+), 77 deletions(-)

diff --git a/src/apis/system/type.ts b/src/apis/system/type.ts
index 32a173f..d7b5f87 100644
--- a/src/apis/system/type.ts
+++ b/src/apis/system/type.ts
@@ -268,10 +268,8 @@ export interface StorageQuery {
 export interface ClientResp {
   id: string
   clientId: string
-  clientKey: string
-  clientSecret: string
-  authType: string
   clientType: string
+  authType: string
   activeTimeout: string
   timeout: string
   status: string
@@ -285,10 +283,8 @@ export interface ClientResp {
 export interface ClientDetailResp {
   id: string
   clientId: string
-  clientKey: string
-  clientSecret: string
-  authType: string
   clientType: string
+  authType: string
   activeTimeout: string
   timeout: string
   status: string
@@ -300,10 +296,8 @@ export interface ClientDetailResp {
   updateUserString: string
 }
 export interface ClientQuery {
-  clientKey: string
-  clientSecret: string
-  authType: string[]
   clientType: string
+  authType: string[]
   status: string
   sort: Array<string>
 }
diff --git a/src/views/open/app/AppDetailDrawer.vue b/src/views/open/app/AppDetailDrawer.vue
index 75f992a..14c55ea 100644
--- a/src/views/open/app/AppDetailDrawer.vue
+++ b/src/views/open/app/AppDetailDrawer.vue
@@ -1,10 +1,13 @@
 <template>
-  <a-drawer v-model:visible="visible" title="应用详情" :width="width >= 500 ? 500 : '100%'" :footer="false">
+  <a-drawer v-model:visible="visible" title="应用详情" :width="width >= 600 ? 600 : '100%'" :footer="false">
     <a-descriptions :column="2" size="large" class="general-description">
       <a-descriptions-item label="ID">{{ dataDetail?.id }}</a-descriptions-item>
       <a-descriptions-item label="名称">{{ dataDetail?.name }}</a-descriptions-item>
       <a-descriptions-item label="Access Key" :span="2"><CellCopy :content="dataDetail?.accessKey" /></a-descriptions-item>
-      <a-descriptions-item label="状态"><GiCellStatus :status="dataDetail?.status" /></a-descriptions-item>
+      <a-descriptions-item label="状态">
+        <a-tag v-if="dataDetail?.status === 1" color="green">启用</a-tag>
+        <a-tag v-else color="red">禁用</a-tag>
+      </a-descriptions-item>
       <a-descriptions-item label="失效时间">{{ dataDetail?.expireTime }}</a-descriptions-item>
       <a-descriptions-item label="创建人">{{ dataDetail?.createUserString }}</a-descriptions-item>
       <a-descriptions-item label="创建时间">{{ dataDetail?.createTime }}</a-descriptions-item>
diff --git a/src/views/system/config/client/ClientAddModal.vue b/src/views/system/config/client/ClientAddModal.vue
index 751dae2..60ecbaa 100644
--- a/src/views/system/config/client/ClientAddModal.vue
+++ b/src/views/system/config/client/ClientAddModal.vue
@@ -16,7 +16,6 @@
 <script setup lang="tsx">
 import { Message } from '@arco-design/web-vue'
 import { useWindowSize } from '@vueuse/core'
-import CryptoJS from 'crypto-js'
 import { addClient, getClient, updateClient } from '@/apis/system/client'
 import { type ColumnItem, GiForm } from '@/components/GiForm'
 import { DisEnableStatusList } from '@/constant/common'
@@ -43,39 +42,15 @@ const [form, resetForm] = useResetReactive({
   isShare: 1,
   status: 1,
 })
-const handleGenerate = () => {
-  const timestamp = Date.now()
-  form.clientSecret = CryptoJS.MD5(`${timestamp}`).toString(CryptoJS.enc.Hex)
-}
 
 const columns: ColumnItem[] = reactive([
   {
-    label: '终端 Key',
-    field: 'clientKey',
-    type: 'input',
-    span: 24,
-    required: true,
+    label: '终端类型',
+    field: 'clientType',
+    type: 'select',
+    span: 12,
     props: {
-      maxLength: 32,
-    },
-    disabled: () => isUpdate.value,
-  },
-  {
-    label: '终端秘钥',
-    field: 'clientSecret',
-    type: 'input',
-    span: 24,
-    required: true,
-    disabled: () => isUpdate.value,
-    slots: {
-      append: () => (
-        <a-button onClick={handleGenerate}>
-          {{
-            default: '随机生成',
-            icon: <icon-refresh />,
-          }}
-        </a-button>
-      ),
+      options: client_type,
     },
   },
   {
@@ -90,15 +65,6 @@ const columns: ColumnItem[] = reactive([
       maxTagCount: 2,
     },
   },
-  {
-    label: '终端类型',
-    field: 'clientType',
-    type: 'select',
-    span: 12,
-    props: {
-      options: client_type,
-    },
-  },
   {
     label: () => (
       <a-tooltip content="-1 代表不限制，永不冻结">
diff --git a/src/views/system/config/client/ClientDetailDrawer.vue b/src/views/system/config/client/ClientDetailDrawer.vue
index adcef83..7404725 100644
--- a/src/views/system/config/client/ClientDetailDrawer.vue
+++ b/src/views/system/config/client/ClientDetailDrawer.vue
@@ -3,20 +3,19 @@
     <a-descriptions :column="2" size="large" class="general-description">
       <a-descriptions-item label="ID">{{ dataDetail?.id }}</a-descriptions-item>
       <a-descriptions-item label="终端ID" :span="2"><a-typography-paragraph :copyable="!!dataDetail?.clientId">{{ dataDetail?.clientId }}</a-typography-paragraph></a-descriptions-item>
-      <a-descriptions-item label="终端Key" :span="2">{{ dataDetail?.clientKey }}</a-descriptions-item>
-      <a-descriptions-item label="终端秘钥" :span="2">{{ dataDetail?.clientSecret }}</a-descriptions-item>
+      <a-descriptions-item label="终端类型" :span="2">
+        <GiCellTag :value="dataDetail?.clientType" :dict="client_type" />
+      </a-descriptions-item>
       <a-descriptions-item label="认证类型" :span="2">
         <a-space>
           <GiCellTag v-for="(item, index) in dataDetail?.authType" :key="index" :value="item" :dict="auth_type_enum" />
         </a-space>
       </a-descriptions-item>
-      <a-descriptions-item label="终端类型" :span="2">
-        <GiCellTag :value="dataDetail?.clientType" :dict="client_type" />
-      </a-descriptions-item>
       <a-descriptions-item label="Token最低活跃频率">{{ dataDetail?.activeTimeout }}</a-descriptions-item>
       <a-descriptions-item label="Token有效期">{{ dataDetail?.timeout }}</a-descriptions-item>
       <a-descriptions-item label="状态" :span="2">
-        <GiCellStatus :status="dataDetail?.status" />
+        <a-tag v-if="dataDetail?.status === 1" color="green">启用</a-tag>
+        <a-tag v-else color="red">禁用</a-tag>
       </a-descriptions-item>
       <a-descriptions-item label="创建人">{{ dataDetail?.createUserString }}</a-descriptions-item>
       <a-descriptions-item label="创建时间">{{ dataDetail?.createTime }}</a-descriptions-item>
diff --git a/src/views/system/config/client/index.vue b/src/views/system/config/client/index.vue
index 776833c..758d304 100644
--- a/src/views/system/config/client/index.vue
+++ b/src/views/system/config/client/index.vue
@@ -5,14 +5,13 @@
       :data="dataList"
       :columns="columns"
       :loading="loading"
-      :scroll="{ x: '100%', y: '100%', minWidth: 1500 }"
+      :scroll="{ x: '100%', y: '100%', minWidth: 1200 }"
       :pagination="pagination"
       :disabled-tools="['size']"
       :disabled-column-keys="['clientKey']"
       @refresh="search"
     >
       <template #toolbar-left>
-        <a-input-search v-model="queryForm.clientKey" placeholder="搜索终端Key" allow-clear @search="search" />
         <a-select
           v-model="queryForm.clientType"
           :options="client_type"
@@ -83,10 +82,8 @@ const {
 } = useDict('client_type', 'auth_type_enum')
 
 const queryForm = reactive<ClientQuery>({
-  clientKey: '',
-  clientSecret: '',
-  authType: [] as string[],
   clientType: '',
+  authType: [] as string[],
   status: '',
   sort: ['id,desc'],
 })
@@ -123,8 +120,17 @@ const columns: TableInstance['columns'] = [
       )
     },
   },
-  { title: '终端 Key', dataIndex: 'clientKey', slotName: 'clientKey', ellipsis: true, tooltip: true, align: 'center' },
-  { title: '终端秘钥', dataIndex: 'clientSecret', slotName: 'clientSecret', ellipsis: true, tooltip: true, align: 'center' },
+  {
+    title: '终端类型',
+    dataIndex: 'clientType',
+    slotName: 'clientType',
+    ellipsis: true,
+    tooltip: true,
+    align: 'center',
+    render: ({ record }) => {
+      return <GiCellTag value={record.clientType} dict={client_type.value} />
+    },
+  },
   {
     title: '认证类型',
     dataIndex: 'authType',
@@ -138,17 +144,6 @@ const columns: TableInstance['columns'] = [
       )
     },
   },
-  {
-    title: '终端类型',
-    dataIndex: 'clientType',
-    slotName: 'clientType',
-    ellipsis: true,
-    tooltip: true,
-    align: 'center',
-    render: ({ record }) => {
-      return <GiCellTag value={record.clientType} dict={client_type.value} />
-    },
-  },
   { title: 'Token 最低活跃频率', dataIndex: 'activeTimeout', slotName: 'activeTimeout', width: 180, align: 'center', render: ({ record }) => `${record.activeTimeout} 秒` },
   { title: 'Token 有效期', dataIndex: 'timeout', slotName: 'timeout', align: 'center', render: ({ record }) => `${record.timeout} 秒` },
   {
@@ -177,10 +172,8 @@ const columns: TableInstance['columns'] = [
 
 // 重置
 const reset = () => {
-  queryForm.clientKey = ''
-  queryForm.clientSecret = ''
-  queryForm.authType = []
   queryForm.clientType = ''
+  queryForm.authType = []
   queryForm.status = ''
   search()
 }