Prechádzať zdrojové kódy

增加单点登录功能的增删改查

yanglzh 11 mesiacov pred
rodič
commit
4977177a82

+ 0 - 27
src/api/system/dbInit/index.ts

@@ -1,27 +0,0 @@
-import request from '/@/utils/request';
-
-// 是否已初始化
-export function isInit() {
-    return request({
-        url: '/system/dbInit/isInit',
-        method: 'get'
-    })
-}
-
-
-// 获取环境信息
-export function getEnvInfo() {
-    return request({
-        url: '/system/dbInit/getEnvInfo',
-        method: 'get'
-    })
-}
-
-// 创建数据库
-export function createDb (data:object) {
-    return request({
-        url: '/system/dbInit/createDb',
-        method: 'post',
-        data: data
-    })
-}

+ 13 - 6
src/api/system/index.ts

@@ -3,12 +3,19 @@ import { get, post, del, put, file } from '/@/utils/request';
 export default {
   sysinfo: () => get('/sysinfo'),
   sso: {
-    list: () => get(`/oauth/provider`),
-    login: (provider: string) => get(`/oauth/login`, { provider }),
-    // sso授权登录回调
-    callback: (params: object) => get(`/oauth/callback`, params),
-    // 系统用户登录绑定授权用户
-    binding: (data: any) => post(`/oauth/binding`, data),
+    // list: () => get(`/oauth/provider`),
+    // login: (provider: string) => get(`/oauth/login`, { provider }),
+    // // sso授权登录回调
+    // callback: (params: object) => get(`/oauth/callback`, params),
+    // // 系统用户登录绑定授权用户
+    // binding: (data: any) => post(`/oauth/binding`, data),
+    list: (params?: object) => get('/system/oauthProvider/list', params),
+    getAll: () => get('/system/oauthProvider/getAll'),
+    detail: (id: number) => get('/system/oauthProvider/getInfoById', { id }),
+    add: (data: object) => post('/system/oauthProvider/add', data),
+    del: (ids: number[]) => del('/system/oauthProvider/del', { ids }),
+    edit: (data: object) => put('/system/oauthProvider/edit', data),
+    editStatus: (id: number, status: number) => put('/system/oauthProvider/editStatus', { id, status })
   },
   login: {
     login: (data: object) => post('/login', data),

+ 0 - 16
src/router/index.ts

@@ -196,8 +196,6 @@ const { isRequestRoutes } = store.state.themeConfig.themeConfig;
 // 前端控制路由:初始化方法,防止刷新时路由丢失
 if (!isRequestRoutes) initFrontEndControlRoutes();
 
-
-// import { isInit } from "/@/api/system/dbInit"
 // 路由加载前
 router.beforeEach(async (to, from, next) => {
 	NProgress.configure({ showSpinner: false });
@@ -207,20 +205,6 @@ router.beforeEach(async (to, from, next) => {
 		next();
 		NProgress.done();
 	}
-	// if (Session.get("isInit") !== true) {
-	// 	const res: any = await isInit()
-	// 	let { code, data } = res
-	// 	if (code === 0) {
-	// 		if (data === false) {
-	// 			next('/dbInit');
-	// 			NProgress.done();
-	// 			return
-	// 		} else {
-	// 			Session.set("isInit", true)
-	// 		}
-	// 	}
-	// }
-
 
 	// 正常流程
 	const token = getToken();

+ 0 - 16
src/views/modules/tenant/index.vue

@@ -28,26 +28,10 @@
 				</el-form-item>
 			</el-form>
 			<el-table :data="tableData" @selection-change="handleSelectionChange" style="width: 100%" v-loading="loading" row-key="id">
-				<!-- <el-table-column v-col="'selection'" type="selection" width="55" align="center" /> -->
 				<el-table-column prop="name" label="租户名称" min-width="150" align="center" />
 				<el-table-column prop="code" label="租户编码" min-width="120" align="center" />
 				<el-table-column prop="systemName" label="系统名称" min-width="120" align="center" />
 				<el-table-column prop="systemCopyright" label="系统版权" min-width="120" align="center" />
-				<!-- <el-table-column prop="logoMini" label="系统LOGO(小图标)" width="120" align="center">
-					<template #default="{ row }">
-						<el-image v-if="row.logoMini" :src="row.logoMini" style="width: 90px; height: 90px" preview-teleported :preview-src-list="[row.logoMini]" />
-					</template>
-</el-table-column>
-<el-table-column prop="logoPic" label="登录展示图" width="120" align="center">
-	<template #default="{ row }">
-						<el-image v-if="row.logoPic" :src="row.logoPic" style="width: 90px; height: 90px" preview-teleported :preview-src-list="[row.logoPic]" />
-					</template>
-</el-table-column>
-<el-table-column prop="logo" label="系统LOGO" width="120" align="center">
-	<template #default="{ row }">
-						<el-image v-if="row.logo" :src="row.logo" style="width: 90px; height: 90px" preview-teleported :preview-src-list="[row.logo]" />
-					</template>
-</el-table-column> -->
 				<el-table-column prop="status" label="租户状态" width="100" align="center">
 					<template #default="scope">
 						<el-switch v-model="scope.row.status" inline-prompt :active-value="1" :inactive-value="0" active-text="启" inactive-text="禁" @change="handleStatusChange(scope.row)">

+ 102 - 0
src/views/system/sso/edit.vue

@@ -0,0 +1,102 @@
+<template>
+	<el-dialog class="api-edit" v-model="showDialog" :title="`${formData.id ? '编辑授权配置' : '新增授权配置'}`" width="600px" :close-on-click-modal="false" :close-on-press-escape="false">
+		<el-form ref="formRef" :model="formData" :rules="ruleForm" label-width="auto" @keyup.enter="onSubmit" v-if="showDialog">
+			<el-form-item label="名称" prop="name">
+				<el-input v-model="formData.name" placeholder="请输入名称" />
+			</el-form-item>
+			<el-form-item label="APPID" prop="appId">
+				<el-input v-model="formData.appId" placeholder="请输入APPID" />
+			</el-form-item>
+			<el-form-item label="APPSECRET" prop="appSecret">
+				<el-input v-model="formData.appSecret" placeholder="请输入APPSECRET" />
+			</el-form-item>
+			<el-form-item label="回调地址" prop="callbackUrl">
+				<el-input v-model="formData.callbackUrl" placeholder="请输入回调地址" />
+			</el-form-item>
+			<el-form-item label="LOGO" prop="logo">
+				<upload-vue :img="formData.logo" @set-img="setImg('logo', $event)"></upload-vue>
+			</el-form-item>
+			<el-form-item label="应用类型" prop="types">
+				<el-radio-group v-model="formData.types">
+					<el-radio :label="1">内部独立应用</el-radio>
+					<el-radio :label="2">第三方应用</el-radio>
+				</el-radio-group>
+			</el-form-item>
+		</el-form>
+		<template #footer>
+			<div class="dialog-footer">
+				<el-button @click="cancel">取消</el-button>
+				<el-button type="primary" @click="onSubmit">确定</el-button>
+			</div>
+		</template>
+	</el-dialog>
+</template>
+
+<script lang="ts" setup>
+import { ref, reactive } from 'vue';
+import api from '/@/api/system';
+import { ruleRequired } from '/@/utils/validator';
+import { ElMessage, UploadProps } from 'element-plus';
+import UploadVue from '/@/components/upload/index.vue';
+
+const emit = defineEmits(['getList']);
+
+const showDialog = ref(false);
+const formRef = ref();
+
+const baseForm: any = {
+	id: undefined,
+	name: '',
+	logo: '',
+	appId: '',
+	appSecret: '',
+	callbackUrl: '',
+	types: 1,
+};
+
+const formData = reactive<any>(JSON.parse(JSON.stringify(baseForm)));
+
+const ruleForm = {
+	name: [ruleRequired('名称不能为空', 'change')],
+	logo: [ruleRequired('LOGO不能为空', 'change')],
+	appId: [ruleRequired('APPID不能为空', 'change')],
+	appSecret: [ruleRequired('APPSECRET不能为空', 'change')],
+	callbackUrl: [ruleRequired('回调地址不能为空', 'change')],
+	types: [ruleRequired('应用类型不能为空', 'change')],
+};
+
+const onSubmit = async () => {
+	await formRef.value.validate();
+
+	const theApi = formData.id ? api.sso.edit : api.sso.add;
+
+	await theApi(formData);
+
+	ElMessage.success('操作成功');
+	resetForm();
+	showDialog.value = false;
+	emit('getList');
+};
+
+const resetForm = async () => {
+	const types = formData.types
+	Object.assign(formData, { ...JSON.parse(JSON.stringify(baseForm)) });
+	formRef.value && formRef.value.resetFields(formData);
+};
+const cancel = async () => {
+	resetForm()
+	showDialog.value = false
+};
+
+const open = async (row: any) => {
+	resetForm();
+	if (row) Object.assign(formData, row)
+	showDialog.value = true;
+};
+
+const setImg = (key: string, val: string) => {
+	formData[key] = val
+}
+
+defineExpose({ open });
+</script>

+ 120 - 0
src/views/system/sso/index.vue

@@ -0,0 +1,120 @@
+<template>
+	<div class="page">
+		<el-card shadow="nover">
+			<el-form :model="params" inline ref="queryRef">
+				<el-form-item label="名称搜索" prop="name">
+					<el-input v-model="params.name" placeholder="请输入租户名称" clearable style="width: 180px" @keyup.enter.native="getList(1)" />
+				</el-form-item>
+				<el-form-item label="状态" prop="status">
+					<el-select v-model="params.status" placeholder="租户状态" clearable style="width: 120px">
+						<el-option label="全部" :value="-1" />
+						<el-option label="启用" :value="1" />
+						<el-option label="禁用" :value="0" />
+					</el-select>
+				</el-form-item>
+				<el-form-item>
+					<el-button type="primary" class="ml10" @click="getList(1)">
+						<el-icon>
+							<ele-Search />
+						</el-icon>
+						查询
+					</el-button>
+					<el-button type="primary" @click="addOrEdit()" v-auth="'add'">
+						<el-icon>
+							<ele-FolderAdd />
+						</el-icon>
+						新增授权配置
+					</el-button>
+				</el-form-item>
+			</el-form>
+			<el-table :data="tableData" @selection-change="handleSelectionChange" style="width: 100%" v-loading="loading" row-key="id">
+				<el-table-column prop="name" label="名称" width="200" align="center" />
+				<el-table-column prop="appId" label="APPID" min-width="120" align="center" show-overflow-tooltip />
+				<el-table-column prop="callbackUrl" label="回调地址" min-width="120" align="center" show-overflow-tooltip />
+				<el-table-column prop="types" label="应用类型" width="150" align="center" :formatter="(row: any) => row.types ? '内部独立应用' : '第三方应用'" />
+				<el-table-column prop="status" label="状态" width="100" align="center">
+					<template #default="scope">
+						<el-switch v-model="scope.row.status" inline-prompt :active-value="1" :inactive-value="0" active-text="启" inactive-text="禁" @change="handleStatusChange(scope.row)">
+						</el-switch>
+					</template>
+				</el-table-column>
+				<el-table-column label="操作" width="120" align="center">
+					<template #default="scope">
+						<el-button size="small" text type="primary" @click="view(scope.row)">查看</el-button>
+						<el-button size="small" text type="warning" @click="addOrEdit(scope.row)" v-auth="'edit'">修改</el-button>
+						<el-button size="small" text type="info" @click="onDel(scope.row)" v-auth="'del'">删除</el-button>
+					</template>
+				</el-table-column>
+			</el-table>
+			<pagination v-if="params.total" :total="params.total" v-model:page="params.pageNum" v-model:limit="params.pageSize" @pagination="getList()" />
+		</el-card>
+		<EditForm ref="editFormRef" @getList="getList(1)"></EditForm>
+		<viewVue ref="viewRef"></viewVue>
+	</div>
+</template>
+
+<script lang="ts" setup>
+import { ref } from 'vue'
+import EditForm from './edit.vue'
+import viewVue from './view.vue'
+import api from '/@/api/system'
+import { ElMessageBox, ElMessage } from 'element-plus'
+import { useSearch } from '/@/hooks/useCommon'
+
+const editFormRef = ref()
+const viewRef = ref()
+const queryRef = ref()
+const ids = ref<number[]>([])
+
+const { params, tableData, getList, loading } = useSearch(api.sso.list, 'Data', { name: '', keyWord: '', status: -1 })
+
+getList()
+
+const addOrEdit = async (row?: any) => {
+	if (row) {
+		editFormRef.value.open(row)
+		return
+	} else {
+		editFormRef.value.open()
+	}
+}
+
+const view = async (row?: any) => {
+	viewRef.value.open(row)
+}
+
+const handleSelectionChange = (selection: any[]) => {
+	ids.value = selection.filter(item => item.types === 2).map((item) => item.id);
+};
+
+const onDel = (row: any) => {
+	ElMessageBox.confirm(`此操作将删除接口:“${row.name}”,是否继续?`, '提示', {
+		confirmButtonText: '确认',
+		cancelButtonText: '取消',
+		type: 'warning',
+	}).then(async () => {
+		await api.sso.del([row.id as number])
+		ElMessage.success('删除成功')
+		getList()
+	})
+}
+
+// 状态修改
+const handleStatusChange = (row: any) => {
+	let text = row.status === 1 ? '启用' : '停用';
+	ElMessageBox.confirm('确认要"' + text + '":"' + row.name + '"吗?', '警告', {
+		confirmButtonText: '确定',
+		cancelButtonText: '取消',
+		type: 'warning',
+	})
+		.then(function () {
+			return api.sso.editStatus(row.id, row.status);
+		})
+		.then(() => {
+			ElMessage.success(text + '成功');
+		})
+		.catch(function () {
+			row.status = row.status === 0 ? 1 : 0;
+		});
+};
+</script>

+ 38 - 0
src/views/system/sso/view.vue

@@ -0,0 +1,38 @@
+<template>
+	<el-dialog class="api-edit" v-model="showDialog" title="授权配置详情" width="1100px">
+		<el-descriptions class="margin-top" :column="2" border>
+			<el-descriptions-item label="名称">{{ formData.name }}</el-descriptions-item>
+			<el-descriptions-item label="APPID">{{ formData.appId }}</el-descriptions-item>
+			<el-descriptions-item label="APPSECRET">{{ formData.appSecret }}</el-descriptions-item>
+			<el-descriptions-item label="应用类型">{{ formData.types ? '内部独立应用' : '第三方应用' }}</el-descriptions-item>
+			<el-descriptions-item label="回调地址">{{ formData.callbackUrl }}</el-descriptions-item>
+			<el-descriptions-item label="系统LOGO(小图标)"><el-image fit="contain" v-if="formData.logo" :src="formData.logo" style="width: 200px; height: 200px" preview-teleported :preview-src-list="[formData.logo]" /></el-descriptions-item>
+		</el-descriptions>
+	</el-dialog>
+</template>
+
+<script lang="ts" setup>
+import { ref, reactive } from 'vue';
+
+const emit = defineEmits(['getList']);
+
+const showDialog = ref(false);
+
+const baseForm: any = {
+	id: undefined,
+	name: '',
+	code: '',
+	systemName: '',
+	systemCopyright: '',
+	description: '',
+};
+
+const formData = reactive<any>(JSON.parse(JSON.stringify(baseForm)));
+
+const open = async (row: any) => {
+	Object.assign(formData, row)
+	showDialog.value = true;
+};
+
+defineExpose({ open });
+</script>