1234567891011121314151617181920212223242526272829303132333435 |
- <!-- eslint-disable vue/multi-word-component-names -->
- <template>
- <CommonTitle class="mb-10px" label="矿井火灾风险性等级" :value="risk" />
- <ListItem
- v-for="(item, i) in FIRE_STATUS_LIST"
- :key="item.icon"
- :icon="item.icon"
- :label="item.label"
- :value="data[item.prop]"
- :type="i % 2 ? 'green' : 'blue'"
- class="mt-5px"
- />
- </template>
- <script lang="ts" setup>
- import { onMounted, ref, shallowRef } from 'vue';
- import CommonTitle from './CommonTitle.vue';
- import ListItem from './ListItem.vue';
- import { FIRE_STATUS_LIST } from '../billboard.data';
- import { getSummary } from '../billboard.api';
- const risk = ref('低风险');
- const data = shallowRef<any>({});
- function fetchData() {
- getSummary().then((r) => {
- data.value = r.fireInfo;
- });
- }
- onMounted(() => {
- fetchData();
- });
- </script>
- <style lang="less" scoped></style>
|