chore(数据库): 更新参数定义

src/views/personal-space/personal-database/columns.tsx

@@ -15,7 +15,7 @@ export function createDatabaseColumn(handleDatabaseTableAction: (actionType: str
       width: 210,
       fixed: 'left',
       render(row: DatabaseItemInterface) {
-        return row.databaseName || '--'
+        return row.title || '--'
       },
     },
     {
@@ -27,7 +27,7 @@ export function createDatabaseColumn(handleDatabaseTableAction: (actionType: str
       },
       width: 380,
       render(row: DatabaseItemInterface) {
-        return row.databaseDesc || '--'
+        return row.desc || '--'
       },
     },
     {

src/views/personal-space/personal-database/components/create-database-modal.vue

@@ -10,20 +10,20 @@ const databaseFormRef = ref<FormInst | null>(null)
 const scrollbarRef = useTemplateRef<ScrollbarInst | null>('scrollbarRef')
 
 const databaseFormData = reactive({
-  name: '',
-  databaseDesc: '',
-  databaseSourceType: 'MySQL',
-  databaseHost: '',
-  databasePort: '',
-  databaseName: '',
-  databaseUserName: '',
-  databasePassword: '',
+  title: '',
+  desc: '',
+  dbType: 'MYSQL',
+  dbHost: '',
+  dbPort: '',
+  dbName: '',
+  dbUserName: '',
+  dbPassword: '',
 })
 
 const databaseFormRules = shallowReadonly<FormRules>({
-  name: [
+  title: [
     {
-      key: 'name',
+      key: 'title',
       required: true,
       validator: (_rule: FormItemRule, value: string) => {
         const pattern = /^[\u4e00-\u9fa5a-zA-Z0-9_\-\\.]+$/
@@ -39,12 +39,12 @@ const databaseFormRules = shallowReadonly<FormRules>({
       trigger: 'blur',
     },
   ],
-  databaseSourceType: [{ required: true, message: '请选择数据源类型', trigger: 'blur' }],
-  databaseHost: [{ required: true, message: '请输入IP地址或域名', trigger: 'blur' }],
-  databasePort: [{ required: true, message: '请输入端口号', trigger: 'blur' }],
-  databaseName: [{ required: true, message: '请输入数据库名', trigger: 'blur' }],
-  databaseUserName: [{ required: true, message: '请输入用户名', trigger: 'blur' }],
-  databasePassword: [{ required: true, message: '请输入密码', trigger: 'blur' }],
+  dbType: [{ required: true, message: '请选择数据源类型', trigger: 'blur' }],
+  dbHost: [{ required: true, message: '请输入IP地址或域名', trigger: 'blur' }],
+  dbPort: [{ required: true, message: '请输入端口号', trigger: 'blur' }],
+  dbName: [{ required: true, message: '请输入数据库名', trigger: 'blur' }],
+  dbUserName: [{ required: true, message: '请输入用户名', trigger: 'blur' }],
+  dbPassword: [{ required: true, message: '请输入密码', trigger: 'blur' }],
 })
 
 const databaseTypeList = readonly([
@@ -78,7 +78,7 @@ function handleConnectDatabase() {
       }
     },
     (rule) => {
-      return rule?.key !== 'name'
+      return rule?.key !== 'title'
     },
   )
 }
@@ -113,10 +113,10 @@ function handleCreateDatabase() {
               <span>{{ databaseTypeItem.name }}</span>
             </div>
           </n-form-item>
-          <n-form-item label="数据库名称" path="name" :feedback-style="{ fontSize: '13px' }">
+          <n-form-item label="数据库名称" path="title" :feedback-style="{ fontSize: '13px' }">
             <div class="flex w-full flex-col">
               <n-input
-                v-model:value="databaseFormData.name"
+                v-model:value="databaseFormData.title"
                 placeholder="请输入数据库名称"
                 show-count
                 :maxlength="50"
@@ -129,7 +129,7 @@ function handleCreateDatabase() {
 
           <n-form-item label="数据库描述">
             <n-input
-              v-model:value="databaseFormData.databaseDesc"
+              v-model:value="databaseFormData.desc"
               placeholder="请输入数据库描述，此描述仅用于区分不同数据库，不会影响数据库调用"
               show-count
               :maxlength="100"
@@ -140,38 +140,38 @@ function handleCreateDatabase() {
 
           <h3 class="font-family-medium mb-4 text-[18px]">数据源信息</h3>
 
-          <n-form-item label="数据源类型" path="databaseSourceType" :feedback-style="{ fontSize: '13px' }">
+          <n-form-item label="数据源类型" path="dbType" :feedback-style="{ fontSize: '13px' }">
             <n-select
-              v-model:value="databaseFormData.databaseSourceType"
+              v-model:value="databaseFormData.dbType"
               placeholder="请选择数据源类型"
               :options="databaseSourceTypeOptions"
             />
           </n-form-item>
 
-          <n-form-item label="数据库地址host" path="databaseHost" :feedback-style="{ fontSize: '13px' }">
+          <n-form-item label="数据库地址host" path="dbHost" :feedback-style="{ fontSize: '13px' }">
             <div class="flex w-full flex-col">
-              <n-input v-model:value="databaseFormData.databaseHost" placeholder="请输入IP地址或域名" />
+              <n-input v-model:value="databaseFormData.dbHost" placeholder="请输入IP地址或域名" />
               <span class="mt-1 px-2.5 text-[13px] text-[#6F77FF]">
                 输入的数据源Host必须是公网地址，以百度云GaiaDB数据库为例，请参考文档进行配置
               </span>
             </div>
           </n-form-item>
 
-          <n-form-item label="端口号" path="databasePort" :feedback-style="{ fontSize: '13px' }">
-            <n-input v-model:value="databaseFormData.databasePort" placeholder="请输入端口号" />
+          <n-form-item label="端口号" path="dbPort" :feedback-style="{ fontSize: '13px' }">
+            <n-input v-model:value="databaseFormData.dbPort" placeholder="请输入端口号" />
           </n-form-item>
 
-          <n-form-item label="数据库名" path="databaseName" :feedback-style="{ fontSize: '13px' }">
-            <n-input v-model:value="databaseFormData.databaseName" placeholder="请输入数据库名" />
+          <n-form-item label="数据库名" path="dbName" :feedback-style="{ fontSize: '13px' }">
+            <n-input v-model:value="databaseFormData.dbName" placeholder="请输入数据库名" />
           </n-form-item>
 
-          <n-form-item label="用户名" path="databaseUserName" :feedback-style="{ fontSize: '13px' }">
-            <n-input v-model:value="databaseFormData.databaseUserName" placeholder="请输入用户名" />
+          <n-form-item label="用户名" path="dbUserName" :feedback-style="{ fontSize: '13px' }">
+            <n-input v-model:value="databaseFormData.dbUserName" placeholder="请输入用户名" />
           </n-form-item>
 
-          <n-form-item label="密码" path="databasePassword" :feedback-style="{ fontSize: '13px' }">
+          <n-form-item label="密码" path="dbPassword" :feedback-style="{ fontSize: '13px' }">
             <n-input
-              v-model:value="databaseFormData.databasePassword"
+              v-model:value="databaseFormData.dbPassword"
               type="password"
               show-password-on="click"
               placeholder="请输入密码"

src/views/personal-space/personal-database/components/edit-database-modal.vue

@@ -9,18 +9,19 @@ const databaseFormRef = ref<FormInst | null>(null)
 const scrollbarRef = useTemplateRef<ScrollbarInst | null>('scrollbarRef')
 
 const databaseFormData = reactive({
-  databaseName: 'test',
-  databaseDesc: '',
-  databaseSourceType: 'MySQL',
-  databaseHost: '125.88.205.65',
-  databasePort: '8080',
-  databaseUserName: 'root',
-  databasePassword: '88888',
+  title: 'test',
+  desc: '',
+  dbType: 'MySQL',
+  dbHost: '125.88.205.65',
+  dbPort: '8080',
+  dbName: 'xxxx',
+  dbUserName: 'root',
+  dbPassword: '88888',
 })
 
 const databaseFormRules = shallowReadonly<FormRules>({
-  databaseName: [{ required: true, message: '请输入数据库名称', trigger: 'blur' }],
-  databasePassword: [{ required: true, message: '请输入密码', trigger: 'blur' }],
+  title: [{ required: true, message: '请输入数据库名称', trigger: 'blur' }],
+  dbPassword: [{ required: true, message: '请输入密码', trigger: 'blur' }],
 })
 
 const isConnectDatabaseSuccess = ref(false)
@@ -38,7 +39,7 @@ function handleConnectDatabase() {
       }
     },
     (rule) => {
-      return rule?.key !== 'name'
+      return rule?.key !== 'title'
     },
   )
 }
@@ -49,10 +50,10 @@ function handleConnectDatabase() {
     <template #content>
       <n-scrollbar ref="scrollbarRef" style="max-height: 550px">
         <n-form ref="databaseFormRef" :model="databaseFormData" :rules="databaseFormRules">
-          <n-form-item label="数据库名称" path="databaseName" :feedback-style="{ fontSize: '13px' }">
+          <n-form-item label="数据库名称" path="title" :feedback-style="{ fontSize: '13px' }">
             <div class="flex w-full flex-col">
               <n-input
-                v-model:value="databaseFormData.databaseName"
+                v-model:value="databaseFormData.title"
                 placeholder="请输入数据库名称"
                 show-count
                 :maxlength="50"
@@ -65,7 +66,7 @@ function handleConnectDatabase() {
 
           <n-form-item label="数据库描述">
             <n-input
-              v-model:value="databaseFormData.databaseDesc"
+              v-model:value="databaseFormData.desc"
               placeholder="请输入数据库描述，此描述仅用于区分不同数据库，不会影响数据库调用"
               show-count
               :maxlength="100"
@@ -78,37 +79,37 @@ function handleConnectDatabase() {
 
           <n-form-item label="数据源类型" show-require-mark :feedback-style="{ fontSize: '13px' }">
             <div class="rounded-theme flex h-[32px] w-full items-center bg-[#FAFAFA] px-[14px]">
-              {{ databaseFormData.databaseSourceType }}
+              {{ databaseFormData.dbType }}
             </div>
           </n-form-item>
 
           <n-form-item label="数据库地址host" show-require-mark :feedback-style="{ fontSize: '13px' }">
             <div class="rounded-theme flex h-[32px] w-full items-center bg-[#FAFAFA] px-[14px]">
-              {{ databaseFormData.databaseHost }}
+              {{ databaseFormData.dbHost }}
             </div>
           </n-form-item>
 
           <n-form-item label="端口号" show-require-mark :feedback-style="{ fontSize: '13px' }">
             <div class="rounded-theme flex h-[32px] w-full items-center bg-[#FAFAFA] px-[14px]">
-              {{ databaseFormData.databasePort }}
+              {{ databaseFormData.dbPort }}
             </div>
           </n-form-item>
 
           <n-form-item label="数据库名称" show-require-mark :feedback-style="{ fontSize: '13px' }">
             <div class="rounded-theme flex h-[32px] w-full items-center bg-[#FAFAFA] px-[14px]">
-              {{ databaseFormData.databaseName }}
+              {{ databaseFormData.dbName }}
             </div>
           </n-form-item>
 
           <n-form-item label="用户名" show-require-mark :feedback-style="{ fontSize: '13px' }">
             <div class="rounded-theme flex h-[32px] w-full items-center bg-[#FAFAFA] px-[14px]">
-              {{ databaseFormData.databaseUserName }}
+              {{ databaseFormData.dbUserName }}
             </div>
           </n-form-item>
 
-          <n-form-item label="密码" path="databasePassword" :feedback-style="{ fontSize: '13px' }">
+          <n-form-item label="密码" path="dbPassword" :feedback-style="{ fontSize: '13px' }">
             <n-input
-              v-model:value="databaseFormData.databasePassword"
+              v-model:value="databaseFormData.dbPassword"
               type="password"
               show-password-on="click"
               placeholder="请输入密码"

src/views/personal-space/personal-database/personal-database.vue

@@ -20,14 +20,14 @@ const showEditDatabaseModal = ref(false)
 const databaseList = ref<DatabaseItemInterface[]>([
   {
     id: 1,
-    databaseName: '数据库1',
-    databaseDesc: '描述1',
+    title: '数据库1',
+    desc: '描述1',
     updateTime: new Date(),
   },
   {
     id: 2,
-    databaseName: '数据库2',
-    databaseDesc: '描述2',
+    title: '数据库2',
+    desc: '描述2',
     updateTime: new Date(),
   },
 ])

src/views/personal-space/personal-database/type.d.ts

 export interface DatabaseItemInterface {
   id: number
-  databaseName: string
-  databaseDesc: string
+  title: string
+  desc: string
   updateTime: Date
 }