+
+
+ {{
+ propertyValue.get(slotProps.id)
+ ?.hex || ''
+ }}
+
+
+ {{
+ moment(
+ propertyValue.get(slotProps.id)
+ ?.timestamp,
+ ).format('YYYY-MM-DD HH:mm:ss')
+ }}
+
+
+
>({});
const params = ref>({});
const opcImage = getImage('/DataCollect/device-opcua.png');
@@ -242,7 +275,6 @@ const defaultParams = ref({
{
column: 'collectorId',
value: collectorId.value,
- // value: '1610517928766550016', //测试
},
],
},
@@ -332,6 +364,9 @@ const columns = [
},
];
+const subRef = ref();
+const propertyValue = ref(new Map());
+
const handlAdd = () => {
visible.saveModBus = true;
current.value = {
@@ -431,6 +466,7 @@ const cancelSelect = () => {
};
const handleClick = (dt: any) => {
+ if (props.data?.provider !== 'OPC_UA') return;
if (_selectedRowKeys.value.includes(dt.id)) {
const _index = _selectedRowKeys.value.findIndex((i) => i === dt.id);
_selectedRowKeys.value.splice(_index, 1);
@@ -439,6 +475,32 @@ const handleClick = (dt: any) => {
}
};
+const subscribeProperty = (value: any) => {
+ const list = value.map((item: any) => item.id);
+ const id = `collector-${props.data?.channelId || 'channel'}-${
+ props.data?.id || 'point'
+ }-data-${list.join('-')}`;
+ const topic = `/collector/${props.data?.channelId || '*'}/${
+ props.data?.id || '*'
+ }/data`;
+ subRef.value = getWebSocket(id, topic, {
+ pointId: list.join(','),
+ })
+ ?.pipe(map((res) => res.payload))
+ .subscribe((payload: any) => {
+ propertyValue.value.set(payload.pointId, payload);
+ });
+};
+
+watch(
+ () => tableRef?.value?._dataSource,
+ (value) => {
+ if (value.length !== 0) {
+ subscribeProperty(value);
+ }
+ },
+);
+
watch(
() => props.data,
(value) => {
@@ -451,13 +513,19 @@ watch(
value: 'subscribe',
});
defaultParams.value.terms[0].terms[0].value = value.id;
- // defaultParams.value.terms[0].terms[0].value = '1610517928766550016'; //测试
tableRef?.value?.reload && tableRef?.value?.reload();
+ cancelSelect();
}
},
{ immediate: true, deep: true },
);
+onUnmounted(() => {
+ if (subRef.value) {
+ subRef.value?.unsubscribe();
+ }
+});
+
/**
* 搜索
* @param params
@@ -492,12 +560,22 @@ const handleSearch = (e: any) => {
margin-top: 10px;
display: flex;
.card-box-content-left {
- flex: 0.2;
+ // flex: 0.2;
+ max-width: 220px;
border-right: 1px solid #e0e4e8;
height: 68px;
- padding-right: 20px;
- display: flex;
- justify-content: flex-start;
+ padding-right: 10px;
+ .card-box-content-left-1 {
+ display: flex;
+ justify-content: flex-start;
+ .card-box-content-left-1-title {
+ color: #000;
+ font-size: 20px;
+ opacity: 0.85;
+ }
+ }
+
+ // justify-content: space-between;
a {
margin-left: 10px;
}
diff --git a/src/views/DataCollect/Collector/data.ts b/src/views/DataCollect/Collector/data.ts
index 75c218a2..b349f2a1 100644
--- a/src/views/DataCollect/Collector/data.ts
+++ b/src/views/DataCollect/Collector/data.ts
@@ -174,7 +174,6 @@ export const FormTableColumns = [
title: '操作',
key: 'action',
dataIndex: 'action',
-
fixed: 'right',
width: 80,
},