hxd/zky_mandate
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix 更新相关依赖版本，后台管理页面及代码生成页面改为setup语法糖

Browse Source
This commit is contained in:
yxh 2024-07-22 09:32:42 +08:00
parent b071104e17
commit 66b84ec199
73 changed files with 7093 additions and 7912 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

0
.eslintrc.js → .eslintrc.cjs
View File

1997
package-lock.json generated
View File

File diff suppressed because it is too large Load Diff

59
package.json
View File

@ -4,66 +4,67 @@
"description": "vue3 vite next admin template",
"author": "lyt_20201208",
"license": "MIT",
"type": "module",
"scripts": {
"dev": "vite --force",
"dev": "vite",
"build": "vite build",
"lint-fix": "eslint --fix --ext .js --ext .jsx --ext .vue src/"
},
"dependencies": {
"@codemirror/lang-javascript": "^6.1.1",
"@codemirror/theme-one-dark": "^6.1.0",
"@element-plus/icons-vue": "^2.1.0",
"axios": "^1.3.5",
"@element-plus/icons-vue": "^2.3.1",
"axios": "^1.6.8",
"codemirror": "^6.0.1",
"countup.js": "^2.6.0",
"cropperjs": "^1.5.13",
"echarts": "^5.4.2",
"countup.js": "^2.8.0",
"cropperjs": "^1.6.0",
"echarts": "^5.5.0",
"echarts-gl": "^2.0.9",
"echarts-wordcloud": "^2.1.0",
"element-plus": "^2.6.3",
"js-cookie": "^3.0.1",
"js-cookie": "^3.0.5",
"jsplumb": "^2.15.6",
"lodash": "^4.17.21",
"mitt": "^3.0.0",
"mitt": "^3.0.1",
"nprogress": "^0.2.0",
"pinia": "^2.0.34",
"pinia": "^2.1.7",
"print-js": "^1.6.0",
"qrcodejs2-fixes": "^0.0.2",
"qs": "^6.11.1",
"qs": "^6.12.0",
"screenfull": "^6.0.2",
"sortablejs": "^1.15.0",
"sortablejs": "^1.15.2",
"spark-md5": "^3.0.2",
"splitpanes": "^3.1.5",
"vue": "^3.2.47",
"vue": "^3.4.21",
"vue-clipboard3": "^2.0.0",
"vue-codemirror": "^6.1.1",
"vue-demi": "^0.13.11",
"vue-demi": "^0.14.7",
"vue-grid-layout": "^3.0.0-beta1",
"vue-i18n": "^9.2.2",
"vue-router": "^4.1.6",
"vue-i18n": "^9.10.2",
"vue-router": "^4.3.0",
"vue-simple-uploader": "^1.0.0-beta.5",
"vue-ueditor-wrap": "^3.0.8"
},
"devDependencies": {
"@types/node": "^18.15.11",
"@types/nprogress": "^0.2.0",
"@types/sortablejs": "^1.15.1",
"@typescript-eslint/eslint-plugin": "^5.58.0",
"@typescript-eslint/parser": "^5.58.0",
"@vitejs/plugin-vue": "^4.1.0",
"@vue/compiler-sfc": "^3.2.47",
"@types/node": "^20.11.28",
"@types/nprogress": "^0.2.3",
"@types/sortablejs": "^1.15.8",
"@typescript-eslint/eslint-plugin": "^7.2.0",
"@typescript-eslint/parser": "^7.2.0",
"@vitejs/plugin-vue": "^5.0.4",
"@vue/compiler-sfc": "^3.4.21",
"dotenv": "^16.0.1",
"eslint": "^8.38.0",
"eslint-plugin-vue": "^9.10.0",
"prettier": "^2.8.7",
"sass": "^1.61.0",
"eslint": "^8.57.0",
"eslint-plugin-vue": "^9.23.0",
"prettier": "^3.2.5",
"sass": "^1.72.0",
"sass-loader": "^13.0.2",
"typescript": "^5.0.4",
"vite": "^4.2.1",
"typescript": "^5.4.2",
"vite": "^5.1.6",
"vite-plugin-cdn-import": "^0.3.5",
"vite-plugin-compression": "^0.5.1",
"vite-plugin-vue-setup-extend-plus": "^0.1.0",
"vue-eslint-parser": "^9.1.1"
"vue-eslint-parser": "^9.4.1"
},
"browserslist": [
"> 1%",

93
src/layout/component/aside.vue
View File

@ -9,7 +9,7 @@
</div>
</template>
<script lang="ts">
<script setup lang="ts">
import { toRefs, reactive, computed, watch, getCurrentInstance, onBeforeMount, defineComponent } from 'vue';
import { storeToRefs } from 'pinia';
import pinia from '/@/stores/index';
@ -18,24 +18,22 @@ import { useThemeConfig } from '/@/stores/themeConfig';
import { useTagsViewRoutes } from '/@/stores/tagsViewRoutes';
import Logo from '/@/layout/logo/index.vue';
import Vertical from '/@/layout/navMenu/vertical.vue';
defineOptions({ name: "layoutAside"})
export default defineComponent({
name: 'layoutAside',
components: { Logo, Vertical },
setup() {
const { proxy } = <any>getCurrentInstance();
const stores = useRoutesList();
const storesThemeConfig = useThemeConfig();
const storesTagsViewRoutes = useTagsViewRoutes();
const { routesList } = storeToRefs(stores);
const { themeConfig } = storeToRefs(storesThemeConfig);
const { isTagsViewCurrenFull } = storeToRefs(storesTagsViewRoutes);
const state = reactive({
const { proxy } = <any>getCurrentInstance();
const stores = useRoutesList();
const storesThemeConfig = useThemeConfig();
const storesTagsViewRoutes = useTagsViewRoutes();
const { routesList } = storeToRefs(stores);
const { themeConfig } = storeToRefs(storesThemeConfig);
const { isTagsViewCurrenFull } = storeToRefs(storesTagsViewRoutes);
const state = reactive({
menuList: [],
clientWidth: 0,
});
// 设置菜单展开/收起时的宽度
const setCollapseStyle = computed(() => {
});
const { menuList } = toRefs(state);
// 设置菜单展开/收起时的宽度
const setCollapseStyle = computed(() => {
const { layout, isCollapse, menuBar } = themeConfig.value;
const asideBrTheme = ['#FFFFFF', '#FFF', '#fff', '#ffffff'];
const asideBrColor = asideBrTheme.includes(menuBar) ? 'layout-el-aside-br-color' : '';
@ -65,9 +63,9 @@ export default defineComponent({
else return [asideBrColor, 'layout-aside-pc-220'];
}
}
});
// 关闭移动端蒙版
const closeLayoutAsideMobileMode = () => {
});
// 关闭移动端蒙版
const closeLayoutAsideMobileMode = () => {
const el = document.querySelector('.layout-aside-mobile-mode');
el?.setAttribute('style', 'animation: error-img-two 0.3s');
setTimeout(() => {
@ -76,19 +74,19 @@ export default defineComponent({
const clientWidth = document.body.clientWidth;
if (clientWidth < 1000) themeConfig.value.isCollapse = false;
document.body.setAttribute('class', '');
};
// 设置显示/隐藏 logo
const setShowLogo = computed(() => {
};
// 设置显示/隐藏 logo
const setShowLogo = computed(() => {
let { layout, isShowLogo } = themeConfig.value;
return (isShowLogo && layout === 'defaults') || (isShowLogo && layout === 'columns');
});
// 设置/过滤路由（非静态路由/是否显示在菜单中）
const setFilterRoutes = () => {
});
// 设置/过滤路由（非静态路由/是否显示在菜单中）
const setFilterRoutes = () => {
if (themeConfig.value.layout === 'columns') return false;
(state.menuList as any) = filterRoutesFun(routesList.value);
};
// 路由过滤递归函数
const filterRoutesFun = (arr: Array<string>) => {
};
// 路由过滤递归函数
const filterRoutesFun = (arr: Array<string>) => {
return arr
.filter((item: any) => !item.meta.isHide)
.map((item: any) => {
@ -96,27 +94,27 @@ export default defineComponent({
if (item.children) item.children = filterRoutesFun(item.children);
return item;
});
};
// 设置菜单导航是否固定（移动端）
const initMenuFixed = (clientWidth: number) => {
};
// 设置菜单导航是否固定（移动端）
const initMenuFixed = (clientWidth: number) => {
state.clientWidth = clientWidth;
};
// 鼠标移入、移出
const onAsideEnterLeave = (bool: Boolean) => {
};
// 鼠标移入、移出
const onAsideEnterLeave = (bool: Boolean) => {
let { layout } = themeConfig.value;
if (layout !== 'columns') return false;
if (!bool) proxy.mittBus.emit('restoreDefault');
stores.setColumnsMenuHover(bool);
};
// 监听 themeConfig 配置文件的变化，更新菜单 el-scrollbar 的高度
watch(themeConfig.value, (val) => {
};
// 监听 themeConfig 配置文件的变化，更新菜单 el-scrollbar 的高度
watch(themeConfig.value, (val) => {
if (val.isShowLogoChange !== val.isShowLogo) {
if (!proxy.$refs.layoutAsideScrollbarRef) return false;
proxy.$refs.layoutAsideScrollbarRef.update();
}
});
// 监听vuex值的变化，动态赋值给菜单中
watch(
});
// 监听vuex值的变化，动态赋值给菜单中
watch(
pinia.state,
(val) => {
let { layout, isClassicSplitMenu } = val.themeConfig.themeConfig;
@ -126,9 +124,9 @@ export default defineComponent({
{
deep: true,
}
);
// 页面加载前
onBeforeMount(() => {
);
// 页面加载前
onBeforeMount(() => {
initMenuFixed(document.body.clientWidth);
setFilterRoutes();
// 此界面不需要取消监听(proxy.mittBus.off('setSendColumnsChildren))
@ -150,14 +148,5 @@ export default defineComponent({
initMenuFixed(res.clientWidth);
closeLayoutAsideMobileMode();
});
});
return {
setCollapseStyle,
setShowLogo,
isTagsViewCurrenFull,
onAsideEnterLeave,
...toRefs(state),
};
},
});
</script>

118
src/layout/component/columnsAside.vue
View File

@ -44,7 +44,7 @@
</div>
</template>
<script lang="ts">
<script setup lang="ts">
import { reactive, toRefs, ref, onMounted, nextTick, getCurrentInstance, watch, onUnmounted, defineComponent } from 'vue';
import { useRoute, useRouter, onBeforeRouteUpdate, RouteRecordRaw } from 'vue-router';
import { storeToRefs } from 'pinia';
@ -62,20 +62,17 @@ interface ColumnsAsideState {
difference: number;
routeSplit: string[];
}
export default defineComponent({
name: 'layoutColumnsAside',
setup() {
const columnsAsideOffsetTopRefs: any = ref([]);
const columnsAsideActiveRef = ref();
const { proxy } = <any>getCurrentInstance();
const stores = useRoutesList();
const storesThemeConfig = useThemeConfig();
const { routesList, isColumnsMenuHover, isColumnsNavHover } = storeToRefs(stores);
const { themeConfig } = storeToRefs(storesThemeConfig);
const route = useRoute();
const router = useRouter();
const state = reactive<ColumnsAsideState>({
defineOptions({ name: "layoutColumnsAside"})
const columnsAsideOffsetTopRefs: any = ref([]);
const columnsAsideActiveRef = ref();
const { proxy } = <any>getCurrentInstance();
const stores = useRoutesList();
const storesThemeConfig = useThemeConfig();
const { routesList, isColumnsMenuHover, isColumnsNavHover } = storeToRefs(stores);
const { themeConfig } = storeToRefs(storesThemeConfig);
const route = useRoute();
const router = useRouter();
const state = reactive<ColumnsAsideState>({
columnsAsideList: [],
liIndex: 0,
liOldIndex: null,
@ -83,21 +80,22 @@ export default defineComponent({
liOldPath: null,
difference: 0,
routeSplit: [],
});
// 设置菜单高亮位置移动
const setColumnsAsideMove = (k: number) => {
});
const { columnsAsideList, liIndex, liHoverIndex} = toRefs(state);
// 设置菜单高亮位置移动
const setColumnsAsideMove = (k: number) => {
state.liIndex = k;
columnsAsideActiveRef.value.style.top = `${columnsAsideOffsetTopRefs.value[k].offsetTop + state.difference}px`;
};
// 菜单高亮点击事件
const onColumnsAsideMenuClick = (v: Object, k: number) => {
};
// 菜单高亮点击事件
const onColumnsAsideMenuClick = (v: Object, k: number) => {
setColumnsAsideMove(k);
let { path, redirect } = v as any;
if (redirect) router.push(redirect);
else router.push(path);
};
// 鼠标移入时，显示当前的子级菜单
const onColumnsAsideMenuMouseenter = (v: RouteRecordRaw, k: number) => {
};
// 鼠标移入时，显示当前的子级菜单
const onColumnsAsideMenuMouseenter = (v: RouteRecordRaw, k: number) => {
if (!themeConfig.value.isColumnsMenuHoverPreload) return false;
let { path } = v;
state.liOldPath = path;
@ -106,31 +104,31 @@ export default defineComponent({
proxy.mittBus.emit('setSendColumnsChildren', setSendChildren(path));
stores.setColumnsMenuHover(false);
stores.setColumnsNavHover(true);
};
// 鼠标移走时，显示原来的子级菜单
const onColumnsAsideMenuMouseleave = async () => {
};
// 鼠标移走时，显示原来的子级菜单
const onColumnsAsideMenuMouseleave = async () => {
await stores.setColumnsNavHover(false);
// 添加延时器，防止拿到的 store.state.routesList 值不是最新的
setTimeout(() => {
if (!isColumnsMenuHover && !isColumnsNavHover) proxy.mittBus.emit('restoreDefault');
}, 100);
};
// 设置高亮动态位置
const onColumnsAsideDown = (k: number) => {
};
// 设置高亮动态位置
const onColumnsAsideDown = (k: number) => {
nextTick(() => {
setColumnsAsideMove(k);
});
};
// 设置/过滤路由（非静态路由/是否显示在菜单中）
const setFilterRoutes = () => {
};
// 设置/过滤路由（非静态路由/是否显示在菜单中）
const setFilterRoutes = () => {
state.columnsAsideList = filterRoutesFun(routesList.value);
const resData: any = setSendChildren(route.path);
if (Object.keys(resData).length <= 0) return false;
onColumnsAsideDown(resData.item[0].k);
proxy.mittBus.emit('setSendColumnsChildren', resData);
};
// 传送当前子级数据到菜单中
const setSendChildren = (path: string) => {
};
// 传送当前子级数据到菜单中
const setSendChildren = (path: string) => {
let currentData: any = {};
state.columnsAsideList.some((v:any,k:number)=>{
if(v.children){
@ -147,9 +145,9 @@ export default defineComponent({
return false
})
return currentData;
};
// 路由过滤递归函数
const filterRoutesFun = (arr: Array<string>) => {
};
// 路由过滤递归函数
const filterRoutesFun = (arr: Array<string>) => {
return arr
.filter((item: any) => !item.meta.isHide)
.map((item: any) => {
@ -157,9 +155,9 @@ export default defineComponent({
if (item.children) item.children = filterRoutesFun(item.children);
return item;
});
};
// tagsView 点击时，根据路由查找下标 columnsAsideList，实现左侧菜单高亮
const setColumnsMenuHighlight = (path: string) => {
};
// tagsView 点击时，根据路由查找下标 columnsAsideList，实现左侧菜单高亮
const setColumnsMenuHighlight = (path: string) => {
const currentSplitRoute = state.columnsAsideList.some((v:any)=>{
if(v.children){
v.children.some((sv:any)=>{
@ -175,9 +173,9 @@ export default defineComponent({
setTimeout(() => {
onColumnsAsideDown((<any>currentSplitRoute).k);
}, 0);
};
// 监听布局配置信息的变化，动态增加菜单高亮位置移动像素
watch(
};
// 监听布局配置信息的变化，动态增加菜单高亮位置移动像素
watch(
pinia.state,
(val) => {
val.themeConfig.themeConfig.columnsAsideStyle === 'columnsRound' ? (state.difference = 3) : (state.difference = 0);
@ -193,36 +191,24 @@ export default defineComponent({
{
deep: true,
}
);
// 页面加载时
onMounted(() => {
);
// 页面加载时
onMounted(() => {
setFilterRoutes();
// 销毁变量，防止鼠标再次移入时，保留了上次的记录
proxy.mittBus.on('restoreDefault', () => {
state.liOldIndex = null;
state.liOldPath = null;
});
});
// 页面卸载时
onUnmounted(() => {
});
// 页面卸载时
onUnmounted(() => {
proxy.mittBus.off('restoreDefault', () => {});
});
// 路由更新时
onBeforeRouteUpdate((to) => {
});
// 路由更新时
onBeforeRouteUpdate((to) => {
setColumnsMenuHighlight(to.path);
proxy.mittBus.emit('setSendColumnsChildren', setSendChildren(to.path));
});
return {
themeConfig,
columnsAsideOffsetTopRefs,
columnsAsideActiveRef,
onColumnsAsideDown,
onColumnsAsideMenuClick,
onColumnsAsideMenuMouseenter,
onColumnsAsideMenuMouseleave,
...toRefs(state),
};
},
});
</script>

26
src/layout/component/header.vue
View File

@ -4,31 +4,21 @@
</el-header>
</template>
<script lang="ts">
<script setup lang="ts">
import { computed, defineComponent } from 'vue';
import { storeToRefs } from 'pinia';
import { useThemeConfig } from '/@/stores/themeConfig';
import { useTagsViewRoutes } from '/@/stores/tagsViewRoutes';
import NavBarsIndex from '/@/layout/navBars/index.vue';
export default defineComponent({
name: 'layoutHeader',
components: { NavBarsIndex },
setup() {
const storesTagsViewRoutes = useTagsViewRoutes();
const storesThemeConfig = useThemeConfig();
const { themeConfig } = storeToRefs(storesThemeConfig);
const { isTagsViewCurrenFull } = storeToRefs(storesTagsViewRoutes);
// 设置 header 的高度
const setHeaderHeight = computed(() => {
defineOptions({ name: "layoutHeader"})
const storesTagsViewRoutes = useTagsViewRoutes();
const storesThemeConfig = useThemeConfig();
const { themeConfig } = storeToRefs(storesThemeConfig);
const { isTagsViewCurrenFull } = storeToRefs(storesTagsViewRoutes);
// 设置 header 的高度
const setHeaderHeight = computed(() => {
let { isTagsview, layout } = themeConfig.value;
if (isTagsview && layout !== 'classic') return '84px';
else return '50px';
});
return {
setHeaderHeight,
isTagsViewCurrenFull,
};
},
});
</script>

66
src/layout/component/main.vue
View File

@ -19,8 +19,8 @@
</el-main>
</template>
<script lang="ts">
import { defineComponent, toRefs, reactive, getCurrentInstance, watch, onMounted, computed } from 'vue';
<script setup lang="ts">
import { toRefs, reactive, getCurrentInstance, watch, onMounted, computed } from 'vue';
import { useRoute } from 'vue-router';
import { storeToRefs } from 'pinia';
import { useThemeConfig } from '/@/stores/themeConfig';
@ -33,43 +33,40 @@ interface MainState {
headerHeight: string | number;
currentRouteMeta: any;
}
export default defineComponent({
name: 'layoutMain',
components: { LayoutParentView, Footer },
setup() {
const { proxy } = <any>getCurrentInstance();
const storesThemeConfig = useThemeConfig();
const { themeConfig } = storeToRefs(storesThemeConfig);
const route = useRoute();
const state = reactive<MainState>({
defineOptions({ name: "layoutMain"})
const { proxy } = <any>getCurrentInstance();
const storesThemeConfig = useThemeConfig();
const { themeConfig } = storeToRefs(storesThemeConfig);
const route = useRoute();
const state = reactive<MainState>({
headerHeight: '',
currentRouteMeta: {},
});
// 判断布局
const isClassicOrTransverse = computed(() => {
});
const { currentRouteMeta } = toRefs(state);
// 判断布局
const isClassicOrTransverse = computed(() => {
const { layout } = themeConfig.value;
return layout === 'classic' || layout === 'transverse';
});
// 设置 main 的高度
const initHeaderHeight = () => {
});
// 设置 main 的高度
const initHeaderHeight = () => {
const bool = state.currentRouteMeta.isLink && state.currentRouteMeta.isIframe;
let { isTagsview } = themeConfig.value;
if (isTagsview) return (state.headerHeight = bool ? `86px` : `115px`);
else return (state.headerHeight = `80px`);
};
// 初始化获取当前路由 meta，用于设置 iframes padding
const initGetMeta = () => {
};
// 初始化获取当前路由 meta，用于设置 iframes padding
const initGetMeta = () => {
state.currentRouteMeta = route.meta;
};
// 页面加载前
onMounted(async () => {
};
// 页面加载前
onMounted(async () => {
await initGetMeta();
initHeaderHeight();
NextLoading.done();
});
// 监听路由变化
watch(
});
// 监听路由变化
watch(
() => route.path,
() => {
state.currentRouteMeta = route.meta;
@ -77,9 +74,9 @@ export default defineComponent({
state.headerHeight = bool ? `86px` : `115px`;
proxy.$refs.layoutScrollbarRef.update();
}
);
// 监听 themeConfig 配置文件的变化，更新菜单 el-scrollbar 的高度
watch(
);
// 监听 themeConfig 配置文件的变化，更新菜单 el-scrollbar 的高度
watch(
themeConfig,
(val) => {
state.currentRouteMeta = route.meta;
@ -90,12 +87,5 @@ export default defineComponent({
{
deep: true,
}
);
return {
themeConfig,
isClassicOrTransverse,
...toRefs(state),
};
},
});
);
</script>

28
src/layout/footer/index.vue
View File

@ -7,29 +7,19 @@
</div>
</template>
<script lang="ts">
import { toRefs, reactive, defineComponent } from 'vue';
import { onBeforeRouteUpdate } from 'vue-router';
export default defineComponent({
name: 'layoutFooter',
setup() {
const state = reactive({
isDelayFooter: true,
});
// 路由改变时，等主界面动画加载完毕再显示 footer
onBeforeRouteUpdate(() => {
<script setup lang="ts">
import {ref} from 'vue';
import {onBeforeRouteUpdate} from 'vue-router';
defineOptions({ name: "layoutFooter"})
const isDelayFooter = ref(true)
// 路由改变时，等主界面动画加载完毕再显示 footer
onBeforeRouteUpdate(() => {
setTimeout(() => {
state.isDelayFooter = false;
isDelayFooter.value = false;
setTimeout(() => {
state.isDelayFooter = true;
isDelayFooter.value = true;
}, 800);
}, 0);
});
return {
...toRefs(state),
};
},
});
</script>

93
src/layout/lockScreen/index.vue
View File

@ -59,7 +59,7 @@
</div>
</template>
<script lang="ts">
<script setup lang="ts">
import { nextTick, onMounted, reactive, toRefs, ref, onUnmounted, getCurrentInstance, defineComponent } from 'vue';
import { formatDate } from '/@/utils/formatTime';
import { Local } from '/@/utils/storage';
@ -84,15 +84,13 @@ interface LockScreenState {
isShowLockScreenIntervalTime: number;
lockScreenPassword: string;
}
defineOptions({ name: "layoutLockScreen"})
export default defineComponent({
name: 'layoutLockScreen',
setup() {
const { proxy } = <any>getCurrentInstance();
const layoutLockScreenInputRef = ref();
const storesThemeConfig = useThemeConfig();
const { themeConfig } = storeToRefs(storesThemeConfig);
const state = reactive<LockScreenState>({
const { proxy } = <any>getCurrentInstance();
const layoutLockScreenInputRef = ref();
const storesThemeConfig = useThemeConfig();
const { themeConfig } = storeToRefs(storesThemeConfig);
const state = reactive<LockScreenState>({
transparency: 1,
downClientY: 0,
moveDifference: 0,
@ -108,14 +106,15 @@ export default defineComponent({
isShowLockScreen: false,
isShowLockScreenIntervalTime: 0,
lockScreenPassword: '',
});
// 鼠标按下
const onDown = (down: any) => {
});
const { isShowLockScreen, lockScreenPassword,isShowLoockLogin,time} = toRefs(state);
// 鼠标按下
const onDown = (down: any) => {
state.isFlags = true;
state.downClientY = down.touches ? down.touches[0].clientY : down.clientY;
};
// 鼠标移动
const onMove = (move: any) => {
};
// 鼠标移动
const onMove = (move: any) => {
if (state.isFlags) {
const el = <HTMLElement>state.querySelectorEl;
const opacitys = (state.transparency -= 1 / 200);
@ -138,36 +137,36 @@ export default defineComponent({
layoutLockScreenInputRef.value.focus();
}
}
};
// 鼠标松开
const onEnd = () => {
};
// 鼠标松开
const onEnd = () => {
state.isFlags = false;
state.transparency = 1;
if (state.moveDifference >= -400) {
(<HTMLElement>state.querySelectorEl).setAttribute('style', `top:0px;opacity:1;transition:all 0.3s ease;`);
}
};
// 获取要拖拽的初始元素
const initGetElement = () => {
};
// 获取要拖拽的初始元素
const initGetElement = () => {
nextTick(() => {
state.querySelectorEl = proxy.$refs.layoutLockScreenDateRef;
});
};
// 时间初始化
const initTime = () => {
};
// 时间初始化
const initTime = () => {
state.time.hm = formatDate(new Date(), 'HH:MM');
state.time.s = formatDate(new Date(), 'SS');
state.time.mdq = formatDate(new Date(), 'mm月dd日，WWW');
};
// 时间初始化定时器
const initSetTime = () => {
};
// 时间初始化定时器
const initSetTime = () => {
initTime();
state.setIntervalTime = window.setInterval(() => {
initTime();
}, 1000);
};
// 锁屏时间定时器
const initLockScreen = () => {
};
// 锁屏时间定时器
const initLockScreen = () => {
if (themeConfig.value.isLockScreen) {
state.isShowLockScreenIntervalTime = window.setInterval(() => {
if (themeConfig.value.lockScreenTime <= 1) {
@ -180,38 +179,28 @@ export default defineComponent({
} else {
clearInterval(state.isShowLockScreenIntervalTime);
}
};
// 存储布局配置
const setLocalThemeConfig = () => {
};
// 存储布局配置
const setLocalThemeConfig = () => {
themeConfig.value.isDrawer = false;
Local.set('themeConfig', themeConfig.value);
};
// 密码输入点击事件
const onLockScreenSubmit = () => {
};
// 密码输入点击事件
const onLockScreenSubmit = () => {
themeConfig.value.isLockScreen = false;
themeConfig.value.lockScreenTime = 30;
setLocalThemeConfig();
};
// 页面加载时
onMounted(() => {
};
// 页面加载时
onMounted(() => {
initGetElement();
initSetTime();
initLockScreen();
});
// 页面卸载时
onUnmounted(() => {
});
// 页面卸载时
onUnmounted(() => {
window.clearInterval(state.setIntervalTime);
window.clearInterval(state.isShowLockScreenIntervalTime);
});
return {
layoutLockScreenInputRef,
onDown,
onMove,
onEnd,
onLockScreenSubmit,
...toRefs(state),
};
},
});
</script>

31
src/layout/logo/index.vue
View File

@ -8,36 +8,25 @@
</div>
</template>
<script lang="ts">
<script setup lang="ts">
import { computed, defineComponent } from 'vue';
import { storeToRefs } from 'pinia';
import { useThemeConfig } from '/@/stores/themeConfig';
import logoMini from '/@/assets/logo-mini.svg';
export default defineComponent({
name: 'layoutLogo',
setup() {
const storesThemeConfig = useThemeConfig();
const { themeConfig } = storeToRefs(storesThemeConfig);
// 设置 logo 的显示。classic 经典布局默认显示 logo
const setShowLogo = computed(() => {
defineOptions({ name: "layoutLogo"})
const storesThemeConfig = useThemeConfig();
const { themeConfig } = storeToRefs(storesThemeConfig);
// 设置 logo 的显示。classic 经典布局默认显示 logo
const setShowLogo = computed(() => {
let { isCollapse, layout } = themeConfig.value;
return !isCollapse || layout === 'classic' || document.body.clientWidth < 1000;
});
// logo 点击实现菜单展开/收起
const onThemeConfigChange = () => {
});
// logo 点击实现菜单展开/收起
const onThemeConfigChange = () => {
if (themeConfig.value.layout === 'transverse') return false;
themeConfig.value.isCollapse = !themeConfig.value.isCollapse;
};
return {
logoMini,
setShowLogo,
themeConfig,
onThemeConfigChange,
};
},
});
};
</script>
<style scoped lang="scss">

17
src/layout/main/classic.vue
View File

@ -12,7 +12,7 @@
</el-container>
</template>
<script lang="ts">
<script setup lang="ts">
import { defineComponent } from 'vue';
import { storeToRefs } from 'pinia';
import { useThemeConfig } from '/@/stores/themeConfig';
@ -20,16 +20,7 @@ import Aside from '/@/layout/component/aside.vue';
import Header from '/@/layout/component/header.vue';
import Main from '/@/layout/component/main.vue';
import TagsView from '/@/layout/navBars/tagsView/tagsView.vue';
export default defineComponent({
name: 'layoutClassic',
components: { Aside, Header, Main, TagsView },
setup() {
const storesThemeConfig = useThemeConfig();
const { themeConfig } = storeToRefs(storesThemeConfig);
return {
themeConfig,
};
},
});
defineOptions({ name: "layoutClassic"})
const storesThemeConfig = useThemeConfig();
const { themeConfig } = storeToRefs(storesThemeConfig);
</script>

20
src/layout/main/columns.vue
View File

@ -15,7 +15,7 @@
</el-container>
</template>
<script lang="ts">
<script setup lang="ts">
import { computed, defineComponent } from 'vue';
import { storeToRefs } from 'pinia';
import { useThemeConfig } from '/@/stores/themeConfig';
@ -23,19 +23,11 @@ import Aside from '/@/layout/component/aside.vue';
import Header from '/@/layout/component/header.vue';
import Main from '/@/layout/component/main.vue';
import ColumnsAside from '/@/layout/component/columnsAside.vue';
export default defineComponent({
name: 'layoutColumns',
components: { Aside, Header, Main, ColumnsAside },
setup() {
const storesThemeConfig = useThemeConfig();
const { themeConfig } = storeToRefs(storesThemeConfig);
const isFixedHeader = computed(() => {
defineOptions({ name: "layoutColumns"})
const storesThemeConfig = useThemeConfig();
const { themeConfig } = storeToRefs(storesThemeConfig);
const isFixedHeader = computed(() => {
return themeConfig.value.isFixedHeader;
});
return {
isFixedHeader,
};
},
});
</script>

32
src/layout/main/defaults.vue
View File

@ -12,7 +12,7 @@
</el-container>
</template>
<script lang="ts">
<script setup lang="ts">
import {computed, getCurrentInstance, watch, defineComponent, ref} from 'vue';
import { useRoute } from 'vue-router';
import { storeToRefs } from 'pinia';
@ -20,29 +20,19 @@ import { useThemeConfig } from '/@/stores/themeConfig';
import layoutAside from '/@/layout/component/aside.vue';
import layoutHeader from '/@/layout/component/header.vue';
import layoutMain from '/@/layout/component/main.vue';
export default defineComponent({
name: 'layoutDefaults',
components: { layoutAside, layoutHeader, layoutMain },
setup() {
const route = useRoute();
const layoutDefaultsScrollbarRef = ref()
const storesThemeConfig = useThemeConfig();
const { themeConfig } = storeToRefs(storesThemeConfig);
const isFixedHeader = computed(() => {
defineOptions({ name: "layoutDefaults"})
const route = useRoute();
const layoutDefaultsScrollbarRef = ref()
const storesThemeConfig = useThemeConfig();
const { themeConfig } = storeToRefs(storesThemeConfig);
const isFixedHeader = computed(() => {
return themeConfig.value.isFixedHeader;
});
// 监听路由的变化
watch(
});
// 监听路由的变化
watch(
() => route.path,
() => {
layoutDefaultsScrollbarRef.value.wrapRef.scrollTop = 0;
}
);
return {
isFixedHeader,
layoutDefaultsScrollbarRef,
};
},
});
);
</script>

8
src/layout/main/transverse.vue
View File

@ -6,12 +6,8 @@
</el-container>
</template>
<script lang="ts">
<script setup lang="ts">
import Header from '/@/layout/component/header.vue';
import Main from '/@/layout/component/main.vue';
export default {
name: 'layoutTransverse',
components: { Header, Main },
};
defineOptions({ name: "layoutTransverse"})
</script>

79
src/layout/navBars/breadcrumb/breadcrumb.vue
View File

@ -23,7 +23,7 @@
</div>
</template>
<script lang="ts">
<script setup lang="ts">
import { toRefs, reactive, computed, onMounted, defineComponent } from 'vue';
import { onBeforeRouteUpdate, useRoute, useRouter } from 'vue-router';
import { Local } from '/@/utils/storage';
@ -31,7 +31,6 @@ import other from '/@/utils/other';
import { storeToRefs } from 'pinia';
import { useThemeConfig } from '/@/stores/themeConfig';
import { useRoutesList } from '/@/stores/routesList';
// 定义接口来定义对象的类型
interface BreadcrumbState {
breadcrumbList: Array<any>;
@ -40,46 +39,45 @@ interface BreadcrumbState {
routeSplitIndex: number;
}
export default defineComponent({
name: 'layoutBreadcrumb',
setup() {
const stores = useRoutesList();
const storesThemeConfig = useThemeConfig();
const { themeConfig } = storeToRefs(storesThemeConfig);
const { routesList } = storeToRefs(stores);
const route = useRoute();
const router = useRouter();
const state = reactive<BreadcrumbState>({
defineOptions({ name: "layoutBreadcrumb"})
const stores = useRoutesList();
const storesThemeConfig = useThemeConfig();
const { themeConfig } = storeToRefs(storesThemeConfig);
const { routesList } = storeToRefs(stores);
const route = useRoute();
const router = useRouter();
const state = reactive<BreadcrumbState>({
breadcrumbList: [],
routeSplit: [],
routeSplitFirst: '',
routeSplitIndex: 1,
});
// 动态设置经典、横向布局不显示
const isShowBreadcrumb = computed(() => {
});
const {breadcrumbList}= toRefs(state);
// 动态设置经典、横向布局不显示
const isShowBreadcrumb = computed(() => {
initRouteSplit(route.path);
const { layout, isBreadcrumb } = themeConfig.value;
if (layout === 'classic' || layout === 'transverse') return false;
else return isBreadcrumb ? true : false;
});
// 面包屑点击时
const onBreadcrumbClick = (v: any) => {
});
// 面包屑点击时
const onBreadcrumbClick = (v: any) => {
const { redirect, path } = v;
if (redirect) router.push(redirect);
else router.push(path);
};
// 展开/收起左侧菜单点击
const onThemeConfigChange = () => {
};
// 展开/收起左侧菜单点击
const onThemeConfigChange = () => {
themeConfig.value.isCollapse = !themeConfig.value.isCollapse;
setLocalThemeConfig();
};
// 存储布局配置
const setLocalThemeConfig = () => {
};
// 存储布局配置
const setLocalThemeConfig = () => {
Local.remove('themeConfig');
Local.set('themeConfig', themeConfig.value);
};
// 处理面包屑数据
const getBreadcrumbList = (arr: Array<string>) => {
};
// 处理面包屑数据
const getBreadcrumbList = (arr: Array<string>) => {
arr.forEach((item: any) => {
state.routeSplit.forEach((v: any, k: number, arrs: any) => {
if (state.routeSplitFirst === item.path) {
@ -90,9 +88,9 @@ export default defineComponent({
}
});
});
};
// 当前路由字符串切割成数组，并删除第一项空内容
const initRouteSplit = (path: string) => {
};
// 当前路由字符串切割成数组，并删除第一项空内容
const initRouteSplit = (path: string) => {
if (!themeConfig.value.isBreadcrumb) return false;
state.breadcrumbList = [routesList.value[0]];
state.routeSplit = path.split('/');
@ -102,23 +100,14 @@ export default defineComponent({
getBreadcrumbList(routesList.value);
if (route.name === 'home' || (route.name === 'notFound' && state.breadcrumbList.length > 1)) state.breadcrumbList.shift();
if (state.breadcrumbList.length > 0) state.breadcrumbList[state.breadcrumbList.length - 1].meta.tagsViewName = other.setTagsViewNameI18n(route);
};
// 页面加载时
onMounted(() => {
};
// 页面加载时
onMounted(() => {
initRouteSplit(route.path);
});
// 路由更新时
onBeforeRouteUpdate((to) => {
});
// 路由更新时
onBeforeRouteUpdate((to) => {
initRouteSplit(to.path);
});
return {
onThemeConfigChange,
isShowBreadcrumb,
themeConfig,
onBreadcrumbClick,
...toRefs(state),
};
},
});
</script>

25
src/layout/navBars/breadcrumb/closeFull.vue
View File

@ -6,26 +6,17 @@
</div>
</template>
<script lang="ts">
import { defineComponent } from 'vue';
<script setup lang="ts">
import { storeToRefs } from 'pinia';
import { useTagsViewRoutes } from '/@/stores/tagsViewRoutes';
export default defineComponent({
name: 'layoutCloseFull',
setup() {
const stores = useTagsViewRoutes();
const { isTagsViewCurrenFull } = storeToRefs(stores);
// 关闭当前全屏
const onCloseFullscreen = () => {
defineOptions({ name: "layoutCloseFull"})
const stores = useTagsViewRoutes();
const { isTagsViewCurrenFull } = storeToRefs(stores);
// 关闭当前全屏
const onCloseFullscreen = () => {
stores.setCurrenFullscreen(false);
};
return {
isTagsViewCurrenFull,
onCloseFullscreen,
};
},
});
};
</script>
<style scoped lang="scss">

78
src/layout/navBars/breadcrumb/index.vue
View File

@ -7,7 +7,7 @@
</div>
</template>
<script lang="ts">
<script setup lang="ts">
import { computed, reactive, toRefs, onMounted, onUnmounted, getCurrentInstance, defineComponent } from 'vue';
import { useRoute } from 'vue-router';
import { storeToRefs } from 'pinia';
@ -22,32 +22,29 @@ import Horizontal from '/@/layout/navMenu/horizontal.vue';
interface IndexState {
menuList: object[];
}
export default defineComponent({
name: 'layoutBreadcrumbIndex',
components: { Breadcrumb, User, Logo, Horizontal },
setup() {
const { proxy } = <any>getCurrentInstance();
const stores = useRoutesList();
const storesThemeConfig = useThemeConfig();
const { themeConfig } = storeToRefs(storesThemeConfig);
const { routesList } = storeToRefs(stores);
const route = useRoute();
const state = reactive<IndexState>({
defineOptions({ name: "layoutBreadcrumbIndex"})
const { proxy } = <any>getCurrentInstance();
const stores = useRoutesList();
const storesThemeConfig = useThemeConfig();
const { themeConfig } = storeToRefs(storesThemeConfig);
const { routesList } = storeToRefs(stores);
const route = useRoute();
const state = reactive<IndexState>({
menuList: [],
});
// 设置 logo 显示/隐藏
const setIsShowLogo = computed(() => {
});
const { menuList } = toRefs(state);
// 设置 logo 显示/隐藏
const setIsShowLogo = computed(() => {
let { isShowLogo, layout } = themeConfig.value;
return (isShowLogo && layout === 'classic') || (isShowLogo && layout === 'transverse');
});
// 设置是否显示横向导航菜单
const isLayoutTransverse = computed(() => {
});
// 设置是否显示横向导航菜单
const isLayoutTransverse = computed(() => {
let { layout, isClassicSplitMenu } = themeConfig.value;
return layout === 'transverse' || (isClassicSplitMenu && layout === 'classic');
});
// 设置/过滤路由（非静态路由/是否显示在菜单中）
const setFilterRoutes = () => {
});
// 设置/过滤路由（非静态路由/是否显示在菜单中）
const setFilterRoutes = () => {
let { layout, isClassicSplitMenu } = themeConfig.value;
if (layout === 'classic' && isClassicSplitMenu) {
state.menuList = delClassicChildren(filterRoutesFun(routesList.value));
@ -56,16 +53,16 @@ export default defineComponent({
} else {
state.menuList = filterRoutesFun(routesList.value);
}
};
// 设置了分割菜单时，删除底下 children
const delClassicChildren = (arr: Array<object>) => {
};
// 设置了分割菜单时，删除底下 children
const delClassicChildren = (arr: Array<object>) => {
arr.map((v: any) => {
if (v.children) delete v.children;
});
return arr;
};
// 路由过滤递归函数
const filterRoutesFun = (arr: Array<string>) => {
};
// 路由过滤递归函数
const filterRoutesFun = (arr: Array<string>) => {
return arr
.filter((item: any) => !item.meta.isHide)
.map((item: any) => {
@ -73,9 +70,9 @@ export default defineComponent({
if (item.children) item.children = filterRoutesFun(item.children);
return item;
});
};
// 传送当前子级数据到菜单中
const setSendClassicChildren = (path: string) => {
};
// 传送当前子级数据到菜单中
const setSendClassicChildren = (path: string) => {
const currentPathSplit = path.split('/');
let currentData: any = {};
filterRoutesFun(routesList.value).map((v, k) => {
@ -87,24 +84,17 @@ export default defineComponent({
}
});
return currentData;
};
// 页面加载时
onMounted(() => {
};
// 页面加载时
onMounted(() => {
setFilterRoutes();
proxy.mittBus.on('getBreadcrumbIndexSetFilterRoutes', () => {
setFilterRoutes();
});
});
// 页面卸载时
onUnmounted(() => {
});
// 页面卸载时
onUnmounted(() => {
proxy.mittBus.off('getBreadcrumbIndexSetFilterRoutes', () => {});
});
return {
setIsShowLogo,
isLayoutTransverse,
...toRefs(state),
};
},
});
</script>

76
src/layout/navBars/breadcrumb/search.vue
View File

@ -25,7 +25,7 @@
</div>
</template>
<script lang="ts">
<script setup lang="ts">
import { reactive, toRefs, defineComponent, ref, nextTick } from 'vue';
import { useRouter } from 'vue-router';
import { useI18n } from 'vue-i18n';
@ -44,22 +44,20 @@ interface Restaurant {
title: string;
};
}
export default defineComponent({
name: 'layoutBreadcrumbSearch',
setup() {
const storesTagsViewRoutes = useTagsViewRoutes();
const { tagsViewRoutes } = storeToRefs(storesTagsViewRoutes);
const layoutMenuAutocompleteRef = ref();
const { t } = useI18n();
const router = useRouter();
const state = reactive<SearchState>({
defineOptions({ name: "layoutBreadcrumbSearch"})
const storesTagsViewRoutes = useTagsViewRoutes();
const { tagsViewRoutes } = storeToRefs(storesTagsViewRoutes);
const layoutMenuAutocompleteRef = ref();
const { t } = useI18n();
const router = useRouter();
const state = reactive<SearchState>({
isShowSearch: false,
menuQuery: '',
tagsViewList: [],
});
// 搜索弹窗打开
const openSearch = () => {
});
const { isShowSearch, menuQuery} =toRefs(state)
// 搜索弹窗打开
const openSearch = () => {
state.menuQuery = '';
state.isShowSearch = true;
initTageView();
@ -68,18 +66,18 @@ export default defineComponent({
layoutMenuAutocompleteRef.value.focus();
});
});
};
// 搜索弹窗关闭
const closeSearch = () => {
};
// 搜索弹窗关闭
const closeSearch = () => {
state.isShowSearch = false;
};
// 菜单搜索数据过滤
const menuSearch = (queryString: string, cb: Function) => {
};
// 菜单搜索数据过滤
const menuSearch = (queryString: string, cb: Function) => {
let results = queryString ? state.tagsViewList.filter(createFilter(queryString)) : state.tagsViewList;
cb(results);
};
// 菜单搜索过滤
const createFilter: any = (queryString: string) => {
};
// 菜单搜索过滤
const createFilter: any = (queryString: string) => {
return (restaurant: Restaurant) => {
return (
restaurant.path.toLowerCase().indexOf(queryString.toLowerCase()) > -1 ||
@ -87,37 +85,27 @@ export default defineComponent({
t(restaurant.meta.title).indexOf(queryString.toLowerCase()) > -1
);
};
};
// 初始化菜单数据
const initTageView = () => {
};
// 初始化菜单数据
const initTageView = () => {
if (state.tagsViewList.length > 0) return false;
tagsViewRoutes.value.map((v: any) => {
if (!v.meta.isHide) state.tagsViewList.push({ ...v });
});
};
// 当前菜单选中时
const onHandleSelect = (item: any) => {
};
// 当前菜单选中时
const onHandleSelect = (item: any) => {
let { path, redirect } = item;
if (item.meta.isLink && !item.meta.isIframe) window.open(item.meta.isLink);
else if (redirect) router.push(redirect);
else router.push(path);
closeSearch();
};
// input 失去焦点时
const onSearchBlur = () => {
};
// input 失去焦点时
const onSearchBlur = () => {
closeSearch();
};
return {
layoutMenuAutocompleteRef,
openSearch,
closeSearch,
menuSearch,
onHandleSelect,
onSearchBlur,
...toRefs(state),
};
},
});
};
</script>
<style scoped lang="scss">

235
src/layout/navBars/breadcrumb/setings.vue
View File

@ -407,8 +407,18 @@
</div>
</template>
<script lang="ts">
import { nextTick, onUnmounted, onMounted, getCurrentInstance, defineComponent, computed, reactive, toRefs } from 'vue';
<script setup lang="ts">
import {
nextTick,
onUnmounted,
onMounted,
getCurrentInstance,
defineComponent,
computed,
reactive,
toRefs,
ref
} from 'vue';
import { ElMessage } from 'element-plus';
import { storeToRefs } from 'pinia';
import { useThemeConfig } from '/@/stores/themeConfig';
@ -418,23 +428,18 @@ import { Local } from '/@/utils/storage';
import Watermark from '/@/utils/wartermark';
import commonFunction from '/@/utils/commonFunction';
import other from '/@/utils/other';
export default defineComponent({
name: 'layoutBreadcrumbSeting',
setup() {
const { proxy } = <any>getCurrentInstance();
const storesThemeConfig = useThemeConfig();
const { themeConfig } = storeToRefs(storesThemeConfig);
const { copyText } = commonFunction();
const state = reactive({
isMobile: false,
});
// 获取布局配置信息
const getThemeConfig = computed(() => {
defineOptions({ name: "layoutBreadcrumbSeting"})
const { proxy } = <any>getCurrentInstance();
const storesThemeConfig = useThemeConfig();
const { themeConfig } = storeToRefs(storesThemeConfig);
const { copyText } = commonFunction();
const isMobile = ref(false);
// 获取布局配置信息
const getThemeConfig = computed(() => {
return themeConfig.value;
});
// 1、全局主题
const onColorPickerChange = () => {
});
// 1、全局主题
const onColorPickerChange = () => {
if (!getThemeConfig.value.primary) return ElMessage.warning('全局主题 primary 颜色值不能为空');
// 颜色加深
document.documentElement.style.setProperty('--el-color-primary-dark-2', `${getDarkColor(getThemeConfig.value.primary, 0.1)}`);
@ -444,9 +449,9 @@ export default defineComponent({
document.documentElement.style.setProperty(`--el-color-primary-light-${i}`, `${getLightColor(getThemeConfig.value.primary, i / 10)}`);
}
setDispatchThemeConfig();
};
// 2、菜单 / 顶栏
const onBgColorPickerChange = (bg: string) => {
};
// 2、菜单 / 顶栏
const onBgColorPickerChange = (bg: string) => {
document.documentElement.style.setProperty(`--next-bg-${bg}`, (<any>getThemeConfig.value)[bg]);
if (bg === 'menuBar') {
document.documentElement.style.setProperty(`--next-bg-menuBar-light-1`, <any>getLightColor(getThemeConfig.value.menuBar, 0.05));
@ -455,21 +460,21 @@ export default defineComponent({
onMenuBarGradualChange();
onColumnsMenuBarGradualChange();
setDispatchThemeConfig();
};
// 2、菜单 / 顶栏 --> 顶栏背景渐变
const onTopBarGradualChange = () => {
};
// 2、菜单 / 顶栏 --> 顶栏背景渐变
const onTopBarGradualChange = () => {
setGraduaFun('.layout-navbars-breadcrumb-index', getThemeConfig.value.isTopBarColorGradual, getThemeConfig.value.topBar);
};
// 2、菜单 / 顶栏 --> 菜单背景渐变
const onMenuBarGradualChange = () => {
};
// 2、菜单 / 顶栏 --> 菜单背景渐变
const onMenuBarGradualChange = () => {
setGraduaFun('.layout-container .el-aside', getThemeConfig.value.isMenuBarColorGradual, getThemeConfig.value.menuBar);
};
// 2、菜单 / 顶栏 --> 分栏菜单背景渐变
const onColumnsMenuBarGradualChange = () => {
};
// 2、菜单 / 顶栏 --> 分栏菜单背景渐变
const onColumnsMenuBarGradualChange = () => {
setGraduaFun('.layout-container .layout-columns-aside', getThemeConfig.value.isColumnsMenuBarColorGradual, getThemeConfig.value.columnsMenuBar);
};
// 2、菜单 / 顶栏 --> 背景渐变函数
const setGraduaFun = (el: string, bool: boolean, color: string) => {
};
// 2、菜单 / 顶栏 --> 背景渐变函数
const setGraduaFun = (el: string, bool: boolean, color: string) => {
setTimeout(() => {
let els = document.querySelector(el);
if (!els) return false;
@ -478,46 +483,46 @@ export default defineComponent({
else els.setAttribute('style', ``);
setLocalThemeConfig();
}, 200);
};
// 3、界面设置 --> 菜单水平折叠
const onThemeConfigChange = () => {
};
// 3、界面设置 --> 菜单水平折叠
const onThemeConfigChange = () => {
setDispatchThemeConfig();
};
// 3、界面设置 --> 固定 Header
const onIsFixedHeaderChange = () => {
};
// 3、界面设置 --> 固定 Header
const onIsFixedHeaderChange = () => {
getThemeConfig.value.isFixedHeaderChange = getThemeConfig.value.isFixedHeader ? false : true;
setLocalThemeConfig();
};
// 3、界面设置 --> 经典布局分割菜单
const onClassicSplitMenuChange = () => {
};
// 3、界面设置 --> 经典布局分割菜单
const onClassicSplitMenuChange = () => {
getThemeConfig.value.isBreadcrumb = false;
setLocalThemeConfig();
proxy.mittBus.emit('getBreadcrumbIndexSetFilterRoutes');
};
// 4、界面显示 --> 侧边栏 Logo
const onIsShowLogoChange = () => {
};
// 4、界面显示 --> 侧边栏 Logo
const onIsShowLogoChange = () => {
getThemeConfig.value.isShowLogoChange = getThemeConfig.value.isShowLogo ? false : true;
setLocalThemeConfig();
};
// 4、界面显示 --> 面包屑 Breadcrumb
const onIsBreadcrumbChange = () => {
};
// 4、界面显示 --> 面包屑 Breadcrumb
const onIsBreadcrumbChange = () => {
if (getThemeConfig.value.layout === 'classic') {
getThemeConfig.value.isClassicSplitMenu = false;
}
setLocalThemeConfig();
};
// 4、界面显示 --> 开启 TagsView 拖拽
const onSortableTagsViewChange = () => {
};
// 4、界面显示 --> 开启 TagsView 拖拽
const onSortableTagsViewChange = () => {
proxy.mittBus.emit('openOrCloseSortable');
setLocalThemeConfig();
};
// 4、界面显示 --> 开启 TagsView 共用
const onShareTagsViewChange = () => {
};
// 4、界面显示 --> 开启 TagsView 共用
const onShareTagsViewChange = () => {
proxy.mittBus.emit('openShareTagsView');
setLocalThemeConfig();
};
// 4、界面显示 --> 灰色模式/色弱模式
const onAddFilterChange = (attr: string) => {
};
// 4、界面显示 --> 灰色模式/色弱模式
const onAddFilterChange = (attr: string) => {
if (attr === 'grayscale') {
if (getThemeConfig.value.isGrayscale) getThemeConfig.value.isInvert = false;
} else {
@ -528,91 +533,91 @@ export default defineComponent({
const appEle: any = document.body;
appEle.setAttribute('style', `filter: ${cssAttr}`);
setLocalThemeConfig();
};
// 4、界面显示 --> 深色模式
const onAddDarkChange = () => {
};
// 4、界面显示 --> 深色模式
const onAddDarkChange = () => {
const body = document.documentElement as HTMLElement;
if (getThemeConfig.value.isIsDark) body.setAttribute('data-theme', 'dark');
else body.setAttribute('data-theme', '');
};
// 4、界面显示 --> 开启水印
const onWartermarkChange = () => {
};
// 4、界面显示 --> 开启水印
const onWartermarkChange = () => {
getThemeConfig.value.isWartermark ? Watermark.set(getThemeConfig.value.wartermarkText) : Watermark.del();
setLocalThemeConfig();
};
// 4、界面显示 --> 水印文案
const onWartermarkTextInput = (val: any) => {
};
// 4、界面显示 --> 水印文案
const onWartermarkTextInput = (val: any) => {
getThemeConfig.value.wartermarkText = verifyAndSpace(val);
if (getThemeConfig.value.wartermarkText === '') return false;
if (getThemeConfig.value.isWartermark) Watermark.set(getThemeConfig.value.wartermarkText);
setLocalThemeConfig();
};
// 5、布局切换
const onSetLayout = (layout: string) => {
};
// 5、布局切换
const onSetLayout = (layout: string) => {
Local.set('oldLayout', layout);
if (getThemeConfig.value.layout === layout) return false;
if (layout === 'transverse') getThemeConfig.value.isCollapse = false;
getThemeConfig.value.layout = layout;
getThemeConfig.value.isDrawer = false;
initLayoutChangeFun();
};
// 设置布局切换函数
const initLayoutChangeFun = () => {
};
// 设置布局切换函数
const initLayoutChangeFun = () => {
onBgColorPickerChange('menuBar');
onBgColorPickerChange('menuBarColor');
onBgColorPickerChange('topBar');
onBgColorPickerChange('topBarColor');
onBgColorPickerChange('columnsMenuBar');
onBgColorPickerChange('columnsMenuBarColor');
};
// 关闭弹窗时，初始化变量。变量用于处理 proxy.$refs.layoutScrollbarRef.update()
const onDrawerClose = () => {
};
// 关闭弹窗时，初始化变量。变量用于处理 proxy.$refs.layoutScrollbarRef.update()
const onDrawerClose = () => {
getThemeConfig.value.isFixedHeaderChange = false;
getThemeConfig.value.isShowLogoChange = false;
getThemeConfig.value.isDrawer = false;
setLocalThemeConfig();
};
// 布局配置弹窗打开
const openDrawer = () => {
};
// 布局配置弹窗打开
const openDrawer = () => {
getThemeConfig.value.isDrawer = true;
};
// 触发 store 布局配置更新
const setDispatchThemeConfig = () => {
};
// 触发 store 布局配置更新
const setDispatchThemeConfig = () => {
setLocalThemeConfig();
setLocalThemeConfigStyle();
};
// 存储布局配置
const setLocalThemeConfig = () => {
};
// 存储布局配置
const setLocalThemeConfig = () => {
Local.remove('themeConfig');
Local.set('themeConfig', getThemeConfig.value);
};
// 存储布局配置全局主题样式（html根标签）
const setLocalThemeConfigStyle = () => {
};
// 存储布局配置全局主题样式（html根标签）
const setLocalThemeConfigStyle = () => {
Local.set('themeConfigStyle', document.documentElement.style.cssText);
};
// 一键复制配置
const onCopyConfigClick = () => {
};
// 一键复制配置
const onCopyConfigClick = () => {
let copyThemeConfig = Local.get('themeConfig');
copyThemeConfig.isDrawer = false;
copyText(JSON.stringify(copyThemeConfig)).then(() => {
getThemeConfig.value.isDrawer = false;
});
};
// 一键恢复默认
const onResetConfigClick = () => {
};
// 一键恢复默认
const onResetConfigClick = () => {
Local.clear();
window.location.reload();
};
// 初始化菜单样式等
const initSetStyle = () => {
};
// 初始化菜单样式等
const initSetStyle = () => {
// 2、菜单 / 顶栏 --> 顶栏背景渐变
onTopBarGradualChange();
// 2、菜单 / 顶栏 --> 菜单背景渐变
onMenuBarGradualChange();
// 2、菜单 / 顶栏 --> 分栏菜单背景渐变
onColumnsMenuBarGradualChange();
};
onMounted(() => {
};
onMounted(() => {
nextTick(() => {
// 判断当前布局是否不相同，不相同则初始化当前布局的样式，防止监听窗口大小改变时，布局配置logo、菜单背景等部分布局失效问题
if (!Local.get('frequency')) initLayoutChangeFun();
@ -622,7 +627,7 @@ export default defineComponent({
getThemeConfig.value.layout = res.layout;
getThemeConfig.value.isDrawer = false;
initLayoutChangeFun();
state.isMobile = other.isMobile();
isMobile.value = other.isMobile();
});
setTimeout(() => {
// 默认样式
@ -641,37 +646,9 @@ export default defineComponent({
initSetStyle();
}, 100);
});
});
onUnmounted(() => {
});
onUnmounted(() => {
proxy.mittBus.off('layoutMobileResize', () => {});
});
return {
openDrawer,
onColorPickerChange,
onBgColorPickerChange,
onTopBarGradualChange,
onMenuBarGradualChange,
onColumnsMenuBarGradualChange,
onThemeConfigChange,
onIsFixedHeaderChange,
onIsShowLogoChange,
getThemeConfig,
onDrawerClose,
onAddFilterChange,
onAddDarkChange,
onWartermarkChange,
onWartermarkTextInput,
onSetLayout,
setLocalThemeConfig,
onClassicSplitMenuChange,
onIsBreadcrumbChange,
onSortableTagsViewChange,
onShareTagsViewChange,
onCopyConfigClick,
onResetConfigClick,
...toRefs(state),
};
},
});
</script>

139
src/layout/navBars/breadcrumb/user.vue
View File

@ -79,7 +79,7 @@
</div>
</template>
<script lang="ts">
<script setup lang="ts">
import {ref, getCurrentInstance, computed, reactive, toRefs, onMounted, defineComponent, watch} from 'vue';
import { useRoute,useRouter } from 'vue-router';
import {ElMessageBox, ElMessage, ElNotification} from 'element-plus';
@ -96,37 +96,34 @@ import {logout} from "/@/api/login";
import {removeCache} from "/@/api/system/cache";
import {noticeStore} from "/@/stores/noticeStore";
export default defineComponent({
name: 'layoutBreadcrumbUser',
components: { UserNews, Search },
setup() {
const { t } = useI18n();
const { proxy } = <any>getCurrentInstance();
const router = useRouter();
const route = useRoute();
const stores = useUserInfo();
const storesThemeConfig = useThemeConfig();
const { userInfos } = storeToRefs(stores);
const { themeConfig } = storeToRefs(storesThemeConfig);
const searchRef = ref();
const newPopoverRef=ref();
const state = reactive({
defineOptions({ name: "layoutBreadcrumbUser"})
const { t } = useI18n();
const { proxy } = <any>getCurrentInstance();
const router = useRouter();
const route = useRoute();
const stores = useUserInfo();
const storesThemeConfig = useThemeConfig();
const { userInfos } = storeToRefs(stores);
const { themeConfig } = storeToRefs(storesThemeConfig);
const searchRef = ref();
const newPopoverRef=ref();
const state = reactive({
isScreenfull: false,
disabledI18n: 'zh-cn',
disabledSize: 'large',
});
// 设置分割样式
const layoutUserFlexNum = computed(() => {
});
const {isScreenfull, disabledI18n, disabledSize} = toRefs(state)
// 设置分割样式
const layoutUserFlexNum = computed(() => {
let num: string | number = '';
const { layout, isClassicSplitMenu } = themeConfig.value;
const layoutArr: string[] = ['defaults', 'columns'];
if (layoutArr.includes(layout) || (layout === 'classic' && !isClassicSplitMenu)) num = '1';
else num = '';
return num;
});
// 全屏点击时
const onScreenfullClick = () => {
});
// 全屏点击时
const onScreenfullClick = () => {
if (!screenfull.isEnabled) {
ElMessage.warning('暂不不支持全屏');
return false;
@ -136,13 +133,13 @@ export default defineComponent({
if (screenfull.isFullscreen) state.isScreenfull = true;
else state.isScreenfull = false;
});
};
// 布局配置 icon 点击时
const onLayoutSetingClick = () => {
};
// 布局配置 icon 点击时
const onLayoutSetingClick = () => {
proxy.mittBus.emit('openSetingsDrawer');
};
//清除缓存
const removeCacheClick = ()=>{
};
//清除缓存
const removeCacheClick = ()=>{
//清除浏览器缓存
Session.remove('userMenu');
//清除后端缓存
@ -150,9 +147,9 @@ export default defineComponent({
ElMessage.success('缓存清除成功');
window.location.reload();
})
};
// 下拉菜单点击时
const onHandleCommandClick = (path: string) => {
};
// 下拉菜单点击时
const onHandleCommandClick = (path: string) => {
if (path === 'logOut') {
ElMessageBox({
closeOnClickModal: false,
@ -193,38 +190,38 @@ export default defineComponent({
} else {
router.push(path);
}
};
// 菜单搜索点击
const onSearchClick = () => {
};
// 菜单搜索点击
const onSearchClick = () => {
searchRef.value.openSearch();
};
const hideNews=()=>{
};
const hideNews=()=>{
debugger
newPopoverRef.value.hide()
}
// 组件大小改变
const onComponentSizeChange = (size: string) => {
}
// 组件大小改变
const onComponentSizeChange = (size: string) => {
Local.remove('themeConfig');
themeConfig.value.globalComponentSize = size;
Local.set('themeConfig', themeConfig.value);
initComponentSize();
window.location.reload();
};
// 语言切换
const onLanguageChange = (lang: string) => {
};
// 语言切换
const onLanguageChange = (lang: string) => {
Local.remove('themeConfig');
themeConfig.value.globalI18n = lang;
Local.set('themeConfig', themeConfig.value);
proxy.$i18n.locale = lang;
initI18n();
other.useTitle();
};
// 设置 element plus 组件的国际化
const setI18nConfig = (locale: string) => {
};
// 设置 element plus 组件的国际化
const setI18nConfig = (locale: string) => {
proxy.mittBus.emit('getI18nConfig',proxy.i18n.global.messages.value[locale]);
};
// 初始化言语国际化
const initI18n = () => {
};
// 初始化言语国际化
const initI18n = () => {
switch (Local.get('themeConfig').globalI18n) {
case 'zh-cn':
state.disabledI18n = 'zh-cn';
@ -239,9 +236,9 @@ export default defineComponent({
setI18nConfig('zh-tw');
break;
}
};
// 初始化全局组件大小
const initComponentSize = () => {
};
// 初始化全局组件大小
const initComponentSize = () => {
switch (Local.get('themeConfig').globalComponentSize) {
case 'large':
state.disabledSize = 'large';
@ -253,25 +250,25 @@ export default defineComponent({
state.disabledSize = 'small';
break;
}
};
// 页面加载时
onMounted(() => {
};
// 页面加载时
onMounted(() => {
if (Local.get('themeConfig')) {
initI18n();
initComponentSize();
}
});
const noticeStoreAct = noticeStore()
const getMessages = computed(() => {
});
const noticeStoreAct = noticeStore()
const getMessages = computed(() => {
return noticeStoreAct.message;
});
watch(getMessages,(nv,ov)=>{
});
watch(getMessages,(nv,ov)=>{
if (!nv || !nv.id) {
return;
}
showNotice(nv)
},{ immediate: true, deep: true })
const showNotice = (data:any) => {
},{ immediate: true, deep: true })
const showNotice = (data:any) => {
const eln = ElNotification({
title: '新消息',
message: `您有一条新消息：【${data.title}】，请点击查看详情。`,
@ -286,23 +283,7 @@ export default defineComponent({
eln.close()
}
})
}
return {
userInfos,
onLayoutSetingClick,
onHandleCommandClick,
onScreenfullClick,
onSearchClick,
onComponentSizeChange,
onLanguageChange,
removeCacheClick,
hideNews,
searchRef,
layoutUserFlexNum,
...toRefs(state),
};
},
});
}
</script>
<style scoped lang="scss">

93
src/layout/navBars/breadcrumb/userNews.vue
View File

@ -88,25 +88,25 @@
</div>
</template>
<script lang="ts">
import {reactive, toRefs, defineComponent, computed, watch} from 'vue';
<script setup lang="ts">
import {reactive, toRefs, onMounted} from 'vue';
import {
listShowNotice,
unReadCount,
} from "/@/api/system/notice/sysNotice";
import {ElMessage, ElMessageBox, ElNotification} from "element-plus";
import {ElMessage, ElMessageBox} from "element-plus";
import {readNotice} from "/@/api/system/notice/sysNoticeRead";
import {SysNoticeInfoData} from "/@/views/system/sysNotice/list/component/model";
import {useRouter} from "vue-router";
export default defineComponent({
name: 'layoutBreadcrumbUserNews',
created() {
this.getUnReadCount()
this.getData(1)
},
setup() {
const router = useRouter();
const state = reactive({
defineOptions({ name: "layoutBreadcrumbUserNews"})
onMounted(()=>{
getUnReadCount()
getData(1)
})
const router = useRouter();
const state = reactive({
type1Num: 0,
type2Num: 0,
// notifyList: [],
@ -119,28 +119,28 @@ export default defineComponent({
activeInfo: 1,
isShowDialog: false,
barName: "通知"
});
/** 改变tab*/
const handleTabChange = (tabName: number) => {
});
const { tabsActive, activeInfo, isShowDialog, count, noticeList} = toRefs(state)
/** 改变tab*/
const handleTabChange = (tabName: number) => {
if (tabName === 1) {
state.barName = "通知"
} else {
state.barName = "公告"
}
getData(tabName)
};
//获取维度信息
const getUnReadCount = () => {
};
//获取维度信息
const getUnReadCount = () => {
unReadCount().then((res: any) => {
if (res.data != null) {
state.count.notice = res.data.noticeCount || 0
state.count.notify = res.data.notifyCount || 0
}
})
}
//获取数据
const getData = (barName: number | undefined) => {
}
//获取数据
const getData = (barName: number | undefined) => {
/* let notifyParam = {
pageNum: 1,
pageSize: 5,
@ -158,20 +158,20 @@ export default defineComponent({
listShowNotice(noticeParam).then((res: any) => {
state.noticeList = res.data.list || []
})
};
const readAllItem = () => {
};
const readAllItem = () => {
}
// 全部已读点击
const onAllReadClick = () => {
}
// 全部已读点击
const onAllReadClick = () => {
state.noticeList = [];
};
// 前往通知中心点击
const onGoToGiteeClick = () => {
};
// 前往通知中心点击
const onGoToGiteeClick = () => {
/*window.open('https://gitee.com/tiger1103/gfast');*/
state.isShowDialog = true
};
const hendleClear = (type: string) => {
};
const hendleClear = (type: string) => {
ElMessageBox.confirm("是否清除全部" + type + "!", '提示', {
confirmButtonText: '确认',
cancelButtonText: '取消',
@ -193,8 +193,8 @@ export default defineComponent({
.catch(() => {
});
};
const hendleAllread = (type: string) => {
};
const hendleAllread = (type: string) => {
ElMessageBox.confirm("是否将全部" + type + "标记为已读!", '提示', {
confirmButtonText: '确认',
@ -208,14 +208,14 @@ export default defineComponent({
})
.catch(() => {
});
};
const hendleShowMore = () => {
};
const hendleShowMore = () => {
// console.log(emit)
router.push("/system/sysNotice/show")
};
};
const handleRead = (item: SysNoticeInfoData) => {
const handleRead = (item: SysNoticeInfoData) => {
// console.log("handleRead", item)
let query = {
noticeId: item.id
@ -225,22 +225,7 @@ export default defineComponent({
getData(item.type)
ElMessage.success("已读");
})
}
return {
getData,
readAllItem,
onAllReadClick,
onGoToGiteeClick,
hendleClear,
hendleAllread,
hendleShowMore,
getUnReadCount,
handleRead,
...toRefs(state),
handleTabChange
};
},
});
}
</script>
<style scoped lang="scss">

21
src/layout/navBars/index.vue
View File

@ -5,28 +5,19 @@
</div>
</template>
<script lang="ts">
<script setup lang="ts">
import { computed, defineComponent } from 'vue';
import { storeToRefs } from 'pinia';
import { useThemeConfig } from '/@/stores/themeConfig';
import BreadcrumbIndex from '/@/layout/navBars/breadcrumb/index.vue';
import TagsView from '/@/layout/navBars/tagsView/tagsView.vue';
export default defineComponent({
name: 'layoutNavBars',
components: { BreadcrumbIndex, TagsView },
setup() {
const storesThemeConfig = useThemeConfig();
const { themeConfig } = storeToRefs(storesThemeConfig);
// 是否显示 tagsView
const setShowTagsView = computed(() => {
defineOptions({ name: "layoutNavBars"})
const storesThemeConfig = useThemeConfig();
const { themeConfig } = storeToRefs(storesThemeConfig);
// 是否显示 tagsView
const setShowTagsView = computed(() => {
let { layout, isTagsview } = themeConfig.value;
return layout !== 'classic' && isTagsview;
});
return {
setShowTagsView,
};
},
});
</script>

71
src/layout/navBars/tagsView/contextmenu.vue
View File

@ -29,12 +29,10 @@
</transition>
</template>
<script lang="ts">
<script setup lang="ts">
import { computed, defineComponent, reactive, toRefs, onMounted, onUnmounted, watch } from 'vue';
export default defineComponent({
name: 'layoutTagsViewContextmenu',
props: {
defineOptions({ name: "layoutTagsViewContextmenu"})
const props = defineProps({
dropdown: {
type: Object,
default: () => {
@ -43,10 +41,10 @@ export default defineComponent({
y: 0,
};
},
},
},
setup(props, { emit }) {
const state = reactive({
}
});
const emit = defineEmits(['currentContextmenuClick']);
const state = reactive({
isShow: false,
dropdownList: [
{ contextMenuClickId: 0, txt: 'message.tagsView.refresh', affix: false, icon: 'ele-RefreshRight' },
@ -62,9 +60,10 @@ export default defineComponent({
],
item: {},
arrowLeft: 10,
});
// 父级传过来的坐标 x,y 值
const dropdowns = computed(() => {
});
const { isShow, dropdownList, arrowLeft}=toRefs(state);
// 父级传过来的坐标 x,y 值
const dropdowns = computed(() => {
// 117 为 `Dropdown 下拉菜单` 的宽度
if (props.dropdown.x + 117 > document.documentElement.clientWidth) {
return {
@ -74,34 +73,34 @@ export default defineComponent({
} else {
return props.dropdown;
}
});
// 当前项菜单点击
const onCurrentContextmenuClick = (contextMenuClickId: number) => {
});
// 当前项菜单点击
const onCurrentContextmenuClick = (contextMenuClickId: number) => {
emit('currentContextmenuClick', Object.assign({}, { contextMenuClickId }, state.item));
};
// 打开右键菜单：判断是否固定，固定则不显示关闭按钮
const openContextmenu = (item: any) => {
};
// 打开右键菜单：判断是否固定，固定则不显示关闭按钮
const openContextmenu = (item: any) => {
state.item = item;
item.meta.isAffix ? (state.dropdownList[1].affix = true) : (state.dropdownList[1].affix = false);
closeContextmenu();
setTimeout(() => {
state.isShow = true;
}, 10);
};
// 关闭右键菜单
const closeContextmenu = () => {
};
// 关闭右键菜单
const closeContextmenu = () => {
state.isShow = false;
};
// 监听页面监听进行右键菜单的关闭
onMounted(() => {
};
// 监听页面监听进行右键菜单的关闭
onMounted(() => {
document.body.addEventListener('click', closeContextmenu);
});
// 页面卸载时，移除右键菜单监听事件
onUnmounted(() => {
});
// 页面卸载时，移除右键菜单监听事件
onUnmounted(() => {
document.body.removeEventListener('click', closeContextmenu);
});
// 监听下拉菜单位置
watch(
});
// 监听下拉菜单位置
watch(
() => props.dropdown,
({ x }) => {
if (x + 117 > document.documentElement.clientWidth) state.arrowLeft = 117 - (document.documentElement.clientWidth - x);
@ -110,16 +109,8 @@ export default defineComponent({
{
deep: true,
}
);
return {
dropdowns,
openContextmenu,
closeContextmenu,
onCurrentContextmenuClick,
...toRefs(state),
};
},
});
);
defineExpose({openContextmenu})
</script>
<style scoped lang="scss">

32
src/layout/navBars/tagsView/tagsView.vue
View File

@ -23,7 +23,7 @@
<SvgIcon
name="ele-RefreshRight"
class="ml5 layout-navbars-tagsview-ul-li-refresh"
@click.stop="refreshCurrentTagsView($route.fullPath)"
@click.stop="refreshCurrentTagsView(getThemeConfig.isShareTagsView ? v.path : v.url)"
/>
<SvgIcon
name="ele-Close"
@ -45,7 +45,7 @@
</div>
</template>
<script lang="ts">
<script setup lang="ts">
import {
toRefs,
reactive,
@ -101,11 +101,7 @@ interface CurrentContextmenu {
path: string;
contextMenuClickId: string | number;
}
export default defineComponent({
name: 'layoutTagsView',
components: { Contextmenu },
setup() {
defineOptions({ name: "layoutTagsView"})
const { proxy } = <any>getCurrentInstance();
const tagsRefs = ref<any[]>([]);
const scrollbarRef = ref();
@ -128,6 +124,7 @@ export default defineComponent({
tagsViewList: [],
tagsViewRoutesList: [],
});
const { tagsViewList, dropdown} = toRefs(state)
// 动态设置 tagsView 风格样式
const setTagsStyle = computed(() => {
return themeConfig.value.tagsStyle;
@ -367,7 +364,7 @@ export default defineComponent({
// 刷新当前
if (meta.isDynamic) await router.push({ name, params });
else await router.push({ path, query });
refreshCurrentTagsView(route.fullPath);
refreshCurrentTagsView(getThemeConfig.value.isShareTagsView ? path : url);
break;
case 1:
// 关闭当前
@ -580,25 +577,6 @@ export default defineComponent({
deep: true,
}
);
return {
isActive,
onContextmenu,
onTagsClick,
tagsRefs,
contextmenuRef,
scrollbarRef,
tagsUlRef,
onHandleScroll,
getThemeConfig,
setTagsStyle,
setTagsViewNameI18n,
refreshCurrentTagsView,
closeCurrentTagsView,
onCurrentContextmenuClick,
...toRefs(state),
};
},
});
</script>
<style scoped lang="scss">

24
src/router/route.ts
View File

@ -65,7 +65,6 @@ export const dynamicRoutes: Array<RouteRecordRaw> = [
path: '/bigUpload',
name: 'bigUpload',
component: () => import('/@/layout/routerView/parent.vue'),
redirect: '/bigUpload',
meta:{
title: '大文件上传',
isLink: '',
@ -78,8 +77,8 @@ export const dynamicRoutes: Array<RouteRecordRaw> = [
},
children:[
{
path: '/bigUpload',
name: 'bigUpload',
path: '/bigUpload/list',
name: 'bigUploadList',
component: () => import('/@/views/bigUpload/index.vue'),
meta: {
title: '大文件上传',
@ -574,6 +573,7 @@ export const demoRoutes:Array<RouteRecordRaw> = [
icon: 'ele-Sunny',
},
},
{
path: '/demo/pages/iocnfont',
name: 'pagesIocnfont',
@ -589,6 +589,7 @@ export const demoRoutes:Array<RouteRecordRaw> = [
icon: 'ele-Present',
},
},
{
path: '/demo/pages/element',
name: 'pagesElement',
@ -813,22 +814,7 @@ export const demoRoutes:Array<RouteRecordRaw> = [
roles: ['admin'],
icon: 'iconfont icon-diannao',
},
},
{
path: '/demo/pages/workflow',
name: 'pagesWorkflow',
component: () => import('/@/views/pages/workflow/index.vue'),
meta: {
title: 'message.router.pagesWorkflow',
isLink: '',
isHide: false,
isKeepAlive: true,
isAffix: false,
isIframe: false,
roles: ['admin'],
icon: 'ele-Connection',
},
},
}
],
},
{

51
src/views/bigUpload/component/editBigUpload.vue
View File

@ -18,25 +18,22 @@
</el-dialog>
</template>
<script lang="ts">
<script setup lang="ts">
import {ref, reactive, defineComponent} from 'vue';
import {getBigFile, editBigFile} from "/@/api/system/bigFile";
import {ElMessage} from "element-plus";
export default defineComponent({
name: "editBigUpload",
props:{},
emits: ["success"],
setup(prop, {emit}) {
const formRef = ref<HTMLElement | null>(null);
const isShowDialog = ref<boolean>(false)
const ruleForm = reactive<any>({id:0, name:"", describe:""})
const rules = reactive<any>({
defineOptions({ name: "editBigUpload"})
const emit = defineEmits(["success"])
const formRef = ref<HTMLElement | null>(null);
const isShowDialog = ref<boolean>(false)
const ruleForm = reactive<any>({id:0, name:"", describe:""})
const rules = reactive<any>({
name: [
{ required: true, message: "标题不能为空", trigger: "blur" }
],
})
const openDialog = async (id:number) => {
})
const openDialog = async (id:number) => {
resetForm()
const result = await getBigFile(id).then((res:any) => res.code === 0? res.data || {} : {})
const {name, describe} = result
@ -44,19 +41,22 @@ export default defineComponent({
ruleForm.name = name
ruleForm.describe = describe
isShowDialog.value = true
}
const closeDialog = () => {
}
const closeDialog = () => {
isShowDialog.value = false
}
}
defineExpose({
openDialog
})
const resetForm = () => {
const resetForm = () => {
ruleForm.id = 0
ruleForm.name = ""
ruleForm.describe = ""
}
}
const onSubmit = async () => {
const onSubmit = async () => {
const formWrap = formRef.value as any
if (!formWrap) return;
@ -72,20 +72,7 @@ export default defineComponent({
}
}
});
}
return {
openDialog,
closeDialog,
isShowDialog,
ruleForm,
rules,
onSubmit,
formRef,
resetForm
}
}
})
}
</script>
<style scoped>

38
src/views/bigUpload/index.vue
View File

@ -73,7 +73,7 @@
</div>
</template>
<script lang="ts">
<script setup lang="ts">
import { onMounted, ref, defineComponent, getCurrentInstance} from 'vue';
import getTableData from '/@/views/bigUpload/tableData'
@ -81,14 +81,7 @@ import {addBigFile, deleteBigFile} from "/@/api/system/bigFile";
import {ElMessage, ElMessageBox} from "element-plus";
import EditBigUpload from '/@/views/bigUpload/component/editBigUpload.vue'
export default defineComponent({
name: "bigUpload",
components:{
EditBigUpload
},
setup() {
defineOptions({ name: "bigUpload"})
const {
total,
queryParams,
@ -98,20 +91,13 @@ export default defineComponent({
getBigFileList,
resetBigFileList
} = getTableData()
const editBigUploadRef = ref();
const {proxy} = <any>getCurrentInstance();
const selected = ref<number[]>([])
// 文件上传
const uploadHandle = function () {
proxy.mittBus.emit("bigUploader.uploadFile")
}
onMounted(()=> {
proxy.mittBus.on("bigUploader.uploadFileSuccess", (res:any) => {
//console.log(res)
@ -182,26 +168,6 @@ export default defineComponent({
return ""
}
}
return {
total,
queryParams,
tableData,
queryRef,
resetQuery,
getBigFileList,
resetBigFileList,
uploadHandle,
handleSelectionChange,
byteText,
edit,
del,
delMult,
editBigUploadRef
}
}
})
</script>
<style scoped lang="scss">

17
src/views/chart/head.vue
View File

@ -80,15 +80,6 @@ export default defineComponent({
animation: masked-animation-data-v-b02d8052 4s linear infinite;
-webkit-box-reflect: below -2px -webkit-gradient(linear, left top, left bottom, from(transparent), to(hsla(0, 0%, 100%, 0.1)));
position: relative;
@keyframes masked-animation {
0% {
background-position: 0 0;
}
100% {
background-position: -100% 0;
}
}
position: relative;
&::after {
content: '';
width: 250px;
@ -104,4 +95,12 @@ export default defineComponent({
}
}
}
@keyframes masked-animation {
0% {
background-position: 0 0;
}
100% {
background-position: -100% 0;
}
}
</style>

87
src/views/home/index.vue
View File

@ -65,7 +65,7 @@
</div>
</template>
<script lang="ts">
<script setup lang="ts">
import { toRefs, reactive, defineComponent, onMounted, ref, watch, nextTick, onActivated } from 'vue';
import * as echarts from 'echarts';
import { storeToRefs } from 'pinia';
@ -78,18 +78,16 @@ let global: any = {
homeCharThree: null,
dispose: [null, '', undefined],
};
defineOptions({ name: "home"})
export default defineComponent({
name: 'home',
setup() {
const homeLineRef = ref();
const homePieRef = ref();
const homeBarRef = ref();
const storesTagsViewRoutes = useTagsViewRoutes();
const storesThemeConfig = useThemeConfig();
const { themeConfig } = storeToRefs(storesThemeConfig);
const { isTagsViewCurrenFull } = storeToRefs(storesTagsViewRoutes);
const state = reactive({
const homeLineRef = ref();
const homePieRef = ref();
const homeBarRef = ref();
const storesTagsViewRoutes = useTagsViewRoutes();
const storesThemeConfig = useThemeConfig();
const { themeConfig } = storeToRefs(storesThemeConfig);
const { isTagsViewCurrenFull } = storeToRefs(storesTagsViewRoutes);
const state = reactive({
homeOne: [
{
num1: '125,12',
@ -190,9 +188,10 @@ export default defineComponent({
bgColor: '',
color: '#303133',
},
});
// 折线图
const initLineChart = () => {
});
const { homeOne,homeThree } = toRefs(state);
// 折线图
const initLineChart = () => {
if (!global.dispose.some((b: any) => b === global.homeChartOne)) global.homeChartOne.dispose();
global.homeChartOne = <any>echarts.init(homeLineRef.value, state.charts.theme);
const option = {
@ -272,9 +271,9 @@ export default defineComponent({
};
(<any>global.homeChartOne).setOption(option);
(<any>state.myCharts).push(global.homeChartOne);
};
// 饼图
const initPieChart = () => {
};
// 饼图
const initPieChart = () => {
if (!global.dispose.some((b: any) => b === global.homeChartTwo)) global.homeChartTwo.dispose();
global.homeChartTwo = <any>echarts.init(homePieRef.value, state.charts.theme);
var getname = ['房屋及结构物', '专用设备', '通用设备', '文物和陈列品', '图书、档案'];
@ -357,9 +356,9 @@ export default defineComponent({
};
(<any>global.homeChartTwo).setOption(option);
(<any>state.myCharts).push(global.homeChartTwo);
};
// 柱状图
const initBarChart = () => {
};
// 柱状图
const initBarChart = () => {
if (!global.dispose.some((b: any) => b === global.homeCharThree)) global.homeCharThree.dispose();
global.homeCharThree = <any>echarts.init(homeBarRef.value, state.charts.theme);
const option = {
@ -488,9 +487,9 @@ export default defineComponent({
};
(<any>global.homeCharThree).setOption(option);
(<any>state.myCharts).push(global.homeCharThree);
};
// 批量设置 echarts resize
const initEchartsResizeFun = () => {
};
// 批量设置 echarts resize
const initEchartsResizeFun = () => {
nextTick(() => {
for (let i = 0; i < state.myCharts.length; i++) {
setTimeout(() => {
@ -498,28 +497,28 @@ export default defineComponent({
}, i * 1000);
}
});
};
// 批量设置 echarts resize
const initEchartsResize = () => {
};
// 批量设置 echarts resize
const initEchartsResize = () => {
window.addEventListener('resize', initEchartsResizeFun);
};
// 页面加载时
onMounted(() => {
};
// 页面加载时
onMounted(() => {
initEchartsResize();
});
// 由于页面缓存原因，keep-alive
onActivated(() => {
});
// 由于页面缓存原因，keep-alive
onActivated(() => {
initEchartsResizeFun();
});
// 监听 vuex 中的 tagsview 开启全屏变化，重新 resize 图表，防止不出现/大小不变等
watch(
});
// 监听 vuex 中的 tagsview 开启全屏变化，重新 resize 图表，防止不出现/大小不变等
watch(
() => isTagsViewCurrenFull.value,
() => {
initEchartsResizeFun();
}
);
// 监听 vuex 中是否开启深色主题
watch(
);
// 监听 vuex 中是否开启深色主题
watch(
() => themeConfig.value.isIsDark,
(isIsDark) => {
nextTick(() => {
@ -541,15 +540,7 @@ export default defineComponent({
deep: true,
immediate: true,
}
);
return {
homeLineRef,
homePieRef,
homeBarRef,
...toRefs(state),
};
},
});
);
</script>
<style scoped lang="scss">

72
src/views/login/component/account.vue
View File

@ -80,7 +80,7 @@
</el-form>
</template>
<script lang="ts">
<script setup lang="ts">
import {
toRefs,
reactive,
@ -103,20 +103,17 @@ import { formatAxis } from '/@/utils/formatTime';
import { NextLoading } from '/@/utils/loading';
import {captcha, login} from "/@/api/login";
import GoCaptchaBtn from "/@/components/goCaptcha/GoCaptchaBtn.vue";
export default defineComponent({
name: 'loginAccount',
components: {GoCaptchaBtn},
setup() {
const { t } = useI18n();
const {proxy} = <any>getCurrentInstance();
const storesThemeConfig = useThemeConfig();
const { themeConfig } = storeToRefs(storesThemeConfig);
const route = useRoute();
const router = useRouter();
const loginForm = ref(null)
const checkCaptchaResult = ref('default')
const verifyStatus = ref(0)
const state = reactive({
defineOptions({ name: "loginAccount"})
const { t } = useI18n();
const {proxy} = <any>getCurrentInstance();
const storesThemeConfig = useThemeConfig();
const { themeConfig } = storeToRefs(storesThemeConfig);
const route = useRoute();
const router = useRouter();
const loginForm = ref(null)
const checkCaptchaResult = ref('default')
const verifyStatus = ref(0)
const state = reactive({
isShowPassword: false,
ruleForm: {
username: 'demo',
@ -136,24 +133,25 @@ export default defineComponent({
signIn: false,
},
captchaSrc:'',
});
onMounted(() => {
});
const { isShowPassword,ruleForm,formRules,loading,captchaSrc} = toRefs(state);
onMounted(() => {
getCaptcha();
});
const getCaptcha = () => {
});
const getCaptcha = () => {
// 验证码V1版
captcha().then((res:any)=>{
state.captchaSrc = res.data.img
state.ruleForm.verifyKey = res.data.key
verifyStatus.value = res.data.verifyStatus
})
};
// 时间获取
const currentTime = computed(() => {
};
// 时间获取
const currentTime = computed(() => {
return formatAxis(new Date());
});
// 登录
const onSignIn = async () => {
});
// 登录
const onSignIn = async () => {
if(state.loading.signIn){
return
}
@ -196,9 +194,9 @@ export default defineComponent({
})
}
})
};
// 登录成功后的跳转
const signInSuccess = () => {
};
// 登录成功后的跳转
const signInSuccess = () => {
// 初始化登录成功时间问候语
let currentTimeInfo = currentTime.value;
// 登录成功，跳到转首页
@ -218,24 +216,12 @@ export default defineComponent({
ElMessage.success(`${currentTimeInfo}，${signInText}`);
// 添加 loading，防止第一次进入界面时出现短暂空白
NextLoading.start();
};
};
const handleVerifyCodeConfirm = (data:{key:string,dots:string})=>{
const handleVerifyCodeConfirm = (data:{key:string,dots:string})=>{
state.ruleForm.verifyCode = data.dots
state.ruleForm.verifyKey = data.key
}
return {
onSignIn,
getCaptcha,
checkCaptchaResult,
handleVerifyCodeConfirm,
loginForm,
verifyStatus,
...toRefs(state),
};
},
});
}
</script>

17
src/views/login/component/mobile.vue
View File

@ -29,8 +29,8 @@
</el-form>
</template>
<script lang="ts">
import { toRefs, reactive, defineComponent } from 'vue';
<script setup lang="ts">
import {ref} from 'vue';
// 定义接口来定义对象的类型
interface LoginMobileState {
@ -39,20 +39,11 @@ interface LoginMobileState {
}
// 定义对象与类型
const ruleForm: LoginMobileState = {
const ruleForm = ref<LoginMobileState>({
userName: '',
code: '',
};
export default defineComponent({
name: 'loginMobile',
setup() {
const state = reactive({ ruleForm });
return {
...toRefs(state),
};
},
});
defineOptions({ name: "loginMobile"})
</script>
<style scoped lang="scss">

24
src/views/login/component/scan.vue
View File

@ -5,31 +5,25 @@
</div>
</template>
<script lang="ts">
<script setup lang="ts">
import { ref, defineComponent, onMounted } from 'vue';
import QRCode from 'qrcodejs2-fixes';
export default defineComponent({
name: 'loginScan',
setup() {
const qrcodeRef = ref<HTMLElement | null>(null);
// 初始化生成二维码
const initQrcode = () => {
defineOptions({ name: "loginScan"})
const qrcodeRef = ref<HTMLElement | null>(null);
// 初始化生成二维码
const initQrcode = () => {
(qrcodeRef.value as HTMLElement).innerHTML = '';
new QRCode(qrcodeRef.value, {
text: `https://qm.qq.com/cgi-bin/qm/qr?k=RdUY97Vx0T0vZ_1OOu-X1yFNkWgDwbjC&jump_from=webapi`,
text: `https://qm.qq.com/cgi-bin/qm/qr?k=CDO9yYdygFMKdQihlUXj4-Y0RDEhPTsh&authKey=vw/uQT5H4L/Kb0zT1gj7dd0PVtUDm9RdWqz4cztJb/QmPaSdyS/yeRHhjZaUj43v&noverify=0`,
width: 260,
height: 260,
colorDark: '#000000',
colorLight: '#ffffff',
});
};
// 页面加载时
onMounted(() => {
};
// 页面加载时
onMounted(() => {
initQrcode();
});
return { qrcodeRef };
},
});
</script>

35
src/views/login/index.vue
View File

@ -38,7 +38,7 @@
</div>
</template>
<script lang="ts">
<script setup lang="ts">
import { toRefs, reactive, computed, defineComponent, onMounted } from 'vue';
import { storeToRefs } from 'pinia';
import { useThemeConfig } from '/@/stores/themeConfig';
@ -54,32 +54,21 @@ interface LoginState {
tabsActiveName: string;
isScan: boolean;
}
export default defineComponent({
name: 'loginIndex',
components: { Account, Mobile, Scan },
setup() {
const storesThemeConfig = useThemeConfig();
const { themeConfig } = storeToRefs(storesThemeConfig);
const state = reactive<LoginState>({
defineOptions({ name: "loginIndex"})
const storesThemeConfig = useThemeConfig();
const { themeConfig } = storeToRefs(storesThemeConfig);
const state = reactive<LoginState>({
tabsActiveName: 'account',
isScan: false,
});
// 获取布局配置信息
const getThemeConfig = computed(() => {
});
const { tabsActiveName,isScan } = toRefs(state);
// 获取布局配置信息
const getThemeConfig = computed(() => {
return themeConfig.value;
});
// 页面加载时
onMounted(() => {
});
// 页面加载时
onMounted(() => {
NextLoading.done();
});
return {
logoMini,
loginIconTwo,
getThemeConfig,
...toRefs(state),
};
},
});
</script>

58
src/views/system/config/component/editConfig.vue
View File

@ -34,7 +34,7 @@
</div>
</template>
<script lang="ts">
<script setup lang="ts">
import { reactive, toRefs, defineComponent,ref, unref } from 'vue';
import {ElMessage} from "element-plus";
import {addConfig, editConfig, getConfig} from "/@/api/system/config";
@ -51,18 +51,16 @@ interface DicState {
ruleForm: RuleFormState;
rules:{}
}
export default defineComponent({
name: 'systemEditDicData',
props:{
defineOptions({ name: "apiV1SystemConfigEdit"})
const props = defineProps({
sysYesNoOptions:{
type:Array,
default:()=>[]
}
},
setup(prop,{emit}) {
const formRef = ref<HTMLElement | null>(null);
const state = reactive<DicState>({
})
const emit = defineEmits(['dataList'])
const formRef = ref<HTMLElement | null>(null);
const state = reactive<DicState>({
isShowDialog: false,
ruleForm: {
configId: 0,
@ -83,9 +81,10 @@ export default defineComponent({
{ required: true, message: "参数键值不能为空", trigger: "blur" }
]
}
});
// 打开弹窗
const openDialog = (row: RuleFormState|null) => {
});
const { isShowDialog,ruleForm,rules } = toRefs(state);
// 打开弹窗
const openDialog = (row: RuleFormState|null) => {
resetForm();
if (row){
getConfig(row.configId).then((res:any)=>{
@ -96,8 +95,9 @@ export default defineComponent({
state.ruleForm = row;
}
state.isShowDialog = true;
};
const resetForm = ()=>{
};
defineExpose({ openDialog})
const resetForm = ()=>{
state.ruleForm = {
configId: 0,
configName: '',
@ -106,17 +106,17 @@ export default defineComponent({
configType: '0',
remark: '',
}
};
// 关闭弹窗
const closeDialog = () => {
};
// 关闭弹窗
const closeDialog = () => {
state.isShowDialog = false;
};
// 取消
const onCancel = () => {
};
// 取消
const onCancel = () => {
closeDialog();
};
// 新增
const onSubmit = () => {
};
// 新增
const onSubmit = () => {
const formWrap = unref(formRef) as any;
if (!formWrap) return;
formWrap.validate((valid: boolean) => {
@ -138,15 +138,5 @@ export default defineComponent({
}
}
});
};
return {
openDialog,
closeDialog,
onCancel,
onSubmit,
formRef,
...toRefs(state),
};
},
});
};
</script>

95
src/views/system/config/index.vue
View File

@ -8,7 +8,6 @@
v-model="tableData.param.configName"
placeholder="请输入参数名称"
clearable
size="default"
@keyup.enter.native="dataList"
/>
</el-form-item>
@ -17,7 +16,6 @@
v-model="tableData.param.configKey"
placeholder="请输入参数键名"
clearable
size="default"
@keyup.enter.native="dataList"
/>
</el-form-item>
@ -26,7 +24,6 @@
v-model="tableData.param.configType"
placeholder="系统内置"
clearable
size="default"
style="width: 240px"
>
<el-option v-for="dict in sys_yes_no"
@ -38,7 +35,6 @@
<el-form-item label="创建时间" prop="dateRange">
<el-date-picker
v-model="tableData.param.dateRange"
size="default"
style="width: 240px"
value-format="YYYY-MM-DD"
type="daterange"
@ -103,7 +99,7 @@
</div>
</template>
<script lang="ts">
<script setup lang="ts">
import {toRefs,reactive,onMounted,ref,defineComponent,unref,getCurrentInstance} from 'vue';
import { ElMessageBox, ElMessage,FormInstance} from 'element-plus';
import EditConfig from '/@/views/system/config/component/editConfig.vue';
@ -135,17 +131,13 @@ interface TableDataState {
};
};
}
export default defineComponent({
name: 'apiV1SystemDictDataList',
components: { EditConfig },
setup() {
const {proxy} = getCurrentInstance() as any;
const addDicRef = ref();
const editDicRef = ref();
const queryRef = ref();
const {sys_yes_no} = proxy.useDict('sys_yes_no')
const state = reactive<TableDataState>({
defineOptions({ name: "apiV1SystemConfigList"})
const {proxy} = getCurrentInstance() as any;
const addDicRef = ref();
const editDicRef = ref();
const queryRef = ref();
const {sys_yes_no} = proxy.useDict('sys_yes_no')
const state = reactive<TableDataState>({
ids:[],
tableData: {
data: [],
@ -160,27 +152,28 @@ export default defineComponent({
configType:''
},
},
});
// 初始化表格数据
const initTableData = () => {
});
const { tableData } = toRefs(state);
// 初始化表格数据
const initTableData = () => {
dataList()
};
const dataList=()=>{
};
const dataList=()=>{
getConfigList(state.tableData.param).then((res:any)=>{
state.tableData.data = res.data.list;
state.tableData.total = res.data.total;
});
};
// 打开新增字典弹窗
const onOpenAddDic = () => {
};
// 打开新增字典弹窗
const onOpenAddDic = () => {
editDicRef.value.openDialog();
};
// 打开修改字典弹窗
const onOpenEditDic = (row: TableDataRow) => {
};
// 打开修改字典弹窗
const onOpenEditDic = (row: TableDataRow) => {
editDicRef.value.openDialog(row);
};
// 删除字典
const onRowDel = (row: TableDataRow) => {
};
// 删除字典
const onRowDel = (row: TableDataRow|null) => {
let msg = '你确定要删除所选数据？';
let ids:number[] = [] ;
if(row){
@ -205,39 +198,23 @@ export default defineComponent({
})
})
.catch(() => {});
};
// 页面加载时
onMounted(() => {
};
// 页面加载时
onMounted(() => {
initTableData();
});
/** 重置按钮操作 */
const resetQuery = (formEl: FormInstance | undefined) => {
});
/** 重置按钮操作 */
const resetQuery = (formEl: FormInstance | undefined) => {
if (!formEl) return
formEl.resetFields()
dataList()
};
// 多选框选中数据
const handleSelectionChange = (selection:TableDataRow[])=> {
};
// 多选框选中数据
const handleSelectionChange = (selection:TableDataRow[])=> {
state.ids = selection.map(item => item.configId)
};
// 参数系统内置字典翻译
const typeFormat=(row:TableDataRow) => {
};
// 参数系统内置字典翻译
const typeFormat=(row:TableDataRow) => {
return proxy.selectDictLabel(unref(sys_yes_no), row.configType);
};
return {
addDicRef,
editDicRef,
queryRef,
sys_yes_no,
onOpenAddDic,
onOpenEditDic,
onRowDel,
dataList,
resetQuery,
handleSelectionChange,
typeFormat,
...toRefs(state),
};
},
});
};
</script>

83
src/views/system/dept/component/editDept.vue
View File

@ -71,7 +71,7 @@
<select-user ref="selectUserRef" @selectUser="confirmUser" :selectedUsers="deptUser"></select-user>
</template>
<script lang="ts">
<script setup lang="ts">
import {reactive, toRefs, defineComponent, getCurrentInstance,ref,unref} from 'vue';
import {addDept,editDept, getDeptList} from "/@/api/system/dept";
import {getUserByIds} from '/@/api/system/user';
@ -101,19 +101,13 @@ interface DeptSate {
deptData: Array<TableDataRow>;
rules: object;
}
export default defineComponent({
name: 'systemEditDept',
components:{
selectUser,
},
emits:['deptList'],
setup(prop,{emit}) {
const {proxy} = getCurrentInstance() as any;
const formRef = ref<HTMLElement | null>(null);
const selectUserRef = ref();
const deptUser = ref([]);
const state = reactive<DeptSate>({
defineOptions({ name: "systemEditDept"})
const emit = defineEmits(['deptList'])
const {proxy} = getCurrentInstance() as any;
const formRef = ref<HTMLElement | null>(null);
const selectUserRef = ref();
const deptUser = ref([]);
const state = reactive<DeptSate>({
isShowDialog: false,
ruleForm: {
deptId:0,
@ -131,9 +125,10 @@ export default defineComponent({
{required: true, message: "部门名称不能为空", trigger: "blur"},
]
}
});
// 打开弹窗
const openDialog = (row?: RuleFormState|number) => {
});
const { isShowDialog, ruleForm, deptData,rules } = toRefs(state);
// 打开弹窗
const openDialog = (row?: RuleFormState|number) => {
resetForm()
getDeptList().then((res:any)=>{
state.deptData = proxy.handleTree(res.data.deptList??[], "deptId","parentId");
@ -160,17 +155,18 @@ export default defineComponent({
deptUser.value = [];
}
state.isShowDialog = true;
};
// 关闭弹窗
const closeDialog = () => {
};
defineExpose({openDialog})
// 关闭弹窗
const closeDialog = () => {
state.isShowDialog = false;
};
// 取消
const onCancel = () => {
};
// 取消
const onCancel = () => {
closeDialog();
};
// 新增
const onSubmit = () => {
};
// 新增
const onSubmit = () => {
const formWrap = unref(formRef) as any;
if (!formWrap) return;
formWrap.validate((valid: boolean) => {
@ -192,8 +188,8 @@ export default defineComponent({
}
}
});
};
const resetForm = ()=>{
};
const resetForm = ()=>{
state.ruleForm = {
deptId:0,
parentId: 0, // 上级部门
@ -204,13 +200,13 @@ export default defineComponent({
email: '',
status: 1,
}
};
};
const handleClose = (data:any,key:number) => {
const handleClose = (data:any,key:number) => {
deptUser.value.splice(key, 1);
state.ruleForm.leader = deptUser.value.map((item:any) => item.id)
};
const confirmUser = (data:any[]) => {
};
const confirmUser = (data:any[]) => {
let leaderArr = state.ruleForm.leader??[];
if(data.length>0){
data.map((item:any)=>{
@ -225,26 +221,11 @@ export default defineComponent({
deptUser.value = []
state.ruleForm.leader = []
}
};
//选择用户
const handleSelectUser = () =>{
};
//选择用户
const handleSelectUser = () =>{
selectUserRef.value.openDialog()
};
return {
openDialog,
closeDialog,
onCancel,
onSubmit,
selectUserRef,
formRef,
deptUser,
confirmUser,
handleClose,
handleSelectUser,
...toRefs(state),
};
},
});
};
</script>
<style>
.u-m-r-10{

59
src/views/system/dept/index.vue
View File

@ -57,7 +57,7 @@
</div>
</template>
<script lang="ts">
<script setup lang="ts">
import { ref, toRefs, reactive, onMounted, defineComponent,getCurrentInstance } from 'vue';
import { ElMessageBox, ElMessage } from 'element-plus';
import EditDept from '/@/views/system/dept/component/editDept.vue';
@ -86,14 +86,10 @@ interface TableDataState {
};
};
}
export default defineComponent({
name: 'systemDept',
components: { EditDept },
setup() {
const {proxy} = getCurrentInstance() as any;
const editDeptRef = ref();
const state = reactive<TableDataState>({
defineOptions({ name: "systemDept"})
const {proxy} = getCurrentInstance() as any;
const editDeptRef = ref();
const state = reactive<TableDataState>({
tableData: {
data: [],
loading: false,
@ -104,27 +100,28 @@ export default defineComponent({
status:''
},
},
});
// 初始化表格数据
const initTableData = () => {
});
const { tableData } = toRefs(state);
// 初始化表格数据
const initTableData = () => {
deptList();
};
const deptList = ()=>{
};
const deptList = ()=>{
getDeptList(state.tableData.param).then((res:any)=>{
state.tableData.data = proxy.handleTree(res.data.deptList??[], "deptId","parentId");
});
};
// 打开新增菜单弹窗
const onOpenAddDept = (row?: TableDataRow) => {
};
// 打开新增菜单弹窗
const onOpenAddDept = (row?: TableDataRow) => {
editDeptRef.value.openDialog(row?.deptId);
};
// 打开编辑菜单弹窗
const onOpenEditDept = (row: TableDataRow) => {
};
// 打开编辑菜单弹窗
const onOpenEditDept = (row: TableDataRow) => {
editDeptRef.value.openDialog(row);
};
// 删除当前行
const onTabelRowDel = (row: TableDataRow) => {
};
// 删除当前行
const onTabelRowDel = (row: TableDataRow) => {
ElMessageBox.confirm(`此操作将永久删除部门：${row.deptName}, 是否继续?`, '提示', {
confirmButtonText: '删除',
cancelButtonText: '取消',
@ -137,19 +134,9 @@ export default defineComponent({
})
})
.catch(() => {});
};
// 页面加载时
onMounted(() => {
};
// 页面加载时
onMounted(() => {
initTableData();
});
return {
editDeptRef,
deptList,
onOpenAddDept,
onOpenEditDept,
onTabelRowDel,
...toRefs(state),
};
},
});
</script>

59
src/views/system/dict/component/editDic.vue
View File

@ -10,8 +10,8 @@
</el-form-item>
<el-form-item label="状态" prop="status">
<el-radio-group v-model="ruleForm.status">
<el-radio :label="1" >启用</el-radio>
<el-radio :label="0" >禁用</el-radio>
<el-radio :value="1" >启用</el-radio>
<el-radio :value="0" >禁用</el-radio>
</el-radio-group>
</el-form-item>
<el-form-item label="备注" prop="remark">
@ -28,7 +28,7 @@
</div>
</template>
<script lang="ts">
<script setup lang="ts">
import { reactive, toRefs, defineComponent,ref, unref } from 'vue';
import { getType,addType,editType } from '/@/api/system/dict/type';
import {ElMessage} from "element-plus";
@ -44,12 +44,10 @@ interface DicState {
ruleForm: RuleFormState;
rules:{}
}
export default defineComponent({
name: 'systemEditDic',
setup(prop,{emit}) {
const formRef = ref<HTMLElement | null>(null);
const state = reactive<DicState>({
defineOptions({ name: "systemEditDic"})
const emit = defineEmits(['typeList']);
const formRef = ref<HTMLElement | null>(null);
const state = reactive<DicState>({
isShowDialog: false,
ruleForm: {
dictId:0,
@ -66,9 +64,10 @@ export default defineComponent({
{ required: true, message: "字典类型不能为空", trigger: "blur" }
]
}
});
// 打开弹窗
const openDialog = (row: RuleFormState|null) => {
});
const { isShowDialog,ruleForm,rules } = toRefs(state);
// 打开弹窗
const openDialog = (row: RuleFormState|null) => {
resetForm();
if (row){
getType(row.dictId).then((res:any)=>{
@ -77,8 +76,9 @@ export default defineComponent({
state.ruleForm = row;
}
state.isShowDialog = true;
};
const resetForm = ()=>{
};
defineExpose({ openDialog})
const resetForm = ()=>{
state.ruleForm = {
dictId:0,
dictName:'',
@ -86,17 +86,17 @@ export default defineComponent({
status:1,
remark:''
}
};
// 关闭弹窗
const closeDialog = () => {
};
// 关闭弹窗
const closeDialog = () => {
state.isShowDialog = false;
};
// 取消
const onCancel = () => {
};
// 取消
const onCancel = () => {
closeDialog();
};
// 新增
const onSubmit = () => {
};
// 新增
const onSubmit = () => {
const formWrap = unref(formRef) as any;
if (!formWrap) return;
formWrap.validate((valid: boolean) => {
@ -118,17 +118,6 @@ export default defineComponent({
}
}
});
};
};
return {
openDialog,
closeDialog,
onCancel,
onSubmit,
formRef,
...toRefs(state),
};
},
});
</script>

64
src/views/system/dict/component/editDicData.vue
View File

@ -26,8 +26,8 @@
<el-form-item label="状态" prop="status">
<el-radio-group v-model="ruleForm.status">
<el-radio :label="1" >启用</el-radio>
<el-radio :label="0" >禁用</el-radio>
<el-radio :value="1" >启用</el-radio>
<el-radio :value="0" >禁用</el-radio>
</el-radio-group>
</el-form-item>
<el-form-item label="备注" prop="remark">
@ -44,7 +44,7 @@
</div>
</template>
<script lang="ts">
<script setup lang="ts">
import { reactive, toRefs, defineComponent,ref, unref } from 'vue';
import { getData,addData,editData } from '/@/api/system/dict/data';
import {ElMessage} from "element-plus";
@ -63,18 +63,16 @@ interface DicState {
ruleForm: RuleFormState;
rules:{}
}
export default defineComponent({
name: 'systemEditDicData',
props:{
defineOptions({ name: "systemEditDicData"})
const prop = defineProps({
dictType:{
type:String,
default:()=>''
default:''
}
},
setup(prop,{emit}) {
const formRef = ref<HTMLElement | null>(null);
const state = reactive<DicState>({
})
const emit = defineEmits(['dataList']);
const formRef = ref<HTMLElement | null>(null);
const state = reactive<DicState>({
isShowDialog: false,
ruleForm: {
dictCode: 0,
@ -97,9 +95,10 @@ export default defineComponent({
{ required: true, message: "数据顺序不能为空", trigger: "blur" }
]
}
});
// 打开弹窗
const openDialog = (row: RuleFormState|null) => {
});
const { isShowDialog,ruleForm,rules } = toRefs(state);
// 打开弹窗
const openDialog = (row: RuleFormState|null) => {
resetForm();
if (row){
getData(row.dictCode).then((res:any)=>{
@ -108,8 +107,9 @@ export default defineComponent({
state.ruleForm = row;
}
state.isShowDialog = true;
};
const resetForm = ()=>{
};
defineExpose({ openDialog})
const resetForm = ()=>{
state.ruleForm = {
dictCode: 0,
dictLabel: '',
@ -120,17 +120,17 @@ export default defineComponent({
remark: '',
dictType:prop.dictType
}
};
// 关闭弹窗
const closeDialog = () => {
};
// 关闭弹窗
const closeDialog = () => {
state.isShowDialog = false;
};
// 取消
const onCancel = () => {
};
// 取消
const onCancel = () => {
closeDialog();
};
// 新增
const onSubmit = () => {
};
// 新增
const onSubmit = () => {
const formWrap = unref(formRef) as any;
if (!formWrap) return;
formWrap.validate((valid: boolean) => {
@ -152,15 +152,5 @@ export default defineComponent({
}
}
});
};
return {
openDialog,
closeDialog,
onCancel,
onSubmit,
formRef,
...toRefs(state),
};
},
});
};
</script>

83
src/views/system/dict/dataList.vue
View File

@ -91,15 +91,13 @@
</div>
</template>
<script lang="ts">
<script setup lang="ts">
import { toRefs, reactive, onMounted, ref, defineComponent } from 'vue';
import { ElMessageBox, ElMessage,FormInstance} from 'element-plus';
import EditDic from '/@/views/system/dict/component/editDicData.vue';
import {getDataList,deleteData} from "/@/api/system/dict/data";
import { useRoute } from 'vue-router';
// 定义接口来定义对象的类型
interface TableDataRow {
dictCode: number;
@ -126,16 +124,12 @@ interface TableDataState {
};
};
}
export default defineComponent({
name: 'apiV1SystemDictDataList',
components: { EditDic },
setup() {
const route = useRoute();
const addDicRef = ref();
const editDicRef = ref();
const queryRef = ref();
const state = reactive<TableDataState>({
defineOptions({ name: "apiV1SystemDictDataList"})
const route = useRoute();
const addDicRef = ref();
const editDicRef = ref();
const queryRef = ref();
const state = reactive<TableDataState>({
ids:[],
tableData: {
data: [],
@ -149,27 +143,28 @@ export default defineComponent({
status:''
},
},
});
// 初始化表格数据
const initTableData = () => {
});
const { tableData } = toRefs(state);
// 初始化表格数据
const initTableData = () => {
dataList()
};
const dataList=()=>{
};
const dataList=()=>{
getDataList(state.tableData.param).then((res:any)=>{
state.tableData.data = res.data.list;
state.tableData.total = res.data.total;
});
};
// 打开新增字典弹窗
const onOpenAddDic = () => {
};
// 打开新增字典弹窗
const onOpenAddDic = () => {
editDicRef.value.openDialog();
};
// 打开修改字典弹窗
const onOpenEditDic = (row: TableDataRow) => {
};
// 打开修改字典弹窗
const onOpenEditDic = (row: TableDataRow) => {
editDicRef.value.openDialog(row);
};
// 删除字典
const onRowDel = (row: TableDataRow) => {
};
// 删除字典
const onRowDel = (row: TableDataRow|null) => {
let msg = '你确定要删除所选数据？';
let ids:number[] = [] ;
if(row){
@ -194,35 +189,21 @@ export default defineComponent({
})
})
.catch(() => {});
};
// 页面加载时
onMounted(() => {
};
// 页面加载时
onMounted(() => {
const dictType = route.params && route.params.dictType;
state.tableData.param.dictType = <string>dictType
initTableData();
});
/** 重置按钮操作 */
const resetQuery = (formEl: FormInstance | undefined) => {
});
/** 重置按钮操作 */
const resetQuery = (formEl: FormInstance | undefined) => {
if (!formEl) return
formEl.resetFields()
dataList()
};
// 多选框选中数据
const handleSelectionChange = (selection:TableDataRow[])=> {
};
// 多选框选中数据
const handleSelectionChange = (selection:TableDataRow[])=> {
state.ids = selection.map(item => item.dictCode)
};
return {
addDicRef,
editDicRef,
queryRef,
onOpenAddDic,
onOpenEditDic,
onRowDel,
dataList,
resetQuery,
handleSelectionChange,
...toRefs(state),
};
},
});
};
</script>

80
src/views/system/dict/index.vue
View File

@ -109,7 +109,7 @@
</div>
</template>
<script lang="ts">
<script setup lang="ts">
import { toRefs, reactive, onMounted, ref, defineComponent } from 'vue';
import { ElMessageBox, ElMessage,FormInstance} from 'element-plus';
import EditDic from '/@/views/system/dict/component/editDic.vue';
@ -141,15 +141,11 @@ interface TableDataState {
};
};
}
export default defineComponent({
name: 'systemDic',
components: { EditDic },
setup() {
const addDicRef = ref();
const editDicRef = ref();
const queryRef = ref();
const state = reactive<TableDataState>({
defineOptions({ name: "systemDic"})
const addDicRef = ref();
const editDicRef = ref();
const queryRef = ref();
const state = reactive<TableDataState>({
ids:[],
tableData: {
data: [],
@ -164,27 +160,28 @@ export default defineComponent({
dateRange:[],
},
},
});
// 初始化表格数据
const initTableData = () => {
});
const { tableData } = toRefs(state);
// 初始化表格数据
const initTableData = () => {
typeList()
};
const typeList=()=>{
};
const typeList=()=>{
getTypeList(state.tableData.param).then((res:any)=>{
state.tableData.data = res.data.dictTypeList;
state.tableData.total = res.data.total;
});
};
// 打开新增字典弹窗
const onOpenAddDic = () => {
};
// 打开新增字典弹窗
const onOpenAddDic = () => {
editDicRef.value.openDialog();
};
// 打开修改字典弹窗
const onOpenEditDic = (row: TableDataRow) => {
};
// 打开修改字典弹窗
const onOpenEditDic = (row: TableDataRow) => {
editDicRef.value.openDialog(row);
};
// 删除字典
const onRowDel = (row: TableDataRow) => {
};
// 删除字典
const onRowDel = (row: TableDataRow|null) => {
let msg = '你确定要删除所选数据？';
let ids:number[] = [] ;
if(row){
@ -209,33 +206,20 @@ export default defineComponent({
})
})
.catch(() => {});
};
// 页面加载时
onMounted(() => {
};
// 页面加载时
onMounted(() => {
initTableData();
});
/** 重置按钮操作 */
const resetQuery = (formEl: FormInstance | undefined) => {
});
/** 重置按钮操作 */
const resetQuery = (formEl: FormInstance | undefined) => {
if (!formEl) return
formEl.resetFields()
typeList()
};
// 多选框选中数据
const handleSelectionChange = (selection:TableDataRow[])=> {
};
// 多选框选中数据
const handleSelectionChange = (selection:TableDataRow[])=> {
state.ids = selection.map(item => item.dictId)
};
return {
addDicRef,
editDicRef,
queryRef,
onOpenAddDic,
onOpenEditDic,
onRowDel,
typeList,
resetQuery,
handleSelectionChange,
...toRefs(state),
};
},
});
};
</script>

101
src/views/system/menu/component/editMenu.vue
View File

@ -25,9 +25,9 @@
<el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24" >
<el-form-item label="菜单类型" prop="menuType">
<el-radio-group v-model="ruleForm.menuType">
<el-radio label="0">目录</el-radio>
<el-radio label="1">菜单</el-radio>
<el-radio label="2">按钮</el-radio>
<el-radio value="0">目录</el-radio>
<el-radio value="1">菜单</el-radio>
<el-radio value="2">按钮</el-radio>
</el-radio-group>
</el-form-item>
</el-col>
@ -98,7 +98,7 @@
<el-radio
v-for="dict in visibleOptions"
:key="dict.value"
:label="dict.value"
:value="dict.value"
>{{ dict.label }}</el-radio>
</el-radio-group>
</el-form-item>
@ -106,32 +106,32 @@
<el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" >
<el-form-item label="页面缓存">
<el-radio-group v-model="ruleForm.isKeepAlive">
<el-radio :label="1">缓存</el-radio>
<el-radio :label="0">不缓存</el-radio>
<el-radio :value="1">缓存</el-radio>
<el-radio :value="0">不缓存</el-radio>
</el-radio-group>
</el-form-item>
</el-col>
<el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" >
<el-form-item label="是否固定">
<el-radio-group v-model="ruleForm.isAffix">
<el-radio :label="1">固定</el-radio>
<el-radio :label="0">不固定</el-radio>
<el-radio :value="1">固定</el-radio>
<el-radio :value="0">不固定</el-radio>
</el-radio-group>
</el-form-item>
</el-col>
<el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" >
<el-form-item label="是否外链">
<el-radio-group v-model="ruleForm.isLink" :disabled="ruleForm.isIframe===1">
<el-radio :label="1">是</el-radio>
<el-radio :label="0">否</el-radio>
<el-radio :value="1">是</el-radio>
<el-radio :value="0">否</el-radio>
</el-radio-group>
</el-form-item>
</el-col>
<el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" >
<el-form-item label="是否内嵌">
<el-radio-group v-model="ruleForm.isIframe" @change="onSelectIframeChange">
<el-radio :label="1">是</el-radio>
<el-radio :label="0">否</el-radio>
<el-radio :value="1">是</el-radio>
<el-radio :value="0">否</el-radio>
</el-radio-group>
</el-form-item>
</el-col>
@ -148,18 +148,14 @@
</div>
</template>
<script lang="ts">
<script setup lang="ts">
import { reactive, toRefs, defineComponent,ref,unref,getCurrentInstance,nextTick } from 'vue';
import IconSelector from '/@/components/iconSelector/index.vue';
import { refreshBackEndControlRoutes } from "/@/router/backEnd";
import {getMenuParams, addMenu, getMenuInfo, updateMenu} from "/@/api/system/menu";
import {ElMessage} from "element-plus"
export default defineComponent({
name: 'systemEditMenu',
components: { IconSelector },
props:{
defineOptions({ name: "systemEditMenu"})
const props = defineProps({
visibleOptions:{
type:Array,
default:()=>[],
@ -168,11 +164,11 @@ export default defineComponent({
type:String,
default:()=>'add'
}
},
setup(props,{emit}) {
const ruleFormRef = ref<HTMLElement | null>(null);
const {proxy} = getCurrentInstance() as any;
const state = reactive({
})
const emit = defineEmits(['menuList']);
const ruleFormRef = ref<HTMLElement | null>(null);
const {proxy} = getCurrentInstance() as any;
const state = reactive({
loading: false,
isShowDialog: false,
roles:[],
@ -215,10 +211,10 @@ export default defineComponent({
],
},
menuData: [], // 上级菜单数据
});
// 打开弹窗
const openDialog = (row: any) => {
});
const {ruleForm, rules, menuData, loading, isShowDialog, roles} = toRefs(state);
// 打开弹窗
const openDialog = (row: any) => {
initForm();
nextTick(()=>{
//获取角色信息
@ -260,22 +256,22 @@ export default defineComponent({
state.isShowDialog = true;
state.loading = false;
})
};
// 关闭弹窗
const closeDialog = () => {
};
// 关闭弹窗
const closeDialog = () => {
state.isShowDialog = false;
};
// 是否内嵌下拉改变
const onSelectIframeChange = () => {
};
// 是否内嵌下拉改变
const onSelectIframeChange = () => {
if (state.ruleForm.isIframe===1) state.ruleForm.isLink = 1;
else state.ruleForm.isLink = 0;
};
// 取消
const onCancel = () => {
};
// 取消
const onCancel = () => {
closeDialog();
};
// 新增
const onSubmit = () => {
};
// 新增
const onSubmit = () => {
const formWrap = unref(ruleFormRef) as any;
if (!formWrap) return;
formWrap.validate((valid: boolean) => {
@ -304,12 +300,12 @@ export default defineComponent({
}
}
})
};
// 重置菜单session
const resetMenuSession = () => {
};
// 重置菜单session
const resetMenuSession = () => {
refreshBackEndControlRoutes();
};
const initForm=()=>{
};
const initForm=()=>{
state.ruleForm = {
id:undefined,
pid: 0, // 上级菜单
@ -329,17 +325,6 @@ export default defineComponent({
linkUrl: '', // 外链/内嵌时链接地址（http:xxx.com），开启外链条件，`1、isLink:true 2、链接地址不为空`
isIframe: 0, // 是否内嵌，开启条件，`1、isIframe:true 2、链接地址不为空`
}
};
return {
ruleFormRef,
openDialog,
closeDialog,
onSelectIframeChange,
onCancel,
onSubmit,
resetMenuSession,
...toRefs(state),
};
},
});
};
defineExpose({ openDialog, resetMenuSession})
</script>

68
src/views/system/menu/index.vue
View File

@ -80,38 +80,36 @@
</div>
</template>
<script lang="ts">
<script setup lang="ts">
import {ref, toRefs, reactive, onBeforeMount, defineComponent, getCurrentInstance, unref} from 'vue';
import { ElMessageBox, ElMessage } from 'element-plus';
import EditMenu from '/@/views/system/menu/component/editMenu.vue';
import {delMenu, getMenuList} from "/@/api/system/menu";
export default defineComponent({
name: 'apiV1SystemAuthMenuList',
components: { EditMenu },
setup() {
const editMenuRef = ref();
const state = reactive({
defineOptions({ name: "apiV1SystemAuthMenuList"})
const editMenuRef = ref();
const state = reactive({
queryParams:{
title:"",
component:""
},
menuTableData:[],
});
const {proxy} = getCurrentInstance() as any;
const {sys_show_hide} = proxy.useDict('sys_show_hide')
const acType = ref('add')
// 打开新增菜单弹窗
const onOpenAddMenu = (row:any) => {
});
const {queryParams,menuTableData} = toRefs(state);
const {proxy} = getCurrentInstance() as any;
const {sys_show_hide} = proxy.useDict('sys_show_hide')
const acType = ref('add')
// 打开新增菜单弹窗
const onOpenAddMenu = (row:any) => {
acType.value = 'add'
editMenuRef.value.openDialog(row);
};
// 打开编辑菜单弹窗
const onOpenEditMenu = (row: any) => {
};
// 打开编辑菜单弹窗
const onOpenEditMenu = (row: any) => {
acType.value='edit'
editMenuRef.value.openDialog(row);
};
// 删除当前行
const onTabelRowDel = (row: any) => {
};
// 删除当前行
const onTabelRowDel = (row: any) => {
ElMessageBox.confirm(`此操作将永久删除菜单：“${row.title}”, 是否继续?`, '提示', {
confirmButtonText: '删除',
cancelButtonText: '取消',
@ -125,33 +123,19 @@ export default defineComponent({
})
})
.catch(() => {});
};
const formatIsHide = (row:any)=>{
};
const formatIsHide = (row:any)=>{
return proxy.selectDictLabel(unref(sys_show_hide), ''+row.isHide);
};
onBeforeMount(()=>{
};
onBeforeMount(()=>{
menuList()
});
const handleQuery=() => {
});
const handleQuery=() => {
menuList();
};
const menuList = ()=>{
};
const menuList = ()=>{
getMenuList(state.queryParams).then(res=>{
state.menuTableData = proxy.handleTree(res.data.rules??[], "id","pid");
})
};
return {
editMenuRef,
onOpenAddMenu,
onOpenEditMenu,
onTabelRowDel,
formatIsHide,
menuList,
handleQuery,
...toRefs(state),
sys_show_hide,
acType
};
},
});
};
</script>

82
src/views/system/monitor/loginLog/index.vue
View File

@ -9,7 +9,6 @@
placeholder="请输入登录地址"
clearable
style="width: 180px;"
size="default"
@keyup.enter.native="dataList"
/>
</el-form-item>
@ -20,7 +19,6 @@
placeholder="请输入登录地点"
clearable
style="width: 180px;"
size="default"
@keyup.enter.native="dataList"
/>
</el-form-item>
@ -31,7 +29,6 @@
placeholder="请输入用户名称"
clearable
style="width: 180px;"
size="default"
@keyup.enter.native="dataList"
/>
</el-form-item>
@ -41,7 +38,6 @@
v-model="tableData.param.status"
placeholder="登录状态"
clearable
size="default"
style="width: 180px"
>
<el-option
@ -56,7 +52,6 @@
<el-form-item label="登录时间" prop="dateRange">
<el-date-picker
v-model="tableData.param.dateRange"
size="default"
style="width: 240px"
value-format="YYYY-MM-DD"
type="daterange"
@ -117,7 +112,7 @@
</div>
</template>
<script lang="ts">
<script setup lang="ts">
import { toRefs, reactive, onMounted, ref, defineComponent,getCurrentInstance,unref } from 'vue';
import { ElMessageBox, ElMessage,FormInstance} from 'element-plus';
import { logList,deleteLog,clearLog } from '/@/api/system/monitor/loginLog';
@ -152,14 +147,11 @@ interface TableDataState {
};
};
}
export default defineComponent({
name: 'apiV1SystemLoginLogList',
setup() {
const {proxy} = getCurrentInstance() as any;
const queryRef = ref();
const {admin_login_status} = proxy.useDict('admin_login_status')
const state = reactive<TableDataState>({
defineOptions({ name: "apiV1SystemLoginLogList"})
const {proxy} = getCurrentInstance() as any;
const queryRef = ref();
const {admin_login_status} = proxy.useDict('admin_login_status')
const state = reactive<TableDataState>({
ids:[],
tableData: {
data: [],
@ -175,19 +167,20 @@ export default defineComponent({
userName:''
},
},
});
// 初始化表格数据
const initTableData = () => {
});
const { tableData } = toRefs(state);
// 初始化表格数据
const initTableData = () => {
dataList()
};
const dataList=()=>{
};
const dataList=()=>{
logList(state.tableData.param).then((res:any)=>{
state.tableData.data = res.data.list;
state.tableData.total = res.data.total;
});
};
// 删除日志
const onRowDel = (row: TableDataRow) => {
};
// 删除日志
const onRowDel = (row: TableDataRow|null) => {
let msg = '你确定要删除所选数据？';
let ids:number[] = [] ;
if(row){
@ -212,9 +205,9 @@ export default defineComponent({
})
})
.catch(() => {});
};
// 清空日志
const onRowClear = () => {
};
// 清空日志
const onRowClear = () => {
ElMessageBox.confirm('你确定要删除所选数据？', '提示', {
confirmButtonText: '确认',
cancelButtonText: '取消',
@ -227,36 +220,23 @@ export default defineComponent({
})
})
.catch(() => {});
};
// 页面加载时
onMounted(() => {
};
// 页面加载时
onMounted(() => {
initTableData();
});
/** 重置按钮操作 */
const resetQuery = (formEl: FormInstance | undefined) => {
});
/** 重置按钮操作 */
const resetQuery = (formEl: FormInstance | undefined) => {
if (!formEl) return
formEl.resetFields()
dataList()
};
// 多选框选中数据
const handleSelectionChange = (selection:TableDataRow[])=> {
};
// 多选框选中数据
const handleSelectionChange = (selection:TableDataRow[])=> {
state.ids = selection.map(item => item.infoId)
};
// 登录状态字典翻译
const statusFormat = (row:TableDataRow) => {
};
// 登录状态字典翻译
const statusFormat = (row:TableDataRow) => {
return proxy.selectDictLabel(unref(admin_login_status), row.status);
};
return {
queryRef,
onRowDel,
dataList,
resetQuery,
handleSelectionChange,
statusFormat,
onRowClear,
admin_login_status,
...toRefs(state),
};
},
});
};
</script>

65
src/views/system/monitor/operLog/component/detail.vue
View File

@ -48,7 +48,7 @@
</el-drawer>
</div>
</template>
<script lang="ts">
<script setup lang="ts">
import { reactive, toRefs, defineComponent,ref,getCurrentInstance,computed } from 'vue';
import {
getSysOperLog
@ -57,21 +57,18 @@ import {
SysOperLogInfoData,
SysOperLogEditState,
} from "/@/views/system/monitor/operLog/component/model"
export default defineComponent({
name:"apiV1SystemSysOperLogDetail",
components:{
},
props:{
defineOptions({ name: "apiV1SystemSysOperLogDetail"})
const props = defineProps({
requestMethodOptions:{
type:Array,
default:()=>[]
},
},
setup(props,{emit}) {
const {proxy} = <any>getCurrentInstance()
const formRef = ref<HTMLElement | null>(null);
const menuRef = ref();
const state = reactive<SysOperLogEditState>({
})
const emit = defineEmits(['getSysDeptItemsDeptName'])
const {proxy} = <any>getCurrentInstance()
const formRef = ref<HTMLElement | null>(null);
const menuRef = ref();
const state = reactive<SysOperLogEditState>({
loading:false,
isShowDialog: false,
formData: {
@ -111,9 +108,10 @@ export default defineComponent({
{ required: true, message: "操作状态（0正常 1异常）不能为空", trigger: "blur" }
],
}
});
// 打开弹窗
const openDialog = (row?: SysOperLogInfoData) => {
});
const {isShowDialog,formData} = toRefs(state);
// 打开弹窗
const openDialog = (row?: SysOperLogInfoData) => {
resetForm();
if(row) {
getSysOperLog(row.operId!).then((res:any)=>{
@ -122,16 +120,17 @@ export default defineComponent({
})
}
state.isShowDialog = true;
};
// 关闭弹窗
const closeDialog = () => {
};
defineExpose({ openDialog})
// 关闭弹窗
const closeDialog = () => {
state.isShowDialog = false;
};
// 取消
const onCancel = () => {
};
// 取消
const onCancel = () => {
closeDialog();
};
const resetForm = ()=>{
};
const resetForm = ()=>{
state.formData = {
operId: undefined,
title: undefined,
@ -154,23 +153,11 @@ export default defineComponent({
deptName:undefined, // 部门名称
},
}
};
//关联sys_dept表选项
const getSysDeptItemsDeptName = () => {
};
//关联sys_dept表选项
const getSysDeptItemsDeptName = () => {
emit("getSysDeptItemsDeptName")
}
return {
proxy,
openDialog,
closeDialog,
onCancel,
menuRef,
formRef,
getSysDeptItemsDeptName,
...toRefs(state),
};
}
})
}
</script>
<style scoped>
.system-sysOperLog-detail :deep(.el-form-item--large .el-form-item__label){

142
src/views/system/monitor/operLog/index.vue
View File

@ -43,7 +43,6 @@
v-model="tableData.param.operName"
placeholder="请输入操作人员"
clearable
size="small"
@keyup.enter.native="sysOperLogList"
/>
</el-form-item>
@ -165,7 +164,7 @@
></apiV1SystemSysOperLogDetail>
</div>
</template>
<script lang="ts">
<script setup lang="ts">
import {ItemOptions} from "/@/api/items";
import {toRefs, reactive, onMounted, ref, defineComponent, computed,getCurrentInstance,toRaw} from 'vue';
import {ElMessageBox, ElMessage, FormInstance} from 'element-plus';
@ -180,40 +179,35 @@ import {
SysOperLogTableDataState,
} from "/@/views/system/monitor/operLog/component/model"
import apiV1SystemSysOperLogDetail from "/@/views/system/monitor/operLog/component/detail.vue"
export default defineComponent({
name: "apiV1SystemSysOperLogList",
components:{
apiV1SystemSysOperLogDetail
},
setup() {
const {proxy} = <any>getCurrentInstance()
const loading = ref(false)
const queryRef = ref()
const editRef = ref();
const detailRef = ref();
// 是否显示所有搜索选项
const showAll = ref(false)
// 非单个禁用
const single = ref(true)
// 非多个禁用
const multiple =ref(true)
const word = computed(()=>{
defineOptions({ name: "apiV1SystemSysOperLogList"})
const {proxy} = <any>getCurrentInstance()
const loading = ref(false)
const queryRef = ref()
const editRef = ref();
const detailRef = ref();
// 是否显示所有搜索选项
const showAll = ref(false)
// 非单个禁用
const single = ref(true)
// 非多个禁用
const multiple =ref(true)
const word = computed(()=>{
if(showAll.value === false) {
//对文字进行处理
return "展开搜索";
} else {
return "收起搜索";
}
})
// 字典选项数据
const {
})
// 字典选项数据
const {
sys_oper_log_type,
} = proxy.useDict(
} = proxy.useDict(
'sys_oper_log_type',
)
// deptNameOptions关联表数据
const deptNameOptions = ref<Array<ItemOptions>>([])
const state = reactive<SysOperLogTableDataState>({
)
// deptNameOptions关联表数据
const deptNameOptions = ref<Array<ItemOptions>>([])
const state = reactive<SysOperLogTableDataState>({
operIds:[],
tableData: {
data: [],
@ -229,23 +223,24 @@ export default defineComponent({
dateRange: []
},
},
});
// 页面加载时
onMounted(() => {
});
const { tableData } = toRefs(state);
// 页面加载时
onMounted(() => {
initTableData();
});
// 初始化表格数据
const initTableData = () => {
});
// 初始化表格数据
const initTableData = () => {
sysOperLogList()
};
/** 重置按钮操作 */
const resetQuery = (formEl: FormInstance | undefined) => {
};
/** 重置按钮操作 */
const resetQuery = (formEl: FormInstance | undefined) => {
if (!formEl) return
formEl.resetFields()
sysOperLogList()
};
// 获取列表数据
const sysOperLogList = ()=>{
};
// 获取列表数据
const sysOperLogList = ()=>{
loading.value = true
listSysOperLog(state.tableData.param).then((res:any)=>{
let list = res.data.list??[];
@ -253,32 +248,32 @@ export default defineComponent({
state.tableData.total = res.data.total;
loading.value = false
})
};
const toggleSearch = () => {
};
const toggleSearch = () => {
showAll.value = !showAll.value;
}
// 请求方式字典翻译
const requestMethodFormat = (row:SysOperLogTableColumns) => {
}
// 请求方式字典翻译
const requestMethodFormat = (row:SysOperLogTableColumns) => {
return proxy.selectDictLabel(sys_oper_log_type.value, row.requestMethod);
}
// 多选框选中数据
const handleSelectionChange = (selection:Array<SysOperLogInfoData>) => {
}
// 多选框选中数据
const handleSelectionChange = (selection:Array<SysOperLogInfoData>) => {
state.operIds = selection.map(item => item.operId)
single.value = selection.length!=1
multiple.value = !selection.length
}
const handleAdd = ()=>{
}
const handleAdd = ()=>{
editRef.value.openDialog()
}
const handleUpdate = (row: SysOperLogTableColumns) => {
}
const handleUpdate = (row: SysOperLogTableColumns) => {
if(!row){
row = state.tableData.data.find((item:SysOperLogTableColumns)=>{
return item.operId ===state.operIds[0]
}) as SysOperLogTableColumns
}
editRef.value.openDialog(toRaw(row));
};
const handleDelete = (row: SysOperLogTableColumns) => {
};
const handleDelete = (row: SysOperLogTableColumns|null) => {
let msg = '你确定要删除所选数据？';
let ids:number[] = [] ;
if(row){
@ -303,9 +298,9 @@ export default defineComponent({
})
})
.catch(() => {});
}
// 清空日志
const onRowClear = () => {
}
// 清空日志
const onRowClear = () => {
ElMessageBox.confirm('你确定要删除所选数据？', '提示', {
confirmButtonText: '确认',
cancelButtonText: '取消',
@ -318,37 +313,10 @@ export default defineComponent({
})
})
.catch(() => {});
};
const handleView = (row:SysOperLogTableColumns)=>{
};
const handleView = (row:SysOperLogTableColumns)=>{
detailRef.value.openDialog(toRaw(row));
}
return {
proxy,
editRef,
detailRef,
showAll,
loading,
single,
multiple,
word,
queryRef,
resetQuery,
sysOperLogList,
toggleSearch,
requestMethodFormat,
sys_oper_log_type,
//关联表数据选项
deptNameOptions,
handleSelectionChange,
handleAdd,
handleUpdate,
handleDelete,
handleView,
onRowClear,
...toRefs(state),
}
}
})
}
</script>
<style lang="scss" scoped>
.colBlock {

4
src/views/system/monitor/server/index.vue
View File

@ -318,10 +318,8 @@
detail: {
valueAnimation: true,
formatter: '{value}%',
textStyle: {
fontSize: 36,
color: 'red',
},
offsetCenter: ['0', '80%'], //表盘数据(30%)位置
},
// data: [
@ -369,10 +367,8 @@
detail: {
valueAnimation: true,
formatter: '{value}%',
textStyle: {
fontSize: 36,
color: 'red',
},
offsetCenter: ['0', '80%'], //表盘数据(30%)位置
},
// data: [

76
src/views/system/monitor/userOnline/index.vue
View File

@ -4,10 +4,10 @@
<div class="system-user-search mb15">
<el-form :model="tableData.param" ref="queryRef" :inline="true">
<el-form-item label="登录IP" prop="ipaddr">
<el-input size="default" v-model="tableData.param.ipaddr" placeholder="请输入登录IP" class="w-50 m-2" clearable/>
<el-input v-model="tableData.param.ipaddr" placeholder="请输入登录IP" class="w-50 m-2" clearable/>
</el-form-item>
<el-form-item label="用户名称" prop="userName">
<el-input size="default" v-model="tableData.param.userName" placeholder="请输入登录名称" class="w-50 m-2" clearable/>
<el-input v-model="tableData.param.userName" placeholder="请输入登录名称" class="w-50 m-2" clearable/>
</el-form-item>
<el-form-item>
<el-button size="default" type="primary" class="ml10" @click="getList">
@ -57,7 +57,7 @@
</div>
</template>
<script lang="ts">
<script setup lang="ts">
import {toRefs, reactive, onMounted, defineComponent, ref} from 'vue';
import {ElMessageBox, ElMessage, FormInstance} from 'element-plus';
import { forceLogout, listSysUserOnline} from "/@/api/system/monitor/userOnline";
@ -86,12 +86,9 @@ interface TableDataState {
};
};
}
export default defineComponent({
name: 'apiV1SystemOnlineList',
setup() {
const queryRef = ref();
const state = reactive<TableDataState>({
defineOptions({ name: "apiV1SystemOnlineList"})
const queryRef = ref();
const state = reactive<TableDataState>({
ids:[],
tableData: {
data: [],
@ -104,25 +101,26 @@ export default defineComponent({
pageSize: 10,
},
},
});
// 初始化表格数据
const initTableData = () => {
});
const { tableData} =toRefs(state)
// 初始化表格数据
const initTableData = () => {
getList()
};
const getList = ()=>{
};
const getList = ()=>{
listSysUserOnline(state.tableData.param).then(res=>{
state.tableData.data = res.data.list??[];
state.tableData.total = res.data.total;
})
};
/** 重置按钮操作 */
const resetQuery = (formEl: FormInstance | undefined) => {
};
/** 重置按钮操作 */
const resetQuery = (formEl: FormInstance | undefined) => {
if (!formEl) return
formEl.resetFields()
getList()
};
// 删除岗位
const onRowDel = (row: TableData) => {
};
// 删除岗位
const onRowDel = (row: TableData|null) => {
let msg = '你确定要强制退出用户登录？';
let ids:number[] = [] ;
if(row){
@ -147,33 +145,21 @@ export default defineComponent({
})
})
.catch(() => {});
};
// 分页改变
const onHandleSizeChange = (val: number) => {
};
// 分页改变
const onHandleSizeChange = (val: number) => {
state.tableData.param.pageSize = val;
};
// 分页改变
const onHandleCurrentChange = (val: number) => {
};
// 分页改变
const onHandleCurrentChange = (val: number) => {
state.tableData.param.pageNum = val;
};
// 页面加载时
onMounted(() => {
};
// 页面加载时
onMounted(() => {
initTableData();
});
// 多选框选中数据
const handleSelectionChange = (selection:Array<TableData>)=> {
state.ids = selection.map(item => item.id)
};
return {
queryRef,
onRowDel,
onHandleSizeChange,
onHandleCurrentChange,
getList,
handleSelectionChange,
resetQuery,
...toRefs(state),
};
},
});
// 多选框选中数据
const handleSelectionChange = (selection:Array<TableData>)=> {
state.ids = selection.map(item => item.id)
};
</script>

70
src/views/system/personal/index.vue
View File

@ -203,7 +203,7 @@
</div>
</template>
<script lang="ts">
<script setup lang="ts">
import { toRefs, reactive, computed, defineComponent,getCurrentInstance,onMounted } from 'vue';
import { formatAxis } from '/@/utils/formatTime';
import { storeToRefs } from 'pinia';
@ -224,18 +224,16 @@ interface PersonalState {
newsInfoList: any;
recommendList: any;
}
defineOptions({ name: "personals"})
export default defineComponent({
name: 'personals',
setup() {
const baseURL:string|undefined|boolean = import.meta.env.VITE_API_URL
const {proxy} = <any>getCurrentInstance();
const stores = useUserInfo();
const { userInfos } = storeToRefs(stores);
const dataParam = reactive({
const baseURL:string|undefined|boolean = import.meta.env.VITE_API_URL
const {proxy} = <any>getCurrentInstance();
const stores = useUserInfo();
const { userInfos } = storeToRefs(stores);
const dataParam = reactive({
token:getToken(),
})
const state = reactive<PersonalState>({
})
const state = reactive<PersonalState>({
newsInfoList,
recommendList,
imageUrl:'',
@ -252,10 +250,10 @@ export default defineComponent({
lastLoginIp:'',
lastLoginTime:''
},
});
});
// const handleUpload =
const handleUpload = () => {
const { deptName,roles,imageUrl,personalForm} = toRefs(state);
const handleUpload = () => {
// console.log(state.personalForm)
editPersonal(state.personalForm).then((res:any)=>{
const userInfo = res.data.userInfo
@ -267,26 +265,26 @@ export default defineComponent({
useUserInfo().setUserInfos();
ElMessage.success('已更新');
});
};
// 当前时间提示语
const currentTime = computed(() => {
};
// 当前时间提示语
const currentTime = computed(() => {
return formatAxis(new Date());
});
const handleAvatarSuccess: UploadProps['onSuccess'] = (
});
const handleAvatarSuccess: UploadProps['onSuccess'] = (
response,
uploadFile
) => {
) => {
if(response.code == 0){
state.imageUrl = response.data.path;
state.personalForm.avatar = response.data.path;
handleUpload();
}
};
};
/** 重置密码按钮操作 */
const handleEditPass = ()=> {
/** 重置密码按钮操作 */
const handleEditPass = ()=> {
ElMessageBox.prompt('请输入"' + state.personalForm.nickname + '"的新密码', "提示", {
confirmButtonText: "确定",
cancelButtonText: "取消"
@ -299,9 +297,9 @@ export default defineComponent({
ElMessage.success("修改成功，新密码是：" + value);
});
}).catch(() => {});
};
// 初始化用户数据
const initUserInfo = () => {
};
// 初始化用户数据
const initUserInfo = () => {
getPersonalInfo().then((res:any)=>{
const user = res.data.user;
state.imageUrl = user.avatar;
@ -320,24 +318,12 @@ export default defineComponent({
state.roles = res.data.roles;
})
};
// 页面加载时
onMounted(() => {
};
// 页面加载时
onMounted(() => {
initUserInfo();
});
return {
proxy,
baseURL,
userInfos,
currentTime,
handleUpload,
handleEditPass,
handleAvatarSuccess,
dataParam,
...toRefs(state),
};
},
});
</script>
<style scoped lang="scss">

58
src/views/system/post/component/editPost.vue
View File

@ -31,7 +31,7 @@
</div>
</template>
<script lang="ts">
<script setup lang="ts">
import { reactive, toRefs, defineComponent,ref,unref } from 'vue';
import {addPost, editPost} from "/@/api/system/post";
import {ElMessage} from "element-plus";
@ -57,13 +57,11 @@ interface PostState {
};
rules: object;
}
export default defineComponent({
name: 'systemEditPost',
setup(props,{emit}) {
const formRef = ref<HTMLElement | null>(null);
const menuRef = ref();
const state = reactive<PostState>({
defineOptions({ name: "systemEditPost"})
const emit = defineEmits(['getPostList']);
const formRef = ref<HTMLElement | null>(null);
const menuRef = ref();
const state = reactive<PostState>({
loading:false,
isShowDialog: false,
formData: {
@ -93,25 +91,27 @@ export default defineComponent({
children: 'children',
label: 'title',
},
});
// 打开弹窗
const openDialog = (row?: DialogRow) => {
});
const {isShowDialog,formData,loading,rules} = toRefs(state);
// 打开弹窗
const openDialog = (row?: DialogRow) => {
resetForm();
if(row) {
state.formData = row;
}
state.isShowDialog = true;
};
// 关闭弹窗
const closeDialog = () => {
};
defineExpose({ openDialog})
// 关闭弹窗
const closeDialog = () => {
state.isShowDialog = false;
};
// 取消
const onCancel = () => {
};
// 取消
const onCancel = () => {
closeDialog();
};
// 新增
const onSubmit = () => {
};
// 新增
const onSubmit = () => {
const formWrap = unref(formRef) as any;
if (!formWrap) return;
formWrap.validate((valid: boolean) => {
@ -138,8 +138,8 @@ export default defineComponent({
}
}
});
};
const resetForm = ()=>{
};
const resetForm = ()=>{
state.menuCheckStrictly=false;
state.menuExpand = false;
state.menuNodeAll = false;
@ -151,19 +151,7 @@ export default defineComponent({
status:1,
remark:'',
}
};
return {
openDialog,
closeDialog,
onCancel,
onSubmit,
menuRef,
formRef,
...toRefs(state),
};
},
});
};
</script>
<style scoped lang="scss">

83
src/views/system/post/index.vue
View File

@ -70,7 +70,7 @@
</div>
</template>
<script lang="ts">
<script setup lang="ts">
import {toRefs, reactive, onMounted, ref, defineComponent, toRaw} from 'vue';
import { ElMessageBox, ElMessage } from 'element-plus';
import EditPost from '/@/views/system/post/component/editPost.vue';
@ -100,14 +100,10 @@ interface TableDataState {
};
};
}
export default defineComponent({
name: 'apiV1SystemPostList',
components: {EditPost},
setup() {
const addPostRef = ref();
const editPostRef = ref();
const state = reactive<TableDataState>({
defineOptions({ name: "apiV1SystemPostList"})
const addPostRef = ref();
const editPostRef = ref();
const state = reactive<TableDataState>({
ids:[],
tableData: {
data: [],
@ -121,27 +117,28 @@ export default defineComponent({
pageSize: 10,
},
},
});
// 初始化表格数据
const initTableData = () => {
});
const { tableData } = toRefs(state);
// 初始化表格数据
const initTableData = () => {
postList()
};
const postList = ()=>{
};
const postList = ()=>{
getPostList(state.tableData.param).then(res=>{
state.tableData.data = res.data.postList??[];
state.tableData.total = res.data.total;
})
};
// 打开新增岗位弹窗
const onOpenAddPost = () => {
};
// 打开新增岗位弹窗
const onOpenAddPost = () => {
editPostRef.value.openDialog();
};
// 打开修改岗位弹窗
const onOpenEditPost = (row: Object) => {
};
// 打开修改岗位弹窗
const onOpenEditPost = (row: Object) => {
editPostRef.value.openDialog(toRaw(row));
};
// 删除岗位
const onRowDel = (row: any) => {
};
// 删除岗位
const onRowDel = (row: any) => {
let msg = '你确定要删除所选岗位？';
let ids:number[] = [] ;
if(row){
@ -166,35 +163,21 @@ export default defineComponent({
})
})
.catch(() => {});
};
// 分页改变
const onHandleSizeChange = (val: number) => {
};
// 分页改变
const onHandleSizeChange = (val: number) => {
state.tableData.param.pageSize = val;
};
// 分页改变
const onHandleCurrentChange = (val: number) => {
};
// 分页改变
const onHandleCurrentChange = (val: number) => {
state.tableData.param.pageNum = val;
};
// 页面加载时
onMounted(() => {
};
// 页面加载时
onMounted(() => {
initTableData();
});
// 多选框选中数据
const handleSelectionChange = (selection:Array<TableData>)=> {
state.ids = selection.map(item => item.postId)
};
return {
addPostRef,
editPostRef,
onOpenAddPost,
onOpenEditPost,
onRowDel,
onHandleSizeChange,
onHandleCurrentChange,
postList,
handleSelectionChange,
...toRefs(state),
};
},
});
// 多选框选中数据
const handleSelectionChange = (selection:Array<TableData>)=> {
state.ids = selection.map(item => item.postId)
};
</script>

200
src/views/system/role/component/dataScope.vue
View File

@ -33,7 +33,7 @@
<template #header>
<el-radio-group v-model="optionsActionValue" @change="setOptionsActionValueHandle">
<template v-for="item in dataScopeOptions" :key="item.value">
<el-radio v-if="item.value!='2'" :value="item.value" >{{item.label}}</el-radio>
<el-radio v-if="item.value.toString()!='2'" :value="item.value" >{{item.label}}</el-radio>
</template>
</el-radio-group>
</template>
@ -42,7 +42,7 @@
<el-radio-group v-model="menuAuthData[scope.row.id]">
<template v-for="item in dataScopeOptions" :key="item.value">
<el-radio :value="item.value" @change="setOptionsItemHandle(item.value,scope.row.id)">
<el-badge v-if="item.value=='2' && menuAuthData[scope.row.id]=='2'" type="success" :value="getDeptLen(scope.row.id)" :max="99" class="item" :show-zero="false">{{item.label}}</el-badge>
<el-badge v-if="item.value.toString()=='2' && menuAuthData[scope.row.id]=='2'" type="success" :value="getDeptLen(scope.row.id)" :max="99" class="item" :show-zero="false">{{item.label}}</el-badge>
<span v-else>{{item.label}}</span>
</el-radio>
</template>
@ -91,40 +91,31 @@
</div>
</template>
<script lang="ts">
import {defineComponent, getCurrentInstance, nextTick, reactive, ref} from "vue";
<script setup lang="ts">
import {getCurrentInstance, nextTick, reactive, ref} from "vue";
import {dataScope, getRole, roleDeptTreeSelect, roleMenuTreeSelect} from "/@/api/system/role";
import {ElMessage} from "element-plus/es";
import {findChildrenByPid, flattenTree} from "/@/utils/gfast";
import * as events from "events";
export default defineComponent({
name: "dataScope",
computed: {
events() {
return events
}
},
setup(props,{emit}){
const tableRef = ref()
const openSelDept = ref(false);
const {proxy} = getCurrentInstance() as any;
const openDataScope = ref(false)
const deptExpand = ref(true)
const deptNodeAll = ref(false)
const deptOptions = ref<Array<any>>([])
const menuOptions = ref([])
const deptRef = ref();
const formRef = ref();
const deptCheckStrictly = ref(false)
const optionsActionValue = ref("0")
const setDeptId = ref(0)
const deptProps = ref({
defineOptions({ name: "dataScope"})
const emit = defineEmits(["getRoleList"])
const tableRef = ref()
const openSelDept = ref(false);
const {proxy} = getCurrentInstance() as any;
const openDataScope = ref(false)
const deptExpand = ref(true)
const deptNodeAll = ref(false)
const deptOptions = ref<Array<any>>([])
const menuOptions = ref([])
const deptRef = ref();
const formRef = ref();
const deptCheckStrictly = ref(false)
const optionsActionValue = ref("0")
const setDeptId = ref(0)
const deptProps = ref({
children: "children",
label: "deptName"
})
// 数据范围选项
const dataScopeOptions = ref([
})
// 数据范围选项
const dataScopeOptions = ref([
{
value: 1,
label: "全部"
@ -145,10 +136,10 @@ export default defineComponent({
value: 2,
label: "自定义"
}
])
const menuAuthData = ref([])
const deptAuthData = ref([])
const form = reactive({
])
const menuAuthData = ref([])
const deptAuthData = ref([])
const form = reactive({
roleId:undefined,
roleName:'',
authData:[{
@ -156,26 +147,26 @@ export default defineComponent({
scope:'0',
deptIds:[]
}]
})
const menuTableData = ref([])
const menuTableList = ref([])
// 树权限（展开/折叠）
const handleCheckedTreeExpand = (value:any) => {
})
const menuTableData = ref([])
const menuTableList = ref([])
// 树权限（展开/折叠）
const handleCheckedTreeExpand = (value:any) => {
let treeList = deptOptions.value;
for (let i = 0; i < treeList.length; i++) {
deptRef.value.store.nodesMap[treeList[i].deptId].expanded = value;
}
}
// 树权限（全选/全不选）
const handleCheckedTreeNodeAll = (value:any) => {
}
// 树权限（全选/全不选）
const handleCheckedTreeNodeAll = (value:any) => {
deptRef.value.setCheckedNodes(value ? deptOptions.value: []);
}
/** 树权限（父子联动） */
const handleCheckedTreeConnect = (value:any) => {
}
/** 树权限（父子联动） */
const handleCheckedTreeConnect = (value:any) => {
deptCheckStrictly.value = value ? true : false;
}
/** 提交按钮（数据权限） */
const submitDataScope = () => {
}
/** 提交按钮（数据权限） */
const submitDataScope = () => {
form.authData = []
//获取选中的菜单
let rows = tableRef.value.getSelectionRows()
@ -197,15 +188,15 @@ export default defineComponent({
}
});
}
const cancelDataScope = () => {
}
const cancelDataScope = () => {
closeDialog();
};
const submitDept = ()=>{
};
const submitDept = ()=>{
deptAuthData.value[setDeptId.value] = getDeptAllCheckedKeys() as never;
cancelDept()
}
const submitSonMenuDept = ()=>{
}
const submitSonMenuDept = ()=>{
const checkedDeptId = getDeptAllCheckedKeys() as never;
deptAuthData.value[setDeptId.value] = getDeptAllCheckedKeys() as never;
//查询所有子级
@ -214,13 +205,13 @@ export default defineComponent({
deptAuthData.value[item.id] = getDeptAllCheckedKeys() as never;
})
cancelDept()
}
const cancelDept = () => {
}
const cancelDept = () => {
deptCheckStrictly.value= false
openSelDept.value = false
};
// 打开弹窗
const openDialog = (row: any) => {
};
// 打开弹窗
const openDialog = (row: any) => {
openDataScope.value = true;
roleDeptTreeSelect().then(response => {
deptOptions.value = response.data.depts||[];
@ -235,17 +226,18 @@ export default defineComponent({
})
getMenuTreeselect(row.id)
}
};
/** 根据角色ID查询部门树结构 */
const getRoleDeptTreeselect = (menuId:any) =>{
};
defineExpose({ openDialog})
/** 根据角色ID查询部门树结构 */
const getRoleDeptTreeselect = (menuId:any) =>{
nextTick(()=>{
deptRef.value?.setCheckedKeys([], false)
if(deptAuthData.value[menuId]){
deptRef.value.setCheckedKeys(deptAuthData.value[menuId], true);
}
})
}
const getMenuTreeselect = (roleId:number) =>{
}
const getMenuTreeselect = (roleId:number) =>{
roleMenuTreeSelect(roleId).then(res=>{
menuTableData.value = proxy.handleTree(res.data.rules??[], "id","pid");
menuTableList.value = proxy.flattenTree(menuTableData.value)
@ -273,35 +265,36 @@ export default defineComponent({
})
}
})
}
// 关闭弹窗
const closeDialog = () => {
}
// 关闭弹窗
const closeDialog = () => {
openDataScope.value = false;
};
// 所有部门节点数据
const getDeptAllCheckedKeys = () => {
};
// 所有部门节点数据
const getDeptAllCheckedKeys = () => {
// 目前被选中的部门节点
let checkedKeys = deptRef.value.getCheckedKeys();
return checkedKeys;
}
const resetForm = ()=>{
}
const resetForm = ()=>{
form.roleId=undefined
form.roleName=''
form.authData = []
deptCheckStrictly.value= false
menuAuthData.value = []
deptAuthData.value = []
};
const handleSelectionChange = (val: any[]) => {
};
const handleSelectionChange = (val: any[]) => {
}
const setOptionsActionValueHandle = (value:any)=>{
}
const setOptionsActionValueHandle = (value:any)=>{
//遍历选择所有菜单
menuTableList.value.map((item:any)=>{
menuAuthData.value[item.id] = value as never
})
}
const setOptionsItemHandle = (value:any,id:any)=>{
}
const setOptionsItemHandle = (value:any,id:any)=>{
const children = proxy.findChildrenByPid(id,menuTableList.value)
//设置行选中
menuTableList.value.some((item:any)=>{
@ -318,54 +311,19 @@ export default defineComponent({
children.map((item:any)=>{
menuAuthData.value[item.id] = value as never
})
}
const openSelDeptHandler = (id:any)=>{
}
const openSelDeptHandler = (id:any)=>{
openSelDept.value = true
setDeptId.value = id
getRoleDeptTreeselect(id)
}
const getDeptLen = (id:any)=>{
}
const getDeptLen = (id:any)=>{
if(deptAuthData.value[id]){
return (<Array<any>>deptAuthData.value[id]).length
}
return 0
}
return {
tableRef,
openSelDept,
openDialog,
dataScopeOptions,
deptExpand,
openDataScope,
deptNodeAll,
deptOptions,
deptCheckStrictly,
deptProps,
menuOptions,
deptRef,
formRef,
optionsActionValue,
cancelDataScope,
submitDataScope,
handleCheckedTreeExpand,
handleCheckedTreeNodeAll,
handleCheckedTreeConnect,
menuTableData,
handleSelectionChange,
setOptionsActionValueHandle,
menuAuthData,
setOptionsItemHandle,
openSelDeptHandler,
cancelDept,
submitDept,
submitSonMenuDept,
deptAuthData,
setDeptId,
getDeptLen,
form
}
}
})
}
</script>
<style scoped lang="scss">

123
src/views/system/role/component/editRole.vue
View File

@ -43,22 +43,22 @@
<el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24" >
<el-form-item label="有效时间">
<el-radio-group v-model="formData.effectiveType">
<el-radio :label="0">不设置</el-radio>
<el-radio :label="1">按起止日期</el-radio>
<el-radio :label="2">按时间段</el-radio>
<el-radio :value="0">不设置</el-radio>
<el-radio :value="1">按起止日期</el-radio>
<el-radio :value="2">按时间段</el-radio>
</el-radio-group>
</el-form-item>
</el-col>
<el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24" v-show="formData.effectiveType===2">
<el-form-item label="每周">
<el-checkbox-group v-model="formData.weekDay">
<el-checkbox :label="1" >周一</el-checkbox>
<el-checkbox :label="2" >周二</el-checkbox>
<el-checkbox :label="3" >周三</el-checkbox>
<el-checkbox :label="4" >周四</el-checkbox>
<el-checkbox :label="5" >周五</el-checkbox>
<el-checkbox :label="6" >周六</el-checkbox>
<el-checkbox :label="0" >周日</el-checkbox>
<el-checkbox :value="1" >周一</el-checkbox>
<el-checkbox :value="2" >周二</el-checkbox>
<el-checkbox :value="3" >周三</el-checkbox>
<el-checkbox :value="4" >周四</el-checkbox>
<el-checkbox :value="5" >周五</el-checkbox>
<el-checkbox :value="6" >周六</el-checkbox>
<el-checkbox :value="0" >周日</el-checkbox>
</el-checkbox-group>
</el-form-item>
</el-col>
@ -120,7 +120,7 @@
</div>
</template>
<script lang="ts">
<script setup lang="ts">
import { reactive, toRefs, defineComponent,ref,getCurrentInstance,unref } from 'vue';
import {addRole, editRole, getRole, getRoleParams} from "/@/api/system/role";
import {ElMessage} from "element-plus";
@ -162,20 +162,18 @@ interface RoleState {
};
rules: object;
}
export default defineComponent({
name: 'systemEditRole',
props:{
defineOptions({ name: "systemEditRole"})
const props = defineProps({
roleData:{
type:Array,
default:()=>[]
}
},
setup(props,{emit}) {
const {proxy} = getCurrentInstance() as any;
const formRef = ref<HTMLElement | null>(null);
const menuRef = ref();
const state = reactive<RoleState>({
})
const emit = defineEmits(['getRoleList']);
const {proxy} = getCurrentInstance() as any;
const formRef = ref<HTMLElement | null>(null);
const menuRef = ref();
const state = reactive<RoleState>({
loading:false,
isShowDialog: false,
formData: {
@ -209,9 +207,9 @@ export default defineComponent({
label: 'title',
disabled:'disabled'
},
});
// 打开弹窗
const openDialog = (row?: DialogRow) => {
});
// 打开弹窗
const openDialog = (row?: DialogRow) => {
resetForm();
getMenuData();
if(row) {
@ -226,17 +224,18 @@ export default defineComponent({
})
}
state.isShowDialog = true;
};
// 关闭弹窗
const closeDialog = () => {
};
defineExpose({ openDialog})
// 关闭弹窗
const closeDialog = () => {
state.isShowDialog = false;
};
// 取消
const onCancel = () => {
};
// 取消
const onCancel = () => {
closeDialog();
};
// 新增
const onSubmit = () => {
};
// 新增
const onSubmit = () => {
const formWrap = unref(formRef) as any;
if (!formWrap) return;
formWrap.validate((valid: boolean) => {
@ -266,9 +265,9 @@ export default defineComponent({
}
}
});
};
// 获取菜单结构数据
const getMenuData = () => {
};
// 获取菜单结构数据
const getMenuData = () => {
getRoleParams().then((res:any)=>{
const menus = res.data.menu??[]
const accessMenus = res.data.accessMenus??[]
@ -277,8 +276,8 @@ export default defineComponent({
})
state.menuData = proxy.handleTree(menus, "id","pid");
})
};
const resetForm = ()=>{
};
const resetForm = ()=>{
state.menuCheckStrictly=false;
state.menuExpand = false;
state.menuNodeAll = false;
@ -298,54 +297,40 @@ export default defineComponent({
],
dateRange:[]
}
};
/** 树权限（展开/折叠）*/
const handleCheckedTreeExpand = (value:any) => {
};
const {formData, menuData,menuExpand,menuNodeAll,menuCheckStrictly,menuProps,rules,loading,isShowDialog} = toRefs(state)
/** 树权限（展开/折叠）*/
const handleCheckedTreeExpand = (value:any) => {
let treeList = state.menuData;
for (let i = 0; i < treeList.length; i++) {
menuRef.value.store.nodesMap[treeList[i].id].expanded = value;
}
}
}
/** 树权限（全选/全不选） */
const handleCheckedTreeNodeAll = (value:any) => {
/** 树权限（全选/全不选） */
const handleCheckedTreeNodeAll = (value:any) => {
menuRef.value.setCheckedNodes(value ? state.menuData : []);
}
}
/** 树权限（父子联动） */
const handleCheckedTreeConnect = (value:any) => {
/** 树权限（父子联动） */
const handleCheckedTreeConnect = (value:any) => {
state.menuCheckStrictly = value ? true : false;
}
}
/** 所有菜单节点数据 */
function getMenuAllCheckedKeys() {
/** 所有菜单节点数据 */
function getMenuAllCheckedKeys() {
// 目前被选中的菜单节点
let checkedKeys = menuRef.value.getCheckedKeys();
// 半选中的菜单节点
let halfCheckedKeys = menuRef.value.getHalfCheckedKeys();
checkedKeys.unshift.apply(checkedKeys, halfCheckedKeys);
return checkedKeys;
}
}
// 重置菜单session
const resetMenuSession = () => {
// 重置菜单session
const resetMenuSession = () => {
refreshBackEndControlRoutes();
};
return {
openDialog,
closeDialog,
onCancel,
onSubmit,
menuRef,
formRef,
handleCheckedTreeExpand,
handleCheckedTreeNodeAll,
handleCheckedTreeConnect,
resetMenuSession,
...toRefs(state),
};
},
});
};
</script>
<style scoped lang="scss">

139
src/views/system/role/index.vue
View File

@ -7,7 +7,7 @@
<el-input v-model="tableData.param.roleName" placeholder="请输入角色名称" class="w-50 m-2" clearable/>
</el-form-item>
<el-form-item label="状态">
<el-select placeholder="请选择状态" class="w-50 m-2" v-model="tableData.param.roleStatus" clearable style="width:120px;">
<el-select placeholder="请选择状态" class="w-50 m-2" v-model="tableData.param.roleStatus" clearable style="width: 120px;">
<el-option label="启用" value="1" />
<el-option label="禁用" value="0" />
</el-select>
@ -77,7 +77,7 @@
</div>
</template>
<script lang="ts">
<script setup lang="ts">
import {toRefs, reactive, onMounted, ref, defineComponent, toRaw,getCurrentInstance} from 'vue';
import { ElMessageBox, ElMessage,ElLoading } from 'element-plus';
import EditRole from '/@/views/system/role/component/editRole.vue';
@ -118,22 +118,18 @@ interface TableDataState {
};
};
}
export default defineComponent({
name: 'apiV1SystemRoleList',
components: {selectUser, EditRole,DataScope,UserList},
setup() {
const selectUserRef = ref()
const {proxy} = getCurrentInstance() as any;
const {sys_user_sex} = proxy.useDict('sys_user_sex')
const addRoleRef = ref();
const userListRef = ref();
const editRoleRef = ref();
const dataScopeRef =ref();
const roleListData = ref<Array<TableData>>()
const roleUsers = ref([])
const setRole = ref(0)
const state = reactive<TableDataState>({
defineOptions({ name: "apiV1SystemRoleList"})
const selectUserRef = ref()
const {proxy} = getCurrentInstance() as any;
const {sys_user_sex} = proxy.useDict('sys_user_sex')
const addRoleRef = ref();
const userListRef = ref();
const editRoleRef = ref();
const dataScopeRef =ref();
const roleListData = ref<Array<TableData>>()
const roleUsers = ref([])
const setRole = ref(0)
const state = reactive<TableDataState>({
isShowDialog: false,
deptData: [],
userListParam: {
@ -151,12 +147,13 @@ export default defineComponent({
pageSize: 10,
},
},
});
// 初始化表格数据
const initTableData = () => {
});
const { tableData,selectRow,deptData,userListParam,isShowDialog} = toRefs(state);
// 初始化表格数据
const initTableData = () => {
roleList()
};
const roleList = ()=>{
};
const roleList = ()=>{
const data: Array<TableData> = [];
getRoleList(state.tableData.param).then(res=>{
const list = res.data.list??[]
@ -176,9 +173,9 @@ export default defineComponent({
roleListData.value = data
state.tableData.data = proxy.handleTree(data??[], "id","pid","children",true);
})
};
// 打开角色用户列表
const onOpenUserList = (row: TableData) => {
};
// 打开角色用户列表
const onOpenUserList = (row: TableData) => {
state.selectRow = row
state.userListParam.roleId = row.id
if (state.deptData.length == 0){
@ -189,21 +186,21 @@ export default defineComponent({
}else{
state.isShowDialog = true
}
};
// 打开新增角色弹窗
const onOpenAddRole = () => {
};
// 打开新增角色弹窗
const onOpenAddRole = () => {
editRoleRef.value.openDialog();
};
// 打开修改角色弹窗
const onOpenEditRole = (row: Object|undefined) => {
};
// 打开修改角色弹窗
const onOpenEditRole = (row: Object|undefined) => {
editRoleRef.value.openDialog(toRaw(row));
};
//数据权限设置弹窗
const handleDataScope=(row:any)=>{
};
//数据权限设置弹窗
const handleDataScope=(row:any)=>{
dataScopeRef.value.openDialog(toRaw(row))
}
//用户授权
const handleUserScope = ((row:any)=>{
}
//用户授权
const handleUserScope = ((row:any)=>{
const ld = ElLoading.service()
setRole.value = row.id
getUsersById(row.id).then((res:any)=>{
@ -211,9 +208,9 @@ export default defineComponent({
roleUsers.value=res.data.userList??[]
selectUserRef.value.openDialog()
})
})
// 删除角色
const onRowDel = (row: any) => {
})
// 删除角色
const onRowDel = (row: any) => {
ElMessageBox.confirm(`此操作将永久删除角色：“${row.name}”，是否继续?`, '提示', {
confirmButtonText: '确认',
cancelButtonText: '取消',
@ -227,23 +224,23 @@ export default defineComponent({
})
})
.catch(() => {});
};
// 分页改变
const onHandleSizeChange = (val: number) => {
};
// 分页改变
const onHandleSizeChange = (val: number) => {
state.tableData.param.pageSize = val;
};
// 分页改变
const onHandleCurrentChange = (val: number) => {
};
// 分页改变
const onHandleCurrentChange = (val: number) => {
state.tableData.param.pageNum = val;
};
const userList = ()=>{
};
const userList = ()=>{
userListRef.value.userList();
};
// 页面加载时
onMounted(() => {
};
// 页面加载时
onMounted(() => {
initTableData();
});
const handleCommand = (command: string )=>{
});
const handleCommand = (command: string )=>{
let commandArr = command.split('_')
let row = roleListData.value?.filter((item:TableData)=>{
return item.id==parseInt(commandArr[1])
@ -259,8 +256,8 @@ export default defineComponent({
handleUserScope(row)
break
}
}
const confirmUser = (data:any[]) => {
}
const confirmUser = (data:any[]) => {
if(data.length>0){
const ids = roleUsers.value.map((item:any)=>{
return item.id
@ -275,8 +272,8 @@ export default defineComponent({
}else{
roleUsers.value = []
}
};
const setRoleUser = ()=>{
};
const setRoleUser = ()=>{
const ids = roleUsers.value.map((item:any)=>{
return item.id
})
@ -284,31 +281,7 @@ export default defineComponent({
setRoleUsers({roleId:setRole.value,userIds:ids}).then((res:any)=>{
roleList()
})
}
return {
addRoleRef,
editRoleRef,
dataScopeRef,
sys_user_sex,
selectUserRef,
userList,
onOpenUserList,
onOpenAddRole,
onOpenEditRole,
onRowDel,
onHandleSizeChange,
onHandleCurrentChange,
roleList,
handleDataScope,
handleUserScope,
handleCommand,
roleUsers,
confirmUser,
setRoleUser,
...toRefs(state),
};
},
});
}
</script>
<style scoped lang="scss">
.auth-action{

112
src/views/system/sysJob/list/component/detail.vue
View File

@ -76,28 +76,25 @@
</el-drawer>
</div>
</template>
<script lang="ts">
import { reactive, toRefs, defineComponent,ref,unref,getCurrentInstance,computed } from 'vue';
import {ElMessageBox, ElMessage, FormInstance,UploadProps} from 'element-plus';
import {
<script setup lang="ts">
import { reactive, toRefs, defineComponent,ref,unref,getCurrentInstance,computed } from 'vue';
import {ElMessageBox, ElMessage, FormInstance,UploadProps} from 'element-plus';
import {
listSysJob,
getSysJob,
delSysJob,
addSysJob,
updateSysJob,
getUserList, getJobLogs, delSysJobLog,
} from "/@/api/system/tools/job/sysJob";
import {
} from "/@/api/system/tools/job/sysJob";
import {
SysJobTableColumns,
SysJobInfoData,
SysJobTableDataState,
SysJobEditState, SysJobLog, SysJobLogData,
} from "/@/views/system/sysJob/list/component/model"
export default defineComponent({
name:"apiV1SystemSysJobDetail",
components:{
},
props:{
} from "/@/views/system/sysJob/list/component/model"
defineOptions({ name: "apiV1SystemSysJobDetail"})
const props = defineProps({
jobGroupOptions:{
type:Array,
default:()=>[]
@ -110,14 +107,13 @@
type:Array,
default:()=>[]
},
},
setup(props,{emit}) {
const {proxy} = <any>getCurrentInstance()
const formRef = ref<HTMLElement | null>(null);
const menuRef = ref();
// 非多个禁用
const multiple =ref(true)
const logList = reactive<SysJobLog>({
})
const {proxy} = <any>getCurrentInstance()
const formRef = ref<HTMLElement | null>(null);
const menuRef = ref();
// 非多个禁用
const multiple =ref(true)
const logList = reactive<SysJobLog>({
logIds:[],
data: [],
loading: false,
@ -127,8 +123,8 @@
targetName: undefined
},
total: 0
})
const state = reactive<SysJobEditState>({
})
const state = reactive<SysJobEditState>({
loading:false,
isShowDialog: false,
formData: {
@ -151,36 +147,38 @@
},
// 表单校验
rules: {}
});
// 打开弹窗
const openDialog = (row?: SysJobInfoData) => {
resetForm();
if(row) {
getSysJob(row.jobId!).then((res:any)=>{
});
const { isShowDialog,formData} = toRefs(state)
// 打开弹窗
const openDialog = (row?: SysJobInfoData) => {
resetForm();
if(row) {
getSysJob(row.jobId!).then((res:any)=>{
state.formData = res.data;
})
logList.loading=true
getLogList(row.invokeTarget!);
}
state.isShowDialog = true;
};
const getLogList = (invokeTarget:string)=>{
})
logList.loading=true
getLogList(row.invokeTarget!);
}
state.isShowDialog = true;
};
defineExpose({openDialog})
const getLogList = (invokeTarget:string)=>{
logList.param.targetName=invokeTarget
getJobLogs(logList.param).then((res:any)=>{
logList.data = res.data.list||[];
logList.total=res.data.total;
logList.loading=false;
})
};
// 关闭弹窗
const closeDialog = () => {
};
// 关闭弹窗
const closeDialog = () => {
state.isShowDialog = false;
};
// 取消
const onCancel = () => {
};
// 取消
const onCancel = () => {
closeDialog();
};
const resetForm = ()=>{
};
const resetForm = ()=>{
state.formData = {
jobId: undefined,
jobName: undefined,
@ -199,13 +197,13 @@
createdUser:{userNickname:''},
updatedUser:{userNickname:''}
}
};
// 多选框选中数据
const handleSelectionChange = (selection:Array<SysJobLogData>) => {
};
// 多选框选中数据
const handleSelectionChange = (selection:Array<SysJobLogData>) => {
logList.logIds = selection.map(item => item.id)
multiple.value = !selection.length
};
const handleDelete = (row: SysJobLogData) => {
};
const handleDelete = (row: SysJobLogData) => {
let msg = '你确定要删除所选数据？';
let logId:number[] = [] ;
let targetName:string='';
@ -233,23 +231,7 @@
})
})
.catch(() => {});
}
return {
proxy,
openDialog,
closeDialog,
onCancel,
menuRef,
formRef,
logList,
getLogList,
handleSelectionChange,
multiple,
handleDelete,
...toRefs(state),
};
}
})
}
</script>
<style scoped>
.system-sysJob-detail :deep(.el-form-item--large .el-form-item__label){

75
src/views/system/sysJob/list/component/edit.vue
View File

@ -56,7 +56,7 @@
<el-radio
v-for="dict in misfirePolicyOptions"
:key="dict.value"
:label="dict.value"
:value="dict.value"
>{{dict.label }}</el-radio>
</el-radio-group>
</el-form-item>
@ -65,7 +65,7 @@
<el-radio
v-for="dict in statusOptions"
:key="dict.value"
:label="dict.value"
:value="dict.value"
>{{dict.label }}</el-radio>
</el-radio-group>
</el-form-item>
@ -82,7 +82,7 @@
</el-dialog>
</div>
</template>
<script lang="ts">
<script setup lang="ts">
import { reactive, toRefs, defineComponent,ref,unref,getCurrentInstance } from 'vue';
import {ElMessageBox, ElMessage, FormInstance,UploadProps} from 'element-plus';
import {
@ -99,11 +99,8 @@ import {
SysJobTableDataState,
SysJobEditState,
} from "/@/views/system/sysJob/list/component/model"
export default defineComponent({
name:"apiV1SystemSysJobEdit",
components:{
},
props:{
defineOptions({ name: "apiV1SystemSysJobEdit"})
const props = defineProps({
jobGroupOptions:{
type:Array,
default:()=>[]
@ -116,12 +113,12 @@ export default defineComponent({
type:Array,
default:()=>[]
},
},
setup(props,{emit}) {
const {proxy} = <any>getCurrentInstance()
const formRef = ref<HTMLElement | null>(null);
const menuRef = ref();
const state = reactive<SysJobEditState>({
})
const emit = defineEmits(['sysJobList'])
const {proxy} = <any>getCurrentInstance()
const formRef = ref<HTMLElement | null>(null);
const menuRef = ref();
const state = reactive<SysJobEditState>({
loading:false,
isShowDialog: false,
formData: {
@ -139,6 +136,8 @@ export default defineComponent({
remark: undefined,
createdAt: undefined,
updatedAt: undefined,
createdUser:{userNickname:''},
updatedUser:{userNickname:''}
},
// 表单校验
rules: {
@ -155,9 +154,10 @@ export default defineComponent({
{ required: true, message: "状态不能为空", trigger: "blur" }
],
}
});
// 打开弹窗
const openDialog = (row?: SysJobInfoData) => {
});
const {isShowDialog,formData,rules} = toRefs(state);
// 打开弹窗
const openDialog = (row?: SysJobInfoData) => {
resetForm();
if(row) {
getSysJob(row.jobId!).then((res:any)=>{
@ -167,19 +167,20 @@ export default defineComponent({
data.status = ''+data.status
state.formData = data;
})
}
}
state.isShowDialog = true;
};
// 关闭弹窗
const closeDialog = () => {
};
defineExpose({openDialog})
// 关闭弹窗
const closeDialog = () => {
state.isShowDialog = false;
};
// 取消
const onCancel = () => {
};
// 取消
const onCancel = () => {
closeDialog();
};
// 提交
const onSubmit = () => {
};
// 提交
const onSubmit = () => {
const formWrap = unref(formRef) as any;
if (!formWrap) return;
formWrap.validate((valid: boolean) => {
@ -206,8 +207,8 @@ export default defineComponent({
}
}
});
};
const resetForm = ()=>{
};
const resetForm = ()=>{
state.formData = {
jobId: undefined,
jobName: undefined,
@ -223,20 +224,10 @@ export default defineComponent({
remark: undefined,
createdAt: undefined,
updatedAt: undefined,
createdUser:{userNickname:''},
updatedUser:{userNickname:''}
}
};
return {
proxy,
openDialog,
closeDialog,
onCancel,
onSubmit,
menuRef,
formRef,
...toRefs(state),
};
}
})
};
</script>
<style scoped lang="scss">
.cronExpression-rule{

155
src/views/system/sysJob/list/index.vue
View File

@ -127,7 +127,7 @@
></apiV1SystemSysJobDetail>
</div>
</template>
<script lang="ts">
<script setup lang="ts">
import { ItemOptions } from '/@/api/items';
import { toRefs, reactive, onMounted, ref, defineComponent, computed, getCurrentInstance, toRaw } from 'vue';
import { ElMessageBox, ElMessage, FormInstance } from 'element-plus';
@ -135,35 +135,29 @@ import { listSysJob, getSysJob, delSysJob, addSysJob, updateSysJob, getUserList,
import { SysJobTableColumns, SysJobInfoData, SysJobTableDataState } from '/@/views/system/sysJob/list/component/model';
import apiV1SystemSysJobEdit from '/@/views/system/sysJob/list/component/edit.vue';
import apiV1SystemSysJobDetail from '/@/views/system/sysJob/list/component/detail.vue';
export default defineComponent({
name: 'apiV1SystemSysJobList',
components: {
apiV1SystemSysJobEdit,
apiV1SystemSysJobDetail,
},
setup() {
const { proxy } = <any>getCurrentInstance();
const loading = ref(false);
const queryRef = ref();
const editRef = ref();
const detailRef = ref();
// 是否显示所有搜索选项
const showAll = ref(false);
// 非单个禁用
const single = ref(true);
// 非多个禁用
const multiple = ref(true);
const word = computed(() => {
defineOptions({ name: "apiV1SystemSysJobList"})
const { proxy } = <any>getCurrentInstance();
const loading = ref(false);
const queryRef = ref();
const editRef = ref();
const detailRef = ref();
// 是否显示所有搜索选项
const showAll = ref(false);
// 非单个禁用
const single = ref(true);
// 非多个禁用
const multiple = ref(true);
const word = computed(() => {
if (showAll.value === false) {
//对文字进行处理
return '展开搜索';
} else {
return '收起搜索';
}
});
// 字典选项数据
const { sys_job_group, sys_job_policy, sys_job_status } = proxy.useDict('sys_job_group', 'sys_job_policy', 'sys_job_status');
const state = reactive<SysJobTableDataState>({
});
// 字典选项数据
const { sys_job_group, sys_job_policy, sys_job_status } = proxy.useDict('sys_job_group', 'sys_job_policy', 'sys_job_status');
const state = reactive<SysJobTableDataState>({
jobIds: [],
tableData: {
data: [],
@ -177,23 +171,24 @@ export default defineComponent({
status: undefined,
},
},
});
// 页面加载时
onMounted(() => {
});
const { tableData } = toRefs(state);
// 页面加载时
onMounted(() => {
initTableData();
});
// 初始化表格数据
const initTableData = () => {
});
// 初始化表格数据
const initTableData = () => {
sysJobList();
};
/** 重置按钮操作 */
const resetQuery = (formEl: FormInstance | undefined) => {
};
/** 重置按钮操作 */
const resetQuery = (formEl: FormInstance | undefined) => {
if (!formEl) return;
formEl.resetFields();
sysJobList();
};
// 获取列表数据
const sysJobList = () => {
};
// 获取列表数据
const sysJobList = () => {
loading.value = true;
listSysJob(state.tableData.param).then((res: any) => {
let list = res.data.list ?? [];
@ -201,41 +196,41 @@ export default defineComponent({
state.tableData.total = res.data.total;
loading.value = false;
});
};
const toggleSearch = () => {
};
const toggleSearch = () => {
showAll.value = !showAll.value;
};
// 任务组名字典翻译
const jobGroupFormat = (row: SysJobTableColumns) => {
};
// 任务组名字典翻译
const jobGroupFormat = (row: SysJobTableColumns) => {
return proxy.selectDictLabel(sys_job_group.value, row.jobGroup);
};
// 计划执行策略字典翻译
const misfirePolicyFormat = (row: SysJobTableColumns) => {
};
// 计划执行策略字典翻译
const misfirePolicyFormat = (row: SysJobTableColumns) => {
return proxy.selectDictLabel(sys_job_policy.value, row.misfirePolicy);
};
// 状态字典翻译
const statusFormat = (row: SysJobTableColumns) => {
};
// 状态字典翻译
const statusFormat = (row: SysJobTableColumns) => {
return proxy.selectDictLabel(sys_job_status.value, row.status);
};
// 多选框选中数据
const handleSelectionChange = (selection: Array<SysJobInfoData>) => {
};
// 多选框选中数据
const handleSelectionChange = (selection: Array<SysJobInfoData>) => {
state.jobIds = selection.map((item) => item.jobId);
single.value = selection.length != 1;
multiple.value = !selection.length;
};
const handleAdd = () => {
};
const handleAdd = () => {
editRef.value.openDialog();
};
const handleUpdate = (row: SysJobTableColumns) => {
};
const handleUpdate = (row: SysJobTableColumns|null) => {
if (!row) {
row = state.tableData.data.find((item: SysJobTableColumns) => {
return item.jobId === state.jobIds[0];
}) as SysJobTableColumns;
}
editRef.value.openDialog(toRaw(row));
};
/** 执行按钮操作 */
const handleJobRun = (row: SysJobTableColumns) => {
};
/** 执行按钮操作 */
const handleJobRun = (row: SysJobTableColumns) => {
const jobId = row.jobId || 0;
ElMessageBox.confirm('是否确认立即执行一次该任务?', '警告', {
confirmButtonText: '确定',
@ -249,8 +244,8 @@ export default defineComponent({
ElMessage.success('执行成功');
})
.catch(function () {});
};
const handleDelete = (row: SysJobTableColumns) => {
};
const handleDelete = (row: SysJobTableColumns|null) => {
let msg = '你确定要删除所选数据？';
let jobId: number[] = [];
if (row) {
@ -275,12 +270,12 @@ export default defineComponent({
});
})
.catch(() => {});
};
const handleView = (row: SysJobTableColumns) => {
};
const handleView = (row: SysJobTableColumns) => {
detailRef.value.openDialog(toRaw(row));
};
// 任务状态修改
const handleStatusChange = (row: SysJobTableColumns) => {
};
// 任务状态修改
const handleStatusChange = (row: SysJobTableColumns) => {
let text = row.status === 0 ? '启用' : '停用';
ElMessageBox.confirm('确认要"' + text + '""' + row.jobName + '"任务吗?', '警告', {
confirmButtonText: '确定',
@ -300,37 +295,7 @@ export default defineComponent({
.catch(function () {
row.status = row.status === 0 ? 1 : 0;
});
};
return {
proxy,
editRef,
detailRef,
showAll,
loading,
single,
multiple,
word,
queryRef,
resetQuery,
sysJobList,
toggleSearch,
jobGroupFormat,
sys_job_group,
misfirePolicyFormat,
sys_job_policy,
statusFormat,
sys_job_status,
handleSelectionChange,
handleAdd,
handleUpdate,
handleDelete,
handleView,
handleJobRun,
handleStatusChange,
...toRefs(state),
};
},
});
};
</script>
<style lang="scss" scoped>
.colBlock {

92
src/views/system/sysNotice/list/component/NoticeMessageEdit.vue
View File

@ -82,7 +82,7 @@
</el-dialog>
</div>
</template>
<script lang="ts">
<script setup lang="ts">
import {reactive, onMounted, toRefs, defineComponent, ref, unref, getCurrentInstance} from 'vue';
import { ElMessage} from 'element-plus';
import {
@ -95,23 +95,18 @@ import {
SysNoticeInfoData,
SysNoticeEditState
} from "/@/views/system/sysNotice/list/component/model"
export default defineComponent({
name: "NoticeMessageEdit",
components: {
GfUeditor,
},
props: {
defineOptions({ name: "NoticeMessageEdit"})
const props = defineProps({
tagOptions: {
type: Array,
default: () => []
},
},
setup(props, {emit}) {
const {proxy} = <any>getCurrentInstance()
const formRef = ref<HTMLElement | null>(null);
const menuRef = ref();
const state = reactive<SysNoticeEditState>({
})
const emit = defineEmits(["sysNoticeList"]);
const {proxy} = <any>getCurrentInstance()
const formRef = ref<HTMLElement | null>(null);
const menuRef = ref();
const state = reactive<SysNoticeEditState>({
loading: false,
isShowDialog: false,
title: "",
@ -151,12 +146,13 @@ export default defineComponent({
{required: true, message: "状态不能为空", trigger: "blur"}
],
}
});
onMounted(() => {
});
const { isShowDialog,formData,loading,userListOptions,rules,title} = toRefs(state)
onMounted(() => {
remoteUserMethod("");
});
// 打开弹窗
const openDialog = (row?: SysNoticeInfoData) => {
});
// 打开弹窗
const openDialog = (row?: SysNoticeInfoData) => {
resetForm();
if (row) {
getSysNotice(row.id!).then((res: any) => {
@ -175,9 +171,8 @@ export default defineComponent({
})
}
state.isShowDialog = true;
};
const remoteUserMethod = (query: string) => {
};
const remoteUserMethod = (query: string) => {
//console.log("remoteMethod", query)
state.userListOptions = []
getUserList(query).then((res: any) => {
@ -197,27 +192,27 @@ export default defineComponent({
} else {
options.value = []
}*/
}
//设置类型
const setType = (type: number) => {
}
//设置类型
const setType = (type: number) => {
state.formData.type = type
if (type == 1) {
state.title = "通知"
} else if (type == 2) {
state.title = "私信"
}
};
};
// 关闭弹窗
const closeDialog = () => {
// 关闭弹窗
const closeDialog = () => {
state.isShowDialog = false;
};
// 取消
const onCancel = () => {
};
// 取消
const onCancel = () => {
closeDialog();
};
// 提交
const onSubmit = () => {
};
// 提交
const onSubmit = () => {
const formWrap = unref(formRef) as any;
if (!formWrap) return;
formWrap.validate((valid: boolean) => {
@ -244,8 +239,8 @@ export default defineComponent({
}
}
});
};
const resetForm = () => {
};
const resetForm = () => {
state.formData = {
receiver: undefined,
type: undefined,
@ -262,27 +257,12 @@ export default defineComponent({
updatedAt: undefined,
deletedAt: undefined
}
};
//富文本编辑器内容
const setContentEditContent = (data: string) => {
};
//富文本编辑器内容
const setContentEditContent = (data: string) => {
state.formData.content = data
}
return {
proxy,
openDialog,
setType,
closeDialog,
onCancel,
onSubmit,
remoteUserMethod,
menuRef,
formRef,
//富文本编辑器内容
setContentEditContent,
...toRefs(state),
};
}
})
}
defineExpose({openDialog,setType})
</script>
<style scoped>
.kv-label {

128
src/views/system/sysNotice/list/index.vue
View File

@ -16,7 +16,7 @@
</el-col>
<el-col :span="5" class="colBlock">
<el-form-item label="状态" prop="status">
<el-select v-model="tableData.param.status" placeholder="请选择状态" clearable style="width: 160px;">
<el-select v-model="tableData.param.status" placeholder="请选择状态" clearable style="width: 160px">
<el-option label="正常" :value="1"/>
<el-option label="停用" :value="0"/>
</el-select>
@ -24,7 +24,7 @@
</el-col>
<el-col :span="5" class="colBlock">
<el-form-item label="类型" prop="type">
<el-select v-model="tableData.param.type" placeholder="请选择类型" clearable style="width: 160px;">
<el-select v-model="tableData.param.type" placeholder="请选择类型" clearable style="width: 160px">
<el-option label="通知" value="1"/>
<el-option label="公告" value="2"/>
</el-select>
@ -32,7 +32,7 @@
</el-col>
<el-col :span="5" class="colBlock">
<el-form-item label="标签" prop="tag">
<el-select v-model="tableData.param.tag" placeholder="请选择标签" clearable style="width: 160px;">
<el-select v-model="tableData.param.tag" placeholder="请选择标签" clearable style="width: 160px">
<el-option
v-for="dict in notice_tag"
:key="dict.value"
@ -193,52 +193,47 @@
</div>
</template>
<script lang="ts">
<script setup lang="ts">
import {toRefs, reactive, onMounted, ref, defineComponent, computed, getCurrentInstance, toRaw} from 'vue';
import {ElMessageBox, ElMessage, FormInstance} from 'element-plus';
import {
listSysNotice,
delSysNotice,
} from "/src/api/system/notice/sysNotice";
} from "/@/api/system/notice/sysNotice";
import {
SysNoticeTableColumns,
SysNoticeInfoData,
SysNoticeTableDataState,
} from "/@/views/system/sysNotice/list/component/model"
import NoticeMessageEdit from "/@/views/system/sysNotice/list/component/NoticeMessageEdit.vue"
export default defineComponent({
name: "apiV1SystemSysNoticeList",
components: {
NoticeMessageEdit
},
setup() {
const {proxy} = <any>getCurrentInstance()
const loading = ref(false)
const queryRef = ref()
const editRef = ref();
defineOptions({ name: "apiV1SystemSysNoticeList"})
const {proxy} = <any>getCurrentInstance()
const loading = ref(false)
const queryRef = ref()
const editRef = ref();
// 是否显示所有搜索选项
const showAll = ref(false)
// 非单个禁用
const single = ref(true)
// 非多个禁用
const multiple = ref(true)
const word = computed(() => {
// 是否显示所有搜索选项
const showAll = ref(false)
// 非单个禁用
const single = ref(true)
// 非多个禁用
const multiple = ref(true)
const word = computed(() => {
if (showAll.value === false) {
//对文字进行处理
return "展开搜索";
} else {
return "收起搜索";
}
})
// 字典选项数据
const {
})
// 字典选项数据
const {
notice_tag,
} = proxy.useDict(
} = proxy.useDict(
'notice_tag',
)
const state = reactive<SysNoticeTableDataState>({
)
const state = reactive<SysNoticeTableDataState>({
ids: [],
tableData: {
data: [],
@ -256,23 +251,24 @@ export default defineComponent({
dateRange: []
},
},
});
// 页面加载时
onMounted(() => {
});
const { tableData} = toRefs(state)
// 页面加载时
onMounted(() => {
initTableData();
});
// 初始化表格数据
const initTableData = () => {
});
// 初始化表格数据
const initTableData = () => {
sysNoticeList()
};
/** 重置按钮操作 */
const resetQuery = (formEl: FormInstance | undefined) => {
};
/** 重置按钮操作 */
const resetQuery = (formEl: FormInstance | undefined) => {
if (!formEl) return
formEl.resetFields()
sysNoticeList()
};
// 获取列表数据
const sysNoticeList = () => {
};
// 获取列表数据
const sysNoticeList = () => {
loading.value = true
listSysNotice(state.tableData.param).then((res: any) => {
let list = res.data.list ?? [];
@ -283,34 +279,34 @@ export default defineComponent({
state.tableData.total = res.data.total;
loading.value = false
})
};
const toggleSearch = () => {
};
const toggleSearch = () => {
showAll.value = !showAll.value;
}
// 标签字典翻译
const tagFormat = (row: SysNoticeTableColumns) => {
}
// 标签字典翻译
const tagFormat = (row: SysNoticeTableColumns) => {
return proxy.selectDictLabel(notice_tag.value, row.tag);
}
// 多选框选中数据
const handleSelectionChange = (selection: Array<SysNoticeInfoData>) => {
}
// 多选框选中数据
const handleSelectionChange = (selection: Array<SysNoticeInfoData>) => {
state.ids = selection.map(item => item.id)
single.value = selection.length != 1
multiple.value = !selection.length
}
}
const handleAdd = (type: number) => {
const handleAdd = (type: number) => {
editRef.value.openDialog()
editRef.value.setType(type)
}
const handleUpdate = (row: SysNoticeTableColumns) => {
}
const handleUpdate = (row: SysNoticeTableColumns|null) => {
if (!row) {
row = state.tableData.data.find((item: SysNoticeTableColumns) => {
return item.id === state.ids[0]
}) as SysNoticeTableColumns
}
editRef.value.openDialog(toRaw(row));
};
const handleDelete = (row: SysNoticeTableColumns) => {
};
const handleDelete = (row: SysNoticeTableColumns|null) => {
let msg = '你确定要删除所选数据？';
let id: number[] = [];
if (row) {
@ -336,29 +332,7 @@ export default defineComponent({
})
.catch(() => {
});
}
return {
proxy,
editRef,
showAll,
loading,
single,
multiple,
word,
queryRef,
resetQuery,
sysNoticeList,
toggleSearch,
tagFormat,
notice_tag,
handleSelectionChange,
handleAdd,
handleUpdate,
handleDelete,
...toRefs(state),
}
}
})
}
</script>
<style lang="scss" scoped>
.colBlock {

69
src/views/system/sysNotice/show/index.vue
View File

@ -90,7 +90,7 @@
</div>
</template>
<script lang="ts">
<script setup lang="ts">
import {useRoute} from "vue-router";
import {toRefs, reactive, onMounted, ref, defineComponent, getCurrentInstance} from 'vue';
import {ElMessageBox, ElMessage, FormInstance} from 'element-plus';
@ -102,15 +102,11 @@ import {
SysNoticeTableDataState,
} from "/@/views/system/sysNotice/list/component/model"
import {readNotice} from "/@/api/system/notice/sysNoticeRead";
export default defineComponent({
name: "",
components: {},
setup() {
const route = useRoute();
const {proxy} = <any>getCurrentInstance()
const loading = ref(false)
const state = reactive<SysNoticeTableDataState>({
defineOptions({ name: "apiV1SystemSysNoticeShow"})
const route = useRoute();
const {proxy} = <any>getCurrentInstance()
const loading = ref(false)
const state = reactive<SysNoticeTableDataState>({
ids: [],
tableData: {
data: [],
@ -128,26 +124,27 @@ export default defineComponent({
dateRange: []
},
},
});
// 页面加载时
onMounted(() => {
});
const { tableData}= toRefs(state)
// 页面加载时
onMounted(() => {
if (route.query.type){
state.tableData.param.type = parseInt(route.query.type as string)
}
initTableData();
});
// 初始化表格数据
const initTableData = () => {
});
// 初始化表格数据
const initTableData = () => {
sysNoticeList()
};
/** 重置按钮操作 */
const resetQuery = (formEl: FormInstance | undefined) => {
};
/** 重置按钮操作 */
const resetQuery = (formEl: FormInstance | undefined) => {
if (!formEl) return
formEl.resetFields()
sysNoticeList()
};
// 获取列表数据
const sysNoticeList = () => {
};
// 获取列表数据
const sysNoticeList = () => {
loading.value = true
listShowNotice(state.tableData.param).then((res: any) => {
let list = res.data.list ?? [];
@ -158,17 +155,17 @@ export default defineComponent({
state.tableData.total = res.data.total;
loading.value = false
})
};
};
const handleTabsClick = (e: any) => {
const handleTabsClick = (e: any) => {
//console.log(e.props.name)
state.tableData.param.type = e.props.name
sysNoticeList()
}
}
const handleDelete = (row: SysNoticeTableColumns) => {
const handleDelete = (row: SysNoticeTableColumns) => {
let msg = '你确定要删除所选数据？';
let id: number[] = [];
if (row) {
@ -194,9 +191,9 @@ export default defineComponent({
})
.catch(() => {
});
}
// eslint-disable-next-line no-undef
const handleRead = (item: any) => {
}
// eslint-disable-next-line no-undef
const handleRead = (item: any) => {
// console.log("handleRead", item)
let query = {
noticeId: item.id
@ -205,19 +202,7 @@ export default defineComponent({
sysNoticeList()
ElMessage.success("已读");
})
}
return {
proxy,
loading,
resetQuery,
sysNoticeList,
handleTabsClick,
handleDelete,
handleRead,
...toRefs(state),
}
}
})
}
</script>
<style lang="scss" scoped>
.el_icon {

43
src/views/system/tools/gen/component/basicInfo.vue
View File

@ -104,17 +104,15 @@
</div>
</template>
<script lang="ts">
import { defineComponent, inject, reactive, ref, unref } from 'vue';
<script setup lang="ts">
import { inject, reactive, ref, unref } from 'vue';
import type { FormInstance, FormRules } from 'element-plus';
import type { TableDataInfo } from '/@/views/system/tools/gen/component/model';
import { ElMessage } from 'element-plus';
export default defineComponent({
name: 'toolsBasicInfoForm',
emits: ['goNext','close'],
setup(props, { emit }) {
const basicInfoFormRef = ref<FormInstance>();
const overwriteOptions = ref([
defineOptions({ name: "toolsBasicInfoForm"})
const emit = defineEmits(['goNext','close']);
const basicInfoFormRef = ref<FormInstance>();
const overwriteOptions = ref([
{key:"api",name:"覆盖api"},
{key:"controller",name:"覆盖controller"},
{key:"dao",name:"覆盖dao"},
@ -132,9 +130,9 @@ export default defineComponent({
{key:"vue",name:"覆盖vue-list"},
{key:"vueDetail",name:"覆盖vue-detail"},
{key:"vueEdit",name:"覆盖vue-edit"},
])
const info = inject<TableDataInfo>('tableData') as TableDataInfo;
const nextTip = (): boolean => {
])
const info = inject<TableDataInfo>('tableData') as TableDataInfo;
const nextTip = (): boolean => {
//表单验证
let tag = false;
const formWrap = unref(basicInfoFormRef) as any;
@ -148,33 +146,22 @@ export default defineComponent({
}
});
return tag;
};
const close = ()=>{
};
const close = ()=>{
emit('close')
}
const overwriteChange = (value:boolean)=>{
}
const overwriteChange = (value:boolean)=>{
info.value.overwriteInfo.map((item:any)=>{
item.value = value
})
}
const rules = reactive<FormRules>({
}
const rules = reactive<FormRules>({
tableName: [{ required: true, message: '请输入表名称', trigger: 'blur' }],
tableComment: [{ required: true, message: '请输入表描述', trigger: 'blur' }],
className: [{ required: true, message: '请输入实体类名称', trigger: 'blur' }],
functionAuthor: [{ required: true, message: '请输入作者', trigger: 'blur' }],
sortColumn: [{ required: true, message: '请选择排序字段', trigger: 'blur' }],
sortType: [{ required: true, message: '请选择排序类型', trigger: 'blur' }],
});
return {
basicInfoFormRef,
info,
rules,
overwriteOptions,
nextTip,
overwriteChange,
close
};
},
});
</script>

92
src/views/system/tools/gen/component/edit.vue
View File

@ -23,9 +23,9 @@
<el-col :span="4"></el-col>
</el-row>
</div>
<tools-basic-info-form ref="toolsBasicInfoForm" v-show="active === 1" @goNext="goNext" @close="close"></tools-basic-info-form>
<gen-info-form ref="genInfoForm" v-show="active === 2" @goNext="goNext" @close="close"></gen-info-form>
<gen-table-columns ref="tableColumns" v-show="active === 3"></gen-table-columns>
<toolsBasicInfoForm ref="toolsBasicInfoFormRef" v-show="active === 1" @goNext="goNext" @close="close"></toolsBasicInfoForm>
<genInfoForm ref="genInfoFormRef" v-show="active === 2" @goNext="goNext" @close="close"></genInfoForm>
<genTableColumns ref="tableColumnsRef" v-show="active === 3"></genTableColumns>
<div class="tools-footer" v-show="active === 3">
<el-button size="default" @click="close">关 闭</el-button>
<el-button type="primary" @click="onSubmit" size="default">保 存</el-button>
@ -34,8 +34,8 @@
</div>
</template>
<script lang="ts">
import {defineComponent, onBeforeMount, ref, provide, getCurrentInstance} from 'vue';
<script setup lang="ts">
import {onBeforeMount, ref, provide, getCurrentInstance} from 'vue';
import { useRoute } from 'vue-router';
import toolsBasicInfoForm from '/@/views/system/tools/gen/component/basicInfo.vue';
import { TableColumns, TableDataInfo } from '/@/views/system/tools/gen/component/model';
@ -43,23 +43,20 @@ import { ElMessage } from 'element-plus/es';
import {getGenTable, saveEdit} from '/@/api/system/tools/gen';
import genInfoForm from '/@/views/system/tools/gen/component/genInfoForm.vue';
import genTableColumns from '/@/views/system/tools/gen/component/tableColumns.vue';
export default defineComponent({
name: 'apiV1SystemToolsGenColumnList',
components: { toolsBasicInfoForm, genInfoForm,genTableColumns },
setup() {
const { proxy } = getCurrentInstance() as any;
const route = useRoute();
const toolsBasicInfoForm = ref();
const genInfoForm = ref();
const tableColumns = ref()
const active = ref(1);
defineOptions({ name: "apiV1SystemToolsGenColumnEdit"})
const { proxy } = getCurrentInstance() as any;
const route = useRoute();
const toolsBasicInfoFormRef = ref();
const genInfoFormRef = ref();
const tableColumnsRef = ref()
const active = ref(1);
const changeSteps = (args: number) => {
const changeSteps = (args: number) => {
if (args > active.value) {
switch (args) {
case 2:
//验证基本信息表单
if (toolsBasicInfoForm.value.nextTip()) {
if (toolsBasicInfoFormRef.value.nextTip()) {
active.value = args;
}
break;
@ -67,12 +64,12 @@ export default defineComponent({
//验证生成信息表单
if (active.value==1){
//验证基本信息表单
if (toolsBasicInfoForm.value.nextTip()) {
if (toolsBasicInfoFormRef.value.nextTip()) {
active.value = args;
}
}else{
//验证生成信息表单
if (genInfoForm.value.nextTip()) {
if (genInfoFormRef.value.nextTip()) {
active.value = args;
}
}
@ -81,8 +78,8 @@ export default defineComponent({
} else {
active.value = args;
}
};
const defaultOverwriteInfo = [
};
const defaultOverwriteInfo = [
{key:"api",value:false},
{key:"controller",value:false},
{key:"dao",value:false},
@ -100,11 +97,11 @@ export default defineComponent({
{key:"vue",value:false},
{key:"vueDetail",value:false},
{key:"vueEdit",value:false},
]
// 表详细信息
const info = ref(<TableDataInfo>{overwriteInfo:defaultOverwriteInfo});
provide('tableData', info);
const mergeArraysByKey = (arrays:Array<Array<object>>, key:string) :Array<any> => {
]
// 表详细信息
const info = ref(<TableDataInfo>{overwriteInfo:defaultOverwriteInfo});
provide('tableData', info);
const mergeArraysByKey = (arrays:Array<Array<object>>, key:string) :Array<any> => {
const merged:any={}
// 遍历所有数组，后面的数组会覆盖前面的数组
arrays.forEach(array => {
@ -115,8 +112,8 @@ export default defineComponent({
});
// 将merged对象转换为数组
return Object.values(merged);
}
onBeforeMount(() => {
}
onBeforeMount(() => {
const tableId = route.query?.tableId;
if (tableId) {
// 获取表详细信息
@ -133,9 +130,9 @@ export default defineComponent({
} else {
ElMessage.error('参数错误');
}
});
// 表单组件验证
const formRulesValidate = (pageRef: string, sonRef: string) => {
});
// 表单组件验证
const formRulesValidate = (pageRef: string, sonRef: string) => {
return new Promise((resolve,reject) => {
proxy.$refs[pageRef].$refs[sonRef].validate((valid: boolean) => {
if (valid) {
@ -145,11 +142,11 @@ export default defineComponent({
}
});
});
};
const onSubmit = () => {
};
const onSubmit = () => {
Promise.all([
formRulesValidate('toolsBasicInfoForm', 'basicInfoFormRef'),
formRulesValidate('genInfoForm', 'genInfoFormRef'),
formRulesValidate('toolsBasicInfoFormRef', 'basicInfoFormRef'),
formRulesValidate('genInfoFormRef', 'genInfoFormRef'),
]).then(() => {
saveEdit(info.value).then(()=>{
ElMessage.success('保存成功');
@ -158,31 +155,18 @@ export default defineComponent({
}).catch(e=>{
ElMessage.error(e.toString());
});
};
const goNext = () => {
};
const goNext = () => {
if (active.value > 2) {
active.value = 1;
} else {
active.value++;
}
};
//取消返回
const close = ()=>{
};
//取消返回
const close = ()=>{
proxy.mittBus.emit('onCurrentContextmenuClick', Object.assign({}, { contextMenuClickId: 1, ...route }));
}
return {
toolsBasicInfoForm,
genInfoForm,
tableColumns,
active,
changeSteps,
info,
onSubmit,
goNext,
close
};
},
});
}
</script>
<style scoped>

43
src/views/system/tools/gen/component/genInfoForm.vue
View File

@ -150,26 +150,24 @@
</el-card>
</template>
<script lang="ts">
<script setup lang="ts">
import {defineComponent, inject, reactive, ref, unref} from 'vue';
import type { FormInstance, FormRules } from 'element-plus';
import { TableDataInfo } from '/@/views/system/tools/gen/component/model';
import {ElMessage} from "element-plus";
import {Ref, UnwrapRef} from "@vue/reactivity";
export default defineComponent({
name: 'genInfoForm',
emits:['goNext','close'],
setup(props,{emit}) {
const genInfoFormRef = ref<FormInstance>();
const info = inject<Ref<UnwrapRef<TableDataInfo>>>('tableData') as Ref<UnwrapRef<TableDataInfo>>;
const rules = reactive<FormRules>({
defineOptions({ name: "genInfoForm"})
const emit = defineEmits(['goNext','close']);
const genInfoFormRef = ref<FormInstance>();
const info = inject<Ref<UnwrapRef<TableDataInfo>>>('tableData') as Ref<UnwrapRef<TableDataInfo>>;
const rules = reactive<FormRules>({
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 nextTip = ()=>{
});
const nextTip = ()=>{
//表单验证
let tag = false;
const formWrap = unref(genInfoFormRef) as any;
@ -183,31 +181,22 @@ export default defineComponent({
}
});
return tag;
}
const close = ()=>{
}
const close = ()=>{
emit('close')
}
const getLastSubstring = (str:string):string => {
}
const getLastSubstring = (str:string):string => {
let lastIndex = str.lastIndexOf('/');
if (lastIndex !== -1) {
return str.substring(lastIndex + 1);
} else {
return str;
}
}
const setModuleName = (value:string)=>{
}
const setModuleName = (value:string)=>{
info.value.moduleName = getLastSubstring(value)
}
return {
genInfoFormRef,
info,
rules,
setModuleName,
nextTip,
close
};
},
});
}
defineExpose({nextTip})
</script>
<style scoped>

66
src/views/system/tools/gen/component/importTable.vue
View File

@ -48,21 +48,19 @@
</el-dialog>
</template>
<script lang="ts">
<script setup lang="ts">
import {defineComponent, reactive, ref, toRefs} from "vue";
import {ImportTableDataState,TableData} from "/@/views/system/tools/gen/component/model"
import {getImportTableList, importTable} from "/@/api/system/tools/gen";
import {ElMessage} from "element-plus/es";
export default defineComponent({
name: "importTable",
emits:['ok'],
setup(prop,{emit}) {
const queryFormRef = ref()
const tableRef = ref()
const visible = ref(false)
// 选中数组值
let tables:string[] = []
const state = reactive<ImportTableDataState>({
defineOptions({ name: "importTable"})
const emit = defineEmits(['ok'])
const queryFormRef = ref()
const tableRef = ref()
const visible = ref(false)
// 选中数组值
let tables:string[] = []
const state = reactive<ImportTableDataState>({
tableData:{
data:[],
total:0,
@ -74,28 +72,29 @@ export default defineComponent({
tableComment: ''
},
}
})
const getList = ()=>{
})
const {tableData} = toRefs(state)
const getList = ()=>{
getImportTableList(state.tableData.param).then(res=>{
state.tableData.data = res.data.list??[]
state.tableData.total = res.data.total
})
}
const handleQuery = ()=>{
}
const handleQuery = ()=>{
state.tableData.param.pageNum = 1
getList()
}
const resetQuery=()=>{
}
const resetQuery=()=>{
queryFormRef.value.resetFields()
getList()
}
const clickRow=(row:TableData)=>{
}
const clickRow=(row:TableData)=>{
tableRef.value.toggleRowSelection(row);
}
const handleSelectionChange=(selection:Array<any>)=>{
}
const handleSelectionChange=(selection:Array<any>)=>{
tables = selection.map(item => item.tableName);
}
const handleImportTable=()=>{
}
const handleImportTable=()=>{
if(tables.length==0){
ElMessage.error("请选择要导入的表格");
return
@ -107,26 +106,11 @@ export default defineComponent({
emit("ok");
}
})
}
const openDialog = ()=>{
}
const openDialog = ()=>{
getList()
visible.value = true
}
return {
queryFormRef,
tableRef,
visible,
getList,
handleQuery,
resetQuery,
clickRow,
handleSelectionChange,
handleImportTable,
openDialog,
...toRefs(state),
};
}
})
}
</script>
<style scoped>

40
src/views/system/tools/gen/component/preview.vue
View File

@ -25,30 +25,28 @@
</div>
</template>
<script lang="ts">
<script setup lang="ts">
import {defineComponent, reactive, toRefs, ref, onBeforeMount, onMounted} from "vue";
import {previewState} from "/@/views/system/tools/gen/component/model";
import {showPreview} from "/@/api/system/tools/gen";
import MyCodeMirror from "/@/components/myCodeMirror/index.vue";
import { ElLoading } from 'element-plus'
export default defineComponent({
name: "genCodePreview",
components: {MyCodeMirror},
setup(){
const height = ref(400)
// 预览参数
const preview:previewState = reactive({
defineOptions({ name: "genCodePreview"})
const height = ref(400)
// 预览参数
const preview:previewState = reactive({
flush: true,
fullscreen: false,
open: false,
title: "代码预览",
data: {},
activeName: "api"
})
const getWindowInfo = () => {
})
const { data, activeName, fullscreen, open, title}=toRefs(preview)
const getWindowInfo = () => {
height.value = document.getElementsByTagName('body')[0].clientHeight-130;
};
const showView = (tableId:number)=>{
};
const showView = (tableId:number)=>{
const loading = ElLoading.service({
lock: true,
text: 'Loading',
@ -61,20 +59,14 @@ export default defineComponent({
}).catch(()=>{
loading.close()
})
}
onMounted(()=>{
}
onMounted(()=>{
height.value = document.getElementsByTagName('body')[0].clientHeight-130;
})
onBeforeMount(()=>{
window.addEventListener('resize', getWindowInfo);
})
return {
showView,
height,
...toRefs(preview)
}
},
})
onBeforeMount(()=>{
window.addEventListener('resize', getWindowInfo);
})
defineExpose({showView})
</script>
<style lang="scss" scoped>

60
src/views/system/tools/gen/component/relationTable.vue
View File

@ -66,20 +66,18 @@
</el-dialog>
</template>
<script lang="ts">
<script setup lang="ts">
import {defineComponent, reactive, ref, toRefs} from "vue";
import {ImportTableDataState, TableColumns, TableData} from "/@/views/system/tools/gen/component/model"
import {getRelationTable, importTable} from "/@/api/system/tools/gen";
import {ElMessage} from "element-plus/es";
export default defineComponent({
name: "relationTable",
emits:['ok'],
setup(prop,{emit}) {
const queryFormRef = ref()
const tableRef = ref()
const visible = ref(false)
const columnId = ref<number>()
const state = reactive<ImportTableDataState>({
defineOptions({ name: "relationTable"})
const emit = defineEmits(['ok'])
const queryFormRef = ref()
const tableRef = ref()
const visible = ref(false)
const columnId = ref<number>()
const state = reactive<ImportTableDataState>({
tableData:{
data:[],
total:0,
@ -91,27 +89,28 @@ export default defineComponent({
tableComment: ''
},
}
})
const getList = ()=>{
})
const { tableData} = toRefs(state)
const getList = ()=>{
getRelationTable(state.tableData.param).then((res:any)=>{
state.tableData.data = res.data.data??[]
state.tableData.total = res.data.total
})
}
const handleQuery = ()=>{
}
const handleQuery = ()=>{
state.tableData.param.pageNum = 1
getList()
}
const resetQuery=()=>{
}
const resetQuery=()=>{
queryFormRef.value.resetFields()
getList()
}
const clickRow=(row:TableColumns)=>{
}
const clickRow=(row:TableColumns)=>{
tableRef.value.toggleRowSelection(row);
}
}
const handleImportTable=(row:TableColumns)=>{
const handleImportTable=(row:TableColumns)=>{
if(!row.linkLabelId){
ElMessage.error("请选择关联表key")
return
@ -126,26 +125,13 @@ export default defineComponent({
linkLabelName:row.linkLabelName
});
visible.value = false;
}
const openDialog = (cid:number)=>{
}
const openDialog = (cid:number)=>{
columnId.value = cid
getList()
visible.value = true
}
return {
queryFormRef,
tableRef,
visible,
getList,
handleQuery,
resetQuery,
clickRow,
handleImportTable,
openDialog,
...toRefs(state),
};
}
})
}
defineExpose({openDialog})
</script>
<style scoped lang="scss">

57
src/views/system/tools/gen/component/tableColumns.vue
View File

@ -158,16 +158,11 @@
<textarea class="el-textarea__inner" v-model.lazy="scope.row.minWidth" ></textarea>
</template>
</el-table-column>
<el-table-column label="详情占列" width="70">
<el-table-column label="详情占列" width="100">
<template #default="scope">
<textarea class="el-textarea__inner" v-model.lazy="scope.row.colSpan" ></textarea>
</template>
</el-table-column>
<el-table-column label="详情起新行" width="50">
<template #default="scope">
<el-checkbox true-value="1" v-model="scope.row.isRowStart"></el-checkbox>
</template>
</el-table-column>
<el-table-column label="字典类型" width="160">
<template #default="scope">
<el-select v-model="scope.row.dictType" clearable filterable placeholder="请选择">
@ -202,34 +197,30 @@
</div>
</template>
<script lang="ts">
import {defineComponent, inject, nextTick, onBeforeMount, ref} from 'vue';
<script setup lang="ts">
import { inject, onBeforeMount, ref} from 'vue';
import type { FormInstance } from 'element-plus';
import {DictOpt, TableColumns, TableDataInfo} from '/@/views/system/tools/gen/component/model';
import {optionselect} from "/@/api/system/dict/type";
import RelationTable from "/@/views/system/tools/gen/component/relationTable.vue";
import importTable from "/@/views/system/tools/gen/component/importTable.vue";
import _ from "lodash";
export default defineComponent({
name: 'genTableColumns',
components: {importTable, RelationTable},
setup() {
const relationTableRef = ref();
const tableColumnsRef = ref<FormInstance>();
const info = inject<TableDataInfo>('tableData') as TableDataInfo;
// 表格的高度
const tableHeight = ref(document.documentElement.scrollHeight - 300 + 'px');
const dictOptions = ref(<DictOpt[]>[])
onBeforeMount(()=>{
defineOptions({ name: "genTableColumns"})
const relationTableRef = ref();
const tableColumnsRef = ref<FormInstance>();
const info = inject<any>('tableData');
// 表格的高度
const tableHeight = ref(document.documentElement.scrollHeight - 300 + 'px');
const dictOptions = ref(<DictOpt[]>[])
onBeforeMount(()=>{
//获取字典选项
optionselect().then((res:any)=>{
dictOptions.value = res.data.dictType??[]
})
})
const handleChangeConfig = (row:TableColumns)=>{
})
const handleChangeConfig = (row:TableColumns)=>{
relationTableRef.value.openDialog(row.columnId)
}
const setRelationTable = (cid:number,data:any)=>{
}
const setRelationTable = (cid:number,data:any)=>{
info.value.columns.map((item:TableColumns,index :number)=>{
if(item.columnId===cid){
let d = _.cloneDeep(item)
@ -239,8 +230,8 @@ export default defineComponent({
info.value.columns[index] = d
}
})
}
const handleRemoveRelation = (row:TableColumns)=>{
}
const handleRemoveRelation = (row:TableColumns)=>{
info.value.columns.map((item:TableColumns,index :number)=>{
if(item.columnId===row.columnId){
let d = _.cloneDeep(item)
@ -250,19 +241,7 @@ export default defineComponent({
info.value.columns[index] = d
}
})
}
return {
relationTableRef,
tableColumnsRef,
info,
tableHeight,
dictOptions,
handleChangeConfig,
setRelationTable,
handleRemoveRelation
};
},
});
}
</script>
<style scoped>

119
src/views/system/tools/gen/index.vue
View File

@ -100,7 +100,7 @@
</div>
</template>
<script lang="ts">
<script setup lang="ts">
import {toRefs, reactive, onMounted, ref, defineComponent} from 'vue';
import {ElMessageBox, ElMessage, FormInstance} from 'element-plus';
import {getTableList, deleteTables, batchGenCode, syncTable} from "/@/api/system/tools/gen";
@ -109,17 +109,14 @@ import importTable from "/@/views/system/tools/gen/component/importTable.vue";
import { useRouter } from 'vue-router';
import genCodePreview from '/@/views/system/tools/gen/component/preview.vue'
import {refreshBackEndControlRoutes} from "/@/router/backEnd";
export default defineComponent({
name: 'apiV1SystemToolsGenTableList',
components: {importTable,genCodePreview},
setup() {
const router = useRouter()
const addPostRef = ref()
const editPostRef = ref()
const queryRef = ref()
const importRef = ref()
const genCodePreviewRef = ref()
const state = reactive<TableDataState>({
defineOptions({ name: "apiV1SystemToolsGenTableList"})
const router = useRouter()
const addPostRef = ref()
const editPostRef = ref()
const queryRef = ref()
const importRef = ref()
const genCodePreviewRef = ref()
const state = reactive<TableDataState>({
ids:[],
// 非单个禁用
single: true,
@ -138,25 +135,26 @@ export default defineComponent({
dateRange: []
},
},
});
// 初始化表格数据
const initTableData = () => {
});
const {single,multiple, tableData}=toRefs(state)
// 初始化表格数据
const initTableData = () => {
tableList()
};
const tableList = ()=>{
};
const tableList = ()=>{
getTableList(state.tableData.param).then(res=>{
state.tableData.data = res.data.list??[];
state.tableData.total = res.data.total;
})
};
/** 重置按钮操作 */
const resetQuery = (formEl: FormInstance | undefined) => {
};
/** 重置按钮操作 */
const resetQuery = (formEl: FormInstance | undefined) => {
if (!formEl) return
formEl.resetFields()
tableList()
};
// 删除导入的表
const onRowDel = (row: TableData) => {
};
// 删除导入的表
const onRowDel = (row: TableData|null) => {
let msg = '你确定要删除所选数据？';
let ids:number[] = [] ;
if(row){
@ -182,27 +180,27 @@ export default defineComponent({
})
})
.catch(() => {});
};
// 分页改变
const onHandleSizeChange = (val: number) => {
};
// 分页改变
const onHandleSizeChange = (val: number) => {
state.tableData.param.pageSize = val;
};
// 分页改变
const onHandleCurrentChange = (val: number) => {
};
// 分页改变
const onHandleCurrentChange = (val: number) => {
state.tableData.param.pageNum = val;
};
// 页面加载时
onMounted(() => {
};
// 页面加载时
onMounted(() => {
initTableData();
});
// 多选框选中数据
const handleSelectionChange = (selection:Array<TableData>)=> {
});
// 多选框选中数据
const handleSelectionChange = (selection:Array<TableData>)=> {
state.ids = selection.map(item => item.tableId)
state.multiple = !selection.length
state.single = selection.length != 1
state.tableNames = selection.map(item=>item.tableName)
};
const handleGenTable=(row: TableData)=>{
};
const handleGenTable=(row: TableData|null)=>{
let msg = '你确定要生成？';
let ids:number[] = [] ;
if(row){
@ -229,49 +227,28 @@ export default defineComponent({
})
})
.catch(() => {});
}
// 重置菜单session
const resetMenuSession = () => {
}
// 重置菜单session
const resetMenuSession = () => {
refreshBackEndControlRoutes();
};
//打开导入页面
const openImportTable=()=>{
};
//打开导入页面
const openImportTable=()=>{
importRef.value.openDialog()
}
const handlePreview = (row:TableData)=>{
}
const handlePreview = (row:TableData)=>{
genCodePreviewRef.value.showView(row.tableId);
}
const handleEditTable=(row:TableData)=>{
}
const handleEditTable=(row:TableData|null)=>{
const tableId = row?.tableId || state.ids[0];
router.push({ path: "/system/tools/gen/edit", query: { tableId: tableId } });
}
const handleSyncTable=((row:TableData)=>{
}
const handleSyncTable=((row:TableData)=>{
const tableId = row?.tableId || state.ids[0];
syncTable(tableId).then((res:any)=>{
if (res.code === 0) {
ElMessage.success('同步成功');
}
})
})
return {
addPostRef,
editPostRef,
queryRef,
importRef,
genCodePreviewRef,
onRowDel,
onHandleSizeChange,
onHandleCurrentChange,
tableList,
resetQuery,
handleSelectionChange,
handleGenTable,
openImportTable,
handleEditTable,
handlePreview,
handleSyncTable,
...toRefs(state),
};
},
});
})
</script>

82
src/views/system/user/component/editUser.vue
View File

@ -94,10 +94,10 @@
<el-form-item label="用户类型">
<el-radio-group v-model="ruleForm.isAdmin">
<el-radio
:label="1"
:value="1"
>后台管理员</el-radio>
<el-radio
:label="0"
:value="0"
>前台用户</el-radio>
</el-radio-group>
</el-form-item>
@ -119,15 +119,13 @@
</div>
</template>
<script lang="ts">
<script setup lang="ts">
import {reactive, toRefs, onMounted, defineComponent, ref, unref, getCurrentInstance} from 'vue';
import {getParams, addUser, editUser, getEditUser} from "/@/api/system/user";
import {ElMessage} from "element-plus";
export default defineComponent({
name: 'systemEditUser',
props:{
defineOptions({ name: "systemEditUser"})
const props = defineProps({
deptData:{
type:Array,
default:()=>[]
@ -136,13 +134,13 @@ export default defineComponent({
type:Array,
default:()=>[]
}
},
setup(prop,{emit}) {
const {proxy} = getCurrentInstance() as any;
const roleList = ref([]);
const postList = ref([]);
const formRef = ref<HTMLElement | null>(null);
const state = reactive({
})
const emit = defineEmits(['getUserList']);
const {proxy} = getCurrentInstance() as any;
const roleList = ref([]);
const postList = ref([]);
const formRef = ref<HTMLElement | null>(null);
const state = reactive({
isShowDialog: false,
ruleForm: {
userId: 0,
@ -189,9 +187,10 @@ export default defineComponent({
}
]
}
});
// 打开弹窗
const openDialog = (row?:any) => {
});
const { ruleForm, isShowDialog, rules}=toRefs(state)
// 打开弹窗
const openDialog = (row?:any) => {
resetForm()
if(row) {
getEditUser(row.id).then((res:any)=>{
@ -214,17 +213,17 @@ export default defineComponent({
})
}
state.isShowDialog = true;
};
// 关闭弹窗
const closeDialog = () => {
};
// 关闭弹窗
const closeDialog = () => {
state.isShowDialog = false;
};
// 取消
const onCancel = () => {
};
// 取消
const onCancel = () => {
closeDialog();
};
// 新增
const onSubmit = () => {
};
// 新增
const onSubmit = () => {
const formWrap = unref(formRef) as any;
if (!formWrap) return;
formWrap.validate((valid: boolean) => {
@ -246,9 +245,9 @@ export default defineComponent({
}
}
});
};
// 初始化部门数据
const initTableData = () => {
};
// 初始化部门数据
const initTableData = () => {
//获取角色岗位选项
getParams().then((res:any)=>{
const roles = res.data.roleList??[];
@ -261,12 +260,12 @@ export default defineComponent({
roleList.value = proxy.handleTree(roles??[], "id","pid","children",true);
postList.value = res.data.posts??[];
});
};
// 页面加载时
onMounted(() => {
};
// 页面加载时
onMounted(() => {
initTableData();
});
const resetForm = ()=>{
});
const resetForm = ()=>{
state.ruleForm = {
userId: 0,
deptId: 0,
@ -282,17 +281,6 @@ export default defineComponent({
roleIds: [],
isAdmin:0,
}
};
return {
openDialog,
closeDialog,
onCancel,
onSubmit,
roleList,
postList,
formRef,
...toRefs(state),
};
},
});
};
defineExpose({openDialog})
</script>

88
src/views/system/user/component/userList.vue
View File

@ -45,7 +45,7 @@
</div>
</template>
<script lang="ts">
<script setup lang="ts">
import {toRefs, reactive, onMounted, ref, defineComponent, getCurrentInstance} from 'vue';
import {ElMessageBox, ElMessage} from 'element-plus';
import EditUser from '/@/views/system/user/component/editUser.vue';
@ -71,9 +71,8 @@ interface TableParam {
keyWords:string;
dateRange: string[];
}
export default defineComponent({
name: 'systemUserList',
props:{
defineOptions({ name: "systemUserList"})
const props = defineProps({
deptData:{
type:Array,
default:()=>[]
@ -86,13 +85,11 @@ export default defineComponent({
type:Array,
default:()=>[]
}
},
components: { EditUser },
setup() {
const {proxy,props} = <any>getCurrentInstance();
const {sys_user_sex} = proxy.useDict('sys_user_sex')
const editUserRef = ref();
const state = reactive<TableDataState>({
})
const {proxy} = <any>getCurrentInstance();
const {sys_user_sex} = proxy.useDict('sys_user_sex')
const editUserRef = ref();
const state = reactive<TableDataState>({
ids:[],
deptProps:{
id:"deptId",
@ -114,28 +111,29 @@ export default defineComponent({
dateRange:[]
},
},
});
// 初始化表格数据
const initTableData = () => {
});
const { tableData} = toRefs(state);
// 初始化表格数据
const initTableData = () => {
userList();
};
const userList = ()=>{
};
const userList = ()=>{
const param = {...state.tableData.param, ...props.param};
getUserList(param).then((res:any)=>{
state.tableData.data = res.data.userList??[];
state.tableData.total = res.data.total;
});
};
// 打开新增用户弹窗
const onOpenAddUser = () => {
};
// 打开新增用户弹窗
const onOpenAddUser = () => {
editUserRef.value.openDialog();
};
// 打开修改用户弹窗
const onOpenEditUser = (row:any) => {
};
// 打开修改用户弹窗
const onOpenEditUser = (row:any) => {
editUserRef.value.openDialog(row);
};
// 删除用户
const onRowDel = (row:any) => {
};
// 删除用户
const onRowDel = (row:any) => {
let msg = '你确定要删除所选用户？';
let ids:number[] = [] ;
if(row){
@ -160,17 +158,17 @@ export default defineComponent({
})
})
.catch(() => {});
};
// 页面加载时
onMounted(() => {
};
// 页面加载时
onMounted(() => {
initTableData();
});
// 多选框选中数据
const handleSelectionChange = (selection:any[])=> {
});
// 多选框选中数据
const handleSelectionChange = (selection:any[])=> {
state.ids = selection.map(item => item.id)
};
/** 重置密码按钮操作 */
const handleResetPwd = (row:any)=> {
};
/** 重置密码按钮操作 */
const handleResetPwd = (row:any)=> {
ElMessageBox.prompt('请输入"' + row.userName + '"的新密码', "提示", {
confirmButtonText: "确定",
cancelButtonText: "取消"
@ -183,9 +181,9 @@ export default defineComponent({
ElMessage.success("修改成功，新密码是：" + value);
});
}).catch(() => {});
};
// 用户状态修改
const handleStatusChange = (row:any)=> {
};
// 用户状态修改
const handleStatusChange = (row:any)=> {
let text = row.userStatus === 1 ? "启用" : "停用";
ElMessageBox.confirm('确认要"' + text + '"："' + row.userName + '"用户吗?', "警告", {
confirmButtonText: "确定",
@ -198,19 +196,5 @@ export default defineComponent({
}).catch(function() {
row.userStatus =row.userStatus === 0 ?1 : 0;
});
};
return {
editUserRef,
onOpenAddUser,
onOpenEditUser,
onRowDel,
sys_user_sex,
userList,
handleSelectionChange,
handleResetPwd,
handleStatusChange,
...toRefs(state),
};
},
});
};
</script>

96
src/views/system/user/index.vue
View File

@ -5,7 +5,7 @@
<el-card shadow="hover">
<el-aside>
<el-scrollbar>
<el-input :prefix-icon="search" v-model="filterText" placeholder="请输入部门名称" clearable size="default" style="width: 80%;"/>
<el-input :prefix-icon="search" v-model="filterText" placeholder="请输入部门名称" clearable style="width: 80%;"/>
<el-tree
ref="treeRef"
class="filter-tree"
@ -82,7 +82,7 @@
</el-icon>
新增用户
</el-button>
<el-button size="default" type="danger" class="ml10" @click="onRowDel(null)">
<el-button size="default" type="danger" class="ml10" @click="onRowDel()">
<el-icon>
<ele-Delete />
</el-icon>
@ -99,7 +99,7 @@
</div>
</template>
<script lang="ts">
<script setup lang="ts">
import {toRefs, reactive, onMounted, ref, defineComponent, watch, getCurrentInstance} from 'vue';
import {ElTree,FormInstance} from 'element-plus';
import { Search } from '@element-plus/icons-vue'
@ -118,19 +118,15 @@ interface QueryParam {
dateRange: string[];
};
}
export default defineComponent({
name: 'systemUser',
components: { UserList },
setup() {
const {proxy} = <any>getCurrentInstance();
const {sys_user_sex} = proxy.useDict('sys_user_sex')
const userListRef = ref();
const queryRef = ref();
const filterText = ref('');
const treeRef = ref<InstanceType<typeof ElTree>>();
const search = Search
const state = reactive<QueryParam>({
defineOptions({ name: "systemUser"})
const {proxy} = <any>getCurrentInstance();
const {sys_user_sex} = proxy.useDict('sys_user_sex')
const userListRef = ref();
const queryRef = ref();
const filterText = ref('');
const treeRef = ref<InstanceType<typeof ElTree>>();
const search = Search
const state = reactive<QueryParam>({
ids:[],
deptProps:{
id:"deptId",
@ -165,61 +161,45 @@ export default defineComponent({
keyWords:'',
dateRange:[]
},
});
// 初始化表格数据
const initTableData = () => {
});
const { deptData,deptProps,param}=toRefs(state)
// 初始化表格数据
const initTableData = () => {
getDeptTree().then((res:any)=>{
state.deptData = res.data.deps
})
};
const userList = ()=>{
};
const userList = ()=>{
userListRef.value.userList();
};
// 打开新增用户弹窗
const onOpenAddUser = () => {
};
// 打开新增用户弹窗
const onOpenAddUser = () => {
userListRef.value.onOpenAddUser();
};
// 删除用户
const onRowDel = () => {
};
// 删除用户
const onRowDel = () => {
userListRef.value.onRowDel(null);
};
// 页面加载时
onMounted(() => {
};
// 页面加载时
onMounted(() => {
initTableData();
});
watch(filterText, (val) => {
});
watch(filterText, (val) => {
treeRef.value!.filter(val)
});
const deptFilterNode = (value: string, data:any) => {
});
const deptFilterNode = (value: string, data:any) => {
if (!value) return true;
return data.deptName.includes(value)
};
// 节点单击事件
const handleNodeClick = (data:any) => {
};
// 节点单击事件
const handleNodeClick = (data:any) => {
state.param.deptId = data.deptId;
userList();
};
/** 重置按钮操作 */
const resetQuery = (formEl: FormInstance | undefined) => {
};
/** 重置按钮操作 */
const resetQuery = (formEl: FormInstance | undefined) => {
if (!formEl) return
formEl.resetFields()
userList()
};
return {
queryRef,
userListRef,
onOpenAddUser,
onRowDel,
deptFilterNode,
filterText,
treeRef,
search,
sys_user_sex,
userList,
handleNodeClick,
resetQuery,
...toRefs(state),
};
},
});
};
</script>

19
src/views/visualizing/demo2.vue
View File

@ -792,7 +792,7 @@ export default defineComponent({
height: 100%;
width: 100%;
overflow: hidden;
background: url(https://img-blog.csdnimg.cn/6267533849444025811bf0840f9366e3.png?x-oss-process=image/watermark,type_d3F5LXplbmhlaQ,shadow_50,text_Q1NETiBAbHl0LXRvcA==,size_20,color_FFFFFF,t_70,g_se,x_16);
background: url(/@/assets/board2.jpg);
background-size: 100% 100%;
display: flex;
flex-direction: column;
@ -822,15 +822,6 @@ export default defineComponent({
background-size: 200% 100%;
animation: masked-animation 4s infinite linear;
-webkit-box-reflect: below -2px -webkit-gradient(linear, left top, left bottom, from(rgba(0, 0, 0, 0)), to(rgba(255, 255, 255, 0.1)));
@keyframes masked-animation {
0% {
background-position: 0 0;
}
100% {
background-position: -100% 0;
}
}
position: relative;
&::after {
content: '';
width: 50%;
@ -1341,4 +1332,12 @@ export default defineComponent({
}
}
}
@keyframes masked-animation {
0% {
background-position: 0 0;
}
100% {
background-position: -100% 0;
}
}
</style>

3
vite.config.ts
View File

@ -1,7 +1,6 @@
import vue from '@vitejs/plugin-vue';
import { resolve } from 'path';
import { defineConfig, loadEnv, ConfigEnv } from 'vite';
import vueSetupExtend from 'vite-plugin-vue-setup-extend-plus';
import viteCompression from 'vite-plugin-compression';
import { buildConfig } from './src/utils/build';
@ -17,7 +16,7 @@ const alias: Record<string, string> = {
const viteConfig = defineConfig((mode: ConfigEnv) => {
const env = loadEnv(mode.mode, process.cwd());
return {
plugins: [vue(), vueSetupExtend(), viteCompression({disable:true})],
plugins: [vue(), viteCompression({disable:true})],
root: process.cwd(),
resolve: { alias },
base: mode.command === 'serve' ? './' : env.VITE_PUBLIC_PATH,