mirror of
https://gitee.com/log4j/pig-ui.git
synced 2024-12-23 05:40:20 +08:00
更新avue 修改sidevar组件对接接口
This commit is contained in:
smallwei
parent
d06655cf5b
commit
715a47a183
38
src/App.vue
38
src/App.vue
@ -1,8 +1,6 @@
|
||||
<template>
|
||||
<div id="app">
|
||||
<transition :name="transitionName">
|
||||
<router-view></router-view>
|
||||
</transition>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
@ -11,21 +9,10 @@ export default {
|
||||
name: "app",
|
||||
data() {
|
||||
return {
|
||||
transitionName: "slide-right" // 默认动态路由变化为slide-right
|
||||
|
||||
};
|
||||
},
|
||||
watch: {
|
||||
$route(to, from) {
|
||||
let isBack = this.$router.isBack; // 监听路由变化时的状态为前进还是后退
|
||||
|
||||
if (isBack) {
|
||||
this.transitionName = "slide-right";
|
||||
} else {
|
||||
this.transitionName = "slide-left";
|
||||
}
|
||||
this.$router.isBack = false;
|
||||
}
|
||||
},
|
||||
watch: {},
|
||||
created() {},
|
||||
methods: {},
|
||||
computed: {}
|
||||
@ -35,25 +22,6 @@ export default {
|
||||
#app {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
overflow: hidden;
|
||||
}
|
||||
.Router {
|
||||
position: absolute;
|
||||
width: 100%;
|
||||
min-height: 100%;
|
||||
overflow-y: hidden;
|
||||
transition: all 0.5s ease;
|
||||
}
|
||||
|
||||
.slide-left-enter,
|
||||
.slide-right-leave-active {
|
||||
-webkit-transform: translate(100%, 0);
|
||||
transform: translate(100%, 0);
|
||||
}
|
||||
|
||||
.slide-left-leave-active,
|
||||
.slide-right-enter {
|
||||
-webkit-transform: translate(-100%, 0);
|
||||
transform: translate(-100% 0);
|
||||
overflow:hidden;
|
||||
}
|
||||
</style>
|
||||
@ -1,7 +1,7 @@
|
||||
import request from '@/router/axios'
|
||||
export function GetMenu() {
|
||||
return request({
|
||||
url: '/admin/menu/userTree',
|
||||
url: '/admin/menu/getUserTree',
|
||||
method: 'get'
|
||||
})
|
||||
}
|
||||
@ -14,7 +14,7 @@
|
||||
<script>
|
||||
import { mapGetters } from "vuex";
|
||||
import Tags from "./tags";
|
||||
import Top from "./top";
|
||||
import Top from "./top/";
|
||||
import Sidebar from "./sidebar/";
|
||||
export default {
|
||||
name: "index",
|
||||
|
||||
@ -1,14 +1,7 @@
|
||||
<template>
|
||||
<el-menu
|
||||
unique-opened
|
||||
:default-active="tag.value"
|
||||
class="el-menu-vertical-demo"
|
||||
background-color="#495060"
|
||||
text-color="#c9cbd0"
|
||||
active-text-color="#409EFF"
|
||||
:collapse="isCollapse">
|
||||
<sidebar-item :menu="menu" :show="!isCollapse"></sidebar-item>
|
||||
</el-menu>
|
||||
<el-menu unique-opened :default-active="tag.value" class="el-menu-vertical-demo" background-color="#495060" text-color="#c9cbd0" active-text-color="#409EFF" :collapse="isCollapse">
|
||||
<sidebar-item :menu="menu" :show="!isCollapse"></sidebar-item>
|
||||
</el-menu>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
|
||||
@ -1,22 +1,22 @@
|
||||
<template>
|
||||
<div class="menu-wrapper">
|
||||
<template v-for="(item,index) in menu">
|
||||
<el-menu-item v-if="item.children.length===0 " :index="item.href" @click="open(item)" :key="item.label">
|
||||
<i :class="item.icon"></i>
|
||||
<span slot="title">{{item.label}}</span>
|
||||
</el-menu-item>
|
||||
<template v-for="item in menu">
|
||||
<el-menu-item v-if="item.children.length===0 " :index="item.component" @click="open(item)" :key="item.label">
|
||||
<i :class="item.icon"></i>
|
||||
<span slot="title">{{item.label}}</span>
|
||||
</el-menu-item>
|
||||
<el-submenu v-else :index="item.label" :key="item.name">
|
||||
<template slot="title">
|
||||
<i :class="item.icon"></i>
|
||||
<span slot="title" :class="{display:!show}">{{item.label}}</span>
|
||||
</template>
|
||||
<template v-for="child in item.children">
|
||||
<el-menu-item :index="child.href" @click="open(child)" v-if="child.children.length==0">
|
||||
<i :class="child.icon"></i>
|
||||
<span slot="title">{{child.label}}</span>
|
||||
</el-menu-item>
|
||||
<sidebar-item v-else :menu="[child]" :show="show"></sidebar-item>
|
||||
</template>
|
||||
<template slot="title">
|
||||
<i :class="item.icon"></i>
|
||||
<span slot="title" :class="{display:!show}">{{item.label}}</span>
|
||||
</template>
|
||||
<template v-for="child in item.children">
|
||||
<el-menu-item v-if="child.children.length==0" :index="child.component" @click="open(child)">
|
||||
<i :class="child.icon"></i>
|
||||
<span slot="title">{{child.label}}</span>
|
||||
</el-menu-item>
|
||||
<sidebar-item v-else :menu="[child]" :show="show"></sidebar-item>
|
||||
</template>
|
||||
</el-submenu>
|
||||
</template>
|
||||
</div>
|
||||
|
||||
@ -1,43 +1,36 @@
|
||||
<template>
|
||||
<div class="tags-container">
|
||||
<div class="tags-breadcrumb">
|
||||
<i class="icon-navicon tag-collapse" :class="[{ 'tag-collapse_right': isCollapse }]" @click="showCollapse"></i>
|
||||
<Breadcrumb class="tags-breadcrumb-list"></Breadcrumb>
|
||||
<!-- breadcrumb按钮和面包屑 -->
|
||||
<div class="tags-breadcrumb">
|
||||
<i class="icon-navicon tag-collapse" :class="[{ 'tag-collapse_right': isCollapse }]" @click="showCollapse"></i>
|
||||
<Breadcrumb class="tags-breadcrumb-list"></Breadcrumb>
|
||||
</div>
|
||||
<!-- tag盒子 -->
|
||||
<div class="tags-box" ref="tagBox">
|
||||
<div class="tags-list" ref="tagsList" @mousewheel="hadelMousewheel" @mouseup="hadelMouseUp" @mousemove="hadelMouse" @mousedown="hadelMousestart" @touchup="hadelMouseUp" @touchmove="hadelMouse" @touchstart="hadelMousestart">
|
||||
<div ref="tagsPageOpened" class="tag-item" :name="item.value" @contextmenu.prevent="openMenu(item,$event)" v-for="(item,index) in tagList" :key="index" @click="openUrl(item.value,item.label,item.num)">
|
||||
<span class="icon-yuan tag-item-icon" :class="{'is-active':nowTagValue==item.value}"></span>
|
||||
<span class="tag-text">{{item.label}}</span>
|
||||
<i class="el-icon-close tag-close" @click.stop="closeTag(item)" v-if="item.close"></i>
|
||||
</div>
|
||||
</div>
|
||||
<div class="tags-box">
|
||||
|
||||
<div class="tags-list" ref="tagsList" >
|
||||
<div class="tag-scroll" @mousewheel="hadelMousewheel"
|
||||
@mouseup="hadelMouseUp"
|
||||
@mousemove="hadelMousewheel"
|
||||
@mousedown="hadelMousestart"
|
||||
@touchup="hadelMouseUp"
|
||||
@touchmove="hadelMousewheel"
|
||||
@touchstart="hadelMousestart">
|
||||
<div class="tag-item" @contextmenu.prevent="openMenu(item,$event)" v-for="(item,index) in tagList" :key="index" @click="openUrl(item.value,item.label,item.num)">
|
||||
<span class="icon-yuan tag-item-icon" :class="{'is-active':nowTagValue==item.value}"></span>
|
||||
<span class="tag-text">{{item.label}}</span>
|
||||
<i class="el-icon-close tag-close" @click.stop="closeTag(item)" v-if="item.close"></i>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<el-dropdown class="tags-menu pull-right">
|
||||
<el-button type="primary" size="mini">
|
||||
更多<i class="el-icon-arrow-down el-icon--right"></i>
|
||||
</el-button>
|
||||
<el-dropdown-menu slot="dropdown">
|
||||
<el-dropdown-item @click.native="closeOthersTags">关闭其他</el-dropdown-item>
|
||||
<el-dropdown-item @click.native="closeAllTags">关闭全部</el-dropdown-item>
|
||||
</el-dropdown-menu>
|
||||
</el-dropdown>
|
||||
</div>
|
||||
<!-- <ul class='contextmenu' v-show="visible" :style="{left:left+'px',top:top+'px'}">
|
||||
<el-dropdown class="tags-menu pull-right">
|
||||
<el-button type="primary" size="mini">
|
||||
更多
|
||||
<i class="el-icon-arrow-down el-icon--right"></i>
|
||||
</el-button>
|
||||
<el-dropdown-menu slot="dropdown">
|
||||
<el-dropdown-item @click.native="closeOthersTags">关闭其他</el-dropdown-item>
|
||||
<el-dropdown-item @click.native="closeAllTags">关闭全部</el-dropdown-item>
|
||||
</el-dropdown-menu>
|
||||
</el-dropdown>
|
||||
</div>
|
||||
<!-- <ul class='contextmenu' v-show="visible" :style="{left:left+'px',top:top+'px'}">
|
||||
<li @click="closeTag(selectedTag)">关闭</li>
|
||||
<li @click="closeOthersTags">关闭其他</li>
|
||||
<li @click="closeAllTags">关闭全部</li>
|
||||
</ul> -->
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import { resolveUrlPath } from "@/util/util";
|
||||
@ -51,6 +44,7 @@ export default {
|
||||
data() {
|
||||
return {
|
||||
visible: false,
|
||||
tagBodyLeft: 0,
|
||||
lock: false,
|
||||
startX: 0,
|
||||
startY: 0,
|
||||
@ -62,14 +56,22 @@ export default {
|
||||
};
|
||||
},
|
||||
created() {},
|
||||
mounted() {},
|
||||
mounted() {
|
||||
this.init();
|
||||
},
|
||||
watch: {
|
||||
$route(to) {
|
||||
this.init();
|
||||
},
|
||||
visible(value) {
|
||||
if (value) {
|
||||
document.body.addEventListener("click", this.closeMenu);
|
||||
} else {
|
||||
document.body.removeEventListener("click", this.closeMenu);
|
||||
}
|
||||
},
|
||||
tagBodyLeft(value) {
|
||||
this.$refs.tagsList.style.left = value + "px";
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
@ -86,6 +88,17 @@ export default {
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
init() {
|
||||
this.refsTag = this.$refs.tagsPageOpened;
|
||||
setTimeout(() => {
|
||||
this.refsTag.forEach((item, index) => {
|
||||
if (this.tag.value === item.attributes.name.value) {
|
||||
let tag = this.refsTag[index];
|
||||
this.moveToView(tag);
|
||||
}
|
||||
});
|
||||
}, 1);
|
||||
},
|
||||
showCollapse() {
|
||||
this.$store.commit("SET_COLLAPSE");
|
||||
},
|
||||
@ -102,22 +115,10 @@ export default {
|
||||
this.startY = e.changedTouches[0].pageY;
|
||||
}
|
||||
},
|
||||
hadelMousewheel(e) {
|
||||
const left = Number(this.$refs.tagsList.style.left.replace("px", ""));
|
||||
const step = 100; //一个tag长度
|
||||
const len = 10; //tag的个数
|
||||
hadelMouse(e) {
|
||||
const boundarystart = 0,
|
||||
boundaryend = -(this.tagList.length - len) * step;
|
||||
//鼠标滑轮滚动
|
||||
if (e.deltaY) {
|
||||
this.endY = e.deltaY;
|
||||
if (this.endY > 0 && left > boundaryend) {
|
||||
this.$refs.tagsList.style.left = left - step + "px";
|
||||
} else if (this.endY < 0 && left < boundarystart) {
|
||||
this.$refs.tagsList.style.left = left + step + "px";
|
||||
}
|
||||
return;
|
||||
}
|
||||
boundaryend =
|
||||
this.$refs.tagsList.offsetWidth - this.$refs.tagBox.offsetWidth + 100;
|
||||
if (!this.lock) {
|
||||
return;
|
||||
}
|
||||
@ -135,12 +136,25 @@ export default {
|
||||
let distanceX = this.endX - this.startX;
|
||||
let distanceY = this.endY - this.startY;
|
||||
//判断滑动方向——向右滑动
|
||||
distanceX = distanceX * 0.08;
|
||||
if (distanceX > 0 && left <= boundarystart) {
|
||||
this.$refs.tagsList.style.left = left + distanceX + "px";
|
||||
distanceX = parseInt(distanceX * 0.8);
|
||||
if (distanceX > 0 && this.tagBodyLeft < boundarystart) {
|
||||
this.tagBodyLeft = this.tagBodyLeft + distanceX;
|
||||
//判断滑动方向——向左滑动
|
||||
} else if (distanceX < 0 && left >= boundaryend) {
|
||||
this.$refs.tagsList.style.left = left + distanceX + "px";
|
||||
} else if (distanceX < 0 && this.tagBodyLeft >= -boundaryend) {
|
||||
this.tagBodyLeft = this.tagBodyLeft + distanceX;
|
||||
}
|
||||
},
|
||||
hadelMousewheel(e) {
|
||||
const step = 0.8 * 90; //一个tag长度
|
||||
const boundarystart = 0,
|
||||
boundaryend =
|
||||
this.$refs.tagsList.offsetWidth - this.$refs.tagBox.offsetWidth + 100;
|
||||
// Y>0向左滑动
|
||||
if (e.deltaY > 0 && this.tagBodyLeft >= -boundaryend) {
|
||||
this.tagBodyLeft = this.tagBodyLeft - step;
|
||||
// Y<0向右滑动
|
||||
} else if (e.deltaY < 0 && this.tagBodyLeft < boundarystart) {
|
||||
this.tagBodyLeft = this.tagBodyLeft + step;
|
||||
}
|
||||
},
|
||||
openMenu(tag, e) {
|
||||
@ -163,11 +177,29 @@ export default {
|
||||
this.$store.commit("ADD_TAG", this.tagWel);
|
||||
this.$router.push({ path: resolveUrlPath(this.tagWel.value) });
|
||||
},
|
||||
moveToView(tag) {
|
||||
if (tag.offsetLeft < -this.tagBodyLeft) {
|
||||
// 标签在可视区域左侧
|
||||
this.tagBodyLeft = -tag.offsetLeft + 10;
|
||||
} else if (
|
||||
tag.offsetLeft + 10 > -this.tagBodyLeft &&
|
||||
tag.offsetLeft + tag.offsetWidth <
|
||||
-this.tagBodyLeft + this.$refs.tagBox.offsetWidth
|
||||
) {
|
||||
// 标签在可视区域
|
||||
} else {
|
||||
// 标签在可视区域右侧
|
||||
this.tagBodyLeft = -(
|
||||
tag.offsetLeft -
|
||||
(this.$refs.tagBox.offsetWidth - 100 - tag.offsetWidth) +
|
||||
20
|
||||
);
|
||||
}
|
||||
},
|
||||
openUrl(url, name, num) {
|
||||
this.$store.commit("ADD_TAG", {
|
||||
label: name,
|
||||
value: url,
|
||||
num: num
|
||||
value: url
|
||||
});
|
||||
this.$router.push({ path: resolveUrlPath(url) });
|
||||
},
|
||||
|
||||
@ -1,78 +0,0 @@
|
||||
<template>
|
||||
<div class="header">
|
||||
<div class="header-button is-left">
|
||||
<h3 style="letter-spacing: 1px;">Pig 微服务快速开发框架</h3>
|
||||
</div>
|
||||
<h1 class="header-title"></h1>
|
||||
<div class="header-button is-right">
|
||||
<el-tooltip class="item" effect="dark" content="锁屏" placement="bottom">
|
||||
<span class="header-item">
|
||||
<i class="icon-bofangqi-suoping" @click="handleLock"></i>
|
||||
</span>
|
||||
</el-tooltip>
|
||||
<el-tooltip class="item" effect="dark" :content="isFullScren?'退出全屏':'全屏'" placement="bottom">
|
||||
<span class="header-item">
|
||||
<i :class="isFullScren?'icon-tuichuquanping':'icon-quanping'" @click="handleScreen"></i>
|
||||
</span>
|
||||
</el-tooltip>
|
||||
<el-dropdown>
|
||||
<span class="el-dropdown-link">
|
||||
{{userInfo.username}}<i class="el-icon-arrow-down el-icon--right"></i>
|
||||
</span>
|
||||
<el-dropdown-menu slot="dropdown">
|
||||
<el-dropdown-item @click.native="logout">退出系统</el-dropdown-item>
|
||||
</el-dropdown-menu>
|
||||
</el-dropdown>
|
||||
<el-tooltip class="item" effect="dark" content="用户头像" placement="bottom">
|
||||
<img class="header-userImg" :src="userInfo.avatar">
|
||||
</el-tooltip>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { mapState, mapGetters } from "vuex";
|
||||
import { fullscreenToggel } from "@/util/util";
|
||||
export default {
|
||||
name: "top",
|
||||
data() {
|
||||
return {};
|
||||
},
|
||||
filters: {},
|
||||
created() {},
|
||||
computed: {
|
||||
...mapState({
|
||||
userInfo: state => state.user.userInfo
|
||||
}),
|
||||
...mapGetters(["isFullScren"])
|
||||
},
|
||||
methods: {
|
||||
handleLock() {
|
||||
this.$store.commit("SET_LOCK");
|
||||
setTimeout(() => {
|
||||
this.$router.push({ path: "/lock" });
|
||||
}, 100);
|
||||
},
|
||||
handleScreen() {
|
||||
this.$store.commit("SET_FULLSCREN");
|
||||
fullscreenToggel();
|
||||
},
|
||||
logout() {
|
||||
this.$confirm("是否退出系统, 是否继续?", "提示", {
|
||||
confirmButtonText: "确定",
|
||||
cancelButtonText: "取消",
|
||||
type: "warning"
|
||||
}).then(() => {
|
||||
this.$store.dispatch("LogOut").then(() => {
|
||||
this.$router.push({ path: "/login" });
|
||||
});
|
||||
});
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
|
||||
</style>
|
||||
|
||||
84
src/page/index/top/index.vue
Normal file
84
src/page/index/top/index.vue
Normal file
@ -0,0 +1,84 @@
|
||||
<template>
|
||||
<div class="header">
|
||||
<div class="header-button is-left">
|
||||
<h3 style="letter-spacing: 1px;">Avue 通用管理系统快速开发框架</h3>
|
||||
</div>
|
||||
<h1 class="header-title"></h1>
|
||||
<div class="header-button is-right">
|
||||
<el-tooltip class="item" effect="dark" content="锁屏" placement="bottom">
|
||||
<span class="header-item">
|
||||
<top-lock></top-lock>
|
||||
</span>
|
||||
</el-tooltip>
|
||||
<el-tooltip class="item" effect="dark" :content="isFullScren?'退出全屏':'全屏'" placement="bottom">
|
||||
<span class="header-item">
|
||||
<i :class="isFullScren?'icon-tuichuquanping':'icon-quanping'" @click="handleScreen"></i>
|
||||
</span>
|
||||
</el-tooltip>
|
||||
<el-dropdown>
|
||||
<span class="el-dropdown-link">
|
||||
{{userInfo.username}}
|
||||
<i class="el-icon-arrow-down el-icon--right"></i>
|
||||
</span>
|
||||
<el-dropdown-menu slot="dropdown">
|
||||
<el-dropdown-item>
|
||||
<router-link to="/">首页</router-link>
|
||||
</el-dropdown-item>
|
||||
<el-dropdown-item>
|
||||
<a href="https://gitee.com/smallweigit/avue" target="_blank">码云地址</a>
|
||||
</el-dropdown-item>
|
||||
<el-dropdown-item>
|
||||
<a href="https://github.com/nmxiaowei/avue" target="_blank">github</a>
|
||||
</el-dropdown-item>
|
||||
<el-dropdown-item @click.native="logout" divided>退出系统</el-dropdown-item>
|
||||
</el-dropdown-menu>
|
||||
</el-dropdown>
|
||||
<el-tooltip class="item" effect="dark" content="用户头像" placement="bottom">
|
||||
<img class="header-userImg" :src="userInfo.avatar">
|
||||
</el-tooltip>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { mapState, mapGetters } from "vuex";
|
||||
import { fullscreenToggel } from "@/util/util";
|
||||
import topLock from "./top-lock";
|
||||
export default {
|
||||
components: { topLock },
|
||||
name: "top",
|
||||
data() {
|
||||
return {};
|
||||
},
|
||||
filters: {},
|
||||
created() {},
|
||||
computed: {
|
||||
...mapState({
|
||||
userInfo: state => state.user.userInfo
|
||||
}),
|
||||
...mapGetters(["isFullScren"])
|
||||
},
|
||||
methods: {
|
||||
handleScreen() {
|
||||
this.$store.commit("SET_FULLSCREN");
|
||||
fullscreenToggel();
|
||||
},
|
||||
logout() {
|
||||
this.$confirm("是否退出系统, 是否继续?", "提示", {
|
||||
confirmButtonText: "确定",
|
||||
cancelButtonText: "取消",
|
||||
type: "warning"
|
||||
}).then(() => {
|
||||
this.$store.dispatch("LogOut").then(() => {
|
||||
this.$router.push({ path: "/login" });
|
||||
});
|
||||
});
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
|
||||
</style>
|
||||
|
||||
63
src/page/index/top/top-lock.vue
Normal file
63
src/page/index/top/top-lock.vue
Normal file
@ -0,0 +1,63 @@
|
||||
<template>
|
||||
<span>
|
||||
<i class="icon-bofangqi-suoping" @click="handleLock"></i>
|
||||
<el-dialog title="设置锁屏密码" :visible.sync="box" width="30%">
|
||||
<el-form :model="form" ref="form" label-width="80px">
|
||||
<el-form-item label="锁屏密码" prop="passwd" :rules="[{ required: true, message: '锁屏密码不能为空'}]">
|
||||
<el-input v-model="form.passwd" placeholder="请输入锁屏密码"></el-input>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<span slot="footer" class="dialog-footer">
|
||||
<el-button type="primary" @click="handleSetLock">确 定</el-button>
|
||||
</span>
|
||||
</el-dialog>
|
||||
</span>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { fullscreenToggel } from "@/util/util";
|
||||
import { validatenull } from "@/util/validate";
|
||||
import { mapGetters } from "vuex";
|
||||
export default {
|
||||
name: "top-lock",
|
||||
data() {
|
||||
return {
|
||||
box: false,
|
||||
form: {
|
||||
passwd: ""
|
||||
}
|
||||
};
|
||||
},
|
||||
created() {},
|
||||
mounted() {},
|
||||
computed: {
|
||||
...mapGetters(["lockPasswd"])
|
||||
},
|
||||
props: [],
|
||||
methods: {
|
||||
handleSetLock() {
|
||||
this.$refs["form"].validate(valid => {
|
||||
if (valid) {
|
||||
this.$store.commit("SET_LOCK_PASSWD", this.form.passwd);
|
||||
this.handleLock();
|
||||
}
|
||||
});
|
||||
},
|
||||
handleLock() {
|
||||
if (validatenull(this.lockPasswd)) {
|
||||
this.box = true;
|
||||
return;
|
||||
}
|
||||
this.$store.commit("SET_LOCK");
|
||||
setTimeout(() => {
|
||||
this.$router.push({ path: "/lock" });
|
||||
}, 100);
|
||||
}
|
||||
},
|
||||
components: {}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
|
||||
</style>
|
||||
@ -1,4 +1,4 @@
|
||||
import { setStore, getStore } from '@/util/store'
|
||||
import { setStore, getStore, removeStore } from '@/util/store'
|
||||
import { validatenull } from '@/util/validate'
|
||||
import { getDic } from '@/api/admin'
|
||||
import { baseUrl } from '@/config/env';
|
||||
@ -8,6 +8,7 @@ const common = {
|
||||
isCollapse: false,
|
||||
isFullScren: false,
|
||||
isLock: getStore({ name: 'isLock' }) || false,
|
||||
lockPasswd: getStore({ name: 'lockPasswd' }) || '',
|
||||
},
|
||||
actions: {
|
||||
//获取字典公用类
|
||||
@ -34,11 +35,17 @@ const common = {
|
||||
},
|
||||
SET_LOCK: (state, action) => {
|
||||
state.isLock = true;
|
||||
setStore({ name: 'isLock', content: state.isLock })
|
||||
setStore({ name: 'isLock', content: state.isLock, type: 'session' })
|
||||
},
|
||||
SET_LOCK_PASSWD: (state, lockPasswd) => {
|
||||
state.lockPasswd = lockPasswd;
|
||||
setStore({ name: 'lockPasswd', content: state.lockPasswd, type: 'session' })
|
||||
},
|
||||
CLEAR_LOCK: (state, action) => {
|
||||
state.isLock = false;
|
||||
setStore({ name: 'isLock', content: state.isLock })
|
||||
state.lockPasswd = '';
|
||||
removeStore({ name: 'lockPasswd' });
|
||||
removeStore({ name: 'isLock' });
|
||||
},
|
||||
}
|
||||
}
|
||||
|
||||
@ -1,4 +1,4 @@
|
||||
import { setStore, getStore } from '@/util/store'
|
||||
import { setStore, getStore, removeStore } from '@/util/store'
|
||||
import { validatenull } from "@/util/validate"
|
||||
const tagObj = {
|
||||
label: '',
|
||||
@ -40,21 +40,20 @@ const navs = {
|
||||
if (state.tagList.some(a => a.value === action.value)) return
|
||||
state.tagList.push({
|
||||
label: action.label,
|
||||
num: action.num,
|
||||
value: action.value,
|
||||
})
|
||||
state.tagList = setFistTag(state.tagList);
|
||||
setStore({ name: 'tagList', content: state.tagList, type: 'session' })
|
||||
setStore({ name: 'tagList', content: state.tagList })
|
||||
},
|
||||
SET_TAG_CURRENT: (state, tagCurrent) => {
|
||||
state.tagCurrent = tagCurrent;
|
||||
setStore({ name: 'tagCurrent', content: state.tagCurrent, type: 'session' })
|
||||
setStore({ name: 'tagCurrent', content: state.tagCurrent })
|
||||
},
|
||||
SET_TAG: (state, value) => {
|
||||
for (const [i, v] of state.tagList.entries()) {
|
||||
if (v.value === value) {
|
||||
state.tag = state.tagList[i];
|
||||
setStore({ name: 'tag', content: state.tag, type: 'session' })
|
||||
setStore({ name: 'tag', content: state.tag })
|
||||
break
|
||||
}
|
||||
}
|
||||
@ -62,8 +61,8 @@ const navs = {
|
||||
DEL_ALL_TAG: (state, action) => {
|
||||
state.tag = tagObj;
|
||||
state.tagList = [];
|
||||
setStore({ name: 'tag', content: state.tagList, type: 'session' })
|
||||
setStore({ name: 'tagList', content: state.tagList, type: 'session' })
|
||||
removeStore({ name: 'tag' });
|
||||
removeStore({ name: 'tagList' });
|
||||
},
|
||||
DEL_TAG_OTHER: (state, action) => {
|
||||
for (const [i, v] of state.tagList.entries()) {
|
||||
@ -71,8 +70,8 @@ const navs = {
|
||||
state.tagList = state.tagList.slice(i, i + 1)
|
||||
state.tag = state.tagList[0];
|
||||
state.tagList[0].close = false;
|
||||
setStore({ name: 'tag', content: state.tag, type: 'session' })
|
||||
setStore({ name: 'tagList', content: state.tagList, type: 'session' })
|
||||
setStore({ name: 'tag', content: state.tag })
|
||||
setStore({ name: 'tagList', content: state.tagList })
|
||||
break
|
||||
}
|
||||
}
|
||||
|
||||
@ -1,51 +1,43 @@
|
||||
.header {
|
||||
-webkit-box-align: center;
|
||||
-ms-flex-align: center;
|
||||
align-items: center;
|
||||
background-color: #fff;
|
||||
border-bottom:2px solid $menuBg;
|
||||
color: #333;
|
||||
box-sizing: border-box;
|
||||
display: -webkit-box;
|
||||
display: -ms-flexbox;
|
||||
display: flex;
|
||||
font-size: 18px;
|
||||
height: 60px;
|
||||
line-height: 1;
|
||||
padding: 0 10px;
|
||||
text-align: center;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.header-title {
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
font-size: inherit;
|
||||
font-weight: 400;
|
||||
flex: 1;
|
||||
}
|
||||
|
||||
.header-button.is-left {
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
.header-button.is-right {
|
||||
text-align: right;
|
||||
}
|
||||
.header-userImg{
|
||||
margin: 0 3px 0 10px;
|
||||
padding: 2px;
|
||||
width: 35px;
|
||||
height:35px;
|
||||
border-radius: 100%;
|
||||
box-sizing: border-box;
|
||||
border:1px solid #eee;
|
||||
}
|
||||
.header-button {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
.header-button>.header-item{
|
||||
margin-right: 12px;
|
||||
}
|
||||
-webkit-box-align: center;
|
||||
-ms-flex-align: center;
|
||||
align-items: center;
|
||||
background-color: #fff;
|
||||
border-bottom:2px solid $menuBg;
|
||||
color: #333;
|
||||
box-sizing: border-box;
|
||||
display: -webkit-box;
|
||||
display: -ms-flexbox;
|
||||
display: flex;
|
||||
font-size: 18px;
|
||||
height: 60px;
|
||||
line-height: 1;
|
||||
padding: 0 10px;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.header-title {
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
font-size: inherit;
|
||||
font-weight: 400;
|
||||
flex: 1;
|
||||
}
|
||||
|
||||
.header-userImg{
|
||||
margin: 0 3px 0 10px;
|
||||
padding: 2px;
|
||||
width: 35px;
|
||||
height:35px;
|
||||
border-radius: 100%;
|
||||
box-sizing: border-box;
|
||||
border:1px solid #eee;
|
||||
}
|
||||
.header-button {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
.header-button>.header-item{
|
||||
margin-right: 12px;
|
||||
}
|
||||
Loading…
Reference in New Issue
Block a user