|
|
@@ -5,12 +5,14 @@
|
|
|
<a-table
|
|
|
size="small"
|
|
|
:columns="innerColumns"
|
|
|
- :data-source="innerDataMap[record.groupcode] || []"
|
|
|
+ :data-source="innerDataMap[record.groupcode] ?? []"
|
|
|
:pagination="false"
|
|
|
- :loading="innerLoadingMap[record.groupcode]"
|
|
|
+ :loading="innerLoadingMap[record.groupcode] ?? false"
|
|
|
row-key="id"
|
|
|
>
|
|
|
- <template #bodyCell="{ column }">{{ record[column.key] ?? '--' }}</template>
|
|
|
+ <template #bodyCell="{ record, column }">
|
|
|
+ {{ record[column.key] ?? '--' }}
|
|
|
+ </template>
|
|
|
</a-table>
|
|
|
</template>
|
|
|
</BasicTable>
|
|
|
@@ -18,8 +20,7 @@
|
|
|
</template>
|
|
|
|
|
|
<script lang="ts" name="system-user" setup>
|
|
|
-//ts语法
|
|
|
-import { watch, ref, reactive } from 'vue';
|
|
|
+import { watch, ref } from 'vue';
|
|
|
import { BasicTable } from '/@/components/Table';
|
|
|
import { useListPage } from '/@/hooks/system/useListPage';
|
|
|
import { getTableHeaderColumns } from '/@/hooks/web/useWebColumns';
|
|
|
@@ -29,6 +30,7 @@ import { getAutoScrollContainer } from '/@/utils/common/compUtils';
|
|
|
|
|
|
const list = (params) => defHttp.get({ url: '/safety/ventanalyDevicesetLog/list', params });
|
|
|
const getDevicesetLog = (params) => defHttp.post({ url: '/ventanaly-device/safety/ventanalyDevicesetLog/queryByGroupCode', params });
|
|
|
+
|
|
|
const props = defineProps({
|
|
|
columnsType: {
|
|
|
type: String,
|
|
|
@@ -61,6 +63,7 @@ const props = defineProps({
|
|
|
const handlerHistory = ref();
|
|
|
const columns = ref([]);
|
|
|
const tableScroll = props.scroll.y ? ref({ y: props.scroll.y - 100 }) : ref({});
|
|
|
+
|
|
|
const innerColumns = ref([
|
|
|
{
|
|
|
title: '设备名称',
|
|
|
@@ -104,51 +107,45 @@ const innerColumns = ref([
|
|
|
align: 'center',
|
|
|
},
|
|
|
]);
|
|
|
+
|
|
|
// 展开行相关
|
|
|
const expandedRowKeys = ref<string[]>([]);
|
|
|
-const innerDataMap = reactive<Record<string, any[]>>({});
|
|
|
-const innerLoadingMap = reactive<Record<string, boolean>>({});
|
|
|
+/** key:groupcode value:子表格数据数组 */
|
|
|
+const innerDataMap = ref<Record<string, any[]>>({});
|
|
|
+const innerLoadingMap = ref<Record<string, boolean>>({});
|
|
|
|
|
|
// 展开/收起事件
|
|
|
const onExpand = async (expanded: boolean, record: Recordable) => {
|
|
|
if (!expanded) return;
|
|
|
const key = record.groupcode;
|
|
|
- if (innerDataMap[key]) return;
|
|
|
- innerLoadingMap[key] = true;
|
|
|
+ if (innerDataMap.value[key]) return;
|
|
|
+
|
|
|
+ innerLoadingMap.value[key] = true;
|
|
|
try {
|
|
|
const res = await getDevicesetLog({ groupCode: key });
|
|
|
- innerDataMap[key] = res.records || res || [];
|
|
|
+ console.log(res, '获取子数据');
|
|
|
+ innerDataMap.value[key] = res || [];
|
|
|
} catch (e) {
|
|
|
console.error('获取子数据失败:', e);
|
|
|
- innerDataMap[key] = [];
|
|
|
+ innerDataMap.value[key] = [];
|
|
|
} finally {
|
|
|
- innerLoadingMap[key] = false;
|
|
|
+ innerLoadingMap.value[key] = false;
|
|
|
}
|
|
|
};
|
|
|
+
|
|
|
watch(
|
|
|
- () => {
|
|
|
- return props.columnsType;
|
|
|
- },
|
|
|
+ () => props.columnsType,
|
|
|
(newVal) => {
|
|
|
const column = getTableHeaderColumns(newVal);
|
|
|
if (column && column.length < 1) {
|
|
|
const arr = newVal.split('_');
|
|
|
- const columnKey = arr.reduce((prev, cur, index) => {
|
|
|
- if (index !== arr.length - 2) {
|
|
|
- return prev + '_' + cur;
|
|
|
- } else {
|
|
|
- return prev;
|
|
|
- }
|
|
|
- });
|
|
|
columns.value = getTableHeaderColumns(arr[0] + '_history');
|
|
|
} else {
|
|
|
columns.value = column;
|
|
|
}
|
|
|
if (handlerHistory.value) reload();
|
|
|
},
|
|
|
- {
|
|
|
- immediate: true,
|
|
|
- }
|
|
|
+ { immediate: true }
|
|
|
);
|
|
|
|
|
|
watch(
|
|
|
@@ -161,9 +158,11 @@ watch(
|
|
|
}
|
|
|
}
|
|
|
);
|
|
|
+
|
|
|
const onExpandedRowsChange = (keys: string[]) => {
|
|
|
expandedRowKeys.value = keys;
|
|
|
};
|
|
|
+
|
|
|
// 列表页面公共参数、方法
|
|
|
const { tableContext } = useListPage({
|
|
|
tableProps: {
|
|
|
@@ -180,7 +179,6 @@ const { tableContext } = useListPage({
|
|
|
labelAlign: 'left',
|
|
|
showAdvancedButton: false,
|
|
|
baseColProps: {
|
|
|
- // offset: 0.5,
|
|
|
xs: 24,
|
|
|
sm: 24,
|
|
|
md: 24,
|
|
|
@@ -219,17 +217,6 @@ const { tableContext } = useListPage({
|
|
|
span: 4,
|
|
|
},
|
|
|
},
|
|
|
- // {
|
|
|
- // label: '查询设备',
|
|
|
- // field: 'gdeviceid',
|
|
|
- // component: 'ApiSelect',
|
|
|
- // componentProps: {
|
|
|
- // api: props.deviceListApi,
|
|
|
- // resultField: 'records',
|
|
|
- // labelField: 'strname',
|
|
|
- // valueField: 'id',
|
|
|
- // },
|
|
|
- // },
|
|
|
],
|
|
|
},
|
|
|
fetchSetting: {
|
|
|
@@ -256,16 +243,22 @@ const { tableContext } = useListPage({
|
|
|
});
|
|
|
|
|
|
//注册table数据
|
|
|
-const [registerTable, { reload, setLoading }] = tableContext;
|
|
|
+const [registerTable, { reload: originReload, setLoading }] = tableContext;
|
|
|
+
|
|
|
+/** 包装reload,刷新主表清空子表格缓存与展开状态 */
|
|
|
+const reload = () => {
|
|
|
+ innerDataMap.value = {};
|
|
|
+ innerLoadingMap.value = {};
|
|
|
+ expandedRowKeys.value = [];
|
|
|
+ originReload();
|
|
|
+};
|
|
|
+
|
|
|
defineExpose({ setLoading });
|
|
|
</script>
|
|
|
|
|
|
<style scoped lang="less">
|
|
|
@ventSpace: zxm;
|
|
|
|
|
|
-// :deep(.@{ventSpace}-table-body) {
|
|
|
-// height: auto !important;
|
|
|
-// }
|
|
|
:deep(.zxm-picker) {
|
|
|
height: 30px !important;
|
|
|
}
|
|
|
@@ -297,4 +290,4 @@ defineExpose({ setLoading });
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
-</style>
|
|
|
+</style>
|