From 23786b9ef2dc1d9f06dd7d9458e926369aab8c25 Mon Sep 17 00:00:00 2001
From: he wei <858544502@qq.com>
Date: 星期二, 27 九月 2022 16:13:24 +0800
Subject: [PATCH] UA 整理提交 准备修改标签
---
src/App.vue | 129 ++++++++++++++++++++++++++++++------------
1 files changed, 91 insertions(+), 38 deletions(-)
diff --git a/src/App.vue b/src/App.vue
index 081ac73..0a6f8b7 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -6,6 +6,7 @@
<div class="title">鏂囦欢鍒楄〃</div>
<div class="file-list" @contextmenu.prevent="openContextMenu($event)">
<el-tree
+ :class="['station-tree', { empty: !stationData.length }]"
:data="stationData"
@node-click="handleNodeClick"
@node-contextmenu="nodeContextClick"
@@ -14,16 +15,26 @@
</div>
<div class="handle" ref="handle"></div>
<div class="right">
- <div class="" @click="select">閫夋枃浠�</div>
- <div class="">褰撳墠閫変腑鐨勬枃浠跺す涓猴細{{ path }}</div>
- <router-view />
+ <div class="right-inner">
+ <!-- 鏂囦欢鏍囩 -->
+ <tabs-bar></tabs-bar>
+ <div class="right-content">
+ <div class="posIner">
+ <keep-alive :include="cachedViews">
+ <router-view :key="$route.fullPath" />
+ </keep-alive>
+ </div>
+ </div>
+ </div>
</div>
</div>
<!-- 鍙抽敭鑿滃崟 -->
<context-menu
v-model="contextMenu.visible"
:disabled-list="disabledList"
+ :context-data="contextMenu.node"
:style="{ left: contextMenu.x + 'px', top: contextMenu.y + 'px' }"
+ @reload="reload"
></context-menu>
</div>
</template>
@@ -34,6 +45,7 @@
import MenuList from "@/components/menuList";
import ContextMenu from "@/components/contextMenu";
+import TabsBar from "@/components/tabsBar";
import { getStation } from "./apis";
export default {
@@ -41,10 +53,10 @@
components: {
MenuList,
ContextMenu,
+ TabsBar,
},
data() {
return {
- path: "",
startX: 0,
leftW: 0,
stationData: [],
@@ -52,14 +64,17 @@
x: 0,
y: 0,
visible: false,
+ node: {},
},
disabledList: [],
};
},
- methods: {
- select() {
- window.api.send("open-file-dialog");
+ computed: {
+ cachedViews() {
+ return this.$store.state.tagsView.cachedViews;
},
+ },
+ methods: {
onMouseDown(e) {
// const el = e.target;
this.startX = e.clientX;
@@ -83,6 +98,7 @@
}
left.style.width = CurBoxLen + "px";
el.style.left = CurBoxLen + "px";
+ this.$bus.$emit("checkScroll");
},
getStation() {
getStation().then((res) => {
@@ -109,8 +125,10 @@
label: item1.fileName,
url: item1.fileUrl,
level: 3,
+ parent: [v.station1, val.station2, item.station3],
})),
level: 2,
+ parent: [v.station1, val.station2],
});
} else {
children.push(
@@ -118,6 +136,7 @@
label: item1.fileName,
url: item1.fileUrl,
level: 3,
+ parent: [v.station1, val.station2],
}))
);
}
@@ -126,6 +145,7 @@
label: val.station2,
children,
level: 1,
+ parent: [v.station1],
});
} else {
sname2s.push(
@@ -133,6 +153,7 @@
label: item.fileName,
url: item.fileUrl,
level: 3,
+ parent: [v.station1],
}))
);
}
@@ -141,16 +162,20 @@
children: sname2s,
label: v.station1,
level: 0,
+ parent: [],
};
});
console.log(res);
return res;
},
+ reload() {
+ this.getStation();
+ },
handleNodeClick(obj) {
console.log(123, obj);
},
nodeContextClick($e, obj) {
- console.log(obj);
+ // console.log(obj);
const { clientX, clientY } = $e;
this.contextMenu.x = clientX;
let y = clientY;
@@ -162,9 +187,12 @@
switch (obj.level) {
case 0:
case 1:
- case 2:
// 瀛愮珯涓婃寜榧犳爣鍙抽敭锛屼笉鑳解�滄墦寮�鏂囦欢鈥濄�佲�滄柊寤烘牴鏂囦欢鈥�
this.disabledList = [0, 11];
+ break;
+ case 2:
+ // 姝ゅ眰绾� 鍙兘娣诲姞鏂囦欢 涓嶈兘鏂板缓瀛愮珯
+ this.disabledList = [0, 1];
break;
case 3:
// 娣诲姞鐨勬祴璇曟枃浠朵笂鎸夐紶鏍囧彸閿紝鍙互鐐瑰嚮鈥滄墦寮�鏂囦欢鈥濄�佲�滈噸鍛藉悕鈥濄�佲�滃垹闄も��
@@ -173,6 +201,7 @@
default:
return false;
}
+ this.contextMenu.node = obj;
this.contextMenu.visible = true;
},
// 鍙抽敭鑿滃崟
@@ -193,7 +222,7 @@
if (classList.contains("file-list")) {
// 鍦ㄧ┖鐧藉鐐瑰嚮鐨勫彸閿� 鍙兘鏂板缓
this.disabledList = [0, 12, 2, 3, 4];
-
+ this.contextMenu.node = {};
this.contextMenu.visible = true;
}
},
@@ -203,14 +232,18 @@
maskClick() {
this.closeContextMenu();
},
+ test() {
+ setTimeout(() => {
+ console.log(this.cachedViews, "cachedViews");
+ this.test();
+ }, 2000);
+ },
},
mounted() {
- window.api.receive("selected-directory", (path) => {
- this.path = path.filePaths;
- });
let handle = this.$refs.handle;
handle.addEventListener("mousedown", this.onMouseDown);
this.getStation();
+ this.test();
},
};
</script>
@@ -223,6 +256,9 @@
padding: 0;
overflow: hidden;
}
+div {
+ box-sizing: border-box;
+}
#app {
height: 100%;
font-family: Avenir, Helvetica, Arial, sans-serif;
@@ -230,7 +266,7 @@
-moz-osx-font-smoothing: grayscale;
text-align: center;
color: #000;
- background: #fff;
+ background: #076fec;
}
ul,
li {
@@ -245,6 +281,7 @@
height: 100%;
position: relative;
display: flex;
+ z-index: 1;
}
.left {
width: 14em;
@@ -253,27 +290,46 @@
display: flex;
flex-direction: column;
.title {
- background: #999;
+ background: #0055bf;
+ color: #fff;
padding: 4px;
}
.file-list {
flex: 1;
overflow-y: auto;
text-align: left;
- /deep/ .el-tree {
- color: #333;
+ user-select: none;
+ :deep(.el-tree.station-tree) {
+ background: transparent;
+ color: #fff;
display: inline-block;
+ &.empty {
+ display: block;
+ }
.el-tree-node__content {
display: inline-block;
}
- // .el-tree-node.is-expanded>.el-tree-node__children {
- // display: inline-block;
- // }
+ .el-tree-node:hover,
+ .el-tree-node:focus > .el-tree-node__content {
+ background-color: rgba(39, 134, 255, 0.4);
+ .el-tree-node__label {
+ color: #000;
+ }
+ }
+ .el-tree-node__content.el-tree-node__content:hover,
+ .el-tree-node__content.el-upload-list__item:hover {
+ background-color: rgba(200, 200, 200, 0.4);
+ color: #000;
+ .el-tree-node__label {
+ color: #000;
+ }
+ }
}
}
}
.handle {
width: 6px;
+ z-index: 1;
position: absolute;
top: 0;
bottom: 0;
@@ -287,27 +343,24 @@
.right {
/* background: rgba(0,0,0,.4); */
flex: 1;
-}
-.context-menu {
- position: absolute;
- z-index: 100;
- background: #fff;
- border: 1px #ccc solid;
- border-radius: 4px;
- padding: 4px;
- .main-ul {
+ position: relative;
+ .right-inner {
+ position: absolute;
+ left: 0;
+ top: 0;
+ right: 0;
+ bottom: 0;
display: flex;
flex-direction: column;
- .main-li {
- cursor: pointer;
+ .right-content {
flex: 1;
- border: 1px #ccc solid;
- padding: 4px;
- &:hover {
- background: #f0f0f0;
- }
- & ~ .main-li {
- margin-top: 2px;
+ position: relative;
+ .posIner {
+ position: absolute;
+ left: 0;
+ top: 0;
+ right: 0;
+ bottom: 0;
}
}
}
--
Gitblit v1.9.1