ko.ko/CviLux_fe
1
1
Fork 0
Code Issues 1 Pull Requests Actions Packages Projects 1 Releases Wiki Activity

修正2D圓點（卡片點選）

Browse Source
This commit is contained in:
JouChun 2024-11-21 14:02:16 -05:00
parent 96fe7e279b
commit 3a766f0db6
3 changed files with 33 additions and 14 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
src/views/system/System.vue
View File

@ -69,7 +69,8 @@ const getData = async () => {
currentColor: dev.device_normal_point_color,
spriteDbId: 10 + index,
sensorTypes: dev.points.map(({ points }) => points),
floor_guid: d.floor_guid
floor_guid: d.floor_guid,
is2DActive: false
})),
}));

30
src/views/system/SystemFloor.vue
View File

@ -55,6 +55,8 @@ const defaultOption = (map, data = []) => {
const { selectedFloor } = useSelectedFloor()
const allData = ref([])
watch([selectedFloor, () => asset_floor_chart,], ([newValue, newChart], [oldValue]) => {
if (newValue && newChart.value && oldValue?.key !== newValue.key && newValue.map_url) {
asset_floor_chart.value.updateSvg(
@ -65,24 +67,27 @@ watch([selectedFloor, () => asset_floor_chart,], ([newValue, newChart], [oldValu
defaultOption(newValue?.title, subscribeData.value?.filter(d => d.device_coordinate && d.floor_guid === route.params.floor_id).map(d => [...d.device_coordinate.split(","), d]) || [])
);
const allData = subscribeData.value?.filter(d => d.device_coordinate && d.floor_guid === route.params.floor_id).map(d => [...d.device_coordinate.split(","), d])
newChart.value.chart.on("click", function (params) {
console.log(params, params.data[2])
getCurrentInfoModalData(params.event, {
left: params.event.offsetX
, top: params.event.offsetY
}, params.data[3])
const selected = allData.filter((d => d[2].device_number === params.data[2].device_number))
const unSelected = allData.filter((d => d[2].device_number !== params.data[2].device_number))
newChart.value.chart.setOption({
}, params.data[2])
let values = [...subscribeData.value].map(d => ({ ...d, is2DActive: d.forge_dbid === params.data[2].forge_dbid }))
subscribeData.value = values;
const selected = allData.value.filter((d => d[2].device_number === params.data[2].device_number))
const unSelected = allData.value.filter((d => d[2].device_number !== params.data[2].device_number))
newChart.value.chart.setOption({
series: [
{ data: unSelected }, {
data: selected,
}
]
})
console.log(selected, unSelected)
});
@ -93,12 +98,19 @@ watch([selectedFloor, () => asset_floor_chart,], ([newValue, newChart], [oldValu
})
watch(subscribeData, (newData) => {
let values = newData?.filter(d => d.device_coordinate && d.floor_guid === route.params.floor_id).map(d => [...d.device_coordinate.split(","), d])
allData.value = values;
if (selectedFloor.value && asset_floor_chart.value && asset_floor_chart.value.chart) {
const selected = allData.value.filter((d => d[2].is2DActive))
const unSelected = allData.value.filter((d => !d[2].is2DActive))
asset_floor_chart.value.chart.setOption({
series: {
data: newData.filter(d => d.device_coordinate && d.floor_guid === route.params.floor_id).map(d => [...d.device_coordinate.split(","), d]),
},
series: [
{ data: unSelected }, {
data: selected,
}
]
})
console.log(asset_floor_chart.value.chart.getOption())
}
}, {
immediate: true,

14
src/views/system/components/SystemCard.vue
View File

@ -3,12 +3,17 @@ import { computed, inject, watch } from "vue"
import useSystemShowData from "@/hooks/useSystemShowData"
const { getCurrentInfoModalData, selected_dbid } = inject("system_selectedDevice")
const { subscribeData } = inject("system_deviceList");
const { showData } = useSystemShowData()
const FILE_BASEURL = import.meta.env.VITE_FILE_API_BASEURL;
const fitToView = (forge_dbid,spriteDbId) => {
selected_dbid.value=[forge_dbid,spriteDbId];
const fitToView = (forge_dbid, spriteDbId) => {
selected_dbid.value = [forge_dbid, spriteDbId];
console.log(subscribeData.value)
let allData = [...subscribeData.value].map(d => ({ ...d, is2DActive: d.forge_dbid === forge_dbid }))
subscribeData.value = allData;
};
</script>
@ -25,7 +30,8 @@ const fitToView = (forge_dbid,spriteDbId) => {
<div class="item h-full cursor-pointer" @click="() => fitToView(device.forge_dbid, device.spriteDbId)">
<div class="left h-full flex flex-wrap justify-center">
<div class="sec02 w-full">
<img v-if="device.device_image_url" :src="`${FILE_BASEURL}/upload/device_icon/${device.device_image}`" :alt="device.device_image" >
<img v-if="device.device_image_url" :src="`${FILE_BASEURL}/upload/device_icon/${device.device_image}`"
:alt="device.device_image">
<span v-else></span>
<span>{{ device.full_name }}</span>
</div>
@ -108,7 +114,7 @@ const fitToView = (forge_dbid,spriteDbId) => {
z-index: 1;
}
.equipment-show .item .sec02 img{
.equipment-show .item .sec02 img {
margin-right: 10px;
width: 2rem !important;
height: 2rem;