Commit a439a912 by gyy

代码初次提交-G

parent 8ab9a33e
......@@ -19,6 +19,7 @@ a, a:hover, a:focus, a:visited
text-decoration:none;
}
a:-webkit-any-link {
color: #3A3A3A;
cursor:pointer;
text-decoration: none;
}
......
......@@ -5,7 +5,7 @@
<div class="dl-title">管理系统</div>
<div class="dl-log">欢迎您,admin[退出]</div>
</div>
<div class="nav_tab y_flex_start">
<div class="nav_tab y_bottom_start">
<div v-for="(item, index) in tab" :class="{'nav_item': true, 'nav_active': tabNow === index}" @click="switchTab(index)">
{{item}}
</div>
......@@ -24,7 +24,18 @@
</div>
<div class="main_right">
<div class="crumbs">
<span class="crumbs_list" v-for="(item, index) in Array.from(visitedViews)">{{item.name}}</span>
<div class="y_flex_start">
<div class="crumbs_list" v-for="(item, index) in Array.from(visitedViews)" :class="isActive(item)?'crumbs_active':''" @contextmenu.prevent="openMenu(item,$event)">
<router-link :to="item.path">{{item.name}}</router-link>
<span class="crumbs_close" @click="closeSelectedTag(item)">×</span>
</div>
</div>
<ul v-show="visible" :style="{left:left+'px'}" class="contextmenu">
<li>刷新</li>
<li @click="closeSelectedTag(selectedTag)">关闭</li>
<li @click="closeOthersTags">关闭其他</li>
<li @click="closeAllTags">关闭所有</li>
</ul>
</div>
<nuxt class="content"/>
</div>
......@@ -43,7 +54,10 @@ export default {
orderList: [],
lapsList: [],
financeList: [],
clientHeight: 0
clientHeight: 0,
visible: false,
left: 0,
selectedTag: {}
}
},
computed: {
......@@ -63,6 +77,13 @@ export default {
watch: {
$route() {
this.addViewTags()
},
visible(value) {
if (value) {
document.body.addEventListener('click', this.closeMenu)
} else {
document.body.removeEventListener('click', this.closeMenu)
}
}
},
methods: {
......@@ -72,6 +93,7 @@ export default {
}
return false
},
// 向tag中添加打开的页面名称
addViewTags() {
const route = this.generateRoute()
if (!route) {
......@@ -88,6 +110,84 @@ export default {
this.$store.dispatch('fAddVisitedViews', route)
}
},
// 判断是否为当前页面
isActive(route) {
return route.path === this.$route.path
},
// 关闭当前tag中的页面
closeSelectedTag(view) {
let delVisitedViews
if (this.tabNow === 0) {
delVisitedViews = 'sDelVisitedViews'
} else if (this.tabNow === 1) {
delVisitedViews = 'gDelVisitedViews'
} else if (this.tabNow === 2) {
delVisitedViews = 'oDelVisitedViews'
} else {
delVisitedViews = 'fDelVisitedViews'
}
this.$store.dispatch(delVisitedViews, view).then((views) => {
if (this.isActive(view)) {
const latestView = views.slice(-1)[0]
if (latestView) {
this.$router.push(latestView)
} else {
this.$router.push('/')
}
}
})
},
// 右键打开
openMenu(tag, e) {
this.visible = true
this.selectedTag = tag
let clientWidth = document.documentElement.clientWidth * 0.1
this.left = e.clientX - clientWidth + 40 // 15: margin right
},
// 关闭其他
closeOthersTags() {
this.$router.push(this.selectedTag)
let delOthersViews
if (this.tabNow === 0) {
delOthersViews = 'sDelOthersViews'
} else if (this.tabNow === 1) {
delOthersViews = 'gDelOthersViews'
} else if (this.tabNow === 2) {
delOthersViews = 'oDelOthersViews'
} else {
delOthersViews = 'fDelOthersViews'
}
this.$store.dispatch(delOthersViews, this.selectedTag)
},
moveToCurrentTag() {
const tags = this.$refs.tag
this.$nextTick(() => {
for (const tag of tags) {
if (tag.to.path === this.$route.path) {
this.$refs.scrollPane.moveToTarget(tag.$el)
break
}
}
})
},
// 关闭所有
closeAllTags() {
let delAllViews
if (this.tabNow === 0) {
delAllViews = 'sDelAllViews'
} else if (this.tabNow === 1) {
delAllViews = 'gDelAllViews'
} else if (this.tabNow === 2) {
delAllViews = 'oDelAllViews'
} else {
delAllViews = 'fDelAllViews'
}
this.$store.dispatch(delAllViews)
this.$router.push('/')
},
closeMenu() {
this.visible = false
},
// 获取列表数据
getOrderCtg() {
let order = []
......@@ -154,22 +254,41 @@ export default {
}
},
switchTab(e) {
if (this.tabNow === 0) {
YCookie.setLocalCookie('firstPath', this.$route.path)
} else if (this.tabNow === 1) {
YCookie.setLocalCookie('secondPath', this.$route.path)
} else if (this.tabNow === 2) {
YCookie.setLocalCookie('threePath', this.$route.path)
} else if (this.tabNow === 3) {
YCookie.setLocalCookie('fourthPath', this.$route.path)
}
this.tabNow = e
YCookie.setLocalCookie('tabNow', this.tabNow)
this.orderList = []
this.lapsList = []
this.financeList = []
this.getOrderCtg()
let nowPath
if (e === 0) {
nowPath = YCookie.readLocalCookie('firstPath')
} else if (e === 1) {
nowPath = YCookie.readLocalCookie('secondPath')
} else if (e === 2) {
nowPath = YCookie.readLocalCookie('threePath')
} else if (e === 3) {
nowPath = YCookie.readLocalCookie('fourthPath')
}
this.$router.push({
path: '/'
path: nowPath
})
// console.log(this.$store.state.tagsView.visitedViews)
// console.log(this.visitedViews)
},
entriesClick(item) {
this.$router.push({
path: item.pagePath
})
// console.log(this.$store.state.tagsView.visitedViews)
console.log(this.visitedViews)
},
// 获取窗口可视范围的高度
getClientHeight() {
......@@ -259,8 +378,13 @@ export default {
font-size: 14px;
position: relative;
width: 130px;
padding-left: 8px;
margin-left: 8px;
cursor: pointer;
height: 30px;
line-height: 30px;
border-top-left-radius: 3px;
border-top-right-radius: 3px;
text-align: center;
}
.nav_active{
background: #E8E9EE;
......@@ -279,13 +403,33 @@ export default {
background: #E8E9EE;
width: 100%;
z-index: 1;
overflow: hidden;
height: 21px;
position: relative;
padding: 5px 23px;
}
.crumbs_list{
border: 1px solid #fff;
background: #FFFFFF;
border: 1px solid #d8dce5;
color: #495060;
font-size: 12px;
height: 21px;
line-height: 21px;
padding: 0 8px;
margin-right: 15px;
}
.crumbs_active{
border: 1px solid #DBE1EC;
background: #409eff;
}
.crumbs_active a{
color: #FFFFFF;
}
.crumbs_close{
margin-left: 10px;
}
.crumbs_active .crumbs_close{
color: #FFFFFF;
}
.orderCtg_txt{
}
......@@ -302,13 +446,35 @@ export default {
position: relative;
min-height: ;
}
.contextmenu {
margin: 0;
background: #fff;
z-index: 100;
position: absolute;
top: 20px;
list-style-type: none;
padding: 5px 0;
border-radius: 4px;
font-size: 12px;
font-weight: 400;
color: #333;
box-shadow: 2px 2px 3px 0 rgba(0, 0, 0, .3);
}
.contextmenu li {
margin: 0;
padding: 7px 16px;
cursor: pointer;
}
.contextmenu li:hover {
background: #eee;
}
.content{
width: 100%;
box-sizing: border-box;
border-top: 1px solid #000;
border-left: 1px solid #000;
box-sizing: border-box;
border-top: 1px solid #000;
border-left: 1px solid #000;
position: absolute;
top: 21px;
top: 31px;
bottom: 0px;
right: 0px;
}
......
......@@ -6,7 +6,7 @@ const financalTags = {
mutations: {
F_ADD_VISITED_VIEWS: (state, view) => {
if (state.fVisitedViews.some(v => v.path === view.path)) return
// if (view.path === '/') return
if (view.path === '/') return
state.fVisitedViews.push(
Object.assign({}, view, {
title: view.meta.title || 'no-name'
......
......@@ -6,7 +6,7 @@ const goodsTags = {
mutations: {
G_ADD_VISITED_VIEWS: (state, view) => {
if (state.gVisitedViews.some(v => v.path === view.path)) return
// if (view.path === '/') return
if (view.path === '/') return
state.gVisitedViews.push(
Object.assign({}, view, {
title: view.meta.title || 'no-name'
......
......@@ -6,7 +6,7 @@ const systemTags = {
mutations: {
S_ADD_VISITED_VIEWS: (state, view) => {
if (state.sVisitedViews.some(v => v.path === view.path)) return
// if (view.path === '/') return
if (view.path === '/') return
state.sVisitedViews.push(
Object.assign({}, view, {
title: view.meta.title || 'no-name'
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment