CNCEC_APP/pages/index/board/qms/safetyCard.vue

63 lines
1.0 KiB
Vue

<template>
<ChartCard margin="30rpx 0 30rpx 0" title="领导级安全检查数">
<view class="big-crisis">
<qiun-data-charts type="column" :opts="opts" :canvas2d="false" :chartData="chartData" @getIndex="handleTap" />
</view>
</ChartCard>
</template>
<script setup>
import ChartCard from '@/components/chartCard.vue';
import { ref, onMounted } from 'vue';
const opts = ref({
padding: [15, 15, 0, 5],
enableScroll: false,
legend: {
show: false
},
xAxis: {
disableGrid: true
},
yAxis: {
data: [
{
min: 0
}
]
},
extra: {
column: {
type: 'group',
width: 20,
activeBgColor: '#000000',
activeBgOpacity: 0.08
}
}
});
const chartData = ref({});
const handleTap = (e) => {
console.log(e);
};
onMounted(() => {
let res = {
categories: ['集团检查数', '企业检查数', '分支机构检查数'],
series: [
{
data: [35, 36,50]
}
]
};
chartData.value = JSON.parse(JSON.stringify(res));
});
</script>
<style lang="scss">
.big-crisis {
width: 100%;
height: 400rpx;
}
</style>