You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
75 lines
1.9 KiB
75 lines
1.9 KiB
<template>
|
|
<!-- <div>数据统计组件</div> -->
|
|
<div style="width: 50%; height: 300px" class="chart-box">
|
|
<div id="PiemapHos" style="height: 300px"></div>
|
|
</div>
|
|
</template>
|
|
<script>
|
|
import { selByHosAllYBS } from 'config/api';
|
|
import mixins from 'views/Mixin/mixin.js';
|
|
import { mapState } from 'vuex';
|
|
export default {
|
|
name: 'PiemapHos',
|
|
mixins: [mixins],
|
|
data() {
|
|
return {
|
|
// msg: 'Welcome to Your Vue.js App',
|
|
width: '',
|
|
height: '',
|
|
dataList: [],
|
|
};
|
|
},
|
|
computed: mapState('home', ['hospitalId']),
|
|
mounted() {
|
|
this.init(this.drawLine);
|
|
},
|
|
methods: {
|
|
async drawLine() {
|
|
// 基于准备好的dom，初始化echarts实例
|
|
let myChart = this.$echarts.init(document.getElementById('PiemapHos'));
|
|
// 绘制图表
|
|
await this.getData();
|
|
var option = {
|
|
tooltip: { trigger: 'item' },
|
|
color: ['#FE9C58', '#7AEBFF', '#FFCC00', '#744CFF'],
|
|
legend: { top: 'bottom' },
|
|
series: [
|
|
{
|
|
name: '生物样本数量',
|
|
type: 'pie',
|
|
radius: [20, 100],
|
|
center: ['50%', '50%'],
|
|
roseType: 'area',
|
|
itemStyle: { borderRadius: 8 },
|
|
data: this.dataList,
|
|
},
|
|
],
|
|
};
|
|
myChart.setOption(option);
|
|
},
|
|
async getData() {
|
|
try {
|
|
const params = { param: { hospitalId: this.hospitalId } };
|
|
const res = await selByHosAllYBS(params);
|
|
const { code, msg, data } = res.data;
|
|
if (code === 200) {
|
|
console.log(data, 123);
|
|
for (let i = 0; i < data.length; i++) {
|
|
var obj = {
|
|
value: data[i].nums,
|
|
name: data[i].name,
|
|
};
|
|
this.dataList.push(obj);
|
|
}
|
|
} else {
|
|
console.log(msg, 132);
|
|
}
|
|
} catch (error) {
|
|
console.log(error);
|
|
}
|
|
},
|
|
},
|
|
};
|
|
</script>
|
|
|
|
<style lang="stylus" scoped ></style>
|
|
|