|
|
|
@ -89,18 +89,37 @@ |
|
|
|
v-show="targetDataSourceRequest.dataSourceType == 'point'" |
|
|
|
v-show="targetDataSourceRequest.dataSourceType == 'point'" |
|
|
|
> |
|
|
|
> |
|
|
|
<template #name> |
|
|
|
<template #name> |
|
|
|
点位: |
|
|
|
点位: <n-text depth="3">已选 {{ targetDataSourceRequest.points.length }} / 6</n-text> |
|
|
|
|
|
|
|
</template> |
|
|
|
|
|
|
|
<template v-if="loadingPoints"> |
|
|
|
|
|
|
|
<n-space vertical justify="space-between" style="height: 428px;"> |
|
|
|
|
|
|
|
<template v-for=" i of 12" :key="i"> |
|
|
|
|
|
|
|
<n-skeleton text :style="{ |
|
|
|
|
|
|
|
width: `${100 - (i - 4) * 10}%` |
|
|
|
|
|
|
|
}" /> |
|
|
|
|
|
|
|
</template> |
|
|
|
|
|
|
|
</n-space> |
|
|
|
|
|
|
|
</template> |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<template v-else-if="!pointList.length"> |
|
|
|
|
|
|
|
<n-empty size="huge" style="height: 428px; display: flex; align-items: center; justify-content: center;"> |
|
|
|
|
|
|
|
<template #default> |
|
|
|
|
|
|
|
{{ targetDataSourceRequest.device ? `暂无数据`: `请先选择设备` }} |
|
|
|
|
|
|
|
</template> |
|
|
|
|
|
|
|
</n-empty> |
|
|
|
</template> |
|
|
|
</template> |
|
|
|
|
|
|
|
|
|
|
|
<n-infinite-scroll style="height: 428px; overflow: auto" :distance="10"> |
|
|
|
<template v-else> |
|
|
|
<n-checkbox-group v-model:value="targetDataSourceRequest.points"> |
|
|
|
<n-infinite-scroll style="height: 428px; overflow: auto" :distance="10"> |
|
|
|
<n-grid :y-gap="8" :cols="3"> |
|
|
|
<n-checkbox-group :value="targetDataSourceRequest.points" @update:value="handlePointsUpdate"> |
|
|
|
<n-gi v-for="point in pointList" :key="point.columnName"> |
|
|
|
<n-grid :y-gap="8" :cols="3"> |
|
|
|
<n-checkbox :value="point.columnName" :label="point.nameCn"/> |
|
|
|
<n-gi v-for="point in pointList" :key="point.columnName"> |
|
|
|
</n-gi> |
|
|
|
<n-checkbox :value="point.columnName" :label="point.nameCn"/> |
|
|
|
</n-grid> |
|
|
|
</n-gi> |
|
|
|
</n-checkbox-group> |
|
|
|
</n-grid> |
|
|
|
</n-infinite-scroll> |
|
|
|
</n-checkbox-group> |
|
|
|
|
|
|
|
</n-infinite-scroll> |
|
|
|
|
|
|
|
</template> |
|
|
|
</setting-item-box> |
|
|
|
</setting-item-box> |
|
|
|
</template> |
|
|
|
</template> |
|
|
|
|
|
|
|
|
|
|
|
@ -124,10 +143,10 @@ const props = defineProps<{ |
|
|
|
const selectRecentTimeRangeOptions = computed(() => { |
|
|
|
const selectRecentTimeRangeOptions = computed(() => { |
|
|
|
console.log('computed') |
|
|
|
console.log('computed') |
|
|
|
if (props.targetDataSourceRequest!.dataSourceType === 'point') { |
|
|
|
if (props.targetDataSourceRequest!.dataSourceType === 'point') { |
|
|
|
props.targetDataSourceRequest!.recentTimeRange = selectPointsTimeRangeOptions[0].value |
|
|
|
// props.targetDataSourceRequest!.recentTimeRange = selectPointsTimeRangeOptions[0].value |
|
|
|
return selectPointsTimeRangeOptions |
|
|
|
return selectPointsTimeRangeOptions |
|
|
|
} else if(props.targetDataSourceRequest!.dataSourceType === 'earning') { |
|
|
|
} else if(props.targetDataSourceRequest!.dataSourceType === 'earning') { |
|
|
|
props.targetDataSourceRequest!.recentTimeRange = selectEarningTimeRangeOptions[0].value |
|
|
|
// props.targetDataSourceRequest!.recentTimeRange = selectEarningTimeRangeOptions[0].value |
|
|
|
return selectEarningTimeRangeOptions |
|
|
|
return selectEarningTimeRangeOptions |
|
|
|
} |
|
|
|
} |
|
|
|
return [] |
|
|
|
return [] |
|
|
|
@ -151,6 +170,8 @@ watch(() => props.targetDataSourceRequest.station, (val) => { |
|
|
|
|
|
|
|
|
|
|
|
function handleStationChange() { |
|
|
|
function handleStationChange() { |
|
|
|
props.targetDataSourceRequest.device = '' |
|
|
|
props.targetDataSourceRequest.device = '' |
|
|
|
|
|
|
|
props.targetDataSourceRequest.points = [] |
|
|
|
|
|
|
|
pointList.value = [] |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
const deviceList = ref<any>([]) |
|
|
|
const deviceList = ref<any>([]) |
|
|
|
@ -170,9 +191,11 @@ async function loadDevicesData() { |
|
|
|
window['$message'].error('设备列表数据获取失败！') |
|
|
|
window['$message'].error('设备列表数据获取失败！') |
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
watch(() => props.targetDataSourceRequest.device, async (val) => { |
|
|
|
watch(() => props.targetDataSourceRequest.device, (val) => { |
|
|
|
if (val && !deviceList.value.length) { |
|
|
|
val && loadPointsData() |
|
|
|
await loadDevicesData() |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
val && await loadPointsData() |
|
|
|
},{ |
|
|
|
},{ |
|
|
|
immediate: true, |
|
|
|
immediate: true, |
|
|
|
}) |
|
|
|
}) |
|
|
|
@ -183,10 +206,13 @@ function handleDeviceChange () { |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
const pointList = ref<any>([]) |
|
|
|
const pointList = ref<any>([]) |
|
|
|
async function loadPointsData(){ |
|
|
|
const loadingPoints = ref(false) |
|
|
|
|
|
|
|
async function loadPointsData() { |
|
|
|
|
|
|
|
loadingPoints.value = true |
|
|
|
const curDeviceSn = props.targetDataSourceRequest.device.split('|')[0] ?? '' |
|
|
|
const curDeviceSn = props.targetDataSourceRequest.device.split('|')[0] ?? '' |
|
|
|
const findDeviceId = deviceList.value.find((device: any) => device.sn === curDeviceSn).id |
|
|
|
const findDeviceId = deviceList.value.find((device: any) => device.sn === curDeviceSn).id |
|
|
|
if (!findDeviceId) { |
|
|
|
if (!findDeviceId) { |
|
|
|
|
|
|
|
loadingPoints.value = false |
|
|
|
pointList.value = [] |
|
|
|
pointList.value = [] |
|
|
|
return |
|
|
|
return |
|
|
|
} |
|
|
|
} |
|
|
|
@ -199,6 +225,22 @@ async function loadPointsData(){ |
|
|
|
} else { |
|
|
|
} else { |
|
|
|
window['$message'].error('点位列表数据获取失败！') |
|
|
|
window['$message'].error('点位列表数据获取失败！') |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
loadingPoints.value = false |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
function handlePointsUpdate(newVal:string[], currentVal:any) { |
|
|
|
|
|
|
|
if (newVal.length > 6 && currentVal.actionType !== "uncheck") return; |
|
|
|
|
|
|
|
props.targetDataSourceRequest.points = newVal |
|
|
|
|
|
|
|
props.targetDataSourceRequest.pointsInfo = pointList.value.filter((point: any) => |
|
|
|
|
|
|
|
newVal.includes(point.columnName)).map((point: any) => ({ |
|
|
|
|
|
|
|
id: point.id, |
|
|
|
|
|
|
|
addr: point.addr, |
|
|
|
|
|
|
|
columnName:point.columnName, |
|
|
|
|
|
|
|
nameCn:point.nameCn, |
|
|
|
|
|
|
|
permission:point.permission, |
|
|
|
|
|
|
|
unit:point.unit, |
|
|
|
|
|
|
|
})) |
|
|
|
|
|
|
|
console.log(props.targetDataSourceRequest.pointsInfo) |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
onMounted(()=>{ |
|
|
|
onMounted(()=>{ |
|
|
|
|
