cxc/yg-point-mall
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

bug fix

Browse Source
This commit is contained in:
ailanyin
2023-06-30 17:15:25 +08:00
parent 680d6876ba
commit cf3fed6448
3 changed files with 388 additions and 375 deletions
Download Patch File Download Diff File Expand all files Collapse all files

14
src/constant/dict.js
View File

@ -113,3 +113,17 @@ export const tenantStatusDict = [
elTagType: "warning", elTagType: "warning",
}, },
]; ];
// 初始化状态
export const initStatusDict = [
{
label: "否",
value: "0",
elTagType: "warning",
},
{
label: "是",
value: "1",
elTagType: "success",
},
];

514
src/views/tenant/index.vue
View File

@ -1,31 +1,31 @@
<template> <template>
<div class="app-container"> <div class="app-container">
<el-form <el-form
v-show="showSearch" v-show="showSearch"
ref="queryRef" ref="queryRef"
:inline="true" :inline="true"
:model="queryParams" :model="queryParams"
label-width="68px" label-width="68px"
> >
<el-form-item label="公司名称" prop="companyName"> <el-form-item label="公司名称" prop="companyName">
<el-input <el-input
v-model="queryParams.companyName" v-model="queryParams.companyName"
clearable clearable
placeholder="请输入公司名称" placeholder="请输入公司名称"
@keyup.enter="handleQuery" @keyup.enter="handleQuery"
/> />
</el-form-item> </el-form-item>
<el-form-item label="联系人" prop="contactName"> <el-form-item label="联系人" prop="contactName">
<el-input <el-input
v-model="queryParams.contactName" v-model="queryParams.contactName"
clearable clearable
placeholder="请输入联系人名称" placeholder="请输入联系人名称"
@keyup.enter="handleQuery" @keyup.enter="handleQuery"
/> />
</el-form-item> </el-form-item>
<el-form-item> <el-form-item>
<el-button icon="Search" type="primary" @click="handleQuery" <el-button icon="Search" type="primary" @click="handleQuery"
>搜索 >搜索
</el-button> </el-button>
<el-button icon="Refresh" @click="resetQuery">重置</el-button> <el-button icon="Refresh" @click="resetQuery">重置</el-button>
</el-form-item> </el-form-item>
@ -34,223 +34,224 @@
<el-row :gutter="10" class="mb8"> <el-row :gutter="10" class="mb8">
<el-col :span="1.5"> <el-col :span="1.5">
<el-button <el-button
v-hasPermi="['tenant:add']" v-hasPermi="['tenant:add']"
icon="Plus" icon="Plus"
plain plain
type="primary" type="primary"
@click="handleAdd" @click="handleAdd"
>新增 >新增
</el-button> </el-button>
</el-col> </el-col>
<el-col :span="1.5"> <el-col :span="1.5">
<el-button <el-button
v-hasPermi="['tenant:edit']" v-hasPermi="['tenant:edit']"
:disabled="single" :disabled="single"
icon="Edit" icon="Edit"
plain plain
type="success" type="success"
@click="handleUpdate" @click="handleUpdate"
>修改 >修改
</el-button> </el-button>
</el-col> </el-col>
<el-col :span="1.5"> <el-col :span="1.5">
<el-button <el-button
v-hasPermi="['tenant:remove']" v-hasPermi="['tenant:remove']"
:disabled="multiple" :disabled="multiple"
icon="Delete" icon="Delete"
plain plain
type="danger" type="danger"
@click="handleDelete" @click="handleDelete"
>删除 >删除
</el-button> </el-button>
</el-col> </el-col>
<el-col :span="1.5"> <el-col :span="1.5">
<el-button <el-button
v-hasPermi="['tenant:export']" v-hasPermi="['tenant:export']"
icon="Download" icon="Download"
plain plain
type="warning" type="warning"
@click="handleExport" @click="handleExport"
>导出 >导出
</el-button> </el-button>
</el-col> </el-col>
<el-col :span="1.5"> <el-col :span="1.5">
<el-button <el-button
v-hasPermi="['tenant:remove']" v-hasPermi="['tenant:remove']"
icon="Refresh" icon="Refresh"
plain plain
type="danger" type="danger"
@click="handleRefreshCache" @click="handleRefreshCache"
>刷新缓存 >刷新缓存
</el-button> </el-button>
</el-col> </el-col>
<el-col :span="1.5"> <el-col :span="1.5">
<el-button <el-button
:disabled="single" :disabled="single || ids[0].initialized === '1'"
icon="Refresh" icon="Refresh"
plain plain
type="primary" type="primary"
@click="handleInitialize" @click="handleInitialize"
>初始化 >初始化
</el-button> </el-button>
</el-col> </el-col>
<right-toolbar <right-toolbar
v-model:showSearch="showSearch" v-model:showSearch="showSearch"
@queryTable="getList" @queryTable="getList"
></right-toolbar> ></right-toolbar>
</el-row> </el-row>
<el-table <el-table
v-loading="loading" v-loading="loading"
:data="tenantList" :data="tenantList"
@selection-change="handleSelectionChange" @selection-change="handleSelectionChange"
> >
<el-table-column align="center" type="selection" width="55"/> <el-table-column align="center" type="selection" width="55" />
<el-table-column align="center" label="公司名称" prop="companyName"/> <el-table-column align="center" label="公司名称" prop="companyName" />
<el-table-column align="center" label="联系人名称" prop="contactName"/> <el-table-column align="center" label="联系人名称" prop="contactName" />
<el-table-column align="center" label="联系人电话" prop="contactPhone"/> <el-table-column align="center" label="联系人电话" prop="contactPhone" />
<el-table-column <el-table-column
align="center" align="center"
label="过期时间" label="过期时间"
prop="expireTime" prop="expireTime"
width="180" width="180"
> >
<template #default="scope"> <template #default="scope">
<span>{{ parseTime(scope.row.expireTime, "{y}-{m}-{d}") }}</span> <span>{{ parseTime(scope.row.expireTime, "{y}-{m}-{d}") }}</span>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column align="center" label="用户数量" prop="accountCount"/> <el-table-column align="center" label="用户数量" prop="accountCount" />
<el-table-column align="center" label="状态"> <el-table-column align="center" label="状态">
<template #default="{ row }"> <template #default="{ row }">
<dict-tag :options="tenantStatusDict" :value="row.status"/> <dict-tag :options="tenantStatusDict" :value="row.status" />
</template> </template>
</el-table-column> </el-table-column>
<el-table-column align="center" label="初始化状态"> <el-table-column align="center" label="初始化状态">
<template #default="{ row }"> <template #default="{ row }">
<el-tag :type="row.initialized === '1' ? 'success' : 'warning'" <!-- <el-tag :type="row.initialized === '1' ? 'success' : 'warning'"-->
>{{ row.initialized === "1" ? "是" : "否" }} <!-- >{{ row.initialized === "1" ? "是" : "否" }}-->
</el-tag> <!-- </el-tag>-->
<dict-tag :options="initStatusDict" :value="row.initialized" />
</template> </template>
</el-table-column> </el-table-column>
<el-table-column align="center" label="模式"> <el-table-column align="center" label="模式">
<template #default="{ row }"> <template #default="{ row }">
<dict-tag :options="tenantModeDict" :value="row.mode"/> <dict-tag :options="tenantModeDict" :value="row.mode" />
</template> </template>
</el-table-column> </el-table-column>
<el-table-column <el-table-column
align="center" align="center"
class-name="small-padding fixed-width" class-name="small-padding fixed-width"
label="操作" label="操作"
width="290" width="290"
> >
<template #default="{ row }"> <template #default="{ row }">
<el-tooltip <el-tooltip
:disabled="row.initialized !== '1'" :disabled="row.initialized !== '1'"
class="box-item" class="box-item"
content="初始化之后不可再更改" content="初始化之后不可再更改"
effect="light" effect="light"
placement="top" placement="top"
> >
<el-button <el-button
:disabled="row.initialized === '1'" :disabled="row.initialized === '1'"
icon="Setting" icon="Setting"
link link
type="primary" type="primary"
@click="handleSetting(row)" @click="handleSetting(row)"
>模式 >模式
</el-button> </el-button>
</el-tooltip> </el-tooltip>
<el-button <el-button
v-if="row.mode === '3'" v-if="row.mode === '3'"
icon="plus" icon="plus"
link link
type="primary" type="primary"
@click="handleOpenDataSource(row.tenantId)" @click="handleOpenDataSource(row.tenantId)"
>数据源 >数据源
</el-button> </el-button>
<el-button <el-button
v-hasPermi="['tenant:edit']" v-hasPermi="['tenant:edit']"
icon="Edit" icon="Edit"
link link
type="primary" type="primary"
@click="handleUpdate(row)" @click="handleUpdate(row)"
>修改 >修改
</el-button> </el-button>
<el-button <el-button
v-hasPermi="['tenant:remove']" v-hasPermi="['tenant:remove']"
icon="Delete" icon="Delete"
link link
type="primary" type="primary"
@click="handleDelete(row)" @click="handleDelete(row)"
>删除 >删除
</el-button> </el-button>
</template> </template>
</el-table-column> </el-table-column>
</el-table> </el-table>
<pagination <pagination
v-show="total > 0" v-show="total > 0"
v-model:limit="queryParams.pageSize" v-model:limit="queryParams.pageSize"
v-model:page="queryParams.pageNum" v-model:page="queryParams.pageNum"
:total="total" :total="total"
@pagination="getList" @pagination="getList"
/> />
<!-- 添加或修改租户对话框 --> <!-- 添加或修改租户对话框 -->
<el-dialog <el-dialog
v-model="open" v-model="open"
:title="title" :title="title"
append-to-body append-to-body
draggable draggable
width="500px" width="500px"
> >
<el-form ref="tenantRef" :model="form" :rules="rules" label-width="130px"> <el-form ref="tenantRef" :model="form" :rules="rules" label-width="130px">
<el-form-item label="公司名称" prop="companyName"> <el-form-item label="公司名称" prop="companyName">
<el-input v-model="form.companyName" placeholder="请输入公司名称"/> <el-input v-model="form.companyName" placeholder="请输入公司名称" />
</el-form-item> </el-form-item>
<el-form-item label="联系人名称" prop="contactName"> <el-form-item label="联系人名称" prop="contactName">
<el-input v-model="form.contactName" placeholder="请输入联系人名称"/> <el-input v-model="form.contactName" placeholder="请输入联系人名称" />
</el-form-item> </el-form-item>
<el-form-item label="联系人电话" prop="contactPhone"> <el-form-item label="联系人电话" prop="contactPhone">
<el-input <el-input
v-model="form.contactPhone" v-model="form.contactPhone"
placeholder="请输入联系人电话" placeholder="请输入联系人电话"
/> />
</el-form-item> </el-form-item>
<el-form-item label="公司地址" prop="address"> <el-form-item label="公司地址" prop="address">
<el-input v-model="form.address" placeholder="请输入公司地址"/> <el-input v-model="form.address" placeholder="请输入公司地址" />
</el-form-item> </el-form-item>
<el-form-item label="公司简介" prop="profile"> <el-form-item label="公司简介" prop="profile">
<el-input <el-input
v-model="form.profile" v-model="form.profile"
placeholder="请输入内容" placeholder="请输入内容"
type="textarea" type="textarea"
/> />
</el-form-item> </el-form-item>
<el-form-item label="统一社会信用代码" prop="licenseNumber"> <el-form-item label="统一社会信用代码" prop="licenseNumber">
<el-input <el-input
v-model="form.licenseNumber" v-model="form.licenseNumber"
placeholder="请输入统一社会信用代码" placeholder="请输入统一社会信用代码"
/> />
</el-form-item> </el-form-item>
<el-form-item label="过期时间" prop="expireTime"> <el-form-item label="过期时间" prop="expireTime">
<el-date-picker <el-date-picker
v-model="form.expireTime" v-model="form.expireTime"
clearable clearable
placeholder="请选择过期时间" placeholder="请选择过期时间"
type="datetime" type="datetime"
value-format="YYYY-MM-DD HH:mm:ss" value-format="YYYY-MM-DD HH:mm:ss"
> >
</el-date-picker> </el-date-picker>
</el-form-item> </el-form-item>
<el-form-item label="用户数量" prop="accountCount"> <el-form-item label="用户数量" prop="accountCount">
<el-input v-model="form.accountCount" placeholder="请输入用户数量"/> <el-input v-model="form.accountCount" placeholder="请输入用户数量" />
</el-form-item> </el-form-item>
<el-form-item label="备注" prop="remark"> <el-form-item label="备注" prop="remark">
<el-input <el-input
v-model="form.remark" v-model="form.remark"
placeholder="请输入内容" placeholder="请输入内容"
type="textarea" type="textarea"
/> />
</el-form-item> </el-form-item>
</el-form> </el-form>
@ -264,25 +265,25 @@
<!-- 修改租户模式 --> <!-- 修改租户模式 -->
<el-dialog <el-dialog
v-model="showTenantSetting" v-model="showTenantSetting"
append-to-body append-to-body
draggable draggable
title="模式设置" title="模式设置"
width="500px" width="500px"
> >
<el-form <el-form
ref="tenantSettingRef" ref="tenantSettingRef"
:model="tenantSettingForm" :model="tenantSettingForm"
:rules="tenantSettingRules" :rules="tenantSettingRules"
label-width="0" label-width="0"
> >
<el-form-item class="mode-setting-radio"> <el-form-item class="mode-setting-radio">
<el-radio-group v-model="tenantSettingForm.mode"> <el-radio-group v-model="tenantSettingForm.mode">
<el-radio <el-radio
v-for="option in tenantModeDict" v-for="option in tenantModeDict"
:key="option.value" :key="option.value"
:label="option.value" :label="option.value"
>{{ option.label }} >{{ option.label }}
</el-radio> </el-radio>
</el-radio-group> </el-radio-group>
</el-form-item> </el-form-item>
@ -290,7 +291,7 @@
<template #footer> <template #footer>
<div class="dialog-footer"> <div class="dialog-footer">
<el-button type="primary" @click="submitTenantSetting" <el-button type="primary" @click="submitTenantSetting"
>确 定 >确 定
</el-button> </el-button>
<el-button @click="cancelSettingTenant">取 消</el-button> <el-button @click="cancelSettingTenant">取 消</el-button>
</div> </div>
@ -299,77 +300,77 @@
<!--查看数据源列表--> <!--查看数据源列表-->
<el-dialog <el-dialog
v-model="showDatasourceDialog" v-model="showDatasourceDialog"
append-to-body append-to-body
draggable draggable
title="数据源设置" title="数据源设置"
width="800px" width="800px"
> >
<!--添加或修改数据源--> <!--添加或修改数据源-->
<el-form <el-form
v-if="isEditDatasource" v-if="isEditDatasource"
ref="datasourceFormRef" ref="datasourceFormRef"
:model="dataSourceForm" :model="dataSourceForm"
:rules="dataSourceRules" :rules="dataSourceRules"
label-position="left" label-position="left"
label-width="100px" label-width="100px"
> >
<el-form-item label="数据库类型" prop="type"> <el-form-item label="数据库类型" prop="type">
<el-select v-model="dataSourceForm.type"> <el-select v-model="dataSourceForm.type">
<el-option <el-option
v-for="option in database_type_dict" v-for="option in database_type_dict"
:key="option.value" :key="option.value"
:label="option.label" :label="option.label"
:value="option.value" :value="option.value"
/> />
</el-select> </el-select>
</el-form-item> </el-form-item>
<el-form-item label="数据库IP" prop="ip"> <el-form-item label="数据库IP" prop="ip">
<el-input v-model="dataSourceForm.ip"/> <el-input v-model="dataSourceForm.ip" />
</el-form-item> </el-form-item>
<el-form-item label="数据库端口" prop="port"> <el-form-item label="数据库端口" prop="port">
<el-input-number <el-input-number
v-model="dataSourceForm.port" v-model="dataSourceForm.port"
:max="65535" :max="65535"
:min="1" :min="1"
/> />
</el-form-item> </el-form-item>
<el-form-item label="数据库名称" prop="dbName"> <el-form-item label="数据库名称" prop="dbName">
<el-input v-model="dataSourceForm.dbName"/> <el-input v-model="dataSourceForm.dbName" />
</el-form-item> </el-form-item>
<!-- schemaName 模式名称 仅当数据库类型不是Mysql时显示 --> <!-- schemaName 模式名称 仅当数据库类型不是Mysql时显示 -->
<el-form-item <el-form-item
v-if="dataSourceForm.type !== 'MySQL'" v-if="dataSourceForm.type !== 'MySQL'"
label="模式名称" label="模式名称"
prop="schemaName" prop="schemaName"
> >
<el-input v-model="dataSourceForm.schemaName"/> <el-input v-model="dataSourceForm.schemaName" />
</el-form-item> </el-form-item>
<el-form-item label="数据库账号" prop="username"> <el-form-item label="数据库账号" prop="username">
<el-input v-model="dataSourceForm.username"/> <el-input v-model="dataSourceForm.username" />
</el-form-item> </el-form-item>
<el-form-item label="数据库密码" prop="password"> <el-form-item label="数据库密码" prop="password">
<el-input v-model="dataSourceForm.password"/> <el-input v-model="dataSourceForm.password" />
</el-form-item> </el-form-item>
<el-form-item label="使用" prop="isPrimary"> <el-form-item label="使用" prop="isPrimary">
<el-switch <el-switch
v-model="dataSourceForm.isPrimary" v-model="dataSourceForm.isPrimary"
active-value="1" active-value="1"
inactive-value="0" inactive-value="0"
/> />
</el-form-item> </el-form-item>
<!-- 折叠按钮, 切换折叠状态时有旋转动画效果 --> <!-- 折叠按钮, 切换折叠状态时有旋转动画效果 -->
<el-divider content-position="left"> <el-divider content-position="left">
<div <div
class="show-advanced" class="show-advanced"
@click="showDatasourceAdvanced = !showDatasourceAdvanced" @click="showDatasourceAdvanced = !showDatasourceAdvanced"
> >
<el-icon <el-icon
:style="`transform: rotate(${ :style="`transform: rotate(${
showDatasourceAdvanced ? 90 : 0 showDatasourceAdvanced ? 90 : 0
}deg);transition: all 0.3s;`" }deg);transition: all 0.3s;`"
> >
<ArrowRight/> <ArrowRight />
</el-icon> </el-icon>
<span> <span>
<!-- 显示或隐藏高级选项 --> <!-- 显示或隐藏高级选项 -->
@ -381,22 +382,13 @@
<div v-if="showDatasourceAdvanced"> <div v-if="showDatasourceAdvanced">
<!-- initCount minCount maxCount --> <!-- initCount minCount maxCount -->
<el-form-item label="初始化连接数" prop="initCount"> <el-form-item label="初始化连接数" prop="initCount">
<el-input-number <el-input-number v-model="dataSourceForm.initCount" :min="0" />
v-model="dataSourceForm.initCount"
:min="0"
/>
</el-form-item> </el-form-item>
<el-form-item label="最小连接数" prop="minCount"> <el-form-item label="最小连接数" prop="minCount">
<el-input-number <el-input-number v-model="dataSourceForm.minCount" :min="0" />
v-model="dataSourceForm.minCount"
:min="0"
/>
</el-form-item> </el-form-item>
<el-form-item label="最大连接数" prop="maxCount"> <el-form-item label="最大连接数" prop="maxCount">
<el-input-number <el-input-number v-model="dataSourceForm.maxCount" :min="0" />
v-model="dataSourceForm.maxCount"
:min="0"
/>
</el-form-item> </el-form-item>
</div> </div>
</Transition> </Transition>
@ -405,63 +397,63 @@
<el-row justify="end"> <el-row justify="end">
<el-col :span="1.5"> <el-col :span="1.5">
<el-button <el-button
icon="plus" icon="plus"
plain plain
type="primary" type="primary"
@click="handleAddDataSource" @click="handleAddDataSource"
>新增 >新增
</el-button> </el-button>
</el-col> </el-col>
</el-row> </el-row>
<el-table :data="datasource" style="margin-top: 12px"> <el-table :data="datasource" style="margin-top: 12px">
<el-table-column <el-table-column
align="center" align="center"
label="类型" label="类型"
prop="type" prop="type"
></el-table-column> ></el-table-column>
<el-table-column <el-table-column
align="center" align="center"
label="IP" label="IP"
prop="ip" prop="ip"
></el-table-column> ></el-table-column>
<el-table-column <el-table-column
align="center" align="center"
label="端口" label="端口"
prop="port" prop="port"
></el-table-column> ></el-table-column>
<el-table-column <el-table-column
align="center" align="center"
label="名称" label="名称"
prop="dbName" prop="dbName"
></el-table-column> ></el-table-column>
<el-table-column <el-table-column
align="center" align="center"
label="账号" label="账号"
prop="username" prop="username"
></el-table-column> ></el-table-column>
<el-table-column <el-table-column
align="center" align="center"
label="密码" label="密码"
prop="password" prop="password"
></el-table-column> ></el-table-column>
<el-table-column align="center" label="操作" width="140"> <el-table-column align="center" label="操作" width="140">
<template #default="{ row }"> <template #default="{ row }">
<el-button <el-button
icon="edit" icon="edit"
link link
size="small" size="small"
type="warning" type="warning"
@click="handleUpdateDataSource(row)" @click="handleUpdateDataSource(row)"
>修改 >修改
</el-button> </el-button>
<el-button <el-button
icon="delete" icon="delete"
link link
size="small" size="small"
type="danger" type="danger"
@click="handleDeleteDataSource(row)" @click="handleDeleteDataSource(row)"
>删除 >删除
</el-button> </el-button>
</template> </template>
</el-table-column> </el-table-column>
@ -472,12 +464,12 @@
<div class="dialog-footer"> <div class="dialog-footer">
<template v-if="isEditDatasource"> <template v-if="isEditDatasource">
<el-button type="primary" @click="submitDatasource" <el-button type="primary" @click="submitDatasource"
>确 定 >确 定
</el-button> </el-button>
<el-button @click="isEditDatasource = false">取 消</el-button> <el-button @click="isEditDatasource = false">取 消</el-button>
</template> </template>
<el-button v-else type="primary" @click="handleCloseDatasource" <el-button v-else type="primary" @click="handleCloseDatasource"
>关闭 >关闭
</el-button> </el-button>
</div> </div>
</template> </template>
@ -499,15 +491,20 @@ import {
updateDatasource, updateDatasource,
updateTenant, updateTenant,
} from "@/api/tenant/tenant"; } from "@/api/tenant/tenant";
import {getCurrentInstance, reactive, ref, toRefs} from "vue"; import { getCurrentInstance, reactive, ref, toRefs } from "vue";
import {ElMessage, ElMessageBox} from "element-plus"; import { ElMessage, ElMessageBox } from "element-plus";
import {database_type_dict, tenantModeDict, tenantStatusDict,} from "@/constant/dict"; import {
database_type_dict,
initStatusDict,
tenantModeDict,
tenantStatusDict,
} from "@/constant/dict";
import DictTag from "@/components/DictTag/index.vue"; import DictTag from "@/components/DictTag/index.vue";
import {cloneDeep} from "lodash-es"; import { cloneDeep } from "lodash-es";
import {ArrowRight} from "@element-plus/icons-vue"; import { ArrowRight } from "@element-plus/icons-vue";
import {useRouter} from "vue-router"; import { useRouter } from "vue-router";
const {proxy} = getCurrentInstance(); const { proxy } = getCurrentInstance();
const router = useRouter(); const router = useRouter();
const tenantList = ref([]); const tenantList = ref([]);
@ -546,7 +543,7 @@ const data = reactive({
}, },
rules: { rules: {
companyName: [ companyName: [
{required: true, message: "公司名称不能为空", trigger: "blur"}, { required: true, message: "公司名称不能为空", trigger: "blur" },
], ],
}, },
tenantSettingForm: {}, tenantSettingForm: {},
@ -713,12 +710,12 @@ const handleAddDataSource = () => {
*/ */
const handleDeleteDataSource = (row) => { const handleDeleteDataSource = (row) => {
ElMessageBox.confirm(`确认删除此数据源: ${row.ip}`, "删除数据源", {}).then( ElMessageBox.confirm(`确认删除此数据源: ${row.ip}`, "删除数据源", {}).then(
async () => { async () => {
await deleteDatasource(row.datasourceId); await deleteDatasource(row.datasourceId);
ElMessage.success("已删除数据源"); ElMessage.success("已删除数据源");
const resp = await datasourceList(tempTenantId.value); const resp = await datasourceList(tempTenantId.value);
datasource.value = resp.data; datasource.value = resp.data;
} }
); );
}; };
@ -829,7 +826,7 @@ const submitTenantSetting = async () => {
const ori = tenantSettingForm.value.oriMode; const ori = tenantSettingForm.value.oriMode;
const cur = tenantSettingForm.value.mode; const cur = tenantSettingForm.value.mode;
const warningText = () => ( const warningText = () => (
<span style="color:red"> <span style="color:red">
切换到其他模式会清除已有的数据源配置, 是否继续? 切换到其他模式会清除已有的数据源配置, 是否继续?
</span> </span>
); );
@ -849,26 +846,25 @@ const submitTenantSetting = async () => {
function handleDelete(row) { function handleDelete(row) {
const _tenantIds = row.tenantId || ids.value; const _tenantIds = row.tenantId || ids.value;
proxy.$modal proxy.$modal
.confirm('是否确认删除租户编号为"' + _tenantIds + '"的数据项？') .confirm('是否确认删除租户编号为"' + _tenantIds + '"的数据项？')
.then(function () { .then(function () {
return delTenant(_tenantIds); return delTenant(_tenantIds);
}) })
.then(() => { .then(() => {
getList(); getList();
proxy.$modal.msgSuccess("删除成功"); proxy.$modal.msgSuccess("删除成功");
}) })
.catch(() => { .catch(() => {});
});
} }
/** 导出按钮操作 */ /** 导出按钮操作 */
function handleExport() { function handleExport() {
proxy.download( proxy.download(
"tenant/tenant/export", "tenant/tenant/export",
{ {
...queryParams.value, ...queryParams.value,
}, },
`tenant_${new Date().getTime()}.xlsx` `tenant_${new Date().getTime()}.xlsx`
); );
} }

235
src/views/tenant/initialize.vue
View File

@ -1,60 +1,60 @@
<template> <template>
<div class="app-container"> <div class="app-container">
<el-steps <el-steps
:active="activeStep" :active="activeStep"
:process-status=" :process-status="
currentStepStatus === 0 currentStepStatus === 0
? 'error' ? 'error'
: currentStepStatus === 1 : currentStepStatus === 1
? 'process' ? 'process'
: 'success' : 'success'
" "
align-center align-center
class="init-steps" class="init-steps"
finish-status="success" finish-status="success"
> >
<el-step title="开始"/> <el-step title="开始" />
<el-step title="检查"/> <el-step title="检查" />
<el-step title="步骤2"/> <el-step title="步骤2" />
<el-step title="步骤3"/> <el-step title="步骤3" />
</el-steps> </el-steps>
<!-- 错误提示 --> <!-- 错误提示 -->
<el-alert <el-alert
v-if="currentStepStatus === 0" v-if="currentStepStatus === 0"
:closable="false" :closable="false"
:type=" :type="
currentStepStatus === 0 currentStepStatus === 0
? 'error' ? 'error'
: currentStepStatus === 1 : currentStepStatus === 1
? 'info' ? 'info'
: 'success' : 'success'
" "
show-icon show-icon
>{{ >{{
activeStep === 1 activeStep === 1
? "错误码: " + ? "错误码: " +
tenantInitCheckResult.result + tenantInitCheckResult.result +
", 错误信息: " + ", 错误信息: " +
tenantInitCheckResult.msg tenantInitCheckResult.msg
: activeStep === 2 : activeStep === 2
? "错误码: " + ? "错误码: " +
createTablesResult.result + createTablesResult.result +
", 错误信息: " + ", 错误信息: " +
createTablesResult.msg createTablesResult.msg
: activeStep === 3 : activeStep === 3
? "错误码: " + ? "错误码: " +
initDataResult.result + initDataResult.result +
", 错误信息: " + ", 错误信息: " +
initDataResult.msg initDataResult.msg
: "" : ""
}} }}
</el-alert> </el-alert>
<!-- 数据库配置信息 --> <!-- 数据库配置信息 -->
<el-row <el-row
v-if="Object.keys(tenantInitCheckResult).length" v-if="Object.keys(tenantInitCheckResult).length"
style="margin: 36px 36px 0" style="margin: 36px 36px 0"
> >
<el-col :span="12"> <el-col :span="12">
<div class="data-card init-check-base-data"> <div class="data-card init-check-base-data">
@ -67,26 +67,26 @@
<div class="card-content-item"> <div class="card-content-item">
<span class="card-content-item-title">租户名称:</span> <span class="card-content-item-title">租户名称:</span>
<span class="card-content-item-value">{{ <span class="card-content-item-value">{{
tenantInitCheckResult.tenantName tenantInitCheckResult.tenantName
}}</span> }}</span>
</div> </div>
<!--模式--> <!--模式-->
<div class="card-content-item"> <div class="card-content-item">
<span class="card-content-item-title">模式:</span> <span class="card-content-item-title">模式:</span>
<span class="card-content-item-value">{{ <span class="card-content-item-value">{{
tenantModeDict.find( tenantModeDict.find(
(item) => item.value === tenantInitCheckResult.mode (item) => item.value === tenantInitCheckResult.mode
)?.label )?.label
}}</span> }}</span>
</div> </div>
</div> </div>
</div> </div>
</el-col> </el-col>
<el-col :span="12"> <el-col :span="12">
<div <div
v-if="tenantInitCheckResult.datasource" v-if="tenantInitCheckResult.datasource"
class="data-card init-check-base-data" class="data-card init-check-base-data"
style="margin-left: 24px" style="margin-left: 24px"
> >
<div class="card-title"> <div class="card-title">
<span>数据源数据</span> <span>数据源数据</span>
@ -95,43 +95,43 @@
<div class="card-content-item"> <div class="card-content-item">
<span class="card-content-item-title">数据库IP:</span> <span class="card-content-item-title">数据库IP:</span>
<span class="card-content-item-value">{{ <span class="card-content-item-value">{{
tenantInitCheckResult.datasource.ip tenantInitCheckResult.datasource.ip
}}</span> }}</span>
</div> </div>
<!-- 端口--> <!-- 端口-->
<div class="card-content-item"> <div class="card-content-item">
<span class="card-content-item-title">端口:</span> <span class="card-content-item-title">端口:</span>
<span class="card-content-item-value">{{ <span class="card-content-item-value">{{
tenantInitCheckResult.datasource.port tenantInitCheckResult.datasource.port
}}</span> }}</span>
</div> </div>
<!--模式--> <!--模式-->
<div class="card-content-item"> <div class="card-content-item">
<span class="card-content-item-title">类型:</span> <span class="card-content-item-title">类型:</span>
<span class="card-content-item-value">{{ <span class="card-content-item-value">{{
tenantInitCheckResult.datasource.type tenantInitCheckResult.datasource.type
}}</span> }}</span>
</div> </div>
<!-- 数据库名称--> <!-- 数据库名称-->
<div class="card-content-item"> <div class="card-content-item">
<span class="card-content-item-title">数据库名称:</span> <span class="card-content-item-title">数据库名称:</span>
<span class="card-content-item-value">{{ <span class="card-content-item-value">{{
tenantInitCheckResult.datasource.dbName tenantInitCheckResult.datasource.dbName
}}</span> }}</span>
</div> </div>
<!-- 用户名--> <!-- 用户名-->
<div class="card-content-item"> <div class="card-content-item">
<span class="card-content-item-title">用户名:</span> <span class="card-content-item-title">用户名:</span>
<span class="card-content-item-value">{{ <span class="card-content-item-value">{{
tenantInitCheckResult.datasource.username tenantInitCheckResult.datasource.username
}}</span> }}</span>
</div> </div>
<!-- 密码--> <!-- 密码-->
<div class="card-content-item"> <div class="card-content-item">
<span class="card-content-item-title">密码:</span> <span class="card-content-item-title">密码:</span>
<span class="card-content-item-value">{{ <span class="card-content-item-value">{{
tenantInitCheckResult.datasource.password tenantInitCheckResult.datasource.password
}}</span> }}</span>
</div> </div>
</div> </div>
</div> </div>
@ -143,7 +143,7 @@
<el-col :span="1.5"> <el-col :span="1.5">
<div class="btn-loading"> <div class="btn-loading">
<el-icon size="80"> <el-icon size="80">
<refresh/> <refresh />
</el-icon> </el-icon>
</div> </div>
</el-col> </el-col>
@ -161,16 +161,16 @@
<el-row justify="center"> <el-row justify="center">
<el-col :span="1.5"> <el-col :span="1.5">
<div <div
v-if="currentStepStatus === 0" v-if="currentStepStatus === 0"
class="circle-button error" class="circle-button error"
@click="router.push({ path: '/tenant/tenant' })" @click="router.push({ path: '/tenant/tenant' })"
> >
关闭 关闭
</div> </div>
<div <div
v-else-if="currentStepStatus === 2" v-else-if="currentStepStatus === 2"
class="circle-button" class="circle-button"
@click="initTenant" @click="initTenant"
> >
创建库 创建库
</div> </div>
@ -181,16 +181,16 @@
<el-row justify="center"> <el-row justify="center">
<el-col :span="1.5"> <el-col :span="1.5">
<div <div
v-if="currentStepStatus === 0" v-if="currentStepStatus === 0"
class="circle-button error" class="circle-button error"
@click="router.push({ path: '/tenant/tenant' })" @click="router.push({ path: '/tenant/tenant' })"
> >
关闭 关闭
</div> </div>
<div <div
v-else-if="currentStepStatus === 2" v-else-if="currentStepStatus === 2"
class="circle-button" class="circle-button"
@click="initTenant" @click="initTenant"
> >
<span>导入数据</span> <span>导入数据</span>
</div> </div>
@ -201,16 +201,16 @@
<el-row justify="center"> <el-row justify="center">
<el-col :span="1.5"> <el-col :span="1.5">
<div <div
v-if="currentStepStatus === 0" v-if="currentStepStatus === 0"
class="circle-button error" class="circle-button error"
@click="router.push({ path: '/tenant/tenant' })" @click="router.push({ path: '/tenant/tenant' })"
> >
关闭 关闭
</div> </div>
<div <div
v-else-if="currentStepStatus === 2" v-else-if="currentStepStatus === 2"
class="circle-button finish" class="circle-button finish"
@click="router.push({ path: '/tenant/tenant' })" @click="router.push({ path: '/tenant/tenant' })"
> >
完成 完成
</div> </div>
@ -221,11 +221,11 @@
</div> </div>
</template> </template>
<script setup> <script setup>
import {onMounted, reactive, ref, toRefs, watchEffect} from "vue"; import { onMounted, reactive, ref, toRefs, watchEffect } from "vue";
import {check, createTables, initData} from "@/api/tenant/init"; import { check, createTables, initData } from "@/api/tenant/init";
import {useRoute, useRouter} from "vue-router"; import { useRoute, useRouter } from "vue-router";
import {tenantModeDict} from "@/constant/dict"; import { tenantModeDict } from "@/constant/dict";
import {Refresh} from "@element-plus/icons-vue"; import { Refresh } from "@element-plus/icons-vue";
const route = useRoute(); const route = useRoute();
const router = useRouter(); const router = useRouter();
@ -236,7 +236,7 @@ const loading = ref(false);
if (route.query.id) { if (route.query.id) {
tenantId.value = route.query.id; tenantId.value = route.query.id;
} else { } else {
router.push({path: "/tenant/tenant"}); router.push({ path: "/tenant/tenant" });
} }
const data = reactive({ const data = reactive({
@ -245,8 +245,8 @@ const data = reactive({
initDataResult: {}, initDataResult: {},
}); });
const {tenantInitCheckResult, createTablesResult, initDataResult} = const { tenantInitCheckResult, createTablesResult, initDataResult } =
toRefs(data); toRefs(data);
const initTenant = async () => { const initTenant = async () => {
loading.value = true; loading.value = true;
@ -266,19 +266,20 @@ const tenantInitCheck = () => {
activeStep.value = 1; activeStep.value = 1;
currentStepStatus.value = 1; currentStepStatus.value = 1;
return check(tenantId.value) return check(tenantId.value)
.catch(() => { .catch(() => {
currentStepStatus.value = 2;
activeStep.value = 0;
throw new Error("租户初始化检查失败");
})
.then((resp) => {
tenantInitCheckResult.value = resp;
if (resp.result === 200) {
currentStepStatus.value = 2; currentStepStatus.value = 2;
activeStep.value = 0; } else {
currentStepStatus.value = 0;
throw new Error("租户初始化检查失败"); throw new Error("租户初始化检查失败");
}).then((resp) => { }
tenantInitCheckResult.value = resp; });
if (resp.result === 200) {
currentStepStatus.value = 2;
} else {
currentStepStatus.value = 0;
throw new Error("租户初始化检查失败");
}
})
}; };
// 第二步: 创建数据库 // 第二步: 创建数据库
@ -287,19 +288,20 @@ const createDatabase = () => {
activeStep.value = 2; activeStep.value = 2;
currentStepStatus.value = 1; currentStepStatus.value = 1;
return createTables(tenantId.value) return createTables(tenantId.value)
.catch(() => { .catch(() => {
currentStepStatus.value = 2;
activeStep.value = 1;
throw new Error("创建数据库失败");
})
.then((resp) => {
createTablesResult.value = resp;
if (resp.result === 200) {
currentStepStatus.value = 2; currentStepStatus.value = 2;
activeStep.value = 1; } else {
currentStepStatus.value = 0;
throw new Error("创建数据库失败"); throw new Error("创建数据库失败");
}).then((resp) => { }
createTablesResult.value = resp; });
if (resp.result === 200) {
currentStepStatus.value = 2;
} else {
currentStepStatus.value = 0;
throw new Error("创建数据库失败");
}
})
}; };
// 第三步,导入数据 // 第三步,导入数据
@ -308,27 +310,28 @@ const importData = () => {
activeStep.value = 3; activeStep.value = 3;
currentStepStatus.value = 1; currentStepStatus.value = 1;
return initData(tenantId.value) return initData(tenantId.value)
.catch(() => { .catch(() => {
currentStepStatus.value = 2;
activeStep.value = 2;
throw new Error("导入数据失败");
})
.then((resp) => {
initDataResult.value = resp;
if (resp.result === 200) {
currentStepStatus.value = 2; currentStepStatus.value = 2;
activeStep.value = 2; } else {
currentStepStatus.value = 0;
throw new Error("导入数据失败"); throw new Error("导入数据失败");
}).then((resp) => { }
initDataResult.value = resp; });
if (resp.result === 200) {
currentStepStatus.value = 2;
} else {
currentStepStatus.value = 0;
throw new Error("导入数据失败");
}
})
}; };
onMounted(() => { onMounted(() => {
watchEffect(() => { watchEffect(() => {
let progressLineWidth = let progressLineWidth =
(activeStep.value - 1) * 100 + (activeStep.value - 1) * 100 +
Math.abs(currentStepStatus.value - 1) * 30 + Math.abs(currentStepStatus.value - 1) * 30 +
70; 70;
progressLineWidth = progressLineWidth < 100 ? 0 : progressLineWidth; progressLineWidth = progressLineWidth < 100 ? 0 : progressLineWidth;
let progressLineColor; let progressLineColor;
if (currentStepStatus.value === 0) { if (currentStepStatus.value === 0) {
@ -339,11 +342,11 @@ onMounted(() => {
progressLineColor = `linear-gradient(to right, #67c23a ${100}%, #f56c6c ${100}%)`; progressLineColor = `linear-gradient(to right, #67c23a ${100}%, #f56c6c ${100}%)`;
} }
document document
.querySelector(".app-container") .querySelector(".app-container")
.style.setProperty("--progress-line-color", progressLineColor); .style.setProperty("--progress-line-color", progressLineColor);
document document
.querySelector(".app-container") .querySelector(".app-container")
.style.setProperty("--progress-line-width", progressLineWidth + "%"); .style.setProperty("--progress-line-width", progressLineWidth + "%");
}); });
}); });
</script> </script>