import * as echarts from \'../components/ec-canvas/echarts\';
import { status, measured, distribut } from \'../services/home\'
let charts = null;
let chart = null;
let charthos = null;
var bainua = () => {
Promise.all([status({ as: 111 }), measured(), distribut()]).then((res) => {
console.log(res)
}, reason => {
console.log(reason)
})
// 客房状态图
status({ as: 111 }).then((res) => {
console.log(res)
charts.setOption({
tooltip: {
trigger: \'item\',
formatter: "{a} {b}: {c} ({d}%)"
},
legend: {
// orient: \'vertical\',
// left: 10,
left: \'center\',
top: \'bottom\',
data: [\'空净\', \'空脏\', \'住净\', \'住脏\', \'维修\', \'锁\']
},
grid: {
left: 20,
right: 20,
bottom: 15,
top: 20,
containLabel: true
},
//设置饼状图每个颜色块的颜色
color: [\'#3AA1FF\', \'#36CBCB\', \'#4ECB73\', \'#FBD437\', \'#F2637B\', \'#975FE5\'],
series: [{
name: \'客房状态图\',
type: \'pie\',
radius: \'50%\',
center: [\'50%\', \'50%\'],
hoverOffset: 3,
selectedOffset: 1,
label: {
normal: {
show: true,
position: \'outside\',
formatter: \'{b}:{c}\',
fontSize: 10
},
emphasis: {
show: true,
textStyle: {
fontSize: 12,
fontWeight: \'bold\'
}
}
},
data: [
{ value: 1, name: "空净" },
{ value: 2, name: "空脏" },
{ value: 3, name: "住净" },
{ value: 1, name: "住脏" },
{
value: 2,
name: "维修"
}, {
value: 3,
name: "锁"
}
]
}]
});
})
// 实时客情
measured().then(() => {
chart.setOption({
tooltip: {
trigger: \'item\',
formatter: \'{b}: {c} ({d}%)\'
},
legend: {
// orient: \'vertical\',
// left: 10,
left: \'center\',
top: \'bottom\',
data: [\'自来散客\', \'团队\', \'公司协议\', \'网络订房\', \'自用房\', \'免费房\', \'智会员\', \'潮会员\', \'名会员\']
},
//设置饼状图每个颜色块的颜色
color: [\'#1890FF\', \'#13C2C2\', \'#2FC25B\', \'#FACC14\', \'#F04864\', \'#8543E0\', \'#3436C7\', \'#223273\', \'#1890FF\'],
series: [{
name: \'实时客情\',
type: \'pie\',
radius: [\'30%\', \'50%\'],
center: [\'50%\', \'50%\'],
avoidLabelOverlap: false,
hoverOffset: 3,
selectedOffset: 1,
label: {
show: false,
position: \'center\'
},
emphasis: {
label: {
show: true,
fontSize: \'20\',
fontWeight: \'bold\'
}
},
labelLine: {
show: true
},
data: [
{ value: 10, name: \'自来散客\' },
{ value: 20, name: \'团队\' },
{ value: 15, name: \'公司协议\' },
{ value: 16, name: \'网络订房\' },
{ value: 18, name: \'自用房\' },
{ value: 20, name: \'免费房\' },
{ value: 12, name: \'智会员\' },
{ value: 11, name: \'潮会员\' },
{ value: 14, name: \'名会员\' },
]
}]
});
})
// 在住分布图
distribut().then(() => {
charthos.setOption({
// title: {
// text: \'世界人口总量\',
// subtext: \'数据来自网络\'
// },
tooltip: {
trigger: \'axis\',
axisPointer: {
type: \'shadow\'
}
},
legend: {
data: [\'总数\', \'在住\'],
left: \'right\',
},
grid: {
left: \'3%\',
right: \'4%\',
bottom: \'3%\',
containLabel: true
},
xAxis: {
type: \'value\',
boundaryGap: [0, 0.01]
},
yAxis: {
type: \'category\',
data: [\'智享大床房\', \'智享大床房\', \'智享大床房\', \'智享大床房\', \'智享大床房\', \'智享大床房\']
},
series: [{
name: \'总数\',
type: \'bar\',
radius: \'30%\',
center: [\'50%\', \'50%\'],
data: [1, 4, 8, 12, 16, 20],
color: "#3AA1FF"
},
{
name: \'在住\',
type: \'bar\',
radius: \'30%\',
center: [\'50%\', \'50%\'],
data: [1, 4, 8, 12, 16, 13],
color: "#4ECB73"
}
]
});
})
}
// 客房状态图
var initCharts = function(canvas, width, height, dpr) {
charts = echarts.init(canvas, null, {
width: width,
height: height,
devicePixelRatio: dpr
});
canvas.setChart(charts);
// bainua()
return charts;
}
// 实时客情
var initChartsco = function(canvas, width, height, dpr) {
chart = echarts.init(canvas, null, {
width: width,
height: height,
devicePixelRatio: dpr
});
canvas.setChart(chart);
return chart;
}
// 在住分布图
var initHouse = function(canvas, width, height, dpr) {
charthos = echarts.init(canvas, null, {
width: width,
height: height,
devicePixelRatio: dpr
});
canvas.setChart(charthos);
return charthos;
}
module.exports = {
initCharts: initCharts,
initChartsco: initChartsco,
initHouse,
bainua,