Эх сурвалжийг харах

chore: 增加生成加载动画

喵你个旺呀 1 жил өмнө
parent
commit
4b63f2f3e1

+ 14 - 9
Web/src/views/system/codeGen/component/previewDialog.vue

@@ -17,7 +17,7 @@
 					</template>
 				</el-segmented>
 			</div>
-			<div ref="monacoEditorRef" style="width: 100%; height: 700px;"></div>
+			<div ref="monacoEditorRef" style="width: 100%; height: 700px;" v-loading="state.loading"></div>
 			<template #footer>
 				<span class="dialog-footer">
 					<el-button icon="ele-Close" @click="cancel">关 闭</el-button>
@@ -48,6 +48,7 @@ const state = reactive({
 	options: [] as any, // 分段器的选项
 	current: '', // 选中的分段
 	codes: [] as any, // 预览的代码
+  loading: true
 });
 
 // 防止 monaco 报黄
@@ -86,14 +87,18 @@ const initMonacoEditor = () => {
 
 // 打开弹窗
 const openDialog = async (row: any) => {
-	state.isShowDialog = true;
-	const { data } = await getAPI(SysCodeGenApi).apiSysCodeGenPreviewPost(row);
-	state.codes = data.result ?? [];
-	state.options = Object.keys(data.result).map((fileName: string) => ({
-		value: fileName,
-		icon: fileName?.endsWith('.cs') ? 'fa fa-hashtag' : fileName?.endsWith('.vue') ? 'fa fa-vimeo' : 'fa fa-file-code-o',
-	}));
-	state.current = state.options?.[0]?.value ?? '';
+  state.loading = true;
+  try {
+    state.isShowDialog = true;
+    const { data } = await getAPI(SysCodeGenApi).apiSysCodeGenPreviewPost(row);
+    state.codes = data.result ?? [];
+    state.options = Object.keys(data.result ?? []).map((fileName: string) => ({
+      value: fileName,
+      icon: fileName?.endsWith('.cs') ? 'fa fa-hashtag' : fileName?.endsWith('.vue') ? 'fa fa-vimeo' : 'fa fa-file-code-o',
+    }));
+    state.current = state.options?.[0]?.value ?? '';
+  }  catch (e) { /* empty */ }
+  state.loading = false;
 	if (monacoEditor == null) initMonacoEditor();
 	// 防止取不到
 	nextTick(() => {

+ 1 - 1
Web/src/views/system/codeGen/index.vue

@@ -169,7 +169,7 @@ const openCopyDialog = (row: any) => {
 	copyRow.id = 0;
 	copyRow.busName = '';
 	copyRow.tableName = '';
-  copyRow.tableUniqueConfig = undefined;
+  copyRow.tableUniqueList = undefined;
 	EditCodeGenRef.value?.openDialog(copyRow);
 };
 

+ 13 - 6
Web/src/views/system/database/component/genEntity.vue

@@ -7,7 +7,7 @@
 					<span> 生成实体 </span>
 				</div>
 			</template>
-			<el-form :model="state.ruleForm" ref="ruleFormRef" label-width="auto">
+			<el-form :model="state.ruleForm" ref="ruleFormRef" label-width="auto" v-loading="state.loading">
 				<el-row :gutter="35">
 					<el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24" class="mb20">
 						<el-form-item label="表名" prop="tableName" :rules="[{ required: true, message: '表名不能为空', trigger: 'blur' }]">
@@ -38,8 +38,8 @@
 			</el-form>
 			<template #footer>
 				<span class="dialog-footer">
-					<el-button @click="cancel">取 消</el-button>
-					<el-button type="primary" v-reclick="3000" @click="submit">确 定</el-button>
+					<el-button @click="cancel" :disabled="state.loading">取 消</el-button>
+					<el-button type="primary" v-reclick="3000" @click="submit" :disabled="state.loading">确 定</el-button>
 				</span>
 			</template>
 		</el-dialog>
@@ -48,6 +48,7 @@
 
 <script lang="ts" setup name="sysGenEntity">
 import { reactive, ref } from 'vue';
+import { ElMessage } from "element-plus";
 import { camelCase, upperFirst } from 'lodash-es';
 import {useUserInfo} from "/@/stores/userInfo";
 import { getAPI } from '/@/utils/axios-utils';
@@ -58,7 +59,8 @@ const emits = defineEmits(['handleQueryColumn']);
 const ruleFormRef = ref();
 const state = reactive({
 	isShowDialog: false,
-	ruleForm: {} as any
+	ruleForm: {} as any,
+  loading: false
 });
 
 const props = defineProps({
@@ -90,8 +92,13 @@ const cancel = () => {
 const submit = () => {
 	ruleFormRef.value.validate(async (valid: boolean) => {
 		if (!valid) return;
-		await getAPI(SysDatabaseApi).apiSysDatabaseCreateEntityPost(state.ruleForm);
-		closeDialog();
+    state.loading = true;
+    try {
+      await getAPI(SysDatabaseApi).apiSysDatabaseCreateEntityPost(state.ruleForm);
+      closeDialog();
+      ElMessage.success('生成成功');
+    } catch (e) { /* empty */ }
+    state.loading = false;
 	});
 };
 

+ 12 - 6
Web/src/views/system/database/component/genSeedData.vue

@@ -1,6 +1,6 @@
 <template>
 	<div class="sys-dbEntity-container">
-		<el-dialog v-model="state.isShowDialog" draggable :close-on-click-modal="false" width="700px">
+		<el-dialog v-model="state.isShowDialog" draggable :close-on-click-modal="false" width="700px" v-loading="state.loading">
 			<template #header>
 				<div style="color: #fff">
 					<el-icon size="16" style="margin-right: 3px; display: inline; vertical-align: middle"> <ele-Cpu /> </el-icon>
@@ -36,8 +36,8 @@
 			</el-form>
 			<template #footer>
 				<span class="dialog-footer">
-					<el-button @click="cancel">取 消</el-button>
-					<el-button type="primary" v-reclick="3000" @click="submit">确 定</el-button>
+					<el-button @click="cancel" :disabled="state.loading">取 消</el-button>
+					<el-button type="primary" v-reclick="3000" @click="submit" :disabled="state.loading">确 定</el-button>
 				</span>
 			</template>
 		</el-dialog>
@@ -46,7 +46,7 @@
 
 <script lang="ts" setup name="sysGenEntity">
 import { reactive, ref } from 'vue';
-
+import { ElMessage } from "element-plus";
 import { getAPI } from '/@/utils/axios-utils';
 import { SysDatabaseApi } from '/@/api-services/api';
 
@@ -58,6 +58,7 @@ const props = defineProps({
 
 const ruleFormRef = ref();
 const state = reactive({
+  loading: false,
 	isShowDialog: false,
 	ruleForm: {} as any,
 	rules: { position: [{ required: true, message: '请选择存放位置', trigger: 'blur' }] },
@@ -87,8 +88,13 @@ const cancel = () => {
 const submit = () => {
 	ruleFormRef.value.validate(async (valid: boolean) => {
 		if (!valid) return;
-		await getAPI(SysDatabaseApi).apiSysDatabaseCreateSeedDataPost(state.ruleForm);
-		closeDialog();
+    state.loading = true;
+		try {
+      await getAPI(SysDatabaseApi).apiSysDatabaseCreateSeedDataPost(state.ruleForm);
+      closeDialog();
+      ElMessage.success('生成成功');
+    } catch (e) { /* empty */ }
+    state.loading = false;
 	});
 };