Skip to content

C
common-templete
Commit a07aa773 by 汤强勇
Options

调整

parent d64e62e0
Showing with 276 additions and 106 deletions
config/dev.env.js
...@@ -6,5 +6,5 @@ module.exports = merge(prodEnv, { ...@@ -6,5 +6,5 @@ module.exports = merge(prodEnv, {
'NODE_ENV': "'development'", 'NODE_ENV': "'development'",
'host': "'//localhost'", 'host': "'//localhost'",
'project': "'crm/vue'", 'project': "'crm/vue'",
'requestUrl': "'mina'" 'requestUrl': "'crm'"
}) })
config/prod.dev.env.js
module.exports = { module.exports = {
"host": "'//wxapp.hotwind.net'", "host": "'//wxapp.hotwind.net'",
'project': "'crm/vue'", 'project': "'crm/vue'",
'requestUrl': "'mina'" 'requestUrl': "'crm'"
} }
config/prod.prod.env.js
module.exports = { module.exports = {
"host": "'//wxapp.hotwind.net'", "host": "'//wxapp.hotwind.net'",
'project': "'crm/vue'", 'project': "'crm/vue'",
'requestUrl': "'mina'" 'requestUrl': "'crm'"
} }
config/prod.uat.env.js
module.exports = { module.exports = {
"host": "'//10.0.16.178:8080'", "host": "'//10.0.16.178:8080'",
'project': "'crm/vue'", 'project': "'crm/vue'",
'requestUrl': "'mina'" 'requestUrl': "'crm'"
} }
package.json
...@@ -16,6 +16,7 @@ ...@@ -16,6 +16,7 @@
"dependencies": { "dependencies": {
"animate.css": "^3.7.0", "animate.css": "^3.7.0",
"axios": "^0.18.0", "axios": "^0.18.0",
"cross-storage": "^1.0.0",
"echarts": "^4.2.0-rc.2", "echarts": "^4.2.0-rc.2",
"element-ui": "^2.4.9", "element-ui": "^2.4.9",
"jquery": "^3.3.1", "jquery": "^3.3.1",
......
src/App.vue
<template> <template>
<div id="app"> <div id="app" v-if="project">
<router-view /> <router-view />
</div> </div>
</template> </template>
<script> <script>
import {mapGetters, mapActions} from 'vuex'
export default { export default {
name: 'App' name: 'App',
created () {
this.getProjectInfo()
},
computed: {
...mapGetters({
menus: 'getMenus',
project: 'getProjectInfo'
})
},
methods:{
...mapActions([
'getProjectInfo'
])
}
} }
</script> </script>
...@@ -15,6 +31,6 @@ export default { ...@@ -15,6 +31,6 @@ export default {
/** 重置element-ui theme **/ /** 重置element-ui theme **/
$--color-primary: #337ab7 !default; $--color-primary: #337ab7 !default;
$--font-path: '~element-ui/lib/theme-chalk/fonts'; $--font-path: "~element-ui/lib/theme-chalk/fonts";
@import "~element-ui/packages/theme-chalk/src/index"; @import "~element-ui/packages/theme-chalk/src/index";
</style> </style>
src/api/global/index.js
import { Http } from '@/http' import { Http } from '@/http'
class Global extends Http { class Global extends Http {
getMenus (params) { getMenus(params) {
return this.get('getMenus', params) return this.get('getMenus', params)
} }
getProjectInfo() {
return this.get('securityManage/menuList!getStoreInfo.do')
}
} }
export default new Global(true) export default new Global(true)
src/components/Header/index.vue
...@@ -34,8 +34,8 @@ ...@@ -34,8 +34,8 @@
.opration-list--item.clearfix(v-for='opration in oprations ') .opration-list--item.clearfix(v-for='opration in oprations ')
.name.fl(@click="gotoPage(opration.link)") {{opration.name}} .name.fl(@click="gotoPage(opration.link)") {{opration.name}}
a.link(slot="reference") a.link(slot="reference")
img.user-img(':src'="user.headerImage") img.user-img(':src'="project.user_logo")
span.user-name {{user.name}} span.user-name {{project.StoreShortName}}
i.fa.fa-angle-down i.fa.fa-angle-down
li.nav-item.fr li.nav-item.fr
a.link(@click="showMessage()") a.link(@click="showMessage()")
...@@ -48,7 +48,7 @@ ...@@ -48,7 +48,7 @@
popper-class="helpers-popper", popper-class="helpers-popper",
trigger="click") trigger="click")
.helpers-body .helpers-body
.helper-list--item.clearfix(v-for='help in helpers ') .helper-list--item.clearfix(v-for='help in helpers ',@click="handlerHelperClick(help)")
i.fa.fl.helper-item--icon(:class="help.icon",:style="help.style",style={width:'22px',height:'22px'}) i.fa.fl.helper-item--icon(:class="help.icon",:style="help.style",style={width:'22px',height:'22px'})
.name.fl {{help.name}} .name.fl {{help.name}}
a.link(slot="reference") a.link(slot="reference")
...@@ -278,9 +278,12 @@ ...@@ -278,9 +278,12 @@
} }
</style> </style>
<script> <script>
import {setCookie, getCookie} from '@/utils'
import { mapGetters, mapActions } from 'vuex' import { mapGetters, mapActions } from 'vuex'
import message from './message' import message from './message'
require('@/lib/slimscroll/slimscroll') require('@/lib/slimscroll/slimscroll')
export default { export default {
name: 'headerNav', name: 'headerNav',
data () { data () {
...@@ -288,22 +291,22 @@ export default { ...@@ -288,22 +291,22 @@ export default {
showMenusPanel: false, showMenusPanel: false,
showEditMenusPanel: false, showEditMenusPanel: false,
showMessagePanelcontrol: null, showMessagePanelcontrol: null,
currentIndexPath: [1,2,0],
currentSelectIndex: -1, currentSelectIndex: -1,
oprations: [{name: '修改密码', link: 'http://www.baidu.com'}, {name: '安全退出', link: 'http://www.baidu.com'}], oprations: [{name: '修改密码', link: 'http://www.baidu.com'}, {name: '安全退出', link: 'http://www.baidu.com'}],
helpers: [{ helpers: [{
name: '点击联系客服', name: '点击联系客服',
link:'http://wpa.qq.com/msgrd?v=3&uin=2844377940&site=qq&menu=yes',
icon: 'fa-qq', icon: 'fa-qq',
style: {background: '#ff9293', color: '#fff'} style: {background: '#ff9293', color: '#fff'}
}, {name: '使用帮助', }, {name: '使用帮助',
link:'http://help.bigaka.com/',
style: {background: '#40b0ff', color: '#fff'}, style: {background: '#40b0ff', color: '#fff'},
icon: 'fa-info'}, icon: 'fa-info'},
{name: '舞象客服', {name: '舞象客服',
link:'http://help.bigaka.com/',
style: {background: '#e0e0e0', color: '#000'}, style: {background: '#e0e0e0', color: '#000'},
icon: 'fa-user-circle-o'}], icon: 'fa-user-circle-o'}],
user: {
headerImage: 'http://photo.bigaka.com/photos//2132/201805/56741525659969939_144_144.jpg',
name: '测试商户组'
},
historys: [{'name': '自动标签', 'index': '1,0,2', 'time': '2018-11-01 10:06:07'}, {'name': '快速查询', 'index': '1,0,0', 'time': '2018-10-31 17:17:09'}, {'name': '营销推送', 'index': '2,0,0', 'time': '2018-10-31 17:12:53'}, {'name': '会员圈选', 'index': '1,0,1', 'time': '2018-10-31 16:52:47'}, {'name': '概览', 'index': '0,0,0', 'time': '2018-10-31 13:31:59'}, {'name': '趋势', 'index': '0,1,0', 'time': '2018-10-29 15:52:31'}, {'name': '会员卡设置', 'index': '1,1,0', 'time': '2018-10-29 15:51:00'}, {'name': '生日营销(new)', 'index': '2,0,2', 'time': '2018-10-29 15:50:18'}] historys: [{'name': '自动标签', 'index': '1,0,2', 'time': '2018-11-01 10:06:07'}, {'name': '快速查询', 'index': '1,0,0', 'time': '2018-10-31 17:17:09'}, {'name': '营销推送', 'index': '2,0,0', 'time': '2018-10-31 17:12:53'}, {'name': '会员圈选', 'index': '1,0,1', 'time': '2018-10-31 16:52:47'}, {'name': '概览', 'index': '0,0,0', 'time': '2018-10-31 13:31:59'}, {'name': '趋势', 'index': '0,1,0', 'time': '2018-10-29 15:52:31'}, {'name': '会员卡设置', 'index': '1,1,0', 'time': '2018-10-29 15:51:00'}, {'name': '生日营销(new)', 'index': '2,0,2', 'time': '2018-10-29 15:50:18'}]
} }
}, },
...@@ -329,6 +332,7 @@ export default { ...@@ -329,6 +332,7 @@ export default {
} }
}, },
...mapGetters({ ...mapGetters({
project: 'getProjectInfo',
menus: 'getMenus', menus: 'getMenus',
editMenus: 'getEditMenus', editMenus: 'getEditMenus',
sidebarUnfoldInfo: 'getSidebarUnfoldInfo' sidebarUnfoldInfo: 'getSidebarUnfoldInfo'
...@@ -338,41 +342,16 @@ export default { ...@@ -338,41 +342,16 @@ export default {
message message
}, },
mounted () { mounted () {
this.$nextTick(() => { const index = getCookie('cur_menu_index')
this.initSlimscroll() const indexPath = index.split(',').reverse()
}) this.currentSelectIndex = indexPath[1]
}, },
methods: { methods: {
...mapActions([ ...mapActions([
'showEditMenus', 'showEditMenus',
'hideEditMenus' 'hideEditMenus'
]), ]),
initSlimscroll () {
$('.message-panel.el-notification').slimScroll({
width: '100%', // 可滚动区域宽度
height: '100%', // 可滚动区域高度
size: '10px', // 滚动条宽度，即组件宽度
color: '#000', // 滚动条颜色
position: 'right', // 组件位置：left/right
distance: '0px', // 组件与侧边之间的距离
start: 'top', // 默认滚动位置：top/bottom
opacity: 0.4, // 滚动条透明度
alwaysVisible: true, // 是否 始终显示组件
disableFadeOut: false, // 是否 鼠标经过可滚动区域时显示组件，离开时隐藏组件
railVisible: true, // 是否 显示轨道
railColor: '#333', // 轨道颜色
railOpacity: 0.2, // 轨道透明度
railDraggable: true, // 是否 滚动条可拖动
railClass: 'slimScrollRail', // 轨道div类名
barClass: 'slimScrollBar', // 滚动条div类名
wrapperClass: 'slimScrollDiv', // 外包div类名
allowPageScroll: true, // 是否 使用滚轮到达顶端/底端时，滚动窗口
wheelStep: 20, // 滚轮滚动量
touchScrollStep: 200, // 滚动量当用户使用手势
borderRadius: '7px', // 滚动条圆角
railBorderRadius: '7px' // 轨道圆角
})
},
clickItem () { clickItem () {
console.log('this is header index %o', this) console.log('this is header index %o', this)
}, },
...@@ -415,10 +394,16 @@ export default { ...@@ -415,10 +394,16 @@ export default {
formatPathString (...args) { formatPathString (...args) {
return args.join('-') return args.join('-')
}, },
handlerHelperClick (item) {
this.$router.push({
path: `/${item.link}`
})
},
gotoPage (link) { gotoPage (link) {
if (link) { this.$router.push({
location.href = link path: `/${link}`
} })
} }
} }
} }
......
src/components/Header/message.vue
...@@ -22,7 +22,6 @@ ...@@ -22,7 +22,6 @@
<script> <script>
import {Observable} from 'rxjs' import {Observable} from 'rxjs'
import {throttleTime, switchMap, filter} from 'rxjs/operators' import {throttleTime, switchMap, filter} from 'rxjs/operators'
require('@/lib/iscroll/iscroll') require('@/lib/iscroll/iscroll')
const IScroll = window.iScroll const IScroll = window.iScroll
let pullDownEl, pullDownOffset, pullUpEl, pullUpOffset let pullDownEl, pullDownOffset, pullUpEl, pullUpOffset
...@@ -48,7 +47,12 @@ export default { ...@@ -48,7 +47,12 @@ export default {
watch: {}, watch: {},
computed: {}, computed: {},
mounted () { mounted () {
this.$nextTick(() => {
this.bindMessageTapEvent() this.bindMessageTapEvent()
setTimeout(() => {
this.initSlimscroll()
},100)
})
}, },
methods: { methods: {
async getListDataFromNet () { async getListDataFromNet () {
...@@ -179,14 +183,7 @@ export default { ...@@ -179,14 +183,7 @@ export default {
}) })
}) })
const mouseupEl$ = Observable.create(observer => { mousemoveEl$.pipe(
$('body').on('mouseup','.message-item',(event) => {
// const item = $(event.currentTarget)
observer.next(event)
})
})
mouseupEl$.pipe(
switchMap(ev => mousemoveEl$),
switchMap(ev => clickEl$), switchMap(ev => clickEl$),
throttleTime(300), throttleTime(300),
filter(ev => ev.type === 'click') filter(ev => ev.type === 'click')
...@@ -220,12 +217,40 @@ export default { ...@@ -220,12 +217,40 @@ export default {
this.getListDataFromNet() this.getListDataFromNet()
}, },
initSlimscroll () {
$('#wrapper').slimScroll({
width: '100%', // 可滚动区域宽度
height: '700px', // 可滚动区域高度
size: '10px', // 滚动条宽度，即组件宽度
color: '#000', // 滚动条颜色
position: 'right', // 组件位置：left/right
distance: '0px', // 组件与侧边之间的距离
start: 'top', // 默认滚动位置：top/bottom
opacity: 0.4, // 滚动条透明度
alwaysVisible: true, // 是否 始终显示组件
disableFadeOut: false, // 是否 鼠标经过可滚动区域时显示组件，离开时隐藏组件
railVisible: true, // 是否 显示轨道
railColor: '#333', // 轨道颜色
railOpacity: 0.2, // 轨道透明度
railDraggable: true, // 是否 滚动条可拖动
railClass: 'slimScrollRail', // 轨道div类名
barClass: 'slimScrollBar', // 滚动条div类名
wrapperClass: 'slimScrollDiv', // 外包div类名
allowPageScroll: true, // 是否 使用滚轮到达顶端/底端时，滚动窗口
wheelStep: 20, // 滚轮滚动量
touchScrollStep: 200, // 滚动量当用户使用手势
borderRadius: '7px', // 滚动条圆角
railBorderRadius: '7px' // 轨道圆角
})
},
openMessageContent (item) { openMessageContent (item) {
this.$alert(`${item.content}`, '', { this.$alert(`<div><session class="model-body">${item.content}</session></div>`, '', {
dangerouslyUseHTMLString: true, dangerouslyUseHTMLString: true,
customClass: 'message-panel', customClass: 'message-panel',
confirmButtonText: '知道了',
title:item.title,
callback:(action) => { callback:(action) => {
if (action === 'cancel') {
this.axios.post('http://testcenter.bigaka.net/b/store/notice!addNoticeUserRelationAction.do', { this.axios.post('http://testcenter.bigaka.net/b/store/notice!addNoticeUserRelationAction.do', {
params:{ params:{
"userId":"3956", "userId":"3956",
...@@ -233,12 +258,39 @@ export default { ...@@ -233,12 +258,39 @@ export default {
} }
}) })
} }
} })
this.$nextTick(() => {
$(".el-message-box__message")
.slimscroll({
height: '530px',
distance: '10px',
alwaysVisible: false,
railVisible: true,
railColor: '#e1e1e1',
railOpacity: 1,
size: '6px',
color: '#77c2f7',
opacity: 1
})
}) })
} }
} }
} }
</script> </script>
<style>
.message-panel .el-message-box__title {
min-height: 16.428571429px;
padding: 15px;
border-bottom: 1px solid #e5e5e5;
}
.model-body {
position: relative;
overflow: hidden;
width: auto;
height: 500px;
}
</style>
<style scoped> <style scoped>
#wrapper { #wrapper {
......
src/components/Sidebar/index.vue
<template lang='pug'> <template lang='pug'>
.sidebar-wrapper .sidebar-wrapper
.control(':class'="{open:unfold,close:!unfold}") .control(':class'="{open:sidebarUnfoldInfo,close:!sidebarUnfoldInfo}")
.sidebar('@mouseover'="showUnfoldBtn()",'@mouseout'="hiddenUnfoldBtn()") .sidebar('@mouseover'="showUnfoldBtn()",'@mouseout'="hiddenUnfoldBtn()")
.logo .logo
img(':src'="logo") img(':src'="logo")
.item('v-if'="menus.length",'v-for'="(item,itemIndex) in menus" ,':key'="item.id",'@click'='choseMenu(item,itemIndex)',':class'="{active:currentMenusIndex === itemIndex}") .item('v-if'="menus.length",'v-for'="(data,itemIndex) in menus" ,':key'="data.item.id",'@click'='choseMenu(data,itemIndex)',':class'="{active:currentMenusIndex === itemIndex}")
sidebar-item&attributes({ sidebar-item&attributes({
':icon':'item.ico', ':icon':'data.item.ico',
':link':'item.link', ':link':'data.item.link',
':type':'item.type', ':type':'data.item.type',
':id':'item.id', ':id':'data.item.id',
':name':'item.name', ':name':'data.item.name',
':pid':'item.pid', ':pid':'data.item.pid',
':grade':'item.grade', ':grade':'data.item.grade',
':sort':'item.sort' ':sort':'data.item.sort'
}) })
transition(name="fade",mode="out-in",appear) transition(name="fade",mode="out-in",appear)
.childrens-meuns('v-show'="sidebarUnfoldInfo",'v-if'="currentMenus") .childrens-meuns('v-show'="sidebarUnfoldInfo",'v-if'="currentMenus")
.children-item('v-for'="(it,index) in currentMenus.children",':key'="it.id",'@click'="choseChildrenItem(it)") .children-item
el-menu&attributes({ el-menu&attributes({
'ref':"menu",
'default-active':"2", 'default-active':"2",
'class':"el-menu-vertical", 'class':"el-menu-vertical",
'background-color':"#374A5E", 'background-color':"#374A5E",
'text-color':"#fff", 'text-color':"#fff",
'unique-opened':true, 'unique-opened':true,
'active-text-color':"#fff", 'active-text-color':"#fff",
'mode':'vertical' 'mode':'vertical',
'@select':"selectItemMenu"
}) })
el-submenu(':index'="index | toString",'@select'="selectItemMenu") el-submenu(':index'="index | toString",'v-for'="(it,index) in currentMenus.children",':key'="it.id",'@click'="choseChildrenItem(it)")
template(slot="title") template(slot="title")
span {{it.name}} span {{it.name}}
template template
el-menu-item(':index'="idx | pipeString(index)",'v-if'="it.children",'v-for'="(i,idx) in it.children",':key'="i.id",'@click'="choseSubChildren(i)") el-menu-item(':index'="idx | pipeString(index)",'v-if'="it.children",'v-for'="(i,idx) in it.children",':key'="i.id",@click="choseSubChildren(i)")
span.menu-item-name {{i.name}} span.menu-item-name {{i.name}}
.arrow-tip(':class'="{'left-l':!sidebarUnfoldInfo,'left-ll':sidebarUnfoldInfo}",'@click'="toggleUnfold()",'v-show'="unfoldBtn") .arrow-tip(':class'="{'left-l':!sidebarUnfoldInfo,'left-ll':sidebarUnfoldInfo}",'@click'="toggleUnfold()",'v-show'="unfoldBtn")
img(class='icon-arrow',':class'="{right:!sidebarUnfoldInfo}","src"='@/assets/images/sidebar/left-arrow-gray.png') img(class='icon-arrow',':class'="{right:!sidebarUnfoldInfo}","src"='@/assets/images/sidebar/left-arrow-gray.png')
...@@ -39,16 +41,22 @@ ...@@ -39,16 +41,22 @@
<script> <script>
import { mapGetters, mapActions } from 'vuex' import { mapGetters, mapActions } from 'vuex'
import sidebarItem from '../sidebarItem' import sidebarItem from '../sidebarItem'
const CrossStorageClient = require('cross-storage').CrossStorageClient;
const crmDomain = location.hostname
const crossStorage = new CrossStorageClient(`${crmDomain}/hub.jsp`, {
timeout: 5000,
frameId: 'storageFrame'
});
const logo = require('@/assets/images/sidebar/logo-blue.png') const logo = require('@/assets/images/sidebar/logo-blue.png')
export default { export default {
data () { data () {
return { return {
currentIndexPath: [1,0],
collapse: false, collapse: false,
currentRouteIndex: 0,
logo, logo,
unfold: false, // 水平展开 // unfold: false, // 水平展开
unfoldBtn: false, // 展开按钮 unfoldBtn: false, // 展开按钮
currentMenusIndex: -1 currentMenusIndex: 2
} }
}, },
filters: { filters: {
...@@ -62,48 +70,83 @@ export default { ...@@ -62,48 +70,83 @@ export default {
components: { components: {
sidebarItem sidebarItem
}, },
mounted () {},
computed: { computed: {
...mapGetters({menus: 'getMenus', sidebarUnfoldInfo: 'getSidebarUnfoldInfo'}), ...mapGetters({
menus: 'getMenus',
project: 'getProjectInfo',
sidebarUnfoldInfo: 'getSidebarUnfoldInfo',
}),
currentMenus: { currentMenus: {
get () { get () {
const currentIndex = this.currentMenusIndex const currentIndex = this.currentMenusIndex
return currentIndex === -1 ? this.getCurrentMenus(0) : this.getCurrentMenus(currentIndex) const currentMenus = currentIndex === -1 ? this.getCurrentMenus(0) : this.getCurrentMenus(currentIndex)
this.$nextTick(() => {
if (this.currentMenus) {
this.handleOpen()
}
})
return currentMenus
} }
} }
}, },
created () { mounted () {
}, },
methods: { methods: {
handleOpen () {
const menus = this.$refs.menu
menus.open(0)
},
/** /**
* 选择边测菜单主菜单 * 选择边测菜单主菜单
*/ */
choseMenu (selectItem, selectItemIndex) { choseMenu (selectItem, selectItemIndex) {
this.currentMenusIndex = selectItemIndex this.currentMenusIndex = selectItemIndex
if (!this.unfold) { if (!this.sidebarUnfoldInfo) {
this.toggleUnfold(true) this.toggleUnfold(true)
} }
}, },
/** /**
* 二级菜单 * 二级菜单
**/ **/
choseChildrenItem (...args) { choseChildrenItem (item) {
console.log('this is sidebar 二级菜单 %o', args) if (item.link) {
this.$router.push({
path: `/${item.link}`
})
}
}, },
/** /**
* 三级菜单 * 三级菜单
* @param args * @param args
**/ **/
selectItemMenu (item) { selectItemMenu (item) {
console.log('this is sidebar 三级菜单 %o', item) console.log(item)
const currentMenusIndex = this.currentMenusIndex
if (currentMenusIndex > -1) {
const [idx1, idx2] = item.split('-').reverse()
const historyItemName = this.menus[currentMenusIndex].children[idx1].children[idx2].name
const time = this.$moment().format('YYYY-MM-DD hh:mm:ss')
const storeId = this.project.store_id
const menuHistoryJson = localStorage.getItem('menuHistoryJson' + storeId) ? JSON.parse(localStorage.getItem('menuHistoryJson' + storeId)) : [];
menuHistoryJson.push({
name: historyItemName,
time,
index:`${currentMenusIndex,idx1,idx2}`
})
localStorage.setItem('menuHistoryJson' + storeId, JSON.stringify(menuHistoryJson))
crossStorage.onConnect().then(function() {
return crossStorage.set('menuHistoryJson' + storeId, JSON.stringify(menuHistoryJson));
})
}
}, },
toggleUnfold (...args) { toggleUnfold (...args) {
if (!args.length) { if (!args.length) {
this.unfold = !this.unfold this.setSidebarUnfold(!this.sidebarUnfoldInfo)
} else { } else {
this.unfold = args[0] this.setSidebarUnfold(args[0])
} }
this.setSidebarUnfold(this.unfold)
}, },
hiddenUnfoldBtn () { hiddenUnfoldBtn () {
this.unfoldBtn = false this.unfoldBtn = false
...@@ -117,7 +160,7 @@ export default { ...@@ -117,7 +160,7 @@ export default {
}) })
}, },
getCurrentMenus (index) { getCurrentMenus (index) {
return this.menus[index] return this.menus[index].item
}, },
...mapActions(['setSidebarUnfold']) ...mapActions(['setSidebarUnfold'])
} }
......
src/main.js
// The Vue build version to load with the `import` command // The Vue build version to load with the `import` command
// (runtime-only or standalone) has been set in webpack.base.conf with an alias. // (runtime-only or standalone) has been set in webpack.base.conf with an alias.
/* @flow */
import Vue from 'vue' import Vue from 'vue'
import App from './App' import App from './App'
import router from './router' import router from './router'
......
src/store/global/index.js
...@@ -12,55 +12,109 @@ const HIDE_EDIT_MENUS = 'HIDE_EDIT_MENUS' ...@@ -12,55 +12,109 @@ const HIDE_EDIT_MENUS = 'HIDE_EDIT_MENUS'
// 边侧菜单 // 边侧菜单
const SIDEBAR_UNFOLD = 'SIDEBAR_UNFOLD' const SIDEBAR_UNFOLD = 'SIDEBAR_UNFOLD'
// 基本信息
const GET_PROJECT_INFO = 'GET_PROJECT_INFO'
const state = { const state = {
menus: [], menus: [],
editMenus: false, editMenus: false,
sidebarUnfold: false // false:边侧菜单收缩, true:边侧菜单展开 projectInfo: null,
currentMenus: [],
sidebarUnfold: true // false:边侧菜单收缩, true:边侧菜单展开
} }
const actions = { const actions = {
async getMenus ({ async getMenus({
commit, dispatch commit, dispatch
}, parmas) { }, parmas) {
let res = await globalApi.getMenus(parmas) let res = await globalApi.getMenus(parmas)
let menus = res.data.data let menus = res.data.data
commit(GET_MEUMS, menus) let menus2 = menus.map((item, index) => {
return {
index,
item: { ...item }
}
})
console.log(menus2)
commit(GET_MEUMS, menus2)
}, },
showEditMenus ({commit}) { showEditMenus({ commit }) {
commit(SHOW_EDIT_MENUS, true) commit(SHOW_EDIT_MENUS, true)
}, },
hideEditMenus ({commit}) { computedSidebarUnfoldRouter({ commit, dispatch }, { route, menus }) {
for (let index = 0; index < menus.length; index++) {
const element = menus[index]
if (element.link === route) {
dispatch('setCurrentMenus', { index: `${index}`, item: element })
break
} else {
for (let i = 0; i < element.length; i++) {
const item = element[i]
if (item.link === route) {
dispatch('setCurrentMenus', { index: `${index}-${i}`, item })
break
} else {
for (let j = 0; j < item.length; j++) {
const it = item[j]
if (it.link === route) {
dispatch('setCurrentMenus', { index: `${index}-${i}-${j}`, item: it })
break
}
}
}
}
}
}
},
hideEditMenus({ commit }) {
commit(HIDE_EDIT_MENUS, false) commit(HIDE_EDIT_MENUS, false)
}, },
setSidebarUnfold ({commit}, type) { setSidebarUnfold({ commit }, type) {
commit(SIDEBAR_UNFOLD, type) commit(SIDEBAR_UNFOLD, type)
},
async getProjectInfo({ commit, dispatch }) {
let res = await globalApi.getProjectInfo()
let projectInfo = res.data
commit(GET_PROJECT_INFO, projectInfo)
} }
} }
const getters = { const getters = {
getMenus (state) { getMenus(state) {
return state.menus return state.menus
}, },
getEditMenus (state) { getEditMenus(state) {
return state.editMenus return state.editMenus
}, },
getSidebarUnfoldInfo (state) { getSidebarUnfoldInfo(state) {
return state.sidebarUnfold return state.sidebarUnfold
},
getProjectInfo(state) {
return state.projectInfo
},
getCurrentMenus(state) {
return state.currentMenus
} }
} }
const mutations = { const mutations = {
[GET_MEUMS] (state, menus) { [GET_MEUMS](state, menus) {
state.menus = menus state.menus = [...menus]
}, },
[SHOW_EDIT_MENUS] (state, status) {
[SHOW_EDIT_MENUS](state, status) {
state.editMenus = status state.editMenus = status
}, },
[HIDE_EDIT_MENUS] (state, status) { [HIDE_EDIT_MENUS](state, status) {
state.editMenus = status state.editMenus = status
}, },
[SIDEBAR_UNFOLD] (state, type) { [SIDEBAR_UNFOLD](state, type) {
state.sidebarUnfold = type state.sidebarUnfold = type
},
[GET_PROJECT_INFO](state, projectInfo) {
state.projectInfo = { ...projectInfo }
} }
} }
......
src/utils/index.js
import date from './moment' export function setCookie(name, value, exptime) {
const ctx = location.hostname
export const M = date var now = new Date()
var time = now.getTime()
var anhour = (exptime + 8) * 3600
time += anhour * 1000
now.setTime(time)
document.cookie = name + '=' + value + ';path=' + ctx + '/;expires=' + now.toUTCString()
}
export function getCookie(name) {
const cArr = document.cookie.split('; ')
for (var i = 0; i < cArr.length; i++) {
let cArr2 = cArr[i].split('=')
if (cArr2[0] === name) {
return cArr2[1]
}
}
return ''
}
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