| | |
| | | function bottomOption(data) { |
| | | let option = { |
| | | title: { |
| | | text: "公司运营趋势", |
| | | // title: { |
| | | // text: "公司运营趋势", |
| | | // textStyle: { |
| | | // color: "#fff" |
| | | // } |
| | | // }, |
| | | color: [ |
| | | "#73c0de", |
| | | |
| | | "#fac858", |
| | | "#91cc75", |
| | | "#3ba272", |
| | | "#fc8452", |
| | | "#9a60b4", |
| | | "#3fb1e3", |
| | | "#6be6c1", |
| | | "#626c91", |
| | | "#a0a7e6", |
| | | "#c4ebad", |
| | | "#96dee8" |
| | | ], |
| | | grid: { |
| | | top: "10%", |
| | | left: "3%", |
| | | right: "4%", |
| | | bottom: "15%", |
| | | containLabel: true |
| | | }, |
| | | legend: { |
| | | data: ["趋势"], |
| | | bottom: "0%", |
| | | textStyle: { |
| | | color: "#fff" |
| | | } |
| | | }, |
| | | tooltip: { |
| | | trigger: "item" |
| | | }, |
| | | xAxis: { |
| | | type: "category", |
| | |
| | | ] |
| | | }, |
| | | yAxis: { |
| | | name: "(%)", |
| | | type: "value", |
| | | axisLabel: { |
| | | color: "#fff" |
| | |
| | | }, |
| | | series: [ |
| | | { |
| | | data: [820, 932, 901, 934, 1290, 1330, 1320, 132, 1111, 321, 342, 134], |
| | | name: "趋势", |
| | | data: [10, 30, 20, 50, 10, 40, 32, 13, 21, 12, 25, 11], |
| | | type: "line", |
| | | smooth: true, |
| | | areaStyle: {} |
| | |
| | | } |
| | | function middleOption1(data) { |
| | | let option = { |
| | | title: { |
| | | text: "公司保安类数据对比", |
| | | textStyle: { |
| | | color: "#fff" |
| | | } |
| | | }, |
| | | // title: { |
| | | // text: "公司保安类数据对比", |
| | | // textStyle: { |
| | | // color: "#fff" |
| | | // } |
| | | // }, |
| | | tooltip: { |
| | | trigger: "axis" |
| | | }, |
| | |
| | | "持证保安数", |
| | | "过考保安数", |
| | | "缴纳社保保安数", |
| | | "缴纳社保数" |
| | | "保安派遣" |
| | | ], |
| | | bottom: "2%", |
| | | bottom: "0%", |
| | | textStyle: { |
| | | color: "#fff" |
| | | } |
| | | }, |
| | | color: [ |
| | | "#73c0de", |
| | | |
| | | "#fac858", |
| | | "#91cc75", |
| | | "#3ba272", |
| | | "#fc8452", |
| | | "#9a60b4", |
| | | "#3fb1e3", |
| | | "#6be6c1", |
| | | "#626c91", |
| | | "#a0a7e6", |
| | | "#c4ebad", |
| | | "#96dee8" |
| | | ], |
| | | grid: { |
| | | top: "10%", |
| | | left: "3%", |
| | | right: "2%", |
| | | bottom: "15%", |
| | | containLabel: true |
| | | }, |
| | | xAxis: { |
| | | type: "category", |
| | | boundaryGap: true, |
| | | axisLabel: { |
| | | color: "#fff" |
| | | }, |
| | | data: [ |
| | | "一月", |
| | | "二月", |
| | | "三月", |
| | | "四月", |
| | | "五月", |
| | | "六月", |
| | | "七月", |
| | | "八月", |
| | | "九月", |
| | | "十月", |
| | | "十一月", |
| | | "十二月" |
| | | ] |
| | | }, |
| | | yAxis: { |
| | | type: "value", |
| | | axisLabel: { |
| | | color: "#fff" |
| | | } |
| | | }, |
| | | series: [ |
| | | { |
| | | name: "总保安数", |
| | | type: "bar", |
| | | barWidth: 9, |
| | | data: [120, 132, 101, 134, 90, 230, 210, 214, 123, 22, 132, 321] |
| | | }, |
| | | { |
| | | name: "正常保安数", |
| | | type: "bar", |
| | | barWidth: 9, |
| | | data: [220, 182, 191, 234, 290, 330, 310, 111, 222, 132, 143, 123] |
| | | }, |
| | | { |
| | | name: "持证保安数", |
| | | type: "bar", |
| | | barWidth: 9, |
| | | data: [150, 232, 201, 154, 190, 330, 410, 132, 111, 222, 132, 43] |
| | | }, |
| | | { |
| | | name: "过考保安数", |
| | | type: "bar", |
| | | barWidth: 9, |
| | | data: [320, 332, 301, 334, 390, 330, 320, 233, 123, 432, 122, 11] |
| | | }, |
| | | { |
| | | name: "缴纳社保保安数", |
| | | type: "bar", |
| | | barWidth: 9, |
| | | data: [120, 132, 101, 134, 120, 130, 132, 222, 111, 123, 341, 123] |
| | | }, |
| | | { |
| | | name: "保安派遣", |
| | | type: "bar", |
| | | barWidth: 9, |
| | | data: [120, 132, 101, 134, 1210, 130, 120, 22, 123, 33, 21, 13] |
| | | } |
| | | ] |
| | | }; |
| | | return option; |
| | | } |
| | | function middleOption2(data) { |
| | | let option = { |
| | | // title: { |
| | | // text: "服务客户", |
| | | // textStyle: { |
| | | // color: "#fff" |
| | | // } |
| | | // }, |
| | | tooltip: { |
| | | trigger: "axis", |
| | | axisPointer: { |
| | | type: "shadow" |
| | | } |
| | | }, |
| | | legend: { |
| | | data: ["客户数"], |
| | | bottom: "0%", |
| | | textStyle: { |
| | | color: "#fff" |
| | | } |
| | | }, |
| | | color: [ |
| | | "#73c0de", |
| | | |
| | | "#fac858", |
| | | "#91cc75", |
| | | "#3ba272", |
| | | "#fc8452", |
| | | "#9a60b4", |
| | | "#3fb1e3", |
| | | "#6be6c1", |
| | | "#626c91", |
| | | "#a0a7e6", |
| | | "#c4ebad", |
| | | "#96dee8" |
| | | ], |
| | | grid: { |
| | | top: "10%", |
| | | left: "10%", |
| | | right: "2%", |
| | | bottom: "22%", |
| | | containLabel: false |
| | | }, |
| | | xAxis: { |
| | | type: "category", |
| | | boundaryGap: true, |
| | | axisLabel: { |
| | | color: "#fff", |
| | | interval: 0 |
| | | }, |
| | | data: [ |
| | | "一月", |
| | | "二月", |
| | | "三月", |
| | | "四月", |
| | | "五月", |
| | | "六月", |
| | | "七月", |
| | | "八月", |
| | | "九月", |
| | | "十月", |
| | | "十一月", |
| | | "十二月" |
| | | ] |
| | | }, |
| | | yAxis: { |
| | | type: "value", |
| | | |
| | | axisLabel: { |
| | | color: "#fff" |
| | | } |
| | | }, |
| | | series: [ |
| | | { |
| | | name: "客户数", |
| | | type: "bar", |
| | | data: [231, 123, 441, 123, 321, 333, 111, 221, 332, 442, 132, 51] |
| | | } |
| | | ] |
| | | }; |
| | | return option; |
| | | } |
| | | |
| | | function economicMiddle(data) { |
| | | let option = { |
| | | tooltip: { |
| | | trigger: "axis" |
| | | }, |
| | | legend: { |
| | | data: ["缴纳社保人数", "公司派遣人数"], |
| | | bottom: "0%", |
| | | textStyle: { |
| | | color: "#fff" |
| | | } |
| | | }, |
| | | color: [ |
| | | "#73c0de", |
| | | |
| | | "#fac858", |
| | | "#91cc75", |
| | | "#3ba272", |
| | | "#fc8452", |
| | | "#9a60b4", |
| | | "#3fb1e3", |
| | | "#6be6c1", |
| | | "#626c91", |
| | | "#a0a7e6", |
| | | "#c4ebad", |
| | | "#96dee8" |
| | | ], |
| | | grid: { |
| | | top: "10%", |
| | | left: "5%", |
| | | right: "4%", |
| | | bottom: "15%", |
| | | containLabel: true |
| | |
| | | }, |
| | | series: [ |
| | | { |
| | | name: "总保安数", |
| | | name: "缴纳社保人数", |
| | | type: "line", |
| | | stack: "总量", |
| | | data: [120, 132, 101, 134, 90, 230, 210, 214, 123, 22, 132, 321] |
| | | }, |
| | | { |
| | | name: "正常保安数", |
| | | name: "公司派遣人数", |
| | | type: "line", |
| | | stack: "总量", |
| | | data: [220, 182, 191, 234, 290, 330, 310, 111, 222, 132, 143, 123] |
| | | }, |
| | | { |
| | | name: "持证保安数", |
| | | type: "line", |
| | | stack: "总量", |
| | | data: [150, 232, 201, 154, 190, 330, 410, 132, 111, 222, 132, 43] |
| | | }, |
| | | { |
| | | name: "过考保安数", |
| | | type: "line", |
| | | stack: "总量", |
| | | data: [320, 332, 301, 334, 390, 330, 320, 233, 123, 432, 122, 11] |
| | | }, |
| | | { |
| | | name: "缴纳社保保安数", |
| | | type: "line", |
| | | stack: "总量", |
| | | data: [120, 132, 101, 134, 120, 130, 132, 222, 111, 123, 341, 123] |
| | | }, |
| | | { |
| | | name: "缴纳社保数", |
| | | type: "line", |
| | | stack: "总量", |
| | | data: [120, 132, 101, 134, 1210, 130, 120, 22, 123, 33, 21, 13] |
| | | } |
| | | ] |
| | | }; |
| | | return option; |
| | | } |
| | | function middleOption2(data) { |
| | | function economicPieOption() { |
| | | let title = "总"; |
| | | let total = "111"; |
| | | let option = { |
| | | title: { |
| | | text: "服务客户", |
| | | textStyle: { |
| | | color: "#fff" |
| | | title: [ |
| | | { |
| | | text: "{name|" + title + "}\n{val|" + total + "}", |
| | | top: "center", |
| | | left: "center", |
| | | textStyle: { |
| | | rich: { |
| | | name: { |
| | | fontSize: 14, |
| | | fontWeight: "normal", |
| | | color: "#fff", |
| | | padding: [10, 0] |
| | | }, |
| | | val: { |
| | | fontSize: 20, |
| | | fontWeight: "bold", |
| | | color: "#fff" |
| | | } |
| | | } |
| | | } |
| | | } |
| | | }, |
| | | ], |
| | | tooltip: { |
| | | trigger: "axis", |
| | | axisPointer: { |
| | | type: "shadow" |
| | | } |
| | | trigger: "item" |
| | | }, |
| | | legend: { |
| | | data: ["客户数"], |
| | | bottom: "5%", |
| | | bottom: "0%", |
| | | left: "center", |
| | | textStyle: { |
| | | color: "#fff" |
| | | } |
| | | }, |
| | | grid: { |
| | | left: "3%", |
| | | right: "4%", |
| | | bottom: "7%", |
| | | containLabel: true |
| | | }, |
| | | xAxis: { |
| | | type: "value", |
| | | boundaryGap: [0, 0.01], |
| | | axisLabel: { |
| | | color: "#fff" |
| | | } |
| | | }, |
| | | yAxis: { |
| | | type: "category", |
| | | axisLabel: { |
| | | color: "#fff" |
| | | }, |
| | | data: [ |
| | | "一月", |
| | | "二月", |
| | | "三月", |
| | | "四月", |
| | | "五月", |
| | | "六月", |
| | | "七月", |
| | | "八月", |
| | | "九月", |
| | | "十月", |
| | | "十一月", |
| | | "十二月" |
| | | ] |
| | | }, |
| | | color: [ |
| | | "#73c0de", |
| | | |
| | | "#fac858", |
| | | "#91cc75", |
| | | "#3ba272", |
| | | "#fc8452", |
| | | "#9a60b4", |
| | | "#3fb1e3", |
| | | "#6be6c1", |
| | | "#626c91", |
| | | "#a0a7e6", |
| | | "#c4ebad", |
| | | "#96dee8" |
| | | ], |
| | | series: [ |
| | | { |
| | | name: "2011年", |
| | | type: "bar", |
| | | data: [231, 123, 441, 123, 321, 333, 111, 221, 332, 442, 132, 51] |
| | | name: "人员分布", |
| | | type: "pie", |
| | | radius: ["40%", "70%"], |
| | | data: [ |
| | | { value: 1048, name: "已派遣人数" }, |
| | | { value: 735, name: "未派遣人" } |
| | | ] |
| | | } |
| | | ] |
| | | }; |
| | |
| | | export default { |
| | | bottomOption, |
| | | middleOption1, |
| | | middleOption2 |
| | | middleOption2, |
| | | economicMiddle, |
| | | economicPieOption |
| | | }; |