diff --git a/src/api/tenant/tenant.js b/src/api/tenant/tenant.js
index 331f82e..dd77ebd 100644
--- a/src/api/tenant/tenant.js
+++ b/src/api/tenant/tenant.js
@@ -58,3 +58,62 @@ export function refreshCache() {
     method: "delete",
   });
 }
+
+// 租户模式设置
+export function tenantSetting(params) {
+  return request({
+    url: "/tenant/setting",
+    method: "put",
+    params,
+  });
+}
+
+/**
+ * 获取数据源列表
+ * @return {*}
+ */
+export function datasourceList(tenantId) {
+  return request({
+    url: "/tenant/datasource/list",
+    method: "GET",
+    params: { tenantId },
+  });
+}
+
+/**
+ * 添加数据源
+ * @param data
+ * @return {*}
+ */
+export function insertDatasource(data) {
+  return request({
+    url: "/tenant/datasource",
+    method: "POST",
+    data,
+  });
+}
+
+/**
+ * 修改数据源
+ * @param data
+ * @return {*}
+ */
+export function updateDatasource(data) {
+  return request({
+    url: "/tenant/datasource",
+    method: "PUT",
+    data,
+  });
+}
+
+/**
+ * 删除数据源
+ * @param ids
+ * @return {*}
+ */
+export function deleteDatasource(ids) {
+  return request({
+    url: `/tenant/datasource/${ids}`,
+    method: "DELETE",
+  });
+}
diff --git a/src/components/ImageUpload/index.vue b/src/components/ImageUpload/index.vue
index 8bb1a83..a46e486 100644
--- a/src/components/ImageUpload/index.vue
+++ b/src/components/ImageUpload/index.vue
@@ -32,6 +32,7 @@
     </div>
 
     <el-dialog
+      draggable
       v-model="dialogVisible"
       title="预览"
       width="800px"
diff --git a/src/components/RightToolbar/index.vue b/src/components/RightToolbar/index.vue
index 74b8724..87f1162 100644
--- a/src/components/RightToolbar/index.vue
+++ b/src/components/RightToolbar/index.vue
@@ -23,7 +23,7 @@
         <el-button circle icon="Menu" @click="showColumn()" />
       </el-tooltip>
     </el-row>
-    <el-dialog :title="title" v-model="open" append-to-body>
+    <el-dialog draggable :title="title" v-model="open" append-to-body>
       <el-transfer
         :titles="['显示', '隐藏']"
         v-model="value"
diff --git a/src/constant/dict.js b/src/constant/dict.js
index 7590c43..a4bc359 100644
--- a/src/constant/dict.js
+++ b/src/constant/dict.js
@@ -73,3 +73,43 @@ export const database_type_dict = [
     elTagType: "",
   },
 ];
+
+export const tenantModeDict = [
+  {
+    label: "字段",
+    value: "1",
+    elTagType: "primary",
+  },
+  {
+    label: "数据库",
+    value: "2",
+    elTagType: "warning",
+  },
+  {
+    label: "数据源",
+    value: "3",
+    elTagType: "success",
+  },
+];
+export const tenantStatusDict = [
+  {
+    label: "正常",
+    value: "1",
+    elTagType: "success",
+  },
+  {
+    label: "过期",
+    value: "2",
+    elTagType: "warning",
+  },
+  {
+    label: "异常",
+    value: "3",
+    elTagType: "danger",
+  },
+  {
+    label: "禁用",
+    value: "0",
+    elTagType: "warning",
+  },
+];
diff --git a/src/views/system/config/index.vue b/src/views/system/config/index.vue
index 6f085fc..b3c4511 100644
--- a/src/views/system/config/index.vue
+++ b/src/views/system/config/index.vue
@@ -197,7 +197,13 @@
     />
 
     <!-- 添加或修改参数配置对话框 -->
