function bottomOption(data) { let option = { // 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", axisLabel: { color: "#fff" }, boundaryGap: false, data: [ "一月", "二月", "三月", "四月", "五月", "六月", "七月", "八月", "九月", "十月", "十一月", "十二月" ] }, yAxis: { name: "(%)", type: "value", axisLabel: { color: "#fff" } }, series: [ { name: "趋势", data: [10, 30, 20, 50, 10, 40, 32, 13, 21, 12, 25, 11], type: "line", smooth: true, areaStyle: {} } ] }; return option; } function middleOption1(data) { let option = { // title: { // text: "公司保安类数据对比", // textStyle: { // color: "#fff" // } // }, 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: "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 }, xAxis: { type: "category", boundaryGap: false, axisLabel: { color: "#fff" }, data: [ "一月", "二月", "三月", "四月", "五月", "六月", "七月", "八月", "九月", "十月", "十一月", "十二月" ] }, yAxis: { type: "value", axisLabel: { color: "#fff" } }, series: [ { name: "缴纳社保人数", type: "line", stack: "总量", data: [120, 132, 101, 134, 90, 230, 210, 214, 123, 22, 132, 321] }, { name: "公司派遣人数", type: "line", stack: "总量", data: [220, 182, 191, 234, 290, 330, 310, 111, 222, 132, 143, 123] } ] }; return option; } function economicPieOption() { let title = "总"; let total = "111"; let option = { 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: "item" }, legend: { bottom: "0%", left: "center", textStyle: { color: "#fff" } }, color: [ "#73c0de", "#fac858", "#91cc75", "#3ba272", "#fc8452", "#9a60b4", "#3fb1e3", "#6be6c1", "#626c91", "#a0a7e6", "#c4ebad", "#96dee8" ], series: [ { name: "人员分布", type: "pie", radius: ["40%", "70%"], data: [ { value: 1048, name: "已派遣人数" }, { value: 735, name: "未派遣人" } ] } ] }; return option; } export default { bottomOption, middleOption1, middleOption2, economicMiddle, economicPieOption };