|
@@ -1,6 +1,6 @@
|
|
|
<template>
|
|
|
<div class="vent-table">
|
|
|
- <BasicTable ref="ventTableRef" @register="registerTable" :rowSelection="props.isShowSelect ? rowSelection: undefined">
|
|
|
+ <BasicTable ref="ventTableRef" @register="registerTable" :rowSelection="props.isShowSelect ? rowSelection : undefined">
|
|
|
<template #tableTitle>
|
|
|
<div></div>
|
|
|
</template>
|
|
@@ -28,7 +28,7 @@
|
|
|
|
|
|
<script lang="ts" setup>
|
|
|
//ts语法
|
|
|
- import { defineExpose, toRaw, watch, ref, onMounted, onUnmounted } from 'vue';
|
|
|
+ import { defineExpose, toRaw, watch, ref, onMounted, onUnmounted, nextTick } from 'vue';
|
|
|
import { BasicTable } from '/@/components/Table';
|
|
|
import { useListPage } from '/@/hooks/system/useListPage';
|
|
|
import { getTableHeaderColumns } from '/@/hooks/web/useWebColumns';
|
|
@@ -58,7 +58,7 @@
|
|
|
},
|
|
|
isShowSelect: {
|
|
|
type: Boolean,
|
|
|
- default:true,
|
|
|
+ default: true,
|
|
|
},
|
|
|
isShowPagination: {
|
|
|
type: Boolean,
|
|
@@ -70,7 +70,7 @@
|
|
|
},
|
|
|
scroll: {
|
|
|
type: Object,
|
|
|
- default: {y: 0}
|
|
|
+ default: { y: 0 },
|
|
|
},
|
|
|
title: {
|
|
|
type: String,
|
|
@@ -81,8 +81,8 @@
|
|
|
},
|
|
|
formConfig: {
|
|
|
type: Object as PropType<FormProps> | undefined,
|
|
|
- default: undefined
|
|
|
- }
|
|
|
+ default: undefined,
|
|
|
+ },
|
|
|
});
|
|
|
const emits = defineEmits(['selectRow']);
|
|
|
const dataTableSource = ref<any[]>([]);
|
|
@@ -91,17 +91,17 @@
|
|
|
const ventTableRef = ref();
|
|
|
|
|
|
const tableMaxHeight = props.scroll.y ? props.scroll.y : 350;
|
|
|
- const columns = ref([])
|
|
|
- const tableScroll = props.scroll.y ? ref({y: props.scroll.y}) : ref({})
|
|
|
- //注册table数据
|
|
|
- // 列表页面公共参数、方法
|
|
|
+ const columns = ref([]);
|
|
|
+ const tableScroll = props.scroll.y ? ref({ y: props.scroll.y }) : ref({});
|
|
|
+ //注册table数据
|
|
|
+ // 列表页面公共参数、方法
|
|
|
const { prefixCls, tableContext, doRequest } = useListPage({
|
|
|
designScope: props.designScope,
|
|
|
tableProps: {
|
|
|
title: props.title,
|
|
|
dataSource: dataTableSource,
|
|
|
- columns: props.columnsType ? columns : (props.columns as any[]),
|
|
|
- rowSelection: { type: props.isShowSelect? 'radio': undefined, columnWidth: 100 },
|
|
|
+ columns: props.columnsType ? columns : (props.columns as any[]),
|
|
|
+ rowSelection: { type: props.isShowSelect ? 'radio' : undefined, columnWidth: 100 },
|
|
|
size: props.size,
|
|
|
useSearchForm: props.formConfig ? true : false,
|
|
|
showTableSetting: false,
|
|
@@ -117,27 +117,36 @@
|
|
|
actionColumn: {
|
|
|
width: 180,
|
|
|
},
|
|
|
- pagination: props.isShowPagination ? {
|
|
|
- current: 1,
|
|
|
- pageSize: 50,
|
|
|
- pageSizeOptions: ['10', '30', '50', '100', '500'],
|
|
|
- showQuickJumper: false
|
|
|
- } : false,
|
|
|
+ pagination: props.isShowPagination
|
|
|
+ ? {
|
|
|
+ current: 1,
|
|
|
+ pageSize: 50,
|
|
|
+ pageSizeOptions: ['10', '30', '50', '100', '500'],
|
|
|
+ showQuickJumper: false,
|
|
|
+ }
|
|
|
+ : false,
|
|
|
beforeFetch: (params) => {
|
|
|
- if(props.deviceType?.startsWith('safetymonitor')){
|
|
|
- return Object.assign(params, { filterParams: {'dataTypeName': params['dataTypeName'], strinstallpos: '*'+params['strinstallpos']+'*'} });
|
|
|
- }else if(props.deviceType?.startsWith('location')) {
|
|
|
- return Object.assign(params, { filterParams: { strinstallpos: '*' + params['strinstallpos'] + '*', userName: '*' + params['strname'] + '*', userJson: '' } });
|
|
|
- }else if(props.deviceType?.startsWith('vehicle')) {
|
|
|
- return Object.assign(params, { filterParams: {strinstallpos: '*'+params['strinstallpos']+'*', vehicleName: '*'+params['strname']+'*' } });
|
|
|
- }else{
|
|
|
+ if (props.deviceType?.startsWith('safetymonitor')) {
|
|
|
+ return Object.assign(params, {
|
|
|
+ filterParams: { dataTypeName: params['dataTypeName'], strinstallpos: '*' + params['strinstallpos'] + '*' },
|
|
|
+ });
|
|
|
+ } else if (props.deviceType?.startsWith('location')) {
|
|
|
+ return Object.assign(params, {
|
|
|
+ filterParams: { strinstallpos: '*' + params['strinstallpos'] + '*', userName: '*' + params['strname'] + '*', userJson: '' },
|
|
|
+ });
|
|
|
+ } else if (props.deviceType?.startsWith('vehicle')) {
|
|
|
+ return Object.assign(params, {
|
|
|
+ filterParams: { strinstallpos: '*' + params['strinstallpos'] + '*', vehicleName: '*' + params['strname'] + '*' },
|
|
|
+ });
|
|
|
+ } else {
|
|
|
return Object.assign(params, { column: 'createTime' });
|
|
|
}
|
|
|
},
|
|
|
},
|
|
|
});
|
|
|
- const [registerTable, { reload, setLoading, setSelectedRowKeys, getSelectRowKeys, getForm, setPagination }, { rowSelection, selectedRowKeys, }] = tableContext;
|
|
|
-
|
|
|
+ const [registerTable, { reload, setLoading, setSelectedRowKeys, getSelectRowKeys, getForm, setPagination }, { rowSelection, selectedRowKeys }] =
|
|
|
+ tableContext;
|
|
|
+
|
|
|
watch(
|
|
|
() => {
|
|
|
return props.dataSource;
|
|
@@ -145,62 +154,64 @@
|
|
|
(newVal, oldVal) => {
|
|
|
if (oldVal && newVal && oldVal.length < 1 && newVal.length > 0) {
|
|
|
// 第一次
|
|
|
- if(getSelectRowKeys().length < 1) setSelectedRowKeys([newVal[0].deviceID]);
|
|
|
+ if (getSelectRowKeys().length < 1) setSelectedRowKeys([newVal[0].deviceID]);
|
|
|
}
|
|
|
const list = <any[]>[];
|
|
|
newVal.forEach((item) => {
|
|
|
list.push(toRaw(item));
|
|
|
});
|
|
|
dataTableSource.value = list;
|
|
|
- if(ventTableRef.value) {
|
|
|
- setLoading(false)
|
|
|
- }
|
|
|
+ nextTick(() => {
|
|
|
+ setLoading(false);
|
|
|
+ });
|
|
|
},
|
|
|
{
|
|
|
- immediate: true
|
|
|
+ immediate: true,
|
|
|
}
|
|
|
);
|
|
|
watch(
|
|
|
- () => {
|
|
|
- return props.columnsType;
|
|
|
- },
|
|
|
- (newVal) => {
|
|
|
- console.log(newVal,'val-----')
|
|
|
- if(!newVal) return
|
|
|
- const column = getTableHeaderColumns(newVal.endsWith('_monitor') ? newVal : newVal+'_monitor')
|
|
|
- console.log('监测列表表头000------------>', 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]+'_monitor');
|
|
|
- }else{
|
|
|
- columns.value = column
|
|
|
+ () => {
|
|
|
+ return props.columnsType;
|
|
|
+ },
|
|
|
+ (newVal) => {
|
|
|
+ console.log(newVal, 'val-----');
|
|
|
+ if (!newVal) return;
|
|
|
+ const column = getTableHeaderColumns(newVal.endsWith('_monitor') ? newVal : newVal + '_monitor');
|
|
|
+ console.log('监测列表表头000------------>', 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] + '_monitor');
|
|
|
+ } else {
|
|
|
+ columns.value = column;
|
|
|
+ }
|
|
|
+ },
|
|
|
+ {
|
|
|
+ immediate: true,
|
|
|
}
|
|
|
- },
|
|
|
- {
|
|
|
- immediate: true
|
|
|
- }
|
|
|
);
|
|
|
|
|
|
- watch(() => props.scroll.y, (newVal) => {
|
|
|
- if (newVal) {
|
|
|
- tableScroll.value = { y: newVal }
|
|
|
- } else {
|
|
|
- tableScroll.value = {}
|
|
|
- }
|
|
|
+ watch(
|
|
|
+ () => props.scroll.y,
|
|
|
+ (newVal) => {
|
|
|
+ if (newVal) {
|
|
|
+ tableScroll.value = { y: newVal };
|
|
|
+ } else {
|
|
|
+ tableScroll.value = {};
|
|
|
+ }
|
|
|
}
|
|
|
- )
|
|
|
-
|
|
|
+ );
|
|
|
+
|
|
|
watch(
|
|
|
selectedRowKeys,
|
|
|
(newKeys) => {
|
|
|
- console.log('设置的选中id---------->', newKeys, dataTableSource.value)
|
|
|
+ console.log('设置的选中id---------->', newKeys, dataTableSource.value);
|
|
|
const index = findIndex(dataTableSource.value, (data: any) => {
|
|
|
return data.deviceID == selectedRowKeys.value[0];
|
|
|
});
|
|
@@ -210,7 +221,7 @@
|
|
|
);
|
|
|
|
|
|
function resetPagination() {
|
|
|
- if(ventTableRef.value) setPagination({current: 1, pageSize: 50, total:0})
|
|
|
+ if (ventTableRef.value) setPagination({ current: 1, pageSize: 50, total: 0 });
|
|
|
}
|
|
|
|
|
|
defineExpose({
|
|
@@ -220,7 +231,7 @@
|
|
|
setLoading,
|
|
|
reload,
|
|
|
getForm,
|
|
|
- resetPagination
|
|
|
+ resetPagination,
|
|
|
});
|
|
|
|
|
|
onMounted(() => {
|
|
@@ -251,5 +262,4 @@
|
|
|
:deep(.@{ventSpace}-pagination) {
|
|
|
margin-right: 20px !important;
|
|
|
}
|
|
|
-
|
|
|
</style>
|