-    <el-dialog v-model="open" :title="title" append-to-body width="500px">
+    <el-dialog
+      draggable
+      v-model="open"
+      :title="title"
+      append-to-body
+      width="500px"
+    >
       <el-form ref="configRef" :model="form" :rules="rules" label-width="80px">
         <el-form-item label="参数名称" prop="configName">
           <el-input v-model="form.configName" placeholder="请输入参数名称" />
diff --git a/src/views/system/dept/index.vue b/src/views/system/dept/index.vue
index 5123f41..d971156 100644
--- a/src/views/system/dept/index.vue
+++ b/src/views/system/dept/index.vue
@@ -134,7 +134,13 @@
     </el-table>
 
     <!-- 添加或修改部门对话框 -->
-    <el-dialog v-model="open" :title="title" append-to-body width="600px">
+    <el-dialog
+      draggable
+      v-model="open"
+      :title="title"
+      append-to-body
+      width="600px"
+    >
       <el-form ref="deptRef" :model="form" :rules="rules" label-width="80px">
         <el-row>
           <el-col v-if="form.parentId !== '0'" :span="24">
diff --git a/src/views/system/dict/data.vue b/src/views/system/dict/data.vue
index 924c362..3eeb698 100644
--- a/src/views/system/dict/data.vue
+++ b/src/views/system/dict/data.vue
@@ -171,7 +171,13 @@
     />
 
     <!-- 添加或修改参数配置对话框 -->
-    <el-dialog :title="title" v-model="open" width="500px" append-to-body>
+    <el-dialog
+      draggable
+      :title="title"
+      v-model="open"
+      width="500px"
+      append-to-body
+    >
       <el-form ref="dataRef" :model="form" :rules="rules" label-width="80px">
         <el-form-item label="字典类型">
           <el-input v-model="form.dictType" :disabled="true" />
diff --git a/src/views/system/dict/index.vue b/src/views/system/dict/index.vue
index 72e5978..103dc7c 100644
--- a/src/views/system/dict/index.vue
+++ b/src/views/system/dict/index.vue
@@ -191,7 +191,13 @@
     />
 
     <!-- 添加或修改参数配置对话框 -->
-    <el-dialog :title="title" v-model="open" width="500px" append-to-body>
+    <el-dialog
+      draggable
+      :title="title"
+      v-model="open"
+      width="500px"
+      append-to-body
+    >
       <el-form ref="dictRef" :model="form" :rules="rules" label-width="80px">
         <el-form-item label="字典名称" prop="dictName">
           <el-input v-model="form.dictName" placeholder="请输入字典名称" />
diff --git a/src/views/system/menu/index.vue b/src/views/system/menu/index.vue
index dad057b..991b6e3 100644
--- a/src/views/system/menu/index.vue
+++ b/src/views/system/menu/index.vue
@@ -154,7 +154,13 @@
     </el-table>
 
     <!-- 添加或修改菜单对话框 -->
-    <el-dialog v-model="open" :title="title" append-to-body width="680px">
+    <el-dialog
+      draggable
+      v-model="open"
+      :title="title"
+      append-to-body
+      width="680px"
+    >
       <el-form ref="menuRef" :model="form" :rules="rules" label-width="100px">
         <el-row>
           <el-col :span="24">
diff --git a/src/views/system/post/index.vue b/src/views/system/post/index.vue
index 5dd6d1d..14aea9c 100644
--- a/src/views/system/post/index.vue
+++ b/src/views/system/post/index.vue
@@ -157,7 +157,13 @@
     />
 
     <!-- 添加或修改岗位对话框 -->
-    <el-dialog :title="title" v-model="open" width="500px" append-to-body>
+    <el-dialog
+      draggable
+      :title="title"
+      v-model="open"
+      width="500px"
+      append-to-body
+    >
       <el-form ref="postRef" :model="form" :rules="rules" label-width="80px">
         <el-form-item label="岗位名称" prop="postName">
           <el-input
