|
|
@@ -90,198 +90,196 @@
|
|
|
</el-container>
|
|
|
</template>
|
|
|
<script>
|
|
|
- import {WEBSOCKET_HOST} from '@/utils/config'
|
|
|
- import userInfo from '@/utils/userInfo'
|
|
|
- import network from '@/utils/network'
|
|
|
- import tool from '@/utils/tool'
|
|
|
- import Waves from '@/static/plugins/waves/waves.js'
|
|
|
- import store from '@/utils/vuexStore'
|
|
|
- import baseInfo from '@/utils/baseInfo'
|
|
|
- import initRegion from '@/utils/region'
|
|
|
- import '@/static/plugins/css/font-awesome.min.css'
|
|
|
+import {WEBSOCKET_HOST} from '@/utils/config'
|
|
|
+import userInfo from '@/utils/userInfo'
|
|
|
+import network from '@/utils/network'
|
|
|
+import tool from '@/utils/tool'
|
|
|
+import Waves from '@/static/plugins/waves/waves.js'
|
|
|
+import store from '@/utils/vuexStore'
|
|
|
+import baseInfo from '@/utils/baseInfo'
|
|
|
+import initRegion from '@/utils/region'
|
|
|
+import '@/static/plugins/css/font-awesome.min.css'
|
|
|
|
|
|
- export default {
|
|
|
- name: 'layout',
|
|
|
- beforeCreate() {
|
|
|
- let vueObj = this
|
|
|
- // 检测用户是否已经登录，如果已经登录则直接跳转到控制台页
|
|
|
- if (!userInfo.hasLogin()) {
|
|
|
- this.$router.push('/login')
|
|
|
- return
|
|
|
- }
|
|
|
- // websocket连接
|
|
|
- let wsServer = WEBSOCKET_HOST
|
|
|
- let webSocket = new WebSocket(wsServer)
|
|
|
- store.state.socket.socketObj = webSocket
|
|
|
- webSocket.onopen = function (evt) {
|
|
|
- let userId = userInfo.userId()
|
|
|
- let sendData = {app: 'admin', userId: userId}
|
|
|
- webSocket.send(JSON.stringify(sendData))
|
|
|
- }
|
|
|
- webSocket.onmessage = function (env) {
|
|
|
- let data = JSON.parse(env.data)
|
|
|
- if (data.handle === 'adminAsync') {
|
|
|
- vueObj.$message({
|
|
|
- message: data.message,
|
|
|
- type: data.success ? 'success' : 'error',
|
|
|
- showClose: !data.success,
|
|
|
- duration: data.success ? 3000 : 0,
|
|
|
- })
|
|
|
- if (store.state.socket.onMessageCallback !== null) {
|
|
|
- store.state.socket.onMessageCallback()
|
|
|
- }
|
|
|
+export default {
|
|
|
+ name: 'layout',
|
|
|
+ beforeCreate () {
|
|
|
+ let vueObj = this
|
|
|
+ // 检测用户是否已经登录，如果已经登录则直接跳转到控制台页
|
|
|
+ if (!userInfo.hasLogin()) {
|
|
|
+ this.$router.push('/login')
|
|
|
+ return
|
|
|
+ }
|
|
|
+ // websocket连接
|
|
|
+ let wsServer = WEBSOCKET_HOST
|
|
|
+ let webSocket = new WebSocket(wsServer)
|
|
|
+ store.state.socket.socketObj = webSocket
|
|
|
+ webSocket.onopen = function (evt) {
|
|
|
+ let userId = userInfo.userId()
|
|
|
+ let sendData = {app: 'admin', userId: userId}
|
|
|
+ webSocket.send(JSON.stringify(sendData))
|
|
|
+ }
|
|
|
+ webSocket.onmessage = function (env) {
|
|
|
+ let data = JSON.parse(env.data)
|
|
|
+ if (data.handle === 'adminAsync') {
|
|
|
+ vueObj.$message({
|
|
|
+ message: data.message,
|
|
|
+ type: data.success ? 'success' : 'error',
|
|
|
+ showClose: !data.success,
|
|
|
+ duration: data.success ? 3000 : 0
|
|
|
+ })
|
|
|
+ if (store.state.socket.onMessageCallback !== null) {
|
|
|
+ store.state.socket.onMessageCallback()
|
|
|
}
|
|
|
- else if (data.handle === 'adminAsyncPercent') {
|
|
|
- if (store.state.socket.onMessageCallback !== null) {
|
|
|
- store.state.socket.onMessageCallback(data)
|
|
|
- }
|
|
|
+ } else if (data.handle === 'adminAsyncPercent') {
|
|
|
+ if (store.state.socket.onMessageCallback !== null) {
|
|
|
+ store.state.socket.onMessageCallback(data)
|
|
|
}
|
|
|
-
|
|
|
}
|
|
|
- // 获取系统相关信息
|
|
|
- // network.getData(`site/base-info`).then(response => {
|
|
|
- // store.state.baseInfo.decLevels = response.decLevels;
|
|
|
- // store.state.baseInfo.empLevels = response.empLevels;
|
|
|
- // store.state.baseInfo.adminRoles = response.adminRoles;
|
|
|
- // store.state.baseInfo.menu = response.menu;
|
|
|
- // });
|
|
|
-
|
|
|
- // 获取地区信息
|
|
|
- initRegion(this)
|
|
|
- },
|
|
|
- mounted() {
|
|
|
- Waves.init()
|
|
|
- this.calcTime()
|
|
|
- Waves.attach('.waves-btn')
|
|
|
- this.activeNav();
|
|
|
- this.$nextTick(function () {
|
|
|
- window.addEventListener('scroll', this.scrollToTop, true);
|
|
|
- });
|
|
|
- // 取消菜单a标签的默认动作
|
|
|
- let allLeftMenuA = document.getElementsByClassName('left-menu-a')
|
|
|
- for(let i in allLeftMenuA){
|
|
|
- if(allLeftMenuA[i].onclick){
|
|
|
- allLeftMenuA[i].onclick = function(e){
|
|
|
- e.preventDefault()
|
|
|
- }
|
|
|
+ }
|
|
|
+ // 获取系统相关信息
|
|
|
+ // network.getData(`site/base-info`).then(response => {
|
|
|
+ // store.state.baseInfo.decLevels = response.decLevels;
|
|
|
+ // store.state.baseInfo.empLevels = response.empLevels;
|
|
|
+ // store.state.baseInfo.adminRoles = response.adminRoles;
|
|
|
+ // store.state.baseInfo.menu = response.menu;
|
|
|
+ // });
|
|
|
+ // 获取地区信息
|
|
|
+ initRegion(this)
|
|
|
+ },
|
|
|
+ mounted () {
|
|
|
+ Waves.init()
|
|
|
+ this.calcTime()
|
|
|
+ Waves.attach('.waves-btn')
|
|
|
+ this.activeNav()
|
|
|
+ this.$nextTick(function () {
|
|
|
+ window.addEventListener('scroll', this.scrollToTop, true)
|
|
|
+ })
|
|
|
+ // 取消菜单a标签的默认动作
|
|
|
+ let allLeftMenuA = document.getElementsByClassName('left-menu-a')
|
|
|
+ for (let i in allLeftMenuA) {
|
|
|
+ if (allLeftMenuA[i].onclick) {
|
|
|
+ allLeftMenuA[i].onclick = function (e) {
|
|
|
+ e.preventDefault()
|
|
|
}
|
|
|
}
|
|
|
-
|
|
|
+ }
|
|
|
+ },
|
|
|
+ destroyed () {
|
|
|
+ window.removeEventListener('scroll', this.scrollToTop)
|
|
|
+ },
|
|
|
+ data () {
|
|
|
+ return {
|
|
|
+ isCollapse: false,
|
|
|
+ menuActiveIndex: this.$route.meta.highLight || this.$route.path,
|
|
|
+ mainTitle: this.$route.meta.title,
|
|
|
+ messageShow: false,
|
|
|
+ profileShow: false,
|
|
|
+ adminNameShow: true,
|
|
|
+ menuClass: '',
|
|
|
+ adminName: userInfo.adminName(),
|
|
|
+ nowTime: tool.getTimestamp(),
|
|
|
+ periodNum: baseInfo.nowPeriodNum(),
|
|
|
+ showBackToUp: false
|
|
|
+ }
|
|
|
+ },
|
|
|
+ computed: {
|
|
|
+ nowDateTime: function () {
|
|
|
+ // console.log(this.nowTime)
|
|
|
+ return this.$moment(this.nowTime * 1000).utcOffset('+0100' ).format('YYYY-MM-DD HH:mm:ss') + ' (WAT)'
|
|
|
+ // return tool.formatDate(this.nowTime)
|
|
|
},
|
|
|
- destroyed () {
|
|
|
- window.removeEventListener('scroll', this.scrollToTop);
|
|
|
+ menu: function () {
|
|
|
+ return baseInfo.menu()
|
|
|
},
|
|
|
- data() {
|
|
|
- return {
|
|
|
- isCollapse: false,
|
|
|
- menuActiveIndex: this.$route.meta.highLight || this.$route.path,
|
|
|
- mainTitle: this.$route.meta.title,
|
|
|
- messageShow: false,
|
|
|
- profileShow: false,
|
|
|
- adminNameShow: true,
|
|
|
- menuClass: '',
|
|
|
- adminName: userInfo.adminName(),
|
|
|
- nowTime: tool.getTimestamp(),
|
|
|
- periodNum: baseInfo.nowPeriodNum(),
|
|
|
- showBackToUp:false,
|
|
|
+ contentTitle: function () {
|
|
|
+ return this.$route.meta.title
|
|
|
+ },
|
|
|
+ breadcrumb: function () {
|
|
|
+ let breadcrumbArr = []
|
|
|
+ for (let i in this.$route.meta.breadcrumb) {
|
|
|
+ breadcrumbArr.push(this.$route.meta.breadcrumb[i])
|
|
|
}
|
|
|
+ breadcrumbArr.push({title: this.$route.meta.title, path: ''})
|
|
|
+ return breadcrumbArr
|
|
|
},
|
|
|
- computed: {
|
|
|
- nowDateTime: function () {
|
|
|
- return tool.formatDate(this.nowTime)
|
|
|
- },
|
|
|
- menu: function () {
|
|
|
- return baseInfo.menu()
|
|
|
- },
|
|
|
- contentTitle: function () {
|
|
|
- return this.$route.meta.title
|
|
|
- },
|
|
|
- breadcrumb: function () {
|
|
|
- let breadcrumbArr = []
|
|
|
- for (let i in this.$route.meta.breadcrumb) {
|
|
|
- breadcrumbArr.push(this.$route.meta.breadcrumb[i])
|
|
|
- }
|
|
|
- breadcrumbArr.push({title: this.$route.meta.title, path: ''})
|
|
|
- return breadcrumbArr
|
|
|
- },
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ calcTime () {
|
|
|
+ let obj = this
|
|
|
+ setInterval(function () {
|
|
|
+ obj.nowTime += 1
|
|
|
+ }, 1000)
|
|
|
},
|
|
|
- methods: {
|
|
|
- calcTime() {
|
|
|
- let obj = this
|
|
|
- setInterval(function () {
|
|
|
- obj.nowTime += 1
|
|
|
- }, 1000)
|
|
|
- },
|
|
|
- onMenu() {
|
|
|
- if (this.isCollapse) {
|
|
|
- this.isCollapse = false
|
|
|
- document.getElementsByTagName('body')[0].className = ''
|
|
|
- } else {
|
|
|
- this.isCollapse = true
|
|
|
- document.getElementsByTagName('body')[0].className = 'content-wrapper'
|
|
|
- }
|
|
|
- },
|
|
|
- onMobileMenu() {
|
|
|
- if (this.menuClass === 'show-menu') {
|
|
|
- this.menuClass = ''
|
|
|
- } else {
|
|
|
- this.menuClass = 'show-menu'
|
|
|
+ onMenu () {
|
|
|
+ if (this.isCollapse) {
|
|
|
+ this.isCollapse = false
|
|
|
+ document.getElementsByTagName('body')[0].className = ''
|
|
|
+ } else {
|
|
|
+ this.isCollapse = true
|
|
|
+ document.getElementsByTagName('body')[0].className = 'content-wrapper'
|
|
|
+ }
|
|
|
+ },
|
|
|
+ onMobileMenu () {
|
|
|
+ if (this.menuClass === 'show-menu') {
|
|
|
+ this.menuClass = ''
|
|
|
+ } else {
|
|
|
+ this.menuClass = 'show-menu'
|
|
|
+ }
|
|
|
+ },
|
|
|
+ onMessage () {
|
|
|
+ this.messageShow = !this.messageShow
|
|
|
+ },
|
|
|
+ onProfile () {
|
|
|
+ this.profileShow = !this.profileShow
|
|
|
+ },
|
|
|
+ onLogout () {
|
|
|
+ userInfo.clear()
|
|
|
+ this.$router.push('/login')
|
|
|
+ },
|
|
|
+ onChangePassword () {
|
|
|
+ this.$router.push('/admin/change-password')
|
|
|
+ },
|
|
|
+ onCloseProfile () {
|
|
|
+ this.profileShow = false
|
|
|
+ },
|
|
|
+ // 点击图片回到顶部方法，加计时器是为了过渡顺滑
|
|
|
+ backTop () {
|
|
|
+ let that = this
|
|
|
+ let timer = setInterval(() => {
|
|
|
+ let _speed = Math.floor(-that.scrollTop / 5)
|
|
|
+ document.documentElement.scrollTop = document.body.scrollTop = that.scrollTop + _speed
|
|
|
+ if (that.scrollTop === 0) {
|
|
|
+ clearInterval(timer)
|
|
|
}
|
|
|
- },
|
|
|
- onMessage() {
|
|
|
- this.messageShow = !this.messageShow
|
|
|
- },
|
|
|
- onProfile() {
|
|
|
- this.profileShow = !this.profileShow
|
|
|
- },
|
|
|
- onLogout() {
|
|
|
- userInfo.clear()
|
|
|
- this.$router.push('/login')
|
|
|
- },
|
|
|
- onChangePassword() {
|
|
|
- this.$router.push('/admin/change-password')
|
|
|
- },
|
|
|
- onCloseProfile() {
|
|
|
- this.profileShow = false
|
|
|
- },
|
|
|
- // 点击图片回到顶部方法，加计时器是为了过渡顺滑
|
|
|
- backTop () {
|
|
|
- let that = this;
|
|
|
- let timer = setInterval(() => {
|
|
|
- let _speed = Math.floor(-that.scrollTop / 5);
|
|
|
- document.documentElement.scrollTop = document.body.scrollTop = that.scrollTop + _speed;
|
|
|
- if (that.scrollTop === 0) {
|
|
|
- clearInterval(timer);
|
|
|
- }
|
|
|
- }, 16);
|
|
|
- },
|
|
|
- // 为了计算距离顶部的高度，当高度大于60显示回顶部图标，小于60则隐藏
|
|
|
- scrollToTop () {
|
|
|
- let that = this,
|
|
|
- _scrollTop = window.pageYOffset || document.documentElement.scrollTop || document.body.scrollTop;
|
|
|
- that.scrollTop = _scrollTop;
|
|
|
- if (that.scrollTop > 60) {
|
|
|
- that.showBackToUp = true;
|
|
|
- } else {
|
|
|
- that.showBackToUp = false;
|
|
|
- }
|
|
|
- },
|
|
|
- activeNav(){
|
|
|
- let currentRouteMeta = this.$route.meta;
|
|
|
- if(typeof currentRouteMeta['activeRoute'] !== 'undefined'){
|
|
|
- this.menuActiveIndex = currentRouteMeta['activeRoute'];
|
|
|
- }else{
|
|
|
- this.fixedMenuActive();
|
|
|
- }
|
|
|
- },
|
|
|
- fixedMenuActive(){
|
|
|
- let module = this.$route.matched[1].path;
|
|
|
- //fixed shop nav
|
|
|
- // if(module === '/shop') module = '/shop/goods';
|
|
|
- this.menuActiveIndex = module + '/index';
|
|
|
- },
|
|
|
+ }, 16)
|
|
|
+ },
|
|
|
+ // 为了计算距离顶部的高度，当高度大于60显示回顶部图标，小于60则隐藏
|
|
|
+ scrollToTop () {
|
|
|
+ let that = this,
|
|
|
+ _scrollTop = window.pageYOffset || document.documentElement.scrollTop || document.body.scrollTop
|
|
|
+ that.scrollTop = _scrollTop
|
|
|
+ if (that.scrollTop > 60) {
|
|
|
+ that.showBackToUp = true
|
|
|
+ } else {
|
|
|
+ that.showBackToUp = false
|
|
|
+ }
|
|
|
+ },
|
|
|
+ activeNav () {
|
|
|
+ let currentRouteMeta = this.$route.meta
|
|
|
+ if (typeof currentRouteMeta['activeRoute'] !== 'undefined') {
|
|
|
+ this.menuActiveIndex = currentRouteMeta['activeRoute']
|
|
|
+ } else {
|
|
|
+ this.fixedMenuActive()
|
|
|
+ }
|
|
|
+ },
|
|
|
+ fixedMenuActive () {
|
|
|
+ let module = this.$route.matched[1].path
|
|
|
+ // fixed shop nav
|
|
|
+ // if(module === '/shop') module = '/shop/goods';
|
|
|
+ this.menuActiveIndex = module + '/index'
|
|
|
}
|
|
|
}
|
|
|
+}
|
|
|
</script>
|
|
|
|
|
|
<style>
|
theo