CviLux_fe/src/views/system/components/SystemSubBar.vue
2024-10-21 23:21:29 -04:00

40 lines
1.2 KiB
Vue

<script setup>
import useActiveBtn from "@/hooks/useActiveBtn"
import { inject, watch } from "vue";
import useBuildingStore from "@/stores/useBuildingStore"
import useSearchParam from "@/hooks/useSearchParam"
import { useRoute } from "vue-router";
const { updateDataByGas } = inject("system_deviceList")
const buildingStore = useBuildingStore()
const { items, changeActiveBtn, setItems, selectedBtn } = useActiveBtn();
const route = useRoute()
watch(() => buildingStore, (newValue) => {
newValue.selectedSystem?.points?.length > 0 && setItems(newValue.selectedSystem.points.map(d => ({
title: d.full_name,
key: d.points,
active: route.query.gas ? route.query.gas === d.points : d.points === "temp",
})))
}, {
deep: true,
immediate: true
})
const { changeParams } = useSearchParam();
const onClick = (item) => {
changeParams({ gas: item.key })
changeActiveBtn(item)
updateDataByGas(item.key)
}
</script>
<template>
<template v-if="buildingStore.selectedSystem?.points?.length > 0">
<ButtonGroup :items="items" :withLine="false" className="btn-xs rounded-md" :onclick="(e, item) => onClick(item)" />
</template>
</template>
<style lang='scss' scoped></style>