diff --git a/src/views/system/role/index.vue b/src/views/system/role/index.vue
index bce48d0..49b0855 100644
--- a/src/views/system/role/index.vue
+++ b/src/views/system/role/index.vue
@@ -235,7 +235,13 @@
     />
 
     <!-- 添加或修改角色配置对话框 -->
-    <el-dialog :title="title" v-model="open" width="500px" append-to-body>
+    <el-dialog
+      draggable
+      :title="title"
+      v-model="open"
+      width="500px"
+      append-to-body
+    >
       <el-form ref="roleRef" :model="form" :rules="rules" label-width="100px">
         <el-form-item label="角色名称" prop="roleName">
           <el-input v-model="form.roleName" placeholder="请输入角色名称" />
@@ -316,6 +322,7 @@
 
     <!-- 分配角色数据权限对话框 -->
     <el-dialog
+      draggable
       :title="title"
       v-model="openDataScope"
       width="500px"
diff --git a/src/views/system/role/selectUser.vue b/src/views/system/role/selectUser.vue
index 4098d94..1467374 100644
--- a/src/views/system/role/selectUser.vue
+++ b/src/views/system/role/selectUser.vue
@@ -1,6 +1,7 @@
 <template>
   <!-- 授权用户 -->
   <el-dialog
+    draggable
     @open="resetQuery"
     title="选择用户"
     v-model="visible"
diff --git a/src/views/system/user/index.vue b/src/views/system/user/index.vue
index 8cf8411..f1daf48 100644
--- a/src/views/system/user/index.vue
+++ b/src/views/system/user/index.vue
@@ -290,7 +290,13 @@
     </el-row>
 
     <!-- 添加或修改用户配置对话框 -->
-    <el-dialog v-model="open" :title="title" append-to-body width="600px">
+    <el-dialog
+      draggable
+      v-model="open"
+      :title="title"
+      append-to-body
+      width="600px"
+    >
       <el-form ref="userRef" :model="form" :rules="rules" label-width="80px">
         <el-row>
           <el-col :span="12">
@@ -441,6 +447,7 @@
 
     <!-- 用户导入对话框 -->
     <el-dialog
+      draggable
       v-model="upload.open"
       :title="upload.title"
       append-to-body
diff --git a/src/views/system/user/profile/userAvatar.vue b/src/views/system/user/profile/userAvatar.vue
index 6e438ed..c80177d 100644
--- a/src/views/system/user/profile/userAvatar.vue
+++ b/src/views/system/user/profile/userAvatar.vue
@@ -2,6 +2,7 @@
   <div class="user-info-head" @click="editCropper()">
     <img :src="options.img" title="点击上传头像" class="img-circle img-lg" />
     <el-dialog
+      draggable
       :title="title"
       v-model="open"
       width="800px"
diff --git a/src/views/tenant/index.vue b/src/views/tenant/index.vue
index 0561a10..8bd8b26 100644
--- a/src/views/tenant/index.vue
+++ b/src/views/tenant/index.vue
@@ -84,6 +84,16 @@
           >刷新缓存
         </el-button>
       </el-col>
+      <el-col :span="1.5">
+        <el-button
+          :disabled="single"
+          icon="Refresh"
+          plain
+          type="primary"
+          @click="handleInitialize"
+          >初始化
+        </el-button>
+      </el-col>
       <right-toolbar
         v-model:showSearch="showSearch"
         @queryTable="getList"
@@ -96,11 +106,9 @@
       @selection-change="handleSelectionChange"
     >
       <el-table-column align="center" type="selection" width="55" />
-      <el-table-column align="center" label="编码" prop="tenantId" />
       <el-table-column align="center" label="公司名称" prop="companyName" />
       <el-table-column align="center" label="联系人名称" prop="contactName" />
       <el-table-column align="center" label="联系人电话" prop="contactPhone" />
-      <el-table-column align="center" label="公司地址" prop="address" />
       <el-table-column
         align="center"
         label="过期时间"
@@ -112,26 +120,60 @@
         </template>
       </el-table-column>
       <el-table-column align="center" label="用户数量" prop="accountCount" />
