Skip to content

M
mes-ui
Commit 640dc1ee authored by 仇晓婷's avatar 仇晓婷
Browse files
Options

多页签

parent 750a8b16
Show whitespace changes
Inline Side-by-side
Showing with 249 additions and 234 deletions
layouts/basic-layout/product.vue
View file @ 640dc1ee
......@@ -16,14 +16,10 @@
<td>
<ul class="table_row_ul">
<li>
<a class="a_goIndex" @click="goIndex">
首页一
</a>
<a class="a_goIndex" @click="goIndex">首页一</a>
</li>
<li>
<a class="a_goIndex" @click="goIndexTwo">
首页二
</a>
<a class="a_goIndex" @click="goIndexTwo">首页二</a>
</li>
</ul>
</td>
......@@ -35,7 +31,10 @@
<td>
<ul class="table_row_ul">
<li v-for="(li) in item.children">
<a @click="goPage(item,li)" :class="{'active': li.id === isActive}">{{li.title}}</a>
<a
@click="goPage(item,li)"
:class="{'active': li.id === isActive}"
>{{li.title}}</a>
</li>
</ul>
</td>
......@@ -55,12 +54,8 @@
<BreadcrumbItem to="/" class="white">
<Icon type="ios-home" />首页
</BreadcrumbItem>
<BreadcrumbItem>
{{homeMenu}}
</BreadcrumbItem>
<BreadcrumbItem :to="parthto" class="white">
{{homeMenuItem}}
</BreadcrumbItem>
<BreadcrumbItem>{{homeMenu}}</BreadcrumbItem>
<BreadcrumbItem :to="parthto" class="white">{{homeMenuItem}}</BreadcrumbItem>
</Breadcrumb>
<i-header-search v-if="showSearch && !headerMenu && !isMobile && !showBreadcrumb" />
<div class="header_right">
......@@ -77,6 +72,11 @@
<i-header-setting v-if="enableSetting && !isMobile" />-->
</div>
</Header>
<div class="i-tabs">
<transition name="fade-quick">
<i-tabs v-if="tabs" v-show="showHeader" @on-reload="handleReload" />
</transition>
</div>
<Content class="i-layout-content">
<keep-alive :include="keepAlive">
<nuxt v-if="loadRouter" />
......@@ -137,9 +137,9 @@ export default {
isDelayHideSider: false, // hack，当从隐藏侧边栏的 header 切换到正常 header 时，防止 Logo 抖动
loadRouter: true,
homeMenu:'',
homeMenuItem:"",
parthto:'',
homeMenu: "",
homeMenuItem: "",
parthto: ""
};
},
computed: {
......@@ -248,7 +248,8 @@ export default {
}, 0);
},
$route(to, from) {
if (to.name === from.name) {// 相同路由，不同参数，跳转时，重载页面
if (to.name === from.name) {
// 相同路由，不同参数，跳转时，重载页面
if (Setting.sameRouteForceUpdate) {
this.handleReload();
}
......@@ -267,7 +268,8 @@ export default {
},
handleScroll() {
if (!this.headerHide) return;
const scrollTop = document.body.scrollTop + document.documentElement.scrollTop;
const scrollTop =
document.body.scrollTop + document.documentElement.scrollTop;
if (!this.ticking) {
this.ticking = true;
requestAnimation(() => {
......@@ -294,7 +296,8 @@ export default {
// todo $menuHead.handleGetMenuHeight();
}
},
handleReload() {// 针对缓存的页面也生效
handleReload() {
// 针对缓存的页面也生效
const isCurrentPageCache = this.keepAlive.indexOf(this.$route.name) > -1;
const pageName = this.$route.name;
if (isCurrentPageCache) {
......@@ -308,24 +311,24 @@ export default {
}
});
},
goPage(u,li) {
this.$router.push(li.path)
this.isActive = li.id
this.homeMenu = u.title
this.homeMenuItem = li.title
this.parthto = li.path
goPage(u, li) {
this.$router.push(li.path);
this.isActive = li.id;
this.homeMenu = u.title;
this.homeMenuItem = li.title;
this.parthto = li.path;
},
goIndex(){
this.$router.push("/")
this.homeMenu = ''
this.homeMenuItem = ''
this.isActive = 0
goIndex() {
this.$router.push("/");
this.homeMenu = "";
this.homeMenuItem = "";
this.isActive = 0;
},
goIndexTwo(){
this.$router.push("/home")
this.homeMenu = ''
this.homeMenuItem = ''
this.isActive = 0
goIndexTwo() {
this.$router.push("/home");
this.homeMenu = "";
this.homeMenuItem = "";
this.isActive = 0;
}
},
mounted() {
......@@ -342,21 +345,25 @@ export default {
<style lang="less">
.i-layout-header-breadcrumb {
color: #A7B8CC!important;//wheat
color: #a7b8cc !important; //wheat
}
.i-layout-header-breadcrumb .white .ivu-breadcrumb-item-link {
color: #ffffff!important;//wheat
color: #ffffff !important; //wheat
}
.ivu-icon-ios-home{
.ivu-icon-ios-home {
font-size: 20px;
}
.white{
color: #ffffff!important;
.white {
color: #ffffff !important;
}
.product-layout {
.i-layout-content {
padding: 5px 10px;
}
.i-tabs {
width: 100% !important;
height: 40px;
}
.ivu-layout-header {
height: 50px;
line-height: 50px;
......
layouts/basic-layout/tabs/index.vue
View file @ 640dc1ee
......@@ -44,95 +44,99 @@
</div>
</template>
<script>
import { mapState, mapGetters, mapActions } from 'vuex';
import menuSider from '@/menu/sider';
import tTitle from '../mixins/translate-title';
import { mapState, mapGetters, mapActions } from "vuex";
import menuSider from "@/menu/sider";
import tTitle from "../mixins/translate-title";
import Setting from '@/setting';
import Setting from "@/setting";
import { getAllSiderMenu } from '@/libs/system';
import { getAllSiderMenu } from "@/libs/system";
export default {
name: 'iTabs',
mixins: [ tTitle ],
export default {
name: "iTabs",
mixins: [tTitle],
computed: {
...mapState('admin/page', [
'opened',
'current'
...mapState("admin/page", ["opened", "current"]),
...mapState("admin/layout", [
"showTabsIcon",
"tabsFix",
"tabsReload",
"headerFix",
"headerStick",
"isMobile",
"menuCollapse"
]),
...mapState('admin/layout', [
'showTabsIcon',
'tabsFix',
'tabsReload',
'headerFix',
'headerStick',
'isMobile',
'menuCollapse'
]),
...mapGetters('admin/menu', [
'hideSider'
]),
classes () {
return {
'i-layout-tabs-fix': this.tabsFix
}
...mapGetters("admin/menu", ["hideSider"]),
classes() {
// return {
// "i-layout-tabs-fix": this.tabsFix
// };
},
isHeaderStick () {
isHeaderStick() {
return this.hideSider;
},
styles () {
styles() {
let style = {};
if (this.tabsFix && !this.headerFix) {
style.top = `${64 - this.scrollTop}px`;
}
const menuWidth = this.isHeaderStick ? 0 : this.menuCollapse ? 80 : Setting.menuSideWidth;
if (!this.isMobile && this.tabsFix) {
style.width = `calc(100% - ${menuWidth}px)`;
style.left = `${menuWidth}px`;
}
const menuWidth = this.isHeaderStick
? 0
: this.menuCollapse
? 80
: Setting.menuSideWidth;
// if (!this.isMobile && this.tabsFix) {
// style.width = `calc(100% - ${menuWidth}px)`;
// style.left = `${menuWidth}px`;
// }
return style;
}
},
data () {
data() {
return {
// 得到所有侧边菜单，并转为平级，查询图标用
allSiderMenu: getAllSiderMenu(menuSider),
scrollTop: 0
}
};
},
methods: {
...mapActions('admin/page', [
'close',
'closeLeft',
'closeRight',
'closeOther',
'closeAll'
...mapActions("admin/page", [
"close",
"closeLeft",
"closeRight",
"closeOther",
"closeAll"
]),
tabLabel (h, page) {
const title = h('span', this.tTitle(page.meta.title) || '未命名');
tabLabel(h, page) {
const title = h("span", this.tTitle(page.meta.title) || "未命名");
let slot = [];
if (this.showTabsIcon) {
const fullPathWithoutQuery = page.fullPath.indexOf('?') >= 0 ? page.fullPath.split('?')[0] : page.fullPath;
const currentMenu = this.allSiderMenu.find(menu => menu.path === fullPathWithoutQuery) || {};
const fullPathWithoutQuery =
page.fullPath.indexOf("?") >= 0
? page.fullPath.split("?")[0]
: page.fullPath;
const currentMenu =
this.allSiderMenu.find(menu => menu.path === fullPathWithoutQuery) ||
{};
let icon;
if (currentMenu.icon) {
icon = h('Icon', {
icon = h("Icon", {
props: {
type: currentMenu.icon
}
});
} else if (currentMenu.custom) {
icon = h('Icon', {
icon = h("Icon", {
props: {
custom: currentMenu.custom
}
});
} else if (currentMenu.img) {
icon = h('img', {
icon = h("img", {
attrs: {
src: currentMenu.img
}
......@@ -145,14 +149,18 @@
slot.push(title);
}
return h('div', {
class: 'i-layout-tabs-title'
}, slot);
return h(
"div",
{
class: "i-layout-tabs-title"
},
slot
);
},
handleClickTab (tabName) {
handleClickTab(tabName) {
if (tabName === this.current) {
if (this.tabsReload) {
this.$emit('on-reload');
this.$emit("on-reload");
}
} else {
const page = this.opened.find(page => page.fullPath === tabName);
......@@ -161,43 +169,43 @@
if (page) this.$router.push({ name, params, query }, () => {});
}
},
handleClickClose (tagName) {
handleClickClose(tagName) {
this.close({
tagName
});
},
handleScroll () {
if (this.tabsFix && !this.headerFix) {
const scrollTop = document.body.scrollTop + document.documentElement.scrollTop;
this.scrollTop = scrollTop > 64 ? 64 : scrollTop;
}
handleScroll() {
// if (this.tabsFix && !this.headerFix) {
// const scrollTop = document.body.scrollTop + document.documentElement.scrollTop;
// this.scrollTop = scrollTop > 64 ? 64 : scrollTop;
// }
},
handleClose (name) {
handleClose(name) {
const params = {
pageSelect: this.current
};
switch (name) {
case 'left':
case "left":
this.closeLeft(params);
break;
case 'right':
case "right":
this.closeRight(params);
break;
case 'other':
case "other":
this.closeOther(params);
break;
case 'all':
case "all":
this.closeAll();
break;
}
}
},
mounted () {
document.addEventListener('scroll', this.handleScroll, { passive: true });
mounted() {
document.addEventListener("scroll", this.handleScroll, { passive: true });
this.handleScroll();
},
beforeDestroy () {
document.removeEventListener('scroll', this.handleScroll);
}
beforeDestroy() {
document.removeEventListener("scroll", this.handleScroll);
}
};
</script>
pages/order/quotation/index.vue
View file @ 640dc1ee
......@@ -363,7 +363,7 @@ export default {
},
created() {
this.treeHeight = window.innerHeight - 140;
this.tableHeight = window.innerHeight - 210;
this.tableHeight = window.innerHeight - 250;
this.newColumn = this.column;
this.tableTata(this.selectName);
},
......@@ -376,7 +376,7 @@ export default {
return (() => {
window.screenHeight = window.innerHeight;
this.treeHeight = window.screenHeight - 140;
this.tableHeight = window.innerHeight - 210;
this.tableHeight = window.innerHeight - 250;
})();
};
},
......
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