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

68 lines
1.1 KiB
Vue

<template>
<ChartCard margin="30rpx 0 0 0" title="QC活动">
<view class="inspection ">
<qiun-data-charts type="column" :opts="opts" :chartData="chartData" @getIndex="handleTap" />
</view>
</ChartCard>
</template>
<script setup>
import ChartCard from '@/components/chartCard.vue'
import {
ref
} from 'vue';
import {
onReady
} from '@dcloudio/uni-app'
const opts = ref({
padding: [15, 15, 0, 5],
enableScroll: false,
legend: {show: false},
xAxis: {
disableGrid: true
},
yAxis: {
showTitle: true,
data: [{
title: "单位:项"
}]
},
extra: {
column: {
type: "group",
width: 30,
activeBgColor: "#000000",
activeBgOpacity: 0.08,
}
}
})
const chartData = ref({})
const handleTap = (e) => {
console.log(e)
}
onReady(() => {
let res = {
categories: ["省部级奖\n项", "集团级奖\n项", "企业级奖\n项"],
series: [{
color: "#27c9cb",
name: '',
data: [100, 542, 685]
},
]
};
chartData.value = JSON.parse(JSON.stringify(res));
})
</script>
<style lang="scss">
.inspection {
width: 100%;
height: 300rpx;
}
</style>