-      <el-table-column align="center" label="状态" prop="status" />
+      <el-table-column align="center" label="状态">
+        <template #default="{ row }">
+          <dict-tag :options="tenantStatusDict" :value="row.status" />
+        </template>
+      </el-table-column>
+      <el-table-column align="center" label="初始化状态">
+        <template #default="{ row }">
+          <el-tag :type="row.initialized === '1' ? 'success' : 'warning'"
+            >{{ row.initialized === "1" ? "是" : "否" }}
+          </el-tag>
+        </template>
+      </el-table-column>
+      <el-table-column align="center" label="模式">
+        <template #default="{ row }">
+          <dict-tag :options="tenantModeDict" :value="row.mode" />
+        </template>
+      </el-table-column>
       <el-table-column
         align="center"
         class-name="small-padding fixed-width"
         label="操作"
+        width="290"
       >
-        <template #default="scope">
+        <template #default="{ row }">
+          <el-tooltip
+            :disabled="row.initialized !== '1'"
+            class="box-item"
+            content="初始化之后不可再更改"
+            effect="light"
+            placement="top"
+          >
+            <el-button
+              :disabled="row.initialized === '1'"
+              icon="Setting"
+              link
+              type="primary"
+              @click="handleSetting(row)"
+              >模式
+            </el-button>
+          </el-tooltip>
           <el-button
-            icon="Setting"
+            v-if="row.mode === '3'"
+            icon="plus"
             link
             type="primary"
-            @click="handleSetting(scope.row)"
-            >设置
+            @click="handleOpenDataSource(row.tenantId)"
+            >数据源
           </el-button>
           <el-button
             v-hasPermi="['tenant:edit']"
             icon="Edit"
             link
             type="primary"
-            @click="handleUpdate(scope.row)"
+            @click="handleUpdate(row)"
             >修改
           </el-button>
           <el-button
@@ -139,7 +181,7 @@
             icon="Delete"
             link
             type="primary"
-            @click="handleDelete(scope.row)"
+            @click="handleDelete(row)"
             >删除
           </el-button>
         </template>
@@ -155,7 +197,13 @@
     />
 
     <!-- 添加或修改租户对话框 -->
-    <el-dialog v-model="open" :title="title" append-to-body width="500px">
+    <el-dialog
+      v-model="open"
+      :title="title"
+      append-to-body
+      draggable
+      width="500px"
+    >
       <el-form ref="tenantRef" :model="form" :rules="rules" label-width="130px">
         <el-form-item label="公司名称" prop="companyName">
           <el-input v-model="form.companyName" placeholder="请输入公司名称" />
@@ -214,111 +262,206 @@
       </template>
     </el-dialog>
 
-    <!-- 添加或修改租户对话框 -->
+    <!-- 修改租户模式 -->
     <el-dialog
       v-model="showTenantSetting"
       append-to-body
-      title="租户设置"
+      draggable
+      title="模式设置"
       width="500px"
     >
       <el-form
         ref="tenantSettingRef"
         :model="tenantSettingForm"
         :rules="tenantSettingRules"
-        label-width="130px"
+        label-width="0"
       >
-        <!--TODO:-->
-        <el-form-item label="模式">
+        <el-form-item class="mode-setting-radio">
           <el-radio-group v-model="tenantSettingForm.mode">
-            <el-radio label="1">字段</el-radio>
-            <el-radio label="2">数据库</el-radio>
-            <el-radio label="3">数据源</el-radio>
+            <el-radio
+              v-for="option in tenantModeDict"
+              :key="option.value"
+              :label="option.value"
+              >{{ option.label }}
+            </el-radio>
           </el-radio-group>
         </el-form-item>
