优化

src/layout/components/tags.vue

@@ -148,15 +148,18 @@ function treeFind(tree, func) {
 function tagDrop() {
 	Sortable.create(proxy.$refs.tags, {
 		draggable: 'li',
-		animation: 300
+		animation: 300,
+		onEnd(e) {
+			viewTags.moveViewTags(e.oldIndex, e.newIndex)
+		}
 	})
 }
 
 //增加tag
-function addViewTags(route) {
-	if (route.name && !route.meta.fullpage) {
-		viewTags.pushViewTags(route)
-		keepAlive.pushKeepLive(route.name)
+function addViewTags(_route) {
+	if (_route.name && !_route.meta.fullpage) {
+		viewTags.pushViewTags(_route)
+		keepAlive.pushKeepLive(_route.name)
 	}
 }
 
@@ -272,8 +275,8 @@ function maximize() {
 
 //新窗口打开
 function openWindow() {
-	var nowTag = contextMenuItem;
-	var url = nowTag.href || '/';
+	var nowTag = contextMenuItem
+	var url = nowTag.fullPath ? '#' + nowTag.fullPath : '/'
 	if (!nowTag.meta.affix) {
 		closeSelectedTag(nowTag)
 	}

src/store/viewTags.ts

@@ -31,7 +31,12 @@ const viewTagsStore = defineStore("viewTags", {
 				if(backPathIndex == -1){
 					this.viewTags.push(_route)
 				}else{
-					this.viewTags.splice(backPathIndex+1, 0, _route)
+					// 后台首页移动到首个标签中
+					if (_route.fullPath === "/dashboard") {
+						this.viewTags.unshift(_route)
+					}else {
+						this.viewTags.splice(backPathIndex+1, 0, _route)
+					}
 				}
 			}
 		},
@@ -60,6 +65,10 @@ const viewTagsStore = defineStore("viewTags", {
 		},
 		clearViewTags(){
 			this.viewTags = []
+		},
+		moveViewTags(oldIndex, newIndex) {
+			const item = this.viewTags.splice(oldIndex, 1)[0]  // 取出 tags
+			this.viewTags.splice(newIndex, 0, item)            // 插入新位置
 		}
 	},
 	persist: true

src/style/app.scss

@@ -98,6 +98,7 @@ a,button,input,textarea{-webkit-tap-highlight-color:rgba(0,0,0,0);box-sizing: bo
 .pi-tags li.sortable-ghost {opacity: 0;}
 
 .pi-main {overflow: auto;background-color: #f6f8f9;flex: 1;}
+.pi-main .el-container .el-footer {height: 59px;}
 
 /*页面最大化*/
 .pi.main-maximize {
@@ -110,3 +111,4 @@ a,button,input,textarea{-webkit-tap-highlight-color:rgba(0,0,0,0);box-sizing: bo
 
 /*定宽页面*/
 .pi-page {width: 1230px;margin: 0 auto;}
+.pi-panel {	background: var(--el-bg-color-overlay); border-color: var(--el-border-color-light);}

src/style/fix.scss

@@ -58,12 +58,12 @@
 .el-table .el-table__body-wrapper {background: #f6f8f9;}
 .el-col .el-card {margin-bottom: 15px;}
 .el-main {flex-basis: 100%;}
-.el-main > .scTable .el-table--border::before {display: none;}
-.el-main > .scTable .el-table--border::after {display: none;}
-.el-main > .scTable .el-table--border .el-table__inner-wrapper::after {display: none;}
-.el-main > .scTable .el-table__border-left-patch {display: none;}
-.el-main > .scTable .el-table--border .el-table__inner-wrapper tr:first-child td:first-child {border-left: 0;}
-.el-main > .scTable .el-table--border .el-table__inner-wrapper tr:first-child th:first-child {border-left: 0;}
+.el-main > .pi-table .el-table--border::before {display: none;}
+.el-main > .pi-table .el-table--border::after {display: none;}
+.el-main > .pi-table .el-table--border .el-table__inner-wrapper::after {display: none;}
+.el-main > .pi-table .el-table__border-left-patch {display: none;}
+.el-main > .pi-table .el-table--border .el-table__inner-wrapper tr:first-child td:first-child {border-left: 0;}
+.el-main > .pi-table .el-table--border .el-table__inner-wrapper tr:first-child th:first-child {border-left: 0;}
 .el-table.el-table--large {font-size: 14px;}
 .el-table.el-table--small {font-size: 12px;}
 .el-table {font-size: 12px;}

src/style/media.scss

@@ -11,11 +11,11 @@
 		>.el-container {display: block;height:auto;}
 		>.el-container > .el-aside {width: 100%!important;border: 0}
 	}
-	.scTable {
+	.pi-table {
 		.el-table,
 		.el-table__body-wrapper {display: block!important;height:auto!important;}
 		.el-scrollbar__wrap {height:auto!important;}
-		.scTable-page {padding: 0 5px!important;}
+		.pi-table-page {padding: 0 5px!important;}
 		.el-pagination__total,
 		.el-pagination__jump,
 		.el-pagination__sizes {display: none!important;}
@@ -42,8 +42,6 @@
 	.pi-main > .el-container > .el-container > .el-header .left-panel {display: block;}
 	.pi-main > .el-container > .el-container > .el-header .right-panel {display: block;margin-top: 15px;}
 
-	.sc-page {width: 100%;margin: 0;}
-
 	.common-main .el-form {width: 100% !important;}
 	.common-header-logo label {display: none;}
 	.common-header-title {display: none;}

src/utils/useTabs.ts

@@ -0,0 +1,72 @@
+import { nextTick  } from 'vue'
+import NProgress from 'nprogress'
+import 'nprogress/nprogress.css'
+import router from '@/router'
+import viewTagsStore from "@/store/viewTags";
+import keepAliveStore from "@/store/keepAlive";
+import iframeStore from "@/store/iframe";
+
+export default {
+	//刷新标签
+	refresh() {
+		NProgress.start()
+		const keepAlive = keepAliveStore()
+		const route = router.currentRoute.value
+		keepAlive.removeKeepLive(route.name)
+		keepAlive.setRouteShow(false)
+		nextTick(() => {
+			keepAlive.pushKeepLive(route.name)
+			keepAlive.setRouteShow(true)
+			NProgress.done()
+		}).then(()=>{})
+	},
+	//关闭标签
+	close(tag) {
+		const viewTags = viewTagsStore()
+		const keepAlive = keepAliveStore()
+		const iframe = iframeStore()
+		const route = tag || router.currentRoute.value
+		viewTags.removeViewTags(route)
+		iframe.removeIframeList(route)
+		keepAlive.removeKeepLive(route.name)
+		const tagList = viewTags.viewTags
+		const latestView = tagList.slice(-1)[0]
+		if (latestView) {
+			router.push(latestView)
+		} else {
+			router.push('/')
+		}
+	},
+	//关闭标签后处理
+	closeNext(next) {
+		const viewTags = viewTagsStore()
+		const keepAlive = keepAliveStore()
+		const iframe = iframeStore()
+		const route = router.currentRoute.value
+		viewTags.removeViewTags(route)
+		iframe.removeIframeList(route)
+		keepAlive.removeKeepLive(route.name)
+		if(next){
+			const tagList = viewTags.viewTags
+			next(tagList)
+		}
+	},
+	//关闭其他
+	closeOther() {
+		const viewTags = viewTagsStore()
+		const route = router.currentRoute.value
+		const tagList = [...viewTags.viewTags]
+		tagList.forEach(tag => {
+			if(tag.meta&&tag.meta.affix || route.fullPath==tag.fullPath){
+				return true
+			}else{
+				this.close(tag)
+			}
+		})
+	},
+	//设置标题
+	setTitle(title){
+		const viewTags = viewTagsStore()
+		viewTags.updateViewTagsTitle(title)
+	}
+}

src/views/tools/gen/edit.vue

@@ -1,23 +1,42 @@
 <template>
-	<el-container>
-		<el-tabs v-model="type">
-			<el-tab-pane name="base" label="基本信息"></el-tab-pane>
-			<el-tab-pane name="field" label="字段信息"></el-tab-pane>
-		</el-tabs>
+	<el-container class="pi-panel">
+		<el-main>
+			<el-tabs v-model="type" style="width: 100%;">
+				<el-tab-pane name="base" label="基本信息"></el-tab-pane>
+				<el-tab-pane name="field" label="字段信息"></el-tab-pane>
+			</el-tabs>
+		</el-main>
+		<el-footer class="pi-center">
+			<el-button @click="back()">返 回</el-button>
+			<el-button type="primary" :loading="isSaving" @click="submit()">保 存</el-button>
+		</el-footer>
 	</el-container>
 </template>
 
 <script setup>
 import api from "@/api/index";
 import {getCurrentInstance, nextTick, ref} from "vue";
+import useTabs from '@/utils/useTabs'
 
 defineOptions({
 	name: "toolsGenEdit"
 })
 const type = ref("base")
+let isSaving = ref(false)
+
+
+function back() {
+	useTabs.close()
+}
+
+function submit() {
+
+}
 
 </script>
 
 <style scoped>
-
+.pi-center {
+	text-align: center;
+}
 </style>

src/views/tools/gen/save.vue

@@ -17,8 +17,7 @@
 		</pi-table>
 		<template #footer>
 			<el-button @click="visible=false">取 消</el-button>
-			<el-button type="primary" :disabled="selection.length === 0" :loading="isSaveing" @click="submit()">生 成
-			</el-button>
+			<el-button type="primary" :disabled="selection.length === 0" :loading="isSaveing" @click="submit()">生 成</el-button>
 		</template>
 	</el-dialog>
 </template>