上传

pages/index/board/safe/emergencyCard.vue

@@ -1,6 +1,6 @@
 <template>
 	<ChartCard margin="0 0 30rpx 0" title="应急数据">
-		<view class="emergencyCard">
+		<view class="emergencyCard" @click="router.push('/pages/index/emergency/index')">
 			<qiun-data-charts type="column" :opts="opts" :canvas2d="false" :chartData="chartData" @getIndex="handleTap" />
 		</view>
 	</ChartCard>
@@ -8,8 +8,14 @@
 
 <script setup>
 import ChartCard from '@/components/chartCard.vue';
-import { ref, onMounted } from 'vue';
-
+import { ref, watch } from 'vue';
+import { router } from '@/utils';
+let props = defineProps({
+	emergencyData: {
+		type: Array,
+		default: () => []
+	}
+});
 const opts = ref({
 	padding: [15, 15, 0, 5],
 	enableScroll: false,
@@ -42,25 +48,25 @@ const chartData = ref({});
 const handleTap = (e) => {
 	console.log(e);
 };
-
-onMounted(() => {
-	let res = {
-		categories: ['综合预案', '专项预案', '现场处置\n预案', '演练次数	', '参演人数'],
-		series: [
-			{
-				data: [35, 36, 31, 33, 13],
-				color: '#eef82f'
-			}
-		],
-		formatter: function (value, index, series, opts) {
-			console.log(value);
-			console.log(index);
-			console.log(series);
-			console.log(opts);
+watch(
+	() => props.emergencyData,
+	(newVal) => {
+		if (newVal && newVal.length) {
+			// 只有当数据存在时才赋值
+			let res = {
+				categories: ['综合预案', '专项预案', '现场处置\n预案', '演练次数	', '参演人数'],
+				series: [
+					{
+						data: newVal,
+						color: '#eef82f'
+					}
+				]
+			};
+			chartData.value = JSON.parse(JSON.stringify(res));
 		}
-	};
-	chartData.value = JSON.parse(JSON.stringify(res));
-});
+	},
+	{ deep: true, immediate: true }
+);
 </script>
 
 <style lang="scss">