-        <template v-if="tenantSettingForm.mode === '3'">
-          <div
-            v-for="item in tenantSettingForm.datasourceList"
-            :key="`${item.ip}-${item.port}-${item.name}`"
-            class="data-source-item"
-          >
-            <div class="left">
-              <div class="database-type">{{ "MySQL" }}</div>
-              <div class="database-url">{{ "127.0.0.1" }} : {{ 3306 }}</div>
-              <div class="database-name">{{ "ry-vue" }}</div>
-            </div>
-            <div class="right">
-              <el-button
-                circle
-                icon="edit"
-                plain
-                size="small"
-                type="primary"
-              ></el-button>
-              <el-button
-                circle
-                icon="delete"
-                plain
-                size="small"
-                type="danger"
-              ></el-button>
-            </div>
-          </div>
-          <el-button
-            icon="plus"
-            plain
-            size="small"
-            style="margin-top: 18px"
-            type="primary"
-            >新增数据源</el-button
-          >
-          <!--          <el-form-item label="数据库类型" prop="type">-->
-          <!--            <el-select v-model="tenantSettingForm.host">-->
-          <!--              <el-option v-for="option in database_type_dict" :key="option.value" :label="option.label"-->
-          <!--                         :value="option.value"/>-->
-          <!--            </el-select>-->
-          <!--          </el-form-item>-->
-          <!--          <el-form-item label="数据库IP" prop="ip">-->
-          <!--            <el-input v-model="tenantSettingForm.ip"/>-->
-          <!--          </el-form-item>-->
-          <!--          <el-form-item label="数据库端口" prop="port">-->
-          <!--            <el-input v-model="tenantSettingForm.port"/>-->
-          <!--          </el-form-item>-->
-          <!--          <el-form-item label="数据库名称" prop="name">-->
-          <!--            <el-input v-model="tenantSettingForm.name"/>-->
-          <!--          </el-form-item>-->
-          <!--          <el-form-item label="数据库账号" prop="username">-->
-          <!--            <el-input v-model="tenantSettingForm.username"/>-->
-          <!--          </el-form-item>-->
-          <!--          <el-form-item label="数据库密码" prop="password">-->
-          <!--            <el-input v-model="tenantSettingForm.password"/>-->
-          <!--          </el-form-item>-->
-        </template>
       </el-form>
       <template #footer>
         <div class="dialog-footer">
           <el-button type="primary" @click="submitTenantSetting"
-            >确 定</el-button
-          >
+            >确 定
+          </el-button>
           <el-button @click="cancelSettingTenant">取 消</el-button>
         </div>
       </template>
     </el-dialog>
