Skip to content

C
common-templete
Commit 806d3bce by 高淑倩
Options

vuexhistory&&stateMsg

parent 258bb80d
Showing with 252 additions and 167 deletions
src/api/global/index.js
import { Http } from '@/http'
class Global extends Http {
getMenus(params) {
return this.get('getMenus', params)
// return this.get('getMenus', params)
return this.get('securityManage/menuList!menuMapList.do', params)
}
getProjectInfo() {
return this.get('securityManage/menuList!getStoreInfo.do')
}
......
src/components/Header/index.vue
......@@ -16,7 +16,7 @@
popper-class="historys-popper",
trigger="click")
.historys-body
.history-list--item.clearfix(v-for='historyItem in historys ')
.history-list--item.clearfix(v-for='historyItem in menuHistoryJsonTemp')
.name.fl {{historyItem.name}}
.time.fr {{historyItem.time}}
a.link(slot="reference")
......@@ -34,8 +34,8 @@
.opration-list--item.clearfix(v-for='opration in oprations ')
.name.fl(@click="gotoPage(opration.link)") {{opration.name}}
a.link(slot="reference")
img.user-img(':src'="project.user_logo")
span.user-name {{project.StoreShortName}}
img.user-img(':src'="user_logo")
span.user-name {{StoreShortName}}
i.fa.fa-angle-down
li.nav-item.fr
a.link(@click="showMessage()")
......@@ -50,7 +50,7 @@
.helpers-body
.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'})
.name.fl {{help.name}}
.name.fl {{help.name}}
a.link(slot="reference")
i.fa.fa-comments
el-row.meuns-nav(v-show="showMenusPanel")
......@@ -84,6 +84,171 @@
':class':"{ active:formatPathString(index,idx,inx) === currentSelectIndex}"
}) {{i.name}}
</template>
<script>
import {setCookie, getCookie} from '@/utils'
import { mapGetters, mapActions,mapState,mapMutations } from 'vuex'
import message from './message'
import { returnStatement } from 'babel-types';
import { debounce } from 'rxjs/operators';
require('@/lib/slimscroll/slimscroll')
export default {
name: 'headerNav',
data () {
return {
showMenusPanel: false,
showEditMenusPanel: false,
showMessagePanelcontrol: null,
currentIndexPath: [1,2,0],
currentSelectIndex: -1,
StoreShortName: '',
user_logo:'',
historysList: [],
oprations: [{name: '修改密码', link: 'http://www.baidu.com'}, {name: '安全退出', link: 'http://www.baidu.com'}],
helpers: [{
name: '点击联系客服',
link:'http://wpa.qq.com/msgrd?v=3&uin=2844377940&site=qq&menu=yes',
icon: 'fa-qq',
style: {background: '#ff9293', color: '#fff'}
}, {name: '使用帮助',
link:'http://help.bigaka.com/',
style: {background: '#40b0ff', color: '#fff'},
icon: 'fa-info'},
{name: '舞象客服',
link:'http://help.bigaka.com/',
style: {background: '#e0e0e0', color: '#000'},
icon: 'fa-user-circle-o'}],
// 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: []
}
},
filters: {
limit (array, num) {
if (num) {
return array
}
return array.slice(0, num)
},
pipeString (...args) {
return args.join('-')
}
},
props: ['icon', 'link', 'type', 'id', 'sort', 'name', 'pid', 'grade'],
computed: {
historysLimit () {
let historys = [...this.menuHistoryJsonTemp]
return historys.length > 5 ? historys.slice(0, 5) : historys
},
...mapState(['global', 'headerHistory', 'menuHistoryJson', 'sidebarUnfold']),
menuHistoryJsonTemp(){
let list = []
// 拿到 storeId
const storeId = this.project && this.project.data.userDto.storeUserInfo.storeId
// 拿到 localstorage的
const local = localStorage.getItem('menuHistoryJson' + storeId)
// 拿到 vuex的
const vuexList = this.global.menuHistoryJson.value
// 如果不是数组转为数组
const ls = Array.isArray(vuexList) ? vuexList : JSON.parse(vuexList)
// vuex 有的话先从 vuex 取
return ls.length? ls : local ? JSON.parse(local) : []
// if(ls.length){
// list = ls
// }else if(local){
// // 从local取
// list = JSON.parse(local)
// }
// return list
},
...mapGetters({
project: 'getProjectInfo',
menus: 'getMenus',
editMenus: 'getEditMenus',
sidebarUnfoldInfo: 'getSidebarUnfoldInfo'
})
},
components: {
message
},
mounted () {
const index = getCookie('cur_menu_index')
const indexPath = index.split(',').reverse()
this.currentSelectIndex = indexPath[1]
// 商户信息
if(this.project&&this.project.data){
this.StoreShortName = this.project.data.userDto.storeUserInfo.loginName
if(!this.project.data.userDto.storeUserInfo.imageDomain) {
this.user_logo = 'http://photoshop.bigaka.com/photos/default/default_logo.jpg'
} else {
this.user_logo = this.project.data.userDto.storeUserInfo.imageDomain
}
}
},
methods: {
...mapActions([
'showEditMenus',
'hideEditMenus'
]),
clickItem () {
console.log('this is header index %o', this)
},
showMessage () {
if (this.showMessagePanelcontrol) {
this.showMessagePanelcontrol.close()
this.showMessagePanelcontrol = null
} else {
const h = this.$createElement
this.showMessagePanelcontrol = this.$notify({
title: '消息中心',
message: h('message'),
duration: 0,
onClose: () => {
this.showMessagePanelcontrol = null
},
customClass: 'message-panel'
})
}
},
handleOpen () {},
handleClose () {},
handleShowMenus () {
this.showMenusPanel = !this.showMenusPanel
},
toggleMenus (...args) {
console.log('this is header toggleMenus %o', args)
},
handleEditMenus () {
if (!this.editMenus) {
this.showEditMenus()
} else {
this.hideEditMenus()
}
},
setActiveStyle (item, ev) {
this.currentSelectIndex = ev.index
console.log('this is header setActiveStyle %o', item)
},
formatPathString (...args) {
return args.join('-')
},
handlerHelperClick (item) {
this.$router.push({
path: `/${item.link}`
})
},
gotoPage (link) {
this.$router.push({
path: `/${link}`
})
}
}
}
</script>
<style lang="stylus">
.header-container
position fixed
......@@ -216,6 +381,11 @@
&:hover,
&:focus
background none
.history-list--item
padding 12px 20px !important
display inline-block !important
.time
text-align right
.history-list--item,
.helper-list--item,
.opration-list--item
......@@ -277,134 +447,3 @@
}
}
</style>
<script>
import {setCookie, getCookie} from '@/utils'
import { mapGetters, mapActions } from 'vuex'
import message from './message'
require('@/lib/slimscroll/slimscroll')
export default {
name: 'headerNav',
data () {
return {
showMenusPanel: false,
showEditMenusPanel: false,
showMessagePanelcontrol: null,
currentIndexPath: [1,2,0],
currentSelectIndex: -1,
oprations: [{name: '修改密码', link: 'http://www.baidu.com'}, {name: '安全退出', link: 'http://www.baidu.com'}],
helpers: [{
name: '点击联系客服',
link:'http://wpa.qq.com/msgrd?v=3&uin=2844377940&site=qq&menu=yes',
icon: 'fa-qq',
style: {background: '#ff9293', color: '#fff'}
}, {name: '使用帮助',
link:'http://help.bigaka.com/',
style: {background: '#40b0ff', color: '#fff'},
icon: 'fa-info'},
{name: '舞象客服',
link:'http://help.bigaka.com/',
style: {background: '#e0e0e0', color: '#000'},
icon: 'fa-user-circle-o'}],
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'}]
}
},
filters: {
limit (array, num) {
if (num) {
return array
}
return array.slice(0, num)
},
pipeString (...args) {
return args.join('-')
}
},
props: ['icon', 'link', 'type', 'id', 'sort', 'name', 'pid', 'grade'],
computed: {
historysLimit () {
let historys = this.historys
if (historys.length > 5) {
return historys.slice(0, 5)
} else {
return [...historys]
}
},
...mapGetters({
project: 'getProjectInfo',
menus: 'getMenus',
editMenus: 'getEditMenus',
sidebarUnfoldInfo: 'getSidebarUnfoldInfo'
})
},
components: {
message
},
mounted () {
const index = getCookie('cur_menu_index')
const indexPath = index.split(',').reverse()
this.currentSelectIndex = indexPath[1]
},
methods: {
...mapActions([
'showEditMenus',
'hideEditMenus'
]),
clickItem () {
console.log('this is header index %o', this)
},
showMessage () {
if (this.showMessagePanelcontrol) {
this.showMessagePanelcontrol.close()
this.showMessagePanelcontrol = null
} else {
const h = this.$createElement
this.showMessagePanelcontrol = this.$notify({
title: '消息中心',
message: h('message'),
duration: 0,
onClose: () => {
this.showMessagePanelcontrol = null
},
customClass: 'message-panel'
})
}
},
handleOpen () {},
handleClose () {},
handleShowMenus () {
this.showMenusPanel = !this.showMenusPanel
},
toggleMenus (...args) {
console.log('this is header toggleMenus %o', args)
},
handleEditMenus () {
if (!this.editMenus) {
this.showEditMenus()
} else {
this.hideEditMenus()
}
},
setActiveStyle (item, ev) {
this.currentSelectIndex = ev.index
console.log('this is header setActiveStyle %o', item)
},
formatPathString (...args) {
return args.join('-')
},
handlerHelperClick (item) {
this.$router.push({
path: `/${item.link}`
})
},
gotoPage (link) {
this.$router.push({
path: `/${link}`
})
}
}
}
</script>
src/components/Sidebar/index.vue
......@@ -41,6 +41,7 @@
import { mapGetters, mapActions } from 'vuex'
import { calcIndexPathByCurrentRouter } from '@/utils'
import sidebarItem from '../sidebarItem'
const CrossStorageClient = require('cross-storage').CrossStorageClient
const crmDomain = location.hostname
const crossStorage = new CrossStorageClient(`${crmDomain}/hub.jsp`, {
......@@ -48,6 +49,7 @@ const crossStorage = new CrossStorageClient(`${crmDomain}/hub.jsp`, {
frameId: 'storageFrame',
})
const logo = require('@/assets/images/sidebar/logo-blue.png')
export default {
data() {
return {
......@@ -85,16 +87,12 @@ export default {
methods: {
handleOpen() {
const currentIndexPath = [this.firstIndex, this.secondIndex, this.thirdIndex]
console.log(currentIndexPath)
const menus = this.$refs.menu
console.log(menus)
this.$nextTick(() => {
if (currentIndexPath.join('-') === this.currentPath.join('-')) {
menus.open(this.secondIndex)
console.log('open')
} else {
menus.close(this.secondIndex)
console.log('close')
}
})
},
......@@ -106,9 +104,7 @@ export default {
* 选择边测菜单主菜单
*/
choseMenu(selectItem, selectItemIndex) {
console.log('--', selectItem, selectItemIndex)
this.firstIndex = selectItemIndex
console.log('current', this.firstIndex)
if (!this.sidebarUnfoldInfo) {
this.toggleUnfold(true)
}
......@@ -118,9 +114,9 @@ export default {
**/
choseChildrenItem(item) {
if (item.link) {
this.$router.push({
path: `/${item.link}`,
})
// this.$router.push({
// path: `/${item.link}`,
// })
}
},
/**
......@@ -128,29 +124,45 @@ export default {
* @param args
**/
selectItemMenu(item) {
console.log(item)
const firstIndex = this.firstIndex
if (firstIndex > -1) {
const [idx1, idx2] = item.split('-').reverse()
const historyItemName = this.menus[firstIndex].children[idx1].children[idx2].name
const [idx1, idx2] = item.split('-').reverse()
const historyIndex = (firstIndex + '' + idx1 + '' + idx2 + '').split('').join(',')
const historyItemName = this.menus[firstIndex].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({
const storeId = this.project.data.userDto.storeUserInfo.storeId
const menuHistoryJson = localStorage.getItem('menuHistoryJson' + storeId) ? JSON.parse(localStorage.getItem('menuHistoryJson' + storeId)): []
// 1.相同不添加 2.相同提到最前面
menuHistoryJson.forEach((item,i)=> {
if(item.index === historyIndex){
menuHistoryJson.splice(i, 1);
return false;
}
})
// 开头添加
menuHistoryJson.unshift({
name: historyItemName,
index: historyIndex,
time,
index: `${(firstIndex, idx1, idx2)}`,
})
localStorage.setItem('menuHistoryJson' + storeId, JSON.stringify(menuHistoryJson))
})
let list = [...menuHistoryJson]
if (list.length > 15) {
list = list.slice(0, 15)
}
this.$store.commit('MENU_HISTORY_JSON', {
name:'menuHistoryJson' + storeId,
value: JSON.stringify(list)
})
localStorage.setItem('menuHistoryJson' + storeId, JSON.stringify(list))
crossStorage.onConnect().then(function() {
return crossStorage.set('menuHistoryJson' + storeId, JSON.stringify(menuHistoryJson))
return crossStorage.set('menuHistoryJson' + storeId, JSON.stringify(list))
})
}
},
toggleUnfold(...args) {
console.log(args)
if (!args.length) {
this.setSidebarUnfold(!this.sidebarUnfoldInfo)
} else {
......@@ -164,9 +176,9 @@ export default {
this.unfoldBtn = true
},
choseSubChildren(item) {
this.$router.push({
path: `/${item.link}`,
})
// this.$router.push({
// path: `/${item.link}`,
// })
},
getCurrentMenus(index) {
return this.menus[index]
......
src/http/index.js
......@@ -31,9 +31,9 @@ axios.interceptors.response.use(function (response) {
const api = axios.create({
baseURL: config.base
})
const mockApi = axios.create({
baseURL: 'http://rap2api.taobao.org/app/mock/115626/'
// baseURL: 'http://rap2api.taobao.org/app/mock/115626/'
baseURL: 'http://testcenter.bigaka.net/b/'
})
api.interceptors.request.use(function (config) {
......
src/pages/addmarketing/components/StepInfo.vue
......@@ -5,7 +5,7 @@
<span class="gray"><span class="star-red">*</span> 推送名称仅供数据中心操作记录查询，您推送的会员将不会看到此信息。</span>
</el-form-item>
<el-form-item label="推送名称">
<el-input v-model.trim="form.name" placeholder="请输入推送名称，10字以内"></el-input>
<el-input v-model.trim="form.name" maxlength="10" placeholder="请输入推送名称，10字以内"></el-input>
</el-form-item>
<el-form-item label="选择推送素材" class="step-choose">
<span class="gray"><span class="star-red">*</span> 推送素材需前往<a href="#">微信公众平台</a>-管理-素材管理维护。</span>
......
src/pages/marketingCenter/components/PushDetail.vue
......@@ -22,7 +22,7 @@
</span>
<span class="detail-title result-add">推送成功:</span> {{item.sentCount}}
</span>
<span v-if="item.status !== -1 && item.status !==0 && item.status !==1" class="detail-title">失败原因: {{item.status}}</span>
<span v-if="item.status === -1" class="detail-title">失败原因: <span style="color:red">{{item.statusMsg}}</span> </span>
<el-button class="fr" slot="reference" v-if="item.scope === 0">全体推送</el-button>
<el-popover placement="right" title="标签" width="200" trigger="click" v-if="item.scope === 1">
<div>
......
src/store/global/index.js
......@@ -19,12 +19,21 @@ const GET_PROJECT_INFO = 'GET_PROJECT_INFO'
//
const CALC_TOUTER_INDEX = 'CALC_TOUTER_INDEX'
const HEADER_HISTORY = 'HEADER_HISTORY'
const MENU_HISTORY_JSON = 'MENU_HISTORY_JSON'
const state = {
menus: [],
editMenus: false,
projectInfo: null,
currentPath: [],
sidebarUnfold: true // false:边侧菜单收缩, true:边侧菜单展开
sidebarUnfold: true, // false:边侧菜单收缩, true:边侧菜单展开
headerHistory: [],
menuHistoryJson: {
name: '',
value: []
}
}
const actions = {
......@@ -83,6 +92,31 @@ const getters = {
}
const mutations = {
[MENU_HISTORY_JSON](state, history) {
const {name, value} = history
// 判断是否是数组
let list = Array.isArray(value) ? value : JSON.parse(value)
// 取前15条
if (list.length > 15) {
list = list.slice(0, 15)
}
state.menuHistoryJson = {
name,
value: list
}
// 存入localStorage
localStorage.setItem(name, list)
},
[HEADER_HISTORY](state, history) {
state.headerHistory = [...history]
try {
if (localStorage.history) {
localStorage.history = history
}
} catch (error) {
}
},
[GET_MEUMS](state, menus) {
state.menus = [...menus]
},
......
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