From c13c622eac5551c6f099f148feb5256711ca34de Mon Sep 17 00:00:00 2001
From: 疯狂的狮子Li <15040126243@163.com>
Date: 星期二, 11 七月 2023 21:03:01 +0800
Subject: [PATCH] !25 部分优化以及新增功能 Merge pull request !25 from ahaos/tspr
---
src/components/BuildCode/render.vue | 62
src/assets/styles/index.scss | 7
src/views/system/user/profile/userAvatar.vue | 120
src/views/system/tenant/index.vue | 284 +-
src/views/system/user/authRole.vue | 78
src/views/monitor/logininfor/index.vue | 76
src/views/monitor/operlog/index.vue | 214
src/plugins/modal.ts | 30
src/assets/styles/ruoyi.scss | 4
src/views/register.vue | 125
.eslintrc.js | 3
src/views/system/role/authUser.vue | 80
src/plugins/tab.ts | 49
src/views/system/tenantPackage/index.vue | 347 +-
src/components/BuildCode/index.vue | 64
src/components/ImageUpload/index.vue | 33
src/views/monitor/cache/index.vue | 7
src/types/router.d.ts | 8
src/views/system/post/index.vue | 179
src/views/system/user/profile/index.vue | 4
src/views/tool/gen/basicInfoForm.vue | 17
src/views/system/oss/index.vue | 296 +-
src/components/Breadcrumb/index.vue | 38
src/components/Pagination/index.vue | 54
src/layout/components/topBar/search.vue | 158 +
src/components/Hamburger/index.vue | 11
src/views/tool/gen/index.vue | 198
src/layout/components/TagsView/ScrollPane.vue | 13
src/views/system/notice/index.vue | 178
src/components/FileUpload/index.vue | 60
src/components/ImagePreview/index.vue | 58
src/layout/components/Settings/index.vue | 23
src/views/system/dict/index.vue | 212
src/views/system/config/index.vue | 208
src/views/system/role/index.vue | 430 ++-
src/types/element.d.ts | 36
src/views/system/oss/config.vue | 330 +-
src/types/vform3-builds.d.ts | 4
src/layout/components/Navbar.vue | 70
src/types/global.d.ts | 26
src/assets/styles/variables.module.scss | 65
src/components/Editor/index.vue | 202
src/views/system/menu/index.vue | 205
src/views/error/401.vue | 1
src/views/system/dict/data.vue | 228 +-
src/views/system/role/selectUser.vue | 69
src/views/tool/gen/editTable.vue | 15
src/views/tool/gen/importTable.vue | 87
src/components/HeaderSearch/index.vue | 80
src/assets/styles/sidebar.scss | 4
src/components/DictTag/index.vue | 7
src/views/system/dept/index.vue | 223 +-
.eslintrc-auto-import.json | 31
src/store/modules/tagsView.ts | 8
src/views/demo/tree/index.vue | 42
src/components/SvgIcon/index.vue | 17
src/components/RightToolbar/index.vue | 18
src/layout/components/TagsView/index.vue | 17
src/views/monitor/online/index.vue | 71
src/api/system/user/index.ts | 73
src/types/module.d.ts | 26
src/components/TreeSelect/index.vue | 76
src/components/IconSelect/index.vue | 12
src/views/system/user/index.vue | 425 +-
src/views/login.vue | 13
src/views/tool/gen/genInfoForm.vue | 24
src/layout/components/IframeToggle/index.vue | 2
src/views/system/user/profile/userInfo.vue | 46
src/components/iFrame/index.vue | 7
src/utils/propTypes.ts | 25
src/views/demo/demo/index.vue | 80
package.json | 6
src/views/system/user/profile/resetPwd.vue | 56
73 files changed, 3,434 insertions(+), 3,021 deletions(-)
diff --git a/.eslintrc-auto-import.json b/.eslintrc-auto-import.json
index d076c08..a6661b6 100644
--- a/.eslintrc-auto-import.json
+++ b/.eslintrc-auto-import.json
@@ -1,5 +1,36 @@
{
"globals": {
+ "ComponentInternalInstance": true,
+ "TransferKey": true,
+ "ElFormRules": true,
+ "CheckboxValueType": true,
+ "PropType": true,
+ "DateModelType": true,
+ "UploadFile": true,
+ "ElFormInstance": true,
+ "ElTableInstance": true,
+ "ElTreeInstance": true,
+ "ElTreeSelectInstance": true,
+ "ElSelectInstance": true,
+ "ElUploadInstance": true,
+ "ElCardInstance": true,
+ "ElDialogInstance": true,
+ "ElInputInstance": true,
+ "ElInputNumberInstance": true,
+ "ElRadioInstance": true,
+ "ElRadioGroupInstance": true,
+ "ElRadioButtonInstance": true,
+ "ElCheckboxInstance": true,
+ "ElCheckboxGroupInstance": true,
+ "ElSwitchInstance": true,
+ "ElDatePickerInstance": true,
+ "ElTimePickerInstance": true,
+ "ElTimeSelectInstance": true,
+ "ElScrollbarInstance": true,
+ "ElCascaderInstance": true,
+ "ElColorPickerInstance": true,
+ "ElRateInstance": true,
+ "ElSliderInstance": true,
"useRouter": true,
"useRoute": true,
"EffectScope": true,
diff --git a/.eslintrc.js b/.eslintrc.js
index 2b2e0d0..b6b10a6 100644
--- a/.eslintrc.js
+++ b/.eslintrc.js
@@ -29,7 +29,8 @@
// 鍏抽棴绌虹被鍨嬫鏌� {}
extendDefaults: true,
types: {
- '{}': false
+ '{}': false,
+ 'Function': false
}
}
]
diff --git a/package.json b/package.json
index 98195b8..039083c 100644
--- a/package.json
+++ b/package.json
@@ -35,10 +35,12 @@
"path-to-regexp": "6.2.0",
"pinia": "2.0.22",
"screenfull": "6.0.0",
+ "vform3-builds": "3.0.8",
"vue": "3.2.45",
"vue-cropper": "1.0.3",
"vue-i18n": "9.2.2",
- "vue-router": "4.1.4"
+ "vue-router": "4.1.4",
+ "vue-types": "^5.0.3"
},
"devDependencies": {
"@iconify/json": "^2.2.40",
@@ -71,11 +73,11 @@
"unplugin-auto-import": "0.13.0",
"unplugin-icons": "0.15.1",
"unplugin-vue-components": "0.23.0",
+ "vite": "4.3.1",
"vite-plugin-compression": "0.5.1",
"vite-plugin-svg-icons": "2.0.1",
"vite-plugin-vue-setup-extend": "^0.4.0",
"vitest": "^0.29.7",
- "vite": "4.3.1",
"vue-eslint-parser": "9.1.0",
"vue-tsc": "0.35.0"
}
diff --git a/src/api/system/user/index.ts b/src/api/system/user/index.ts
index d9fc1bd..21325c3 100644
--- a/src/api/system/user/index.ts
+++ b/src/api/system/user/index.ts
@@ -9,64 +9,64 @@
* 鏌ヨ鐢ㄦ埛鍒楄〃
* @param query
*/
-export function listUser(query: UserQuery): AxiosPromise<UserVO[]> {
+export const listUser = (query: UserQuery): AxiosPromise<UserVO[]> => {
return request({
url: '/system/user/list',
method: 'get',
params: query
});
-}
+};
/**
* 鑾峰彇鐢ㄦ埛璇︽儏
* @param userId
*/
-export function getUser(userId?: string | number): AxiosPromise<UserInfoVO> {
+export const getUser = (userId?: string | number): AxiosPromise<UserInfoVO> => {
return request({
url: '/system/user/' + parseStrEmpty(userId),
method: 'get'
});
-}
+};
/**
* 鏂板鐢ㄦ埛
*/
-export function addUser(data: UserForm) {
+export const addUser = (data: UserForm) => {
return request({
url: '/system/user',
method: 'post',
data: data
});
-}
+};
/**
* 淇敼鐢ㄦ埛
*/
-export function updateUser(data: UserForm) {
+export const updateUser = (data: UserForm) => {
return request({
url: '/system/user',
method: 'put',
data: data
});
-}
+};
/**
* 鍒犻櫎鐢ㄦ埛
* @param userId 鐢ㄦ埛ID
*/
-export function delUser(userId: Array<string | number> | string | number) {
+export const delUser = (userId: Array<string | number> | string | number) => {
return request({
url: '/system/user/' + userId,
method: 'delete'
});
-}
+};
/**
* 鐢ㄦ埛瀵嗙爜閲嶇疆
* @param userId 鐢ㄦ埛ID
* @param password 瀵嗙爜
*/
-export function resetUserPwd(userId: string | number, password: string) {
+export const resetUserPwd = (userId: string | number, password: string) => {
const data = {
userId,
password
@@ -76,14 +76,14 @@
method: 'put',
data: data
});
-}
+};
/**
* 鐢ㄦ埛鐘舵�佷慨鏀�
* @param userId 鐢ㄦ埛ID
* @param status 鐢ㄦ埛鐘舵��
*/
-export function changeUserStatus(userId: number | string, status: string) {
+export const changeUserStatus = (userId: number | string, status: string) => {
const data = {
userId,
status
@@ -93,36 +93,36 @@
method: 'put',
data: data
});
-}
+};
/**
* 鏌ヨ鐢ㄦ埛涓汉淇℃伅
*/
-export function getUserProfile(): AxiosPromise<UserInfoVO> {
+export const getUserProfile = (): AxiosPromise<UserInfoVO> => {
return request({
url: '/system/user/profile',
method: 'get'
});
-}
+};
/**
* 淇敼鐢ㄦ埛涓汉淇℃伅
* @param data 鐢ㄦ埛淇℃伅
*/
-export function updateUserProfile(data: UserForm) {
+export const updateUserProfile = (data: UserForm) => {
return request({
url: '/system/user/profile',
method: 'put',
data: data
});
-}
+};
/**
* 鐢ㄦ埛瀵嗙爜閲嶇疆
* @param oldPassword 鏃у瘑鐮�
* @param newPassword 鏂板瘑鐮�
*/
-export function updateUserPwd(oldPassword: string, newPassword: string) {
+export const updateUserPwd = (oldPassword: string, newPassword: string) => {
const data = {
oldPassword,
newPassword
@@ -132,49 +132,66 @@
method: 'put',
params: data
});
-}
+};
/**
* 鐢ㄦ埛澶村儚涓婁紶
* @param data 澶村儚鏂囦欢
*/
-export function uploadAvatar(data: FormData) {
+export const uploadAvatar = (data: FormData) => {
return request({
url: '/system/user/profile/avatar',
method: 'post',
data: data
});
-}
+};
/**
* 鏌ヨ鎺堟潈瑙掕壊
* @param userId 鐢ㄦ埛ID
*/
-export function getAuthRole(userId: string | number): AxiosPromise<{ user: UserVO; roles: RoleVO[] }> {
+export const getAuthRole = (userId: string | number): AxiosPromise<{ user: UserVO; roles: RoleVO[] }> => {
return request({
url: '/system/user/authRole/' + userId,
method: 'get'
});
-}
+};
/**
* 淇濆瓨鎺堟潈瑙掕壊
* @param data 鐢ㄦ埛ID
*/
-export function updateAuthRole(data: { userId: string; roleIds: string }) {
+export const updateAuthRole = (data: { userId: string; roleIds: string }) => {
return request({
url: '/system/user/authRole',
method: 'put',
params: data
});
-}
+};
/**
* 鏌ヨ閮ㄩ棬涓嬫媺鏍戠粨鏋�
*/
-export function deptTreeSelect(): AxiosPromise<DeptVO[]> {
+export const deptTreeSelect = (): AxiosPromise<DeptVO[]> => {
return request({
url: '/system/user/deptTree',
method: 'get'
});
-}
+};
+
+export default {
+ listUser,
+ getUser,
+ addUser,
+ updateUser,
+ delUser,
+ resetUserPwd,
+ changeUserStatus,
+ getUserProfile,
+ updateUserProfile,
+ updateUserPwd,
+ uploadAvatar,
+ getAuthRole,
+ updateAuthRole,
+ deptTreeSelect
+};
diff --git a/src/assets/styles/index.scss b/src/assets/styles/index.scss
index e797f64..e31ea97 100644
--- a/src/assets/styles/index.scss
+++ b/src/assets/styles/index.scss
@@ -26,6 +26,10 @@
box-sizing: border-box;
}
+html.dark .svg-icon, html.dark svg {
+ fill: var(--el-text-color-regular);
+}
+
#app {
height: 100%;
}
@@ -137,6 +141,7 @@
border: 1px solid var(--el-border-color-light);
background-color: var(--el-bg-color-overlay);
padding: 0.75rem;
+ transition: all ease 0.3s;
&:hover {
box-shadow: 0 2px 12px #0000001a;
@@ -199,4 +204,4 @@
vertical-align: middle;
margin-bottom: 10px;
}
-}
\ No newline at end of file
+}
diff --git a/src/assets/styles/ruoyi.scss b/src/assets/styles/ruoyi.scss
index 2e00d00..d2ecb24 100644
--- a/src/assets/styles/ruoyi.scss
+++ b/src/assets/styles/ruoyi.scss
@@ -90,8 +90,8 @@
.el-table__fixed-header-wrapper {
th {
word-break: break-word;
- background-color: #f8f8f9 !important;
- color: #515a6e;
+ background-color: $table-header-bg !important;
+ color: $table-header-text-color;
height: 40px !important;
font-size: 13px;
}
diff --git a/src/assets/styles/sidebar.scss b/src/assets/styles/sidebar.scss
index 1db15fa..06bf057 100644
--- a/src/assets/styles/sidebar.scss
+++ b/src/assets/styles/sidebar.scss
@@ -84,7 +84,7 @@
.sub-menu-title-noDropdown,
.el-sub-menu__title {
&:hover {
- background-color: rgba(0, 0, 0, 0.06) !important;
+ background-color: $base-sub-menu-title-hover !important;
}
}
@@ -211,7 +211,7 @@
.el-menu-item {
&:hover {
// you can use $sub-menuHover
- background-color: rgba(0, 0, 0, 0.06) !important;
+ background-color: $base-menu-hover !important;
}
}
diff --git a/src/assets/styles/variables.module.scss b/src/assets/styles/variables.module.scss
index 639b23b..fdcb11c 100644
--- a/src/assets/styles/variables.module.scss
+++ b/src/assets/styles/variables.module.scss
@@ -1,3 +1,38 @@
+// 鍏ㄥ眬SCSS鍙橀噺
+:root {
+ --menuBg: #304156;
+ --menuColor: #bfcbd9;
+ --menuActiveText: #f4f4f5;
+ --menuHover: #263445;
+
+ --subMenuBg: #1f2d3d;
+ --subMenuActiveText: #f4f4f5;
+ --subMenuHover: #001528;
+ --subMenuTitleHover: #293444;
+
+ --tableHeaderBg: #f8f8f9;
+ --tableHeaderTextColor: #515a6e;
+}
+html.dark {
+ --menuBg: #1d1e1f;
+ --menuColor: #bfcbd9;
+ --menuActiveText: #f4f4f5;
+ --menuHover: #171819;
+
+ --subMenuBg: #1d1e1f;
+ --subMenuActiveText: #1d1e1f;
+ --subMenuHover: #171819;
+ --subMenuTitleHover: #171819;
+
+ --tableHeaderBg: var(--el-bg-color);
+ --tableHeaderTextColor: var(--el-text-color);
+
+ // 瑕嗙洊ele 楂樹寒褰撳墠琛岀殑鏍囧噯鏆楄壊
+ .el-tree-node__content {
+ --el-color-primary-light-9: #262727;
+ }
+}
+
// base color
$blue: #324157;
$light-blue: #3a71a8;
@@ -9,32 +44,22 @@
$panGreen: #30b08f;
// 榛樿鑿滃崟涓婚椋庢牸
-$base-menu-color: #bfcbd9;
-$base-menu-color-active: #f4f4f5;
-$base-menu-background: #304156;
+$base-menu-color: var(--menuColor);
+$base-menu-hover: var(--menuHover);
+$base-menu-color-active: var(--menuActiveText);
+$base-menu-background: var(--menuBg);
$base-logo-title-color: #ffffff;
$base-menu-light-color: rgba(0, 0, 0, 0.7);
$base-menu-light-background: #ffffff;
$base-logo-light-title-color: #001529;
-$base-sub-menu-background: #1f2d3d;
-$base-sub-menu-hover: #001528;
-
-// 鑷畾涔夋殫鑹茶彍鍗曢鏍�
-/**
-$base-menu-color:hsla(0,0%,100%,.65);
-$base-menu-color-active:#fff;
-$base-menu-background:#001529;
-$base-logo-title-color: #ffffff;
-
-$base-menu-light-color:rgba(0,0,0,.70);
-$base-menu-light-background:#ffffff;
-$base-logo-light-title-color: #001529;
-
-$base-sub-menu-background:#000c17;
-$base-sub-menu-hover:#001528;
-*/
+$base-sub-menu-background: var(--subMenuBg);
+$base-sub-menu-hover: var(--subMenuHover);
+$base-sub-menu-title-hover: var(--subMenuTitleHover);
+// 琛ㄥ崟澶磋儗鏅壊鍜屾爣棰橀鑹�
+$table-header-bg: var(--tableHeaderBg);
+$table-header-text-color: var(--tableHeaderTextColor);
$--color-primary: #409eff;
$--color-success: #67c23a;
diff --git a/src/components/Breadcrumb/index.vue b/src/components/Breadcrumb/index.vue
index 435d0cc..b96829a 100644
--- a/src/components/Breadcrumb/index.vue
+++ b/src/components/Breadcrumb/index.vue
@@ -18,34 +18,34 @@
const levelList = ref<RouteLocationMatched[]>([])
const getBreadcrumb = () => {
- // only show routes with meta.title
- let matched = route.matched.filter(item => item.meta && item.meta.title);
- const first = matched[0]
- // 鍒ゆ柇鏄惁涓洪椤�
- if (!isDashboard(first)) {
- matched = ([{ path: '/index', meta: { title: '棣栭〉' } }] as any).concat(matched)
- }
- levelList.value = matched.filter(item => item.meta && item.meta.title && item.meta.breadcrumb !== false)
+ // only show routes with meta.title
+ let matched = route.matched.filter(item => item.meta && item.meta.title);
+ const first = matched[0]
+ // 鍒ゆ柇鏄惁涓洪椤�
+ if (!isDashboard(first)) {
+ matched = ([{ path: '/index', meta: { title: '棣栭〉' } }] as any).concat(matched)
+ }
+ levelList.value = matched.filter(item => item.meta && item.meta.title && item.meta.breadcrumb !== false)
}
const isDashboard = (route: RouteLocationMatched) => {
- const name = route && route.name as string
- if (!name) {
- return false
- }
- return name.trim() === 'Index'
+ const name = route && route.name as string
+ if (!name) {
+ return false
+ }
+ return name.trim() === 'Index'
}
const handleLink = (item: RouteLocationMatched) => {
- const { redirect, path } = item
- redirect ? router.push(redirect as string) : router.push(path)
+ const { redirect, path } = item
+ redirect ? router.push(redirect as string) : router.push(path)
}
watchEffect(() => {
- // if you go to the redirect page, do not update the breadcrumbs
- if (route.path.startsWith('/redirect/')) return
- getBreadcrumb()
+ // if you go to the redirect page, do not update the breadcrumbs
+ if (route.path.startsWith('/redirect/')) return
+ getBreadcrumb()
})
onMounted(() => {
- getBreadcrumb();
+ getBreadcrumb();
})
</script>
diff --git a/src/components/BuildCode/index.vue b/src/components/BuildCode/index.vue
new file mode 100644
index 0000000..b23665c
--- /dev/null
+++ b/src/components/BuildCode/index.vue
@@ -0,0 +1,64 @@
+<!-- 浠ｇ爜鏋勫缓 -->
+<script setup lang="ts">
+
+const props = defineProps({
+ showBtn: {
+ type: Boolean,
+ default: false
+ },
+ formJson: {
+ type: Object,
+ default: undefined
+ }
+})
+const { proxy } = getCurrentInstance() as ComponentInternalInstance;
+const buildRef = ref();
+const emits = defineEmits(['reJson', 'saveDesign']);
+
+
+
+//鑾峰彇琛ㄥ崟json
+const getJson = () => {
+ const formJson = JSON.stringify(buildRef.value.getFormJson())
+ const fieldJson = JSON.stringify(buildRef.value.getFieldWidgets())
+ let data = {
+ formJson, fieldJson
+ }
+ emits("saveDesign", data)
+}
+
+onMounted(() => {
+ if (props.formJson) {
+ buildRef.value.setFormJson(props.formJson)
+ }
+})
+</script>
+
+<template>
+ <div>
+ <v-form-designer
+ class="build"
+ ref="buildRef"
+ :designer-config="{ importJsonButton: true, exportJsonButton: true, exportCodeButton: true, generateSFCButton: true, formTemplates: true }"
+ >
+ <template #customToolButtons v-if="showBtn">
+ <el-button link type="primary" icon="Select" @click="getJson">淇濆瓨</el-button>
+ </template>
+ </v-form-designer>
+ </div>
+</template>
+
+<style lang="scss">
+.build {
+ margin: 0 !important;
+ overflow-y: auto !important;
+
+ & header.main-header {
+ display: none;
+ }
+
+ & .right-toolbar-con {
+ text-align: right !important;
+ }
+}
+</style>
diff --git a/src/components/BuildCode/render.vue b/src/components/BuildCode/render.vue
new file mode 100644
index 0000000..5693ed8
--- /dev/null
+++ b/src/components/BuildCode/render.vue
@@ -0,0 +1,62 @@
+<!-- 鍔ㄦ�佽〃鍗曟覆鏌� -->
+<script setup name="Render">
+
+const props = defineProps({
+ formJson: {
+ type: [String, Object],
+ default: {}
+ },
+ formData: {
+ type: [String, Object],
+ default: {}
+ },
+ isView: {
+ type: Boolean,
+ default: false
+ }
+})
+
+const vFormRef = ref(null)
+// 鑾峰彇琛ㄥ崟鏁版嵁-寮傛
+const getFormData = () => {
+ return vFormRef.value.getFormData()
+}
+
+/**
+ * 璁剧疆琛ㄥ崟鍐呭
+ * @param {琛ㄥ崟閰嶇疆} formConf
+ * formConfig锛歿 formTemplate锛氳〃鍗曟ā鏉匡紝formData锛氳〃鍗曟暟鎹紝hiddenField锛氶渶瑕侀殣钘忕殑瀛楁瀛楃涓查泦鍚堬紝disabledField锛氶渶瑕佺鐢ㄧ殑鑷瀛楃涓查泦鍚坿
+ */
+const initForm = (formConf) => {
+ const { formTemplate, formData, hiddenField, disabledField } = toRaw(formConf)
+ if (formTemplate) {
+ vFormRef.value.setFormJson(formTemplate)
+ if (formData) {
+ vFormRef.value.setFormData(formData)
+ }
+ if (disabledField && disabledField.length > 0) {
+ setTimeout(() => {
+ vFormRef.value.disableWidgets(disabledField)
+ }, 200)
+ }
+ if (hiddenField && hiddenField.length > 0) {
+ setTimeout(() => {
+ vFormRef.value.hideWidgets(hiddenField)
+ }, 200)
+ }
+ if (props.isView) {
+ console.log(props.isView)
+ setTimeout(() => {
+ vFormRef.value.disableForm()
+ }, 100)
+ }
+ }
+}
+defineExpose({ getFormData, initForm })
+</script>
+
+<template>
+ <div class="">
+ <v-form-render ref="vFormRef" :form-json="formJson" :form-data="formData" />
+ </div>
+</template>
diff --git a/src/components/DictTag/index.vue b/src/components/DictTag/index.vue
index f27b16a..08aef21 100644
--- a/src/components/DictTag/index.vue
+++ b/src/components/DictTag/index.vue
@@ -24,7 +24,7 @@
</template>
<script setup lang="ts">
-import { PropType } from 'vue';
+import { propTypes } from '@/utils/propTypes';
const props = defineProps({
@@ -36,10 +36,7 @@
// 褰撳墠鐨勫��
value: [Number, String, Array] as PropType<number | string | Array<number | string>>,
// 褰撴湭鎵惧埌鍖归厤鐨勬暟鎹椂锛屾樉绀簐alue
- showValue: {
- type: Boolean as PropType<boolean>,
- default: true,
- },
+ showValue: propTypes.bool.def(true),
});
const values = computed(() => {
diff --git a/src/components/Editor/index.vue b/src/components/Editor/index.vue
index a0728eb..b5b1526 100644
--- a/src/components/Editor/index.vue
+++ b/src/components/Editor/index.vue
@@ -30,152 +30,139 @@
import { QuillEditor, Quill } from '@vueup/vue-quill';
import '@vueup/vue-quill/dist/vue-quill.snow.css';
import { getToken } from "@/utils/auth";
-import { ComponentInternalInstance } from "vue";
+import { propTypes } from '@/utils/propTypes';
const props = defineProps({
- /* 缂栬緫鍣ㄧ殑鍐呭 */
- modelValue: {
- type: String,
- },
- /* 楂樺害 */
- height: {
- type: Number,
- default: null,
- },
- /* 鏈�灏忛珮搴� */
- minHeight: {
- type: Number,
- default: null,
- },
- /* 鍙 */
- readOnly: {
- type: Boolean,
- default: false,
- },
- /* 涓婁紶鏂囦欢澶у皬闄愬埗(MB) */
- fileSize: {
- type: Number,
- default: 5,
- },
- /* 绫诲瀷锛坆ase64鏍煎紡銆乽rl鏍煎紡锛� */
- type: {
- type: String,
- default: "url",
- }
+ /* 缂栬緫鍣ㄧ殑鍐呭 */
+ modelValue: propTypes.string,
+ /* 楂樺害 */
+ height: propTypes.number.def(400),
+ /* 鏈�灏忛珮搴� */
+ minHeight: propTypes.number.def(400),
+ /* 鍙 */
+ readOnly: propTypes.bool.def(false),
+ /* 涓婁紶鏂囦欢澶у皬闄愬埗(MB) */
+ fileSize: propTypes.number.def(5),
+ /* 绫诲瀷锛坆ase64鏍煎紡銆乽rl鏍煎紡锛� */
+ type: propTypes.string.def('url')
});
const { proxy } = getCurrentInstance() as ComponentInternalInstance;
const upload = reactive<UploadOption>({
- headers: { Authorization: "Bearer " + getToken() },
- url: import.meta.env.VITE_APP_BASE_API + '/resource/oss/upload'
+ headers: { Authorization: "Bearer " + getToken() },
+ url: import.meta.env.VITE_APP_BASE_API + '/resource/oss/upload'
})
const myQuillEditor = ref();
const options = ref({
- theme: "snow",
- bounds: document.body,
- debug: "warn",
- modules: {
- // 宸ュ叿鏍忛厤缃�
- toolbar: {
- container: [
- ["bold", "italic", "underline", "strike"], // 鍔犵矖 鏂滀綋 涓嬪垝绾� 鍒犻櫎绾�
- ["blockquote", "code-block"], // 寮曠敤 浠ｇ爜鍧�
- [{ list: "ordered" }, { list: "bullet"} ], // 鏈夊簭銆佹棤搴忓垪琛�
- [{ indent: "-1" }, { indent: "+1" }], // 缂╄繘
- [{ size: ["small", false, "large", "huge"] }], // 瀛椾綋澶у皬
- [{ header: [1, 2, 3, 4, 5, 6, false] }], // 鏍囬
- [{ color: [] }, { background: [] }], // 瀛椾綋棰滆壊銆佸瓧浣撹儗鏅鑹�
- [{ align: [] }], // 瀵归綈鏂瑰紡
- ["clean"], // 娓呴櫎鏂囨湰鏍煎紡
- ["link", "image", "video"] // 閾炬帴銆佸浘鐗囥�佽棰�
- ],
- handlers: {
- image: function (value: any) {
- if (value) {
- // 璋冪敤element鍥剧墖涓婁紶
- (document.querySelector(".editor-img-uploader>.el-upload") as HTMLDivElement)?.click();
- } else {
- Quill.format("image", true);
- }
- },
- },
- }
- },
- placeholder: '璇疯緭鍏ュ唴瀹�',
- readOnly: props.readOnly,
+ theme: "snow",
+ bounds: document.body,
+ debug: "warn",
+ modules: {
+ // 宸ュ叿鏍忛厤缃�
+ toolbar: {
+ container: [
+ ["bold", "italic", "underline", "strike"], // 鍔犵矖 鏂滀綋 涓嬪垝绾� 鍒犻櫎绾�
+ ["blockquote", "code-block"], // 寮曠敤 浠ｇ爜鍧�
+ [{ list: "ordered" }, { list: "bullet" }], // 鏈夊簭銆佹棤搴忓垪琛�
+ [{ indent: "-1" }, { indent: "+1" }], // 缂╄繘
+ [{ size: ["small", false, "large", "huge"] }], // 瀛椾綋澶у皬
+ [{ header: [1, 2, 3, 4, 5, 6, false] }], // 鏍囬
+ [{ color: [] }, { background: [] }], // 瀛椾綋棰滆壊銆佸瓧浣撹儗鏅鑹�
+ [{ align: [] }], // 瀵归綈鏂瑰紡
+ ["clean"], // 娓呴櫎鏂囨湰鏍煎紡
+ ["link", "image", "video"] // 閾炬帴銆佸浘鐗囥�佽棰�
+ ],
+ handlers: {
+ image: function (value: any) {
+ if (value) {
+ // 璋冪敤element鍥剧墖涓婁紶
+ (document.querySelector(".editor-img-uploader>.el-upload") as HTMLDivElement)?.click();
+ } else {
+ Quill.format("image", true);
+ }
+ },
+ },
+ }
+ },
+ placeholder: '璇疯緭鍏ュ唴瀹�',
+ readOnly: props.readOnly,
});
const styles = computed(() => {
- let style: any = {};
- if (props.minHeight) {
- style.minHeight = `${props.minHeight}px`;
- }
- if (props.height) {
- style.height = `${props.height}px`;
- }
- return style;
+ let style: any = {};
+ if (props.minHeight) {
+ style.minHeight = `${props.minHeight}px`;
+ }
+ if (props.height) {
+ style.height = `${props.height}px`;
+ }
+ return style;
})
const content = ref("");
watch(() => props.modelValue, (v) => {
- if (v !== content.value) {
- content.value = v === undefined ? "<p></p>" : v;
- }
+ if (v !== content.value) {
+ content.value = v === undefined ? "<p></p>" : v;
+ }
}, { immediate: true });
// 鍥剧墖涓婁紶鎴愬姛杩斿洖鍥剧墖鍦板潃
const handleUploadSuccess = (res: any) => {
- // 鑾峰彇瀵屾枃鏈疄渚�
- let quill = toRaw(myQuillEditor.value).getQuill();
- // 濡傛灉涓婁紶鎴愬姛
- if (res.code === 200) {
- // 鑾峰彇鍏夋爣浣嶇疆
- let length = quill.selection.savedRange.index;
- // 鎻掑叆鍥剧墖锛宺es涓烘湇鍔″櫒杩斿洖鐨勫浘鐗囬摼鎺ュ湴鍧�
- quill.insertEmbed(length, "image", res.data.url);
- // 璋冩暣鍏夋爣鍒版渶鍚�
- quill.setSelection(length + 1);
- proxy?.$modal.closeLoading();
- } else {
- proxy?.$modal.loading(res.msg);
- proxy?.$modal.closeLoading();
- }
+ // 鑾峰彇瀵屾枃鏈疄渚�
+ let quill = toRaw(myQuillEditor.value).getQuill();
+ // 濡傛灉涓婁紶鎴愬姛
+ if (res.code === 200) {
+ // 鑾峰彇鍏夋爣浣嶇疆
+ let length = quill.selection.savedRange.index;
+ // 鎻掑叆鍥剧墖锛宺es涓烘湇鍔″櫒杩斿洖鐨勫浘鐗囬摼鎺ュ湴鍧�
+ quill.insertEmbed(length, "image", res.data.url);
+ // 璋冩暣鍏夋爣鍒版渶鍚�
+ quill.setSelection(length + 1);
+ proxy?.$modal.closeLoading();
+ } else {
+ proxy?.$modal.loading(res.msg);
+ proxy?.$modal.closeLoading();
+ }
}
// 鍥剧墖涓婁紶鍓嶆嫤鎴�
const handleBeforeUpload = (file: any) => {
- // 鏍℃鏂囦欢澶у皬
- if (props.fileSize) {
- const isLt = file.size / 1024 / 1024 < props.fileSize;
- if (!isLt) {
- proxy?.$modal.msgError(`涓婁紶鏂囦欢澶у皬涓嶈兘瓒呰繃 ${props.fileSize} MB!`);
- return false;
- }
+ // 鏍℃鏂囦欢澶у皬
+ if (props.fileSize) {
+ const isLt = file.size / 1024 / 1024 < props.fileSize;
+ if (!isLt) {
+ proxy?.$modal.msgError(`涓婁紶鏂囦欢澶у皬涓嶈兘瓒呰繃 ${props.fileSize} MB!`);
+ return false;
}
- proxy?.$modal.loading('姝ｅ湪涓婁紶鏂囦欢锛岃绋嶅��...');
- return true;
+ }
+ proxy?.$modal.loading('姝ｅ湪涓婁紶鏂囦欢锛岃绋嶅��...');
+ return true;
}
// 鍥剧墖澶辫触鎷︽埅
const handleUploadError = (err: any) => {
- console.error(err);
- proxy?.$modal.msgError('涓婁紶鏂囦欢澶辫触');
+ console.error(err);
+ proxy?.$modal.msgError('涓婁紶鏂囦欢澶辫触');
}
</script>
<style>
-.editor, .ql-toolbar {
+.editor,
+.ql-toolbar {
white-space: pre-wrap !important;
line-height: normal !important;
}
+
.quill-img {
display: none;
}
+
.ql-snow .ql-tooltip[data-mode="link"]::before {
content: "璇疯緭鍏ラ摼鎺ュ湴鍧�:";
}
+
.ql-snow .ql-tooltip.ql-editing a.ql-action::after {
border-right: 0;
content: "淇濆瓨";
@@ -190,14 +177,17 @@
.ql-snow .ql-picker.ql-size .ql-picker-item::before {
content: "14px";
}
+
.ql-snow .ql-picker.ql-size .ql-picker-label[data-value="small"]::before,
.ql-snow .ql-picker.ql-size .ql-picker-item[data-value="small"]::before {
content: "10px";
}
+
.ql-snow .ql-picker.ql-size .ql-picker-label[data-value="large"]::before,
.ql-snow .ql-picker.ql-size .ql-picker-item[data-value="large"]::before {
content: "18px";
}
+
.ql-snow .ql-picker.ql-size .ql-picker-label[data-value="huge"]::before,
.ql-snow .ql-picker.ql-size .ql-picker-item[data-value="huge"]::before {
content: "32px";
@@ -207,26 +197,32 @@
.ql-snow .ql-picker.ql-header .ql-picker-item::before {
content: "鏂囨湰";
}
+
.ql-snow .ql-picker.ql-header .ql-picker-label[data-value="1"]::before,
.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="1"]::before {
content: "鏍囬1";
}
+
.ql-snow .ql-picker.ql-header .ql-picker-label[data-value="2"]::before,
.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="2"]::before {
content: "鏍囬2";
}
+
.ql-snow .ql-picker.ql-header .ql-picker-label[data-value="3"]::before,
.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="3"]::before {
content: "鏍囬3";
}
+
.ql-snow .ql-picker.ql-header .ql-picker-label[data-value="4"]::before,
.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="4"]::before {
content: "鏍囬4";
}
+
.ql-snow .ql-picker.ql-header .ql-picker-label[data-value="5"]::before,
.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="5"]::before {
content: "鏍囬5";
}
+
.ql-snow .ql-picker.ql-header .ql-picker-label[data-value="6"]::before,
.ql-snow .ql-picker.ql-header .ql-picker-item[data-value="6"]::before {
content: "鏍囬6";
@@ -236,10 +232,12 @@
.ql-snow .ql-picker.ql-font .ql-picker-item::before {
content: "鏍囧噯瀛椾綋";
}
+
.ql-snow .ql-picker.ql-font .ql-picker-label[data-value="serif"]::before,
.ql-snow .ql-picker.ql-font .ql-picker-item[data-value="serif"]::before {
content: "琛嚎瀛椾綋";
}
+
.ql-snow .ql-picker.ql-font .ql-picker-label[data-value="monospace"]::before,
.ql-snow .ql-picker.ql-font .ql-picker-item[data-value="monospace"]::before {
content: "绛夊瀛椾綋";
diff --git a/src/components/FileUpload/index.vue b/src/components/FileUpload/index.vue
index a46d5ee..32e871f 100644
--- a/src/components/FileUpload/index.vue
+++ b/src/components/FileUpload/index.vue
@@ -45,31 +45,18 @@
<script setup lang="ts">
import { getToken } from "@/utils/auth";
import { listByIds, delOss } from "@/api/system/oss";
-import { ComponentInternalInstance } from "vue";
-import { ElUpload, UploadFile } from "element-plus";
+import { propTypes } from '@/utils/propTypes';
const props = defineProps({
modelValue: [String, Object, Array],
// 鏁伴噺闄愬埗
- limit: {
- type: Number,
- default: 5,
- },
+ limit: propTypes.number.def(5),
// 澶у皬闄愬埗(MB)
- fileSize: {
- type: Number,
- default: 5,
- },
+ fileSize: propTypes.number.def(5),
// 鏂囦欢绫诲瀷, 渚嬪['png', 'jpg', 'jpeg']
- fileType: {
- type: Array,
- default: () => ["doc", "xls", "ppt", "txt", "pdf"],
- },
+ fileType: propTypes.array.def(["doc", "xls", "ppt", "txt", "pdf"]),
// 鏄惁鏄剧ず鎻愮ず
- isShowTip: {
- type: Boolean,
- default: true
- }
+ isShowTip: propTypes.bool.def(true),
});
const { proxy } = getCurrentInstance() as ComponentInternalInstance;
@@ -86,7 +73,7 @@
() => props.isShowTip && (props.fileType || props.fileSize)
);
-const fileUploadRef = ref(ElUpload);
+const fileUploadRef = ref<ElUploadInstance>();
watch(() => props.modelValue, async val => {
if (val) {
@@ -96,7 +83,7 @@
if (Array.isArray(val)) {
list = val;
} else {
- const res = await listByIds(val as string)
+ const res = await listByIds(val as string)
list = res.data.map((oss) => {
const data = { name: oss.originalName, url: oss.url, ossId: oss.ossId };
return data;
@@ -104,7 +91,7 @@
}
// 鐒跺悗灏嗘暟缁勮浆涓哄璞℃暟缁�
fileList.value = list.map(item => {
- item = {name: item.name, url: item.url, ossId: item.ossId};
+ item = { name: item.name, url: item.url, ossId: item.ossId };
item.uid = item.uid || new Date().getTime() + temp++;
return item;
});
@@ -112,7 +99,7 @@
fileList.value = [];
return [];
}
-},{ deep: true, immediate: true });
+}, { deep: true, immediate: true });
// 涓婁紶鍓嶆牎妫�鏍煎紡鍜屽ぇ灏�
const handleBeforeUpload = (file: any) => {
@@ -150,7 +137,7 @@
}
// 涓婁紶鎴愬姛鍥炶皟
-const handleUploadSuccess = (res:any, file: UploadFile) => {
+const handleUploadSuccess = (res: any, file: UploadFile) => {
if (res.code === 200) {
uploadList.value.push({ name: res.data.fileName, url: res.data.url, ossId: res.data.ossId });
uploadedSuccessfully();
@@ -158,7 +145,7 @@
number.value--;
proxy?.$modal.closeLoading();
proxy?.$modal.msgError(res.msg);
- fileUploadRef.value.handleRemove(file);
+ fileUploadRef.value?.handleRemove(file);
uploadedSuccessfully();
}
}
@@ -172,7 +159,7 @@
}
// 涓婁紶缁撴潫澶勭悊
-const uploadedSuccessfully =() => {
+const uploadedSuccessfully = () => {
if (number.value > 0 && uploadList.value.length === number.value) {
fileList.value = fileList.value.filter(f => f.url !== undefined).concat(uploadList.value);
uploadList.value = [];
@@ -207,21 +194,24 @@
<style scoped lang="scss">
.upload-file-uploader {
- margin-bottom: 5px;
+ margin-bottom: 5px;
}
+
.upload-file-list .el-upload-list__item {
- border: 1px solid #e4e7ed;
- line-height: 2;
- margin-bottom: 10px;
- position: relative;
+ border: 1px solid #e4e7ed;
+ line-height: 2;
+ margin-bottom: 10px;
+ position: relative;
}
+
.upload-file-list .ele-upload-list__item-content {
- display: flex;
- justify-content: space-between;
- align-items: center;
- color: inherit;
+ display: flex;
+ justify-content: space-between;
+ align-items: center;
+ color: inherit;
}
+
.ele-upload-list__item-content-action .el-link {
- margin-right: 10px;
+ margin-right: 10px;
}
</style>
diff --git a/src/components/Hamburger/index.vue b/src/components/Hamburger/index.vue
index fffcedf..489ac43 100644
--- a/src/components/Hamburger/index.vue
+++ b/src/components/Hamburger/index.vue
@@ -1,6 +1,6 @@
<template>
<div style="padding: 0 15px;" @click="toggleClick">
- <svg :class="{'is-active':isActive}" class="hamburger" viewBox="0 0 1024 1024" xmlns="http://www.w3.org/2000/svg" width="64" height="64">
+ <svg :class="{ 'is-active': isActive }" class="hamburger" viewBox="0 0 1024 1024" xmlns="http://www.w3.org/2000/svg" width="64" height="64">
<path
d="M408 442h480c4.4 0 8-3.6 8-8v-56c0-4.4-3.6-8-8-8H408c-4.4 0-8 3.6-8 8v56c0 4.4 3.6 8 8 8zm-8 204c0 4.4 3.6 8 8 8h480c4.4 0 8-3.6 8-8v-56c0-4.4-3.6-8-8-8H408c-4.4 0-8 3.6-8 8v56zm504-486H120c-4.4 0-8 3.6-8 8v56c0 4.4 3.6 8 8 8h784c4.4 0 8-3.6 8-8v-56c0-4.4-3.6-8-8-8zm0 632H120c-4.4 0-8 3.6-8 8v56c0 4.4 3.6 8 8 8h784c4.4 0 8-3.6 8-8v-56c0-4.4-3.6-8-8-8zM142.4 642.1L298.7 519a8.84 8.84 0 0 0 0-13.9L142.4 381.9c-5.8-4.6-14.4-.5-14.4 6.9v246.3a8.9 8.9 0 0 0 14.4 7z"
/>
@@ -9,16 +9,15 @@
</template>
<script setup lang="ts">
+import { propTypes } from '@/utils/propTypes';
+
defineProps({
- isActive: {
- type: Boolean,
- default: false
- }
+ isActive: propTypes.bool.def(false)
})
const emit = defineEmits(['toggleClick'])
const toggleClick = () => {
- emit('toggleClick');
+ emit('toggleClick');
}
</script>
diff --git a/src/components/HeaderSearch/index.vue b/src/components/HeaderSearch/index.vue
index 60ebb9d..9b0f2c6 100644
--- a/src/components/HeaderSearch/index.vue
+++ b/src/components/HeaderSearch/index.vue
@@ -17,12 +17,12 @@
</div>
</template>
-<script setup lang="ts">
-import Fuse from 'fuse.js'
-import { getNormalPath } from '@/utils/ruoyi'
-import { isHttp } from '@/utils/validate'
-import usePermissionStore from '@/store/modules/permission'
-import { RouteOption } from 'vue-router'
+<script setup lang="ts" name="HeaderSearch">
+import Fuse from 'fuse.js';
+import { getNormalPath } from '@/utils/ruoyi';
+import { isHttp } from '@/utils/validate';
+import usePermissionStore from '@/store/modules/permission';
+import { RouteOption } from 'vue-router';
type Router = Array<{
path: string;
@@ -34,7 +34,7 @@
const searchPool = ref<Router>([]);
const show = ref(false);
const fuse = ref();
-const headerSearchSelectRef = ref(ElSelect);
+const headerSearchSelectRef = ref<ElSelectInstance>();
const router = useRouter();
const routes = computed(() => usePermissionStore().routes);
@@ -123,9 +123,9 @@
searchPool.value = generateRoutes(routes.value);
})
-watchEffect(() => {
- searchPool.value = generateRoutes(routes.value)
-})
+// watchEffect(() => {
+// searchPool.value = generateRoutes(routes.value)
+// })
watch(show, (value) => {
if (value) {
@@ -142,40 +142,40 @@
<style lang="scss" scoped>
.header-search {
- font-size: 0 !important;
+ font-size: 0 !important;
- .search-icon {
- cursor: pointer;
- font-size: 18px;
- vertical-align: middle;
- }
-
- .header-search-select {
- font-size: 18px;
- transition: width 0.2s;
- width: 0;
- overflow: hidden;
- background: transparent;
- border-radius: 0;
- display: inline-block;
- vertical-align: middle;
-
- :deep(.el-input__inner) {
- border-radius: 0;
- border: 0;
- padding-left: 0;
- padding-right: 0;
- box-shadow: none !important;
- border-bottom: 1px solid #d9d9d9;
- vertical-align: middle;
+ .search-icon {
+ cursor: pointer;
+ font-size: 18px;
+ vertical-align: middle;
}
- }
- &.show {
.header-search-select {
- width: 210px;
- margin-left: 10px;
+ font-size: 18px;
+ transition: width 0.2s;
+ width: 0;
+ overflow: hidden;
+ background: transparent;
+ border-radius: 0;
+ display: inline-block;
+ vertical-align: middle;
+
+ :deep(.el-input__inner) {
+ border-radius: 0;
+ border: 0;
+ padding-left: 0;
+ padding-right: 0;
+ box-shadow: none !important;
+ border-bottom: 1px solid #d9d9d9;
+ vertical-align: middle;
+ }
}
- }
+
+ &.show {
+ .header-search-select {
+ width: 210px;
+ margin-left: 10px;
+ }
+ }
}
</style>
diff --git a/src/components/IconSelect/index.vue b/src/components/IconSelect/index.vue
index 22b9484..c53b437 100644
--- a/src/components/IconSelect/index.vue
+++ b/src/components/IconSelect/index.vue
@@ -31,17 +31,11 @@
<script setup lang="ts">
import icons from '@/components/IconSelect/requireIcons';
+import { propTypes } from '@/utils/propTypes';
const props = defineProps({
- modelValue: {
- type: String,
- require: true
- },
- width: {
- type: String,
- require: false,
- default: '400px'
- }
+ modelValue: propTypes.string.isRequired,
+ width: propTypes.string.def('400px')
});
const emit = defineEmits(['update:modelValue']);
diff --git a/src/components/ImagePreview/index.vue b/src/components/ImagePreview/index.vue
index 57019e3..723ccdb 100644
--- a/src/components/ImagePreview/index.vue
+++ b/src/components/ImagePreview/index.vue
@@ -9,47 +9,46 @@
</template>
<script setup lang="ts">
+import { propTypes } from '@/utils/propTypes';
+
const props = defineProps({
- src: {
- type: String,
- default: ""
- },
- width: {
- type: [Number, String],
- default: ""
- },
- height: {
- type: [Number, String],
- default: ""
- }
+ src: propTypes.string.def(''),
+ width: {
+ type: [Number, String],
+ default: ""
+ },
+ height: {
+ type: [Number, String],
+ default: ""
+ }
});
const realSrc = computed(() => {
- if (!props.src) {
- return;
- }
- let real_src = props.src.split(",")[0];
- return real_src;
+ if (!props.src) {
+ return;
+ }
+ let real_src = props.src.split(",")[0];
+ return real_src;
});
const realSrcList = computed(() => {
- if (!props.src) {
- return;
- }
- let real_src_list = props.src.split(",");
- let srcList:string[] = [];
- real_src_list.forEach(item => {
- return srcList.push(item);
- });
- return srcList;
+ if (!props.src) {
+ return;
+ }
+ let real_src_list = props.src.split(",");
+ let srcList: string[] = [];
+ real_src_list.forEach(item => {
+ return srcList.push(item);
+ });
+ return srcList;
});
const realWidth = computed(() =>
- typeof props.width == "string" ? props.width : `${props.width}px`
+ typeof props.width == "string" ? props.width : `${props.width}px`
);
const realHeight = computed(() =>
- typeof props.height == "string" ? props.height : `${props.height}px`
+ typeof props.height == "string" ? props.height : `${props.height}px`
);
</script>
@@ -58,13 +57,16 @@
border-radius: 5px;
background-color: #ebeef5;
box-shadow: 0 0 5px 1px #ccc;
+
:deep(.el-image__inner) {
transition: all 0.3s;
cursor: pointer;
+
&:hover {
transform: scale(1.2);
}
}
+
:deep(.image-slot) {
display: flex;
justify-content: center;
diff --git a/src/components/ImageUpload/index.vue b/src/components/ImageUpload/index.vue
index 0791f3e..01edc4f 100644
--- a/src/components/ImageUpload/index.vue
+++ b/src/components/ImageUpload/index.vue
@@ -17,7 +17,9 @@
:on-preview="handlePictureCardPreview"
:class="{ hide: fileList.length >= limit }"
>
- <el-icon class="avatar-uploader-icon"><plus /></el-icon>
+ <el-icon class="avatar-uploader-icon">
+ <plus />
+ </el-icon>
</el-upload>
<!-- 涓婁紶鎻愮ず -->
<div class="el-upload__tip" v-if="showTip">
@@ -42,25 +44,16 @@
import { listByIds, delOss } from "@/api/system/oss";
import { ComponentInternalInstance, PropType } from "vue";
import { OssVO } from "@/api/system/oss/types";
-import { ElUpload, UploadFile } from "element-plus";
+import { propTypes } from '@/utils/propTypes';
const props = defineProps({
modelValue: [String, Object, Array],
// 鍥剧墖鏁伴噺闄愬埗
- limit: {
- type: Number,
- default: 5,
- },
+ limit: propTypes.number.def(5),
// 澶у皬闄愬埗(MB)
- fileSize: {
- type: Number,
- default: 5,
- },
+ fileSize: propTypes.number.def(5),
// 鏂囦欢绫诲瀷, 渚嬪['png', 'jpg', 'jpeg']
- fileType: {
- type: Array as PropType<string[]>,
- default: () => ["png", "jpg", "jpeg"],
- },
+ fileType: propTypes.array.def(["png", "jpg", "jpeg"]),
// 鏄惁鏄剧ず鎻愮ず
isShowTip: {
type: Boolean,
@@ -84,12 +77,12 @@
() => props.isShowTip && (props.fileType || props.fileSize)
);
-const imageUploadRef = ref(ElUpload);
+const imageUploadRef = ref<ElUploadInstance>();
watch(() => props.modelValue, async val => {
if (val) {
// 棣栧厛灏嗗�艰浆涓烘暟缁�
- let list:OssVO[] = [];
+ let list: OssVO[] = [];
if (Array.isArray(val)) {
list = val as OssVO[];
} else {
@@ -112,7 +105,7 @@
fileList.value = [];
return [];
}
-},{ deep: true, immediate: true });
+}, { deep: true, immediate: true });
/** 涓婁紶鍓峫oading鍔犺浇 */
const handleBeforeUpload = (file: any) => {
@@ -122,7 +115,7 @@
if (file.name.lastIndexOf(".") > -1) {
fileExtension = file.name.slice(file.name.lastIndexOf(".") + 1);
}
- isImg = props.fileType.some((type) => {
+ isImg = props.fileType.some((type: any) => {
if (file.type.indexOf(type) > -1) return true;
if (fileExtension && fileExtension.indexOf(type) > -1) return true;
return false;
@@ -161,7 +154,7 @@
number.value--;
proxy?.$modal.closeLoading();
proxy?.$modal.msgError(res.msg);
- imageUploadRef.value.handleRemove(file);
+ imageUploadRef.value?.handleRemove(file);
uploadedSuccessfully();
}
}
@@ -207,7 +200,7 @@
let strs = "";
separator = separator || ",";
for (let i in list) {
- if(undefined !== list[i].ossId && list[i].url.indexOf("blob:") !== 0) {
+ if (undefined !== list[i].ossId && list[i].url.indexOf("blob:") !== 0) {
strs += list[i].ossId + separator;
}
}
diff --git a/src/components/Pagination/index.vue b/src/components/Pagination/index.vue
index de7b02c..df73ceb 100644
--- a/src/components/Pagination/index.vue
+++ b/src/components/Pagination/index.vue
@@ -22,52 +22,23 @@
<script setup lang="ts">
import { scrollTo } from '@/utils/scroll-to'
-import { PropType } from "vue";
+import { propTypes } from "@/utils/propTypes";
const props = defineProps({
- total: {
- required: true,
- type: Number
- },
- page: {
- type: Number,
- default: 1
- },
- limit: {
- type: Number,
- default: 20
- },
+ total: propTypes.number,
+ page: propTypes.number.def(1),
+ limit: propTypes.number.def(20),
pageSizes: {
- type: Array as PropType<number[]>,
- default() {
- return [10, 20, 30, 50]
- }
+ type: Array as PropType<number[]>,
+ default: () => [10, 20, 30, 50]
},
// 绉诲姩绔〉鐮佹寜閽殑鏁伴噺绔粯璁ゅ��5
- pagerCount: {
- type: Number,
- default: document.body.clientWidth < 992 ? 5 : 7
- },
- layout: {
- type: String,
- default: 'total, sizes, prev, pager, next, jumper'
- },
- background: {
- type: Boolean,
- default: true
- },
- autoScroll: {
- type: Boolean,
- default: true
- },
- hidden: {
- type: Boolean,
- default: false
- },
- float: {
- type: String,
- default: 'right'
- }
+ pagerCount: propTypes.number.def(document.body.clientWidth < 992 ? 5 : 7),
+ layout: propTypes.string.def('total, sizes, prev, pager, next, jumper'),
+ background: propTypes.bool.def(true),
+ autoScroll: propTypes.bool.def(true),
+ hidden: propTypes.bool.def(false),
+ float: propTypes.string.def('right')
})
const emit = defineEmits(['update:page', 'update:limit', 'pagination']);
@@ -106,7 +77,6 @@
<style lang="scss" scoped>
.pagination-container {
- background: #fff;
padding: 32px 16px;
.el-pagination{
float: v-bind(float);
diff --git a/src/components/RightToolbar/index.vue b/src/components/RightToolbar/index.vue
index 20226d8..09036b7 100644
--- a/src/components/RightToolbar/index.vue
+++ b/src/components/RightToolbar/index.vue
@@ -18,25 +18,15 @@
</template>
<script setup lang="ts">
-import { TransferKey } from "element-plus";
-import { PropType } from "vue";
+import { propTypes } from '@/utils/propTypes';
const props = defineProps({
- showSearch: {
- type: Boolean,
- default: true,
- },
+ showSearch: propTypes.bool.def(true),
columns: {
type: Array as PropType<FieldOption[]>,
},
- search: {
- type: Boolean,
- default: true,
- },
- gutter: {
- type: Number,
- default: 10,
- },
+ search: propTypes.bool.def(true),
+ gutter: propTypes.number.def(10),
})
const emits = defineEmits(['update:showSearch', 'queryTable']);
diff --git a/src/components/SvgIcon/index.vue b/src/components/SvgIcon/index.vue
index f3562d7..3a7540f 100644
--- a/src/components/SvgIcon/index.vue
+++ b/src/components/SvgIcon/index.vue
@@ -5,19 +5,12 @@
</template>
<script setup lang="ts">
+import { propTypes } from '@/utils/propTypes';
+
const props = defineProps({
- iconClass: {
- type: String,
- required: true
- },
- className: {
- type: String,
- default: ''
- },
- color: {
- type: String,
- default: ''
- },
+ iconClass: propTypes.string.isRequired,
+ className: propTypes.string.def(''),
+ color: propTypes.string.def(''),
})
const iconName = computed(() => `#icon-${props.iconClass}`);
const svgClass = computed(() => {
diff --git a/src/components/TreeSelect/index.vue b/src/components/TreeSelect/index.vue
index 8f80377..3076804 100644
--- a/src/components/TreeSelect/index.vue
+++ b/src/components/TreeSelect/index.vue
@@ -29,94 +29,93 @@
</template>
<script setup lang="ts">
-import { ElTreeSelect } from 'element-plus'
const props = defineProps({
/* 閰嶇疆椤� */
objMap: {
- type: Object,
- default: () => {
- return {
- value: 'id', // ID瀛楁鍚�
- label: 'label', // 鏄剧ず鍚嶇О
- children: 'children' // 瀛愮骇瀛楁鍚�
+ type: Object,
+ default: () => {
+ return {
+ value: 'id', // ID瀛楁鍚�
+ label: 'label', // 鏄剧ず鍚嶇О
+ children: 'children' // 瀛愮骇瀛楁鍚�
+ }
}
- }
},
/* 鑷姩鏀惰捣 */
accordion: {
- type: Boolean,
- default: () => {
- return false
- }
+ type: Boolean,
+ default: () => {
+ return false
+ }
},
/**褰撳墠鍙屽悜鏁版嵁缁戝畾鐨勫�� */
value: {
- type: [String, Number],
- default: ''
+ type: [String, Number],
+ default: ''
},
/**褰撳墠鐨勬暟鎹� */
options: {
- type: Array,
- default: () => []
+ type: Array,
+ default: () => []
},
/**杈撳叆妗嗗唴閮ㄧ殑鏂囧瓧 */
placeholder: {
- type: String,
- default: ''
+ type: String,
+ default: ''
}
})
-const selectTree = ref(ElTreeSelect);
+const selectTree = ref<ElTreeSelectInstance>();
const emit = defineEmits(['update:value']);
const valueId = computed({
get: () => props.value,
set: (val) => {
- emit('update:value', val)
+ emit('update:value', val)
}
});
const valueTitle = ref('');
const defaultExpandedKey = ref<any[]>([]);
-function initHandle() {
+const initHandle = () => {
nextTick(() => {
- const selectedValue = valueId.value;
- if(selectedValue !== null && typeof (selectedValue) !== 'undefined') {
- const node = selectTree.value.getNode(selectedValue)
- if (node) {
- valueTitle.value = node.data[props.objMap.label]
- selectTree.value.setCurrentKey(selectedValue) // 璁剧疆榛樿閫変腑
- defaultExpandedKey.value = [selectedValue] // 璁剧疆榛樿灞曞紑
+ const selectedValue = valueId.value;
+ if (selectedValue !== null && typeof (selectedValue) !== 'undefined') {
+ const node = selectTree.value?.getNode(selectedValue)
+ if (node) {
+ valueTitle.value = node.data[props.objMap.label]
+ selectTree.value?.setCurrentKey(selectedValue) // 璁剧疆榛樿閫変腑
+ defaultExpandedKey.value = [selectedValue] // 璁剧疆榛樿灞曞紑
+ }
+ } else {
+ clearHandle()
}
- } else {
- clearHandle()
- }
})
}
-function handleNodeClick(node: any) {
+const handleNodeClick = (node: any) => {
valueTitle.value = node[props.objMap.label]
valueId.value = node[props.objMap.value];
defaultExpandedKey.value = [];
- selectTree.value.blur()
+ selectTree.value?.blur()
selectFilterData('')
}
-function selectFilterData(val: any) {
- selectTree.value.filter(val)
+const selectFilterData = (val: any) => {
+ selectTree.value?.filter(val)
}
-function filterNode(value: any, data: any) {
+const filterNode = (value: any, data: any) => {
if (!value) return true
return data[props.objMap['label']].indexOf(value) !== -1
}
-function clearHandle() {
+const clearHandle = () => {
valueTitle.value = ''
valueId.value = ''
defaultExpandedKey.value = [];
clearSelected()
}
-function clearSelected() {
+const clearSelected = () => {
const allNode = document.querySelectorAll('#tree-option .el-tree-node')
allNode.forEach((element) => element.classList.remove('is-current'))
}
@@ -132,6 +131,7 @@
<style lang="scss" scoped>
@import "@/assets/styles/variables.module.scss";
+
.el-scrollbar .el-scrollbar__view .el-select-dropdown__item {
padding: 0;
background-color: #fff;
diff --git a/src/components/iFrame/index.vue b/src/components/iFrame/index.vue
index 3d1cc7b..6679f08 100644
--- a/src/components/iFrame/index.vue
+++ b/src/components/iFrame/index.vue
@@ -5,11 +5,10 @@
</template>
<script setup lang="ts">
+import { propTypes } from '@/utils/propTypes';
+
const props = defineProps({
- src: {
- type: String,
- required: true
- }
+ src: propTypes.string.isRequired
})
const height = ref(document.documentElement.clientHeight - 94.5 + "px;")
diff --git a/src/layout/components/IframeToggle/index.vue b/src/layout/components/IframeToggle/index.vue
index 1a24ba6..9ffae00 100644
--- a/src/layout/components/IframeToggle/index.vue
+++ b/src/layout/components/IframeToggle/index.vue
@@ -16,4 +16,4 @@
const route = useRoute();
const tagsViewStore = useTagsViewStore()
-</script>
\ No newline at end of file
+</script>
diff --git a/src/layout/components/Navbar.vue b/src/layout/components/Navbar.vue
index 156011f..d001ea8 100644
--- a/src/layout/components/Navbar.vue
+++ b/src/layout/components/Navbar.vue
@@ -20,8 +20,13 @@
<template #prefix><svg-icon icon-class="company" class="el-input__icon input-icon" /></template>
</el-select>
- <header-search id="header-search" class="right-menu-item" />
-
+ <!-- <header-search id="header-search" class="right-menu-item" /> -->
+ <search-menu ref="searchMenuRef" />
+ <el-tooltip content="鎼滅储" effect="dark" placement="bottom">
+ <div class="right-menu-item hover-effect" @click="openSearchMenu">
+ <svg-icon class-name="search-icon" icon-class="search" />
+ </div>
+ </el-tooltip>
<el-tooltip content="Github" effect="dark" placement="bottom">
<ruo-yi-git id="ruoyi-git" class="right-menu-item hover-effect" />
</el-tooltip>
@@ -68,17 +73,18 @@
</template>
<script setup lang="ts">
-import useAppStore from '@/store/modules/app'
-import useUserStore from '@/store/modules/user'
-import useSettingsStore from '@/store/modules/settings'
+import SearchMenu from './topBar/search.vue';
+import useAppStore from '@/store/modules/app';
+import useUserStore from '@/store/modules/user';
+import useSettingsStore from '@/store/modules/settings';
import { getTenantList } from "@/api/login";
import { dynamicClear, dynamicTenant } from "@/api/system/tenant";
import { ComponentInternalInstance } from "vue";
import { TenantVO } from "@/api/types";
-const appStore = useAppStore()
-const userStore = useUserStore()
-const settingsStore = useSettingsStore()
+const appStore = useAppStore();
+const userStore = useUserStore();
+const settingsStore = useSettingsStore();
const { proxy } = getCurrentInstance() as ComponentInternalInstance;
@@ -89,46 +95,52 @@
const dynamic = ref(false);
// 绉熸埛寮�鍏�
const tenantEnabled = ref(true);
+// 鎼滅储鑿滃崟
+const searchMenuRef = ref<InstanceType<typeof SearchMenu>>();
+
+const openSearchMenu = () => {
+ searchMenuRef.value?.openSearch();
+}
// 鍔ㄦ�佸垏鎹�
const dynamicTenantEvent = async (tenantId: string) => {
- if (companyName.value != null && companyName.value !== '') {
- await dynamicTenant(tenantId);
- dynamic.value = true;
- proxy?.$tab.closeAllPage();
- proxy?.$router.push('/');
- }
+ if (companyName.value != null && companyName.value !== '') {
+ await dynamicTenant(tenantId);
+ dynamic.value = true;
+ proxy?.$tab.closeAllPage();
+ proxy?.$router.push('/');
+ }
}
const dynamicClearEvent = async () => {
- await dynamicClear();
- dynamic.value = false;
- proxy?.$tab.closeAllPage();
- proxy?.$router.push('/')
+ await dynamicClear();
+ dynamic.value = false;
+ proxy?.$tab.closeAllPage();
+ proxy?.$router.push('/');
}
/** 绉熸埛鍒楄〃 */
const initTenantList = async () => {
- const { data } = await getTenantList();
- tenantEnabled.value = data.tenantEnabled === undefined ? true : data.tenantEnabled;
- if (tenantEnabled.value) {
- tenantList.value = data.voList;
- }
+ const { data } = await getTenantList();
+ tenantEnabled.value = data.tenantEnabled === undefined ? true : data.tenantEnabled;
+ if (tenantEnabled.value) {
+ tenantList.value = data.voList;
+ }
}
defineExpose({
- initTenantList,
+ initTenantList,
})
const toggleSideBar = () => {
- appStore.toggleSideBar(false)
+ appStore.toggleSideBar(false);
}
const logout = async () => {
await ElMessageBox.confirm('纭畾娉ㄩ攢骞堕��鍑虹郴缁熷悧锛�', '鎻愮ず', {
- confirmButtonText: '纭畾',
- cancelButtonText: '鍙栨秷',
- type: 'warning'
+ confirmButtonText: '纭畾',
+ cancelButtonText: '鍙栨秷',
+ type: 'warning'
})
await userStore.logout()
location.href = import.meta.env.VITE_APP_CONTEXT_PATH + 'index';
@@ -169,7 +181,7 @@
height: 50px;
overflow: hidden;
position: relative;
- background: #fff;
+ //background: #fff;
box-shadow: 0 1px 4px rgba(0, 21, 41, 0.08);
.hamburger-container {
diff --git a/src/layout/components/Settings/index.vue b/src/layout/components/Settings/index.vue
index bf62b14..8eb7921 100644
--- a/src/layout/components/Settings/index.vue
+++ b/src/layout/components/Settings/index.vue
@@ -1,8 +1,7 @@
<template>
<el-drawer v-model="showSettings" :withHeader="false" direction="rtl" size="300px" close-on-click-modal>
- <div class="setting-drawer-title">
- <h3 class="drawer-title">涓婚椋庢牸璁剧疆</h3>
- </div>
+ <h3 class="drawer-title">涓婚椋庢牸璁剧疆</h3>
+
<div class="setting-drawer-block-checbox">
<div class="setting-drawer-block-checbox-item" @click="handleTheme('theme-dark')">
<img src="@/assets/images/dark.svg" alt="dark" />
@@ -35,6 +34,13 @@
<el-color-picker v-model="theme" :predefine="predefineColors" @change="themeChange" />
</span>
</div>
+ <div class="drawer-item">
+ <span>娣辫壊妯″紡</span>
+ <span class="comp-style">
+ <el-switch v-model="isDark" @change="toggleDark" class="drawer-switch" />
+ </span>
+ </div>
+
<el-divider />
<h3 class="drawer-title">绯荤粺甯冨眬閰嶇疆</h3>
@@ -102,7 +108,15 @@
const storeSettings = computed(() => settingsStore);
const predefineColors = ref(["#409EFF", "#ff4500", "#ff8c00", "#ffd700", "#90ee90", "#00ced1", "#1e90ff", "#c71585"]);
-/** 鏄惁闇�瑕乼opnav */
+// 鏄惁鏆楅粦妯″紡
+const isDark = useDark({
+ storageKey: 'useDarkKey',
+ valueDark: 'dark',
+ valueLight: 'light',
+});
+const toggleDark = () => useToggle(isDark);
+
+/** 鏄惁闇�瑕乼opNav */
const topNav = computed({
get: () => storeSettings.value.topNav,
set: (val) => {
@@ -234,7 +248,6 @@
}
.drawer-item {
- color: rgba(0, 0, 0, 0.65);
padding: 12px 0;
font-size: 14px;
diff --git a/src/layout/components/TagsView/ScrollPane.vue b/src/layout/components/TagsView/ScrollPane.vue
index e4624dc..b50c628 100644
--- a/src/layout/components/TagsView/ScrollPane.vue
+++ b/src/layout/components/TagsView/ScrollPane.vue
@@ -6,22 +6,21 @@
<script setup lang="ts">
import useTagsViewStore from '@/store/modules/tagsView'
-import { ElScrollbar } from 'element-plus';
import { TagView } from 'vue-router'
const tagAndTagSpacing = ref(4);
-const scrollContainerRef = ref(ElScrollbar)
-const scrollWrapper = computed(() => scrollContainerRef.value.$refs.wrapRef);
+const scrollContainerRef = ref<ElScrollbarInstance>()
+const scrollWrapper = computed(() => scrollContainerRef.value?.$refs.wrapRef as any);
onMounted(() => {
- scrollWrapper.value.addEventListener('scroll', emitScroll, true)
+ scrollWrapper.value?.addEventListener('scroll', emitScroll, true)
})
onBeforeUnmount(() => {
- scrollWrapper.value.removeEventListener('scroll', emitScroll)
+ scrollWrapper.value?.removeEventListener('scroll', emitScroll)
})
const handleScroll = (e: WheelEvent) => {
- const eventDelta = (e as any).wheelDelta || -e.deltaY * 40
+ const eventDelta = (e as any).wheelDelta || - e.deltaY * 40
const $scrollWrapper = scrollWrapper.value;
$scrollWrapper.scrollLeft = $scrollWrapper.scrollLeft + eventDelta / 4
}
@@ -34,7 +33,7 @@
const visitedViews = computed(() => tagsViewStore.visitedViews);
const moveToTarget = (currentTag: TagView) => {
- const $container = scrollContainerRef.value.$el
+ const $container = scrollContainerRef.value?.$el
const $containerWidth = $container.offsetWidth
const $scrollWrapper = scrollWrapper.value;
diff --git a/src/layout/components/TagsView/index.vue b/src/layout/components/TagsView/index.vue
index cbf0a84..8998ca1 100644
--- a/src/layout/components/TagsView/index.vue
+++ b/src/layout/components/TagsView/index.vue
@@ -125,6 +125,9 @@
}
const addTags = () => {
const { name } = route;
+ if(route.query.title) {
+ route.meta.title = route.query.title;
+ }
if (name) {
useTagsViewStore().addView(route);
if (route.meta.link) {
@@ -237,8 +240,8 @@
.tags-view-container {
height: 34px;
width: 100%;
- background: #fff;
- border-bottom: 1px solid #d8dce5;
+ background-color: var(--el-bg-color);
+ border: 1px solid var(--el-border-color-light);
box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.12), 0 0 3px 0 rgba(0, 0, 0, 0.04);
.tags-view-wrapper {
.tags-view-item {
@@ -247,13 +250,16 @@
cursor: pointer;
height: 26px;
line-height: 23px;
- border: 1px solid #d8dce5;
+ background-color: var(--el-bg-color);
+ border: 1px solid var(--el-border-color-light);
color: #495060;
- background: #fff;
padding: 0 8px;
font-size: 12px;
margin-left: 5px;
margin-top: 4px;
+ &:hover {
+ color: var(--el-color-primary);
+ }
&:first-of-type {
margin-left: 15px;
}
@@ -279,7 +285,7 @@
}
.contextmenu {
margin: 0;
- background: #fff;
+ background: var(--el-bg-color);
z-index: 3000;
position: absolute;
list-style-type: none;
@@ -287,7 +293,6 @@
border-radius: 4px;
font-size: 12px;
font-weight: 400;
- color: #333;
box-shadow: 2px 2px 3px 0 rgba(0, 0, 0, 0.3);
li {
margin: 0;
diff --git a/src/layout/components/topBar/search.vue b/src/layout/components/topBar/search.vue
new file mode 100644
index 0000000..9dee360
--- /dev/null
+++ b/src/layout/components/topBar/search.vue
@@ -0,0 +1,158 @@
+<template>
+ <div class="layout-search-dialog">
+ <el-dialog v-model="state.isShowSearch" destroy-on-close :show-close="false">
+ <template #footer>
+ <el-autocomplete
+ v-model="state.menuQuery"
+ :fetch-suggestions="menuSearch"
+ placeholder="鎼滅储"
+ ref="layoutMenuAutocompleteRef"
+ @select="onHandleSelect"
+ :fit-input-width="true"
+ >
+ <template #prefix>
+ <svg-icon class-name="search-icon" icon-class="search" />
+ </template>
+ <template #default="{ item }">
+ <div>
+ <svg-icon :icon-class="item.icon" class="mr5" />
+ {{ item.title }}
+ </div>
+ </template>
+ </el-autocomplete>
+ </template>
+ </el-dialog>
+ </div>
+</template>
+
+<script setup lang="ts" name="layoutBreadcrumbSearch">
+import { getNormalPath } from '@/utils/ruoyi';
+import { isHttp } from '@/utils/validate';
+import usePermissionStore from '@/store/modules/permission';
+import { RouteOption } from 'vue-router';
+type Router = Array<{
+ path: string;
+ icon: string;
+ title: string[];
+}>
+type SearchState<T = any> = {
+ isShowSearch: boolean;
+ menuQuery: string;
+ menuList: T[];
+};
+// 瀹氫箟鍙橀噺鍐呭
+const layoutMenuAutocompleteRef = ref();
+const router = useRouter();
+const routes = computed(() => usePermissionStore().routes);
+const state = reactive<SearchState>({
+ isShowSearch: false,
+ menuQuery: '',
+ menuList: [],
+});
+
+// 鎼滅储寮圭獥鎵撳紑
+const openSearch = () => {
+ state.menuQuery = '';
+ state.isShowSearch = true;
+ state.menuList = generateRoutes(routes.value);
+ nextTick(() => {
+ setTimeout(() => {
+ layoutMenuAutocompleteRef.value.focus();
+ });
+ });
+};
+// 鎼滅储寮圭獥鍏抽棴
+const closeSearch = () => {
+ state.isShowSearch = false;
+};
+// 鑿滃崟鎼滅储鏁版嵁杩囨护
+const menuSearch = (queryString: string, cb: Function) => {
+ let options = state.menuList.filter((item) => {
+ return item.title.indexOf(queryString) > -1;
+ });
+ cb(options);
+};
+
+// Filter out the routes that can be displayed in the sidebar
+// And generate the internationalized title
+const generateRoutes = (routes: RouteOption[], basePath = '', prefixTitle: string[] = []) => {
+ let res: Router = []
+ routes.forEach(r => {
+ // skip hidden router
+ if (!r.hidden) {
+ const p = r.path.length > 0 && r.path[0] === '/' ? r.path : '/' + r.path;
+ const data: any = {
+ path: !isHttp(r.path) ? getNormalPath(basePath + p) : r.path,
+ icon: r.meta?.icon,
+ title: [...prefixTitle]
+ }
+ if (r.meta && r.meta.title) {
+ data.title = [...data.title, r.meta.title];
+ if (r.redirect !== 'noRedirect') {
+ // only push the routes with title
+ // special case: need to exclude parent router without redirect
+ res.push(data);
+ }
+ }
+ // recursive child routes
+ if (r.children) {
+ const tempRoutes = generateRoutes(r.children, data.path, data.title);
+ if (tempRoutes.length >= 1) {
+ res = [...res, ...tempRoutes];
+ }
+ }
+ }
+ })
+ res.forEach((item: any) => {
+ if (item.title instanceof Array) {
+ item.title = item.title.join('/');
+ }
+ });
+ return res;
+}
+// 褰撳墠鑿滃崟閫変腑鏃�
+const onHandleSelect = (val: any) => {
+ const paths = val.path;
+ if (isHttp(paths)) {
+ // http(s):// 璺緞鏂扮獥鍙ｆ墦寮�
+ const pindex = paths.indexOf("http");
+ window.open(paths.substring(pindex, paths.length), "_blank");
+ } else {
+ router.push(paths);
+ }
+ state.menuQuery = ''
+ closeSearch();
+
+};
+
+// 鏆撮湶鍙橀噺
+defineExpose({
+ openSearch
+});
+</script>
+
+<style scoped lang="scss">
+.layout-search-dialog {
+ position: relative;
+ :deep(.el-dialog) {
+ .el-dialog__header,
+ .el-dialog__body {
+ display: none;
+ }
+ .el-dialog__footer {
+ width: 100%;
+ position: absolute;
+ left: 50%;
+ transform: translateX(-50%);
+ top: -53vh;
+ }
+ }
+ :deep(.el-autocomplete) {
+ width: 560px;
+ position: absolute;
+ top: 150px;
+ left: 50%;
+ transform: translateX(-50%);
+ }
+}
+</style>
diff --git a/src/plugins/modal.ts b/src/plugins/modal.ts
index 9526623..a8b0548 100644
--- a/src/plugins/modal.ts
+++ b/src/plugins/modal.ts
@@ -1,57 +1,57 @@
-import { ElMessage, ElMessageBox, ElNotification, ElLoading, MessageBoxData } from 'element-plus';
+import { MessageBoxData } from 'element-plus';
import { LoadingInstance } from 'element-plus/es/components/loading/src/loading';
let loadingInstance: LoadingInstance;
export default {
// 娑堟伅鎻愮ず
- msg(content: string) {
+ msg(content: any) {
ElMessage.info(content);
},
// 閿欒娑堟伅
- msgError(content: string) {
+ msgError(content: any) {
ElMessage.error(content);
},
// 鎴愬姛娑堟伅
- msgSuccess(content: string) {
+ msgSuccess(content: any) {
ElMessage.success(content);
},
// 璀﹀憡娑堟伅
- msgWarning(content: string) {
+ msgWarning(content: any) {
ElMessage.warning(content);
},
// 寮瑰嚭鎻愮ず
- alert(content: string) {
+ alert(content: any) {
ElMessageBox.alert(content, '绯荤粺鎻愮ず');
},
// 閿欒鎻愮ず
- alertError(content: string) {
+ alertError(content: any) {
ElMessageBox.alert(content, '绯荤粺鎻愮ず', { type: 'error' });
},
// 鎴愬姛鎻愮ず
- alertSuccess(content: string, s: string, p: { dangerouslyUseHTMLString: boolean }) {
+ alertSuccess(content: any) {
ElMessageBox.alert(content, '绯荤粺鎻愮ず', { type: 'success' });
},
// 璀﹀憡鎻愮ず
- alertWarning(content: string) {
+ alertWarning(content: any) {
ElMessageBox.alert(content, '绯荤粺鎻愮ず', { type: 'warning' });
},
// 閫氱煡鎻愮ず
- notify(content: string) {
+ notify(content: any) {
ElNotification.info(content);
},
// 閿欒閫氱煡
- notifyError(content: string) {
+ notifyError(content: any) {
ElNotification.error(content);
},
// 鎴愬姛閫氱煡
- notifySuccess(content: string) {
+ notifySuccess(content: any) {
ElNotification.success(content);
},
// 璀﹀憡閫氱煡
- notifyWarning(content: string) {
+ notifyWarning(content: any) {
ElNotification.warning(content);
},
// 纭绐椾綋
- confirm(content: string): Promise<MessageBoxData> {
+ confirm(content: any): Promise<MessageBoxData> {
return ElMessageBox.confirm(content, '绯荤粺鎻愮ず', {
confirmButtonText: '纭畾',
cancelButtonText: '鍙栨秷',
@@ -59,7 +59,7 @@
});
},
// 鎻愪氦鍐呭
- prompt(content: string) {
+ prompt(content: any) {
return ElMessageBox.prompt(content, '绯荤粺鎻愮ず', {
confirmButtonText: '纭畾',
cancelButtonText: '鍙栨秷',
diff --git a/src/plugins/tab.ts b/src/plugins/tab.ts
index a310154..97442ff 100644
--- a/src/plugins/tab.ts
+++ b/src/plugins/tab.ts
@@ -3,8 +3,11 @@
import { TagView, RouteLocationRaw } from 'vue-router';
export default {
- // 鍒锋柊褰撳墠tab椤电
- async refreshPage(obj: TagView): Promise<void> {
+ /**
+ * 鍒锋柊褰撳墠tab椤电
+ * @param obj 鏍囩瀵硅薄
+ */
+ async refreshPage(obj?: TagView): Promise<void> {
const { path, query, matched } = router.currentRoute.value;
if (obj === undefined) {
matched.forEach((m) => {
@@ -15,11 +18,16 @@
}
});
}
- // prettier-ignore
- await useTagsViewStore().delCachedView(obj)
- router.replace({
- path: '/redirect' + obj.path,
- query: obj.query
+ let query1: undefined | {} = {};
+ let path1: undefined | string = '';
+ if (obj) {
+ query1 = obj.query;
+ path1 = obj.path;
+ }
+ await useTagsViewStore().delCachedView(obj);
+ await router.replace({
+ path: '/redirect' + path1,
+ query: query1
});
},
// 鍏抽棴褰撳墠tab椤电锛屾墦寮�鏂伴〉绛�
@@ -34,9 +42,9 @@
if (obj === undefined) {
// prettier-ignore
const { visitedViews } = await useTagsViewStore().delView(router.currentRoute.value) as any
- const latestView = visitedViews.slice(-1)[0]
+ const latestView = visitedViews.slice(-1)[0];
if (latestView) {
- return router.push(latestView.fullPath)
+ return router.push(latestView.fullPath);
}
return router.push('/');
}
@@ -47,22 +55,31 @@
return useTagsViewStore().delAllViews();
},
// 鍏抽棴宸︿晶tab椤电
- closeLeftPage(obj: TagView) {
+ closeLeftPage(obj?: TagView) {
return useTagsViewStore().delLeftTags(obj || router.currentRoute.value);
},
// 鍏抽棴鍙充晶tab椤电
- closeRightPage(obj: TagView) {
+ closeRightPage(obj?: TagView) {
return useTagsViewStore().delRightTags(obj || router.currentRoute.value);
},
// 鍏抽棴鍏朵粬tab椤电
- closeOtherPage(obj: TagView) {
+ closeOtherPage(obj?: TagView) {
return useTagsViewStore().delOthersViews(obj || router.currentRoute.value);
},
- // 鎵撳紑tab椤电
- openPage(url: RouteLocationRaw) {
- return router.push(url);
+ /**
+ * 鎵撳紑tab椤电
+ * @param url 璺敱鍦板潃
+ * @param title 鏍囬
+ * @param query 鍙傛暟
+ */
+ openPage(url: string, title?: string, query?: any) {
+ const obj = { path: url, query: { ...query, title } };
+ return router.push(obj);
},
- // 淇敼tab椤电
+ /**
+ * 淇敼tab椤电
+ * @param obj 鏍囩瀵硅薄
+ */
updatePage(obj: TagView) {
return useTagsViewStore().updateVisitedView(obj);
}
diff --git a/src/store/modules/tagsView.ts b/src/store/modules/tagsView.ts
index af980ef..cd065d1 100644
--- a/src/store/modules/tagsView.ts
+++ b/src/store/modules/tagsView.ts
@@ -54,8 +54,11 @@
resolve([...visitedViews.value]);
});
};
- const delCachedView = (view: TagView): Promise<string[]> => {
- const viewName = view.name as string;
+ const delCachedView = (view?: TagView): Promise<string[]> => {
+ let viewName = '';
+ if (view) {
+ viewName = view.name as string;
+ }
return new Promise((resolve) => {
const index = cachedViews.value.indexOf(viewName);
index > -1 && cachedViews.value.splice(index, 1);
@@ -167,6 +170,7 @@
const addCachedView = (view: TagView): void => {
const viewName = view.name as string;
+ if (!viewName) return;
if (cachedViews.value.includes(viewName)) return;
if (!view.meta?.noCache) {
cachedViews.value.push(viewName);
diff --git a/src/types/element.d.ts b/src/types/element.d.ts
index 8632484..e8d1f62 100644
--- a/src/types/element.d.ts
+++ b/src/types/element.d.ts
@@ -1 +1,35 @@
-declare type ElTagType = '' | 'success' | 'warning' | 'info' | 'danger' | 'default' | 'primary';
+import type * as ep from 'element-plus';
+declare global {
+ declare type ElTagType = '' | 'success' | 'warning' | 'info' | 'danger' | 'default' | 'primary';
+ declare type ElFormInstance = InstanceType<typeof ep.ElForm>;
+ declare type ElTableInstance = InstanceType<typeof ep.ElTable>;
+ declare type ElTreeInstance = InstanceType<typeof ep.ElTree>;
+ declare type ElTreeSelectInstance = InstanceType<typeof ep.ElTreeSelect>;
+ declare type ElSelectInstance = InstanceType<typeof ep.ElSelect>;
+ declare type ElUploadInstance = InstanceType<typeof ep.ElUpload>;
+ declare type ElCardInstance = InstanceType<typeof ep.ElCard>;
+ declare type ElDialogInstance = InstanceType<typeof ep.ElDialog>;
+ declare type ElInputInstance = InstanceType<typeof ep.ElInput>;
+ declare type ElInputNumberInstance = InstanceType<typeof ep.ElInputNumber>;
+ declare type ElRadioInstance = InstanceType<typeof ep.ElRadio>;
+ declare type ElRadioGroupInstance = InstanceType<typeof ep.ElRadioGroup>;
+ declare type ElRadioButtonInstance = InstanceType<typeof ep.ElRadioButton>;
+ declare type ElCheckboxInstance = InstanceType<typeof ep.ElCheckbox>;
+ declare type ElCheckboxGroupInstance = InstanceType<typeof ep.ElCheckboxGroup>;
+ declare type ElSwitchInstance = InstanceType<typeof ep.ElSwitch>;
+ declare type ElDatePickerInstance = InstanceType<typeof ep.ElDatePicker>;
+ declare type ElTimePickerInstance = InstanceType<typeof ep.ElTimePicker>;
+ declare type ElTimeSelectInstance = InstanceType<typeof ep.ElTimeSelect>;
+ declare type ElCascaderInstance = InstanceType<typeof ep.ElCascader>;
+ declare type ElColorPickerInstance = InstanceType<typeof ep.ElColorPicker>;
+ declare type ElRateInstance = InstanceType<typeof ep.ElRate>;
+ declare type ElSliderInstance = InstanceType<typeof ep.ElSlider>;
+ declare type ElUploadInstance = InstanceType<typeof ep.ElUpload>;
+ declare type ElScrollbarInstance = InstanceType<typeof ep.ElScrollbar>;
+
+ declare type TransferKey = ep.TransferKey;
+ declare type CheckboxValueType = ep.CheckboxValueType;
+ declare type ElFormRules = ep.FormRules;
+ declare type DateModelType = ep.DateModelType;
+ declare type UploadFile = typeof ep.UploadFile;
+}
diff --git a/src/types/global.d.ts b/src/types/global.d.ts
index 5a972a3..b9bc5f4 100644
--- a/src/types/global.d.ts
+++ b/src/types/global.d.ts
@@ -1,9 +1,15 @@
-import { FormRules } from 'element-plus';
+import type { ComponentInternalInstance as ComponentInstance, PropType as VuePropType } from 'vue';
+
declare global {
+ /** vue Instance */
+ declare type ComponentInternalInstance = ComponentInstance;
+ /**vue */
+ declare type PropType<T> = VuePropType<T>;
+
/**
* 鐣岄潰瀛楁闅愯棌灞炴��
*/
- interface FieldOption {
+ declare interface FieldOption {
key: number;
label: string;
visible: boolean;
@@ -12,7 +18,7 @@
/**
* 寮圭獥灞炴��
*/
- interface DialogOption {
+ declare interface DialogOption {
/**
* 寮圭獥鏍囬
*/
@@ -23,7 +29,7 @@
visible: boolean;
}
- interface UploadOption {
+ declare interface UploadOption {
/** 璁剧疆涓婁紶鐨勮姹傚ご閮� */
headers: { [key: string]: any };
@@ -34,7 +40,7 @@
/**
* 瀵煎叆灞炴��
*/
- interface ImportOption extends UploadOption {
+ declare interface ImportOption extends UploadOption {
/** 鏄惁鏄剧ず寮瑰嚭灞� */
open: boolean;
/** 寮瑰嚭灞傛爣棰� */
@@ -48,14 +54,14 @@
/**
* 瀛楀吀鏁版嵁 鏁版嵁閰嶇疆
*/
- interface DictDataOption {
+ declare interface DictDataOption {
label: string;
value: string;
elTagType?: ElTagType;
elTagClass?: string;
}
- interface BaseEntity {
+ declare interface BaseEntity {
createBy?: any;
createDept?: any;
createTime?: string;
@@ -68,15 +74,15 @@
* T : 琛ㄥ崟鏁版嵁
* D : 鏌ヨ鍙傛暟
*/
- interface PageData<T, D> {
+ declare interface PageData<T, D> {
form: T;
queryParams: D;
- rules: FormRules;
+ rules: ElFormRules;
}
/**
* 鍒嗛〉鏌ヨ鍙傛暟
*/
- interface PageQuery {
+ declare interface PageQuery {
pageNum: number;
pageSize: number;
}
diff --git a/src/types/module.d.ts b/src/types/module.d.ts
index b99bc44..987c349 100644
--- a/src/types/module.d.ts
+++ b/src/types/module.d.ts
@@ -1,23 +1,27 @@
-import modal from '@/plugins/modal';
-import tab from '@/plugins/tab';
-import { useDict } from '@/utils/dict';
-import { addDateRange, handleTree, selectDictLabel, selectDictLabels, parseTime } from '@/utils/ruoyi';
-import { getConfigKey, updateConfigByKey } from '@/api/system/config';
-import { download as download1 } from '@/utils/request';
-import download from '@/plugins/download';
-import animate from '@/animate';
+import type modal from '@/plugins/modal';
+import type tab from '@/plugins/tab';
+import type download from '@/plugins/download';
+import type auth from '@/plugins/auth';
+import type cache from '@/plugins/cache';
+import type animate from '@/animate';
+import type { useDict } from '@/utils/dict';
+import type { addDateRange, handleTree, selectDictLabel, selectDictLabels, parseTime } from '@/utils/ruoyi';
+import type { getConfigKey, updateConfigByKey } from '@/api/system/config';
+import type { download as rd } from '@/utils/request';
-declare module 'vue' {
- export interface ComponentCustomProperties {
+declare module '@vue/runtime-core' {
+ interface ComponentCustomProperties {
// 鍏ㄥ眬鏂规硶澹版槑
$modal: typeof modal;
$tab: typeof tab;
$download: typeof download;
+ $auth: typeof auth;
+ $cache: typeof cache;
animate: typeof animate;
useDict: typeof useDict;
addDateRange: typeof addDateRange;
- download: typeof download1;
+ download: typeof rd;
handleTree: typeof handleTree;
getConfigKey: typeof getConfigKey;
updateConfigByKey: typeof updateConfigByKey;
diff --git a/src/types/router.d.ts b/src/types/router.d.ts
index b60b831..9731fa2 100644
--- a/src/types/router.d.ts
+++ b/src/types/router.d.ts
@@ -1,7 +1,7 @@
import { RouteRecordRaw } from 'vue-router';
declare module 'vue-router' {
- type RouteOption = {
+ declare type RouteOption = {
hidden?: boolean;
permissions?: string[];
roles?: string[];
@@ -16,15 +16,15 @@
query?: string;
} & RouteRecordRaw;
- interface _RouteLocationBase {
+ declare interface _RouteLocationBase {
children?: RouteOption[];
}
- interface RouteLocationOptions {
+ declare interface RouteLocationOptions {
fullPath?: string;
}
- interface TagView extends Partial<_RouteLocationBase> {
+ declare interface TagView extends Partial<_RouteLocationBase> {
title?: string;
meta?: {
link?: string;
diff --git a/src/types/vform3-builds.d.ts b/src/types/vform3-builds.d.ts
new file mode 100644
index 0000000..82573de
--- /dev/null
+++ b/src/types/vform3-builds.d.ts
@@ -0,0 +1,4 @@
+declare module 'vform3-builds' {
+ const content: any;
+ export = content;
+}
diff --git a/src/utils/propTypes.ts b/src/utils/propTypes.ts
new file mode 100644
index 0000000..4d69bb6
--- /dev/null
+++ b/src/utils/propTypes.ts
@@ -0,0 +1,25 @@
+import { CSSProperties } from 'vue';
+import { createTypes, VueTypeValidableDef, VueTypesInterface } from 'vue-types';
+
+type PropTypes = VueTypesInterface & {
+ readonly style: VueTypeValidableDef<CSSProperties>;
+};
+
+const propTypes = createTypes({
+ func: undefined,
+ bool: undefined,
+ string: undefined,
+ number: undefined,
+ object: undefined,
+ integer: undefined
+}) as PropTypes;
+
+propTypes.extend([
+ {
+ name: 'style',
+ getter: true,
+ type: [String, Object],
+ default: undefined
+ }
+]);
+export { propTypes };
diff --git a/src/views/demo/demo/index.vue b/src/views/demo/demo/index.vue
index 2786a51..54f7c86 100644
--- a/src/views/demo/demo/index.vue
+++ b/src/views/demo/demo/index.vue
@@ -1,32 +1,34 @@
<template>
<div class="p-2">
<transition :enter-active-class="proxy?.animate.searchAnimate.enter" :leave-active-class="proxy?.animate.searchAnimate.leave">
- <div class="search" v-show="showSearch">
- <el-form :model="queryParams" ref="queryFormRef" :inline="true" label-width="68px">
- <el-form-item label="閮ㄩ棬id" prop="deptId">
- <el-input v-model="queryParams.deptId" placeholder="璇疯緭鍏ラ儴闂╥d" clearable @keyup.enter="handleQuery" />
- </el-form-item>
- <el-form-item label="鐢ㄦ埛id" prop="userId">
- <el-input v-model="queryParams.userId" placeholder="璇疯緭鍏ョ敤鎴穒d" clearable @keyup.enter="handleQuery" />
- </el-form-item>
- <el-form-item label="鎺掑簭鍙�" prop="orderNum">
- <el-input v-model="queryParams.orderNum" placeholder="璇疯緭鍏ユ帓搴忓彿" clearable @keyup.enter="handleQuery" />
- </el-form-item>
- <el-form-item label="key閿�" prop="testKey">
- <el-input v-model="queryParams.testKey" placeholder="璇疯緭鍏ey閿�" clearable @keyup.enter="handleQuery" />
- </el-form-item>
- <el-form-item label="鍊�" prop="value">
- <el-input v-model="queryParams.value" placeholder="璇疯緭鍏ュ��" clearable @keyup.enter="handleQuery" />
- </el-form-item>
- <el-form-item>
- <el-button type="primary" icon="Search" @click="handleQuery">鎼滅储</el-button>
- <el-button icon="Refresh" @click="resetQuery">閲嶇疆</el-button>
- </el-form-item>
- </el-form>
+ <div class="mb-[10px]" v-show="showSearch">
+ <el-card shadow="hover">
+ <el-form :model="queryParams" ref="queryFormRef" :inline="true" label-width="68px">
+ <el-form-item label="閮ㄩ棬id" prop="deptId">
+ <el-input v-model="queryParams.deptId" placeholder="璇疯緭鍏ラ儴闂╥d" clearable @keyup.enter="handleQuery" />
+ </el-form-item>
+ <el-form-item label="鐢ㄦ埛id" prop="userId">
+ <el-input v-model="queryParams.userId" placeholder="璇疯緭鍏ョ敤鎴穒d" clearable @keyup.enter="handleQuery" />
+ </el-form-item>
+ <el-form-item label="鎺掑簭鍙�" prop="orderNum">
+ <el-input v-model="queryParams.orderNum" placeholder="璇疯緭鍏ユ帓搴忓彿" clearable @keyup.enter="handleQuery" />
+ </el-form-item>
+ <el-form-item label="key閿�" prop="testKey">
+ <el-input v-model="queryParams.testKey" placeholder="璇疯緭鍏ey閿�" clearable @keyup.enter="handleQuery" />
+ </el-form-item>
+ <el-form-item label="鍊�" prop="value">
+ <el-input v-model="queryParams.value" placeholder="璇疯緭鍏ュ��" clearable @keyup.enter="handleQuery" />
+ </el-form-item>
+ <el-form-item>
+ <el-button type="primary" icon="Search" @click="handleQuery">鎼滅储</el-button>
+ <el-button icon="Refresh" @click="resetQuery">閲嶇疆</el-button>
+ </el-form-item>
+ </el-form>
+ </el-card>
</div>
</transition>
- <el-card shadow="never">
+ <el-card shadow="hover">
<template #header>
<el-row :gutter="10" class="mb8">
<el-col :span="1.5">
@@ -36,7 +38,9 @@
<el-button type="success" plain icon="Edit" :disabled="single" @click="handleUpdate()" v-hasPermi="['demo:demo:edit']">淇敼</el-button>
</el-col>
<el-col :span="1.5">
- <el-button type="danger" plain icon="Delete" :disabled="multiple" @click="handleDelete()" v-hasPermi="['demo:demo:remove']">鍒犻櫎</el-button>
+ <el-button type="danger" plain icon="Delete" :disabled="multiple" @click="handleDelete()" v-hasPermi="['demo:demo:remove']"
+ >鍒犻櫎</el-button
+ >
</el-col>
<el-col :span="1.5">
<el-button type="warning" plain icon="Download" @click="handleExport" v-hasPermi="['demo:demo:export']">瀵煎嚭</el-button>
@@ -65,13 +69,7 @@
</el-table-column>
</el-table>
- <pagination
- v-show="total>0"
- :total="total"
- v-model:page="queryParams.pageNum"
- v-model:limit="queryParams.pageSize"
- @pagination="getList"
- />
+ <pagination v-show="total > 0" :total="total" v-model:page="queryParams.pageNum" v-model:limit="queryParams.pageSize" @pagination="getList" />
</el-card>
<!-- 娣诲姞鎴栦慨鏀规祴璇曞崟瀵硅瘽妗� -->
<el-dialog :title="dialog.title" v-model="dialog.visible" width="500px" append-to-body>
@@ -105,8 +103,6 @@
<script setup name="Demo" lang="ts">
import { listDemo, getDemo, delDemo, addDemo, updateDemo } from '@/api/demo/demo';
import { DemoVO, DemoQuery, DemoForm } from '@/api/demo/demo/types';
-import { ComponentInternalInstance } from 'vue';
-import { ElForm } from 'element-plus';
const { proxy } = getCurrentInstance() as ComponentInternalInstance;
@@ -119,8 +115,8 @@
const multiple = ref(true);
const total = ref(0);
-const queryFormRef = ref(ElForm);
-const demoFormRef = ref(ElForm);
+const queryFormRef = ref<ElFormInstance>();
+const demoFormRef = ref<ElFormInstance>();
const dialog = reactive<DialogOption>({
visible: false,
@@ -136,7 +132,7 @@
value: undefined,
}
const data = reactive<PageData<DemoForm, DemoQuery>>({
- form: {...initFormData},
+ form: { ...initFormData },
queryParams: {
pageNum: 1,
pageSize: 10,
@@ -187,8 +183,8 @@
/** 琛ㄥ崟閲嶇疆 */
const reset = () => {
- form.value = {...initFormData};
- demoFormRef.value.resetFields();
+ form.value = { ...initFormData };
+ demoFormRef.value?.resetFields();
}
/** 鎼滅储鎸夐挳鎿嶄綔 */
@@ -199,7 +195,7 @@
/** 閲嶇疆鎸夐挳鎿嶄綔 */
const resetQuery = () => {
- queryFormRef.value.resetFields();
+ queryFormRef.value?.resetFields();
handleQuery();
}
@@ -235,13 +231,13 @@
/** 鎻愪氦鎸夐挳 */
const submitForm = () => {
- demoFormRef.value.validate(async (valid: boolean) => {
+ demoFormRef.value?.validate(async (valid: boolean) => {
if (valid) {
buttonLoading.value = true;
if (form.value.id) {
- await updateDemo(form.value).finally(() => buttonLoading.value = false);
+ await updateDemo(form.value).finally(() => buttonLoading.value = false);
} else {
- await addDemo(form.value).finally(() => buttonLoading.value = false);
+ await addDemo(form.value).finally(() => buttonLoading.value = false);
}
proxy?.$modal.msgSuccess("淇敼鎴愬姛");
dialog.visible = false;
diff --git a/src/views/demo/tree/index.vue b/src/views/demo/tree/index.vue
index ae1d8c2..f6ec15c 100644
--- a/src/views/demo/tree/index.vue
+++ b/src/views/demo/tree/index.vue
@@ -1,20 +1,22 @@
<template>
<div class="p-2">
<transition :enter-active-class="proxy?.animate.searchAnimate.enter" :leave-active-class="proxy?.animate.searchAnimate.leave">
- <div class="search" v-show="showSearch">
- <el-form :model="queryParams" ref="queryFormRef" :inline="true" label-width="68px">
- <el-form-item label="鏍戣妭鐐瑰悕" prop="treeName">
- <el-input v-model="queryParams.treeName" placeholder="璇疯緭鍏ユ爲鑺傜偣鍚�" clearable @keyup.enter="handleQuery" />
- </el-form-item>
- <el-form-item>
- <el-button type="primary" icon="Search" @click="handleQuery">鎼滅储</el-button>
- <el-button icon="Refresh" @click="resetQuery">閲嶇疆</el-button>
- </el-form-item>
- </el-form>
+ <div class="mb-[10px]" v-show="showSearch">
+ <el-card shadow="hover">
+ <el-form :model="queryParams" ref="queryFormRef" :inline="true" label-width="68px">
+ <el-form-item label="鏍戣妭鐐瑰悕" prop="treeName">
+ <el-input v-model="queryParams.treeName" placeholder="璇疯緭鍏ユ爲鑺傜偣鍚�" clearable @keyup.enter="handleQuery" />
+ </el-form-item>
+ <el-form-item>
+ <el-button type="primary" icon="Search" @click="handleQuery">鎼滅储</el-button>
+ <el-button icon="Refresh" @click="resetQuery">閲嶇疆</el-button>
+ </el-form-item>
+ </el-form>
+ </el-card>
</div>
</transition>
- <el-card shadow="never">
+ <el-card shadow="hover">
<template #header>
<el-row :gutter="10" class="mb8">
<el-col :span="1.5">
@@ -89,8 +91,6 @@
<script setup name="Tree" lang="ts">
import { listTree, getTree, delTree, addTree, updateTree } from "@/api/demo/tree";
import { TreeVO, TreeQuery, TreeForm } from '@/api/demo/tree/types';
-import { ComponentInternalInstance } from 'vue';
-import { ElForm, ElTable } from 'element-plus';
type TreeOption = {
@@ -109,9 +109,9 @@
const isExpandAll = ref(true);
const loading = ref(false);
-const queryFormRef = ref(ElForm);
-const treeFormRef = ref(ElForm);
-const treeTableRef = ref(ElTable)
+const queryFormRef = ref<ElFormInstance>();
+const treeFormRef = ref<ElFormInstance>();
+const treeTableRef = ref<ElTableInstance>()
const dialog = reactive<DialogOption>({
visible: false,
@@ -185,7 +185,7 @@
// 琛ㄥ崟閲嶇疆
const reset = () => {
form.value = {...initFormData}
- treeFormRef.value.resetFields();
+ treeFormRef.value?.resetFields();
}
/** 鎼滅储鎸夐挳鎿嶄綔 */
@@ -195,7 +195,7 @@
/** 閲嶇疆鎸夐挳鎿嶄綔 */
const resetQuery = () => {
- queryFormRef.value.resetFields();
+ queryFormRef.value?.resetFields();
handleQuery();
}
@@ -223,7 +223,7 @@
/** 灞曞紑/鎶樺彔鎿嶄綔 */
const toggleExpandAll = (data: TreeVO[], status: boolean) => {
data.forEach((item) => {
- treeTableRef.value.toggleRowExpansion(item, status)
+ treeTableRef.value?.toggleRowExpansion(item, status)
if (item.children && item.children.length > 0) toggleExpandAll(item.children, status)
})
}
@@ -247,7 +247,7 @@
/** 鎻愪氦鎸夐挳 */
const submitForm = () => {
- treeFormRef.value.validate(async (valid: boolean) => {
+ treeFormRef.value?.validate(async (valid: boolean) => {
if (valid) {
buttonLoading.value = true;
if (form.value.id) {
@@ -257,7 +257,7 @@
}
proxy?.$modal.msgSuccess("鎿嶄綔鎴愬姛");
dialog.visible = false;
- getList();
+ await getList();
}
});
}
diff --git a/src/views/error/401.vue b/src/views/error/401.vue
index 63c03ba..1d9c76e 100644
--- a/src/views/error/401.vue
+++ b/src/views/error/401.vue
@@ -21,7 +21,6 @@
<script setup lang="ts">
import errImage from '@/assets/401_images/401.gif';
-import { ComponentInternalInstance } from "vue";
let { proxy } = getCurrentInstance() as ComponentInternalInstance;
diff --git a/src/views/login.vue b/src/views/login.vue
index 0ac655c..4c8715a 100644
--- a/src/views/login.vue
+++ b/src/views/login.vue
@@ -65,14 +65,14 @@
import { encrypt, decrypt } from '@/utils/jsencrypt';
import { useUserStore } from '@/store/modules/user';
import { LoginData, TenantVO } from '@/api/types';
-import { ElForm, FormRules } from 'element-plus';
import { to } from 'await-to-js';
+import { HttpStatus } from "@/enums/RespEnum";
const userStore = useUserStore();
const router = useRouter();
const loginForm = ref<LoginData>({
- tenantId: "000000",
+ tenantId: '000000',
username: 'admin',
password: 'admin123',
rememberMe: false,
@@ -80,7 +80,7 @@
uuid: ''
});
-const loginRules: FormRules = {
+const loginRules: ElFormRules = {
tenantId: [{ required: true, trigger: "blur", message: "璇疯緭鍏ユ偍鐨勭鎴风紪鍙�" }],
username: [{ required: true, trigger: 'blur', message: '璇疯緭鍏ユ偍鐨勮处鍙�' }],
password: [{ required: true, trigger: 'blur', message: '璇疯緭鍏ユ偍鐨勫瘑鐮�' }],
@@ -98,12 +98,12 @@
// 娉ㄥ唽寮�鍏�
const register = ref(false);
const redirect = ref(undefined);
-const loginRef = ref(ElForm);
+const loginRef = ref<ElFormInstance>();
// 绉熸埛鍒楄〃
const tenantList = ref<TenantVO[]>([]);
const handleLogin = () => {
- loginRef.value.validate(async (valid: boolean, fields: any) => {
+ loginRef.value?.validate(async (valid: boolean, fields: any) => {
if (valid) {
loading.value = true;
// 鍕鹃�変簡闇�瑕佽浣忓瘑鐮佽缃湪 cookie 涓缃浣忕敤鎴峰悕鍜屽瘑鐮�
@@ -120,7 +120,6 @@
Cookies.remove('rememberMe');
}
// 璋冪敤action鐨勭櫥褰曟柟娉�
- // prittier-ignore
const [err] = await to(userStore.login(loginForm.value));
if (!err) {
await router.push({ path: redirect.value || '/' });
@@ -189,7 +188,7 @@
*/
const doSocialLogin = (type: string) => {
authBinding(type).then((res: any) => {
- if (res.code === 200) {
+ if (res.code === HttpStatus.SUCCESS) {
// 鑾峰彇鎺堟潈鍦板潃璺宠浆
window.location.href = res.data;
} else {
diff --git a/src/views/monitor/cache/index.vue b/src/views/monitor/cache/index.vue
index 5cc2be5..8719c94 100644
--- a/src/views/monitor/cache/index.vue
+++ b/src/views/monitor/cache/index.vue
@@ -2,7 +2,7 @@
<div class="p-2">
<el-row>
<el-col :span="24" class="card-box">
- <el-card>
+ <el-card shadow="hover">
<template #header>
<Monitor style="width: 1em; height: 1em; vertical-align: middle;" />
<span style="vertical-align: middle;">鍩烘湰淇℃伅</span>
@@ -98,7 +98,7 @@
</el-col>
<el-col :span="12" class="card-box">
- <el-card>
+ <el-card shadow="hover">
<template #header>
<PieChart style="width: 1em; height: 1em; vertical-align: middle;" />
<span style="vertical-align: middle;">鍛戒护缁熻</span>
@@ -110,7 +110,7 @@
</el-col>
<el-col :span="12" class="card-box">
- <el-card>
+ <el-card shadow="hover">
<template #header>
<Odometer style="width: 1em; height: 1em; vertical-align: middle;" /> <span style="vertical-align: middle;">鍐呭瓨淇℃伅</span>
</template>
@@ -126,7 +126,6 @@
<script setup name="Cache" lang="ts">
import { getCache } from '@/api/monitor/cache';
import * as echarts from 'echarts';
-import { ComponentInternalInstance } from "vue";
const cache = ref<any>({});
const commandstats = ref();
diff --git a/src/views/monitor/logininfor/index.vue b/src/views/monitor/logininfor/index.vue
index 8279363..38ab1ad 100644
--- a/src/views/monitor/logininfor/index.vue
+++ b/src/views/monitor/logininfor/index.vue
@@ -1,39 +1,41 @@
<template>
<div class="p-2">
<transition :enter-active-class="proxy?.animate.searchAnimate.enter" :leave-active-class="proxy?.animate.searchAnimate.leave">
- <div class="search" v-show="showSearch">
- <el-form :model="queryParams" ref="queryFormRef" :inline="true" label-width="68px">
- <el-form-item label="鐧诲綍鍦板潃" prop="ipaddr">
- <el-input v-model="queryParams.ipaddr" placeholder="璇疯緭鍏ョ櫥褰曞湴鍧�" clearable style="width: 240px;" @keyup.enter="handleQuery" />
- </el-form-item>
- <el-form-item label="鐢ㄦ埛鍚嶇О" prop="userName">
- <el-input v-model="queryParams.userName" placeholder="璇疯緭鍏ョ敤鎴峰悕绉�" clearable style="width: 240px;" @keyup.enter="handleQuery" />
- </el-form-item>
- <el-form-item label="鐘舵��" prop="status">
- <el-select v-model="queryParams.status" placeholder="鐧诲綍鐘舵��" clearable style="width: 240px">
- <el-option v-for="dict in sys_common_status" :key="dict.value" :label="dict.label" :value="dict.value" />
- </el-select>
- </el-form-item>
- <el-form-item label="鐧诲綍鏃堕棿" style="width: 308px">
- <el-date-picker
- v-model="dateRange"
- value-format="YYYY-MM-DD HH:mm:ss"
- type="daterange"
- range-separator="-"
- start-placeholder="寮�濮嬫棩鏈�"
- end-placeholder="缁撴潫鏃ユ湡"
- :default-time="[new Date(2000, 1, 1, 0, 0, 0), new Date(2000, 1, 1, 23, 59, 59)]"
- ></el-date-picker>
- </el-form-item>
- <el-form-item>
- <el-button type="primary" icon="Search" @click="handleQuery">鎼滅储</el-button>
- <el-button icon="Refresh" @click="resetQuery">閲嶇疆</el-button>
- </el-form-item>
- </el-form>
+ <div class="mb-[10px]" v-show="showSearch">
+ <el-card shadow="hover">
+ <el-form :model="queryParams" ref="queryFormRef" :inline="true" label-width="68px">
+ <el-form-item label="鐧诲綍鍦板潃" prop="ipaddr">
+ <el-input v-model="queryParams.ipaddr" placeholder="璇疯緭鍏ョ櫥褰曞湴鍧�" clearable style="width: 240px;" @keyup.enter="handleQuery" />
+ </el-form-item>
+ <el-form-item label="鐢ㄦ埛鍚嶇О" prop="userName">
+ <el-input v-model="queryParams.userName" placeholder="璇疯緭鍏ョ敤鎴峰悕绉�" clearable style="width: 240px;" @keyup.enter="handleQuery" />
+ </el-form-item>
+ <el-form-item label="鐘舵��" prop="status">
+ <el-select v-model="queryParams.status" placeholder="鐧诲綍鐘舵��" clearable style="width: 240px">
+ <el-option v-for="dict in sys_common_status" :key="dict.value" :label="dict.label" :value="dict.value" />
+ </el-select>
+ </el-form-item>
+ <el-form-item label="鐧诲綍鏃堕棿" style="width: 308px">
+ <el-date-picker
+ v-model="dateRange"
+ value-format="YYYY-MM-DD HH:mm:ss"
+ type="daterange"
+ range-separator="-"
+ start-placeholder="寮�濮嬫棩鏈�"
+ end-placeholder="缁撴潫鏃ユ湡"
+ :default-time="[new Date(2000, 1, 1, 0, 0, 0), new Date(2000, 1, 1, 23, 59, 59)]"
+ ></el-date-picker>
+ </el-form-item>
+ <el-form-item>
+ <el-button type="primary" icon="Search" @click="handleQuery">鎼滅储</el-button>
+ <el-button icon="Refresh" @click="resetQuery">閲嶇疆</el-button>
+ </el-form-item>
+ </el-form>
+ </el-card>
</div>
</transition>
- <el-card shadow="never">
+ <el-card shadow="hover">
<template #header>
<el-row :gutter="10" class="mb8">
<el-col :span="1.5">
@@ -98,9 +100,7 @@
<script setup name="Logininfor" lang="ts">
import { list, delLoginInfo, cleanLoginInfo, unlockLoginInfo } from "@/api/monitor/loginInfo";
-import { ComponentInternalInstance } from "vue";
import { LoginInfoQuery, LoginInfoVO } from "@/api/monitor/loginInfo/types";
-import { DateModelType } from 'element-plus';
const { proxy } = getCurrentInstance() as ComponentInternalInstance;
const { sys_common_status } = toRefs<any>(proxy?.useDict("sys_common_status"));
@@ -116,8 +116,8 @@
const dateRange = ref<[DateModelType,DateModelType]>(['', '']);
const defaultSort = ref<any>({ prop: "loginTime", order: "descending" });
-const queryFormRef = ref(ElForm);
-const loginInfoTableRef = ref(ElTable);
+const queryFormRef = ref<ElFormInstance>();
+const loginInfoTableRef = ref<ElTableInstance>();
// 鏌ヨ鍙傛暟
const queryParams = ref<LoginInfoQuery>({
pageNum: 1,
@@ -145,9 +145,9 @@
/** 閲嶇疆鎸夐挳鎿嶄綔 */
const resetQuery = () => {
dateRange.value = ['', ''];
- queryFormRef.value.resetFields();
+ queryFormRef.value?.resetFields();
queryParams.value.pageNum = 1;
- loginInfoTableRef.value.sort(defaultSort.value.prop, defaultSort.value.order);
+ loginInfoTableRef.value?.sort(defaultSort.value.prop, defaultSort.value.order);
}
/** 澶氶�夋閫変腑鏁版嵁 */
const handleSelectionChange = (selection: LoginInfoVO[]) => {
@@ -167,14 +167,14 @@
const infoIds = row?.infoId || ids.value;
await proxy?.$modal.confirm('鏄惁纭鍒犻櫎璁块棶缂栧彿涓�"' + infoIds + '"鐨勬暟鎹」?');
await delLoginInfo(infoIds);
- getList();
+ await getList();
proxy?.$modal.msgSuccess("鍒犻櫎鎴愬姛");
}
/** 娓呯┖鎸夐挳鎿嶄綔 */
const handleClean = async () => {
await proxy?.$modal.confirm("鏄惁纭娓呯┖鎵�鏈夌櫥褰曟棩蹇楁暟鎹」?");
await cleanLoginInfo();
- getList();
+ await getList();
proxy?.$modal.msgSuccess("娓呯┖鎴愬姛");
}
/** 瑙ｉ攣鎸夐挳鎿嶄綔 */
diff --git a/src/views/monitor/online/index.vue b/src/views/monitor/online/index.vue
index 2b56d34..6d7bf87 100644
--- a/src/views/monitor/online/index.vue
+++ b/src/views/monitor/online/index.vue
@@ -1,20 +1,22 @@
<template>
<div class="p-2">
- <div class="search">
- <el-form :model="queryParams" ref="queryFormRef" :inline="true">
- <el-form-item label="鐧诲綍鍦板潃" prop="ipaddr">
- <el-input v-model="queryParams.ipaddr" placeholder="璇疯緭鍏ョ櫥褰曞湴鍧�" clearable style="width: 200px" @keyup.enter="handleQuery" />
- </el-form-item>
- <el-form-item label="鐢ㄦ埛鍚嶇О" prop="userName">
- <el-input v-model="queryParams.userName" placeholder="璇疯緭鍏ョ敤鎴峰悕绉�" clearable style="width: 200px" @keyup.enter="handleQuery" />
- </el-form-item>
- <el-form-item>
- <el-button type="primary" icon="Search" @click="handleQuery">鎼滅储</el-button>
- <el-button icon="Refresh" @click="resetQuery">閲嶇疆</el-button>
- </el-form-item>
- </el-form>
+ <div class="mb-[10px]">
+ <el-card shadow="hover">
+ <el-form :model="queryParams" ref="queryFormRef" :inline="true">
+ <el-form-item label="鐧诲綍鍦板潃" prop="ipaddr">
+ <el-input v-model="queryParams.ipaddr" placeholder="璇疯緭鍏ョ櫥褰曞湴鍧�" clearable style="width: 200px" @keyup.enter="handleQuery" />
+ </el-form-item>
+ <el-form-item label="鐢ㄦ埛鍚嶇О" prop="userName">
+ <el-input v-model="queryParams.userName" placeholder="璇疯緭鍏ョ敤鎴峰悕绉�" clearable style="width: 200px" @keyup.enter="handleQuery" />
+ </el-form-item>
+ <el-form-item>
+ <el-button type="primary" icon="Search" @click="handleQuery">鎼滅储</el-button>
+ <el-button icon="Refresh" @click="resetQuery">閲嶇疆</el-button>
+ </el-form-item>
+ </el-form>
+ </el-card>
</div>
- <div class="panel">
+ <el-card shadow="hover">
<el-table
v-loading="loading"
:data="onlineList.slice((queryParams.pageNum - 1) * queryParams.pageSize, queryParams.pageNum * queryParams.pageSize)"
@@ -48,13 +50,12 @@
</el-table>
<pagination v-show="total > 0" :total="total" v-model:page="queryParams.pageNum" v-model:limit="queryParams.pageSize" />
- </div>
+ </el-card>
</div>
</template>
<script setup name="Online" lang="ts">
import { forceLogout, list as initData } from "@/api/monitor/online";
-import { ComponentInternalInstance } from "vue";
import { OnlineQuery, OnlineVO } from "@/api/monitor/online/types";
const { proxy } = getCurrentInstance() as ComponentInternalInstance;
@@ -63,42 +64,42 @@
const loading = ref(true);
const total = ref(0);
-const queryFormRef = ref(ElForm);
+const queryFormRef = ref<ElFormInstance>();
const queryParams = ref<OnlineQuery>({
- pageNum: 1,
- pageSize: 10,
- ipaddr: '',
- userName: ''
+ pageNum: 1,
+ pageSize: 10,
+ ipaddr: '',
+ userName: ''
});
/** 鏌ヨ鐧诲綍鏃ュ織鍒楄〃 */
const getList = async () => {
- loading.value = true;
- const res = await initData(queryParams.value);
- onlineList.value = res.rows;
- total.value = res.total;
- loading.value = false;
+ loading.value = true;
+ const res = await initData(queryParams.value);
+ onlineList.value = res.rows;
+ total.value = res.total;
+ loading.value = false;
}
/** 鎼滅储鎸夐挳鎿嶄綔 */
const handleQuery = () => {
- queryParams.value.pageNum = 1;
- getList();
+ queryParams.value.pageNum = 1;
+ getList();
}
/** 閲嶇疆鎸夐挳鎿嶄綔 */
const resetQuery = () => {
- queryFormRef.value.resetFields();
- handleQuery();
+ queryFormRef.value?.resetFields();
+ handleQuery();
}
/** 寮洪��鎸夐挳鎿嶄綔 */
const handleForceLogout = async (row: OnlineVO) => {
- await proxy?.$modal.confirm('鏄惁纭寮洪��鍚嶇О涓�"' + row.userName + '"鐨勭敤鎴�?');
- await forceLogout(row.tokenId);
- getList();
- proxy?.$modal.msgSuccess("鍒犻櫎鎴愬姛");
+ await proxy?.$modal.confirm('鏄惁纭寮洪��鍚嶇О涓�"' + row.userName + '"鐨勭敤鎴�?');
+ await forceLogout(row.tokenId);
+ getList();
+ proxy?.$modal.msgSuccess("鍒犻櫎鎴愬姛");
}
onMounted(() => {
- getList();
+ getList();
})
</script>
diff --git a/src/views/monitor/operlog/index.vue b/src/views/monitor/operlog/index.vue
index 086a1aa..70a2bd7 100644
--- a/src/views/monitor/operlog/index.vue
+++ b/src/views/monitor/operlog/index.vue
@@ -1,44 +1,46 @@
<template>
<div class="p-2">
<transition :enter-active-class="proxy?.animate.searchAnimate.enter" :leave-active-class="proxy?.animate.searchAnimate.leave">
- <div class="search" v-show="showSearch">
- <el-form :model="queryParams" ref="queryFormRef" :inline="true" label-width="68px">
- <el-form-item label="绯荤粺妯″潡" prop="title">
- <el-input v-model="queryParams.title" placeholder="璇疯緭鍏ョ郴缁熸ā鍧�" clearable style="width: 240px;" @keyup.enter="handleQuery" />
- </el-form-item>
- <el-form-item label="鎿嶄綔浜哄憳" prop="operName">
- <el-input v-model="queryParams.operName" placeholder="璇疯緭鍏ユ搷浣滀汉鍛�" clearable style="width: 240px;" @keyup.enter="handleQuery" />
- </el-form-item>
- <el-form-item label="绫诲瀷" prop="businessType">
- <el-select v-model="queryParams.businessType" placeholder="鎿嶄綔绫诲瀷" clearable style="width: 240px">
- <el-option v-for="dict in sys_oper_type" :key="dict.value" :label="dict.label" :value="dict.value" />
- </el-select>
- </el-form-item>
- <el-form-item label="鐘舵��" prop="status">
- <el-select v-model="queryParams.status" placeholder="鎿嶄綔鐘舵��" clearable style="width: 240px">
- <el-option v-for="dict in sys_common_status" :key="dict.value" :label="dict.label" :value="dict.value" />
- </el-select>
- </el-form-item>
- <el-form-item label="鎿嶄綔鏃堕棿" style="width: 308px">
- <el-date-picker
- v-model="dateRange"
- value-format="YYYY-MM-DD HH:mm:ss"
- type="daterange"
- range-separator="-"
- start-placeholder="寮�濮嬫棩鏈�"
- end-placeholder="缁撴潫鏃ユ湡"
- :default-time="[new Date(2000, 1, 1, 0, 0, 0), new Date(2000, 1, 1, 23, 59, 59)]"
- ></el-date-picker>
- </el-form-item>
- <el-form-item>
- <el-button type="primary" icon="Search" @click="handleQuery">鎼滅储</el-button>
- <el-button icon="Refresh" @click="resetQuery">閲嶇疆</el-button>
- </el-form-item>
- </el-form>
+ <div class="mb-[10px]">
+ <el-card shadow="hover">
+ <el-form :model="queryParams" ref="queryFormRef" :inline="true" label-width="68px">
+ <el-form-item label="绯荤粺妯″潡" prop="title">
+ <el-input v-model="queryParams.title" placeholder="璇疯緭鍏ョ郴缁熸ā鍧�" clearable style="width: 240px;" @keyup.enter="handleQuery" />
+ </el-form-item>
+ <el-form-item label="鎿嶄綔浜哄憳" prop="operName">
+ <el-input v-model="queryParams.operName" placeholder="璇疯緭鍏ユ搷浣滀汉鍛�" clearable style="width: 240px;" @keyup.enter="handleQuery" />
+ </el-form-item>
+ <el-form-item label="绫诲瀷" prop="businessType">
+ <el-select v-model="queryParams.businessType" placeholder="鎿嶄綔绫诲瀷" clearable style="width: 240px">
+ <el-option v-for="dict in sys_oper_type" :key="dict.value" :label="dict.label" :value="dict.value" />
+ </el-select>
+ </el-form-item>
+ <el-form-item label="鐘舵��" prop="status">
+ <el-select v-model="queryParams.status" placeholder="鎿嶄綔鐘舵��" clearable style="width: 240px">
+ <el-option v-for="dict in sys_common_status" :key="dict.value" :label="dict.label" :value="dict.value" />
+ </el-select>
+ </el-form-item>
+ <el-form-item label="鎿嶄綔鏃堕棿" style="width: 308px">
+ <el-date-picker
+ v-model="dateRange"
+ value-format="YYYY-MM-DD HH:mm:ss"
+ type="daterange"
+ range-separator="-"
+ start-placeholder="寮�濮嬫棩鏈�"
+ end-placeholder="缁撴潫鏃ユ湡"
+ :default-time="[new Date(2000, 1, 1, 0, 0, 0), new Date(2000, 1, 1, 23, 59, 59)]"
+ ></el-date-picker>
+ </el-form-item>
+ <el-form-item>
+ <el-button type="primary" icon="Search" @click="handleQuery">鎼滅储</el-button>
+ <el-button icon="Refresh" @click="resetQuery">閲嶇疆</el-button>
+ </el-form-item>
+ </el-form>
+ </el-card>
</div>
</transition>
- <el-card shadow="never">
+ <el-card shadow="hover">
<template #header>
<el-row :gutter="10" class="mb8">
<el-col :span="1.5">
@@ -132,7 +134,7 @@
<el-form-item label="鎿嶄綔鏂规硶锛�">{{ form.method }}</el-form-item>
</el-col>
<el-col :span="24">
- <el-form-item label="璇锋眰鍙傛暟锛�">{{form.operParam}}</el-form-item>
+ <el-form-item label="璇锋眰鍙傛暟锛�">{{ form.operParam }}</el-form-item>
</el-col>
<el-col :span="24">
<el-form-item label="杩斿洖鍙傛暟锛�">{{ form.jsonResult }}</el-form-item>
@@ -165,12 +167,10 @@
<script setup name="Operlog" lang="ts">
import { list, delOperlog, cleanOperlog } from '@/api/monitor/operlog';
-import { ComponentInternalInstance } from 'vue';
import { OperLogForm, OperLogQuery, OperLogVO } from '@/api/monitor/operlog/types';
-import { DateModelType } from 'element-plus';
const { proxy } = getCurrentInstance() as ComponentInternalInstance;
-const { sys_oper_type, sys_common_status } = toRefs<any>(proxy?.useDict("sys_oper_type","sys_common_status"));
+const { sys_oper_type, sys_common_status } = toRefs<any>(proxy?.useDict("sys_oper_type", "sys_common_status"));
const operlogList = ref<OperLogVO[]>([]);
const loading = ref(true);
@@ -181,116 +181,116 @@
const dateRange = ref<[DateModelType, DateModelType]>(['', '']);
const defaultSort = ref<any>({ prop: "operTime", order: "descending" });
-const operLogTableRef = ref(ElTable);
-const queryFormRef = ref(ElForm);
+const operLogTableRef = ref<ElTableInstance>();
+const queryFormRef = ref<ElFormInstance>();
const dialog = reactive<DialogOption>({
- visible: false,
- title: ''
+ visible: false,
+ title: ''
});
const data = reactive<PageData<OperLogForm, OperLogQuery>>({
- form: {
- operId: undefined,
- tenantId: undefined,
- title: '',
- businessType: 0,
- businessTypes: undefined,
- method: '',
- requestMethod: '',
- operatorType: 0,
- operName: '',
- deptName: '',
- operUrl: '',
- operIp: '',
- operLocation: '',
- operParam: '',
- jsonResult: '',
- status: 0,
- errorMsg: '',
- operTime: '',
- costTime: 0
- },
- queryParams: {
- pageNum: 1,
- pageSize: 10,
- title: '',
- operName: '',
- businessType: '',
- status: '',
- orderByColumn: defaultSort.value.prop,
- isAsc: defaultSort.value.order
- },
- rules: {}
+ form: {
+ operId: undefined,
+ tenantId: undefined,
+ title: '',
+ businessType: 0,
+ businessTypes: undefined,
+ method: '',
+ requestMethod: '',
+ operatorType: 0,
+ operName: '',
+ deptName: '',
+ operUrl: '',
+ operIp: '',
+ operLocation: '',
+ operParam: '',
+ jsonResult: '',
+ status: 0,
+ errorMsg: '',
+ operTime: '',
+ costTime: 0
+ },
+ queryParams: {
+ pageNum: 1,
+ pageSize: 10,
+ title: '',
+ operName: '',
+ businessType: '',
+ status: '',
+ orderByColumn: defaultSort.value.prop,
+ isAsc: defaultSort.value.order
+ },
+ rules: {}
});
const { queryParams, form } = toRefs(data);
/** 鏌ヨ鐧诲綍鏃ュ織 */
const getList = async () => {
- loading.value = true;
- const res = await list(proxy?.addDateRange(queryParams.value, dateRange.value));
- operlogList.value = res.rows;
- total.value = res.total;
- loading.value = false;
+ loading.value = true;
+ const res = await list(proxy?.addDateRange(queryParams.value, dateRange.value));
+ operlogList.value = res.rows;
+ total.value = res.total;
+ loading.value = false;
}
/** 鎿嶄綔鏃ュ織绫诲瀷瀛楀吀缈昏瘧 */
const typeFormat = (row: OperLogForm) => {
- return proxy?.selectDictLabel(sys_oper_type.value, row.businessType);
+ return proxy?.selectDictLabel(sys_oper_type.value, row.businessType);
}
/** 鎼滅储鎸夐挳鎿嶄綔 */
const handleQuery = () => {
- queryParams.value.pageNum = 1;
- getList();
+ queryParams.value.pageNum = 1;
+ getList();
}
/** 閲嶇疆鎸夐挳鎿嶄綔 */
const resetQuery = () => {
- dateRange.value = ['', ''];
- queryFormRef.value.resetFields();
- queryParams.value.pageNum = 1;
- operLogTableRef.value.sort(defaultSort.value.prop, defaultSort.value.order);
+ dateRange.value = ['', ''];
+ queryFormRef.value?.resetFields();
+ queryParams.value.pageNum = 1;
+ operLogTableRef.value?.sort(defaultSort.value.prop, defaultSort.value.order);
}
/** 澶氶�夋閫変腑鏁版嵁 */
const handleSelectionChange = (selection: OperLogVO[]) => {
- ids.value = selection.map(item => item.operId);
- multiple.value = !selection.length;
+ ids.value = selection.map(item => item.operId);
+ multiple.value = !selection.length;
}
/** 鎺掑簭瑙﹀彂浜嬩欢 */
const handleSortChange = (column: any) => {
- queryParams.value.orderByColumn = column.prop;
- queryParams.value.isAsc = column.order;
- getList();
+ queryParams.value.orderByColumn = column.prop;
+ queryParams.value.isAsc = column.order;
+ getList();
}
/** 璇︾粏鎸夐挳鎿嶄綔 */
const handleView = (row: OperLogVO) => {
- dialog.visible = true;
- form.value = row;
+ dialog.visible = true;
+ form.value = row;
}
/** 鍒犻櫎鎸夐挳鎿嶄綔 */
const handleDelete = async (row?: OperLogVO) => {
- const operIds = row?.operId || ids.value;
- await proxy?.$modal.confirm('鏄惁纭鍒犻櫎鏃ュ織缂栧彿涓�"' + operIds + '"鐨勬暟鎹」?');
- await delOperlog(operIds);
- getList();
- proxy?.$modal.msgSuccess("鍒犻櫎鎴愬姛");
+ const operIds = row?.operId || ids.value;
+ await proxy?.$modal.confirm('鏄惁纭鍒犻櫎鏃ュ織缂栧彿涓�"' + operIds + '"鐨勬暟鎹」?');
+ await delOperlog(operIds);
+ await getList();
+ proxy?.$modal.msgSuccess("鍒犻櫎鎴愬姛");
}
/** 娓呯┖鎸夐挳鎿嶄綔 */
const handleClean = async () => {
- await proxy?.$modal.confirm("鏄惁纭娓呯┖鎵�鏈夋搷浣滄棩蹇楁暟鎹」?");
- await cleanOperlog();
- getList();
- proxy?.$modal.msgSuccess("娓呯┖鎴愬姛");
+ await proxy?.$modal.confirm("鏄惁纭娓呯┖鎵�鏈夋搷浣滄棩蹇楁暟鎹」?");
+ await cleanOperlog();
+ await getList();
+ proxy?.$modal.msgSuccess("娓呯┖鎴愬姛");
}
/** 瀵煎嚭鎸夐挳鎿嶄綔 */
const handleExport = () => {
- proxy?.download("monitor/operlog/export", {
- ...queryParams.value,
- }, `config_${new Date().getTime()}.xlsx`);
+ proxy?.download("monitor/operlog/export", {
+ ...queryParams.value,
+ }, `config_${new Date().getTime()}.xlsx`);
}
onMounted(() => {
- getList();
+ getList();
})
</script>
diff --git a/src/views/register.vue b/src/views/register.vue
index b80ce5d..0716532 100644
--- a/src/views/register.vue
+++ b/src/views/register.vue
@@ -58,19 +58,18 @@
<script setup lang="ts">
import { getCodeImg, register, getTenantList } from '@/api/login';
import { RegisterForm, TenantVO } from '@/api/types';
-import { FormRules } from 'element-plus';
import { to } from 'await-to-js';
const router = useRouter();
const registerForm = ref<RegisterForm>({
- tenantId: "",
- username: "",
- password: "",
- confirmPassword: "",
- code: "",
- uuid: "",
- userType: "sys_user"
+ tenantId: "",
+ username: "",
+ password: "",
+ confirmPassword: "",
+ code: "",
+ uuid: "",
+ userType: "sys_user"
});
// 绉熸埛寮�鍏�
@@ -78,30 +77,30 @@
const equalToPassword = (rule: any, value: string, callback: any) => {
- if (registerForm.value.password !== value) {
- callback(new Error("涓ゆ杈撳叆鐨勫瘑鐮佷笉涓�鑷�"));
- } else {
- callback();
- }
+ if (registerForm.value.password !== value) {
+ callback(new Error("涓ゆ杈撳叆鐨勫瘑鐮佷笉涓�鑷�"));
+ } else {
+ callback();
+ }
};
-const registerRules: FormRules = {
- tenantId: [
- { required: true, trigger: "blur", message: "璇疯緭鍏ユ偍鐨勭鎴风紪鍙�" }
- ],
- username: [
- { required: true, trigger: "blur", message: "璇疯緭鍏ユ偍鐨勮处鍙�" },
- { min: 2, max: 20, message: "鐢ㄦ埛璐﹀彿闀垮害蹇呴』浠嬩簬 2 鍜� 20 涔嬮棿", trigger: "blur" }
- ],
- password: [
- { required: true, trigger: "blur", message: "璇疯緭鍏ユ偍鐨勫瘑鐮�" },
- { min: 5, max: 20, message: "鐢ㄦ埛瀵嗙爜闀垮害蹇呴』浠嬩簬 5 鍜� 20 涔嬮棿", trigger: "blur" }
- ],
- confirmPassword: [
- { required: true, trigger: "blur", message: "璇峰啀娆¤緭鍏ユ偍鐨勫瘑鐮�" },
- { required: true, validator: equalToPassword, trigger: "blur" }
- ],
- code: [{ required: true, trigger: "change", message: "璇疯緭鍏ラ獙璇佺爜" }]
+const registerRules: ElFormRules = {
+ tenantId: [
+ { required: true, trigger: "blur", message: "璇疯緭鍏ユ偍鐨勭鎴风紪鍙�" }
+ ],
+ username: [
+ { required: true, trigger: "blur", message: "璇疯緭鍏ユ偍鐨勮处鍙�" },
+ { min: 2, max: 20, message: "鐢ㄦ埛璐﹀彿闀垮害蹇呴』浠嬩簬 2 鍜� 20 涔嬮棿", trigger: "blur" }
+ ],
+ password: [
+ { required: true, trigger: "blur", message: "璇疯緭鍏ユ偍鐨勫瘑鐮�" },
+ { min: 5, max: 20, message: "鐢ㄦ埛瀵嗙爜闀垮害蹇呴』浠嬩簬 5 鍜� 20 涔嬮棿", trigger: "blur" }
+ ],
+ confirmPassword: [
+ { required: true, trigger: "blur", message: "璇峰啀娆¤緭鍏ユ偍鐨勫瘑鐮�" },
+ { required: true, validator: equalToPassword, trigger: "blur" }
+ ],
+ code: [{ required: true, trigger: "change", message: "璇疯緭鍏ラ獙璇佺爜" }]
};
const codeUrl = ref("");
const loading = ref(false);
@@ -111,50 +110,50 @@
const tenantList = ref<TenantVO[]>([]);
const handleRegister = () => {
- registerRef.value.validate(async (valid: boolean) => {
- if (valid) {
- loading.value = true;
- const [err] = await to(register(registerForm.value));
- if (!err) {
- const username = registerForm.value.username;
- await ElMessageBox.alert("<font color='red'>鎭枩浣狅紝鎮ㄧ殑璐﹀彿 " + username + " 娉ㄥ唽鎴愬姛锛�</font>", "绯荤粺鎻愮ず", {
- dangerouslyUseHTMLString: true,
- type: "success",
- });
- await router.push("/login");
- } else {
- loading.value = false;
- if (captchaEnabled) {
- getCode();
- }
- }
+ registerRef.value.validate(async (valid: boolean) => {
+ if (valid) {
+ loading.value = true;
+ const [err] = await to(register(registerForm.value));
+ if (!err) {
+ const username = registerForm.value.username;
+ await ElMessageBox.alert("<font color='red'>鎭枩浣狅紝鎮ㄧ殑璐﹀彿 " + username + " 娉ㄥ唽鎴愬姛锛�</font>", "绯荤粺鎻愮ず", {
+ dangerouslyUseHTMLString: true,
+ type: "success",
+ });
+ await router.push("/login");
+ } else {
+ loading.value = false;
+ if (captchaEnabled) {
+ getCode();
}
- });
+ }
+ }
+ });
}
const getCode = async () => {
- const { data } = await getCodeImg();
- captchaEnabled.value = data.captchaEnabled === undefined ? true : data.captchaEnabled;
- if (captchaEnabled.value) {
- codeUrl.value = "data:image/gif;base64," + data.img;
- registerForm.value.uuid = data.uuid;
- }
+ const { data } = await getCodeImg();
+ captchaEnabled.value = data.captchaEnabled === undefined ? true : data.captchaEnabled;
+ if (captchaEnabled.value) {
+ codeUrl.value = "data:image/gif;base64," + data.img;
+ registerForm.value.uuid = data.uuid;
+ }
}
const initTenantList = async () => {
- const { data } = await getTenantList();
- tenantEnabled.value = data.tenantEnabled === undefined ? true : data.tenantEnabled;
- if (tenantEnabled.value) {
- tenantList.value = data.voList;
- if (tenantList.value != null && tenantList.value.length !== 0) {
- registerForm.value.tenantId = tenantList.value[0].tenantId;
- }
+ const { data } = await getTenantList();
+ tenantEnabled.value = data.tenantEnabled === undefined ? true : data.tenantEnabled;
+ if (tenantEnabled.value) {
+ tenantList.value = data.voList;
+ if (tenantList.value != null && tenantList.value.length !== 0) {
+ registerForm.value.tenantId = tenantList.value[0].tenantId;
}
+ }
}
onMounted(() => {
- getCode();
- initTenantList();
+ getCode();
+ initTenantList();
})
</script>
diff --git a/src/views/system/config/index.vue b/src/views/system/config/index.vue
index 2f3efe0..8ed9f79 100644
--- a/src/views/system/config/index.vue
+++ b/src/views/system/config/index.vue
@@ -1,38 +1,40 @@
<template>
<div class="p-2">
<transition :enter-active-class="proxy?.animate.searchAnimate.enter" :leave-active-class="proxy?.animate.searchAnimate.leave">
- <div class="search" v-show="showSearch">
- <el-form :model="queryParams" ref="queryFormRef" :inline="true" label-width="68px">
- <el-form-item label="鍙傛暟鍚嶇О" prop="configName">
- <el-input v-model="queryParams.configName" placeholder="璇疯緭鍏ュ弬鏁板悕绉�" clearable style="width: 240px" @keyup.enter="handleQuery" />
- </el-form-item>
- <el-form-item label="鍙傛暟閿悕" prop="configKey">
- <el-input v-model="queryParams.configKey" placeholder="璇疯緭鍏ュ弬鏁伴敭鍚�" clearable style="width: 240px" @keyup.enter="handleQuery" />
- </el-form-item>
- <el-form-item label="绯荤粺鍐呯疆" prop="configType">
- <el-select v-model="queryParams.configType" placeholder="绯荤粺鍐呯疆" clearable>
- <el-option v-for="dict in sys_yes_no" :key="dict.value" :label="dict.label" :value="dict.value" />
- </el-select>
- </el-form-item>
- <el-form-item label="鍒涘缓鏃堕棿" style="width: 308px;">
- <el-date-picker
- v-model="dateRange"
- value-format="YYYY-MM-DD HH:mm:ss"
- type="daterange"
- range-separator="-"
- start-placeholder="寮�濮嬫棩鏈�"
- end-placeholder="缁撴潫鏃ユ湡"
- :default-time="[new Date(2000, 1, 1, 0, 0, 0), new Date(2000, 1, 1, 23, 59, 59)]"
- ></el-date-picker>
- </el-form-item>
- <el-form-item>
- <el-button type="primary" icon="Search" @click="handleQuery">鎼滅储</el-button>
- <el-button icon="Refresh" @click="resetQuery">閲嶇疆</el-button>
- </el-form-item>
- </el-form>
+ <div class="mb-[10px]" v-show="showSearch">
+ <el-card shadow="hover">
+ <el-form :model="queryParams" ref="queryFormRef" :inline="true" label-width="68px">
+ <el-form-item label="鍙傛暟鍚嶇О" prop="configName">
+ <el-input v-model="queryParams.configName" placeholder="璇疯緭鍏ュ弬鏁板悕绉�" clearable style="width: 240px" @keyup.enter="handleQuery" />
+ </el-form-item>
+ <el-form-item label="鍙傛暟閿悕" prop="configKey">
+ <el-input v-model="queryParams.configKey" placeholder="璇疯緭鍏ュ弬鏁伴敭鍚�" clearable style="width: 240px" @keyup.enter="handleQuery" />
+ </el-form-item>
+ <el-form-item label="绯荤粺鍐呯疆" prop="configType">
+ <el-select v-model="queryParams.configType" placeholder="绯荤粺鍐呯疆" clearable>
+ <el-option v-for="dict in sys_yes_no" :key="dict.value" :label="dict.label" :value="dict.value" />
+ </el-select>
+ </el-form-item>
+ <el-form-item label="鍒涘缓鏃堕棿" style="width: 308px;">
+ <el-date-picker
+ v-model="dateRange"
+ value-format="YYYY-MM-DD HH:mm:ss"
+ type="daterange"
+ range-separator="-"
+ start-placeholder="寮�濮嬫棩鏈�"
+ end-placeholder="缁撴潫鏃ユ湡"
+ :default-time="[new Date(2000, 1, 1, 0, 0, 0), new Date(2000, 1, 1, 23, 59, 59)]"
+ ></el-date-picker>
+ </el-form-item>
+ <el-form-item>
+ <el-button type="primary" icon="Search" @click="handleQuery">鎼滅储</el-button>
+ <el-button icon="Refresh" @click="resetQuery">閲嶇疆</el-button>
+ </el-form-item>
+ </el-form>
+ </el-card>
</div>
</transition>
- <el-card shadow="never">
+ <el-card shadow="hover">
<template #header>
<el-row :gutter="10" class="mb8">
<el-col :span="1.5">
@@ -123,8 +125,6 @@
<script setup name="Config" lang="ts">
import { listConfig, getConfig, delConfig, addConfig, updateConfig, refreshCache } from "@/api/system/config";
import { ConfigForm, ConfigQuery, ConfigVO } from "@/api/system/config/types";
-import { ComponentInternalInstance } from "vue";
-import { DateModelType } from 'element-plus';
const { proxy } = getCurrentInstance() as ComponentInternalInstance;
const { sys_yes_no } = toRefs<any>(proxy?.useDict("sys_yes_no"));
@@ -138,124 +138,124 @@
const total = ref(0);
const dateRange = ref<[DateModelType, DateModelType]>(['', '']);
-const queryFormRef = ref(ElForm);
-const configFormRef = ref(ElForm);
+const queryFormRef = ref<ElFormInstance>();
+const configFormRef = ref<ElFormInstance>();
const dialog = reactive<DialogOption>({
- visible: false,
- title: ''
+ visible: false,
+ title: ''
});
const initFormData: ConfigForm = {
- configId: undefined,
- configName: '',
- configKey: '',
- configValue: '',
- configType: "Y",
- remark: ''
+ configId: undefined,
+ configName: '',
+ configKey: '',
+ configValue: '',
+ configType: "Y",
+ remark: ''
}
const data = reactive<PageData<ConfigForm, ConfigQuery>>({
- form: {...initFormData},
- queryParams: {
- pageNum: 1,
- pageSize: 10,
- configName: '',
- configKey: '',
- configType: '',
- },
- rules: {
- configName: [{ required: true, message: "鍙傛暟鍚嶇О涓嶈兘涓虹┖", trigger: "blur" }],
- configKey: [{ required: true, message: "鍙傛暟閿悕涓嶈兘涓虹┖", trigger: "blur" }],
- configValue: [{ required: true, message: "鍙傛暟閿�间笉鑳戒负绌�", trigger: "blur" }]
- }
+ form: { ...initFormData },
+ queryParams: {
+ pageNum: 1,
+ pageSize: 10,
+ configName: '',
+ configKey: '',
+ configType: '',
+ },
+ rules: {
+ configName: [{ required: true, message: "鍙傛暟鍚嶇О涓嶈兘涓虹┖", trigger: "blur" }],
+ configKey: [{ required: true, message: "鍙傛暟閿悕涓嶈兘涓虹┖", trigger: "blur" }],
+ configValue: [{ required: true, message: "鍙傛暟閿�间笉鑳戒负绌�", trigger: "blur" }]
+ }
});
const { queryParams, form, rules } = toRefs(data);
/** 鏌ヨ鍙傛暟鍒楄〃 */
const getList = async () => {
- loading.value = true;
- const res = await listConfig(proxy?.addDateRange(queryParams.value, dateRange.value));
- configList.value = res.rows;
- total.value = res.total;
- loading.value = false;
+ loading.value = true;
+ const res = await listConfig(proxy?.addDateRange(queryParams.value, dateRange.value));
+ configList.value = res.rows;
+ total.value = res.total;
+ loading.value = false;
}
/** 鍙栨秷鎸夐挳 */
const cancel = () => {
- reset();
- dialog.visible = false;
+ reset();
+ dialog.visible = false;
}
/** 琛ㄥ崟閲嶇疆 */
const reset = () => {
- form.value = {...initFormData};
- configFormRef.value.resetFields();
+ form.value = { ...initFormData };
+ configFormRef.value?.resetFields();
}
/** 鎼滅储鎸夐挳鎿嶄綔 */
const handleQuery = () => {
- queryParams.value.pageNum = 1;
- getList();
+ queryParams.value.pageNum = 1;
+ getList();
}
/** 閲嶇疆鎸夐挳鎿嶄綔 */
const resetQuery = () => {
- dateRange.value = ['', ''];
- queryFormRef.value.resetFields();
- handleQuery();
+ dateRange.value = ['', ''];
+ queryFormRef.value?.resetFields();
+ handleQuery();
}
/** 澶氶�夋閫変腑鏁版嵁 */
const handleSelectionChange = (selection: ConfigVO[]) => {
- ids.value = selection.map(item => item.configId);
- single.value = selection.length != 1;
- multiple.value = !selection.length;
+ ids.value = selection.map(item => item.configId);
+ single.value = selection.length != 1;
+ multiple.value = !selection.length;
}
/** 鏂板鎸夐挳鎿嶄綔 */
const handleAdd = () => {
- dialog.visible = true;
- dialog.title = "娣诲姞鍙傛暟";
- nextTick(() => {
- reset();
- })
+ dialog.visible = true;
+ dialog.title = "娣诲姞鍙傛暟";
+ nextTick(() => {
+ reset();
+ })
}
/** 淇敼鎸夐挳鎿嶄綔 */
const handleUpdate = (row?: ConfigVO) => {
- dialog.visible = true;
- dialog.title = "淇敼鍙傛暟";
- const configId = row?.configId || ids.value[0];
- nextTick(async () => {
- reset();
- const res = await getConfig(configId);
- form.value = res.data;
- })
+ dialog.visible = true;
+ dialog.title = "淇敼鍙傛暟";
+ const configId = row?.configId || ids.value[0];
+ nextTick(async () => {
+ reset();
+ const res = await getConfig(configId);
+ form.value = res.data;
+ })
}
/** 鎻愪氦鎸夐挳 */
const submitForm = () => {
- configFormRef.value.validate(async (valid: boolean) => {
- if (valid) {
- form.value.configId ? await updateConfig(form.value) : await addConfig(form.value);
- proxy?.$modal.msgSuccess("鎿嶄綔鎴愬姛");
- dialog.visible = false;
- getList();
- }
- });
+ configFormRef.value?.validate(async (valid: boolean) => {
+ if (valid) {
+ form.value.configId ? await updateConfig(form.value) : await addConfig(form.value);
+ proxy?.$modal.msgSuccess("鎿嶄綔鎴愬姛");
+ dialog.visible = false;
+ await getList();
+ }
+ });
}
/** 鍒犻櫎鎸夐挳鎿嶄綔 */
const handleDelete = async (row?: ConfigVO) => {
- const configIds = row?.configId || ids.value;
- await proxy?.$modal.confirm('鏄惁纭鍒犻櫎鍙傛暟缂栧彿涓�"' + configIds + '"鐨勬暟鎹」锛�');
- await delConfig(configIds);
- getList();
- proxy?.$modal.msgSuccess("鍒犻櫎鎴愬姛");
+ const configIds = row?.configId || ids.value;
+ await proxy?.$modal.confirm('鏄惁纭鍒犻櫎鍙傛暟缂栧彿涓�"' + configIds + '"鐨勬暟鎹」锛�');
+ await delConfig(configIds);
+ await getList();
+ proxy?.$modal.msgSuccess("鍒犻櫎鎴愬姛");
}
/** 瀵煎嚭鎸夐挳鎿嶄綔 */
const handleExport = () => {
- proxy?.download("system/config/export", {
- ...queryParams.value
- }, `config_${new Date().getTime()}.xlsx`);
+ proxy?.download("system/config/export", {
+ ...queryParams.value
+ }, `config_${new Date().getTime()}.xlsx`);
}
/** 鍒锋柊缂撳瓨鎸夐挳鎿嶄綔 */
const handleRefreshCache = async () => {
- await refreshCache();
- proxy?.$modal.msgSuccess("鍒锋柊缂撳瓨鎴愬姛");
+ await refreshCache();
+ proxy?.$modal.msgSuccess("鍒锋柊缂撳瓨鎴愬姛");
}
onMounted(() => {
- getList();
+ getList();
})
</script>
diff --git a/src/views/system/dept/index.vue b/src/views/system/dept/index.vue
index fad48a3..e833e71 100644
--- a/src/views/system/dept/index.vue
+++ b/src/views/system/dept/index.vue
@@ -1,25 +1,27 @@
<template>
<div class="p-2">
<transition :enter-active-class="proxy?.animate.searchAnimate.enter" :leave-active-class="proxy?.animate.searchAnimate.leave">
- <div class="search" v-show="showSearch">
- <el-form ref="queryFormRef" :model="queryParams" :inline="true" label-width="68px">
- <el-form-item label="鑿滃崟鍚嶇О" prop="menuName">
- <el-input v-model="queryParams.deptName" placeholder="璇疯緭鍏ラ儴闂ㄥ悕绉�" clearable @keyup.enter="handleQuery" />
- </el-form-item>
- <el-form-item label="鐘舵��" prop="status">
- <el-select v-model="queryParams.status" placeholder="閮ㄩ棬鐘舵��" clearable>
- <el-option v-for="dict in sys_normal_disable" :key="dict.value" :label="dict.label" :value="dict.value" />
- </el-select>
- </el-form-item>
- <el-form-item>
- <el-button type="primary" icon="Search" @click="handleQuery">鎼滅储</el-button>
- <el-button icon="Refresh" @click="resetQuery">閲嶇疆</el-button>
- </el-form-item>
- </el-form>
+ <div class="mb-[10px]" v-show="showSearch">
+ <el-card shadow="hover">
+ <el-form ref="queryFormRef" :model="queryParams" :inline="true" label-width="68px">
+ <el-form-item label="鑿滃崟鍚嶇О" prop="menuName">
+ <el-input v-model="queryParams.deptName" placeholder="璇疯緭鍏ラ儴闂ㄥ悕绉�" clearable @keyup.enter="handleQuery" />
+ </el-form-item>
+ <el-form-item label="鐘舵��" prop="status">
+ <el-select v-model="queryParams.status" placeholder="閮ㄩ棬鐘舵��" clearable>
+ <el-option v-for="dict in sys_normal_disable" :key="dict.value" :label="dict.label" :value="dict.value" />
+ </el-select>
+ </el-form-item>
+ <el-form-item>
+ <el-button type="primary" icon="Search" @click="handleQuery">鎼滅储</el-button>
+ <el-button icon="Refresh" @click="resetQuery">閲嶇疆</el-button>
+ </el-form-item>
+ </el-form>
+ </el-card>
</div>
</transition>
- <el-card shadow="never">
+ <el-card shadow="hover">
<template #header>
<el-row :gutter="10">
<el-col :span="1.5">
@@ -130,13 +132,12 @@
<script setup name="Dept" lang="ts">
import { listDept, getDept, delDept, addDept, updateDept, listDeptExcludeChild } from "@/api/system/dept"
-import { ComponentInternalInstance } from 'vue';
import { DeptForm, DeptQuery, DeptVO } from "@/api/system/dept/types";
interface DeptOptionsType {
- deptId: number | string;
- deptName: string;
- children: DeptOptionsType[];
+ deptId: number | string;
+ deptName: string;
+ children: DeptOptionsType[];
}
@@ -151,142 +152,146 @@
const dialog = reactive<DialogOption>({
- visible: false,
- title: ''
+ visible: false,
+ title: ''
});
-const deptTableRef = ref(ElTable);
-const queryFormRef = ref(ElForm);
-const deptFormRef = ref(ElForm);
+const deptTableRef = ref<ElTableInstance>();
+const queryFormRef = ref<ElFormInstance>();
+const deptFormRef = ref<ElFormInstance>();
const initFormData: DeptForm = {
- deptId: undefined,
- parentId: undefined,
- deptName: undefined,
- orderNum: 0,
- leader: undefined,
- phone: undefined,
- email: undefined,
- status: "0"
+ deptId: undefined,
+ parentId: undefined,
+ deptName: undefined,
+ orderNum: 0,
+ leader: undefined,
+ phone: undefined,
+ email: undefined,
+ status: "0"
}
const data = reactive<PageData<DeptForm, DeptQuery>>({
- form: {...initFormData},
- queryParams: {
- pageNum: 1,
- pageSize: 10,
- deptName: undefined,
- status: undefined
- },
- rules: {
- parentId: [{ required: true, message: "涓婄骇閮ㄩ棬涓嶈兘涓虹┖", trigger: "blur" }],
- deptName: [{ required: true, message: "閮ㄩ棬鍚嶇О涓嶈兘涓虹┖", trigger: "blur" }],
- orderNum: [{ required: true, message: "鏄剧ず鎺掑簭涓嶈兘涓虹┖", trigger: "blur" }],
- email: [{ type: "email", message: "璇疯緭鍏ユ纭殑閭鍦板潃", trigger: ["blur", "change"] }],
- phone: [{ pattern: /^1[3|4|5|6|7|8|9][0-9]\d{8}$/, message: "璇疯緭鍏ユ纭殑鎵嬫満鍙风爜", trigger: "blur" }]
- },
+ form: { ...initFormData },
+ queryParams: {
+ pageNum: 1,
+ pageSize: 10,
+ deptName: undefined,
+ status: undefined
+ },
+ rules: {
+ parentId: [{ required: true, message: "涓婄骇閮ㄩ棬涓嶈兘涓虹┖", trigger: "blur" }],
+ deptName: [{ required: true, message: "閮ㄩ棬鍚嶇О涓嶈兘涓虹┖", trigger: "blur" }],
+ orderNum: [{ required: true, message: "鏄剧ず鎺掑簭涓嶈兘涓虹┖", trigger: "blur" }],
+ email: [{ type: "email", message: "璇疯緭鍏ユ纭殑閭鍦板潃", trigger: ["blur", "change"] }],
+ phone: [{ pattern: /^1[3|4|5|6|7|8|9][0-9]\d{8}$/, message: "璇疯緭鍏ユ纭殑鎵嬫満鍙风爜", trigger: "blur" }]
+ },
})
const { queryParams, form, rules } = toRefs<PageData<DeptForm, DeptQuery>>(data)
/** 鏌ヨ鑿滃崟鍒楄〃 */
const getList = async () => {
- loading.value = true;
- const res = await listDept(queryParams.value);
- const data = proxy?.handleTree<DeptVO>(res.data, "deptId")
- if (data) {
- deptList.value = data
- }
- loading.value = false
+ loading.value = true;
+ const res = await listDept(queryParams.value);
+ const data = proxy?.handleTree<DeptVO>(res.data, "deptId")
+ if (data) {
+ deptList.value = data
+ }
+ loading.value = false
}
/** 鍙栨秷鎸夐挳 */
const cancel = () => {
- reset()
- dialog.visible = false
+ reset()
+ dialog.visible = false
}
/** 琛ㄥ崟閲嶇疆 */
const reset = () => {
- form.value = {...initFormData};
- deptFormRef.value.resetFields();
+ form.value = { ...initFormData };
+ deptFormRef.value?.resetFields();
}
/** 鎼滅储鎸夐挳鎿嶄綔 */
const handleQuery = () => {
- getList();
+ getList();
}
/** 閲嶇疆鎸夐挳鎿嶄綔 */
const resetQuery = () => {
- queryFormRef.value.resetFields();
- handleQuery()
+ queryFormRef.value?.resetFields();
+ handleQuery()
}
/** 鏂板鎸夐挳鎿嶄綔 */
const handleAdd = (row?: DeptVO) => {
- listDept().then(res => {
- const data = proxy?.handleTree<DeptOptionsType>(res.data, "deptId");
- if (data) {
- deptOptions.value = data
- dialog.visible = true;
- dialog.title = "娣诲姞閮ㄩ棬";
- nextTick(() => {
- reset();
- if (row && row.deptId) {
- form.value.parentId = row?.deptId;
- }
- })
+ listDept().then(res => {
+ const data = proxy?.handleTree<DeptOptionsType>(res.data, "deptId");
+ if (data) {
+ deptOptions.value = data
+ dialog.visible = true;
+ dialog.title = "娣诲姞閮ㄩ棬";
+ nextTick(() => {
+ reset();
+ if (row && row.deptId) {
+ form.value.parentId = row?.deptId;
}
- })
+ })
+ }
+ })
}
/** 灞曞紑/鎶樺彔鎿嶄綔 */
const handleToggleExpandAll = () => {
- isExpandAll.value = !isExpandAll.value;
- toggleExpandAll(deptList.value, isExpandAll.value)
+ isExpandAll.value = !isExpandAll.value;
+ toggleExpandAll(deptList.value, isExpandAll.value)
}
/** 灞曞紑/鎶樺彔鎵�鏈� */
const toggleExpandAll = (data: DeptVO[], status: boolean) => {
- data.forEach((item) => {
- deptTableRef.value.toggleRowExpansion(item, status)
- if(item.children && item.children.length > 0) toggleExpandAll(item.children, status)
- })
+ data.forEach((item) => {
+ deptTableRef.value?.toggleRowExpansion(item, status)
+ if (item.children && item.children.length > 0) toggleExpandAll(item.children, status)
+ })
}
/** 淇敼鎸夐挳鎿嶄綔 */
const handleUpdate = async (row: DeptVO) => {
- const res = await getDept(row.deptId);
- dialog.visible = true;
- dialog.title = "淇敼閮ㄩ棬";
- nextTick(async () => {
- reset();
- form.value = res.data
- const response = await listDeptExcludeChild(row.deptId);
- const data = proxy?.handleTree<DeptOptionsType>(response.data, "deptId")
- if (data) {
- deptOptions.value = data;
- if (data.length === 0) {
- const noResultsOptions: DeptOptionsType = { deptId: res.data.parentId, deptName: res.data.parentName, children: [] };
- deptOptions.value.push(noResultsOptions);
- }
- }
- })
+ const res = await getDept(row.deptId);
+ dialog.visible = true;
+ dialog.title = "淇敼閮ㄩ棬";
+ await nextTick(async () => {
+ reset();
+ form.value = res.data
+ const response = await listDeptExcludeChild(row.deptId);
+ const data = proxy?.handleTree<DeptOptionsType>(response.data, "deptId")
+ if (data) {
+ deptOptions.value = data;
+ if (data.length === 0) {
+ const noResultsOptions: DeptOptionsType = {
+ deptId: res.data.parentId,
+ deptName: res.data.parentName,
+ children: []
+ };
+ deptOptions.value.push(noResultsOptions);
+ }
+ }
+ })
}
/** 鎻愪氦鎸夐挳 */
const submitForm = () => {
- deptFormRef.value.validate(async (valid: boolean) => {
- if (valid) {
- form.value.deptId ? await updateDept(form.value) : await addDept(form.value);
- proxy?.$modal.msgSuccess("鎿嶄綔鎴愬姛");
- dialog.visible = false;
- getList();
- }
- })
+ deptFormRef.value?.validate(async (valid: boolean) => {
+ if (valid) {
+ form.value.deptId ? await updateDept(form.value) : await addDept(form.value);
+ proxy?.$modal.msgSuccess("鎿嶄綔鎴愬姛");
+ dialog.visible = false;
+ await getList();
+ }
+ })
}
/** 鍒犻櫎鎸夐挳鎿嶄綔 */
const handleDelete = async (row: DeptVO) => {
- await proxy?.$modal.confirm('鏄惁纭鍒犻櫎鍚嶇О涓�"' + row.deptName + '"鐨勬暟鎹」?');
- await delDept(row.deptId);
- getList();
- proxy?.$modal.msgSuccess("鍒犻櫎鎴愬姛");
+ await proxy?.$modal.confirm('鏄惁纭鍒犻櫎鍚嶇О涓�"' + row.deptName + '"鐨勬暟鎹」?');
+ await delDept(row.deptId);
+ await getList();
+ proxy?.$modal.msgSuccess("鍒犻櫎鎴愬姛");
}
onMounted(() => {
- getList();
+ getList();
});
</script>
diff --git a/src/views/system/dict/data.vue b/src/views/system/dict/data.vue
index 2b26493..f40c129 100644
--- a/src/views/system/dict/data.vue
+++ b/src/views/system/dict/data.vue
@@ -1,29 +1,31 @@
<template>
<div class="p-2">
<transition :enter-active-class="proxy?.animate.searchAnimate.enter" :leave-active-class="proxy?.animate.searchAnimate.leave">
- <div class="search" v-show="showSearch">
- <el-form :model="queryParams" ref="queryFormRef" :inline="true" label-width="68px">
- <el-form-item label="瀛楀吀鍚嶇О" prop="dictType">
- <el-select v-model="queryParams.dictType" style="width: 200px">
- <el-option v-for="item in typeOptions" :key="item.dictId" :label="item.dictName" :value="item.dictType" />
- </el-select>
- </el-form-item>
- <el-form-item label="瀛楀吀鏍囩" prop="dictLabel">
- <el-input v-model="queryParams.dictLabel" placeholder="璇疯緭鍏ュ瓧鍏告爣绛�" clearable style="width: 200px" @keyup.enter="handleQuery" />
- </el-form-item>
- <el-form-item label="鐘舵��" prop="status">
- <el-select v-model="queryParams.status" placeholder="鏁版嵁鐘舵��" clearable style="width: 200px">
- <el-option v-for="dict in sys_normal_disable" :key="dict.value" :label="dict.label" :value="dict.value" />
- </el-select>
- </el-form-item>
- <el-form-item>
- <el-button type="primary" icon="Search" @click="handleQuery">鎼滅储</el-button>
- <el-button icon="Refresh" @click="resetQuery">閲嶇疆</el-button>
- </el-form-item>
- </el-form>
+ <div class="mb-[10px]" v-show="showSearch">
+ <el-card shadow="hover">
+ <el-form :model="queryParams" ref="queryFormRef" :inline="true" label-width="68px">
+ <el-form-item label="瀛楀吀鍚嶇О" prop="dictType">
+ <el-select v-model="queryParams.dictType" style="width: 200px">
+ <el-option v-for="item in typeOptions" :key="item.dictId" :label="item.dictName" :value="item.dictType" />
+ </el-select>
+ </el-form-item>
+ <el-form-item label="瀛楀吀鏍囩" prop="dictLabel">
+ <el-input v-model="queryParams.dictLabel" placeholder="璇疯緭鍏ュ瓧鍏告爣绛�" clearable style="width: 200px" @keyup.enter="handleQuery" />
+ </el-form-item>
+ <el-form-item label="鐘舵��" prop="status">
+ <el-select v-model="queryParams.status" placeholder="鏁版嵁鐘舵��" clearable style="width: 200px">
+ <el-option v-for="dict in sys_normal_disable" :key="dict.value" :label="dict.label" :value="dict.value" />
+ </el-select>
+ </el-form-item>
+ <el-form-item>
+ <el-button type="primary" icon="Search" @click="handleQuery">鎼滅储</el-button>
+ <el-button icon="Refresh" @click="resetQuery">閲嶇疆</el-button>
+ </el-form-item>
+ </el-form>
+ </el-card>
</div>
</transition>
- <el-card shadow="never">
+ <el-card shadow="hover">
<template #header>
<el-row :gutter="10" class="mb8">
<el-col :span="1.5">
@@ -136,9 +138,7 @@
import { optionselect as getDictOptionselect, getType } from "@/api/system/dict/type";
import { listData, getData, delData, addData, updateData } from "@/api/system/dict/data";
import { DictTypeVO } from '@/api/system/dict/type/types';
-import { ComponentInternalInstance } from "vue";
import { DictDataForm, DictDataQuery, DictDataVO } from "@/api/system/dict/data/types";
-import { ElForm } from 'element-plus';
const { proxy } = getCurrentInstance() as ComponentInternalInstance
const { sys_normal_disable } = toRefs<any>(proxy?.useDict("sys_normal_disable"));
@@ -154,159 +154,159 @@
const defaultDictType = ref("");
const typeOptions = ref<DictTypeVO[]>([]);
-const dataFormRef = ref(ElForm);
-const queryFormRef = ref(ElForm);
+const dataFormRef = ref<ElFormInstance>();
+const queryFormRef = ref<ElFormInstance>();
const dialog = reactive<DialogOption>({
- visible: false,
- title: ''
+ visible: false,
+ title: ''
});
// 鏁版嵁鏍囩鍥炴樉鏍峰紡
const listClassOptions = ref<Array<{ value: string, label: string }>>([
- { value: "default", label: "榛樿" },
- { value: "primary", label: "涓昏" },
- { value: "success", label: "鎴愬姛" },
- { value: "info", label: "淇℃伅" },
- { value: "warning", label: "璀﹀憡" },
- { value: "danger", label: "鍗遍櫓" }
+ { value: "default", label: "榛樿" },
+ { value: "primary", label: "涓昏" },
+ { value: "success", label: "鎴愬姛" },
+ { value: "info", label: "淇℃伅" },
+ { value: "warning", label: "璀﹀憡" },
+ { value: "danger", label: "鍗遍櫓" }
]);
const initFormData: DictDataForm = {
- dictCode: undefined,
- dictLabel: '',
- dictValue: '',
- cssClass: '',
- listClass: "default",
- dictSort: 0,
- status: "0",
- remark: ''
+ dictCode: undefined,
+ dictLabel: '',
+ dictValue: '',
+ cssClass: '',
+ listClass: "default",
+ dictSort: 0,
+ status: "0",
+ remark: ''
}
const data = reactive<PageData<DictDataForm, DictDataQuery>>({
- form: { ...initFormData },
- queryParams: {
- pageNum: 1,
- pageSize: 10,
- dictName: '',
- dictType: '',
- status: '',
- dictLabel: ''
- },
- rules: {
- dictLabel: [{ required: true, message: "鏁版嵁鏍囩涓嶈兘涓虹┖", trigger: "blur" }],
- dictValue: [{ required: true, message: "鏁版嵁閿�间笉鑳戒负绌�", trigger: "blur" }],
- dictSort: [{ required: true, message: "鏁版嵁椤哄簭涓嶈兘涓虹┖", trigger: "blur" }]
- }
+ form: { ...initFormData },
+ queryParams: {
+ pageNum: 1,
+ pageSize: 10,
+ dictName: '',
+ dictType: '',
+ status: '',
+ dictLabel: ''
+ },
+ rules: {
+ dictLabel: [{ required: true, message: "鏁版嵁鏍囩涓嶈兘涓虹┖", trigger: "blur" }],
+ dictValue: [{ required: true, message: "鏁版嵁閿�间笉鑳戒负绌�", trigger: "blur" }],
+ dictSort: [{ required: true, message: "鏁版嵁椤哄簭涓嶈兘涓虹┖", trigger: "blur" }]
+ }
});
const { queryParams, form, rules } = toRefs(data);
/** 鏌ヨ瀛楀吀绫诲瀷璇︾粏 */
const getTypes = async (dictId: string | number) => {
- const { data } = await getType(dictId);
- queryParams.value.dictType = data.dictType;
- defaultDictType.value = data.dictType;
- getList();
+ const { data } = await getType(dictId);
+ queryParams.value.dictType = data.dictType;
+ defaultDictType.value = data.dictType;
+ getList();
}
/** 鏌ヨ瀛楀吀绫诲瀷鍒楄〃 */
const getTypeList = async () => {
- const res = await getDictOptionselect()
- typeOptions.value = res.data;
+ const res = await getDictOptionselect()
+ typeOptions.value = res.data;
}
/** 鏌ヨ瀛楀吀鏁版嵁鍒楄〃 */
const getList = async () => {
- loading.value = true;
- const res = await listData(queryParams.value);
- dataList.value = res.rows;
- total.value = res.total;
- loading.value = false;
+ loading.value = true;
+ const res = await listData(queryParams.value);
+ dataList.value = res.rows;
+ total.value = res.total;
+ loading.value = false;
}
/** 鍙栨秷鎸夐挳 */
const cancel = () => {
- dialog.visible = false;
- reset();
+ dialog.visible = false;
+ reset();
}
/** 琛ㄥ崟閲嶇疆 */
const reset = () => {
- form.value = { ...initFormData };
- dataFormRef.value.resetFields();
+ form.value = { ...initFormData };
+ dataFormRef.value?.resetFields();
}
/** 鎼滅储鎸夐挳鎿嶄綔 */
const handleQuery = () => {
- queryParams.value.pageNum = 1;
- getList();
+ queryParams.value.pageNum = 1;
+ getList();
}
/** 杩斿洖鎸夐挳鎿嶄綔 */
const handleClose = () => {
- const obj = { path: "/system/dict" };
- proxy?.$tab.closeOpenPage(obj);
+ const obj = { path: "/system/dict" };
+ proxy?.$tab.closeOpenPage(obj);
}
/** 閲嶇疆鎸夐挳鎿嶄綔 */
const resetQuery = () => {
- queryFormRef.value.resetFields();
- queryParams.value.dictType = defaultDictType.value;
- handleQuery();
+ queryFormRef.value?.resetFields();
+ queryParams.value.dictType = defaultDictType.value;
+ handleQuery();
}
/** 鏂板鎸夐挳鎿嶄綔 */
const handleAdd = () => {
- dialog.visible = true;
- dialog.title = "娣诲姞瀛楀吀鏁版嵁";
- nextTick(() => {
- reset();
- form.value.dictType = queryParams.value.dictType;
- })
+ dialog.visible = true;
+ dialog.title = "娣诲姞瀛楀吀鏁版嵁";
+ nextTick(() => {
+ reset();
+ form.value.dictType = queryParams.value.dictType;
+ })
}
/** 澶氶�夋閫変腑鏁版嵁 */
const handleSelectionChange = (selection: DictDataVO[]) => {
- ids.value = selection.map(item => item.dictCode);
- single.value = selection.length != 1;
- multiple.value = !selection.length;
+ ids.value = selection.map(item => item.dictCode);
+ single.value = selection.length != 1;
+ multiple.value = !selection.length;
}
/** 淇敼鎸夐挳鎿嶄綔 */
const handleUpdate = (row?: DictDataVO) => {
- const dictCode = row?.dictCode || ids.value[0];
- dialog.visible = true;
- dialog.title = "淇敼瀛楀吀鏁版嵁";
- nextTick(async () => {
- const res = await getData(dictCode);
- reset();
- form.value = res.data;
- })
+ const dictCode = row?.dictCode || ids.value[0];
+ dialog.visible = true;
+ dialog.title = "淇敼瀛楀吀鏁版嵁";
+ nextTick(async () => {
+ const res = await getData(dictCode);
+ reset();
+ form.value = res.data;
+ })
}
/** 鎻愪氦鎸夐挳 */
const submitForm = () => {
- dataFormRef.value.validate(async (valid: boolean) => {
- if (valid) {
- form.value.dictCode ? await updateData(form.value) : await addData(form.value);
- useDictStore().removeDict(queryParams.value.dictType);
- proxy?.$modal.msgSuccess("鎿嶄綔鎴愬姛");
- dialog.visible = false;
- getList();
+ dataFormRef.value?.validate(async (valid: boolean) => {
+ if (valid) {
+ form.value.dictCode ? await updateData(form.value) : await addData(form.value);
+ useDictStore().removeDict(queryParams.value.dictType);
+ proxy?.$modal.msgSuccess("鎿嶄綔鎴愬姛");
+ dialog.visible = false;
+ await getList();
- }
- });
+ }
+ });
}
/** 鍒犻櫎鎸夐挳鎿嶄綔 */
const handleDelete = async (row?: DictDataVO) => {
- const dictCodes = row?.dictCode || ids.value;
- await proxy?.$modal.confirm('鏄惁纭鍒犻櫎瀛楀吀缂栫爜涓�"' + dictCodes + '"鐨勬暟鎹」锛�');
- await delData(dictCodes);
- getList();
- proxy?.$modal.msgSuccess("鍒犻櫎鎴愬姛");
- useDictStore().removeDict(queryParams.value.dictType);
+ const dictCodes = row?.dictCode || ids.value;
+ await proxy?.$modal.confirm('鏄惁纭鍒犻櫎瀛楀吀缂栫爜涓�"' + dictCodes + '"鐨勬暟鎹」锛�');
+ await delData(dictCodes);
+ await getList();
+ proxy?.$modal.msgSuccess("鍒犻櫎鎴愬姛");
+ useDictStore().removeDict(queryParams.value.dictType);
}
/** 瀵煎嚭鎸夐挳鎿嶄綔 */
const handleExport = () => {
- proxy?.download("system/dict/data/export", {
- ...queryParams.value
- }, `dict_data_${new Date().getTime()}.xlsx`);
+ proxy?.download("system/dict/data/export", {
+ ...queryParams.value
+ }, `dict_data_${new Date().getTime()}.xlsx`);
}
onMounted(() => {
- getTypes(route.params && route.params.dictId as string);
- getTypeList();
+ getTypes(route.params && route.params.dictId as string);
+ getTypeList();
})
</script>
diff --git a/src/views/system/dict/index.vue b/src/views/system/dict/index.vue
index 7872c76..c246462 100644
--- a/src/views/system/dict/index.vue
+++ b/src/views/system/dict/index.vue
@@ -1,38 +1,40 @@
<template>
<div class="p-2">
<transition :enter-active-class="proxy?.animate.searchAnimate.enter" :leave-active-class="proxy?.animate.searchAnimate.leave">
- <div class="search" v-show="showSearch">
- <el-form :model="queryParams" ref="queryFormRef" :inline="true" label-width="68px">
- <el-form-item label="瀛楀吀鍚嶇О" prop="dictName">
- <el-input v-model="queryParams.dictName" placeholder="璇疯緭鍏ュ瓧鍏稿悕绉�" clearable style="width: 240px" @keyup.enter="handleQuery" />
- </el-form-item>
- <el-form-item label="瀛楀吀绫诲瀷" prop="dictType">
- <el-input v-model="queryParams.dictType" placeholder="璇疯緭鍏ュ瓧鍏哥被鍨�" clearable style="width: 240px" @keyup.enter="handleQuery" />
- </el-form-item>
- <el-form-item label="鐘舵��" prop="status">
- <el-select v-model="queryParams.status" placeholder="瀛楀吀鐘舵��" clearable style="width: 240px">
- <el-option v-for="dict in sys_normal_disable" :key="dict.value" :label="dict.label" :value="dict.value" />
- </el-select>
- </el-form-item>
- <el-form-item label="鍒涘缓鏃堕棿" style="width: 308px">
- <el-date-picker
- v-model="dateRange"
- value-format="YYYY-MM-DD HH:mm:ss"
- type="daterange"
- range-separator="-"
- start-placeholder="寮�濮嬫棩鏈�"
- end-placeholder="缁撴潫鏃ユ湡"
- :default-time="[new Date(2000, 1, 1, 0, 0, 0), new Date(2000, 1, 1, 23, 59, 59)]"
- ></el-date-picker>
- </el-form-item>
- <el-form-item>
- <el-button type="primary" icon="Search" @click="handleQuery">鎼滅储</el-button>
- <el-button icon="Refresh" @click="resetQuery">閲嶇疆</el-button>
- </el-form-item>
- </el-form>
+ <div class="mb-[10px]" v-show="showSearch">
+ <el-card shadow="hover">
+ <el-form :model="queryParams" ref="queryFormRef" :inline="true" label-width="68px">
+ <el-form-item label="瀛楀吀鍚嶇О" prop="dictName">
+ <el-input v-model="queryParams.dictName" placeholder="璇疯緭鍏ュ瓧鍏稿悕绉�" clearable style="width: 240px" @keyup.enter="handleQuery" />
+ </el-form-item>
+ <el-form-item label="瀛楀吀绫诲瀷" prop="dictType">
+ <el-input v-model="queryParams.dictType" placeholder="璇疯緭鍏ュ瓧鍏哥被鍨�" clearable style="width: 240px" @keyup.enter="handleQuery" />
+ </el-form-item>
+ <el-form-item label="鐘舵��" prop="status">
+ <el-select v-model="queryParams.status" placeholder="瀛楀吀鐘舵��" clearable style="width: 240px">
+ <el-option v-for="dict in sys_normal_disable" :key="dict.value" :label="dict.label" :value="dict.value" />
+ </el-select>
+ </el-form-item>
+ <el-form-item label="鍒涘缓鏃堕棿" style="width: 308px">
+ <el-date-picker
+ v-model="dateRange"
+ value-format="YYYY-MM-DD HH:mm:ss"
+ type="daterange"
+ range-separator="-"
+ start-placeholder="寮�濮嬫棩鏈�"
+ end-placeholder="缁撴潫鏃ユ湡"
+ :default-time="[new Date(2000, 1, 1, 0, 0, 0), new Date(2000, 1, 1, 23, 59, 59)]"
+ ></el-date-picker>
+ </el-form-item>
+ <el-form-item>
+ <el-button type="primary" icon="Search" @click="handleQuery">鎼滅储</el-button>
+ <el-button icon="Refresh" @click="resetQuery">閲嶇疆</el-button>
+ </el-form-item>
+ </el-form>
+ </el-card>
</div>
</transition>
- <el-card shadow="never">
+ <el-card shadow="hover">
<template #header>
<el-row :gutter="10" class="mb8">
<el-col :span="1.5">
@@ -123,9 +125,7 @@
<script setup name="Dict" lang="ts">
import useDictStore from '@/store/modules/dict'
import { listType, getType, delType, addType, updateType, refreshCache } from "@/api/system/dict/type";
-import { ComponentInternalInstance } from "vue";
import { DictTypeForm, DictTypeQuery, DictTypeVO } from "@/api/system/dict/type/types";
-import { DateModelType } from 'element-plus';
const { proxy } = getCurrentInstance() as ComponentInternalInstance;
const { sys_normal_disable } = toRefs<any>(proxy?.useDict("sys_normal_disable"))
@@ -139,128 +139,128 @@
const total = ref(0);
const dateRange = ref<[DateModelType, DateModelType]>(['', '']);
-const dictFormRef = ref(ElForm);
-const queryFormRef = ref(ElForm);
+const dictFormRef = ref<ElFormInstance>();
+const queryFormRef = ref<ElFormInstance>();
const dialog = reactive<DialogOption>({
- visible: false,
- title: ''
+ visible: false,
+ title: ''
});
const initFormData: DictTypeForm = {
- dictId: undefined,
- dictName: '',
- dictType: '',
- status: "0",
- remark: ''
+ dictId: undefined,
+ dictName: '',
+ dictType: '',
+ status: "0",
+ remark: ''
}
const data = reactive<PageData<DictTypeForm, DictTypeQuery>>({
- form: {...initFormData},
- queryParams: {
- pageNum: 1,
- pageSize: 10,
- dictName: '',
- dictType: '',
- status: ''
- },
- rules: {
- dictName: [{ required: true, message: "瀛楀吀鍚嶇О涓嶈兘涓虹┖", trigger: "blur" }],
- dictType: [{ required: true, message: "瀛楀吀绫诲瀷涓嶈兘涓虹┖", trigger: "blur" }]
- },
+ form: { ...initFormData },
+ queryParams: {
+ pageNum: 1,
+ pageSize: 10,
+ dictName: '',
+ dictType: '',
+ status: ''
+ },
+ rules: {
+ dictName: [{ required: true, message: "瀛楀吀鍚嶇О涓嶈兘涓虹┖", trigger: "blur" }],
+ dictType: [{ required: true, message: "瀛楀吀绫诲瀷涓嶈兘涓虹┖", trigger: "blur" }]
+ },
});
const { queryParams, form, rules } = toRefs(data);
/** 鏌ヨ瀛楀吀绫诲瀷鍒楄〃 */
const getList = () => {
- loading.value = true;
- listType(proxy?.addDateRange(queryParams.value, dateRange.value)).then(res => {
- typeList.value = res.rows;
- total.value = res.total;
- loading.value = false;
- });
+ loading.value = true;
+ listType(proxy?.addDateRange(queryParams.value, dateRange.value)).then(res => {
+ typeList.value = res.rows;
+ total.value = res.total;
+ loading.value = false;
+ });
}
/** 鍙栨秷鎸夐挳 */
const cancel = () => {
- reset();
- dialog.visible = false;
+ reset();
+ dialog.visible = false;
}
/** 琛ㄥ崟閲嶇疆 */
const reset = () => {
- form.value = {...initFormData};
- dictFormRef.value.resetFields();
+ form.value = { ...initFormData };
+ dictFormRef.value?.resetFields();
}
/** 鎼滅储鎸夐挳鎿嶄綔 */
const handleQuery = () => {
- queryParams.value.pageNum = 1;
- getList();
+ queryParams.value.pageNum = 1;
+ getList();
}
/** 閲嶇疆鎸夐挳鎿嶄綔 */
const resetQuery = () => {
- dateRange.value = ['', ''];
- queryFormRef.value.resetFields();
- handleQuery();
+ dateRange.value = ['', ''];
+ queryFormRef.value?.resetFields();
+ handleQuery();
}
/** 鏂板鎸夐挳鎿嶄綔 */
const handleAdd = () => {
- dialog.visible = true;
- dialog.title = "娣诲姞瀛楀吀绫诲瀷";
- nextTick(() => {
- reset();
- })
+ dialog.visible = true;
+ dialog.title = "娣诲姞瀛楀吀绫诲瀷";
+ nextTick(() => {
+ reset();
+ })
}
/** 澶氶�夋閫変腑鏁版嵁 */
-const handleSelectionChange = (selection: DictTypeVO[]) => {
- ids.value = selection.map(item => item.dictId);
- single.value = selection.length != 1;
- multiple.value = !selection.length;
+const handleSelectionChange = (selection: DictTypeVO[]) => {
+ ids.value = selection.map(item => item.dictId);
+ single.value = selection.length != 1;
+ multiple.value = !selection.length;
}
/** 淇敼鎸夐挳鎿嶄綔 */
const handleUpdate = (row?: DictTypeVO) => {
- dialog.visible = true;
- dialog.title = "淇敼瀛楀吀绫诲瀷";
- const dictId = row?.dictId || ids.value[0];
- nextTick(async () => {
- reset();
- const res = await getType(dictId);
- form.value = res.data;
- })
+ dialog.visible = true;
+ dialog.title = "淇敼瀛楀吀绫诲瀷";
+ const dictId = row?.dictId || ids.value[0];
+ nextTick(async () => {
+ reset();
+ const res = await getType(dictId);
+ form.value = res.data;
+ })
}
/** 鎻愪氦鎸夐挳 */
const submitForm = () => {
- dictFormRef.value.validate(async (valid: boolean) => {
- if (valid) {
- form.value.dictId ? await updateType(form.value) : await addType(form.value);
- proxy?.$modal.msgSuccess("鎿嶄綔鎴愬姛");
- dialog.visible = false;
- getList();
- }
- });
+ dictFormRef.value?.validate(async (valid: boolean) => {
+ if (valid) {
+ form.value.dictId ? await updateType(form.value) : await addType(form.value);
+ proxy?.$modal.msgSuccess("鎿嶄綔鎴愬姛");
+ dialog.visible = false;
+ getList();
+ }
+ });
}
/** 鍒犻櫎鎸夐挳鎿嶄綔 */
const handleDelete = async (row?: DictTypeVO) => {
- const dictIds = row?.dictId || ids.value;
- await proxy?.$modal.confirm('鏄惁纭鍒犻櫎瀛楀吀缂栧彿涓�"' + dictIds + '"鐨勬暟鎹」锛�');
- await delType(dictIds);
- getList();
- proxy?.$modal.msgSuccess("鍒犻櫎鎴愬姛");
+ const dictIds = row?.dictId || ids.value;
+ await proxy?.$modal.confirm('鏄惁纭鍒犻櫎瀛楀吀缂栧彿涓�"' + dictIds + '"鐨勬暟鎹」锛�');
+ await delType(dictIds);
+ getList();
+ proxy?.$modal.msgSuccess("鍒犻櫎鎴愬姛");
}
/** 瀵煎嚭鎸夐挳鎿嶄綔 */
const handleExport = () => {
- proxy?.download("system/dict/type/export", {
- ...queryParams.value
- }, `dict_${new Date().getTime()}.xlsx`);
+ proxy?.download("system/dict/type/export", {
+ ...queryParams.value
+ }, `dict_${new Date().getTime()}.xlsx`);
}
/** 鍒锋柊缂撳瓨鎸夐挳鎿嶄綔 */
const handleRefreshCache = async () => {
- await refreshCache();
- proxy?.$modal.msgSuccess("鍒锋柊鎴愬姛");
- useDictStore().cleanDict();
+ await refreshCache();
+ proxy?.$modal.msgSuccess("鍒锋柊鎴愬姛");
+ useDictStore().cleanDict();
}
-onMounted(()=>{
- getList();
+onMounted(() => {
+ getList();
})
</script>
diff --git a/src/views/system/menu/index.vue b/src/views/system/menu/index.vue
index e282f81..3b496ea 100644
--- a/src/views/system/menu/index.vue
+++ b/src/views/system/menu/index.vue
@@ -1,25 +1,27 @@
<template>
<div class="p-2">
<transition :enter-active-class="proxy?.animate.searchAnimate.enter" :leave-active-class="proxy?.animate.searchAnimate.leave">
- <div class="search" v-show="showSearch">
- <el-form ref="queryFormRef" :model="queryParams" :inline="true" label-width="68px">
- <el-form-item label="鑿滃崟鍚嶇О" prop="menuName">
- <el-input v-model="queryParams.menuName" placeholder="璇疯緭鍏ヨ彍鍗曞悕绉�" clearable @keyup.enter="handleQuery" />
- </el-form-item>
- <el-form-item label="鐘舵��" prop="status">
- <el-select v-model="queryParams.status" placeholder="鑿滃崟鐘舵��" clearable>
- <el-option v-for="dict in sys_normal_disable" :key="dict.value" :label="dict.label" :value="dict.value" />
- </el-select>
- </el-form-item>
- <el-form-item>
- <el-button type="primary" icon="Search" @click="handleQuery">鎼滅储</el-button>
- <el-button icon="Refresh" @click="resetQuery">閲嶇疆</el-button>
- </el-form-item>
- </el-form>
+ <div class="mb-[10px]" v-show="showSearch">
+ <el-card shadow="hover">
+ <el-form ref="queryFormRef" :model="queryParams" :inline="true" label-width="68px">
+ <el-form-item label="鑿滃崟鍚嶇О" prop="menuName">
+ <el-input v-model="queryParams.menuName" placeholder="璇疯緭鍏ヨ彍鍗曞悕绉�" clearable @keyup.enter="handleQuery" />
+ </el-form-item>
+ <el-form-item label="鐘舵��" prop="status">
+ <el-select v-model="queryParams.status" placeholder="鑿滃崟鐘舵��" clearable>
+ <el-option v-for="dict in sys_normal_disable" :key="dict.value" :label="dict.label" :value="dict.value" />
+ </el-select>
+ </el-form-item>
+ <el-form-item>
+ <el-button type="primary" icon="Search" @click="handleQuery">鎼滅储</el-button>
+ <el-button icon="Refresh" @click="resetQuery">閲嶇疆</el-button>
+ </el-form-item>
+ </el-form>
+ </el-card>
</div>
</transition>
- <el-card shadow="never">
+ <el-card shadow="hover">
<template #header>
<el-row :gutter="10">
<el-col :span="1.5">
@@ -37,7 +39,6 @@
:data="menuList"
row-key="menuId"
:tree-props="{ children: 'children', hasChildren: 'hasChildren' }"
- border
ref="menuTableRef"
:default-expand-all="isExpandAll"
>
@@ -262,14 +263,12 @@
<script setup name="Menu" lang="ts">
import { addMenu, delMenu, getMenu, listMenu, updateMenu } from '@/api/system/menu';
import { MenuForm, MenuQuery, MenuVO } from '@/api/system/menu/types';
-import { ComponentInternalInstance } from 'vue';
import { MenuTypeEnum } from '@/enums/MenuTypeEnum';
-import { ElTable, ElForm } from 'element-plus';
interface MenuOptionsType {
- menuId: number;
- menuName: string;
- children: MenuOptionsType[] | undefined;
+ menuId: number;
+ menuName: string;
+ children: MenuOptionsType[] | undefined;
}
const { proxy } = getCurrentInstance() as ComponentInternalInstance
@@ -282,136 +281,136 @@
const isExpandAll = ref(false)
const dialog = reactive<DialogOption>({
- visible: false,
- title: ''
+ visible: false,
+ title: ''
});
-const queryFormRef = ref(ElForm);
-const menuFormRef = ref(ElForm);
+const queryFormRef = ref<ElFormInstance>();
+const menuFormRef = ref<ElFormInstance>();
const initFormData = {
- path: '',
- menuId: undefined,
- parentId: 0,
- menuName: '',
- icon: '',
- menuType: MenuTypeEnum.M,
- orderNum: 1,
- isFrame: "1",
- isCache: "0",
- visible: "0",
- status: "0"
+ path: '',
+ menuId: undefined,
+ parentId: 0,
+ menuName: '',
+ icon: '',
+ menuType: MenuTypeEnum.M,
+ orderNum: 1,
+ isFrame: "1",
+ isCache: "0",
+ visible: "0",
+ status: "0"
}
const data = reactive<PageData<MenuForm, MenuQuery>>({
- form: { ...initFormData },
- queryParams: {
- menuName: undefined,
- status: undefined
- },
- rules: {
- menuName: [{ required: true, message: "鑿滃崟鍚嶇О涓嶈兘涓虹┖", trigger: "blur" }],
- orderNum: [{ required: true, message: "鑿滃崟椤哄簭涓嶈兘涓虹┖", trigger: "blur" }],
- path: [{ required: true, message: "璺敱鍦板潃涓嶈兘涓虹┖", trigger: "blur" }]
- },
+ form: { ...initFormData },
+ queryParams: {
+ menuName: undefined,
+ status: undefined
+ },
+ rules: {
+ menuName: [{ required: true, message: "鑿滃崟鍚嶇О涓嶈兘涓虹┖", trigger: "blur" }],
+ orderNum: [{ required: true, message: "鑿滃崟椤哄簭涓嶈兘涓虹┖", trigger: "blur" }],
+ path: [{ required: true, message: "璺敱鍦板潃涓嶈兘涓虹┖", trigger: "blur" }]
+ },
})
-const menuTableRef = ref(ElTable);
+const menuTableRef = ref<ElTableInstance>();
const { queryParams, form, rules } = toRefs<PageData<MenuForm, MenuQuery>>(data)
/** 鏌ヨ鑿滃崟鍒楄〃 */
const getList = async () => {
- loading.value = true
- const res = await listMenu(queryParams.value);
- const data = proxy?.handleTree<MenuVO>(res.data, "menuId")
- if (data) {
- menuList.value = data
- }
- loading.value = false
+ loading.value = true
+ const res = await listMenu(queryParams.value);
+ const data = proxy?.handleTree<MenuVO>(res.data, "menuId")
+ if (data) {
+ menuList.value = data
+ }
+ loading.value = false
}
/** 鏌ヨ鑿滃崟涓嬫媺鏍戠粨鏋� */
const getTreeselect = async () => {
- menuOptions.value = []
- const response = await listMenu();
- const menu: MenuOptionsType = { menuId: 0, menuName: "涓荤被鐩�", children: [] }
- menu.children = proxy?.handleTree<MenuOptionsType>(response.data, "menuId")
- menuOptions.value.push(menu)
+ menuOptions.value = []
+ const response = await listMenu();
+ const menu: MenuOptionsType = { menuId: 0, menuName: "涓荤被鐩�", children: [] }
+ menu.children = proxy?.handleTree<MenuOptionsType>(response.data, "menuId")
+ menuOptions.value.push(menu)
}
/** 鍙栨秷鎸夐挳 */
const cancel = () => {
- reset()
- dialog.visible = false
+ reset()
+ dialog.visible = false
}
/** 琛ㄥ崟閲嶇疆 */
const reset = () => {
- form.value = { ...initFormData };
- menuFormRef.value.resetFields();
+ form.value = { ...initFormData };
+ menuFormRef.value?.resetFields();
}
/** 鎼滅储鎸夐挳鎿嶄綔 */
const handleQuery = () => {
- getList();
+ getList();
}
/** 閲嶇疆鎸夐挳鎿嶄綔 */
const resetQuery = () => {
- queryFormRef.value.resetFields();
- handleQuery();
+ queryFormRef.value?.resetFields();
+ handleQuery();
}
/** 鏂板鎸夐挳鎿嶄綔 */
const handleAdd = (row?: MenuVO) => {
- dialog.visible = true;
- dialog.title = "娣诲姞鑿滃崟";
- getTreeselect();
- nextTick(() => {
- reset();
- row && row.menuId ? form.value.parentId = row.menuId : form.value.parentId = 0;
- })
+ dialog.visible = true;
+ dialog.title = "娣诲姞鑿滃崟";
+ getTreeselect();
+ nextTick(() => {
+ reset();
+ row && row.menuId ? form.value.parentId = row.menuId : form.value.parentId = 0;
+ })
}
/** 灞曞紑/鎶樺彔鎿嶄綔 */
const handleToggleExpandAll = () => {
- isExpandAll.value = !isExpandAll.value;
- toggleExpandAll(menuList.value, isExpandAll.value)
+ isExpandAll.value = !isExpandAll.value;
+ toggleExpandAll(menuList.value, isExpandAll.value)
}
/** 灞曞紑/鎶樺彔鎵�鏈� */
const toggleExpandAll = (data: MenuVO[], status: boolean) => {
- data.forEach((item: MenuVO) => {
- menuTableRef.value.toggleRowExpansion(item, status)
- if (item.children && item.children.length > 0) toggleExpandAll(item.children, status)
- })
+ data.forEach((item: MenuVO) => {
+ menuTableRef.value?.toggleRowExpansion(item, status)
+ if (item.children && item.children.length > 0) toggleExpandAll(item.children, status)
+ })
}
/** 淇敼鎸夐挳鎿嶄綔 */
const handleUpdate = async (row: MenuVO) => {
- await getTreeselect();
- dialog.visible = true;
- dialog.title = "淇敼鑿滃崟";
- await nextTick(async () => {
- if (row.menuId) {
- const { data } = await getMenu(row.menuId);
- reset();
- form.value = data;
- }
- })
+ await getTreeselect();
+ dialog.visible = true;
+ dialog.title = "淇敼鑿滃崟";
+ await nextTick(async () => {
+ if (row.menuId) {
+ const { data } = await getMenu(row.menuId);
+ reset();
+ form.value = data;
+ }
+ })
}
/** 鎻愪氦鎸夐挳 */
const submitForm = () => {
- menuFormRef.value.validate(async (valid: boolean) => {
- if (valid) {
- form.value.menuId ? await updateMenu(form.value) : await addMenu(form.value);
- proxy?.$modal.msgSuccess("鎿嶄綔鎴愬姛");
- dialog.visible = false;
- getList();
- }
- })
+ menuFormRef.value?.validate(async (valid: boolean) => {
+ if (valid) {
+ form.value.menuId ? await updateMenu(form.value) : await addMenu(form.value);
+ proxy?.$modal.msgSuccess("鎿嶄綔鎴愬姛");
+ dialog.visible = false;
+ await getList();
+ }
+ })
}
/** 鍒犻櫎鎸夐挳鎿嶄綔 */
const handleDelete = async (row: MenuVO) => {
- await proxy?.$modal.confirm('鏄惁纭鍒犻櫎鍚嶇О涓�"' + row.menuName + '"鐨勬暟鎹」?');
- await delMenu(row.menuId);
- getList();
- proxy?.$modal.msgSuccess("鍒犻櫎鎴愬姛");
+ await proxy?.$modal.confirm('鏄惁纭鍒犻櫎鍚嶇О涓�"' + row.menuName + '"鐨勬暟鎹」?');
+ await delMenu(row.menuId);
+ await getList();
+ proxy?.$modal.msgSuccess("鍒犻櫎鎴愬姛");
}
onMounted(() => {
- getList();
+ getList();
});
</script>
diff --git a/src/views/system/notice/index.vue b/src/views/system/notice/index.vue
index b041bb2..9548093 100644
--- a/src/views/system/notice/index.vue
+++ b/src/views/system/notice/index.vue
@@ -1,28 +1,30 @@
<template>
<div class="p-2">
<transition :enter-active-class="proxy?.animate.searchAnimate.enter" :leave-active-class="proxy?.animate.searchAnimate.leave">
- <div class="search" v-show="showSearch">
- <el-form :model="queryParams" ref="queryFormRef" :inline="true" label-width="68px">
- <el-form-item label="鍏憡鏍囬" prop="noticeTitle">
- <el-input v-model="queryParams.noticeTitle" placeholder="璇疯緭鍏ュ叕鍛婃爣棰�" clearable style="width: 200px" @keyup.enter="handleQuery" />
- </el-form-item>
- <el-form-item label="鎿嶄綔浜哄憳" prop="createByName">
- <el-input v-model="queryParams.createByName" placeholder="璇疯緭鍏ユ搷浣滀汉鍛�" clearable style="width: 200px" @keyup.enter="handleQuery" />
- </el-form-item>
- <el-form-item label="绫诲瀷" prop="noticeType">
- <el-select v-model="queryParams.noticeType" placeholder="鍏憡绫诲瀷" clearable style="width: 200px">
- <el-option v-for="dict in sys_notice_type" :key="dict.value" :label="dict.label" :value="dict.value" />
- </el-select>
- </el-form-item>
- <el-form-item>
- <el-button type="primary" icon="Search" @click="handleQuery">鎼滅储</el-button>
- <el-button icon="Refresh" @click="resetQuery">閲嶇疆</el-button>
- </el-form-item>
- </el-form>
+ <div class="mb-[10px]" v-show="showSearch">
+ <el-card shadow="hover">
+ <el-form :model="queryParams" ref="queryFormRef" :inline="true" label-width="68px">
+ <el-form-item label="鍏憡鏍囬" prop="noticeTitle">
+ <el-input v-model="queryParams.noticeTitle" placeholder="璇疯緭鍏ュ叕鍛婃爣棰�" clearable style="width: 200px" @keyup.enter="handleQuery" />
+ </el-form-item>
+ <el-form-item label="鎿嶄綔浜哄憳" prop="createByName">
+ <el-input v-model="queryParams.createByName" placeholder="璇疯緭鍏ユ搷浣滀汉鍛�" clearable style="width: 200px" @keyup.enter="handleQuery" />
+ </el-form-item>
+ <el-form-item label="绫诲瀷" prop="noticeType">
+ <el-select v-model="queryParams.noticeType" placeholder="鍏憡绫诲瀷" clearable style="width: 200px">
+ <el-option v-for="dict in sys_notice_type" :key="dict.value" :label="dict.label" :value="dict.value" />
+ </el-select>
+ </el-form-item>
+ <el-form-item>
+ <el-button type="primary" icon="Search" @click="handleQuery">鎼滅储</el-button>
+ <el-button icon="Refresh" @click="resetQuery">閲嶇疆</el-button>
+ </el-form-item>
+ </el-form>
+ </el-card>
</div>
</transition>
- <el-card shadow="never">
+ <el-card shadow="hover">
<template #header>
<el-row :gutter="10" class="mb8">
<el-col :span="1.5">
@@ -119,9 +121,7 @@
<script setup name="Notice" lang="ts">
import { listNotice, getNotice, delNotice, addNotice, updateNotice } from "@/api/system/notice";
-import { ComponentInternalInstance } from "vue";
import { NoticeForm, NoticeQuery, NoticeVO } from "@/api/system/notice/types";
-import { ElForm } from 'element-plus';
const { proxy } = getCurrentInstance() as ComponentInternalInstance;
const { sys_notice_status, sys_notice_type } = toRefs<any>(proxy?.useDict("sys_notice_status", "sys_notice_type"));
@@ -134,116 +134,116 @@
const multiple = ref(true);
const total = ref(0);
-const queryFormRef = ref(ElForm);
-const noticeFormRef = ref(ElForm);
+const queryFormRef = ref<ElFormInstance>();
+const noticeFormRef = ref<ElFormInstance>();
const dialog = reactive<DialogOption>({
- visible: false,
- title: ''
+ visible: false,
+ title: ''
});
const initFormData: NoticeForm = {
- noticeId: undefined,
- noticeTitle: '',
- noticeType: '',
- noticeContent: '',
- status: "0",
- remark: '',
- createByName: ''
+ noticeId: undefined,
+ noticeTitle: '',
+ noticeType: '',
+ noticeContent: '',
+ status: "0",
+ remark: '',
+ createByName: ''
}
const data = reactive<PageData<NoticeForm, NoticeQuery>>({
- form: { ...initFormData },
- queryParams: {
- pageNum: 1,
- pageSize: 10,
- noticeTitle: '',
- createByName: '',
- status: '',
- noticeType: ''
- },
- rules: {
- noticeTitle: [{ required: true, message: "鍏憡鏍囬涓嶈兘涓虹┖", trigger: "blur" }],
- noticeType: [{ required: true, message: "鍏憡绫诲瀷涓嶈兘涓虹┖", trigger: "change" }]
- },
+ form: { ...initFormData },
+ queryParams: {
+ pageNum: 1,
+ pageSize: 10,
+ noticeTitle: '',
+ createByName: '',
+ status: '',
+ noticeType: ''
+ },
+ rules: {
+ noticeTitle: [{ required: true, message: "鍏憡鏍囬涓嶈兘涓虹┖", trigger: "blur" }],
+ noticeType: [{ required: true, message: "鍏憡绫诲瀷涓嶈兘涓虹┖", trigger: "change" }]
+ },
});
const { queryParams, form, rules } = toRefs(data);
/** 鏌ヨ鍏憡鍒楄〃 */
const getList = async () => {
- loading.value = true;
- const res = await listNotice(queryParams.value);
- noticeList.value = res.rows;
- total.value = res.total;
- loading.value = false;
+ loading.value = true;
+ const res = await listNotice(queryParams.value);
+ noticeList.value = res.rows;
+ total.value = res.total;
+ loading.value = false;
}
/** 鍙栨秷鎸夐挳 */
const cancel = () => {
- reset();
- dialog.visible = false;
+ reset();
+ dialog.visible = false;
}
/** 琛ㄥ崟閲嶇疆 */
const reset = () => {
- form.value = { ...initFormData };
- noticeFormRef.value.resetFields();
+ form.value = { ...initFormData };
+ noticeFormRef.value?.resetFields();
}
/** 鎼滅储鎸夐挳鎿嶄綔 */
const handleQuery = () => {
- queryParams.value.pageNum = 1;
- getList();
+ queryParams.value.pageNum = 1;
+ getList();
}
/** 閲嶇疆鎸夐挳鎿嶄綔 */
const resetQuery = () => {
- queryFormRef.value.resetFields();
- handleQuery();
+ queryFormRef.value?.resetFields();
+ handleQuery();
}
/** 澶氶�夋閫変腑鏁版嵁 */
const handleSelectionChange = (selection: NoticeVO[]) => {
- ids.value = selection.map(item => item.noticeId);
- single.value = selection.length != 1;
- multiple.value = !selection.length;
+ ids.value = selection.map(item => item.noticeId);
+ single.value = selection.length != 1;
+ multiple.value = !selection.length;
}
/** 鏂板鎸夐挳鎿嶄綔 */
const handleAdd = () => {
- dialog.visible = true;
- dialog.title = "娣诲姞鍏憡";
- nextTick(() => {
- reset();
- })
+ dialog.visible = true;
+ dialog.title = "娣诲姞鍏憡";
+ nextTick(() => {
+ reset();
+ })
}
/**淇敼鎸夐挳鎿嶄綔 */
const handleUpdate = (row?: NoticeVO) => {
- dialog.visible = true;
- dialog.title = "淇敼鍏憡";
- nextTick(async () => {
- const noticeId = row?.noticeId || ids.value[0];
- reset();
- const { data } = await getNotice(noticeId);
- form.value = data;
- })
+ dialog.visible = true;
+ dialog.title = "淇敼鍏憡";
+ nextTick(async () => {
+ const noticeId = row?.noticeId || ids.value[0];
+ reset();
+ const { data } = await getNotice(noticeId);
+ form.value = data;
+ })
}
/** 鎻愪氦鎸夐挳 */
const submitForm = () => {
- noticeFormRef.value.validate(async (valid: boolean) => {
- if (valid) {
- form.value.noticeId ? await updateNotice(form.value) : await addNotice(form.value);
- proxy?.$modal.msgSuccess("淇敼鎴愬姛");
- dialog.visible = false;
- getList();
- }
- });
+ noticeFormRef.value?.validate(async (valid: boolean) => {
+ if (valid) {
+ form.value.noticeId ? await updateNotice(form.value) : await addNotice(form.value);
+ proxy?.$modal.msgSuccess("淇敼鎴愬姛");
+ dialog.visible = false;
+ await getList();
+ }
+ });
}
/** 鍒犻櫎鎸夐挳鎿嶄綔 */
const handleDelete = async (row?: NoticeVO) => {
- const noticeIds = row?.noticeId || ids.value
- await proxy?.$modal.confirm('鏄惁纭鍒犻櫎鍏憡缂栧彿涓�"' + noticeIds + '"鐨勬暟鎹」锛�');
- await delNotice(noticeIds);
- getList();
- proxy?.$modal.msgSuccess("鍒犻櫎鎴愬姛");
+ const noticeIds = row?.noticeId || ids.value
+ await proxy?.$modal.confirm('鏄惁纭鍒犻櫎鍏憡缂栧彿涓�"' + noticeIds + '"鐨勬暟鎹」锛�');
+ await delNotice(noticeIds);
+ await getList();
+ proxy?.$modal.msgSuccess("鍒犻櫎鎴愬姛");
}
onMounted(() => {
- getList();
+ getList();
})
-</script>
\ No newline at end of file
+</script>
diff --git a/src/views/system/oss/config.vue b/src/views/system/oss/config.vue
index 2d74633..ba64c1b 100644
--- a/src/views/system/oss/config.vue
+++ b/src/views/system/oss/config.vue
@@ -1,29 +1,31 @@
<template>
<div class="p-2">
<transition :enter-active-class="proxy?.animate.searchAnimate.enter" :leave-active-class="proxy?.animate.searchAnimate.leave">
- <div class="search" v-show="showSearch">
- <el-form :model="queryParams" ref="queryFormRef" :inline="true" label-width="68px">
- <el-form-item label="閰嶇疆key" prop="configKey">
- <el-input v-model="queryParams.configKey" placeholder="閰嶇疆key" clearable style="width: 200px" @keyup.enter="handleQuery" />
- </el-form-item>
- <el-form-item label="妗跺悕绉�" prop="bucketName">
- <el-input v-model="queryParams.bucketName" placeholder="璇疯緭鍏ユ《鍚嶇О" clearable style="width: 200px" @keyup.enter="handleQuery" />
- </el-form-item>
- <el-form-item label="鏄惁榛樿" prop="status">
- <el-select v-model="queryParams.status" placeholder="璇烽�夋嫨鐘舵��" clearable style="width: 200px">
- <el-option key="0" label="鏄�" value="0" />
- <el-option key="1" label="鍚�" value="1" />
- </el-select>
- </el-form-item>
- <el-form-item>
- <el-button type="primary" icon="search" @click="handleQuery">鎼滅储</el-button>
- <el-button icon="Refresh" @click="resetQuery">閲嶇疆</el-button>
- </el-form-item>
- </el-form>
+ <div class="mb-[10px]" v-show="showSearch">
+ <el-card shadow="hover">
+ <el-form :model="queryParams" ref="queryFormRef" :inline="true" label-width="68px">
+ <el-form-item label="閰嶇疆key" prop="configKey">
+ <el-input v-model="queryParams.configKey" placeholder="閰嶇疆key" clearable style="width: 200px" @keyup.enter="handleQuery" />
+ </el-form-item>
+ <el-form-item label="妗跺悕绉�" prop="bucketName">
+ <el-input v-model="queryParams.bucketName" placeholder="璇疯緭鍏ユ《鍚嶇О" clearable style="width: 200px" @keyup.enter="handleQuery" />
+ </el-form-item>
+ <el-form-item label="鏄惁榛樿" prop="status">
+ <el-select v-model="queryParams.status" placeholder="璇烽�夋嫨鐘舵��" clearable style="width: 200px">
+ <el-option key="0" label="鏄�" value="0" />
+ <el-option key="1" label="鍚�" value="1" />
+ </el-select>
+ </el-form-item>
+ <el-form-item>
+ <el-button type="primary" icon="search" @click="handleQuery">鎼滅储</el-button>
+ <el-button icon="Refresh" @click="resetQuery">閲嶇疆</el-button>
+ </el-form-item>
+ </el-form>
+ </el-card>
</div>
</transition>
- <el-card shadow="never">
+ <el-card shadow="hover">
<template #header>
<el-row :gutter="10" class="mb8">
<el-col :span="1.5">
@@ -131,16 +133,14 @@
<script setup name="OssConfig" lang="ts">
import {
- listOssConfig,
- getOssConfig,
- delOssConfig,
- addOssConfig,
- updateOssConfig,
- changeOssConfigStatus
+ listOssConfig,
+ getOssConfig,
+ delOssConfig,
+ addOssConfig,
+ updateOssConfig,
+ changeOssConfigStatus
} from "@/api/system/ossConfig";
-import { ComponentInternalInstance } from "vue";
import { OssConfigForm, OssConfigQuery, OssConfigVO } from "@/api/system/ossConfig/types";
-import { ElForm } from 'element-plus';
const { proxy } = getCurrentInstance() as ComponentInternalInstance
@@ -155,193 +155,193 @@
const multiple = ref(true);
const total = ref(0);
-const queryFormRef = ref(ElForm);
-const ossConfigFormRef = ref(ElForm);
+const queryFormRef = ref<ElFormInstance>();
+const ossConfigFormRef = ref<ElFormInstance>();
const dialog = reactive<DialogOption>({
- visible: false,
- title: ''
+ visible: false,
+ title: ''
});
// 鍒楁樉闅愪俊鎭�
const columns = ref<FieldOption[]>([
- { key: 0, label: `涓诲缓`, visible: true },
- { key: 1, label: `閰嶇疆key`, visible: false },
- { key: 2, label: `璁块棶绔欑偣`, visible: true },
- { key: 3, label: `鑷畾涔夊煙鍚峘, visible: true },
- { key: 4, label: `妗跺悕绉癭, visible: true },
- { key: 5, label: `鍓嶇紑`, visible: true },
- { key: 6, label: `鍩焋, visible: true },
- { key: 7, label: `妗舵潈闄愮被鍨媊, visible: true },
- { key: 8, label: `鐘舵�乣, visible: true }
+ { key: 0, label: `涓诲缓`, visible: true },
+ { key: 1, label: `閰嶇疆key`, visible: false },
+ { key: 2, label: `璁块棶绔欑偣`, visible: true },
+ { key: 3, label: `鑷畾涔夊煙鍚峘, visible: true },
+ { key: 4, label: `妗跺悕绉癭, visible: true },
+ { key: 5, label: `鍓嶇紑`, visible: true },
+ { key: 6, label: `鍩焋, visible: true },
+ { key: 7, label: `妗舵潈闄愮被鍨媊, visible: true },
+ { key: 8, label: `鐘舵�乣, visible: true }
]);
const initFormData: OssConfigForm = {
- ossConfigId: undefined,
- configKey: '',
- accessKey: '',
- secretKey: '',
- bucketName: '',
- prefix: '',
- endpoint: '',
- domain: '',
- isHttps: "N",
- accessPolicy: "1",
- region: '',
- status: "1",
- remark: '',
+ ossConfigId: undefined,
+ configKey: '',
+ accessKey: '',
+ secretKey: '',
+ bucketName: '',
+ prefix: '',
+ endpoint: '',
+ domain: '',
+ isHttps: "N",
+ accessPolicy: "1",
+ region: '',
+ status: "1",
+ remark: '',
}
const data = reactive<PageData<OssConfigForm, OssConfigQuery>>({
- form: { ...initFormData },
- // 鏌ヨ鍙傛暟
- queryParams: {
- pageNum: 1,
- pageSize: 10,
- configKey: '',
- bucketName: '',
- status: '',
- },
- rules: {
- configKey: [{ required: true, message: "configKey涓嶈兘涓虹┖", trigger: "blur" },],
- accessKey: [
- { required: true, message: "accessKey涓嶈兘涓虹┖", trigger: "blur" },
- {
- min: 2,
- max: 200,
- message: "accessKey闀垮害蹇呴』浠嬩簬 2 鍜� 100 涔嬮棿",
- trigger: "blur",
- },
- ],
- secretKey: [
- { required: true, message: "secretKey涓嶈兘涓虹┖", trigger: "blur" },
- {
- min: 2,
- max: 100,
- message: "secretKey闀垮害蹇呴』浠嬩簬 2 鍜� 100 涔嬮棿",
- trigger: "blur",
- },
- ],
- bucketName: [
- { required: true, message: "bucketName涓嶈兘涓虹┖", trigger: "blur" },
- {
- min: 2,
- max: 100,
- message: "bucketName闀垮害蹇呴』浠嬩簬 2 鍜� 100 涔嬮棿",
- trigger: "blur",
- },
- ],
- endpoint: [
- { required: true, message: "endpoint涓嶈兘涓虹┖", trigger: "blur" },
- {
- min: 2,
- max: 100,
- message: "endpoint鍚嶇О闀垮害蹇呴』浠嬩簬 2 鍜� 100 涔嬮棿",
- trigger: "blur",
- },
- ],
- accessPolicy: [{ required: true, message: "accessPolicy涓嶈兘涓虹┖", trigger: "blur" }]
- }
+ form: { ...initFormData },
+ // 鏌ヨ鍙傛暟
+ queryParams: {
+ pageNum: 1,
+ pageSize: 10,
+ configKey: '',
+ bucketName: '',
+ status: '',
+ },
+ rules: {
+ configKey: [{ required: true, message: "configKey涓嶈兘涓虹┖", trigger: "blur" },],
+ accessKey: [
+ { required: true, message: "accessKey涓嶈兘涓虹┖", trigger: "blur" },
+ {
+ min: 2,
+ max: 200,
+ message: "accessKey闀垮害蹇呴』浠嬩簬 2 鍜� 100 涔嬮棿",
+ trigger: "blur",
+ },
+ ],
+ secretKey: [
+ { required: true, message: "secretKey涓嶈兘涓虹┖", trigger: "blur" },
+ {
+ min: 2,
+ max: 100,
+ message: "secretKey闀垮害蹇呴』浠嬩簬 2 鍜� 100 涔嬮棿",
+ trigger: "blur",
+ },
+ ],
+ bucketName: [
+ { required: true, message: "bucketName涓嶈兘涓虹┖", trigger: "blur" },
+ {
+ min: 2,
+ max: 100,
+ message: "bucketName闀垮害蹇呴』浠嬩簬 2 鍜� 100 涔嬮棿",
+ trigger: "blur",
+ },
+ ],
+ endpoint: [
+ { required: true, message: "endpoint涓嶈兘涓虹┖", trigger: "blur" },
+ {
+ min: 2,
+ max: 100,
+ message: "endpoint鍚嶇О闀垮害蹇呴』浠嬩簬 2 鍜� 100 涔嬮棿",
+ trigger: "blur",
+ },
+ ],
+ accessPolicy: [{ required: true, message: "accessPolicy涓嶈兘涓虹┖", trigger: "blur" }]
+ }
});
const { queryParams, form, rules } = toRefs(data);
/** 鏌ヨ瀵硅薄瀛樺偍閰嶇疆鍒楄〃 */
const getList = async () => {
- loading.value = true;
- const res = await listOssConfig(queryParams.value);
- ossConfigList.value = res.rows;
- total.value = res.total;
- loading.value = false;
+ loading.value = true;
+ const res = await listOssConfig(queryParams.value);
+ ossConfigList.value = res.rows;
+ total.value = res.total;
+ loading.value = false;
}
/** 鍙栨秷鎸夐挳 */
const cancel = () => {
- dialog.visible = false;
- reset();
+ dialog.visible = false;
+ reset();
}
/** 琛ㄥ崟閲嶇疆 */
const reset = () => {
- form.value = { ...initFormData };
- ossConfigFormRef.value.resetFields();
+ form.value = { ...initFormData };
+ ossConfigFormRef.value?.resetFields();
}
/** 鎼滅储鎸夐挳鎿嶄綔 */
const handleQuery = () => {
- queryParams.value.pageNum = 1;
- getList();
+ queryParams.value.pageNum = 1;
+ getList();
}
/** 閲嶇疆鎸夐挳鎿嶄綔 */
const resetQuery = () => {
- queryFormRef.value.resetFields();
- handleQuery();
+ queryFormRef.value?.resetFields();
+ handleQuery();
}
/** 閫夋嫨鏉℃暟 */
const handleSelectionChange = (selection: OssConfigVO[]) => {
- ids.value = selection.map(item => item.ossConfigId);
- single.value = selection.length != 1;
- multiple.value = !selection.length;
+ ids.value = selection.map(item => item.ossConfigId);
+ single.value = selection.length != 1;
+ multiple.value = !selection.length;
}
/** 鏂板鎸夐挳鎿嶄綔 */
const handleAdd = () => {
- dialog.visible = true;
- dialog.title = "娣诲姞瀵硅薄瀛樺偍閰嶇疆";
- nextTick(() => {
- reset();
- })
+ dialog.visible = true;
+ dialog.title = "娣诲姞瀵硅薄瀛樺偍閰嶇疆";
+ nextTick(() => {
+ reset();
+ })
}
/** 淇敼鎸夐挳鎿嶄綔 */
const handleUpdate = (row?: OssConfigVO) => {
- loading.value = true;
- dialog.visible = true;
- dialog.title = "淇敼瀵硅薄瀛樺偍閰嶇疆";
- const ossConfigId = row?.ossConfigId || ids.value[0];
- nextTick(async () => {
- reset();
- const res = await getOssConfig(ossConfigId);
- loading.value = false;
- form.value = res.data;
- })
+ loading.value = true;
+ dialog.visible = true;
+ dialog.title = "淇敼瀵硅薄瀛樺偍閰嶇疆";
+ const ossConfigId = row?.ossConfigId || ids.value[0];
+ nextTick(async () => {
+ reset();
+ const res = await getOssConfig(ossConfigId);
+ loading.value = false;
+ form.value = res.data;
+ })
}
/** 鎻愪氦鎸夐挳 */
const submitForm = () => {
- ossConfigFormRef.value.validate(async (valid: boolean) => {
- if (valid) {
- buttonLoading.value = true;
- if (form.value.ossConfigId) {
- await updateOssConfig(form.value).finally(() => buttonLoading.value = false);
- } else {
- await addOssConfig(form.value).finally(() => buttonLoading.value = false);
- }
- proxy?.$modal.msgSuccess("鏂板鎴愬姛");
- dialog.visible = false;
- getList();
- }
- });
+ ossConfigFormRef.value?.validate(async (valid: boolean) => {
+ if (valid) {
+ buttonLoading.value = true;
+ if (form.value.ossConfigId) {
+ await updateOssConfig(form.value).finally(() => buttonLoading.value = false);
+ } else {
+ await addOssConfig(form.value).finally(() => buttonLoading.value = false);
+ }
+ proxy?.$modal.msgSuccess("鏂板鎴愬姛");
+ dialog.visible = false;
+ getList();
+ }
+ });
}
/** 鐘舵�佷慨鏀� */
-const handleStatusChange = async (row: OssConfigVO) => {
- let text = row.status === "0" ? "鍚敤" : "鍋滅敤";
- try {
- await proxy?.$modal.confirm('纭瑕�"' + text + '""' + row.configKey + '"閰嶇疆鍚�?');
- await changeOssConfigStatus(row.ossConfigId, row.status, row.configKey);
- getList()
- proxy?.$modal.msgSuccess(text + "鎴愬姛");
- } catch { return } finally {
- row.status = row.status === "0" ? "1" : "0";
- }
+const handleStatusChange = async (row: OssConfigVO) => {
+ let text = row.status === "0" ? "鍚敤" : "鍋滅敤";
+ try {
+ await proxy?.$modal.confirm('纭瑕�"' + text + '""' + row.configKey + '"閰嶇疆鍚�?');
+ await changeOssConfigStatus(row.ossConfigId, row.status, row.configKey);
+ getList()
+ proxy?.$modal.msgSuccess(text + "鎴愬姛");
+ } catch { return } finally {
+ row.status = row.status === "0" ? "1" : "0";
+ }
}
/** 鍒犻櫎鎸夐挳鎿嶄綔 */
const handleDelete = async (row?: OssConfigVO) => {
- const ossConfigIds = row?.ossConfigId || ids.value;
- await proxy?.$modal.confirm('鏄惁纭鍒犻櫎OSS閰嶇疆缂栧彿涓�"' + ossConfigIds + '"鐨勬暟鎹」?');
- loading.value = true;
- await delOssConfig(ossConfigIds).finally(() => loading.value = false);
- getList();
- proxy?.$modal.msgSuccess("鍒犻櫎鎴愬姛");
+ const ossConfigIds = row?.ossConfigId || ids.value;
+ await proxy?.$modal.confirm('鏄惁纭鍒犻櫎OSS閰嶇疆缂栧彿涓�"' + ossConfigIds + '"鐨勬暟鎹」?');
+ loading.value = true;
+ await delOssConfig(ossConfigIds).finally(() => loading.value = false);
+ getList();
+ proxy?.$modal.msgSuccess("鍒犻櫎鎴愬姛");
}
onMounted(() => {
- getList();
+ getList();
})
-</script>
\ No newline at end of file
+</script>
diff --git a/src/views/system/oss/index.vue b/src/views/system/oss/index.vue
index 24d637d..7bfaabe 100644
--- a/src/views/system/oss/index.vue
+++ b/src/views/system/oss/index.vue
@@ -1,40 +1,42 @@
<template>
<div class="p-2">
<transition :enter-active-class="proxy?.animate.searchAnimate.enter" :leave-active-class="proxy?.animate.searchAnimate.leave">
- <div class="search" v-show="showSearch">
- <el-form :model="queryParams" ref="queryFormRef" :inline="true" label-width="68px">
- <el-form-item label="鏂囦欢鍚�" prop="fileName">
- <el-input v-model="queryParams.fileName" placeholder="璇疯緭鍏ユ枃浠跺悕" clearable style="width: 200px" @keyup.enter="handleQuery" />
- </el-form-item>
- <el-form-item label="鍘熷悕" prop="originalName">
- <el-input v-model="queryParams.originalName" placeholder="璇疯緭鍏ュ師鍚�" clearable style="width: 200px" @keyup.enter="handleQuery" />
- </el-form-item>
- <el-form-item label="鏂囦欢鍚庣紑" prop="fileSuffix">
- <el-input v-model="queryParams.fileSuffix" placeholder="璇疯緭鍏ユ枃浠跺悗缂�" clearable style="width: 200px" @keyup.enter="handleQuery" />
- </el-form-item>
- <el-form-item label="鍒涘缓鏃堕棿">
- <el-date-picker
- v-model="daterangeCreateTime"
- value-format="YYYY-MM-DD HH:mm:ss"
- type="daterange"
- range-separator="-"
- start-placeholder="寮�濮嬫棩鏈�"
- end-placeholder="缁撴潫鏃ユ湡"
- :default-time="[new Date(2000, 1, 1, 0, 0, 0), new Date(2000, 1, 1, 23, 59, 59)]"
- ></el-date-picker>
- </el-form-item>
- <el-form-item label="鏈嶅姟鍟�" prop="service">
- <el-input v-model="queryParams.service" placeholder="璇疯緭鍏ユ湇鍔″晢" clearable style="width: 200px" @keyup.enter="handleQuery" />
- </el-form-item>
- <el-form-item>
- <el-button type="primary" icon="search" @click="handleQuery">鎼滅储</el-button>
- <el-button icon="Refresh" @click="resetQuery">閲嶇疆</el-button>
- </el-form-item>
- </el-form>
+ <div class="mb-[10px]" v-show="showSearch">
+ <el-card shadow="hover">
+ <el-form :model="queryParams" ref="queryFormRef" :inline="true" label-width="68px">
+ <el-form-item label="鏂囦欢鍚�" prop="fileName">
+ <el-input v-model="queryParams.fileName" placeholder="璇疯緭鍏ユ枃浠跺悕" clearable style="width: 200px" @keyup.enter="handleQuery" />
+ </el-form-item>
+ <el-form-item label="鍘熷悕" prop="originalName">
+ <el-input v-model="queryParams.originalName" placeholder="璇疯緭鍏ュ師鍚�" clearable style="width: 200px" @keyup.enter="handleQuery" />
+ </el-form-item>
+ <el-form-item label="鏂囦欢鍚庣紑" prop="fileSuffix">
+ <el-input v-model="queryParams.fileSuffix" placeholder="璇疯緭鍏ユ枃浠跺悗缂�" clearable style="width: 200px" @keyup.enter="handleQuery" />
+ </el-form-item>
+ <el-form-item label="鍒涘缓鏃堕棿">
+ <el-date-picker
+ v-model="daterangeCreateTime"
+ value-format="YYYY-MM-DD HH:mm:ss"
+ type="daterange"
+ range-separator="-"
+ start-placeholder="寮�濮嬫棩鏈�"
+ end-placeholder="缁撴潫鏃ユ湡"
+ :default-time="[new Date(2000, 1, 1, 0, 0, 0), new Date(2000, 1, 1, 23, 59, 59)]"
+ ></el-date-picker>
+ </el-form-item>
+ <el-form-item label="鏈嶅姟鍟�" prop="service">
+ <el-input v-model="queryParams.service" placeholder="璇疯緭鍏ユ湇鍔″晢" clearable style="width: 200px" @keyup.enter="handleQuery" />
+ </el-form-item>
+ <el-form-item>
+ <el-button type="primary" icon="search" @click="handleQuery">鎼滅储</el-button>
+ <el-button icon="Refresh" @click="resetQuery">閲嶇疆</el-button>
+ </el-form-item>
+ </el-form>
+ </el-card>
</div>
</transition>
- <el-card shadow="never">
+ <el-card shadow="hover">
<template #header>
<el-row :gutter="10" class="mb8">
<el-col :span="1.5">
@@ -133,9 +135,7 @@
<script setup name="Oss" lang="ts">
import { listOss, delOss } from "@/api/system/oss";
import ImagePreview from "@/components/ImagePreview/index.vue";
-import { ComponentInternalInstance } from "vue";
import { OssForm, OssQuery, OssVO } from "@/api/system/oss/types";
-import { DateModelType } from 'element-plus';
const router = useRouter();
const { proxy } = getCurrentInstance() as ComponentInternalInstance;
@@ -154,186 +154,186 @@
const daterangeCreateTime = ref<[DateModelType, DateModelType]>(['', '']);
const dialog = reactive<DialogOption>({
- visible: false,
- title: ''
+ visible: false,
+ title: ''
});
// 榛樿鎺掑簭
const defaultSort = ref({ prop: 'createTime', order: 'ascending' });
-const ossFormRef = ref(ElForm);
-const queryFormRef = ref(ElForm);
+const ossFormRef = ref<ElFormInstance>();
+const queryFormRef = ref<ElFormInstance>();
const initFormData = {
- file: undefined,
+ file: undefined,
}
const data = reactive<PageData<OssForm, OssQuery>>({
- form: { ...initFormData },
- // 鏌ヨ鍙傛暟
- queryParams: {
- pageNum: 1,
- pageSize: 10,
- fileName: '',
- originalName: '',
- fileSuffix: '',
- createTime: '',
- service: '',
- orderByColumn: defaultSort.value.prop,
- isAsc: defaultSort.value.order
- },
- rules: {
- file: [
- { required: true, message: "鏂囦欢涓嶈兘涓虹┖", trigger: "blur" }
- ]
- }
+ form: { ...initFormData },
+ // 鏌ヨ鍙傛暟
+ queryParams: {
+ pageNum: 1,
+ pageSize: 10,
+ fileName: '',
+ originalName: '',
+ fileSuffix: '',
+ createTime: '',
+ service: '',
+ orderByColumn: defaultSort.value.prop,
+ isAsc: defaultSort.value.order
+ },
+ rules: {
+ file: [
+ { required: true, message: "鏂囦欢涓嶈兘涓虹┖", trigger: "blur" }
+ ]
+ }
});
const { queryParams, form, rules } = toRefs(data);
/** 鏌ヨOSS瀵硅薄瀛樺偍鍒楄〃 */
const getList = async () => {
- loading.value = true;
- const res = await proxy?.getConfigKey("sys.oss.previewListResource");
- previewListResource.value = res?.msg === undefined ? true : res.msg === 'true';
- const response = await listOss(proxy?.addDateRange(queryParams.value, daterangeCreateTime.value, "CreateTime"));
- ossList.value = response.rows;
- total.value = response.total;
- loading.value = false;
- showTable.value = true;
+ loading.value = true;
+ const res = await proxy?.getConfigKey("sys.oss.previewListResource");
+ previewListResource.value = res?.msg === undefined ? true : res.msg === 'true';
+ const response = await listOss(proxy?.addDateRange(queryParams.value, daterangeCreateTime.value, "CreateTime"));
+ ossList.value = response.rows;
+ total.value = response.total;
+ loading.value = false;
+ showTable.value = true;
}
function checkFileSuffix(fileSuffix: string[]) {
- let arr = ["png", "jpg", "jpeg"];
- return arr.some(type => {
- return fileSuffix.indexOf(type) > -1;
- });
+ let arr = ["png", "jpg", "jpeg"];
+ return arr.some(type => {
+ return fileSuffix.indexOf(type) > -1;
+ });
}
/** 鍙栨秷鎸夐挳 */
function cancel() {
- dialog.visible = false;
- reset();
+ dialog.visible = false;
+ reset();
}
/** 琛ㄥ崟閲嶇疆 */
function reset() {
- form.value = { ...initFormData };
- ossFormRef.value.resetFields();
+ form.value = { ...initFormData };
+ ossFormRef.value?.resetFields();
}
/** 鎼滅储鎸夐挳鎿嶄綔 */
function handleQuery() {
- queryParams.value.pageNum = 1;
- getList();
+ queryParams.value.pageNum = 1;
+ getList();
}
/** 閲嶇疆鎸夐挳鎿嶄綔 */
function resetQuery() {
- showTable.value = false;
- daterangeCreateTime.value = ['', ''];
- queryFormRef.value.resetFields();
- queryParams.value.orderByColumn = defaultSort.value.prop;
- queryParams.value.isAsc = defaultSort.value.order;
- handleQuery();
+ showTable.value = false;
+ daterangeCreateTime.value = ['', ''];
+ queryFormRef.value?.resetFields();
+ queryParams.value.orderByColumn = defaultSort.value.prop;
+ queryParams.value.isAsc = defaultSort.value.order;
+ handleQuery();
}
/** 閫夋嫨鏉℃暟 */
function handleSelectionChange(selection: OssVO[]) {
- ids.value = selection.map(item => item.ossId);
- single.value = selection.length != 1;
- multiple.value = !selection.length;
+ ids.value = selection.map(item => item.ossId);
+ single.value = selection.length != 1;
+ multiple.value = !selection.length;
}
/** 璁剧疆鍒楃殑鎺掑簭涓烘垜浠嚜瀹氫箟鐨勬帓搴� */
const handleHeaderClass = ({ column }: any): any => {
- column.order = column.multiOrder
+ column.order = column.multiOrder
}
/** 鐐瑰嚮琛ㄥご杩涜鎺掑簭 */
const handleHeaderCLick = (column: any) => {
- if (column.sortable !== 'custom') {
- return
- }
- switch (column.multiOrder) {
- case 'descending':
- column.multiOrder = 'ascending';
- break;
- case 'ascending':
- column.multiOrder = '';
- break;
- default:
- column.multiOrder = 'descending';
- break;
- }
- handleOrderChange(column.property, column.multiOrder)
+ if (column.sortable !== 'custom') {
+ return
+ }
+ switch (column.multiOrder) {
+ case 'descending':
+ column.multiOrder = 'ascending';
+ break;
+ case 'ascending':
+ column.multiOrder = '';
+ break;
+ default:
+ column.multiOrder = 'descending';
+ break;
+ }
+ handleOrderChange(column.property, column.multiOrder)
}
const handleOrderChange = (prop: string, order: string) => {
- let orderByArr = queryParams.value.orderByColumn ? queryParams.value.orderByColumn.split(",") : [];
- let isAscArr = queryParams.value.isAsc ? queryParams.value.isAsc.split(",") : [];
- let propIndex = orderByArr.indexOf(prop)
- if (propIndex !== -1) {
- if (order) {
- //鎺掑簭閲屽凡瀛樺湪 鍙慨鏀规帓搴�
- isAscArr[propIndex] = order;
- } else {
- //濡傛灉order涓簄ull 鍒欏垹闄ゆ帓搴忓瓧娈靛拰灞炴��
- isAscArr.splice(propIndex, 1);//鍒犻櫎鎺掑簭
- orderByArr.splice(propIndex, 1);//鍒犻櫎灞炴��
- }
+ let orderByArr = queryParams.value.orderByColumn ? queryParams.value.orderByColumn.split(",") : [];
+ let isAscArr = queryParams.value.isAsc ? queryParams.value.isAsc.split(",") : [];
+ let propIndex = orderByArr.indexOf(prop)
+ if (propIndex !== -1) {
+ if (order) {
+ //鎺掑簭閲屽凡瀛樺湪 鍙慨鏀规帓搴�
+ isAscArr[propIndex] = order;
} else {
- //鎺掑簭閲屼笉瀛樺湪鍒欐柊澧炴帓搴�
- orderByArr.push(prop);
- isAscArr.push(order);
+ //濡傛灉order涓簄ull 鍒欏垹闄ゆ帓搴忓瓧娈靛拰灞炴��
+ isAscArr.splice(propIndex, 1);//鍒犻櫎鎺掑簭
+ orderByArr.splice(propIndex, 1);//鍒犻櫎灞炴��
}
- //鍚堝苟鎺掑簭
- queryParams.value.orderByColumn = orderByArr.join(",");
- queryParams.value.isAsc = isAscArr.join(",");
- getList();
+ } else {
+ //鎺掑簭閲屼笉瀛樺湪鍒欐柊澧炴帓搴�
+ orderByArr.push(prop);
+ isAscArr.push(order);
+ }
+ //鍚堝苟鎺掑簭
+ queryParams.value.orderByColumn = orderByArr.join(",");
+ queryParams.value.isAsc = isAscArr.join(",");
+ getList();
}
/** 浠诲姟鏃ュ織鍒楄〃鏌ヨ */
const handleOssConfig = () => {
- router.push('/system/oss-config/index')
+ router.push('/system/oss-config/index')
}
/** 鏂囦欢鎸夐挳鎿嶄綔 */
const handleFile = () => {
- dialog.visible = true;
- dialog.title = "涓婁紶鏂囦欢";
- nextTick(() => {
- reset();
- type.value = 0;
- })
+ dialog.visible = true;
+ dialog.title = "涓婁紶鏂囦欢";
+ nextTick(() => {
+ reset();
+ type.value = 0;
+ })
}
/** 鍥剧墖鎸夐挳鎿嶄綔 */
const handleImage = () => {
- dialog.visible = true;
- dialog.title = "涓婁紶鍥剧墖";
- nextTick(() => {
- reset();
- type.value = 1;
- })
+ dialog.visible = true;
+ dialog.title = "涓婁紶鍥剧墖";
+ nextTick(() => {
+ reset();
+ type.value = 1;
+ })
}
/** 鎻愪氦鎸夐挳 */
const submitForm = () => {
- dialog.visible = false;
- getList();
+ dialog.visible = false;
+ getList();
}
/** 涓嬭浇鎸夐挳鎿嶄綔 */
const handleDownload = (row: OssVO) => {
- proxy?.$download.oss(row.ossId)
+ proxy?.$download.oss(row.ossId)
}
/** 鐢ㄦ埛鐘舵�佷慨鏀� */
const handlePreviewListResource = async (preview: boolean) => {
- let text = preview ? "鍚敤" : "鍋滅敤";
- try {
- await proxy?.$modal.confirm('纭瑕�"' + text + '""棰勮鍒楄〃鍥剧墖"閰嶇疆鍚�?');
- await proxy?.updateConfigByKey("sys.oss.previewListResource", preview);
- getList()
- proxy?.$modal.msgSuccess(text + "鎴愬姛");
- } catch { return }
+ let text = preview ? "鍚敤" : "鍋滅敤";
+ try {
+ await proxy?.$modal.confirm('纭瑕�"' + text + '""棰勮鍒楄〃鍥剧墖"閰嶇疆鍚�?');
+ await proxy?.updateConfigByKey("sys.oss.previewListResource", preview);
+ getList()
+ proxy?.$modal.msgSuccess(text + "鎴愬姛");
+ } catch { return }
}
/** 鍒犻櫎鎸夐挳鎿嶄綔 */
const handleDelete = async (row?: OssVO) => {
- const ossIds = row?.ossId || ids.value;
- await proxy?.$modal.confirm('鏄惁纭鍒犻櫎OSS瀵硅薄瀛樺偍缂栧彿涓�"' + ossIds + '"鐨勬暟鎹」?');
- loading.value = true;
- await delOss(ossIds).finally(() => loading.value = false);
- getList();
- proxy?.$modal.msgSuccess("鍒犻櫎鎴愬姛");
+ const ossIds = row?.ossId || ids.value;
+ await proxy?.$modal.confirm('鏄惁纭鍒犻櫎OSS瀵硅薄瀛樺偍缂栧彿涓�"' + ossIds + '"鐨勬暟鎹」?');
+ loading.value = true;
+ await delOss(ossIds).finally(() => loading.value = false);
+ getList();
+ proxy?.$modal.msgSuccess("鍒犻櫎鎴愬姛");
}
onMounted(() => {
- getList();
+ getList();
})
</script>
diff --git a/src/views/system/post/index.vue b/src/views/system/post/index.vue
index 2dc0ca0..d53eb1c 100644
--- a/src/views/system/post/index.vue
+++ b/src/views/system/post/index.vue
@@ -1,27 +1,29 @@
<template>
<div class="p-2">
<transition :enter-active-class="proxy?.animate.searchAnimate.enter" :leave-active-class="proxy?.animate.searchAnimate.leave">
- <div class="search" v-show="showSearch">
- <el-form :model="queryParams" ref="queryFormRef" :inline="true" label-width="70">
- <el-form-item label="宀椾綅缂栫爜" prop="postCode">
- <el-input v-model="queryParams.postCode" placeholder="璇疯緭鍏ュ矖浣嶇紪鐮�" clearable style="width: 200px" @keyup.enter="handleQuery" />
- </el-form-item>
- <el-form-item label="宀椾綅鍚嶇О" prop="postName">
- <el-input v-model="queryParams.postName" placeholder="璇疯緭鍏ュ矖浣嶅悕绉�" clearable style="width: 200px" @keyup.enter="handleQuery" />
- </el-form-item>
- <el-form-item label="鐘舵��" prop="status">
- <el-select v-model="queryParams.status" placeholder="宀椾綅鐘舵��" clearable style="width: 200px">
- <el-option v-for="dict in sys_normal_disable" :key="dict.value" :label="dict.label" :value="dict.value" />
- </el-select>
- </el-form-item>
- <el-form-item>
- <el-button type="primary" icon="Search" @click="handleQuery">鎼滅储</el-button>
- <el-button icon="Refresh" @click="resetQuery">閲嶇疆</el-button>
- </el-form-item>
- </el-form>
+ <div class="mb-[10px]" v-show="showSearch">
+ <el-card shadow="hover">
+ <el-form :model="queryParams" ref="queryFormRef" :inline="true" label-width="70">
+ <el-form-item label="宀椾綅缂栫爜" prop="postCode">
+ <el-input v-model="queryParams.postCode" placeholder="璇疯緭鍏ュ矖浣嶇紪鐮�" clearable style="width: 200px" @keyup.enter="handleQuery" />
+ </el-form-item>
+ <el-form-item label="宀椾綅鍚嶇О" prop="postName">
+ <el-input v-model="queryParams.postName" placeholder="璇疯緭鍏ュ矖浣嶅悕绉�" clearable style="width: 200px" @keyup.enter="handleQuery" />
+ </el-form-item>
+ <el-form-item label="鐘舵��" prop="status">
+ <el-select v-model="queryParams.status" placeholder="宀椾綅鐘舵��" clearable style="width: 200px">
+ <el-option v-for="dict in sys_normal_disable" :key="dict.value" :label="dict.label" :value="dict.value" />
+ </el-select>
+ </el-form-item>
+ <el-form-item>
+ <el-button type="primary" icon="Search" @click="handleQuery">鎼滅储</el-button>
+ <el-button icon="Refresh" @click="resetQuery">閲嶇疆</el-button>
+ </el-form-item>
+ </el-form>
+ </el-card>
</div>
</transition>
- <el-card shadow="never">
+ <el-card shadow="hover">
<template #header>
<el-row :gutter="10" class="mb8">
<el-col :span="1.5">
@@ -107,7 +109,6 @@
<script setup name="Post" lang="ts">
import { listPost, addPost, delPost, getPost, updatePost } from "@/api/system/post";
import { PostForm, PostQuery, PostVO } from "@/api/system/post/types";
-import { ComponentInternalInstance } from "vue";
const { proxy } = getCurrentInstance() as ComponentInternalInstance;
const { sys_normal_disable } = toRefs<any>(proxy?.useDict("sys_normal_disable"));
@@ -120,121 +121,121 @@
const multiple = ref(true);
const total = ref(0);
-const postFormRef = ref(ElForm);
-const queryFormRef = ref(ElForm);
+const postFormRef = ref<ElFormInstance>();
+const queryFormRef = ref<ElFormInstance>();
const dialog = reactive<DialogOption>({
- visible: false,
- title: ''
+ visible: false,
+ title: ''
});
const initFormData: PostForm = {
- postId: undefined,
- postCode: '',
- postName: '',
- postSort: 0,
- status: "0",
- remark: ''
+ postId: undefined,
+ postCode: '',
+ postName: '',
+ postSort: 0,
+ status: "0",
+ remark: ''
}
const data = reactive<PageData<PostForm, PostQuery>>({
- form: {...initFormData},
- queryParams: {
- pageNum: 1,
- pageSize: 10,
- postCode: '',
- postName: '',
- status: ''
- },
- rules: {
- postName: [{ required: true, message: "宀椾綅鍚嶇О涓嶈兘涓虹┖", trigger: "blur" }],
- postCode: [{ required: true, message: "宀椾綅缂栫爜涓嶈兘涓虹┖", trigger: "blur" }],
- postSort: [{ required: true, message: "宀椾綅椤哄簭涓嶈兘涓虹┖", trigger: "blur" }],
- }
+ form: { ...initFormData },
+ queryParams: {
+ pageNum: 1,
+ pageSize: 10,
+ postCode: '',
+ postName: '',
+ status: ''
+ },
+ rules: {
+ postName: [{ required: true, message: "宀椾綅鍚嶇О涓嶈兘涓虹┖", trigger: "blur" }],
+ postCode: [{ required: true, message: "宀椾綅缂栫爜涓嶈兘涓虹┖", trigger: "blur" }],
+ postSort: [{ required: true, message: "宀椾綅椤哄簭涓嶈兘涓虹┖", trigger: "blur" }],
+ }
});
const { queryParams, form, rules } = toRefs<PageData<PostForm, PostQuery>>(data);
/** 鏌ヨ宀椾綅鍒楄〃 */
const getList = async () => {
- loading.value = true;
- const res = await listPost(queryParams.value);
- postList.value = res.rows;
- total.value = res.total;
- loading.value = false;
+ loading.value = true;
+ const res = await listPost(queryParams.value);
+ postList.value = res.rows;
+ total.value = res.total;
+ loading.value = false;
}
/** 鍙栨秷鎸夐挳 */
const cancel = () => {
- reset();
- dialog.visible = false;
+ reset();
+ dialog.visible = false;
}
/** 琛ㄥ崟閲嶇疆 */
const reset = () => {
- form.value = {...initFormData};
- postFormRef.value.resetFields();
+ form.value = { ...initFormData };
+ postFormRef.value?.resetFields();
}
/** 鎼滅储鎸夐挳鎿嶄綔 */
const handleQuery = () => {
- queryParams.value.pageNum = 1;
- getList();
+ queryParams.value.pageNum = 1;
+ getList();
}
/** 閲嶇疆鎸夐挳鎿嶄綔 */
const resetQuery = () => {
- queryFormRef.value.resetFields();
- handleQuery();
+ queryFormRef.value?.resetFields();
+ handleQuery();
}
/** 澶氶�夋閫変腑鏁版嵁 */
const handleSelectionChange = (selection: PostVO[]) => {
- ids.value = selection.map(item => item.postId);
- single.value = selection.length != 1;
- multiple.value = !selection.length;
+ ids.value = selection.map(item => item.postId);
+ single.value = selection.length != 1;
+ multiple.value = !selection.length;
}
/** 鏂板鎸夐挳鎿嶄綔 */
const handleAdd = () => {
- dialog.visible = true;
- dialog.title = "娣诲姞宀椾綅";
- nextTick(() => {
- reset();
- })
+ dialog.visible = true;
+ dialog.title = "娣诲姞宀椾綅";
+ nextTick(() => {
+ reset();
+ })
}
/** 淇敼鎸夐挳鎿嶄綔 */
const handleUpdate = (row?: PostVO) => {
- dialog.visible = true;
- dialog.title = "淇敼宀椾綅";
- nextTick(async () => {
- reset();
- const postId = row?.postId || ids.value[0];
- const res = await getPost(postId);
- form.value = res.data;
- })
+ dialog.visible = true;
+ dialog.title = "淇敼宀椾綅";
+ nextTick(async () => {
+ reset();
+ const postId = row?.postId || ids.value[0];
+ const res = await getPost(postId);
+ form.value = res.data;
+ })
}
/** 鎻愪氦鎸夐挳 */
const submitForm = () => {
- postFormRef.value.validate(async (valid: boolean) => {
- if (valid) {
- form.value.postId ? await updatePost(form.value) : await addPost(form.value);
- proxy?.$modal.msgSuccess("鎿嶄綔鎴愬姛");
- dialog.visible = false;
- getList();
- }
- });
+ postFormRef.value?.validate(async (valid: boolean) => {
+ if (valid) {
+ form.value.postId ? await updatePost(form.value) : await addPost(form.value);
+ proxy?.$modal.msgSuccess("鎿嶄綔鎴愬姛");
+ dialog.visible = false;
+ await getList();
+ }
+ });
}
/** 鍒犻櫎鎸夐挳鎿嶄綔 */
const handleDelete = async (row?: PostVO) => {
- const postIds = row?.postId || ids.value;
- await proxy?.$modal.confirm('鏄惁纭鍒犻櫎宀椾綅缂栧彿涓�"' + postIds + '"鐨勬暟鎹」锛�');
- await delPost(postIds);
- getList();
- proxy?.$modal.msgSuccess("鍒犻櫎鎴愬姛");
+ const postIds = row?.postId || ids.value;
+ await proxy?.$modal.confirm('鏄惁纭鍒犻櫎宀椾綅缂栧彿涓�"' + postIds + '"鐨勬暟鎹」锛�');
+ await delPost(postIds);
+ await getList();
+ proxy?.$modal.msgSuccess("鍒犻櫎鎴愬姛");
}
/** 瀵煎嚭鎸夐挳鎿嶄綔 */
const handleExport = () => {
- proxy?.download("system/post/export", {
- ...queryParams.value
- }, `post_${new Date().getTime()}.xlsx`);
+ proxy?.download("system/post/export", {
+ ...queryParams.value
+ }, `post_${new Date().getTime()}.xlsx`);
}
onMounted(() => {
- getList();
+ getList();
});
</script>
diff --git a/src/views/system/role/authUser.vue b/src/views/system/role/authUser.vue
index ae4f73f..7ad8a5a 100644
--- a/src/views/system/role/authUser.vue
+++ b/src/views/system/role/authUser.vue
@@ -58,13 +58,7 @@
</el-table-column>
</el-table>
- <pagination
- v-show="total > 0"
- :total="total"
- v-model:page="queryParams.pageNum"
- v-model:limit="queryParams.pageSize"
- @pagination="getList"
- />
+ <pagination v-show="total > 0" :total="total" v-model:page="queryParams.pageNum" v-model:limit="queryParams.pageSize" @pagination="getList" />
<select-user ref="selectRef" :roleId="queryParams.roleId" @ok="handleQuery" />
</el-card>
</div>
@@ -73,10 +67,8 @@
<script setup name="AuthUser" lang="ts">
import { allocatedUserList, authUserCancel, authUserCancelAll } from "@/api/system/role";
import { UserQuery } from "@/api/system/user/types";
-import { ComponentInternalInstance } from "vue";
import { UserVO } from "@/api/system/user/types";
import SelectUser from "./selectUser.vue";
-// import { ElForm, ElSelect} from 'element-plus';
const route = useRoute();
@@ -90,68 +82,68 @@
const total = ref(0);
const userIds = ref<Array<string | number>>([]);
-const queryFormRef = ref(ElForm);
-const selectRef = ref(SelectUser);
+const queryFormRef = ref<ElFormInstance>();
+const selectRef = ref<InstanceType<typeof SelectUser>>();
const queryParams = reactive<UserQuery>({
- pageNum: 1,
- pageSize: 10,
- roleId: route.params.roleId as string,
- userName: undefined,
- phonenumber: undefined,
+ pageNum: 1,
+ pageSize: 10,
+ roleId: route.params.roleId as string,
+ userName: undefined,
+ phonenumber: undefined,
});
/** 鏌ヨ鎺堟潈鐢ㄦ埛鍒楄〃 */
const getList = async () => {
- loading.value = true;
- const res = await allocatedUserList(queryParams);
- userList.value = res.rows;
- total.value = res.total;
- loading.value = false;
+ loading.value = true;
+ const res = await allocatedUserList(queryParams);
+ userList.value = res.rows;
+ total.value = res.total;
+ loading.value = false;
}
// 杩斿洖鎸夐挳
const handleClose = () => {
- const obj = { path: "/system/role" };
- proxy?.$tab.closeOpenPage(obj);
+ const obj = { path: "/system/role" };
+ proxy?.$tab.closeOpenPage(obj);
}
/** 鎼滅储鎸夐挳鎿嶄綔 */
-const handleQuery=() => {
- queryParams.pageNum = 1;
- getList();
+const handleQuery = () => {
+ queryParams.pageNum = 1;
+ getList();
}
/** 閲嶇疆鎸夐挳鎿嶄綔 */
-const resetQuery=() =>{
- queryFormRef.value.resetFields();
- handleQuery();
+const resetQuery = () => {
+ queryFormRef.value?.resetFields();
+ handleQuery();
}
// 澶氶�夋閫変腑鏁版嵁
-const handleSelectionChange = (selection: UserVO[]) =>{
- userIds.value = selection.map(item => item.userId);
- multiple.value = !selection.length;
+const handleSelectionChange = (selection: UserVO[]) => {
+ userIds.value = selection.map(item => item.userId);
+ multiple.value = !selection.length;
}
/** 鎵撳紑鎺堟潈鐢ㄦ埛琛ㄥ脊绐� */
const openSelectUser = () => {
- selectRef.value.show();
+ selectRef.value?.show();
}
/** 鍙栨秷鎺堟潈鎸夐挳鎿嶄綔 */
const cancelAuthUser = async (row: UserVO) => {
- await proxy?.$modal.confirm('纭瑕佸彇娑堣鐢ㄦ埛"' + row.userName + '"瑙掕壊鍚楋紵');
- await authUserCancel({ userId: row.userId, roleId: queryParams.roleId });
- getList();
- proxy?.$modal.msgSuccess("鍙栨秷鎺堟潈鎴愬姛");
+ await proxy?.$modal.confirm('纭瑕佸彇娑堣鐢ㄦ埛"' + row.userName + '"瑙掕壊鍚楋紵');
+ await authUserCancel({ userId: row.userId, roleId: queryParams.roleId });
+ await getList();
+ proxy?.$modal.msgSuccess("鍙栨秷鎺堟潈鎴愬姛");
}
/** 鎵归噺鍙栨秷鎺堟潈鎸夐挳鎿嶄綔 */
const cancelAuthUserAll = async () => {
- const roleId = queryParams.roleId;
- const uIds = userIds.value.join(",");
- await proxy?.$modal.confirm("鏄惁鍙栨秷閫変腑鐢ㄦ埛鎺堟潈鏁版嵁椤�?");
- await authUserCancelAll({ roleId: roleId, userIds: uIds });
- getList();
- proxy?.$modal.msgSuccess("鍙栨秷鎺堟潈鎴愬姛");
+ const roleId = queryParams.roleId;
+ const uIds = userIds.value.join(",");
+ await proxy?.$modal.confirm("鏄惁鍙栨秷閫変腑鐢ㄦ埛鎺堟潈鏁版嵁椤�?");
+ await authUserCancelAll({ roleId: roleId, userIds: uIds });
+ await getList();
+ proxy?.$modal.msgSuccess("鍙栨秷鎺堟潈鎴愬姛");
}
onMounted(() => {
- getList();
+ getList();
});
</script>
diff --git a/src/views/system/role/index.vue b/src/views/system/role/index.vue
index 33189cd..bcc893f 100644
--- a/src/views/system/role/index.vue
+++ b/src/views/system/role/index.vue
@@ -1,40 +1,42 @@
<template>
<div class="p-2">
<transition :enter-active-class="proxy?.animate.searchAnimate.enter" :leave-active-class="proxy?.animate.searchAnimate.leave">
- <div class="search" v-show="showSearch">
- <el-form ref="queryFormRef" :model="queryParams" :inline="true" label-width="68px">
- <el-form-item label="瑙掕壊鍚嶇О" prop="roleName">
- <el-input v-model="queryParams.roleName" placeholder="璇疯緭鍏ヨ鑹插悕绉�" clearable style="width: 240px" @keyup.enter="handleQuery" />
- </el-form-item>
- <el-form-item label="鏉冮檺瀛楃" prop="roleKey">
- <el-input v-model="queryParams.roleKey" placeholder="璇疯緭鍏ユ潈闄愬瓧绗�" clearable style="width: 240px" @keyup.enter="handleQuery" />
- </el-form-item>
- <el-form-item label="鐘舵��" prop="status">
- <el-select v-model="queryParams.status" placeholder="瑙掕壊鐘舵��" clearable style="width: 240px">
- <el-option v-for="dict in sys_normal_disable" :key="dict.value" :label="dict.label" :value="dict.value" />
- </el-select>
- </el-form-item>
- <el-form-item label="鍒涘缓鏃堕棿" style="width: 308px">
- <el-date-picker
- v-model="dateRange"
- value-format="YYYY-MM-DD"
- type="daterange"
- range-separator="-"
- start-placeholder="寮�濮嬫棩鏈�"
- end-placeholder="缁撴潫鏃ユ湡"
- :default-time="[new Date(2000, 1, 1, 0, 0, 0), new Date(2000, 1, 1, 23, 59, 59)]"
- ></el-date-picker>
- </el-form-item>
+ <div class="mb-[10px]" v-show="showSearch">
+ <el-card shadow="hover">
+ <el-form ref="queryFormRef" :model="queryParams" :inline="true" label-width="68px">
+ <el-form-item label="瑙掕壊鍚嶇О" prop="roleName">
+ <el-input v-model="queryParams.roleName" placeholder="璇疯緭鍏ヨ鑹插悕绉�" clearable style="width: 240px" @keyup.enter="handleQuery" />
+ </el-form-item>
+ <el-form-item label="鏉冮檺瀛楃" prop="roleKey">
+ <el-input v-model="queryParams.roleKey" placeholder="璇疯緭鍏ユ潈闄愬瓧绗�" clearable style="width: 240px" @keyup.enter="handleQuery" />
+ </el-form-item>
+ <el-form-item label="鐘舵��" prop="status">
+ <el-select v-model="queryParams.status" placeholder="瑙掕壊鐘舵��" clearable style="width: 240px">
+ <el-option v-for="dict in sys_normal_disable" :key="dict.value" :label="dict.label" :value="dict.value" />
+ </el-select>
+ </el-form-item>
+ <el-form-item label="鍒涘缓鏃堕棿" style="width: 308px">
+ <el-date-picker
+ v-model="dateRange"
+ value-format="YYYY-MM-DD"
+ type="daterange"
+ range-separator="-"
+ start-placeholder="寮�濮嬫棩鏈�"
+ end-placeholder="缁撴潫鏃ユ湡"
+ :default-time="[new Date(2000, 1, 1, 0, 0, 0), new Date(2000, 1, 1, 23, 59, 59)]"
+ ></el-date-picker>
+ </el-form-item>
- <el-form-item>
- <el-button type="primary" @click="handleQuery" icon="Search">鎼滅储</el-button>
- <el-button @click="resetQuery" icon="Refresh">閲嶇疆</el-button>
- </el-form-item>
- </el-form>
+ <el-form-item>
+ <el-button type="primary" @click="handleQuery" icon="Search">鎼滅储</el-button>
+ <el-button @click="resetQuery" icon="Refresh">閲嶇疆</el-button>
+ </el-form-item>
+ </el-form>
+ </el-card>
</div>
</transition>
- <el-card shadow="never">
+ <el-card shadow="hover">
<template #header>
<el-row :gutter="10">
<el-col :span="1.5">
@@ -119,7 +121,7 @@
<el-form-item label="鐘舵��">
<el-radio-group v-model="form.status">
<el-radio v-for="dict in sys_normal_disable" :key="dict.value" :label="dict.value">{{
- dict.label
+ dict.label
}}</el-radio>
</el-radio-group>
</el-form-item>
@@ -196,8 +198,6 @@
import { roleMenuTreeselect, treeselect as menuTreeselect } from '@/api/system/menu/index';
import { RoleVO, RoleForm, RoleQuery, DeptTreeOption } from '@/api/system/role/types';
import { MenuTreeOption, RoleMenuTree } from '@/api/system/menu/types';
-import { ComponentInternalInstance } from 'vue';
-import { ElTree, ElForm, DateModelType } from 'element-plus';
const router = useRouter();
const { proxy } = getCurrentInstance() as ComponentInternalInstance;
@@ -221,54 +221,54 @@
/** 鏁版嵁鑼冨洿閫夐」*/
const dataScopeOptions = ref([
- { value: "1", label: "鍏ㄩ儴鏁版嵁鏉冮檺" },
- { value: "2", label: "鑷畾鏁版嵁鏉冮檺" },
- { value: "3", label: "鏈儴闂ㄦ暟鎹潈闄�" },
- { value: "4", label: "鏈儴闂ㄥ強浠ヤ笅鏁版嵁鏉冮檺" },
- { value: "5", label: "浠呮湰浜烘暟鎹潈闄�" }
+ { value: "1", label: "鍏ㄩ儴鏁版嵁鏉冮檺" },
+ { value: "2", label: "鑷畾鏁版嵁鏉冮檺" },
+ { value: "3", label: "鏈儴闂ㄦ暟鎹潈闄�" },
+ { value: "4", label: "鏈儴闂ㄥ強浠ヤ笅鏁版嵁鏉冮檺" },
+ { value: "5", label: "浠呮湰浜烘暟鎹潈闄�" }
])
-const queryFormRef = ref(ElForm);
-const roleFormRef = ref(ElForm);
-const dataScopeRef = ref(ElForm);
-const menuRef = ref(ElTree);
-const deptRef = ref(ElTree);
+const queryFormRef = ref<ElFormInstance>();
+const roleFormRef = ref<ElFormInstance>();
+const dataScopeRef = ref<ElFormInstance>();
+const menuRef = ref<ElTreeInstance>();
+const deptRef = ref<ElTreeInstance>();
const initForm: RoleForm = {
- roleId: undefined,
- roleSort: 1,
- status: '0',
- roleName: '',
- roleKey: '',
- menuCheckStrictly: true,
- deptCheckStrictly: true,
- remark: '',
- dataScope: '1',
- menuIds: [],
- deptIds: [],
+ roleId: undefined,
+ roleSort: 1,
+ status: '0',
+ roleName: '',
+ roleKey: '',
+ menuCheckStrictly: true,
+ deptCheckStrictly: true,
+ remark: '',
+ dataScope: '1',
+ menuIds: [],
+ deptIds: [],
}
const data = reactive<PageData<RoleForm, RoleQuery>>({
- form: {...initForm},
- queryParams: {
- pageNum: 1,
- pageSize: 10,
- roleName: '',
- roleKey: '',
- status: '',
- },
- rules: {
- roleName: [{ required: true, message: "瑙掕壊鍚嶇О涓嶈兘涓虹┖", trigger: "blur" }],
- roleKey: [{ required: true, message: "鏉冮檺瀛楃涓嶈兘涓虹┖", trigger: "blur" }],
- roleSort: [{ required: true, message: "瑙掕壊椤哄簭涓嶈兘涓虹┖", trigger: "blur" }]
- }
+ form: { ...initForm },
+ queryParams: {
+ pageNum: 1,
+ pageSize: 10,
+ roleName: '',
+ roleKey: '',
+ status: '',
+ },
+ rules: {
+ roleName: [{ required: true, message: "瑙掕壊鍚嶇О涓嶈兘涓虹┖", trigger: "blur" }],
+ roleKey: [{ required: true, message: "鏉冮檺瀛楃涓嶈兘涓虹┖", trigger: "blur" }],
+ roleSort: [{ required: true, message: "瑙掕壊椤哄簭涓嶈兘涓虹┖", trigger: "blur" }]
+ }
})
const { form, queryParams, rules } = toRefs(data)
const dialog = reactive<DialogOption>({
- visible: false,
- title: ''
+ visible: false,
+ title: ''
});
@@ -276,233 +276,241 @@
* 鏌ヨ瑙掕壊鍒楄〃
*/
const getList = () => {
- loading.value = true
- listRole(proxy?.addDateRange(queryParams.value, dateRange.value)).then(res => {
- roleList.value = res.rows
- total.value = res.total
- loading.value = false
- })
+ loading.value = true
+ listRole(proxy?.addDateRange(queryParams.value, dateRange.value)).then(res => {
+ roleList.value = res.rows
+ total.value = res.total
+ loading.value = false
+ })
}
/**
* 鎼滅储鎸夐挳鎿嶄綔
*/
const handleQuery = () => {
- queryParams.value.pageNum = 1;
- getList();
+ queryParams.value.pageNum = 1;
+ getList();
}
/** 閲嶇疆 */
const resetQuery = () => {
- dateRange.value = ['', '']
- queryFormRef.value.resetFields();
- handleQuery();
+ dateRange.value = ['', '']
+ queryFormRef.value?.resetFields();
+ handleQuery();
}
/**鍒犻櫎鎸夐挳鎿嶄綔 */
const handleDelete = async (row?: RoleVO) => {
- const roleids = row?.roleId || ids.value;
- await proxy?.$modal.confirm('鏄惁纭鍒犻櫎瑙掕壊缂栧彿涓�' + roleids + '鏁版嵁椤圭洰');
- await delRole(roleids);
- getList();
- proxy?.$modal.msgSuccess('鍒犻櫎鎴愬姛');
+ const roleids = row?.roleId || ids.value;
+ await proxy?.$modal.confirm('鏄惁纭鍒犻櫎瑙掕壊缂栧彿涓�' + roleids + '鏁版嵁椤圭洰');
+ await delRole(roleids);
+ getList();
+ proxy?.$modal.msgSuccess('鍒犻櫎鎴愬姛');
}
/** 瀵煎嚭鎸夐挳鎿嶄綔 */
const handleExport = () => {
- proxy?.download("system/role/export", {
- ...queryParams.value,
- }, `role_${new Date().getTime()}.xlsx`)
+ proxy?.download("system/role/export", {
+ ...queryParams.value,
+ }, `role_${new Date().getTime()}.xlsx`)
}
/** 澶氶�夋閫変腑鏁版嵁 */
const handleSelectionChange = (selection: RoleVO[]) => {
- ids.value = selection.map((item: RoleVO) => item.roleId);
- single.value = selection.length != 1;
- multiple.value = !selection.length;
+ ids.value = selection.map((item: RoleVO) => item.roleId);
+ single.value = selection.length != 1;
+ multiple.value = !selection.length;
}
/** 瑙掕壊鐘舵�佷慨鏀� */
const handleStatusChange = async (row: RoleVO) => {
- let text = row.status === "0" ? "鍚敤" : "鍋滅敤";
- try {
- await proxy?.$modal.confirm('纭瑕�"' + text + '""' + row.roleName + '"瑙掕壊鍚�?');
- await changeRoleStatus(row.roleId, row.status);
- proxy?.$modal.msgSuccess(text + "鎴愬姛");
- } catch {
- row.status = row.status === "0" ? "1" : "0";
- }
+ let text = row.status === "0" ? "鍚敤" : "鍋滅敤";
+ try {
+ await proxy?.$modal.confirm('纭瑕�"' + text + '""' + row.roleName + '"瑙掕壊鍚�?');
+ await changeRoleStatus(row.roleId, row.status);
+ proxy?.$modal.msgSuccess(text + "鎴愬姛");
+ } catch {
+ row.status = row.status === "0" ? "1" : "0";
+ }
}
/** 鍒嗛厤鐢ㄦ埛 */
const handleAuthUser = (row: RoleVO) => {
- router.push("/system/role-auth/user/" + row.roleId);
+ router.push("/system/role-auth/user/" + row.roleId);
}
/** 鏌ヨ鑿滃崟鏍戠粨鏋� */
const getMenuTreeselect = async () => {
- const res = await menuTreeselect();
- menuOptions.value = res.data;
+ const res = await menuTreeselect();
+ menuOptions.value = res.data;
}
/** 鎵�鏈夐儴闂ㄨ妭鐐规暟鎹� */
-const getDeptAllCheckedKeys = () => {
- // 鐩墠琚�変腑鐨勯儴闂ㄨ妭鐐�
- let checkedKeys = deptRef.value.getCheckedKeys();
- // 鍗婇�変腑鐨勯儴闂ㄨ妭鐐�
- let halfCheckedKeys = deptRef.value.getHalfCheckedKeys();
- checkedKeys.unshift.apply(checkedKeys, halfCheckedKeys);
- return checkedKeys
+const getDeptAllCheckedKeys = (): any => {
+ // 鐩墠琚�変腑鐨勯儴闂ㄨ妭鐐�
+ let checkedKeys = deptRef.value?.getCheckedKeys();
+ // 鍗婇�変腑鐨勯儴闂ㄨ妭鐐�
+ let halfCheckedKeys = deptRef.value?.getHalfCheckedKeys();
+ if (halfCheckedKeys) {
+ checkedKeys?.unshift.apply(checkedKeys, halfCheckedKeys);
+ }
+ return checkedKeys
}
/** 閲嶇疆鏂板鐨勮〃鍗曚互鍙婂叾浠栨暟鎹� */
const reset = () => {
- menuRef.value.setCheckedKeys([]);
- menuExpand.value = false
- menuNodeAll.value = false
- deptExpand.value = true
- deptNodeAll.value = false
- form.value = { ...initForm };
- roleFormRef.value.resetFields();
+ menuRef.value?.setCheckedKeys([]);
+ menuExpand.value = false
+ menuNodeAll.value = false
+ deptExpand.value = true
+ deptNodeAll.value = false
+ form.value = { ...initForm };
+ roleFormRef.value?.resetFields();
}
/** 娣诲姞瑙掕壊 */
const handleAdd = () => {
- dialog.visible = true;
- dialog.title = "娣诲姞瑙掕壊";
- nextTick(() => {
- reset();
- getMenuTreeselect();
- })
+ dialog.visible = true;
+ dialog.title = "娣诲姞瑙掕壊";
+ nextTick(() => {
+ reset();
+ getMenuTreeselect();
+ })
}
/** 淇敼瑙掕壊 */
const handleUpdate = async (row?: RoleVO) => {
- const roleId = row?.roleId || ids.value[0]
- const roleMenu = getRoleMenuTreeselect(roleId)
- const { data } = await getRole(roleId);
- dialog.visible = true;
- dialog.title = "淇敼瑙掕壊";
- nextTick(() => {
- reset();
- Object.assign(form.value, data);
- form.value.roleSort = Number(form.value.roleSort);
- nextTick(async () => {
- const res = await roleMenu;
- let checkedKeys = res.checkedKeys;
- checkedKeys.forEach((v) => {
- nextTick(() => {
- menuRef.value.setChecked(v, true, false);
- })
- })
+ const roleId = row?.roleId || ids.value[0]
+ const roleMenu = getRoleMenuTreeselect(roleId)
+ const { data } = await getRole(roleId);
+ dialog.visible = true;
+ dialog.title = "淇敼瑙掕壊";
+ await nextTick(() => {
+ reset();
+ Object.assign(form.value, data);
+ form.value.roleSort = Number(form.value.roleSort);
+ nextTick(async () => {
+ const res = await roleMenu;
+ let checkedKeys = res.checkedKeys;
+ checkedKeys.forEach((v) => {
+ nextTick(() => {
+ menuRef.value?.setChecked(v, true, false);
})
+ })
})
+ })
}
/** 鏍规嵁瑙掕壊ID鏌ヨ鑿滃崟鏍戠粨鏋� */
const getRoleMenuTreeselect = (roleId: string | number) => {
- return roleMenuTreeselect(roleId).then((res): RoleMenuTree => {
- menuOptions.value = res.data.menus;
- return res.data;
- })
+ return roleMenuTreeselect(roleId).then((res): RoleMenuTree => {
+ menuOptions.value = res.data.menus;
+ return res.data;
+ })
}
/** 鏍规嵁瑙掕壊ID鏌ヨ閮ㄩ棬鏍戠粨鏋� */
const getRoleDeptTreeSelect = async (roleId: string | number) => {
- const res = await deptTreeSelect(roleId);
- deptOptions.value = res.data.depts;
- return res.data;
+ const res = await deptTreeSelect(roleId);
+ deptOptions.value = res.data.depts;
+ return res.data;
}
/** 鏍戞潈闄愶紙灞曞紑/鎶樺彔锛�*/
-const handleCheckedTreeExpand = (value: any, type: string) => {
- if (type == "menu") {
- let treeList = menuOptions.value;
- for (let i = 0; i < treeList.length; i++) {
- menuRef.value.store.nodesMap[treeList[i].id].expanded = value;
- }
- } else if (type == "dept") {
- let treeList = deptOptions.value;
- for (let i = 0; i < treeList.length; i++) {
- deptRef.value.store.nodesMap[treeList[i].id].expanded = value;
- }
+const handleCheckedTreeExpand = (value: boolean, type: string) => {
+ if (type == "menu") {
+ let treeList = menuOptions.value;
+ for (let i = 0; i < treeList.length; i++) {
+ if (menuRef.value) {
+ menuRef.value.store.nodesMap[treeList[i].id].expanded = value;
+ }
}
+ } else if (type == "dept") {
+ let treeList = deptOptions.value;
+ for (let i = 0; i < treeList.length; i++) {
+ if (deptRef.value) {
+ deptRef.value.store.nodesMap[treeList[i].id].expanded = value;
+ }
+ }
+ }
}
/** 鏍戞潈闄愶紙鍏ㄩ��/鍏ㄤ笉閫夛級 */
const handleCheckedTreeNodeAll = (value: any, type: string) => {
- if (type == "menu") {
- menuRef.value.setCheckedNodes(value ? menuOptions.value : []);
- } else if (type == "dept") {
- deptRef.value.setCheckedNodes(value ? deptOptions.value : []);
- }
+ if (type == "menu") {
+ menuRef.value?.setCheckedNodes(value ? menuOptions.value as any : []);
+ } else if (type == "dept") {
+ deptRef.value?.setCheckedNodes(value ? deptOptions.value as any : []);
+ }
}
/** 鏍戞潈闄愶紙鐖跺瓙鑱斿姩锛� */
const handleCheckedTreeConnect = (value: any, type: string) => {
- if (type == "menu") {
- form.value.menuCheckStrictly = value;
- } else if (type == "dept") {
- form.value.deptCheckStrictly = value;
- }
+ if (type == "menu") {
+ form.value.menuCheckStrictly = value;
+ } else if (type == "dept") {
+ form.value.deptCheckStrictly = value;
+ }
}
/** 鎵�鏈夎彍鍗曡妭鐐规暟鎹� */
-const getMenuAllCheckedKeys = () => {
- // 鐩墠琚�変腑鐨勮彍鍗曡妭鐐�
- let checkedKeys = menuRef.value.getCheckedKeys();
- // 鍗婇�変腑鐨勮彍鍗曡妭鐐�
- let halfCheckedKeys = menuRef.value.getHalfCheckedKeys();
- checkedKeys.unshift.apply(checkedKeys, halfCheckedKeys);
- return checkedKeys;
+const getMenuAllCheckedKeys = (): any => {
+ // 鐩墠琚�変腑鐨勮彍鍗曡妭鐐�
+ let checkedKeys = menuRef.value?.getCheckedKeys();
+ // 鍗婇�変腑鐨勮彍鍗曡妭鐐�
+ let halfCheckedKeys = menuRef.value?.getHalfCheckedKeys();
+ if (halfCheckedKeys) {
+ checkedKeys?.unshift.apply(checkedKeys, halfCheckedKeys);
+ }
+ return checkedKeys;
}
/** 鎻愪氦鎸夐挳 */
const submitForm = () => {
- roleFormRef.value.validate(async (valid: boolean) => {
- if (valid) {
- form.value.menuIds = getMenuAllCheckedKeys()
- form.value.roleId ? await updateRole(form.value) : await addRole(form.value);
- proxy?.$modal.msgSuccess("鎿嶄綔鎴愬姛")
- dialog.visible = false
- getList()
- }
- })
+ roleFormRef.value?.validate(async (valid: boolean) => {
+ if (valid) {
+ form.value.menuIds = getMenuAllCheckedKeys()
+ form.value.roleId ? await updateRole(form.value) : await addRole(form.value);
+ proxy?.$modal.msgSuccess("鎿嶄綔鎴愬姛")
+ dialog.visible = false
+ getList()
+ }
+ })
}
/** 鍙栨秷鎸夐挳 */
const cancel = () => {
- reset()
- dialog.visible = false;
+ reset()
+ dialog.visible = false;
}
/** 閫夋嫨瑙掕壊鏉冮檺鑼冨洿瑙﹀彂 */
const dataScopeSelectChange = (value: string) => {
- if (value !== "2") {
- deptRef.value.setCheckedKeys([])
- }
+ if (value !== "2") {
+ deptRef.value?.setCheckedKeys([])
+ }
}
/** 鍒嗛厤鏁版嵁鏉冮檺鎿嶄綔 */
const handleDataScope = async (row: RoleVO) => {
- const roleDeptTreeselect = getRoleDeptTreeSelect(row.roleId);
- const response = await getRole(row.roleId);
- Object.assign(form.value, response.data);
- openDataScope.value = true;
- dialog.title = "鍒嗛厤鏁版嵁鏉冮檺";
- nextTick(async () => {
- const res = await roleDeptTreeselect;
- nextTick(() => {
- if (deptRef.value) {
- deptRef.value.setCheckedKeys(res.checkedKeys);
- }
- })
+ const roleDeptTreeselect = getRoleDeptTreeSelect(row.roleId);
+ const response = await getRole(row.roleId);
+ Object.assign(form.value, response.data);
+ openDataScope.value = true;
+ dialog.title = "鍒嗛厤鏁版嵁鏉冮檺";
+ await nextTick(async () => {
+ const res = await roleDeptTreeselect;
+ await nextTick(() => {
+ if (deptRef.value) {
+ deptRef.value.setCheckedKeys(res.checkedKeys);
+ }
})
+ })
}
/** 鎻愪氦鎸夐挳锛堟暟鎹潈闄愶級 */
const submitDataScope = async () => {
- if (form.value.roleId) {
- form.value.deptIds = getDeptAllCheckedKeys();
- await dataScope(form.value);
- proxy?.$modal.msgSuccess("淇敼鎴愬姛");
- openDataScope.value = false;
- getList();
- }
+ if (form.value.roleId) {
+ form.value.deptIds = getDeptAllCheckedKeys();
+ await dataScope(form.value);
+ proxy?.$modal.msgSuccess("淇敼鎴愬姛");
+ openDataScope.value = false;
+ getList();
+ }
}
/** 鍙栨秷鎸夐挳锛堟暟鎹潈闄愶級*/
const cancelDataScope = () => {
- dataScopeRef.value.resetFields();
- form.value = {...initForm};
- openDataScope.value = false;
+ dataScopeRef.value?.resetFields();
+ form.value = { ...initForm };
+ openDataScope.value = false;
}
onMounted(() => {
- getList();
+ getList();
});
</script>
diff --git a/src/views/system/role/selectUser.vue b/src/views/system/role/selectUser.vue
index 38c6a44..26b7ae2 100644
--- a/src/views/system/role/selectUser.vue
+++ b/src/views/system/role/selectUser.vue
@@ -47,14 +47,12 @@
import { authUserSelectAll, unallocatedUserList } from "@/api/system/role";
import { UserVO } from '@/api/system/user/types';
import { UserQuery } from '@/api/system/user/types';
-import { ComponentInternalInstance } from 'vue';
-import { ElForm, ElTable } from 'element-plus';
const props = defineProps({
- roleId: {
- type: [Number, String]
- }
+ roleId: {
+ type: [Number, String]
+ }
})
const { proxy } = getCurrentInstance() as ComponentInternalInstance;
@@ -66,67 +64,68 @@
const userIds = ref<Array<string | number>>([]);
const queryParams = reactive<UserQuery>({
- pageNum: 1,
- pageSize: 10,
- roleId: undefined,
- userName: undefined,
- phonenumber: undefined
+ pageNum: 1,
+ pageSize: 10,
+ roleId: undefined,
+ userName: undefined,
+ phonenumber: undefined
})
-const tableRef = ref(ElTable);
-const queryFormRef = ref(ElForm);
+const tableRef = ref<ElTableInstance>();
+const queryFormRef = ref<ElFormInstance>();
const show = () => {
- queryParams.roleId = props.roleId;
- getList();
- visible.value = true;
+ queryParams.roleId = props.roleId;
+ getList();
+ visible.value = true;
}
/**
* 閫夋嫨琛�
*/
const clickRow = (row: any) => {
- tableRef.value.toggleRowSelection(row);
+ // ele鐨刡ug
+ tableRef.value?.toggleRowSelection(row);
}
/** 澶氶�夋閫変腑鏁版嵁 */
const handleSelectionChange = (selection: UserVO[]) => {
- userIds.value = selection.map((item: UserVO) => item.userId);
+ userIds.value = selection.map((item: UserVO) => item.userId);
}
/** 鏌ヨ鏁版嵁 */
const getList = async () => {
- const res = await unallocatedUserList(queryParams);
- userList.value = res.rows;
- total.value = res.total;
+ const res = await unallocatedUserList(queryParams);
+ userList.value = res.rows;
+ total.value = res.total;
}
/** 鎼滅储鎸夐挳鎿嶄綔 */
const handleQuery = () => {
- queryParams.pageNum = 1;
- getList();
+ queryParams.pageNum = 1;
+ getList();
}
/** 閲嶇疆鎸夐挳鎿嶄綔 */
const resetQuery = () => {
- queryFormRef.value.resetFields();
- getList();
+ queryFormRef.value?.resetFields();
+ getList();
}
const emit = defineEmits(["ok"]);
/**閫夋嫨鎺堟潈鐢ㄦ埛鎿嶄綔 */
const handleSelectUser = async () => {
- const roleId = queryParams.roleId;
- const ids = userIds.value.join(',');
- if (ids == "") {
- proxy?.$modal.msgError('璇烽�夋嫨瑕佸垎閰嶇殑鐢ㄦ埛');
- return;
- }
- await authUserSelectAll({ roleId, userIds: ids });
- proxy?.$modal.msgSuccess('鍒嗛厤鎴愬姛');
- emit('ok');
- visible.value = false;
+ const roleId = queryParams.roleId;
+ const ids = userIds.value.join(',');
+ if (ids == "") {
+ proxy?.$modal.msgError('璇烽�夋嫨瑕佸垎閰嶇殑鐢ㄦ埛');
+ return;
+ }
+ await authUserSelectAll({ roleId, userIds: ids });
+ proxy?.$modal.msgSuccess('鍒嗛厤鎴愬姛');
+ emit('ok');
+ visible.value = false;
}
// 鏆撮湶
defineExpose({
- show,
+ show,
});
</script>
diff --git a/src/views/system/tenant/index.vue b/src/views/system/tenant/index.vue
index 277a9ce..711ee7f 100644
--- a/src/views/system/tenant/index.vue
+++ b/src/views/system/tenant/index.vue
@@ -1,29 +1,31 @@
<template>
<div class="p-2">
<transition :enter-active-class="proxy?.animate.searchAnimate.enter" :leave-active-class="proxy?.animate.searchAnimate.leave">
- <div class="search" v-show="showSearch">
- <el-form :model="queryParams" ref="queryFormRef" :inline="true" label-width="68px">
- <el-form-item label="绉熸埛缂栧彿" prop="tenantId">
- <el-input v-model="queryParams.tenantId" placeholder="璇疯緭鍏ョ鎴风紪鍙�" clearable @keyup.enter="handleQuery" />
- </el-form-item>
- <el-form-item label="鑱旂郴浜�" prop="contactUserName">
- <el-input v-model="queryParams.contactUserName" placeholder="璇疯緭鍏ヨ仈绯讳汉" clearable @keyup.enter="handleQuery" />
- </el-form-item>
- <el-form-item label="鑱旂郴鐢佃瘽" prop="contactPhone">
- <el-input v-model="queryParams.contactPhone" placeholder="璇疯緭鍏ヨ仈绯荤數璇�" clearable @keyup.enter="handleQuery" />
- </el-form-item>
- <el-form-item label="浼佷笟鍚嶇О" prop="companyName">
- <el-input v-model="queryParams.companyName" placeholder="璇疯緭鍏ヤ紒涓氬悕绉�" clearable @keyup.enter="handleQuery" />
- </el-form-item>
- <el-form-item>
- <el-button type="primary" icon="Search" @click="handleQuery">鎼滅储</el-button>
- <el-button icon="Refresh" @click="resetQuery">閲嶇疆</el-button>
- </el-form-item>
- </el-form>
+ <div class="mb-[10px]" v-show="showSearch">
+ <el-card shadow="hover">
+ <el-form :model="queryParams" ref="queryFormRef" :inline="true" label-width="68px">
+ <el-form-item label="绉熸埛缂栧彿" prop="tenantId">
+ <el-input v-model="queryParams.tenantId" placeholder="璇疯緭鍏ョ鎴风紪鍙�" clearable @keyup.enter="handleQuery" />
+ </el-form-item>
+ <el-form-item label="鑱旂郴浜�" prop="contactUserName">
+ <el-input v-model="queryParams.contactUserName" placeholder="璇疯緭鍏ヨ仈绯讳汉" clearable @keyup.enter="handleQuery" />
+ </el-form-item>
+ <el-form-item label="鑱旂郴鐢佃瘽" prop="contactPhone">
+ <el-input v-model="queryParams.contactPhone" placeholder="璇疯緭鍏ヨ仈绯荤數璇�" clearable @keyup.enter="handleQuery" />
+ </el-form-item>
+ <el-form-item label="浼佷笟鍚嶇О" prop="companyName">
+ <el-input v-model="queryParams.companyName" placeholder="璇疯緭鍏ヤ紒涓氬悕绉�" clearable @keyup.enter="handleQuery" />
+ </el-form-item>
+ <el-form-item>
+ <el-button type="primary" icon="Search" @click="handleQuery">鎼滅储</el-button>
+ <el-button icon="Refresh" @click="resetQuery">閲嶇疆</el-button>
+ </el-form-item>
+ </el-form>
+ </el-card>
</div>
</transition>
- <el-card shadow="never">
+ <el-card shadow="hover">
<template #header>
<el-row :gutter="10" class="mb8">
<el-col :span="1.5">
@@ -80,7 +82,7 @@
</el-table-column>
</el-table>
- <pagination v-show="total>0" :total="total" v-model:page="queryParams.pageNum" v-model:limit="queryParams.pageSize" @pagination="getList" />
+ <pagination v-show="total > 0" :total="total" v-model:page="queryParams.pageNum" v-model:limit="queryParams.pageSize" @pagination="getList" />
</el-card>
<!-- 娣诲姞鎴栦慨鏀圭鎴峰璇濇 -->
<el-dialog :title="dialog.title" v-model="dialog.visible" width="500px" append-to-body>
@@ -143,8 +145,6 @@
import { selectTenantPackage } from '@/api/system/tenantPackage';
import { TenantForm, TenantQuery, TenantVO } from '@/api/system/tenant/types';
import { TenantPkgVO } from '@/api/system/tenantPackage/types';
-import { ComponentInternalInstance } from 'vue';
-import { ElForm } from 'element-plus';
const { proxy } = getCurrentInstance() as ComponentInternalInstance;
@@ -158,196 +158,196 @@
const multiple = ref(true);
const total = ref(0);
-const queryFormRef = ref(ElForm);
-const tenantFormRef = ref(ElForm);
+const queryFormRef = ref<ElFormInstance>();
+const tenantFormRef = ref<ElFormInstance>();
const dialog = reactive<DialogOption>({
- visible: false,
- title: ''
+ visible: false,
+ title: ''
});
const initFormData: TenantForm = {
- id: undefined,
- tenantId: undefined,
- contactUserName: '',
- contactPhone: '',
- username: '',
- password: '',
- companyName: '',
- licenseNumber: '',
- domain: '',
- address: '',
- intro: '',
- remark: '',
- packageId: '',
- expireTime: '',
- accountCount: 0,
- status: '0',
+ id: undefined,
+ tenantId: undefined,
+ contactUserName: '',
+ contactPhone: '',
+ username: '',
+ password: '',
+ companyName: '',
+ licenseNumber: '',
+ domain: '',
+ address: '',
+ intro: '',
+ remark: '',
+ packageId: '',
+ expireTime: '',
+ accountCount: 0,
+ status: '0',
}
const data = reactive<PageData<TenantForm, TenantQuery>>({
- form: {...initFormData},
- queryParams: {
- pageNum: 1,
- pageSize: 10,
- tenantId: '',
- contactUserName: '',
- contactPhone: '',
- companyName: ''
- },
- rules: {
- id: [{ required: true, message: "id涓嶈兘涓虹┖", trigger: "blur" }],
- tenantId: [{ required: true, message: "绉熸埛缂栧彿涓嶈兘涓虹┖", trigger: "blur" }],
- contactUserName: [{ required: true, message: "鑱旂郴浜轰笉鑳戒负绌�", trigger: "blur" }],
- contactPhone: [{ required: true, message: "鑱旂郴鐢佃瘽涓嶈兘涓虹┖", trigger: "blur" }],
- companyName: [{ required: true, message: "浼佷笟鍚嶇О涓嶈兘涓虹┖", trigger: "blur" }],
- username: [
- { required: true, message: "鐢ㄦ埛鍚嶄笉鑳戒负绌�", trigger: "blur" },
- { min: 2, max: 20, message: '鐢ㄦ埛鍚嶇О闀垮害蹇呴』浠嬩簬 2 鍜� 20 涔嬮棿', trigger: 'blur' }
- ],
- password: [
- { required: true, message: "瀵嗙爜涓嶈兘涓虹┖", trigger: "blur" },
- { min: 5, max: 20, message: '鐢ㄦ埛瀵嗙爜闀垮害蹇呴』浠嬩簬 5 鍜� 20 涔嬮棿', trigger: 'blur' }
- ]
- }
+ form: { ...initFormData },
+ queryParams: {
+ pageNum: 1,
+ pageSize: 10,
+ tenantId: '',
+ contactUserName: '',
+ contactPhone: '',
+ companyName: ''
+ },
+ rules: {
+ id: [{ required: true, message: "id涓嶈兘涓虹┖", trigger: "blur" }],
+ tenantId: [{ required: true, message: "绉熸埛缂栧彿涓嶈兘涓虹┖", trigger: "blur" }],
+ contactUserName: [{ required: true, message: "鑱旂郴浜轰笉鑳戒负绌�", trigger: "blur" }],
+ contactPhone: [{ required: true, message: "鑱旂郴鐢佃瘽涓嶈兘涓虹┖", trigger: "blur" }],
+ companyName: [{ required: true, message: "浼佷笟鍚嶇О涓嶈兘涓虹┖", trigger: "blur" }],
+ username: [
+ { required: true, message: "鐢ㄦ埛鍚嶄笉鑳戒负绌�", trigger: "blur" },
+ { min: 2, max: 20, message: '鐢ㄦ埛鍚嶇О闀垮害蹇呴』浠嬩簬 2 鍜� 20 涔嬮棿', trigger: 'blur' }
+ ],
+ password: [
+ { required: true, message: "瀵嗙爜涓嶈兘涓虹┖", trigger: "blur" },
+ { min: 5, max: 20, message: '鐢ㄦ埛瀵嗙爜闀垮害蹇呴』浠嬩簬 5 鍜� 20 涔嬮棿', trigger: 'blur' }
+ ]
+ }
});
const { queryParams, form, rules } = toRefs(data);
/** 鏌ヨ鎵�鏈夌鎴峰椁� */
const getTenantPackage = async () => {
- const res = await selectTenantPackage()
- packageList.value = res.data;
+ const res = await selectTenantPackage()
+ packageList.value = res.data;
}
/** 鏌ヨ绉熸埛鍒楄〃 */
const getList = async () => {
- loading.value = true;
- const res = await listTenant(queryParams.value);
- tenantList.value = res.rows;
- total.value = res.total;
- loading.value = false;
+ loading.value = true;
+ const res = await listTenant(queryParams.value);
+ tenantList.value = res.rows;
+ total.value = res.total;
+ loading.value = false;
}
// 绉熸埛濂楅鐘舵�佷慨鏀�
const handleStatusChange = async (row: TenantVO) => {
- let text = row.status === "0" ? "鍚敤" : "鍋滅敤";
- try {
- await proxy?.$modal.confirm('纭瑕�"' + text + '""' + row.companyName + '"绉熸埛鍚楋紵');
- await changeTenantStatus(row.id, row.tenantId, row.status);
- proxy?.$modal.msgSuccess(text + "鎴愬姛");
- } catch {
- row.status = row.status === "0" ? "1" : "0";
- }
+ let text = row.status === "0" ? "鍚敤" : "鍋滅敤";
+ try {
+ await proxy?.$modal.confirm('纭瑕�"' + text + '""' + row.companyName + '"绉熸埛鍚楋紵');
+ await changeTenantStatus(row.id, row.tenantId, row.status);
+ proxy?.$modal.msgSuccess(text + "鎴愬姛");
+ } catch {
+ row.status = row.status === "0" ? "1" : "0";
+ }
}
// 鍙栨秷鎸夐挳
const cancel = () => {
- reset();
- dialog.visible = false;
+ reset();
+ dialog.visible = false;
}
// 琛ㄥ崟閲嶇疆
const reset = () => {
- form.value = {...initFormData};
- tenantFormRef.value.resetFields();
+ form.value = { ...initFormData };
+ tenantFormRef.value?.resetFields();
}
/** 鎼滅储鎸夐挳鎿嶄綔 */
const handleQuery = () => {
- queryParams.value.pageNum = 1;
- getList();
+ queryParams.value.pageNum = 1;
+ getList();
}
/** 閲嶇疆鎸夐挳鎿嶄綔 */
const resetQuery = () => {
- queryFormRef.value.resetFields();
- handleQuery();
+ queryFormRef.value?.resetFields();
+ handleQuery();
}
// 澶氶�夋閫変腑鏁版嵁
const handleSelectionChange = (selection: TenantVO[]) => {
- ids.value = selection.map(item => item.id);
- single.value = selection.length != 1;
- multiple.value = !selection.length;
+ ids.value = selection.map(item => item.id);
+ single.value = selection.length != 1;
+ multiple.value = !selection.length;
}
/** 鏂板鎸夐挳鎿嶄綔 */
const handleAdd = () => {
- dialog.visible = true;
- dialog.title = "娣诲姞绉熸埛";
- nextTick(() => {
- reset();
- getTenantPackage();
- })
+ dialog.visible = true;
+ dialog.title = "娣诲姞绉熸埛";
+ nextTick(() => {
+ reset();
+ getTenantPackage();
+ })
}
/** 淇敼鎸夐挳鎿嶄綔 */
const handleUpdate = (row?: TenantVO) => {
- loading.value = true;
- dialog.visible = true;
- dialog.title = "淇敼绉熸埛";
- nextTick(async () => {
- reset();
- getTenantPackage();
- const _id = row?.id || ids.value[0];
- const res = await getTenant(_id);
- loading.value = false;
- Object.assign(form.value, res.data)
- })
+ loading.value = true;
+ dialog.visible = true;
+ dialog.title = "淇敼绉熸埛";
+ nextTick(async () => {
+ reset();
+ await getTenantPackage();
+ const _id = row?.id || ids.value[0];
+ const res = await getTenant(_id);
+ loading.value = false;
+ Object.assign(form.value, res.data)
+ })
}
/** 鎻愪氦鎸夐挳 */
const submitForm = () => {
- tenantFormRef.value.validate(async (valid: boolean) => {
- if (valid) {
- buttonLoading.value = true;
- if (form.value.id) {
- await updateTenant(form.value).finally(() => buttonLoading.value = false);
- } else {
- await addTenant(form.value).finally(() => buttonLoading.value = false);
- }
- proxy?.$modal.msgSuccess("鎿嶄綔鎴愬姛");
- dialog.visible = false;
- getList();
- }
- });
+ tenantFormRef.value?.validate(async (valid: boolean) => {
+ if (valid) {
+ buttonLoading.value = true;
+ if (form.value.id) {
+ await updateTenant(form.value).finally(() => buttonLoading.value = false);
+ } else {
+ await addTenant(form.value).finally(() => buttonLoading.value = false);
+ }
+ proxy?.$modal.msgSuccess("鎿嶄綔鎴愬姛");
+ dialog.visible = false;
+ getList();
+ }
+ });
}
/** 鍒犻櫎鎸夐挳鎿嶄綔 */
const handleDelete = async (row?: TenantVO) => {
- const _ids = row?.id || ids.value;
- await proxy?.$modal.confirm('鏄惁纭鍒犻櫎绉熸埛缂栧彿涓�"' + _ids + '"鐨勬暟鎹」锛�')
- loading.value = true;
- await delTenant(_ids).finally(() => loading.value = false);
- getList();
- proxy?.$modal.msgSuccess("鍒犻櫎鎴愬姛");
+ const _ids = row?.id || ids.value;
+ await proxy?.$modal.confirm('鏄惁纭鍒犻櫎绉熸埛缂栧彿涓�"' + _ids + '"鐨勬暟鎹」锛�')
+ loading.value = true;
+ await delTenant(_ids).finally(() => loading.value = false);
+ await getList();
+ proxy?.$modal.msgSuccess("鍒犻櫎鎴愬姛");
}
/** 鍚屾绉熸埛濂楅鎸夐挳鎿嶄綔 */
const handleSyncTenantPackage = async (row: TenantVO) => {
- try {
- await proxy?.$modal.confirm('鏄惁纭鍚屾绉熸埛濂楅绉熸埛缂栧彿涓�"' + row.tenantId + '"鐨勬暟鎹」锛�');
- loading.value = true;
- await syncTenantPackage(row.tenantId, row.packageId);
- getList();
- proxy?.$modal.msgSuccess("鍚屾鎴愬姛");
- } catch {return} finally {
- loading.value = false;
- }
+ try {
+ await proxy?.$modal.confirm('鏄惁纭鍚屾绉熸埛濂楅绉熸埛缂栧彿涓�"' + row.tenantId + '"鐨勬暟鎹」锛�');
+ loading.value = true;
+ await syncTenantPackage(row.tenantId, row.packageId);
+ await getList();
+ proxy?.$modal.msgSuccess("鍚屾鎴愬姛");
+ } catch { return } finally {
+ loading.value = false;
+ }
}
/** 瀵煎嚭鎸夐挳鎿嶄綔 */
const handleExport = () => {
- proxy?.download('system/tenant/export', {
- ...queryParams.value
- }, `tenant_${new Date().getTime()}.xlsx`)
+ proxy?.download('system/tenant/export', {
+ ...queryParams.value
+ }, `tenant_${new Date().getTime()}.xlsx`)
}
onMounted(() => {
- getList();
+ getList();
})
</script>
diff --git a/src/views/system/tenantPackage/index.vue b/src/views/system/tenantPackage/index.vue
index ca06734..add2eb5 100644
--- a/src/views/system/tenantPackage/index.vue
+++ b/src/views/system/tenantPackage/index.vue
@@ -1,37 +1,39 @@
<template>
<div class="p-2">
<transition :enter-active-class="proxy?.animate.searchAnimate.enter" :leave-active-class="proxy?.animate.searchAnimate.leave">
- <div class="search" v-show="showSearch">
- <el-form :model="queryParams" ref="queryFormRef" :inline="true" label-width="68px">
- <el-form-item label="濂楅鍚嶇О" prop="packageName">
- <el-input v-model="queryParams.packageName" placeholder="璇疯緭鍏ュ椁愬悕绉�" clearable @keyup.enter="handleQuery" />
- </el-form-item>
- <el-form-item>
- <el-button type="primary" icon="Search" @click="handleQuery">鎼滅储</el-button>
- <el-button icon="Refresh" @click="resetQuery">閲嶇疆</el-button>
- </el-form-item>
- </el-form>
+ <div class="mb-[10px]" v-show="showSearch">
+ <el-card shadow="hover">
+ <el-form :model="queryParams" ref="queryFormRef" :inline="true" label-width="68px">
+ <el-form-item label="濂楅鍚嶇О" prop="packageName">
+ <el-input v-model="queryParams.packageName" placeholder="璇疯緭鍏ュ椁愬悕绉�" clearable @keyup.enter="handleQuery" />
+ </el-form-item>
+ <el-form-item>
+ <el-button type="primary" icon="Search" @click="handleQuery">鎼滅储</el-button>
+ <el-button icon="Refresh" @click="resetQuery">閲嶇疆</el-button>
+ </el-form-item>
+ </el-form>
+ </el-card>
</div>
</transition>
- <el-card shadow="never">
+ <el-card shadow="hover">
<template #header>
<el-row :gutter="10" class="mb8">
<el-col :span="1.5">
- <el-button type="primary" plain icon="Plus" @click="handleAdd" v-hasPermi="['system:tenantPackage:add']">鏂板</el-button>
+ <el-button type="primary" plain icon="Plus" @click="handleAdd" v-hasPermi="['system:tenantPackage:add']"> 鏂板 </el-button>
</el-col>
<el-col :span="1.5">
- <el-button type="success" plain icon="Edit" :disabled="single" @click="handleUpdate()" v-hasPermi="['system:tenantPackage:edit']"
- >淇敼</el-button
- >
+ <el-button type="success" plain icon="Edit" :disabled="single" @click="handleUpdate()" v-hasPermi="['system:tenantPackage:edit']">
+ 淇敼
+ </el-button>
</el-col>
<el-col :span="1.5">
- <el-button type="danger" plain icon="Delete" :disabled="multiple" @click="handleDelete()" v-hasPermi="['system:tenantPackage:remove']"
- >鍒犻櫎</el-button
- >
+ <el-button type="danger" plain icon="Delete" :disabled="multiple" @click="handleDelete()" v-hasPermi="['system:tenantPackage:remove']">
+ 鍒犻櫎
+ </el-button>
</el-col>
<el-col :span="1.5">
- <el-button type="warning" plain icon="Download" @click="handleExport" v-hasPermi="['system:tenantPackage:export']">瀵煎嚭</el-button>
+ <el-button type="warning" plain icon="Download" @click="handleExport" v-hasPermi="['system:tenantPackage:export']">瀵煎嚭 </el-button>
</el-col>
<right-toolbar v-model:showSearch="showSearch" @queryTable="getList"></right-toolbar>
</el-row>
@@ -53,13 +55,13 @@
<el-button link type="primary" icon="Edit" @click="handleUpdate(scope.row)" v-hasPermi="['system:tenantPackage:edit']"></el-button>
</el-tooltip>
<el-tooltip content="鍒犻櫎" placement="top">
- <el-button link type="primary" icon="Delete" @click="handleDelete(scope.row)" v-hasPermi="['system:tenantPackage:remove']"> </el-button>
+ <el-button link type="primary" icon="Delete" @click="handleDelete(scope.row)" v-hasPermi="['system:tenantPackage:remove']"></el-button>
</el-tooltip>
</template>
</el-table-column>
</el-table>
- <pagination v-show="total>0" :total="total" v-model:page="queryParams.pageNum" v-model:limit="queryParams.pageSize" @pagination="getList" />
+ <pagination v-show="total > 0" :total="total" v-model:page="queryParams.pageNum" v-model:limit="queryParams.pageSize" @pagination="getList" />
</el-card>
<!-- 娣诲姞鎴栦慨鏀圭鎴峰椁愬璇濇 -->
@@ -70,8 +72,8 @@
</el-form-item>
<el-form-item label="鍏宠仈鑿滃崟">
<el-checkbox v-model="menuExpand" @change="handleCheckedTreeExpand($event, 'menu')">灞曞紑/鎶樺彔</el-checkbox>
- <el-checkbox v-model="menuNodeAll" @change="handleCheckedTreeNodeAll($event, 'menu')">鍏ㄩ��/鍏ㄤ笉閫�</el-checkbox>
- <el-checkbox v-model="form.menuCheckStrictly" @change="handleCheckedTreeConnect($event, 'menu')">鐖跺瓙鑱斿姩</el-checkbox>
+ <el-checkbox v-model="menuNodeAll" @change="handleCheckedTreeNodeAll($event, 'menu')">鍏ㄩ��/鍏ㄤ笉閫� </el-checkbox>
+ <el-checkbox v-model="form.menuCheckStrictly" @change="handleCheckedTreeConnect($event, 'menu')">鐖跺瓙鑱斿姩 </el-checkbox>
<el-tree
class="tree-border"
:data="menuOptions"
@@ -98,12 +100,17 @@
</template>
<script setup name="TenantPackage" lang="ts">
-import { listTenantPackage, getTenantPackage, delTenantPackage, addTenantPackage, updateTenantPackage, changePackageStatus } from "@/api/system/tenantPackage";
+import {
+ listTenantPackage,
+ getTenantPackage,
+ delTenantPackage,
+ addTenantPackage,
+ updateTenantPackage,
+ changePackageStatus
+} from "@/api/system/tenantPackage";
import { treeselect as menuTreeselect, tenantPackageMenuTreeselect } from "@/api/system/menu";
-import { ComponentInternalInstance } from "vue";
import { TenantPkgForm, TenantPkgQuery, TenantPkgVO } from "@/api/system/tenantPackage/types";
import { MenuTreeOption } from "@/api/system/menu/types";
-import { CheckboxValueType, ElTree, ElForm } from 'element-plus';
import to from "await-to-js";
const { proxy } = getCurrentInstance() as ComponentInternalInstance;
@@ -120,212 +127,216 @@
const menuNodeAll = ref(false);
const menuOptions = ref<MenuTreeOption[]>([]);
-const menuTreeRef = ref(ElTree);
-const queryFormRef = ref(ElForm);
-const tenantPackageFormRef = ref(ElForm);
+const menuTreeRef = ref<ElTreeInstance>();
+const queryFormRef = ref<ElFormInstance>();
+const tenantPackageFormRef = ref<ElFormInstance>();
const dialog = reactive<DialogOption>({
- visible: false,
- title: ''
+ visible: false,
+ title: ""
});
const initFormData: TenantPkgForm = {
- packageId: undefined,
- packageName: '',
- menuIds: '',
- remark: '',
- menuCheckStrictly: true
+ packageId: undefined,
+ packageName: "",
+ menuIds: "",
+ remark: "",
+ menuCheckStrictly: true
};
const data = reactive<PageData<TenantPkgForm, TenantPkgQuery>>({
- form: {...initFormData},
- queryParams: {
- pageNum: 1,
- pageSize: 10,
- packageName: ''
- },
- rules: {
- packageId: [{ required: true, message: "绉熸埛濂楅id涓嶈兘涓虹┖", trigger: "blur" }],
- packageName: [{ required: true, message: "濂楅鍚嶇О涓嶈兘涓虹┖", trigger: "blur" }]
- }
+ form: { ...initFormData },
+ queryParams: {
+ pageNum: 1,
+ pageSize: 10,
+ packageName: ""
+ },
+ rules: {
+ packageId: [{ required: true, message: "绉熸埛濂楅id涓嶈兘涓虹┖", trigger: "blur" }],
+ packageName: [{ required: true, message: "濂楅鍚嶇О涓嶈兘涓虹┖", trigger: "blur" }]
+ }
});
const { queryParams, form, rules } = toRefs(data);
/** 鏌ヨ鑿滃崟鏍戠粨鏋� */
-const getMenuTreeselect = async() => {
- const { data } = await menuTreeselect();
- menuOptions.value = data;
-}
+const getMenuTreeselect = async () => {
+ const { data } = await menuTreeselect();
+ menuOptions.value = data;
+};
// 鎵�鏈夎彍鍗曡妭鐐规暟鎹�
-const getMenuAllCheckedKeys = () => {
- // 鐩墠琚�変腑鐨勮彍鍗曡妭鐐�
- let checkedKeys = menuTreeRef.value.getCheckedKeys();
- // 鍗婇�変腑鐨勮彍鍗曡妭鐐�
- let halfCheckedKeys = menuTreeRef.value.getHalfCheckedKeys();
- checkedKeys.unshift.apply(checkedKeys, halfCheckedKeys);
- return checkedKeys;
-}
+const getMenuAllCheckedKeys = (): any => {
+ // 鐩墠琚�変腑鐨勮彍鍗曡妭鐐�
+ let checkedKeys = menuTreeRef.value?.getCheckedKeys();
+ // 鍗婇�変腑鐨勮彍鍗曡妭鐐�
+ let halfCheckedKeys = menuTreeRef.value?.getHalfCheckedKeys();
+ if (halfCheckedKeys) {
+ checkedKeys?.unshift.apply(checkedKeys, halfCheckedKeys);
+ }
+ return checkedKeys;
+};
/** 鏍规嵁绉熸埛濂楅ID鏌ヨ鑿滃崟鏍戠粨鏋� */
-const getPackageMenuTreeselect = async(packageId: string | number) => {
- const res = await tenantPackageMenuTreeselect(packageId);
- menuOptions.value = res.data.menus;
- return Promise.resolve(res);
-}
+const getPackageMenuTreeselect = async (packageId: string | number) => {
+ const res = await tenantPackageMenuTreeselect(packageId);
+ menuOptions.value = res.data.menus;
+ return Promise.resolve(res);
+};
/** 鏌ヨ绉熸埛濂楅鍒楄〃 */
const getList = async () => {
- loading.value = true;
- const res = await listTenantPackage(queryParams.value);
- tenantPackageList.value = res.rows;
- total.value = res.total;
- loading.value = false;
-}
+ loading.value = true;
+ const res = await listTenantPackage(queryParams.value);
+ tenantPackageList.value = res.rows;
+ total.value = res.total;
+ loading.value = false;
+};
// 绉熸埛濂楅鐘舵�佷慨鏀�
const handleStatusChange = async (row: TenantPkgVO) => {
- let text = row.status === "0" ? "鍚敤" : "鍋滅敤";
- const [err] = await to(proxy?.$modal.confirm('纭瑕�"' + text + '""' + row.packageName + '"濂楅鍚楋紵') as Promise<any>)
- if (err) {
- row.status = row.status === "0" ? "1" : "0";
- } else {
- await changePackageStatus(row.packageId, row.status);
- proxy?.$modal.msgSuccess(text + "鎴愬姛");
- }
-}
+ let text = row.status === "0" ? "鍚敤" : "鍋滅敤";
+ const [err] = await to(proxy?.$modal.confirm("纭瑕乗"" + text + "\"\"" + row.packageName + "\"濂楅鍚楋紵") as Promise<any>);
+ if (err) {
+ row.status = row.status === "0" ? "1" : "0";
+ } else {
+ await changePackageStatus(row.packageId, row.status);
+ proxy?.$modal.msgSuccess(text + "鎴愬姛");
+ }
+};
// 鍙栨秷鎸夐挳
const cancel = () => {
- reset();
- dialog.visible = false;
-}
+ reset();
+ dialog.visible = false;
+};
// 琛ㄥ崟閲嶇疆
const reset = () => {
- menuTreeRef.value.setCheckedKeys([]);
- menuExpand.value = false;
- menuNodeAll.value = false;
- form.value = {...initFormData};
- tenantPackageFormRef.value.resetFields();
-}
+ menuTreeRef.value?.setCheckedKeys([]);
+ menuExpand.value = false;
+ menuNodeAll.value = false;
+ form.value = { ...initFormData };
+ tenantPackageFormRef.value?.resetFields();
+};
/** 鎼滅储鎸夐挳鎿嶄綔 */
const handleQuery = () => {
- queryParams.value.pageNum = 1;
- getList();
-}
+ queryParams.value.pageNum = 1;
+ getList();
+};
/** 閲嶇疆鎸夐挳鎿嶄綔 */
const resetQuery = () => {
- queryFormRef.value.resetFields();
- handleQuery();
-}
+ queryFormRef.value?.resetFields();
+ handleQuery();
+};
// 澶氶�夋閫変腑鏁版嵁
const handleSelectionChange = (selection: TenantPkgVO[]) => {
- ids.value = selection.map(item => item.packageId);
- single.value = selection.length != 1;
- multiple.value = !selection.length;
-}
+ ids.value = selection.map(item => item.packageId);
+ single.value = selection.length != 1;
+ multiple.value = !selection.length;
+};
// 鏍戞潈闄愶紙灞曞紑/鎶樺彔锛�
const handleCheckedTreeExpand = (value: CheckboxValueType, type: string) => {
- if (type == 'menu') {
- let treeList = menuOptions.value;
- for (let i = 0; i < treeList.length; i++) {
- menuTreeRef.value.store.nodesMap[treeList[i].id].expanded = value;
- }
+ if (type == "menu") {
+ let treeList = menuOptions.value;
+ for (let i = 0; i < treeList.length; i++) {
+ if (menuTreeRef.value) {
+ menuTreeRef.value.store.nodesMap[treeList[i].id].expanded = value as boolean;
+ }
}
-}
+ }
+};
// 鏍戞潈闄愶紙鍏ㄩ��/鍏ㄤ笉閫夛級
const handleCheckedTreeNodeAll = (value: CheckboxValueType, type: string) => {
- if (type == 'menu') {
- menuTreeRef.value.setCheckedNodes(value ? menuOptions.value: []);
- }
-}
+ if (type == "menu") {
+ menuTreeRef.value?.setCheckedNodes(value ? menuOptions.value as any : []);
+ }
+};
// 鏍戞潈闄愶紙鐖跺瓙鑱斿姩锛�
const handleCheckedTreeConnect = (value: CheckboxValueType, type: string) => {
- if (type == 'menu') {
- form.value.menuCheckStrictly = value as boolean;
- }
-}
+ if (type == "menu") {
+ form.value.menuCheckStrictly = value as boolean;
+ }
+};
/** 鏂板鎸夐挳鎿嶄綔 */
const handleAdd = () => {
- dialog.visible = true;
- dialog.title = "娣诲姞绉熸埛濂楅";
- nextTick(() => {
- reset();
- getMenuTreeselect();
- })
-}
+ dialog.visible = true;
+ dialog.title = "娣诲姞绉熸埛濂楅";
+ nextTick(() => {
+ reset();
+ getMenuTreeselect();
+ });
+};
/** 淇敼鎸夐挳鎿嶄綔 */
const handleUpdate = (row?: TenantPkgVO) => {
- loading.value = true
- dialog.visible = true;
- dialog.title = "淇敼绉熸埛濂楅";
- nextTick(async () => {
- reset();
- const _packageId = row?.packageId || ids.value[0];
- const packageMenu = getPackageMenuTreeselect(_packageId);
- const response = await getTenantPackage(_packageId);
- loading.value = false;
- form.value = response.data;
- nextTick(async () => {
- const res = await packageMenu;
- let checkedKeys = res.data.checkedKeys
- checkedKeys.forEach((v) => {
- nextTick(() => {
- menuTreeRef.value.setChecked(v, true ,false);
- })
- })
+ loading.value = true;
+ dialog.visible = true;
+ dialog.title = "淇敼绉熸埛濂楅";
+ nextTick(async () => {
+ reset();
+ const _packageId = row?.packageId || ids.value[0];
+ const packageMenu = getPackageMenuTreeselect(_packageId);
+ const response = await getTenantPackage(_packageId);
+ loading.value = false;
+ form.value = response.data;
+ await nextTick(async () => {
+ const res = await packageMenu;
+ let checkedKeys = res.data.checkedKeys;
+ checkedKeys.forEach((v) => {
+ nextTick(() => {
+ menuTreeRef.value?.setChecked(v, true, false);
});
- })
-}
+ });
+ });
+ });
+};
/** 鎻愪氦鎸夐挳 */
const submitForm = () => {
- tenantPackageFormRef.value.validate(async (valid: boolean) => {
- if (valid) {
- buttonLoading.value = true;
- form.value.menuIds = getMenuAllCheckedKeys();
- if (form.value.packageId != null) {
- await updateTenantPackage(form.value).finally(() => buttonLoading.value = false);
- } else {
- await addTenantPackage(form.value).finally(() => buttonLoading.value = false);
- }
- proxy?.$modal.msgSuccess("鎿嶄綔鎴愬姛");
- dialog.visible = false;
- getList();
- }
- });
-}
+ tenantPackageFormRef.value?.validate(async (valid: boolean) => {
+ if (valid) {
+ buttonLoading.value = true;
+ form.value.menuIds = getMenuAllCheckedKeys();
+ if (form.value.packageId != null) {
+ await updateTenantPackage(form.value).finally(() => buttonLoading.value = false);
+ } else {
+ await addTenantPackage(form.value).finally(() => buttonLoading.value = false);
+ }
+ proxy?.$modal.msgSuccess("鎿嶄綔鎴愬姛");
+ dialog.visible = false;
+ await getList();
+ }
+ });
+};
/** 鍒犻櫎鎸夐挳鎿嶄綔 */
const handleDelete = async (row?: TenantPkgVO) => {
- const _packageIds = row?.packageId || ids.value;
- await proxy?.$modal.confirm('鏄惁纭鍒犻櫎绉熸埛濂楅缂栧彿涓�"' + _packageIds + '"鐨勬暟鎹」锛�').finally(() => {
- loading.value = false;
- });
- await delTenantPackage(_packageIds);
- loading.value = true;
- getList();
- proxy?.$modal.msgSuccess("鍒犻櫎鎴愬姛");
-}
+ const _packageIds = row?.packageId || ids.value;
+ await proxy?.$modal.confirm("鏄惁纭鍒犻櫎绉熸埛濂楅缂栧彿涓篭"" + _packageIds + "\"鐨勬暟鎹」锛�").finally(() => {
+ loading.value = false;
+ });
+ await delTenantPackage(_packageIds);
+ loading.value = true;
+ await getList();
+ proxy?.$modal.msgSuccess("鍒犻櫎鎴愬姛");
+};
/** 瀵煎嚭鎸夐挳鎿嶄綔 */
const handleExport = () => {
- proxy?.download('system/tenantPackage/export', {
- ...queryParams.value
- }, `tenantPackage_${new Date().getTime()}.xlsx`)
-}
+ proxy?.download("system/tenantPackage/export", {
+ ...queryParams.value
+ }, `tenantPackage_${new Date().getTime()}.xlsx`);
+};
onMounted(() => {
- getList();
-})
+ getList();
+});
</script>
diff --git a/src/views/system/user/authRole.vue b/src/views/system/user/authRole.vue
index 0e8eba2..e55a8d8 100644
--- a/src/views/system/user/authRole.vue
+++ b/src/views/system/user/authRole.vue
@@ -55,11 +55,10 @@
</template>
<script setup name="AuthRole" lang="ts">
-import { RoleVO } from '@/api/system/role/types';
-import { getAuthRole, updateAuthRole } from '@/api/system/user';
-import { UserForm } from '@/api/system/user/types';
-import { ElTable } from "element-plus";
-import { ComponentInternalInstance } from 'vue';
+import { RoleVO } from "@/api/system/role/types";
+import { getAuthRole, updateAuthRole } from "@/api/system/user";
+import { UserForm } from "@/api/system/user/types";
+
const route = useRoute();
const { proxy } = getCurrentInstance() as ComponentInternalInstance;
@@ -70,58 +69,59 @@
const roleIds = ref<Array<string | number>>([]);
const roles = ref<RoleVO[]>([]);
const form = ref<Partial<UserForm>>({
- nickName: undefined,
- userName: '',
- userId: undefined
+ nickName: undefined,
+ userName: "",
+ userId: undefined
});
-const tableRef = ref(ElTable)
+const tableRef = ref<ElTableInstance>();
/** 鍗曞嚮閫変腑琛屾暟鎹� */
const clickRow = (row: RoleVO) => {
- tableRef.value.toggleRowSelection(row);
+ // ele鐨勬柟娉曟湁闂锛宻elected搴旇涓哄彲閫夊弬鏁�
+ tableRef.value?.toggleRowSelection(row);
};
/** 澶氶�夋閫変腑鏁版嵁 */
const handleSelectionChange = (selection: RoleVO[]) => {
- roleIds.value = selection.map(item => item.roleId);
+ roleIds.value = selection.map(item => item.roleId);
};
/** 淇濆瓨閫変腑鐨勬暟鎹紪鍙� */
const getRowKey = (row: RoleVO): string => {
- return String(row.roleId);
+ return String(row.roleId);
};
/** 鍏抽棴鎸夐挳 */
const close = () => {
- const obj = { path: "/system/user" };
- proxy?.$tab.closeOpenPage(obj);
+ const obj = { path: "/system/user" };
+ proxy?.$tab.closeOpenPage(obj);
};
/** 鎻愪氦鎸夐挳 */
const submitForm = async () => {
- const userId = form.value.userId;
- const rIds = roleIds.value.join(",");
- await updateAuthRole({ userId: userId as string, roleIds: rIds })
- proxy?.$modal.msgSuccess("鎺堟潈鎴愬姛");
- close();
+ const userId = form.value.userId;
+ const rIds = roleIds.value.join(",");
+ await updateAuthRole({ userId: userId as string, roleIds: rIds });
+ proxy?.$modal.msgSuccess("鎺堟潈鎴愬姛");
+ close();
};
-const getList = async() => {
- const userId = route.params && route.params.userId;
- if (userId) {
- loading.value = true;
- const res = await getAuthRole(userId as string);
- Object.assign(form.value, res.data.user)
- Object.assign(roles.value, res.data.roles)
- total.value = roles.value.length;
- await nextTick(() => {
- roles.value.forEach(row => {
- if (row?.flag) {
- tableRef.value.toggleRowSelection(row);
- }
- });
- });
- loading.value = false;
- }
-}
+const getList = async () => {
+ const userId = route.params && route.params.userId;
+ if (userId) {
+ loading.value = true;
+ const res = await getAuthRole(userId as string);
+ Object.assign(form.value, res.data.user);
+ Object.assign(roles.value, res.data.roles);
+ total.value = roles.value.length;
+ await nextTick(() => {
+ roles.value.forEach(row => {
+ if (row?.flag) {
+ tableRef.value?.toggleRowSelection(row, true);
+ }
+ });
+ });
+ loading.value = false;
+ }
+};
onMounted(() => {
- getList();
-})
+ getList();
+});
</script>
diff --git a/src/views/system/user/index.vue b/src/views/system/user/index.vue
index bf5a3d3..8e3bcfa 100644
--- a/src/views/system/user/index.vue
+++ b/src/views/system/user/index.vue
@@ -16,40 +16,48 @@
highlight-current
default-expand-all
@node-click="handleNodeClick"
- ></el-tree>
+ />
</el-card>
</el-col>
<el-col :lg="20" :xs="24">
<transition :enter-active-class="proxy?.animate.searchAnimate.enter" :leave-active-class="proxy?.animate.searchAnimate.leave">
- <div class="search" v-show="showSearch">
- <el-form ref="queryFormRef" :model="queryParams" :inline="true" label-width="68px">
- <el-form-item label="鐢ㄦ埛鍚嶇О" prop="userName">
- <el-input v-model="queryParams.userName" placeholder="璇疯緭鍏ョ敤鎴峰悕绉�" clearable style="width: 240px" @keyup.enter="handleQuery" />
- </el-form-item>
- <el-form-item label="鎵嬫満鍙风爜" prop="phonenumber">
- <el-input v-model="queryParams.phonenumber" placeholder="璇疯緭鍏ユ墜鏈哄彿鐮�" clearable style="width: 240px" @keyup.enter="handleQuery" />
- </el-form-item>
+ <div class="mb-[10px]" v-show="showSearch">
+ <el-card shadow="hover">
+ <el-form ref="queryFormRef" :model="queryParams" :inline="true" label-width="68px">
+ <el-form-item label="鐢ㄦ埛鍚嶇О" prop="userName">
+ <el-input v-model="queryParams.userName" placeholder="璇疯緭鍏ョ敤鎴峰悕绉�" clearable style="width: 240px" @keyup.enter="handleQuery" />
+ </el-form-item>
+ <el-form-item label="鎵嬫満鍙风爜" prop="phonenumber">
+ <el-input
+ v-model="queryParams.phonenumber"
+ placeholder="璇疯緭鍏ユ墜鏈哄彿鐮�"
+ clearable
+ style="width: 240px"
+ @keyup.enter="handleQuery"
+ />
+ </el-form-item>
- <el-form-item label="鐘舵��" prop="status">
- <el-select v-model="queryParams.status" placeholder="鐢ㄦ埛鐘舵��" clearable style="width: 240px">
- <el-option v-for="dict in sys_normal_disable" :key="dict.value" :label="dict.label" :value="dict.value" />
- </el-select>
- </el-form-item>
- <el-form-item label="鍒涘缓鏃堕棿" style="width: 308px;">
- <el-date-picker
- v-model="dateRange"
- value-format="YYYY-MM-DD"
- type="daterange"
- range-separator="-"
- start-placeholder="寮�濮嬫棩鏈�"
- end-placeholder="缁撴潫鏃ユ湡"
- ></el-date-picker>
- </el-form-item>
- <el-form-item>
- <el-button type="primary" @click="handleQuery" icon="Search">鎼滅储</el-button>
- <el-button @click="resetQuery" icon="Refresh">閲嶇疆</el-button>
- </el-form-item>
- </el-form>
+ <el-form-item label="鐘舵��" prop="status">
+ <el-select v-model="queryParams.status" placeholder="鐢ㄦ埛鐘舵��" clearable style="width: 240px">
+ <el-option v-for="dict in sys_normal_disable" :key="dict.value" :label="dict.label" :value="dict.value" />
+ </el-select>
+ </el-form-item>
+ <el-form-item label="鍒涘缓鏃堕棿" style="width: 308px;">
+ <el-date-picker
+ v-model="dateRange"
+ value-format="YYYY-MM-DD"
+ type="daterange"
+ range-separator="-"
+ start-placeholder="寮�濮嬫棩鏈�"
+ end-placeholder="缁撴潫鏃ユ湡"
+ ></el-date-picker>
+ </el-form-item>
+ <el-form-item>
+ <el-button type="primary" @click="handleQuery" icon="Search">鎼滅储</el-button>
+ <el-button @click="resetQuery" icon="Refresh">閲嶇疆</el-button>
+ </el-form-item>
+ </el-form>
+ </el-card>
</div>
</transition>
@@ -203,7 +211,7 @@
<el-form-item label="鐘舵��">
<el-radio-group v-model="form.status">
<el-radio v-for="dict in sys_normal_disable" :key="dict.value" :label="dict.value">{{
- dict.label }}</el-radio>
+ dict.label }}</el-radio>
</el-radio-group>
</el-form-item>
</el-col>
@@ -289,29 +297,18 @@
</template>
<script setup name="User" lang="ts">
-import {
- changeUserStatus,
- listUser,
- resetUserPwd,
- delUser,
- getUser,
- updateUser,
- addUser,
- deptTreeSelect
-} from "@/api/system/user"
+import api from "@/api/system/user"
import { UserForm, UserQuery, UserVO } from '@/api/system/user/types';
-import { ComponentInternalInstance } from "vue";
import { getToken } from "@/utils/auth";
import { treeselect } from "@/api/system/dept";
import { DeptVO } from "@/api/system/dept/types";
import { RoleVO } from "@/api/system/role/types";
import { PostVO } from "@/api/system/post/types";
-import { DateModelType, ElTree, ElUpload, UploadFile, ElForm } from 'element-plus';
import { to } from "await-to-js";
+
const router = useRouter();
const { proxy } = getCurrentInstance() as ComponentInternalInstance
const { sys_normal_disable, sys_user_sex } = toRefs<any>(proxy?.useDict('sys_normal_disable', 'sys_user_sex'));
-
const userList = ref<UserVO[]>();
const loading = ref(true);
@@ -320,7 +317,7 @@
const single = ref(true);
const multiple = ref(true);
const total = ref(0);
-const dateRange = ref<[DateModelType, DateModelType]>(['','']);
+const dateRange = ref<[DateModelType, DateModelType]>(['', '']);
const deptName = ref('');
const deptOptions = ref<DeptVO[]>([]);
const initPassword = ref('123456');
@@ -328,274 +325,274 @@
const roleOptions = ref<RoleVO[]>([]);
/*** 鐢ㄦ埛瀵煎叆鍙傛暟 */
const upload = reactive<ImportOption>({
- // 鏄惁鏄剧ず寮瑰嚭灞傦紙鐢ㄦ埛瀵煎叆锛�
- open: false,
- // 寮瑰嚭灞傛爣棰橈紙鐢ㄦ埛瀵煎叆锛�
- title: "",
- // 鏄惁绂佺敤涓婁紶
- isUploading: false,
- // 鏄惁鏇存柊宸茬粡瀛樺湪鐨勭敤鎴锋暟鎹�
- updateSupport: 0,
- // 璁剧疆涓婁紶鐨勮姹傚ご閮�
- headers: { Authorization: "Bearer " + getToken() },
- // 涓婁紶鐨勫湴鍧�
- url: import.meta.env.VITE_APP_BASE_API + "/system/user/importData"
+ // 鏄惁鏄剧ず寮瑰嚭灞傦紙鐢ㄦ埛瀵煎叆锛�
+ open: false,
+ // 寮瑰嚭灞傛爣棰橈紙鐢ㄦ埛瀵煎叆锛�
+ title: "",
+ // 鏄惁绂佺敤涓婁紶
+ isUploading: false,
+ // 鏄惁鏇存柊宸茬粡瀛樺湪鐨勭敤鎴锋暟鎹�
+ updateSupport: 0,
+ // 璁剧疆涓婁紶鐨勮姹傚ご閮�
+ headers: { Authorization: "Bearer " + getToken() },
+ // 涓婁紶鐨勫湴鍧�
+ url: import.meta.env.VITE_APP_BASE_API + "/system/user/importData"
})
// 鍒楁樉闅愪俊鎭�
const columns = ref<FieldOption[]>([
- { key: 0, label: `鐢ㄦ埛缂栧彿`, visible: false },
- { key: 1, label: `鐢ㄦ埛鍚嶇О`, visible: true },
- { key: 2, label: `鐢ㄦ埛鏄电О`, visible: true },
- { key: 3, label: `閮ㄩ棬`, visible: true },
- { key: 4, label: `鎵嬫満鍙风爜`, visible: true },
- { key: 5, label: `鐘舵�乣, visible: true },
- { key: 6, label: `鍒涘缓鏃堕棿`, visible: true }
+ { key: 0, label: `鐢ㄦ埛缂栧彿`, visible: false },
+ { key: 1, label: `鐢ㄦ埛鍚嶇О`, visible: true },
+ { key: 2, label: `鐢ㄦ埛鏄电О`, visible: true },
+ { key: 3, label: `閮ㄩ棬`, visible: true },
+ { key: 4, label: `鎵嬫満鍙风爜`, visible: true },
+ { key: 5, label: `鐘舵�乣, visible: true },
+ { key: 6, label: `鍒涘缓鏃堕棿`, visible: true }
])
-const deptTreeRef = ref(ElTree);
-const queryFormRef = ref(ElForm);
-const userFormRef = ref(ElForm);
-const uploadRef = ref(ElUpload);
+const deptTreeRef = ref<ElTreeInstance>();
+const queryFormRef = ref<ElFormInstance>();
+const userFormRef = ref<ElFormInstance>();
+const uploadRef = ref<ElUploadInstance>();
const dialog = reactive<DialogOption>({
- visible: false,
- title: ''
+ visible: false,
+ title: ''
});
const initFormData: UserForm = {
- userId: undefined,
- deptId: undefined,
- userName: '',
- nickName: undefined,
- password: '',
- phonenumber: undefined,
- email: undefined,
- sex: undefined,
- status: "0",
- remark: '',
- postIds: [],
- roleIds: []
+ userId: undefined,
+ deptId: undefined,
+ userName: '',
+ nickName: undefined,
+ password: '',
+ phonenumber: undefined,
+ email: undefined,
+ sex: undefined,
+ status: "0",
+ remark: '',
+ postIds: [],
+ roleIds: []
}
const data = reactive<PageData<UserForm, UserQuery>>({
- form: { ...initFormData },
- queryParams: {
- pageNum: 1,
- pageSize: 10,
- userName: '',
- phonenumber: '',
- status: '',
- deptId: ''
- },
- rules: {
- userName: [{ required: true, message: "鐢ㄦ埛鍚嶇О涓嶈兘涓虹┖", trigger: "blur" }, { min: 2, max: 20, message: "鐢ㄦ埛鍚嶇О闀垮害蹇呴』浠嬩簬 2 鍜� 20 涔嬮棿", trigger: "blur" }],
- nickName: [{ required: true, message: "鐢ㄦ埛鏄电О涓嶈兘涓虹┖", trigger: "blur" }],
- password: [{ required: true, message: "鐢ㄦ埛瀵嗙爜涓嶈兘涓虹┖", trigger: "blur" }, { min: 5, max: 20, message: "鐢ㄦ埛瀵嗙爜闀垮害蹇呴』浠嬩簬 5 鍜� 20 涔嬮棿", trigger: "blur" }],
- email: [{ type: "email", message: "璇疯緭鍏ユ纭殑閭鍦板潃", trigger: ["blur", "change"] }],
- phonenumber: [{ pattern: /^1[3|4|5|6|7|8|9][0-9]\d{8}$/, message: "璇疯緭鍏ユ纭殑鎵嬫満鍙风爜", trigger: "blur" }]
- }
+ form: { ...initFormData },
+ queryParams: {
+ pageNum: 1,
+ pageSize: 10,
+ userName: '',
+ phonenumber: '',
+ status: '',
+ deptId: ''
+ },
+ rules: {
+ userName: [{ required: true, message: "鐢ㄦ埛鍚嶇О涓嶈兘涓虹┖", trigger: "blur" }, { min: 2, max: 20, message: "鐢ㄦ埛鍚嶇О闀垮害蹇呴』浠嬩簬 2 鍜� 20 涔嬮棿", trigger: "blur" }],
+ nickName: [{ required: true, message: "鐢ㄦ埛鏄电О涓嶈兘涓虹┖", trigger: "blur" }],
+ password: [{ required: true, message: "鐢ㄦ埛瀵嗙爜涓嶈兘涓虹┖", trigger: "blur" }, { min: 5, max: 20, message: "鐢ㄦ埛瀵嗙爜闀垮害蹇呴』浠嬩簬 5 鍜� 20 涔嬮棿", trigger: "blur" }],
+ email: [{ type: "email", message: "璇疯緭鍏ユ纭殑閭鍦板潃", trigger: ["blur", "change"] }],
+ phonenumber: [{ pattern: /^1[3|4|5|6|7|8|9][0-9]\d{8}$/, message: "璇疯緭鍏ユ纭殑鎵嬫満鍙风爜", trigger: "blur" }]
+ }
})
const { queryParams, form, rules } = toRefs<PageData<UserForm, UserQuery>>(data)
/** 閫氳繃鏉′欢杩囨护鑺傜偣 */
const filterNode = (value: string, data: any) => {
- if (!value) return true
- return data.label.indexOf(value) !== -1
+ if (!value) return true
+ return data.label.indexOf(value) !== -1
}
/** 鏍规嵁鍚嶇О绛涢�夐儴闂ㄦ爲 */
watchEffect(
- () => {deptTreeRef.value.filter(deptName.value);},
- {
- flush: 'post' // watchEffect浼氬湪DOM鎸傝浇鎴栬�呮洿鏂颁箣鍓嶅氨浼氳Е鍙戯紝姝ゅ睘鎬ф帶鍒跺湪DOM鍏冪礌鏇存柊鍚庤繍琛�
- }
+ () => { deptTreeRef.value?.filter(deptName.value); },
+ {
+ flush: 'post' // watchEffect浼氬湪DOM鎸傝浇鎴栬�呮洿鏂颁箣鍓嶅氨浼氳Е鍙戯紝姝ゅ睘鎬ф帶鍒跺湪DOM鍏冪礌鏇存柊鍚庤繍琛�
+ }
);
/** 鏌ヨ閮ㄩ棬涓嬫媺鏍戠粨鏋� */
const getTreeSelect = async () => {
- const res = await deptTreeSelect();
- deptOptions.value = res.data;
+ const res = await api.deptTreeSelect();
+ deptOptions.value = res.data;
};
/** 鏌ヨ鐢ㄦ埛鍒楄〃 */
const getList = async () => {
- loading.value = true;
- const res = await listUser(proxy?.addDateRange(queryParams.value, dateRange.value));
- loading.value = false;
- userList.value = res.rows;
- total.value = res.total;
+ loading.value = true;
+ const res = await api.listUser(proxy?.addDateRange(queryParams.value, dateRange.value));
+ loading.value = false;
+ userList.value = res.rows;
+ total.value = res.total;
}
/** 鑺傜偣鍗曞嚮浜嬩欢 */
const handleNodeClick = (data: DeptVO) => {
- queryParams.value.deptId = data.id;
- handleQuery()
+ queryParams.value.deptId = data.id;
+ handleQuery()
}
/** 鎼滅储鎸夐挳鎿嶄綔 */
const handleQuery = () => {
- queryParams.value.pageNum = 1
- getList()
+ queryParams.value.pageNum = 1
+ getList()
}
/** 閲嶇疆鎸夐挳鎿嶄綔 */
const resetQuery = () => {
- dateRange.value = ['','']
- queryFormRef.value.resetFields();
- queryParams.value.pageNum = 1;
- queryParams.value.deptId = undefined;
- deptTreeRef.value.setCurrentKey(null);
- handleQuery();
+ dateRange.value = ['', '']
+ queryFormRef.value?.resetFields();
+ queryParams.value.pageNum = 1;
+ queryParams.value.deptId = undefined;
+ deptTreeRef.value?.setCurrentKey(undefined);
+ handleQuery();
}
/** 鍒犻櫎鎸夐挳鎿嶄綔 */
const handleDelete = async (row?: UserVO) => {
- const userIds = row?.userId || ids.value;
- const [err] = await to(proxy?.$modal.confirm('鏄惁纭鍒犻櫎鐢ㄦ埛缂栧彿涓�"' + userIds + '"鐨勬暟鎹」锛�') as any);
- if (!err) {
- await delUser(userIds);
- await getList();
- proxy?.$modal.msgSuccess("鍒犻櫎鎴愬姛");
- }
+ const userIds = row?.userId || ids.value;
+ const [err] = await to(proxy?.$modal.confirm('鏄惁纭鍒犻櫎鐢ㄦ埛缂栧彿涓�"' + userIds + '"鐨勬暟鎹」锛�') as any);
+ if (!err) {
+ await api.delUser(userIds);
+ await getList();
+ proxy?.$modal.msgSuccess("鍒犻櫎鎴愬姛");
+ }
}
/** 鐢ㄦ埛鐘舵�佷慨鏀� */
const handleStatusChange = async (row: UserVO) => {
- let text = row.status === "0" ? "鍚敤" : "鍋滅敤"
- try {
- await proxy?.$modal.confirm('纭瑕�"' + text + '""' + row.userName + '"鐢ㄦ埛鍚�?');
- await changeUserStatus(row.userId, row.status);
- proxy?.$modal.msgSuccess(text + "鎴愬姛");
- } catch (err) {
- row.status = row.status === "0" ? "1" : "0";
- }
+ let text = row.status === "0" ? "鍚敤" : "鍋滅敤"
+ try {
+ await proxy?.$modal.confirm('纭瑕�"' + text + '""' + row.userName + '"鐢ㄦ埛鍚�?');
+ await api.changeUserStatus(row.userId, row.status);
+ proxy?.$modal.msgSuccess(text + "鎴愬姛");
+ } catch (err) {
+ row.status = row.status === "0" ? "1" : "0";
+ }
}
/** 璺宠浆瑙掕壊鍒嗛厤 */
const handleAuthRole = (row: UserVO) => {
- const userId = row.userId;
- router.push("/system/user-auth/role/" + userId);
+ const userId = row.userId;
+ router.push("/system/user-auth/role/" + userId);
}
/** 閲嶇疆瀵嗙爜鎸夐挳鎿嶄綔 */
const handleResetPwd = async (row: UserVO) => {
- const [err, res] = await to(ElMessageBox.prompt('璇疯緭鍏�"' + row.userName + '"鐨勬柊瀵嗙爜', "鎻愮ず", {
- confirmButtonText: "纭畾",
- cancelButtonText: "鍙栨秷",
- closeOnClickModal: false,
- inputPattern: /^.{5,20}$/,
- inputErrorMessage: "鐢ㄦ埛瀵嗙爜闀垮害蹇呴』浠嬩簬 5 鍜� 20 涔嬮棿",
- }))
- if (!err) {
- await resetUserPwd(row.userId, res.value);
- proxy?.$modal.msgSuccess("淇敼鎴愬姛锛屾柊瀵嗙爜鏄細" + res.value);
- }
+ const [err, res] = await to(ElMessageBox.prompt('璇疯緭鍏�"' + row.userName + '"鐨勬柊瀵嗙爜', "鎻愮ず", {
+ confirmButtonText: "纭畾",
+ cancelButtonText: "鍙栨秷",
+ closeOnClickModal: false,
+ inputPattern: /^.{5,20}$/,
+ inputErrorMessage: "鐢ㄦ埛瀵嗙爜闀垮害蹇呴』浠嬩簬 5 鍜� 20 涔嬮棿",
+ }))
+ if (!err) {
+ await api.resetUserPwd(row.userId, res.value);
+ proxy?.$modal.msgSuccess("淇敼鎴愬姛锛屾柊瀵嗙爜鏄細" + res.value);
+ }
}
/** 閫夋嫨鏉℃暟 */
const handleSelectionChange = (selection: UserVO[]) => {
- ids.value = selection.map((item) => item.userId);
- single.value = selection.length != 1;
- multiple.value = !selection.length;
+ ids.value = selection.map((item) => item.userId);
+ single.value = selection.length != 1;
+ multiple.value = !selection.length;
}
/** 瀵煎叆鎸夐挳鎿嶄綔 */
const handleImport = () => {
- upload.title = "鐢ㄦ埛瀵煎叆";
- upload.open = true;
+ upload.title = "鐢ㄦ埛瀵煎叆";
+ upload.open = true;
}
/** 瀵煎嚭鎸夐挳鎿嶄綔 */
const handleExport = () => {
- proxy?.download("system/user/export", {
- ...queryParams.value,
- }, `user_${new Date().getTime()}.xlsx`);
+ proxy?.download("system/user/export", {
+ ...queryParams.value,
+ }, `user_${new Date().getTime()}.xlsx`);
};
/** 涓嬭浇妯℃澘鎿嶄綔 */
const importTemplate = () => {
- proxy?.download("system/user/importTemplate", {
- }, `user_template_${new Date().getTime()}.xlsx`);
+ proxy?.download("system/user/importTemplate", {
+ }, `user_template_${new Date().getTime()}.xlsx`);
}
/**鏂囦欢涓婁紶涓鐞� */
const handleFileUploadProgress = () => {
- upload.isUploading = true;
+ upload.isUploading = true;
}
/** 鏂囦欢涓婁紶鎴愬姛澶勭悊 */
const handleFileSuccess = (response: any, file: UploadFile) => {
- upload.open = false;
- upload.isUploading = false;
- uploadRef.value.handleRemove(file);
- ElMessageBox.alert("<div style='overflow: auto;overflow-x: hidden;max-height: 70vh;padding: 10px 20px 0;'>" + response.msg + "</div>", "瀵煎叆缁撴灉", { dangerouslyUseHTMLString: true });
- getList();
+ upload.open = false;
+ upload.isUploading = false;
+ uploadRef.value?.handleRemove(file);
+ ElMessageBox.alert("<div style='overflow: auto;overflow-x: hidden;max-height: 70vh;padding: 10px 20px 0;'>" + response.msg + "</div>", "瀵煎叆缁撴灉", { dangerouslyUseHTMLString: true });
+ getList();
}
/** 鎻愪氦涓婁紶鏂囦欢 */
function submitFileForm() {
- uploadRef.value.submit();
+ uploadRef.value?.submit();
}
/** 鍒濆鍖栭儴闂ㄦ暟鎹� */
const initTreeData = async () => {
- // 鍒ゆ柇閮ㄩ棬鐨勬暟鎹槸鍚﹀瓨鍦紝瀛樺湪涓嶈幏鍙栵紝涓嶅瓨鍦ㄥ垯鑾峰彇
- if (deptOptions.value === undefined) {
- const { data } = await treeselect();
- deptOptions.value = data;
- }
+ // 鍒ゆ柇閮ㄩ棬鐨勬暟鎹槸鍚﹀瓨鍦紝瀛樺湪涓嶈幏鍙栵紝涓嶅瓨鍦ㄥ垯鑾峰彇
+ if (deptOptions.value === undefined) {
+ const { data } = await treeselect();
+ deptOptions.value = data;
+ }
}
/** 閲嶇疆鎿嶄綔琛ㄥ崟 */
const reset = () => {
- form.value = { ...initFormData };
- userFormRef.value.resetFields();
+ form.value = { ...initFormData };
+ userFormRef.value?.resetFields();
}
/** 鍙栨秷鎸夐挳 */
const cancel = () => {
- reset();
- dialog.visible = false;
+ reset();
+ dialog.visible = false;
}
/** 鏂板鎸夐挳鎿嶄綔 */
const handleAdd = () => {
- dialog.visible = true;
- dialog.title = "鏂板鐢ㄦ埛";
- nextTick(async () => {
- reset();
- await initTreeData();
- const { data } = await getUser();
- postOptions.value = data.posts;
- roleOptions.value = data.roles;
- form.value.password = initPassword.value;
- })
+ dialog.visible = true;
+ dialog.title = "鏂板鐢ㄦ埛";
+ nextTick(async () => {
+ reset();
+ await initTreeData();
+ const { data } = await api.getUser();
+ postOptions.value = data.posts;
+ roleOptions.value = data.roles;
+ form.value.password = initPassword.value;
+ })
}
/** 淇敼鎸夐挳鎿嶄綔 */
const handleUpdate = (row?: UserForm) => {
- dialog.visible = true;
- dialog.title = "淇敼鐢ㄦ埛";
- nextTick(async () => {
- reset();
- await initTreeData();
- const userId = row?.userId || ids.value[0]
- const { data } = await getUser(userId)
- Object.assign(form.value, data.user);
- postOptions.value = data.posts;
- roleOptions.value = data.roles;
- form.value.postIds = data.postIds;
- form.value.roleIds = data.roleIds;
- form.value.password = "";
- })
+ dialog.visible = true;
+ dialog.title = "淇敼鐢ㄦ埛";
+ nextTick(async () => {
+ reset();
+ await initTreeData();
+ const userId = row?.userId || ids.value[0]
+ const { data } = await api.getUser(userId)
+ Object.assign(form.value, data.user);
+ postOptions.value = data.posts;
+ roleOptions.value = data.roles;
+ form.value.postIds = data.postIds;
+ form.value.roleIds = data.roleIds;
+ form.value.password = "";
+ })
}
/** 鎻愪氦鎸夐挳 */
const submitForm = () => {
- userFormRef.value.validate(async (valid: boolean) => {
- if (valid) {
- form.value.userId ? await updateUser(form.value) : await addUser(form.value);
- proxy?.$modal.msgSuccess("鎿嶄綔鎴愬姛");
- dialog.visible = false;
- await getList();
- }
- })
+ userFormRef.value?.validate(async (valid: boolean) => {
+ if (valid) {
+ form.value.userId ? await api.updateUser(form.value) : await api.addUser(form.value);
+ proxy?.$modal.msgSuccess("鎿嶄綔鎴愬姛");
+ dialog.visible = false;
+ await getList();
+ }
+ })
}
@@ -603,23 +600,23 @@
* 鍏抽棴鐢ㄦ埛寮圭獥
*/
const closeDialog = () => {
- dialog.visible = false;
- resetForm();
+ dialog.visible = false;
+ resetForm();
}
/**
* 閲嶇疆琛ㄥ崟
*/
const resetForm = () => {
- userFormRef.value.resetFields();
- userFormRef.value.clearValidate();
+ userFormRef.value?.resetFields();
+ userFormRef.value?.clearValidate();
- form.value.id = undefined;
- form.value.status = '1';
+ form.value.id = undefined;
+ form.value.status = '1';
}
onMounted(() => {
- getTreeSelect() // 鍒濆鍖栭儴闂ㄦ暟鎹�
- getList() // 鍒濆鍖栧垪琛ㄦ暟鎹�
+ getTreeSelect() // 鍒濆鍖栭儴闂ㄦ暟鎹�
+ getList() // 鍒濆鍖栧垪琛ㄦ暟鎹�
});
</script>
diff --git a/src/views/system/user/profile/index.vue b/src/views/system/user/profile/index.vue
index b06da65..31dc6ea 100644
--- a/src/views/system/user/profile/index.vue
+++ b/src/views/system/user/profile/index.vue
@@ -74,11 +74,11 @@
import { getUserProfile } from "@/api/system/user";
const activeTab = ref("userinfo");
-const state = ref<{ user: any; roleGroup: string; postGroup: string; auths:any[]}>({
+const state = ref<Record<string, any>>({
user: {},
roleGroup: '',
postGroup: '',
- auths: [],
+ auths: []
});
const userForm = ref({});
diff --git a/src/views/system/user/profile/resetPwd.vue b/src/views/system/user/profile/resetPwd.vue
index 174e020..11b00f6 100644
--- a/src/views/system/user/profile/resetPwd.vue
+++ b/src/views/system/user/profile/resetPwd.vue
@@ -17,46 +17,50 @@
</template>
<script setup lang="ts">
-import { updateUserPwd } from '@/api/system/user';
-import { ComponentInternalInstance } from 'vue';
-import { ResetPwdForm } from '@/api/system/user/types'
-import { ElForm } from 'element-plus';
+import { updateUserPwd } from "@/api/system/user";
+import type { ResetPwdForm } from "@/api/system/user/types";
const { proxy } = getCurrentInstance() as ComponentInternalInstance;
-
-
-const pwdRef = ref(ElForm);
-
+const pwdRef = ref<ElFormInstance>();
const user = ref<ResetPwdForm>({
- oldPassword: '',
- newPassword: '',
- confirmPassword: ''
+ oldPassword: "",
+ newPassword: "",
+ confirmPassword: ""
});
const equalToPassword = (rule: any, value: string, callback: any) => {
- if (user.value.newPassword !== value) {
- callback(new Error("涓ゆ杈撳叆鐨勫瘑鐮佷笉涓�鑷�"));
- } else {
- callback();
- }
+ if (user.value.newPassword !== value) {
+ callback(new Error("涓ゆ杈撳叆鐨勫瘑鐮佷笉涓�鑷�"));
+ } else {
+ callback();
+ }
};
const rules = ref({
- oldPassword: [{ required: true, message: "鏃у瘑鐮佷笉鑳戒负绌�", trigger: "blur" }],
- newPassword: [{ required: true, message: "鏂板瘑鐮佷笉鑳戒负绌�", trigger: "blur" }, { min: 6, max: 20, message: "闀垮害鍦� 6 鍒� 20 涓瓧绗�", trigger: "blur" }],
- confirmPassword: [{ required: true, message: "纭瀵嗙爜涓嶈兘涓虹┖", trigger: "blur" }, { required: true, validator: equalToPassword, trigger: "blur" }]
+ oldPassword: [{ required: true, message: "鏃у瘑鐮佷笉鑳戒负绌�", trigger: "blur" }],
+ newPassword: [{ required: true, message: "鏂板瘑鐮佷笉鑳戒负绌�", trigger: "blur" }, {
+ min: 6,
+ max: 20,
+ message: "闀垮害鍦� 6 鍒� 20 涓瓧绗�",
+ trigger: "blur"
+ }],
+ confirmPassword: [{ required: true, message: "纭瀵嗙爜涓嶈兘涓虹┖", trigger: "blur" }, {
+ required: true,
+ validator: equalToPassword,
+ trigger: "blur"
+ }]
});
/** 鎻愪氦鎸夐挳 */
const submit = () => {
- pwdRef.value.validate(async (valid: boolean) => {
- if (valid) {
- await updateUserPwd(user.value.oldPassword, user.value.newPassword)
- proxy?.$modal.msgSuccess("淇敼鎴愬姛");
- }
- });
+ pwdRef.value?.validate(async (valid: boolean) => {
+ if (valid) {
+ await updateUserPwd(user.value.oldPassword, user.value.newPassword);
+ proxy?.$modal.msgSuccess("淇敼鎴愬姛");
+ }
+ });
};
/** 鍏抽棴鎸夐挳 */
const close = () => {
- proxy?.$tab.closePage();
+ proxy?.$tab.closePage();
};
</script>
diff --git a/src/views/system/user/profile/userAvatar.vue b/src/views/system/user/profile/userAvatar.vue
index 0af8b28..0796765 100644
--- a/src/views/system/user/profile/userAvatar.vue
+++ b/src/views/system/user/profile/userAvatar.vue
@@ -29,7 +29,9 @@
<el-upload action="#" :http-request="requestUpload" :show-file-list="false" :before-upload="beforeUpload">
<el-button>
閫夋嫨
- <el-icon class="el-icon--right"><Upload /></el-icon>
+ <el-icon class="el-icon--right">
+ <Upload />
+ </el-icon>
</el-button>
</el-upload>
</el-col>
@@ -58,18 +60,17 @@
import { VueCropper } from "vue-cropper";
import { uploadAvatar } from "@/api/system/user";
import useUserStore from "@/store/modules/user";
-import { ComponentInternalInstance } from "vue";
interface Options {
- img: string | ArrayBuffer | null // 瑁佸壀鍥剧墖鐨勫湴鍧�
- autoCrop: boolean // 鏄惁榛樿鐢熸垚鎴浘妗�
- autoCropWidth: number // 榛樿鐢熸垚鎴浘妗嗗搴�
- autoCropHeight: number // 榛樿鐢熸垚鎴浘妗嗛珮搴�
- fixedBox: boolean // 鍥哄畾鎴浘妗嗗ぇ灏� 涓嶅厑璁告敼鍙�
- fileName: string
- previews: any // 棰勮鏁版嵁
- outputType: string
- visible: boolean
+ img: string | ArrayBuffer | null; // 瑁佸壀鍥剧墖鐨勫湴鍧�
+ autoCrop: boolean; // 鏄惁榛樿鐢熸垚鎴浘妗�
+ autoCropWidth: number; // 榛樿鐢熸垚鎴浘妗嗗搴�
+ autoCropHeight: number; // 榛樿鐢熸垚鎴浘妗嗛珮搴�
+ fixedBox: boolean; // 鍥哄畾鎴浘妗嗗ぇ灏� 涓嶅厑璁告敼鍙�
+ fileName: string;
+ previews: any; // 棰勮鏁版嵁
+ outputType: string;
+ visible: boolean;
}
@@ -83,75 +84,76 @@
const cropper = ref<any>({});
//鍥剧墖瑁佸壀鏁版嵁
const options = reactive<Options>({
- img: userStore.avatar,
- autoCrop: true,
- autoCropWidth: 200,
- autoCropHeight: 200,
- fixedBox: true,
- outputType: "png",
- fileName: '',
- previews: {},
- visible: false
+ img: userStore.avatar,
+ autoCrop: true,
+ autoCropWidth: 200,
+ autoCropHeight: 200,
+ fixedBox: true,
+ outputType: "png",
+ fileName: "",
+ previews: {},
+ visible: false
});
/** 缂栬緫澶村儚 */
const editCropper = () => {
- open.value = true;
-}
+ open.value = true;
+};
/** 鎵撳紑寮瑰嚭灞傜粨鏉熸椂鐨勫洖璋� */
const modalOpened = () => {
- visible.value = true;
-}
+ visible.value = true;
+};
/** 瑕嗙洊榛樿涓婁紶琛屼负 */
-const requestUpload = (): any => {}
+const requestUpload = (): any => {
+};
/** 鍚戝乏鏃嬭浆 */
const rotateLeft = () => {
- cropper.value.rotateLeft();
-}
+ cropper.value.rotateLeft();
+};
/** 鍚戝彸鏃嬭浆 */
const rotateRight = () => {
- cropper.value.rotateRight();
-}
+ cropper.value.rotateRight();
+};
/** 鍥剧墖缂╂斁 */
const changeScale = (num: number) => {
- num = num || 1;
- cropper.value.changeScale(num);
-}
+ num = num || 1;
+ cropper.value.changeScale(num);
+};
/** 涓婁紶棰勫鐞� */
const beforeUpload = (file: any) => {
- if (file.type.indexOf("image/") == -1) {
- proxy?.$modal.msgError("鏂囦欢鏍煎紡閿欒锛岃涓婁紶鍥剧墖绫诲瀷,濡傦細JPG锛孭NG鍚庣紑鐨勬枃浠躲��");
- } else {
- const reader = new FileReader();
- reader.readAsDataURL(file);
- reader.onload = () => {
- options.img = reader.result;
- options.fileName = file.name;
- };
- }
-}
+ if (file.type.indexOf("image/") == -1) {
+ proxy?.$modal.msgError("鏂囦欢鏍煎紡閿欒锛岃涓婁紶鍥剧墖绫诲瀷,濡傦細JPG锛孭NG鍚庣紑鐨勬枃浠躲��");
+ } else {
+ const reader = new FileReader();
+ reader.readAsDataURL(file);
+ reader.onload = () => {
+ options.img = reader.result;
+ options.fileName = file.name;
+ };
+ }
+};
/** 涓婁紶鍥剧墖 */
const uploadImg = async () => {
- cropper.value.getCropBlob(async (data: any) => {
- let formData = new FormData();
- formData.append("avatarfile", data, options.fileName);
- const res = await uploadAvatar(formData);
- open.value = false;
- options.img = res.data.imgUrl;
- userStore.avatar = options.img as string;
- proxy?.$modal.msgSuccess("淇敼鎴愬姛");
- visible.value = false;
- });
-}
+ cropper.value.getCropBlob(async (data: any) => {
+ let formData = new FormData();
+ formData.append("avatarfile", data, options.fileName);
+ const res = await uploadAvatar(formData);
+ open.value = false;
+ options.img = res.data.imgUrl;
+ userStore.avatar = options.img as string
+ proxy?.$modal.msgSuccess("淇敼鎴愬姛");
+ visible.value = false;
+ });
+};
/** 瀹炴椂棰勮 */
const realTime = (data: any) => {
- options.previews = data;
-}
+ options.previews = data;
+};
/** 鍏抽棴绐楀彛 */
const closeDialog = () => {
- options.img = userStore.avatar;
- options.visible = false;
-}
+ options.img = userStore.avatar;
+ options.visible = false;
+};
</script>
<style lang="scss" scoped>
diff --git a/src/views/system/user/profile/userInfo.vue b/src/views/system/user/profile/userInfo.vue
index 0c3d6ef..3dd5ff7 100644
--- a/src/views/system/user/profile/userInfo.vue
+++ b/src/views/system/user/profile/userInfo.vue
@@ -24,40 +24,42 @@
<script setup lang="ts">
import { updateUserProfile } from "@/api/system/user";
-import { FormRules } from "element-plus";
-import { ComponentInternalInstance } from "vue";
-import { PropType } from "vue";
-import { ElForm } from "element-plus";
const props = defineProps({
- user: {
- type: Object as PropType<any>,
- }
+ user: {
+ type: Object as PropType<any>,
+ required: true
+ }
});
const userForm = computed(() => props.user);
-
const { proxy } = getCurrentInstance() as ComponentInternalInstance;
-
-const userRef = ref(ElForm);
-
-const rules = ref<FormRules>({
- nickName: [{ required: true, message: "鐢ㄦ埛鏄电О涓嶈兘涓虹┖", trigger: "blur" }],
- email: [{ required: true, message: "閭鍦板潃涓嶈兘涓虹┖", trigger: "blur" }, { type: "email", message: "璇疯緭鍏ユ纭殑閭鍦板潃", trigger: ["blur", "change"] }],
- phonenumber: [{ required: true, message: "鎵嬫満鍙风爜涓嶈兘涓虹┖", trigger: "blur" }, { pattern: /^1[3|4|5|6|7|8|9][0-9]\d{8}$/, message: "璇疯緭鍏ユ纭殑鎵嬫満鍙风爜", trigger: "blur" }],
+const userRef = ref<ElFormInstance>();
+const rules = ref<ElFormRules>({
+ nickName: [{ required: true, message: "鐢ㄦ埛鏄电О涓嶈兘涓虹┖", trigger: "blur" }],
+ email: [{ required: true, message: "閭鍦板潃涓嶈兘涓虹┖", trigger: "blur" }, {
+ type: "email",
+ message: "璇疯緭鍏ユ纭殑閭鍦板潃",
+ trigger: ["blur", "change"]
+ }],
+ phonenumber: [{
+ required: true,
+ message: "鎵嬫満鍙风爜涓嶈兘涓虹┖",
+ trigger: "blur"
+ }, { pattern: /^1[3|4|5|6|7|8|9][0-9]\d{8}$/, message: "璇疯緭鍏ユ纭殑鎵嬫満鍙风爜", trigger: "blur" }]
});
/** 鎻愪氦鎸夐挳 */
const submit = () => {
- userRef.value.validate(async (valid: boolean) => {
- if (valid) {
- await updateUserProfile(props.user)
- proxy?.$modal.msgSuccess("淇敼鎴愬姛");
- }
- });
+ userRef.value?.validate(async (valid: boolean) => {
+ if (valid) {
+ await updateUserProfile(props.user);
+ proxy?.$modal.msgSuccess("淇敼鎴愬姛");
+ }
+ });
};
/** 鍏抽棴鎸夐挳 */
const close = () => {
- proxy?.$tab.closePage();
+ proxy?.$tab.closePage();
};
</script>
diff --git a/src/views/tool/gen/basicInfoForm.vue b/src/views/tool/gen/basicInfoForm.vue
index 5d8e781..c77d0c9 100644
--- a/src/views/tool/gen/basicInfoForm.vue
+++ b/src/views/tool/gen/basicInfoForm.vue
@@ -31,24 +31,19 @@
</template>
<script setup lang="ts">
-import { PropType } from 'vue';
+import { propTypes } from "@/utils/propTypes";
const prop = defineProps({
- info: {
- type: Object as PropType<any>,
- default: () => {
- return {};
- }
- }
+ info: propTypes.any.def({})
});
const infoForm = computed(() => prop.info)
// 琛ㄥ崟鏍￠獙
const rules = ref({
- tableName: [{ required: true, message: "璇疯緭鍏ヨ〃鍚嶇О", trigger: "blur" }],
- tableComment: [{ required: true, message: "璇疯緭鍏ヨ〃鎻忚堪", trigger: "blur" }],
- className: [{ required: true, message: "璇疯緭鍏ュ疄浣撶被鍚嶇О", trigger: "blur" }],
- functionAuthor: [{ required: true, message: "璇疯緭鍏ヤ綔鑰�", trigger: "blur" }]
+ tableName: [{ required: true, message: "璇疯緭鍏ヨ〃鍚嶇О", trigger: "blur" }],
+ tableComment: [{ required: true, message: "璇疯緭鍏ヨ〃鎻忚堪", trigger: "blur" }],
+ className: [{ required: true, message: "璇疯緭鍏ュ疄浣撶被鍚嶇О", trigger: "blur" }],
+ functionAuthor: [{ required: true, message: "璇疯緭鍏ヤ綔鑰�", trigger: "blur" }]
});
</script>
diff --git a/src/views/tool/gen/editTable.vue b/src/views/tool/gen/editTable.vue
index 15e6edd..fdd1eeb 100644
--- a/src/views/tool/gen/editTable.vue
+++ b/src/views/tool/gen/editTable.vue
@@ -117,9 +117,8 @@
import { DbColumnVO, DbTableVO } from '@/api/tool/gen/types';
import { optionselect as getDictOptionselect } from '@/api/system/dict/type';
import { DictTypeVO } from '@/api/system/dict/type/types';
-import basicInfoForm from './basicInfoForm.vue';
-import genInfoForm from "./genInfoForm.vue";
-import { ComponentInternalInstance } from "vue";
+import BasicInfoForm from './basicInfoForm.vue';
+import GenInfoForm from "./genInfoForm.vue";
const route = useRoute();
const { proxy } = getCurrentInstance() as ComponentInternalInstance;
@@ -131,13 +130,13 @@
const dictOptions = ref<DictTypeVO[]>([]);
const info = ref<Partial<DbTableVO>>({});
-const basicInfo = ref(basicInfoForm);
-const genInfo = ref(genInfoForm);
+const basicInfo = ref<InstanceType<typeof BasicInfoForm>>();
+const genInfo = ref<InstanceType<typeof GenInfoForm>>();
/** 鎻愪氦鎸夐挳 */
const submitForm = () => {
- const basicForm = basicInfo.value.$refs.basicInfoForm;
- const genForm = genInfo.value.$refs.genInfoForm;
+ const basicForm = basicInfo.value?.$refs.basicInfoForm;
+ const genForm = genInfo.value?.$refs.genInfoForm;
Promise.all([basicForm, genForm].map(getFormPromise)).then(async res => {
const validateResult = res.every(item => !!item);
@@ -168,7 +167,7 @@
});
}
const close = () => {
- const obj = {path: "/tool/gen", query: {t: Date.now(), pageNum: route.query.pageNum}};
+ const obj = { path: "/tool/gen", query: { t: Date.now(), pageNum: route.query.pageNum } };
proxy?.$tab.closeOpenPage(obj);
}
diff --git a/src/views/tool/gen/genInfoForm.vue b/src/views/tool/gen/genInfoForm.vue
index ab6e714..94486e2 100644
--- a/src/views/tool/gen/genInfoForm.vue
+++ b/src/views/tool/gen/genInfoForm.vue
@@ -223,7 +223,7 @@
<script setup lang="ts">
import { listMenu } from '@/api/system/menu';
-import { ComponentInternalInstance, PropType } from 'vue';
+import { propTypes } from "@/utils/propTypes";
interface MenuOptionsType {
menuId: number | string;
@@ -236,14 +236,8 @@
const { proxy } = getCurrentInstance() as ComponentInternalInstance;
const props = defineProps({
- info: {
- type: Object as PropType<any>,
- default: null
- },
- tables: {
- type: Array as PropType<any[]>,
- default: null
- }
+ info: propTypes.any.def(null),
+ tables: propTypes.any.def(null)
});
const infoForm = computed(() => props.info);
@@ -252,11 +246,11 @@
// 琛ㄥ崟鏍￠獙
const rules = ref({
- tplCategory: [{required: true, message: "璇烽�夋嫨鐢熸垚妯℃澘", trigger: "blur"}],
- packageName: [{required: true, message: "璇疯緭鍏ョ敓鎴愬寘璺緞", trigger: "blur"}],
- moduleName: [{required: true, message: "璇疯緭鍏ョ敓鎴愭ā鍧楀悕", trigger: "blur"}],
- businessName: [{required: true, message: "璇疯緭鍏ョ敓鎴愪笟鍔″悕", trigger: "blur"}],
- functionName: [{required: true, message: "璇疯緭鍏ョ敓鎴愬姛鑳藉悕", trigger: "blur"}]
+ tplCategory: [{ required: true, message: "璇烽�夋嫨鐢熸垚妯℃澘", trigger: "blur" }],
+ packageName: [{ required: true, message: "璇疯緭鍏ョ敓鎴愬寘璺緞", trigger: "blur" }],
+ moduleName: [{ required: true, message: "璇疯緭鍏ョ敓鎴愭ā鍧楀悕", trigger: "blur" }],
+ businessName: [{ required: true, message: "璇疯緭鍏ョ敓鎴愪笟鍔″悕", trigger: "blur" }],
+ functionName: [{ required: true, message: "璇疯緭鍏ョ敓鎴愬姛鑳藉悕", trigger: "blur" }]
});
const subSelectChange = () => {
infoForm.value.subTableFkName = "";
@@ -268,7 +262,7 @@
}
}
const setSubTableColumns = (value: string) => {
- table.value.forEach(item => {
+ table.value.forEach((item: any) => {
const name = item.tableName;
if (value === name) {
subColumns.value = item.columns;
diff --git a/src/views/tool/gen/importTable.vue b/src/views/tool/gen/importTable.vue
index eada1dc..91e88fc 100644
--- a/src/views/tool/gen/importTable.vue
+++ b/src/views/tool/gen/importTable.vue
@@ -3,11 +3,11 @@
<el-dialog title="瀵煎叆琛�" v-model="visible" width="1100px" top="5vh" append-to-body>
<el-form :model="queryParams" ref="queryFormRef" :inline="true">
<el-form-item label="鏁版嵁婧�" prop="dataName">
- <el-select v-model="queryParams.dataName" filterable placeholder="璇烽�夋嫨/杈撳叆鏁版嵁婧愬悕绉�" style="width: 200px">
- <el-option v-for="item in dataNameList" :key="item" :label="item" :value="item"> </el-option>
- </el-select>
- </el-form-item>
- <el-form-item label="琛ㄥ悕绉�" prop="tableName">
+ <el-select v-model="queryParams.dataName" filterable placeholder="璇烽�夋嫨/杈撳叆鏁版嵁婧愬悕绉�" style="width: 200px">
+ <el-option v-for="item in dataNameList" :key="item" :label="item" :value="item"> </el-option>
+ </el-select>
+ </el-form-item>
+ <el-form-item label="琛ㄥ悕绉�" prop="tableName">
<el-input v-model="queryParams.tableName" placeholder="璇疯緭鍏ヨ〃鍚嶇О" clearable @keyup.enter="handleQuery" />
</el-form-item>
<el-form-item label="琛ㄦ弿杩�" prop="tableComment">
@@ -26,7 +26,7 @@
<el-table-column prop="createTime" label="鍒涘缓鏃堕棿"></el-table-column>
<el-table-column prop="updateTime" label="鏇存柊鏃堕棿"></el-table-column>
</el-table>
- <pagination v-show="total>0" :total="total" v-model:page="queryParams.pageNum" v-model:limit="queryParams.pageSize" @pagination="getList" />
+ <pagination v-show="total > 0" :total="total" v-model:page="queryParams.pageNum" v-model:limit="queryParams.pageSize" @pagination="getList" />
</el-row>
<template #footer>
<div class="dialog-footer">
@@ -40,8 +40,6 @@
<script setup lang="ts">
import { listDbTable, importTable, getDataNames } from '@/api/tool/gen';
import { DbTableQuery, DbTableVO } from '@/api/tool/gen/types';
-import { ComponentInternalInstance } from 'vue';
-import { ElTable, ElForm } from 'element-plus';
const total = ref(0);
const visible = ref(false);
@@ -49,15 +47,15 @@
const dbTableList = ref<Array<DbTableVO>>([]);
const { proxy } = getCurrentInstance() as ComponentInternalInstance;
-const tableRef = ref(ElTable);
-const queryFormRef = ref(ElForm);
+const tableRef = ref<ElTableInstance>();
+const queryFormRef = ref<ElFormInstance>();
const queryParams = reactive<DbTableQuery>({
- pageNum: 1,
- pageSize: 10,
- dataName: '',
- tableName: '',
- tableComment: ''
+ pageNum: 1,
+ pageSize: 10,
+ dataName: '',
+ tableName: '',
+ tableComment: ''
});
const dataNameList = ref<Array<string>>([]);
@@ -65,52 +63,53 @@
/** 鏌ヨ鍙傛暟鍒楄〃 */
const show = (dataName: string) => {
- getDataNameList();
- if(dataName){
- queryParams.dataName = dataName;
- } else {
- queryParams.dataName = 'master';
- }
- getList();
- visible.value = true;
+ getDataNameList();
+ if (dataName) {
+ queryParams.dataName = dataName;
+ } else {
+ queryParams.dataName = 'master';
+ }
+ getList();
+ visible.value = true;
}
/** 鍗曞嚮閫夋嫨琛� */
const clickRow = (row: DbTableVO) => {
- tableRef.value.toggleRowSelection(row);
+ // ele bug
+ tableRef.value?.toggleRowSelection(row);
}
/** 澶氶�夋閫変腑鏁版嵁 */
const handleSelectionChange = (selection: DbTableVO[]) => {
- tables.value = selection.map(item => item.tableName);
+ tables.value = selection.map(item => item.tableName);
}
/** 鏌ヨ琛ㄦ暟鎹� */
const getList = async () => {
- const res = await listDbTable(queryParams);
- dbTableList.value = res.rows;
- total.value = res.total;
+ const res = await listDbTable(queryParams);
+ dbTableList.value = res.rows;
+ total.value = res.total;
}
/** 鎼滅储鎸夐挳鎿嶄綔 */
const handleQuery = () => {
- queryParams.pageNum = 1;
- getList();
+ queryParams.pageNum = 1;
+ getList();
}
/** 閲嶇疆鎸夐挳鎿嶄綔 */
const resetQuery = () => {
- queryFormRef.value.resetFields();
- handleQuery();
+ queryFormRef.value?.resetFields();
+ handleQuery();
}
/** 瀵煎叆鎸夐挳鎿嶄綔 */
const handleImportTable = async () => {
- const tableNames = tables.value.join(",");
- if (tableNames == "") {
- proxy?.$modal.msgError("璇烽�夋嫨瑕佸鍏ョ殑琛�");
- return;
- }
- const res = await importTable({ tables: tableNames, dataName: queryParams.dataName });
- proxy?.$modal.msgSuccess(res.msg);
- if (res.code === 200) {
- visible.value = false;
- emit("ok");
- }
+ const tableNames = tables.value.join(",");
+ if (tableNames == "") {
+ proxy?.$modal.msgError("璇烽�夋嫨瑕佸鍏ョ殑琛�");
+ return;
+ }
+ const res = await importTable({ tables: tableNames, dataName: queryParams.dataName });
+ proxy?.$modal.msgSuccess(res.msg);
+ if (res.code === 200) {
+ visible.value = false;
+ emit("ok");
+ }
}
/** 鏌ヨ澶氭暟鎹簮鍚嶇О */
const getDataNameList = async () => {
@@ -119,6 +118,6 @@
}
defineExpose({
- show,
+ show,
});
</script>
diff --git a/src/views/tool/gen/index.vue b/src/views/tool/gen/index.vue
index 5775e6a..66300bd 100644
--- a/src/views/tool/gen/index.vue
+++ b/src/views/tool/gen/index.vue
@@ -1,39 +1,41 @@
<template>
<div class="p-2">
<transition :enter-active-class="proxy?.animate.searchAnimate.enter" :leave-active-class="proxy?.animate.searchAnimate.leave">
- <div class="search" v-show="showSearch">
- <el-form :model="queryParams" ref="queryFormRef" :inline="true" label-width="68px">
- <el-form-item label="鏁版嵁婧�" prop="dataName">
- <el-select v-model="queryParams.dataName" filterable clearable placeholder="璇烽�夋嫨/杈撳叆鏁版嵁婧愬悕绉�" style="width: 200px">
- <el-option key="" label="鍏ㄩ儴" value="" />
- <el-option v-for="item in dataNameList" :key="item" :label="item" :value="item"> </el-option>
- </el-select>
- </el-form-item>
- <el-form-item label="琛ㄥ悕绉�" prop="tableName">
- <el-input v-model="queryParams.tableName" placeholder="璇疯緭鍏ヨ〃鍚嶇О" clearable style="width: 200px" @keyup.enter="handleQuery" />
- </el-form-item>
- <el-form-item label="琛ㄦ弿杩�" prop="tableComment">
- <el-input v-model="queryParams.tableComment" placeholder="璇疯緭鍏ヨ〃鎻忚堪" clearable style="width: 200px" @keyup.enter="handleQuery" />
- </el-form-item>
- <el-form-item label="鍒涘缓鏃堕棿" style="width: 308px">
- <el-date-picker
- v-model="dateRange"
- value-format="YYYY-MM-DD"
- type="daterange"
- range-separator="-"
- start-placeholder="寮�濮嬫棩鏈�"
- end-placeholder="缁撴潫鏃ユ湡"
- ></el-date-picker>
- </el-form-item>
- <el-form-item>
- <el-button type="primary" icon="Search" @click="handleQuery">鎼滅储</el-button>
- <el-button icon="Refresh" @click="resetQuery">閲嶇疆</el-button>
- </el-form-item>
- </el-form>
+ <div class="mb-[10px]" v-show="showSearch">
+ <el-card shadow="hover">
+ <el-form :model="queryParams" ref="queryFormRef" :inline="true" label-width="68px">
+ <el-form-item label="鏁版嵁婧�" prop="dataName">
+ <el-select v-model="queryParams.dataName" filterable clearable placeholder="璇烽�夋嫨/杈撳叆鏁版嵁婧愬悕绉�" style="width: 200px">
+ <el-option key="" label="鍏ㄩ儴" value="" />
+ <el-option v-for="item in dataNameList" :key="item" :label="item" :value="item"> </el-option>
+ </el-select>
+ </el-form-item>
+ <el-form-item label="琛ㄥ悕绉�" prop="tableName">
+ <el-input v-model="queryParams.tableName" placeholder="璇疯緭鍏ヨ〃鍚嶇О" clearable style="width: 200px" @keyup.enter="handleQuery" />
+ </el-form-item>
+ <el-form-item label="琛ㄦ弿杩�" prop="tableComment">
+ <el-input v-model="queryParams.tableComment" placeholder="璇疯緭鍏ヨ〃鎻忚堪" clearable style="width: 200px" @keyup.enter="handleQuery" />
+ </el-form-item>
+ <el-form-item label="鍒涘缓鏃堕棿" style="width: 308px">
+ <el-date-picker
+ v-model="dateRange"
+ value-format="YYYY-MM-DD"
+ type="daterange"
+ range-separator="-"
+ start-placeholder="寮�濮嬫棩鏈�"
+ end-placeholder="缁撴潫鏃ユ湡"
+ ></el-date-picker>
+ </el-form-item>
+ <el-form-item>
+ <el-button type="primary" icon="Search" @click="handleQuery">鎼滅储</el-button>
+ <el-button icon="Refresh" @click="resetQuery">閲嶇疆</el-button>
+ </el-form-item>
+ </el-form>
+ </el-card>
</div>
</transition>
- <el-card shadow="never">
+ <el-card shadow="hover">
<template #header>
<el-row :gutter="10" class="mb8">
<el-col :span="1.5">
@@ -99,9 +101,9 @@
:name="(key as any).substring((key as any).lastIndexOf('/') + 1, (key as any).indexOf('.vm'))"
:key="value"
>
- <el-link :underline="false" icon="DocumentCopy" v-copyText="value" v-copyText:callback="copyTextSuccess" style="float:right"
- > 澶嶅埗</el-link
- >
+ <el-link :underline="false" icon="DocumentCopy" v-copyText="value" v-copyText:callback="copyTextSuccess" style="float:right">
+ 澶嶅埗
+ </el-link>
<pre>{{ value }}</pre>
</el-tab-pane>
</el-tabs>
@@ -114,9 +116,7 @@
import { listTable, previewTable, delTable, genCode, synchDb, getDataNames } from '@/api/tool/gen';
import { TableQuery, TableVO } from '@/api/tool/gen/types';
import router from '@/router';
-import importTable from './importTable.vue';
-import { ComponentInternalInstance } from 'vue';
-import { ElForm, DateModelType } from 'element-plus';
+import ImportTable from './importTable.vue';
const route = useRoute();
const { proxy } = getCurrentInstance() as ComponentInternalInstance;
@@ -132,35 +132,35 @@
const uniqueId = ref("");
const dataNameList = ref<Array<string>>([]);
-const queryFormRef = ref(ElForm);
-const importRef = ref(importTable);
+const queryFormRef = ref<ElFormInstance>();
+const importRef = ref<InstanceType<typeof ImportTable>>();
const queryParams = ref<TableQuery>({
- pageNum: 1,
- pageSize: 10,
- tableName: '',
- tableComment: '',
- dataName: ""
+ pageNum: 1,
+ pageSize: 10,
+ tableName: '',
+ tableComment: '',
+ dataName: ""
})
-const preview = ref <any>({
- data: {},
- activeName: 'domain.java'
+const preview = ref<any>({
+ data: {},
+ activeName: 'domain.java'
})
const dialog = reactive<DialogOption>({
- visible: false,
- title: '浠ｇ爜棰勮'
+ visible: false,
+ title: '浠ｇ爜棰勮'
});
onActivated(() => {
- const time = route.query.t;
- if (time != null && time != uniqueId.value) {
- uniqueId.value = time as string;
- queryParams.value.pageNum = Number(route.query.pageNum);
- dateRange.value = ['', ''];
- queryFormRef.value.resetFields();
- getList();
- }
+ const time = route.query.t;
+ if (time != null && time != uniqueId.value) {
+ uniqueId.value = time as string;
+ queryParams.value.pageNum = Number(route.query.pageNum);
+ dateRange.value = ['', ''];
+ queryFormRef.value?.resetFields();
+ getList();
+ }
})
/** 鏌ヨ澶氭暟鎹簮鍚嶇О */
@@ -171,81 +171,81 @@
/** 鏌ヨ琛ㄩ泦鍚� */
const getList = async () => {
- loading.value = true;
- const res = await listTable(proxy?.addDateRange(queryParams.value, dateRange.value));
- tableList.value = res.rows;
- total.value = res.total;
- loading.value = false;
+ loading.value = true;
+ const res = await listTable(proxy?.addDateRange(queryParams.value, dateRange.value));
+ tableList.value = res.rows;
+ total.value = res.total;
+ loading.value = false;
}
/** 鎼滅储鎸夐挳鎿嶄綔 */
const handleQuery = () => {
- queryParams.value.pageNum = 1;
- getList();
+ queryParams.value.pageNum = 1;
+ getList();
}
/** 鐢熸垚浠ｇ爜鎿嶄綔 */
const handleGenTable = async (row?: TableVO) => {
- const tbIds = row?.tableId || ids.value;
- if (tbIds == "") {
- proxy?.$modal.msgError('璇烽�夋嫨瑕佺敓鎴愮殑鏁版嵁');
- return;
- }
- if (row?.genType === "1") {
- await genCode(row.tableId);
- proxy?.$modal.msgSuccess('鎴愬姛鐢熸垚鍒拌嚜瀹氫箟璺緞锛�' + row.genPath);
- } else {
- proxy?.$download.zip('/tool/gen/batchGenCode?tableIdStr=' + tbIds, 'ruoyi.zip');
- }
+ const tbIds = row?.tableId || ids.value;
+ if (tbIds == "") {
+ proxy?.$modal.msgError('璇烽�夋嫨瑕佺敓鎴愮殑鏁版嵁');
+ return;
+ }
+ if (row?.genType === "1") {
+ await genCode(row.tableId);
+ proxy?.$modal.msgSuccess('鎴愬姛鐢熸垚鍒拌嚜瀹氫箟璺緞锛�' + row.genPath);
+ } else {
+ proxy?.$download.zip('/tool/gen/batchGenCode?tableIdStr=' + tbIds, 'ruoyi.zip');
+ }
}
/** 鍚屾鏁版嵁搴撴搷浣� */
const handleSynchDb = async (row: TableVO) => {
- const tableId = row.tableId;
- await proxy?.$modal.confirm('纭瑕佸己鍒跺悓姝�"' + row.tableName + '"琛ㄧ粨鏋勫悧锛�');
- await synchDb(tableId);
- proxy?.$modal.msgSuccess('鍚屾鎴愬姛');
+ const tableId = row.tableId;
+ await proxy?.$modal.confirm('纭瑕佸己鍒跺悓姝�"' + row.tableName + '"琛ㄧ粨鏋勫悧锛�');
+ await synchDb(tableId);
+ proxy?.$modal.msgSuccess('鍚屾鎴愬姛');
}
/** 鎵撳紑瀵煎叆琛ㄥ脊绐� */
const openImportTable = () => {
- importRef.value.show(queryParams.value.dataName);
+ importRef.value?.show(queryParams.value.dataName);
}
/** 閲嶇疆鎸夐挳鎿嶄綔 */
const resetQuery = () => {
- dateRange.value = ['', ''];
- queryFormRef.value.resetFields();
- handleQuery();
+ dateRange.value = ['', ''];
+ queryFormRef.value?.resetFields();
+ handleQuery();
}
/** 棰勮鎸夐挳 */
const handlePreview = async (row: TableVO) => {
- const res = await previewTable(row.tableId);
- preview.value.data = res.data;
- dialog.visible = true;
- preview.value.activeName = 'domain.java';
+ const res = await previewTable(row.tableId);
+ preview.value.data = res.data;
+ dialog.visible = true;
+ preview.value.activeName = 'domain.java';
}
/** 澶嶅埗浠ｇ爜鎴愬姛 */
const copyTextSuccess = () => {
- proxy?.$modal.msgSuccess('澶嶅埗鎴愬姛');
+ proxy?.$modal.msgSuccess('澶嶅埗鎴愬姛');
}
// 澶氶�夋閫変腑鏁版嵁
const handleSelectionChange = (selection: TableVO[]) => {
- ids.value = selection.map(item => item.tableId);
- single.value = selection.length != 1;
- multiple.value = !selection.length;
+ ids.value = selection.map(item => item.tableId);
+ single.value = selection.length != 1;
+ multiple.value = !selection.length;
}
/** 淇敼鎸夐挳鎿嶄綔 */
const handleEditTable = (row?: TableVO) => {
- const tableId = row?.tableId || ids.value[0];
- router.push({ path: '/tool/gen-edit/index/' + tableId, query: { pageNum: queryParams.value.pageNum } });
+ const tableId = row?.tableId || ids.value[0];
+ router.push({ path: '/tool/gen-edit/index/' + tableId, query: { pageNum: queryParams.value.pageNum } });
}
/** 鍒犻櫎鎸夐挳鎿嶄綔 */
const handleDelete = async (row?: TableVO) => {
- const tableIds = row?.tableId || ids.value;
- await proxy?.$modal.confirm('鏄惁纭鍒犻櫎琛ㄧ紪鍙蜂负"' + tableIds + '"鐨勬暟鎹」锛�');
- await delTable(tableIds);
- getList();
- proxy?.$modal.msgSuccess('鍒犻櫎鎴愬姛');
+ const tableIds = row?.tableId || ids.value;
+ await proxy?.$modal.confirm('鏄惁纭鍒犻櫎琛ㄧ紪鍙蜂负"' + tableIds + '"鐨勬暟鎹」锛�');
+ await delTable(tableIds);
+ getList();
+ proxy?.$modal.msgSuccess('鍒犻櫎鎴愬姛');
}
onMounted(() => {
- getList();
- getDataNameList();
+ getList();
+ getDataNameList();
})
</script>
--
Gitblit v1.9.3