+
+    <!--查看数据源列表-->
+    <el-dialog
+      v-model="showDatasourceDialog"
+      append-to-body
+      draggable
+      title="数据源设置"
+      width="800px"
+    >
+      <!--添加或修改数据源-->
+      <el-form
+        v-if="isEditDatasource"
+        ref="datasourceFormRef"
+        :model="dataSourceForm"
+        :rules="dataSourceRules"
+        label-position="left"
+        label-width="100px"
+      >
+        <el-form-item label="数据库类型" prop="type">
+          <el-select v-model="dataSourceForm.type">
+            <el-option
+              v-for="option in database_type_dict"
+              :key="option.value"
+              :label="option.label"
+              :value="option.value"
+            />
+          </el-select>
+        </el-form-item>
+        <el-form-item label="数据库IP" prop="ip">
+          <el-input v-model="dataSourceForm.ip" />
+        </el-form-item>
+        <el-form-item label="数据库端口" prop="port">
+          <el-input-number
+            v-model="dataSourceForm.port"
+            :max="65535"
+            :min="1"
+          />
+        </el-form-item>
+        <el-form-item label="数据库名称" prop="name">
+          <el-input v-model="dataSourceForm.name" />
+        </el-form-item>
+        <el-form-item label="数据库账号" prop="username">
+          <el-input v-model="dataSourceForm.username" />
+        </el-form-item>
+        <el-form-item label="数据库密码" prop="password">
+          <el-input v-model="dataSourceForm.password" />
+        </el-form-item>
+        <el-form-item label="状态" prop="isUse">
+          <el-switch
+            v-model="dataSourceForm.isUse"
+            active-value="1"
+            inactive-value="0"
+          />
+        </el-form-item>
+      </el-form>
+      <template v-else>
+        <el-row justify="end">
+          <el-col :span="1.5">
+            <el-button
+              icon="plus"
+              plain
+              type="primary"
+              @click="handleAddDataSource"
+              >新增
+            </el-button>
+          </el-col>
+        </el-row>
+
+        <el-table :data="datasource" style="margin-top: 12px">
+          <el-table-column
+            align="center"
+            label="类型"
+            prop="type"
+          ></el-table-column>
+          <el-table-column
+            align="center"
+            label="IP"
+            prop="ip"
+          ></el-table-column>
+          <el-table-column
+            align="center"
+            label="端口"
+            prop="port"
+          ></el-table-column>
+          <el-table-column
+            align="center"
+            label="名称"
+            prop="name"
+          ></el-table-column>
+          <el-table-column
+            align="center"
+            label="账号"
+            prop="username"
+          ></el-table-column>
+          <el-table-column
+            align="center"
+            label="密码"
+            prop="password"
+          ></el-table-column>
+          <el-table-column align="center" label="操作" width="140">
+            <template #default="{ row }">
+              <el-button
+                icon="edit"
+                link
+                size="small"
+                type="warning"
+                @click="handleUpdateDataSource(row)"
+                >修改
+              </el-button>
+              <el-button
+                icon="delete"
+                link
+                size="small"
+                type="danger"
+                @click="handleDeleteDataSource(row)"
+                >删除
+              </el-button>
+            </template>
+          </el-table-column>
+        </el-table>
+      </template>
+
+      <template #footer>
+        <div class="dialog-footer">
+          <template v-if="isEditDatasource">
+            <el-button type="primary" @click="submitDatasource"
+              >确 定
+            </el-button>
+            <el-button @click="isEditDatasource = false">取 消</el-button>
+          </template>
+          <el-button v-else type="primary" @click="handleCloseDatasource"
+            >关闭
+          </el-button>
+        </div>
+      </template>
+    </el-dialog>
   </div>
 </template>
 
-<script name="Tenant" setup>
+<script lang="jsx" name="Tenant" setup>
 import {
   addTenant,
+  datasourceList,
+  deleteDatasource,
   delTenant,
-  getSetting,
   getTenant,
+  insertDatasource,
   listTenant,
-  updateTenant,
   refreshCache,
+  tenantSetting,
+  updateDatasource,
+  updateTenant,
 } from "@/api/tenant/tenant";
+import { getCurrentInstance, reactive, ref, toRefs } from "vue";
+import { ElMessage, ElMessageBox } from "element-plus";
+import {
+  database_type_dict,
+  tenantModeDict,
+  tenantStatusDict,
+} from "@/constant/dict";
+import DictTag from "@/components/DictTag/index.vue";
+import { cloneDeep } from "lodash-es";
 
 const { proxy } = getCurrentInstance();
 
+const router = useRouter();
 const tenantList = ref([]);
 const open = ref(false);
 const loading = ref(true);
@@ -328,9 +471,12 @@ const single = ref(true);
 const multiple = ref(true);
 const total = ref(0);
 const title = ref("");
-const showTenantSetting = ref(false); /*是否显示租户设置对话框*/
 const tenantSettingRef = ref();
