dai
3 years ago
9 changed files with 781 additions and 750 deletions
@ -1,49 +0,0 @@ |
|||
import Vue from 'vue' |
|||
import Vuex from 'vuex' |
|||
import cloneDeep from 'lodash/cloneDeep' |
|||
import user from './modules/user' |
|||
|
|||
Vue.use(Vuex) |
|||
|
|||
export default new Vuex.Store({ |
|||
namespaced: true, |
|||
state: { |
|||
// 导航条, 布局风格, defalut(白色) / colorful(鲜艳)
|
|||
navbarLayoutType: 'colorful', |
|||
// 侧边栏, 布局皮肤, default(白色) / dark(黑色)
|
|||
sidebarLayoutSkin: 'dark', |
|||
// 侧边栏, 折叠状态
|
|||
sidebarFold: false, |
|||
// 侧边栏, 菜单
|
|||
sidebarMenuList: [], |
|||
sidebarMenuActiveName: '', |
|||
// 内容, 是否需要刷新
|
|||
contentIsNeedRefresh: false, |
|||
// 内容, 标签页(默认添加首页)
|
|||
contentTabs: [ |
|||
{ |
|||
...window.SITE_CONFIG['contentTabDefault'], |
|||
'name': 'indexWork', |
|||
'title': '首页' |
|||
} |
|||
], |
|||
contentTabsActiveName: 'indexWork', |
|||
|
|||
mainShuju: { |
|||
menuList: [], |
|||
activeName: "", |
|||
}, |
|||
}, |
|||
modules: { |
|||
user |
|||
|
|||
}, |
|||
mutations: { |
|||
// 重置vuex本地储存状态
|
|||
resetStore (state) { |
|||
Object.keys(state).forEach((key) => { |
|||
state[key] = cloneDeep(window.SITE_CONFIG['storeState'][key]) |
|||
}) |
|||
} |
|||
} |
|||
}) |
|||
@ -1,8 +0,0 @@ |
|||
export default { |
|||
state: { |
|||
id: 0, |
|||
name: '', |
|||
realName: '', |
|||
superAdmin: 0 |
|||
} |
|||
} |
|||
@ -1,184 +1,176 @@ |
|||
|
|||
export function pieOption (_charts) { |
|||
const center= ['50%', '170px'] |
|||
return { |
|||
title: { |
|||
text: '0', |
|||
top: 140, |
|||
left: 'center', |
|||
textStyle: { |
|||
width: '100%', |
|||
fontSize: 32, |
|||
color: '#FFFFFF', |
|||
fontWeight: 400 |
|||
}, |
|||
itemGap: 5, |
|||
subtext: '总数', |
|||
subtextStyle: { |
|||
fontSize: 20, |
|||
color: '#fff', |
|||
fontWeight: 400 |
|||
} |
|||
export function pieOption(_charts) { |
|||
const center = ["50%", "170px"]; |
|||
return { |
|||
title: { |
|||
text: "0", |
|||
top: 140, |
|||
left: "center", |
|||
textStyle: { |
|||
width: "100%", |
|||
fontSize: 32, |
|||
color: "#FFFFFF", |
|||
fontWeight: 400, |
|||
}, |
|||
tooltip: { |
|||
show: false |
|||
itemGap: 5, |
|||
subtext: "总数", |
|||
subtextStyle: { |
|||
fontSize: 20, |
|||
color: "#fff", |
|||
fontWeight: 400, |
|||
}, |
|||
// legend: {
|
|||
// top: 350,
|
|||
// bottom: 0,
|
|||
// itemWidth: 20,
|
|||
// itemHeight: 10,
|
|||
// textStyle: {
|
|||
// color: '#D2E7FF',
|
|||
// fontSize: 16,
|
|||
// lineHeight: 20,
|
|||
}, |
|||
tooltip: { |
|||
show: false, |
|||
}, |
|||
// legend: {
|
|||
// top: 350,
|
|||
// bottom: 0,
|
|||
// itemWidth: 20,
|
|||
// itemHeight: 10,
|
|||
// textStyle: {
|
|||
// color: '#D2E7FF',
|
|||
// fontSize: 16,
|
|||
// lineHeight: 20,
|
|||
// },
|
|||
|
|||
// },
|
|||
series: [ |
|||
// 外侧圆环
|
|||
{ |
|||
type: "pie", |
|||
// 起始刻度的角度，默认为 90 度，即圆心的正上方。0 度为圆心的正右方。
|
|||
startAngle: 0, |
|||
hoverAnimation: false, |
|||
// tooltip: {
|
|||
// },
|
|||
|
|||
// },
|
|||
series: [ |
|||
// 外侧圆环
|
|||
{ |
|||
type: 'pie', |
|||
// 起始刻度的角度，默认为 90 度，即圆心的正上方。0 度为圆心的正右方。
|
|||
startAngle: 0, |
|||
hoverAnimation: false, |
|||
// tooltip: {
|
|||
// },
|
|||
center: center, |
|||
radius: ['58%', '58.3%'], |
|||
label: { |
|||
normal: { |
|||
show: false |
|||
} |
|||
center: center, |
|||
radius: ["58%", "58.3%"], |
|||
label: { |
|||
normal: { |
|||
show: false, |
|||
}, |
|||
labelLine: { |
|||
normal: { |
|||
show: false |
|||
} |
|||
}, |
|||
labelLine: { |
|||
normal: { |
|||
show: false, |
|||
}, |
|||
data: [{ |
|||
}, |
|||
data: [ |
|||
{ |
|||
value: 360, |
|||
itemStyle: { |
|||
normal: { |
|||
color: 'rgba(40, 101, 250, 0)', |
|||
width:0, |
|||
borderColor: 'rgba(40, 101, 250, 0.5)', |
|||
color: "rgba(40, 101, 250, 0)", |
|||
width: 0, |
|||
borderColor: "rgba(40, 101, 250, 0.5)", |
|||
borderWidth: 1, |
|||
borderType: 'dotted' |
|||
} |
|||
} |
|||
} |
|||
] |
|||
}, |
|||
|
|||
// 突出的
|
|||
{ |
|||
hoverAnimation: false, |
|||
// name: 'Access From',
|
|||
type: 'pie', |
|||
center: center, |
|||
radius: ['35%', '48%'], |
|||
avoidLabelOverlap: false, |
|||
// top: top + '%',
|
|||
// height: '80%',
|
|||
selectedMode: 'single', |
|||
left: 'center', |
|||
width: 400, |
|||
label: { |
|||
// show: false,
|
|||
position: 'outside', |
|||
alignTo: 'edge', |
|||
// formatter: '{a|{c}}\n\n{name|{b}}',
|
|||
formatter: '{a|{c}%}\n{r|}\n{name|{b}}', |
|||
minMargin: 5, |
|||
edgeDistance: 1, |
|||
lineHeight: 15, |
|||
color: '#fff', |
|||
fontSize: 12, |
|||
// distanceToLabelLine: -60,
|
|||
rich: { |
|||
name: { |
|||
padding: [0, 6, 0, 6] |
|||
borderType: "dotted", |
|||
}, |
|||
a: { |
|||
fontSize: 30, |
|||
color: '#fff', |
|||
padding: [0, 6, 6, 6] |
|||
}, |
|||
r: { |
|||
backgroundColor: 'auto', |
|||
borderRadius: 6, |
|||
width: 6, |
|||
height: 6, |
|||
// padding: [3, 3, 0, -12]
|
|||
} |
|||
} |
|||
}, |
|||
}, |
|||
labelLine: { |
|||
show: false, |
|||
smooth: 0.2, |
|||
length: 30, |
|||
length2: 0, |
|||
maxSurfaceAngle: 80 |
|||
], |
|||
}, |
|||
|
|||
// 突出的
|
|||
{ |
|||
hoverAnimation: false, |
|||
// name: 'Access From',
|
|||
type: "pie", |
|||
center: center, |
|||
radius: ["35%", "48%"], |
|||
avoidLabelOverlap: false, |
|||
// top: top + '%',
|
|||
// height: '80%',
|
|||
selectedMode: "single", |
|||
left: "center", |
|||
width: 400, |
|||
label: { |
|||
// show: false,
|
|||
position: "outside", |
|||
alignTo: "edge", |
|||
// formatter: '{a|{c}}\n\n{name|{b}}',
|
|||
formatter: "{a|{c}%}\n{r|}\n{name|{b}}", |
|||
minMargin: 5, |
|||
edgeDistance: 1, |
|||
lineHeight: 15, |
|||
color: "#fff", |
|||
fontSize: 12, |
|||
// distanceToLabelLine: -60,
|
|||
rich: { |
|||
name: { |
|||
padding: [0, 6, 0, 6], |
|||
}, |
|||
a: { |
|||
fontSize: 30, |
|||
color: "#fff", |
|||
padding: [0, 6, 6, 6], |
|||
}, |
|||
r: { |
|||
backgroundColor: "auto", |
|||
borderRadius: 6, |
|||
width: 6, |
|||
height: 6, |
|||
// padding: [3, 3, 0, -12]
|
|||
}, |
|||
}, |
|||
labelLayout: function (params) { |
|||
|
|||
const isLeft = params.labelRect.x < _charts.getWidth() / 2; |
|||
const points = params.labelLinePoints; |
|||
// Update the end point.
|
|||
if (points) { |
|||
points[2][0] = isLeft |
|||
}, |
|||
labelLine: { |
|||
show: false, |
|||
smooth: 0.2, |
|||
length: 30, |
|||
length2: 0, |
|||
maxSurfaceAngle: 80, |
|||
}, |
|||
labelLayout: function (params) { |
|||
const isLeft = params.labelRect.x < _charts.getWidth() / 2; |
|||
const points = params.labelLinePoints; |
|||
// Update the end point.
|
|||
if (points) { |
|||
points[2][0] = isLeft |
|||
? params.labelRect.x |
|||
: params.labelRect.x + params.labelRect.width; |
|||
} |
|||
|
|||
return { |
|||
labelLinePoints: points |
|||
}; |
|||
}, |
|||
itemStyle: { |
|||
color:function(params) { |
|||
} |
|||
|
|||
return { |
|||
labelLinePoints: points, |
|||
}; |
|||
}, |
|||
itemStyle: { |
|||
color: function (params) { |
|||
//自定义颜色
|
|||
var colorList = [ '#FAC126', '#3DDA83']; |
|||
return colorList[params.dataIndex] |
|||
} |
|||
var colorList = ["#FAC126", "#3DDA83"].reverse(); |
|||
return colorList[params.dataIndex]; |
|||
}, |
|||
data: [], |
|||
|
|||
}, |
|||
// 中间圆环
|
|||
{ |
|||
type: 'pie', |
|||
// 起始刻度的角度，默认为 90 度，即圆心的正上方。0 度为圆心的正右方。
|
|||
startAngle: 0, |
|||
hoverAnimation: false, |
|||
center: center, |
|||
// tooltip: {
|
|||
// },
|
|||
radius: ['0%', '25%'], |
|||
label: { |
|||
|
|||
show: false |
|||
|
|||
}, |
|||
labelLine: { |
|||
|
|||
show: false |
|||
|
|||
data: [], |
|||
}, |
|||
// 中间圆环
|
|||
{ |
|||
type: "pie", |
|||
// 起始刻度的角度，默认为 90 度，即圆心的正上方。0 度为圆心的正右方。
|
|||
startAngle: 0, |
|||
hoverAnimation: false, |
|||
center: center, |
|||
// tooltip: {
|
|||
// },
|
|||
radius: ["0%", "25%"], |
|||
label: { |
|||
show: false, |
|||
}, |
|||
labelLine: { |
|||
show: false, |
|||
}, |
|||
data: [ |
|||
{ |
|||
value: 360, |
|||
itemStyle: { |
|||
normal: { |
|||
color: "rgba(8, 37, 134, 1)", |
|||
}, |
|||
}, |
|||
data: [{ |
|||
value: 360, |
|||
itemStyle: { |
|||
normal: { |
|||
color: 'rgba(8, 37, 134, 1)', |
|||
|
|||
} |
|||
} |
|||
} |
|||
] |
|||
}, |
|||
] |
|||
|
|||
} |
|||
} |
|||
|
|||
], |
|||
}, |
|||
], |
|||
}; |
|||
} |
|||
|
|||
Loading…
Reference in new issue