新增：连接管理、数据查询等功能

web/src/App.vue

@@ -4,12 +4,19 @@
       <div class="header-content">
         <h2>Go Desk</h2>
         <a-tabs v-model:active-key="activeTab" class="header-tabs">
-          <a-tab-pane key="user" title="用户查询" />
-          <a-tab-pane key="device" title="设备调用测试" />
+          <a-tab-pane key="db-cli" title="数据库客户端"/>
+          <a-tab-pane key="user" title="用户查询"/>
+          <a-tab-pane key="device" title="设备调用测试"/>
         </a-tabs>
+        <div class="header-actions">
+          <ThemeToggle />
+        </div>
       </div>
     </a-layout-header>
     <a-layout-content class="content">
+      <!-- 数据库客户端 -->
+      <DbCli v-if="activeTab === 'db-cli'"/>
+
       <!-- 用户查询页面 -->
       <div v-if="activeTab === 'user'">
         <!-- 查询表单 -->
@@ -17,17 +24,17 @@
           <a-form :model="formModel" layout="inline">
             <a-form-item label="关键字">
               <a-input
-                v-model="formModel.keyword"
-                placeholder="姓名、账号、电话"
-                allow-clear
-                style="width: 200px"
+                  v-model="formModel.keyword"
+                  placeholder="姓名、账号、电话"
+                  allow-clear
+                  style="width: 200px"
               />
             </a-form-item>
             <a-form-item label="状态">
               <a-select
-                v-model="formModel.status"
-                placeholder="选择状态"
-                style="width: 120px"
+                  v-model="formModel.status"
+                  placeholder="选择状态"
+                  style="width: 120px"
               >
                 <a-option :value="0">全部</a-option>
                 <a-option :value="1">正常</a-option>
@@ -39,13 +46,13 @@
               <a-space>
                 <a-button type="primary" @click="handleSearch">
                   <template #icon>
-                    <icon-search />
+                    <icon-search/>
                   </template>
                   查询
                 </a-button>
                 <a-button @click="handleReset">
                   <template #icon>
-                    <icon-refresh />
+                    <icon-refresh/>
                   </template>
                   重置
                 </a-button>
@@ -57,12 +64,12 @@
         <!-- 数据表格 -->
         <a-card class="table-card">
           <a-table
-            :columns="columns"
-            :data="tableData"
-            :loading="loading"
-            :pagination="pagination"
-            @page-change="handlePageChange"
-            @page-size-change="handlePageSizeChange"
+              :columns="columns"
+              :data="tableData"
+              :loading="loading"
+              :pagination="pagination"
+              @page-change="handlePageChange"
+              @page-size-change="handlePageSizeChange"
           >
             <template #status="{ record }">
               <a-tag v-if="record.status === 1" color="green">正常</a-tag>
@@ -74,17 +81,19 @@
       </div>
 
       <!-- 设备调用测试页面 -->
-      <DeviceTest v-if="activeTab === 'device'" />
+      <DeviceTest v-if="activeTab === 'device'"/>
     </a-layout-content>
   </a-layout>
 </template>
 
 <script setup>
-import { ref, onMounted } from 'vue'
-import { Message } from '@arco-design/web-vue'
+import {onMounted, ref} from 'vue'
+import {Message} from '@arco-design/web-vue'
 import DeviceTest from './components/DeviceTest.vue'
+import DbCli from './views/db-cli/index.vue'
+import ThemeToggle from './components/ThemeToggle.vue'
 
-const activeTab = ref('user')
+const activeTab = ref('db-cli')
 const loading = ref(false)
 const formModel = ref({
   keyword: '',
@@ -102,14 +111,14 @@ const pagination = ref({
 })
 
 const columns = [
-  { title: '编号', dataIndex: 'memberid', width: 80 },
-  { title: '姓名', dataIndex: 'membername', width: 120 },
-  { title: '账号', dataIndex: 'account', width: 150 },
-  { title: '联系电话', dataIndex: 'contactphone', width: 130 },
-  { title: '机构ID', dataIndex: 'organid', width: 100 },
-  { title: '状态', dataIndex: 'status', slotName: 'status', width: 80 },
-  { title: '创建时间', dataIndex: 'createtime', width: 180 },
-  { title: '修改时间', dataIndex: 'updatetime', width: 180 }
+  {title: '编号', dataIndex: 'memberid', width: 80},
+  {title: '姓名', dataIndex: 'membername', width: 120},
+  {title: '账号', dataIndex: 'account', width: 150},
+  {title: '联系电话', dataIndex: 'contactphone', width: 130},
+  {title: '机构ID', dataIndex: 'organid', width: 100},
+  {title: '状态', dataIndex: 'status', slotName: 'status', width: 80},
+  {title: '创建时间', dataIndex: 'createtime', width: 180},
+  {title: '修改时间', dataIndex: 'updatetime', width: 180}
 ]
 
 const loadData = async () => {
@@ -122,14 +131,14 @@ const loadData = async () => {
   loading.value = true
   try {
     const result = await window.go.main.App.QueryUsers(
-      formModel.value.keyword || '',
-      formModel.value.status || 0,
-      formModel.value.role || 0,
-      formModel.value.organid || 0,
-      pagination.value.current,
-      pagination.value.pageSize,
-      'createtime',
-      'descend'
+        formModel.value.keyword || '',
+        formModel.value.status || 0,
+        formModel.value.role || 0,
+        formModel.value.organid || 0,
+        pagination.value.current,
+        pagination.value.pageSize,
+        'createtime',
+        'descend'
     )
 
     if (result && result.rows) {
@@ -200,6 +209,7 @@ onMounted(() => {
   margin: 0;
   font-size: 18px;
   font-weight: 500;
+  color: var(--color-text-1);
 }
 
 .header-tabs {
@@ -207,6 +217,12 @@ onMounted(() => {
   margin-left: 40px;
 }
 
+.header-actions {
+  display: flex;
+  align-items: center;
+  margin-left: 20px;
+}
+
 .content {
   padding: 20px;
   flex: 1;