-const editDatasourceIndex = ref(-1);
+const datasourceFormRef = ref();
+const showTenantSetting = ref(false); /*是否显示租户设置对话框*/
+const showDatasourceDialog = ref(false); /*显示数据源列表dialog*/
+const tempTenantId = ref(null); /*临时的租户id状态, 用于在新添加的数据源中提交*/
+const isEditDatasource = ref(false); /*是否处于添加或修改状态*/
 const data = reactive({
   form: {},
   queryParams: {
@@ -354,27 +500,67 @@ const data = reactive({
       { required: true, message: "公司名称不能为空", trigger: "blur" },
     ],
   },
-  tenantSettingForm: {
-    // TODO:
-    // dataSource: [
-    //   {
-    //     type: "MySQL",
-    //     ip: "127.0.0.1",
-    //     port: "",
-    //     name: "",
-    //     username: "",
-    //     password: ""
-    //   }
-    // ],
-    // mode: '3'
+  tenantSettingForm: {},
+  dataSourceForm: {} /*数据源项目*/,
+  dataSourceRules: {
+    type: [
+      {
+        required: true,
+        message: "请选择数据库类型",
+        trigger: "blur",
+      },
+    ],
+    ip: [
+      {
+        required: true,
+        message: "请输入ip",
+        trigger: "blur",
+      },
+    ],
+    port: [
+      {
+        required: true,
+        message: "请输入端口",
+        trigger: "blur",
+      },
+    ],
+    name: [
+      {
+        required: true,
+        message: "请输入数据库名称",
+        trigger: "blur",
+      },
+    ],
+    username: [
+      {
+        required: true,
+        message: "请输入账号",
+        trigger: "blur",
+      },
+    ],
+    password: [
+      {
+        required: true,
+        message: "请输入密码",
+        trigger: "blur",
+      },
+    ],
   },
   tenantSettingRules: {
     /*TODO:*/
   },
 });
 
-const { queryParams, form, rules, tenantSettingForm, tenantSettingRules } =
-  toRefs(data);
+const {
+  queryParams,
+  form,
+  rules,
+  tenantSettingForm,
+  tenantSettingRules,
+  dataSourceRules,
+  dataSourceForm,
+} = toRefs(data);
+const datasource = ref([]);
 
 /** 查询租户列表 */
 function getList() {
@@ -427,22 +613,84 @@ function reset() {
  * 重置租户设置表单
  */
 const resetSettingTenant = () => {
-  form.value = {
-    /*TODO:*/
-    datasourceList: [
-      {
-        type: null,
-        ip: null,
-        port: null,
-        name: null,
-        username: null,
-        password: null,
-      },
-    ],
-  };
+  tenantSettingForm.value = {};
   tenantSettingRef.value?.resetFields();
 };
 
+/**
+ * 查看数据源
+ */
+const handleOpenDataSource = async (tenantId) => {
+  isEditDatasource.value = false;
+  tempTenantId.value = tenantId;
+  const resp = await datasourceList(tenantId);
+  datasource.value = resp.data;
+  showDatasourceDialog.value = true;
+};
+
+const handleCloseDatasource = () => {
+  isEditDatasource.value = false;
+  tempTenantId.value = null;
+  datasource.value = [];
+  showDatasourceDialog.value = false;
+};
+const resetDataSource = () => {
+  dataSourceForm.value = {};
+  datasourceFormRef.value?.resetFields();
+};
+/**
+ * 添加数据源
+ */
+const handleAddDataSource = () => {
+  resetDataSource();
+  dataSourceForm.value.tenantId = tempTenantId.value;
+  isEditDatasource.value = true;
+};
+
+/**
+ * 删除数据源
+ * @param row
+ */
+const handleDeleteDataSource = (row) => {
+  ElMessageBox.confirm(`确认删除此数据源: ${row.ip}`, "删除数据源", {}).then(
+    async () => {
+      await deleteDatasource(row);
+      ElMessage.success("已删除数据源");
+      const resp = await datasourceList(tempTenantId.value);
+      datasource.value = resp.data;
+    }
+  );
+};
+
+/**
+ * 修噶数据源
+ * @param row
+ */
+const handleUpdateDataSource = (row) => {
+  resetDataSource();
+  dataSourceForm.value = cloneDeep(row);
+  try {
+    dataSourceForm.value.port = parseInt(dataSourceForm.value.port);
+  } catch (e) {
+    console.log(e);
+  }
+  isEditDatasource.value = true;
+};
+const submitDatasource = async () => {
+  await datasourceFormRef.value.validate();
+  if (dataSourceForm.value.id) {
+    /*TODO 修改数据源*/
+    await updateDatasource(dataSourceForm.value);
+    ElMessage.success("修改数据源成功");
+  } else {
+    await insertDatasource(dataSourceForm.value);
+    ElMessage.success("添加数据源成功");
+  }
+  isEditDatasource.value = false;
+  const resp = await datasourceList(tempTenantId.value);
+  datasource.value = resp.data;
+};
+
 /** 搜索按钮操作 */
 function handleQuery() {
   queryParams.value.pageNum = 1;
@@ -481,16 +729,16 @@ function handleUpdate(row) {
 }
 
 /**
- * 打开租户设置
+ * 打开模式设置
  * @param row
  */
 const handleSetting = (row) => {
-  // editDatasourceIndex.value = 0
-  resetSettingTenant();
-  getSetting(row.tenantId).then((resp) => {
-    tenantSettingForm.value = resp.data;
-    showTenantSetting.value = true;
-  });
+  tenantSettingForm.value = {
+    tenantId: row.tenantId,
+    mode: row.mode,
+    oriMode: row.mode /*旧mode*/,
+  };
+  showTenantSetting.value = true;
 };
 
 /** 提交按钮 */
@@ -517,8 +765,23 @@ function submitForm() {
 /**
  * 提交租户设置
  */
-const submitTenantSetting = () => {
-  /*TODO:*/
+const submitTenantSetting = async () => {
+  const ori = tenantSettingForm.value.oriMode;
+  const cur = tenantSettingForm.value.mode;
+  const warningText = () => (
+    <span style="color:red">
+      切换到其他模式会清除已有的数据源配置, 是否继续?
+    </span>
+  );
+  if (ori === "3" && (cur === "1" || cur === "2")) {
+    await ElMessageBox.confirm(warningText, {
+      type: "warning",
+    });
+  }
+  await tenantSettingRef.value.validate();
+  await tenantSetting(tenantSettingForm.value);
+  getList();
+  ElMessage.success("模式设置成功");
   showTenantSetting.value = false;
 };
 
@@ -555,6 +818,19 @@ function handleRefreshCache() {
   });
 }
 
+/**
+ * 前往初始化页面
+ */
+const handleInitialize = () => {
+  const tenantId = ids.value;
+  router.push({
+    path: "/tenant/initialize",
+    query: {
+      id: tenantId,
+    },
+  });
+};
+
 getList();
 </script>
 <style lang="scss" scoped>
@@ -568,6 +844,10 @@ getList();
   justify-content: space-between;
   padding: 0 20px 0 20px;
 
+  &:not(:first-child) {
+    margin-top: 12px;
+  }
+
   .left {
     display: flex;
     align-items: center;
@@ -576,7 +856,14 @@ getList();
       font-size: 15px;
     }
 
-    .database-url {
+    .database-host {
+      width: 100px;
+      margin-left: 12px;
+      font-size: 13px;
+    }
+
+    .database-port {
+      width: 30px;
       margin-left: 12px;
       font-size: 13px;
     }
@@ -592,4 +879,9 @@ getList();
     align-items: center;
   }
 }
+
+:deep(.mode-setting-radio .el-form-item__content) {
+  display: flex;
+  justify-content: center;
+}
 </style>
diff --git a/src/views/tenant/initialize.vue b/src/views/tenant/initialize.vue
new file mode 100644
index 0000000..0f2fe38
--- /dev/null
+++ b/src/views/tenant/initialize.vue
@@ -0,0 +1,13 @@
+<template>
+  <div class="app-container">
+    <el-steps align-center>
+      <el-step description="步骤描述" title="步骤1" />
+      <el-step description="步骤描述" title="步骤2" />
+      <el-step description="步骤描述" title="步骤3" />
+      <el-step description="步骤描述" title="步骤4" />
+    </el-steps>
+  </div>
+</template>
+<script setup></script>
+
+<style lang="scss" scoped></style>