|
@@ -47,632 +47,632 @@
|
|
|
</template>
|
|
|
|
|
|
<script lang="ts" setup>
|
|
|
-//ts语法
|
|
|
-import { watchEffect, ref, watch, defineExpose, inject, nextTick, onMounted, computed } from 'vue';
|
|
|
-import { FormSchema } from '/@/components/Form/index';
|
|
|
-import { BasicTable } from '/@/components/Table';
|
|
|
-import { useListPage } from '/@/hooks/system/useListPage';
|
|
|
-import { getTableHeaderColumns } from '/@/hooks/web/useWebColumns';
|
|
|
-import { defHttp } from '/@/utils/http/axios';
|
|
|
-import dayjs from 'dayjs';
|
|
|
-import { getAutoScrollContainer } from '/@/utils/common/compUtils';
|
|
|
-import { render } from '/@/utils/common/renderUtils';
|
|
|
-import { useMethods } from '/@/hooks/system/useMethods';
|
|
|
-import BarAndLine from '/@/components/chart/BarAndLine.vue';
|
|
|
-import { getDictItemsByCode } from '/@/utils/dict';
|
|
|
-import { get } from 'lodash-es';
|
|
|
-
|
|
|
-const globalConfig = inject('globalConfig');
|
|
|
-const props = defineProps({
|
|
|
- columnsType: {
|
|
|
- type: String,
|
|
|
- },
|
|
|
- columns: {
|
|
|
- type: Array,
|
|
|
- // required: true,
|
|
|
- default: () => [],
|
|
|
- },
|
|
|
- deviceType: {
|
|
|
- type: String,
|
|
|
- required: true,
|
|
|
- },
|
|
|
- deviceListApi: {
|
|
|
- type: Function,
|
|
|
- },
|
|
|
- deviceArr: {
|
|
|
- type: Array,
|
|
|
- // required: true,
|
|
|
- default: () => [],
|
|
|
- },
|
|
|
- designScope: {
|
|
|
- type: String,
|
|
|
- },
|
|
|
- sysId: {
|
|
|
- type: String,
|
|
|
- },
|
|
|
- deviceId: {
|
|
|
- type: String,
|
|
|
- },
|
|
|
- scroll: {
|
|
|
- type: Object,
|
|
|
- default: { y: 0 },
|
|
|
- },
|
|
|
- formSchemas: {
|
|
|
- type: Array<FormSchema>,
|
|
|
- default: () => [],
|
|
|
- },
|
|
|
- /** 仅展示已绑定设备,选择是则从系统中获取sysId下已绑定设备。仅能查询到已绑定设备的历史数据 */
|
|
|
- onlyBounedDevices: {
|
|
|
- type: Boolean,
|
|
|
- default: false,
|
|
|
- },
|
|
|
- showHistoryCurve: {
|
|
|
- type: Boolean,
|
|
|
- default: false,
|
|
|
- },
|
|
|
-});
|
|
|
-const getDeviceListApi = (params) => defHttp.post({ url: '/monitor/device', params });
|
|
|
-const historyTable = ref();
|
|
|
-const loading = ref(false);
|
|
|
-const stationType = ref('plc1');
|
|
|
-const dataSource = ref([]);
|
|
|
-const intervalMap = new Map([
|
|
|
- ['1', '1s'],
|
|
|
- ['2', '5s'],
|
|
|
- ['3', '10s'],
|
|
|
- ['4', '30s'],
|
|
|
- ['5', '1m'],
|
|
|
- ['6', '10m'],
|
|
|
- ['7', '30m'],
|
|
|
- ['8', '1h'],
|
|
|
- ['9', '1d'],
|
|
|
-]);
|
|
|
-
|
|
|
-const getExportXlsUrl = () => {
|
|
|
- if (stationType.value !== 'redis') {
|
|
|
- return '/safety/ventanalyMonitorData/export/historydata';
|
|
|
- } else {
|
|
|
- return '/monitor/history/exportHistoryData';
|
|
|
- }
|
|
|
-};
|
|
|
-const emit = defineEmits(['change']);
|
|
|
-
|
|
|
-const historyType = ref('');
|
|
|
-const deviceKide = ref('');
|
|
|
-const columns = ref([]);
|
|
|
-let deviceOptions = ref([]);
|
|
|
-const deviceTypeStr = ref('');
|
|
|
-const deviceTypeName = ref('');
|
|
|
-const deviceType = ref('');
|
|
|
-const chartsColumns = ref([]);
|
|
|
-loading.value = true;
|
|
|
-
|
|
|
-const selectedOption = computed<Record<string, any> | undefined>(() => {
|
|
|
- let idval: string | undefined = getForm()?.getFieldsValue()?.gdeviceids;
|
|
|
- if (VENT_PARAM.historyIsMultiple && idval) {
|
|
|
- const arr = idval.split(',');
|
|
|
- idval = arr[arr.length - 1];
|
|
|
- }
|
|
|
- return deviceOptions.value.find((e: any) => {
|
|
|
- return e.value === idval;
|
|
|
+ //ts语法
|
|
|
+ import { watchEffect, ref, watch, defineExpose, inject, nextTick, onMounted, computed } from 'vue';
|
|
|
+ import { FormSchema } from '/@/components/Form/index';
|
|
|
+ import { BasicTable } from '/@/components/Table';
|
|
|
+ import { useListPage } from '/@/hooks/system/useListPage';
|
|
|
+ import { getTableHeaderColumns } from '/@/hooks/web/useWebColumns';
|
|
|
+ import { defHttp } from '/@/utils/http/axios';
|
|
|
+ import dayjs from 'dayjs';
|
|
|
+ import { getAutoScrollContainer } from '/@/utils/common/compUtils';
|
|
|
+ import { render } from '/@/utils/common/renderUtils';
|
|
|
+ import { useMethods } from '/@/hooks/system/useMethods';
|
|
|
+ import BarAndLine from '/@/components/chart/BarAndLine.vue';
|
|
|
+ import { getDictItemsByCode } from '/@/utils/dict';
|
|
|
+ import { get } from 'lodash-es';
|
|
|
+
|
|
|
+ const globalConfig = inject('globalConfig');
|
|
|
+ const props = defineProps({
|
|
|
+ columnsType: {
|
|
|
+ type: String,
|
|
|
+ },
|
|
|
+ columns: {
|
|
|
+ type: Array,
|
|
|
+ // required: true,
|
|
|
+ default: () => [],
|
|
|
+ },
|
|
|
+ deviceType: {
|
|
|
+ type: String,
|
|
|
+ required: true,
|
|
|
+ },
|
|
|
+ deviceListApi: {
|
|
|
+ type: Function,
|
|
|
+ },
|
|
|
+ deviceArr: {
|
|
|
+ type: Array,
|
|
|
+ // required: true,
|
|
|
+ default: () => [],
|
|
|
+ },
|
|
|
+ designScope: {
|
|
|
+ type: String,
|
|
|
+ },
|
|
|
+ sysId: {
|
|
|
+ type: String,
|
|
|
+ },
|
|
|
+ deviceId: {
|
|
|
+ type: String,
|
|
|
+ },
|
|
|
+ scroll: {
|
|
|
+ type: Object,
|
|
|
+ default: { y: 0 },
|
|
|
+ },
|
|
|
+ formSchemas: {
|
|
|
+ type: Array<FormSchema>,
|
|
|
+ default: () => [],
|
|
|
+ },
|
|
|
+ /** 仅展示已绑定设备,选择是则从系统中获取sysId下已绑定设备。仅能查询到已绑定设备的历史数据 */
|
|
|
+ onlyBounedDevices: {
|
|
|
+ type: Boolean,
|
|
|
+ default: false,
|
|
|
+ },
|
|
|
+ showHistoryCurve: {
|
|
|
+ type: Boolean,
|
|
|
+ default: false,
|
|
|
+ },
|
|
|
});
|
|
|
-});
|
|
|
-
|
|
|
-watch(
|
|
|
- () => {
|
|
|
- return props.columnsType;
|
|
|
- },
|
|
|
- async (newVal) => {
|
|
|
- if (!newVal) return;
|
|
|
- deviceKide.value = newVal;
|
|
|
- if (historyTable.value) {
|
|
|
- getForm().resetFields();
|
|
|
- // getForm().updateSchema();
|
|
|
- // getForm();
|
|
|
+ const getDeviceListApi = (params) => defHttp.post({ url: '/monitor/device', params });
|
|
|
+ const historyTable = ref();
|
|
|
+ const loading = ref(false);
|
|
|
+ const stationType = ref('plc1');
|
|
|
+ const dataSource = ref([]);
|
|
|
+ const intervalMap = new Map([
|
|
|
+ ['1', '1s'],
|
|
|
+ ['2', '5s'],
|
|
|
+ ['3', '10s'],
|
|
|
+ ['4', '30s'],
|
|
|
+ ['5', '1m'],
|
|
|
+ ['6', '10m'],
|
|
|
+ ['7', '30m'],
|
|
|
+ ['8', '1h'],
|
|
|
+ ['9', '1d'],
|
|
|
+ ]);
|
|
|
+
|
|
|
+ const getExportXlsUrl = () => {
|
|
|
+ if (stationType.value !== 'redis') {
|
|
|
+ return '/safety/ventanalyMonitorData/export/historydata';
|
|
|
+ } else {
|
|
|
+ return '/monitor/history/exportHistoryData';
|
|
|
}
|
|
|
- dataSource.value = [];
|
|
|
- // const column = getTableHeaderColumns(newVal.includes('_history') ? newVal : newVal + '_history');
|
|
|
- // if (column && column.length < 1) {
|
|
|
- // const arr = newVal.split('_');
|
|
|
- // console.log('历史记录列表表头------------>', arr[0] + '_monitor');
|
|
|
- // columns.value = getTableHeaderColumns(arr[0] + '_history');
|
|
|
- // if (columns.value.length < 1) {
|
|
|
- // if (historyType.value) {
|
|
|
- // columns.value = getTableHeaderColumns(historyType.value + '_history');
|
|
|
- // }
|
|
|
- // }
|
|
|
- // } else {
|
|
|
- // columns.value = column;
|
|
|
- // }
|
|
|
- await getDeviceList();
|
|
|
- nextTick(() => {
|
|
|
- getDataSource();
|
|
|
+ };
|
|
|
+ const emit = defineEmits(['change']);
|
|
|
+
|
|
|
+ const historyType = ref('');
|
|
|
+ const deviceKide = ref('');
|
|
|
+ const columns = ref([]);
|
|
|
+ let deviceOptions = ref([]);
|
|
|
+ const deviceTypeStr = ref('');
|
|
|
+ const deviceTypeName = ref('');
|
|
|
+ const deviceType = ref('');
|
|
|
+ const chartsColumns = ref([]);
|
|
|
+ loading.value = true;
|
|
|
+
|
|
|
+ const selectedOption = computed<Record<string, any> | undefined>(() => {
|
|
|
+ let idval: string | undefined = getForm()?.getFieldsValue()?.gdeviceids;
|
|
|
+ if (VENT_PARAM.historyIsMultiple && idval) {
|
|
|
+ const arr = idval.split(',');
|
|
|
+ idval = arr[arr.length - 1];
|
|
|
+ }
|
|
|
+ return deviceOptions.value.find((e: any) => {
|
|
|
+ return e.value === idval;
|
|
|
});
|
|
|
+ });
|
|
|
|
|
|
- if (historyTable.value) reload();
|
|
|
- },
|
|
|
- {
|
|
|
- immediate: true,
|
|
|
- }
|
|
|
-);
|
|
|
-
|
|
|
-watch(historyType, (type) => {
|
|
|
- if (!type) return;
|
|
|
- // if (historyTable.value) getForm().resetFields()
|
|
|
-
|
|
|
- const column = getTableHeaderColumns(type.includes('_history') ? type : type + '_history');
|
|
|
- if (column && column.length < 1) {
|
|
|
- const arr = type.split('_');
|
|
|
- columns.value = getTableHeaderColumns(arr[0] + '_history');
|
|
|
- } else {
|
|
|
- columns.value = column;
|
|
|
- }
|
|
|
- setColumns(columns.value);
|
|
|
-});
|
|
|
-
|
|
|
-const showCurve = ref(false);
|
|
|
-
|
|
|
-// 是否显示历史曲线,在devices_shows_history_curve字典里可以配置哪些设备类型需要显示曲线
|
|
|
-// 字典内的字段可以是前缀,例如fanlocal之于fanlocal_normal
|
|
|
-// 安全监控设备需要更多的配置,除去配置safetymonitor,还需要配置哪些安全监控设备需要曲线
|
|
|
-// 因此可以配置例如A1001的dataTypeName代码(可以查看真实数据参考)
|
|
|
-function calcShowCurveValue() {
|
|
|
- const historyCurveDicts = getDictItemsByCode('devices_shows_history_curve') || [];
|
|
|
- const findDict = (str) => historyCurveDicts.some(({ value }) => str.startsWith(value));
|
|
|
-
|
|
|
- if (!props.showHistoryCurve) return false;
|
|
|
- const dt = props.deviceType; // 依赖项
|
|
|
-
|
|
|
- if (!findDict(dt)) return false;
|
|
|
- if (!dt.startsWith('safetymonitor')) return true;
|
|
|
-
|
|
|
- // 和字典的设备类型匹配后,如果是安全监控设备,需要额外的匹配安全监控类型
|
|
|
- const dtns = get(selectedOption.value, 'readData.dataTypeName', ''); // 依赖项
|
|
|
- return findDict(dtns);
|
|
|
-}
|
|
|
-
|
|
|
-function initHistoryCurveColumns() {
|
|
|
- if (!props.showHistoryCurve) return;
|
|
|
- const arr = historyType.value.split('_');
|
|
|
- // 没错,又是安全监控。安全监控的单位无法一次定好,所以根据返回的数据协定单位
|
|
|
- if (props.deviceType.startsWith('safetymonitor')) {
|
|
|
- chartsColumns.value = getTableHeaderColumns(arr[0] + '_chart').map((e) => {
|
|
|
- const unit = get(selectedOption.value, 'readData.unit', e.unit);
|
|
|
- return {
|
|
|
- ...e,
|
|
|
- unit: unit,
|
|
|
- seriesName: unit,
|
|
|
- };
|
|
|
- });
|
|
|
- } else {
|
|
|
- chartsColumns.value = getTableHeaderColumns(arr[0] + '_chart');
|
|
|
- }
|
|
|
-}
|
|
|
-
|
|
|
-const tableScroll = computed(() => {
|
|
|
- if (props.scroll.y && showCurve.value) return { y: props.scroll.y - 450 };
|
|
|
- if (props.scroll.y) return { y: props.scroll.y - 100 };
|
|
|
- return {};
|
|
|
-});
|
|
|
-
|
|
|
-// watch(stationType, (type) => {
|
|
|
-// if (type) {
|
|
|
-// nextTick(() => {
|
|
|
-// getDataSource();
|
|
|
-// });
|
|
|
-// }
|
|
|
-// });
|
|
|
-
|
|
|
-watch(
|
|
|
- () => props.deviceId,
|
|
|
- async () => {
|
|
|
- await getForm().setFieldsValue({});
|
|
|
- await getDeviceList();
|
|
|
- }
|
|
|
-);
|
|
|
-
|
|
|
-/** 获取可供查询历史数据的设备列表 */
|
|
|
-async function getDeviceList() {
|
|
|
- // if (props.deviceType.split('_')[1] && props.deviceType.split('_')[1] === 'history') return;
|
|
|
- let result;
|
|
|
- let response;
|
|
|
- if (props.onlyBounedDevices) {
|
|
|
- response = await getDeviceListApi({
|
|
|
- systemID: props.sysId,
|
|
|
- devicetype: 'sys',
|
|
|
- }).then(({ msgTxt }) => {
|
|
|
- return { msgTxt: msgTxt.filter((e) => e.type === props.deviceType) };
|
|
|
- });
|
|
|
- } else if (props.sysId) {
|
|
|
- response = await getDeviceListApi({
|
|
|
- sysId: props.sysId,
|
|
|
- devicetype: props.deviceType.startsWith('vehicle') ? 'location_normal' : props.deviceType,
|
|
|
- pageSize: 10000,
|
|
|
- });
|
|
|
- } else if (props.deviceListApi) {
|
|
|
- response = await props.deviceListApi();
|
|
|
- } else {
|
|
|
- response = await getDeviceListApi({ devicetype: props.deviceType, pageSize: 10000 });
|
|
|
- }
|
|
|
+ watch(
|
|
|
+ () => {
|
|
|
+ return props.columnsType;
|
|
|
+ },
|
|
|
+ async (newVal) => {
|
|
|
+ if (!newVal) return;
|
|
|
+ deviceKide.value = newVal;
|
|
|
+ if (historyTable.value) {
|
|
|
+ getForm().resetFields();
|
|
|
+ // getForm().updateSchema();
|
|
|
+ // getForm();
|
|
|
+ }
|
|
|
+ dataSource.value = [];
|
|
|
+ // const column = getTableHeaderColumns(newVal.includes('_history') ? newVal : newVal + '_history');
|
|
|
+ // if (column && column.length < 1) {
|
|
|
+ // const arr = newVal.split('_');
|
|
|
+ // console.log('历史记录列表表头------------>', arr[0] + '_monitor');
|
|
|
+ // columns.value = getTableHeaderColumns(arr[0] + '_history');
|
|
|
+ // if (columns.value.length < 1) {
|
|
|
+ // if (historyType.value) {
|
|
|
+ // columns.value = getTableHeaderColumns(historyType.value + '_history');
|
|
|
+ // }
|
|
|
+ // }
|
|
|
+ // } else {
|
|
|
+ // columns.value = column;
|
|
|
+ // }
|
|
|
+ await getDeviceList();
|
|
|
+ nextTick(() => {
|
|
|
+ getDataSource();
|
|
|
+ });
|
|
|
|
|
|
- // 处理不同格式的数据
|
|
|
- if (response['records'] && response['records'].length > 0) {
|
|
|
- result = response['records'];
|
|
|
- } else if (response['msgTxt'] && response['msgTxt'][0] && response['msgTxt'][0]['datalist']) {
|
|
|
- result = response['msgTxt'][0]['datalist'];
|
|
|
+ if (historyTable.value) reload();
|
|
|
+ },
|
|
|
+ {
|
|
|
+ immediate: true,
|
|
|
+ }
|
|
|
+ );
|
|
|
+
|
|
|
+ watch(historyType, (type) => {
|
|
|
+ if (!type) return;
|
|
|
+ // if (historyTable.value) getForm().resetFields()
|
|
|
+
|
|
|
+ const column = getTableHeaderColumns(type.includes('_history') ? type : type + '_history');
|
|
|
+ if (column && column.length < 1) {
|
|
|
+ const arr = type.split('_');
|
|
|
+ columns.value = getTableHeaderColumns(arr[0] + '_history');
|
|
|
+ } else {
|
|
|
+ columns.value = column;
|
|
|
+ }
|
|
|
+ setColumns(columns.value);
|
|
|
+ });
|
|
|
+
|
|
|
+ const showCurve = ref(false);
|
|
|
+
|
|
|
+ // 是否显示历史曲线,在devices_shows_history_curve字典里可以配置哪些设备类型需要显示曲线
|
|
|
+ // 字典内的字段可以是前缀,例如fanlocal之于fanlocal_normal
|
|
|
+ // 安全监控设备需要更多的配置,除去配置safetymonitor,还需要配置哪些安全监控设备需要曲线
|
|
|
+ // 因此可以配置例如A1001的dataTypeName代码(可以查看真实数据参考)
|
|
|
+ function calcShowCurveValue() {
|
|
|
+ const historyCurveDicts = getDictItemsByCode('devices_shows_history_curve') || [];
|
|
|
+ const findDict = (str) => historyCurveDicts.some(({ value }) => str.startsWith(value));
|
|
|
+
|
|
|
+ if (!props.showHistoryCurve) return false;
|
|
|
+ const dt = props.deviceType; // 依赖项
|
|
|
+
|
|
|
+ if (!findDict(dt)) return false;
|
|
|
+ if (!dt.startsWith('safetymonitor')) return true;
|
|
|
+
|
|
|
+ // 和字典的设备类型匹配后,如果是安全监控设备,需要额外的匹配安全监控类型
|
|
|
+ const dtns = get(selectedOption.value, 'readData.dataTypeName', ''); // 依赖项
|
|
|
+ return findDict(dtns);
|
|
|
}
|
|
|
- if (response['msgTxt'] && response['msgTxt'][0]) {
|
|
|
- deviceTypeName.value = response['msgTxt'][0]['typeName'];
|
|
|
- deviceType.value = response['msgTxt'][0]['type'];
|
|
|
+
|
|
|
+ function initHistoryCurveColumns() {
|
|
|
+ if (!props.showHistoryCurve) return;
|
|
|
+ const arr = historyType.value.split('_');
|
|
|
+ // 没错,又是安全监控。安全监控的单位无法一次定好,所以根据返回的数据协定单位
|
|
|
+ if (props.deviceType.startsWith('safetymonitor')) {
|
|
|
+ chartsColumns.value = getTableHeaderColumns(arr[0] + '_chart').map((e) => {
|
|
|
+ const unit = get(selectedOption.value, 'readData.unit', e.unit);
|
|
|
+ return {
|
|
|
+ ...e,
|
|
|
+ unit: unit,
|
|
|
+ seriesName: unit,
|
|
|
+ };
|
|
|
+ });
|
|
|
+ } else {
|
|
|
+ chartsColumns.value = getTableHeaderColumns(arr[0] + '_chart');
|
|
|
+ }
|
|
|
}
|
|
|
|
|
|
- if (result) {
|
|
|
- deviceOptions.value = [];
|
|
|
- deviceOptions.value = result.map((item, index) => {
|
|
|
- return {
|
|
|
- label: item['strinstallpos'],
|
|
|
- value: item['id'] || item['deviceID'],
|
|
|
- strtype: item['strtype'] || item['deviceType'],
|
|
|
- strinstallpos: item['strinstallpos'],
|
|
|
- devicekind: item['devicekind'],
|
|
|
- stationtype: item['stationtype'],
|
|
|
- readData: item['readData'],
|
|
|
- };
|
|
|
- });
|
|
|
+ const tableScroll = computed(() => {
|
|
|
+ if (props.scroll.y && showCurve.value) return { y: props.scroll.y - 450 };
|
|
|
+ if (props.scroll.y) return { y: props.scroll.y - 100 };
|
|
|
+ return {};
|
|
|
+ });
|
|
|
|
|
|
- stationType.value = deviceOptions.value[0]['stationtype'];
|
|
|
- if (props.deviceType.startsWith('vehicle')) {
|
|
|
- historyType.value = 'vehicle';
|
|
|
+ // watch(stationType, (type) => {
|
|
|
+ // if (type) {
|
|
|
+ // nextTick(() => {
|
|
|
+ // getDataSource();
|
|
|
+ // });
|
|
|
+ // }
|
|
|
+ // });
|
|
|
+
|
|
|
+ watch(
|
|
|
+ () => props.deviceId,
|
|
|
+ async () => {
|
|
|
+ await getForm().setFieldsValue({});
|
|
|
+ await getDeviceList();
|
|
|
+ }
|
|
|
+ );
|
|
|
+
|
|
|
+ /** 获取可供查询历史数据的设备列表 */
|
|
|
+ async function getDeviceList() {
|
|
|
+ // if (props.deviceType.split('_')[1] && props.deviceType.split('_')[1] === 'history') return;
|
|
|
+ let result;
|
|
|
+ let response;
|
|
|
+ if (props.onlyBounedDevices) {
|
|
|
+ response = await getDeviceListApi({
|
|
|
+ systemID: props.sysId,
|
|
|
+ devicetype: 'sys',
|
|
|
+ }).then(({ msgTxt }) => {
|
|
|
+ return { msgTxt: msgTxt.filter((e) => e.type === props.deviceType) };
|
|
|
+ });
|
|
|
+ } else if (props.sysId) {
|
|
|
+ response = await getDeviceListApi({
|
|
|
+ sysId: props.sysId,
|
|
|
+ devicetype: props.deviceType.startsWith('vehicle') ? 'location_normal' : props.deviceType,
|
|
|
+ pageSize: 10000,
|
|
|
+ });
|
|
|
+ } else if (props.deviceListApi) {
|
|
|
+ response = await props.deviceListApi();
|
|
|
} else {
|
|
|
- historyType.value = deviceOptions.value[0]['strtype'] || deviceOptions.value[0]['devicekind'];
|
|
|
+ response = await getDeviceListApi({ devicetype: props.deviceType, pageSize: 10000 });
|
|
|
}
|
|
|
|
|
|
- /** 此处使用nextTick是由于可能表单暂未更新,而下面的方法依赖表单项 */
|
|
|
- nextTick(() => {
|
|
|
- showCurve.value = calcShowCurveValue();
|
|
|
- initHistoryCurveColumns();
|
|
|
- });
|
|
|
- }
|
|
|
- if (VENT_PARAM.historyIsMultiple) {
|
|
|
- await getForm().setFieldsValue({
|
|
|
- gdeviceids: [props.deviceId ? props.deviceId : deviceOptions.value[0] ? deviceOptions.value[0]['value'] : ''],
|
|
|
- });
|
|
|
- await getForm().updateSchema({
|
|
|
- field: 'gdeviceids',
|
|
|
- componentProps: {
|
|
|
- mode: 'multiple',
|
|
|
- maxTagCount: 'responsive',
|
|
|
- },
|
|
|
- });
|
|
|
- } else {
|
|
|
- await getForm().setFieldsValue({
|
|
|
- gdeviceids: props.deviceId ? props.deviceId : deviceOptions.value[0] ? deviceOptions.value[0]['value'] : '',
|
|
|
- });
|
|
|
- await getForm().updateSchema({
|
|
|
- field: 'gdeviceids',
|
|
|
- });
|
|
|
+ // 处理不同格式的数据
|
|
|
+ if (response['records'] && response['records'].length > 0) {
|
|
|
+ result = response['records'];
|
|
|
+ } else if (response['msgTxt'] && response['msgTxt'][0] && response['msgTxt'][0]['datalist']) {
|
|
|
+ result = response['msgTxt'][0]['datalist'];
|
|
|
+ }
|
|
|
+ if (response['msgTxt'] && response['msgTxt'][0]) {
|
|
|
+ deviceTypeName.value = response['msgTxt'][0]['typeName'];
|
|
|
+ deviceType.value = response['msgTxt'][0]['type'];
|
|
|
+ }
|
|
|
+
|
|
|
+ if (result) {
|
|
|
+ deviceOptions.value = [];
|
|
|
+ deviceOptions.value = result.map((item, index) => {
|
|
|
+ return {
|
|
|
+ label: item['strinstallpos'],
|
|
|
+ value: item['id'] || item['deviceID'],
|
|
|
+ strtype: item['strtype'] || item['deviceType'],
|
|
|
+ strinstallpos: item['strinstallpos'],
|
|
|
+ devicekind: item['devicekind'],
|
|
|
+ stationtype: item['stationtype'],
|
|
|
+ readData: item['readData'],
|
|
|
+ };
|
|
|
+ });
|
|
|
+
|
|
|
+ stationType.value = deviceOptions.value[0]['stationtype'];
|
|
|
+ if (props.deviceType.startsWith('vehicle')) {
|
|
|
+ historyType.value = 'vehicle';
|
|
|
+ } else {
|
|
|
+ historyType.value = deviceOptions.value[0]['strtype'] || deviceOptions.value[0]['devicekind'];
|
|
|
+ }
|
|
|
+
|
|
|
+ /** 此处使用nextTick是由于可能表单暂未更新,而下面的方法依赖表单项 */
|
|
|
+ nextTick(() => {
|
|
|
+ showCurve.value = calcShowCurveValue();
|
|
|
+ initHistoryCurveColumns();
|
|
|
+ });
|
|
|
+ }
|
|
|
+ if (VENT_PARAM.historyIsMultiple) {
|
|
|
+ await getForm().setFieldsValue({
|
|
|
+ gdeviceids: [props.deviceId ? props.deviceId : deviceOptions.value[0] ? deviceOptions.value[0]['value'] : ''],
|
|
|
+ });
|
|
|
+ await getForm().updateSchema({
|
|
|
+ field: 'gdeviceids',
|
|
|
+ componentProps: {
|
|
|
+ mode: 'multiple',
|
|
|
+ maxTagCount: 'responsive',
|
|
|
+ },
|
|
|
+ });
|
|
|
+ } else {
|
|
|
+ await getForm().setFieldsValue({
|
|
|
+ gdeviceids: props.deviceId ? props.deviceId : deviceOptions.value[0] ? deviceOptions.value[0]['value'] : '',
|
|
|
+ });
|
|
|
+ await getForm().updateSchema({
|
|
|
+ field: 'gdeviceids',
|
|
|
+ });
|
|
|
+ }
|
|
|
}
|
|
|
-}
|
|
|
-
|
|
|
-function resetFormParam() {
|
|
|
- const formData = getForm().getFieldsValue();
|
|
|
- const pagination = getPaginationRef();
|
|
|
- formData['pageNo'] = pagination['current'];
|
|
|
- formData['pageSize'] = pagination['pageSize'];
|
|
|
- formData['column'] = 'createTime';
|
|
|
- if (stationType.value !== 'redis' && deviceOptions.value[0]) {
|
|
|
- formData['strtype'] = deviceTypeStr.value
|
|
|
- ? deviceTypeStr.value
|
|
|
- : deviceOptions.value[0]['strtype']
|
|
|
- ? deviceOptions.value[0]['strtype']
|
|
|
- : props.deviceType + '*';
|
|
|
- if (props.sysId) {
|
|
|
- formData['sysId'] = props.sysId;
|
|
|
+
|
|
|
+ function resetFormParam() {
|
|
|
+ const formData = getForm().getFieldsValue();
|
|
|
+ const pagination = getPaginationRef();
|
|
|
+ formData['pageNo'] = pagination['current'];
|
|
|
+ formData['pageSize'] = pagination['pageSize'];
|
|
|
+ formData['column'] = 'createTime';
|
|
|
+ if (stationType.value !== 'redis' && deviceOptions.value[0]) {
|
|
|
+ formData['strtype'] = deviceTypeStr.value
|
|
|
+ ? deviceTypeStr.value
|
|
|
+ : deviceOptions.value[0]['strtype']
|
|
|
+ ? deviceOptions.value[0]['strtype']
|
|
|
+ : props.deviceType + '*';
|
|
|
+ if (props.sysId) {
|
|
|
+ formData['sysId'] = props.sysId;
|
|
|
+ }
|
|
|
+ return formData;
|
|
|
+ } else {
|
|
|
+ const params = {
|
|
|
+ pageNum: pagination['current'],
|
|
|
+ pageSize: pagination['pageSize'],
|
|
|
+ column: pagination['createTime'],
|
|
|
+ startTime: formData['ttime_begin'],
|
|
|
+ endTime: formData['ttime_end'],
|
|
|
+ deviceId: formData['gdeviceids'],
|
|
|
+ strtype: props.deviceType + '*',
|
|
|
+ sysId: props.sysId,
|
|
|
+ interval: intervalMap.get(formData['skip']) ? intervalMap.get(formData['skip']) : '1h',
|
|
|
+ isEmployee: props.deviceType.startsWith('vehicle') ? false : true,
|
|
|
+ };
|
|
|
+ return params;
|
|
|
}
|
|
|
- return formData;
|
|
|
- } else {
|
|
|
- const params = {
|
|
|
- pageNum: pagination['current'],
|
|
|
- pageSize: pagination['pageSize'],
|
|
|
- column: pagination['createTime'],
|
|
|
- startTime: formData['ttime_begin'],
|
|
|
- endTime: formData['ttime_end'],
|
|
|
- deviceId: formData['gdeviceids'],
|
|
|
- strtype: props.deviceType + '*',
|
|
|
- sysId: props.sysId,
|
|
|
- interval: intervalMap.get(formData['skip']) ? intervalMap.get(formData['skip']) : '1h',
|
|
|
- isEmployee: props.deviceType.startsWith('vehicle') ? false : true,
|
|
|
- };
|
|
|
- return params;
|
|
|
}
|
|
|
-}
|
|
|
-
|
|
|
-async function getDataSource() {
|
|
|
- dataSource.value = [];
|
|
|
- setLoading(true);
|
|
|
- const params = await resetFormParam();
|
|
|
- if (stationType.value !== 'redis') {
|
|
|
- const result = await defHttp.get({ url: '/safety/ventanalyMonitorData/listdays', params: params });
|
|
|
- setPagination({ total: Math.abs(result['datalist']['total']) || 0 });
|
|
|
- if (result['datalist']['records'].length > 0) {
|
|
|
- dataSource.value = result['datalist']['records'].map((item: any) => {
|
|
|
- return Object.assign(item, item['readData']);
|
|
|
- });
|
|
|
+
|
|
|
+ async function getDataSource() {
|
|
|
+ dataSource.value = [];
|
|
|
+ setLoading(true);
|
|
|
+ const params = await resetFormParam();
|
|
|
+ if (stationType.value !== 'redis') {
|
|
|
+ const result = await defHttp.get({ url: '/safety/ventanalyMonitorData/listdays', params: params });
|
|
|
+ setPagination({ total: Math.abs(result['datalist']['total']) || 0 });
|
|
|
+ if (result['datalist']['records'].length > 0) {
|
|
|
+ dataSource.value = result['datalist']['records'].map((item: any) => {
|
|
|
+ return Object.assign(item, item['readData']);
|
|
|
+ });
|
|
|
+ } else {
|
|
|
+ dataSource.value = [];
|
|
|
+ }
|
|
|
} else {
|
|
|
- dataSource.value = [];
|
|
|
+ const result = await defHttp.post({ url: '/monitor/history/getHistoryData', params: params });
|
|
|
+ setPagination({ total: Math.abs(result['total']) || 0 });
|
|
|
+ dataSource.value = result['records'] || [];
|
|
|
}
|
|
|
- } else {
|
|
|
- const result = await defHttp.post({ url: '/monitor/history/getHistoryData', params: params });
|
|
|
- setPagination({ total: Math.abs(result['total']) || 0 });
|
|
|
- dataSource.value = result['records'] || [];
|
|
|
+ setLoading(false);
|
|
|
}
|
|
|
- setLoading(false);
|
|
|
-}
|
|
|
-
|
|
|
-// 列表页面公共参数、方法
|
|
|
-const { tableContext, onExportXls, onExportXlsPost } = useListPage({
|
|
|
- tableProps: {
|
|
|
- // api: list,
|
|
|
- columns: props.columnsType ? columns : (props.columns as any[]),
|
|
|
- canResize: true,
|
|
|
- showTableSetting: false,
|
|
|
- showActionColumn: false,
|
|
|
- bordered: false,
|
|
|
- size: 'small',
|
|
|
- showIndexColumn: true,
|
|
|
- tableLayout: 'auto',
|
|
|
- formConfig: {
|
|
|
- labelAlign: 'left',
|
|
|
- labelWidth: 80,
|
|
|
- showAdvancedButton: false,
|
|
|
- showSubmitButton: false,
|
|
|
- showResetButton: false,
|
|
|
- baseColProps: {
|
|
|
- xs: 24,
|
|
|
- sm: 24,
|
|
|
- md: 24,
|
|
|
- lg: 9,
|
|
|
- xl: 7,
|
|
|
- xxl: 4,
|
|
|
- },
|
|
|
- schemas:
|
|
|
- props.formSchemas.length > 0
|
|
|
- ? props.formSchemas
|
|
|
- : [
|
|
|
- {
|
|
|
- field: 'ttime_begin',
|
|
|
- label: '开始时间',
|
|
|
- component: 'DatePicker',
|
|
|
- defaultValue: dayjs().startOf('date'),
|
|
|
- required: true,
|
|
|
- componentProps: {
|
|
|
- showTime: true,
|
|
|
- valueFormat: 'YYYY-MM-DD HH:mm:ss',
|
|
|
- getPopupContainer: getAutoScrollContainer,
|
|
|
- },
|
|
|
- colProps: {
|
|
|
- span: 4,
|
|
|
- },
|
|
|
- },
|
|
|
- {
|
|
|
- field: 'ttime_end',
|
|
|
- label: '结束时间',
|
|
|
- component: 'DatePicker',
|
|
|
- defaultValue: dayjs(),
|
|
|
- required: true,
|
|
|
- componentProps: {
|
|
|
- showTime: true,
|
|
|
- valueFormat: 'YYYY-MM-DD HH:mm:ss',
|
|
|
- getPopupContainer: getAutoScrollContainer,
|
|
|
- },
|
|
|
- colProps: {
|
|
|
- span: 4,
|
|
|
- },
|
|
|
- },
|
|
|
- {
|
|
|
- label: computed(() => `${deviceKide.value.startsWith('location') ? '查询人员' : '查询设备'}`),
|
|
|
- field: 'gdeviceids',
|
|
|
- component: 'Select',
|
|
|
- required: true,
|
|
|
- componentProps: {
|
|
|
- showSearch: true,
|
|
|
- filterOption: (input: string, option: any) => {
|
|
|
- return option.label.toLowerCase().indexOf(input.toLowerCase()) >= 0;
|
|
|
+
|
|
|
+ // 列表页面公共参数、方法
|
|
|
+ const { tableContext, onExportXls, onExportXlsPost } = useListPage({
|
|
|
+ tableProps: {
|
|
|
+ // api: list,
|
|
|
+ columns: props.columnsType ? columns : (props.columns as any[]),
|
|
|
+ canResize: true,
|
|
|
+ showTableSetting: false,
|
|
|
+ showActionColumn: false,
|
|
|
+ bordered: false,
|
|
|
+ size: 'small',
|
|
|
+ showIndexColumn: true,
|
|
|
+ tableLayout: 'auto',
|
|
|
+ formConfig: {
|
|
|
+ labelAlign: 'left',
|
|
|
+ labelWidth: 80,
|
|
|
+ showAdvancedButton: false,
|
|
|
+ showSubmitButton: false,
|
|
|
+ showResetButton: false,
|
|
|
+ baseColProps: {
|
|
|
+ xs: 24,
|
|
|
+ sm: 24,
|
|
|
+ md: 24,
|
|
|
+ lg: 9,
|
|
|
+ xl: 7,
|
|
|
+ xxl: 4,
|
|
|
+ },
|
|
|
+ schemas:
|
|
|
+ props.formSchemas.length > 0
|
|
|
+ ? props.formSchemas
|
|
|
+ : [
|
|
|
+ {
|
|
|
+ field: 'ttime_begin',
|
|
|
+ label: '开始时间',
|
|
|
+ component: 'DatePicker',
|
|
|
+ defaultValue: dayjs().startOf('date'),
|
|
|
+ required: true,
|
|
|
+ componentProps: {
|
|
|
+ showTime: true,
|
|
|
+ valueFormat: 'YYYY-MM-DD HH:mm:ss',
|
|
|
+ getPopupContainer: getAutoScrollContainer,
|
|
|
},
|
|
|
- options: deviceOptions,
|
|
|
- onChange: (e, option) => {
|
|
|
- if (option && (option['strinstallpos'] || option['strtype'] || option['devicekind'])) {
|
|
|
- historyType.value = option['strtype'] || option['devicekind'];
|
|
|
- }
|
|
|
- if (option['strtype']) {
|
|
|
- deviceTypeStr.value = option['strtype'];
|
|
|
- }
|
|
|
- stationType.value = option['stationtype'];
|
|
|
- nextTick(() => {
|
|
|
- showCurve.value = calcShowCurveValue();
|
|
|
- initHistoryCurveColumns();
|
|
|
- getDataSource();
|
|
|
- });
|
|
|
+ colProps: {
|
|
|
+ span: 4,
|
|
|
},
|
|
|
},
|
|
|
- colProps: {
|
|
|
- span: 5,
|
|
|
+ {
|
|
|
+ field: 'ttime_end',
|
|
|
+ label: '结束时间',
|
|
|
+ component: 'DatePicker',
|
|
|
+ defaultValue: dayjs(),
|
|
|
+ required: true,
|
|
|
+ componentProps: {
|
|
|
+ showTime: true,
|
|
|
+ valueFormat: 'YYYY-MM-DD HH:mm:ss',
|
|
|
+ getPopupContainer: getAutoScrollContainer,
|
|
|
+ },
|
|
|
+ colProps: {
|
|
|
+ span: 4,
|
|
|
+ },
|
|
|
},
|
|
|
- },
|
|
|
- {
|
|
|
- label: '间隔时间',
|
|
|
- field: 'skip',
|
|
|
- component: 'Select',
|
|
|
- defaultValue: '8',
|
|
|
- componentProps: {
|
|
|
- options: [
|
|
|
- {
|
|
|
- label: '1秒',
|
|
|
- value: '1',
|
|
|
- },
|
|
|
- {
|
|
|
- label: '5秒',
|
|
|
- value: '2',
|
|
|
- },
|
|
|
- {
|
|
|
- label: '10秒',
|
|
|
- value: '3',
|
|
|
+ {
|
|
|
+ label: computed(() => `${deviceKide.value.startsWith('location') ? '查询人员' : '查询设备'}`),
|
|
|
+ field: 'gdeviceids',
|
|
|
+ component: 'Select',
|
|
|
+ required: true,
|
|
|
+ componentProps: {
|
|
|
+ showSearch: true,
|
|
|
+ filterOption: (input: string, option: any) => {
|
|
|
+ return option.label.toLowerCase().indexOf(input.toLowerCase()) >= 0;
|
|
|
},
|
|
|
- {
|
|
|
- label: '30秒',
|
|
|
- value: '4',
|
|
|
+ options: deviceOptions,
|
|
|
+ onChange: (e, option) => {
|
|
|
+ if (option && (option['strinstallpos'] || option['strtype'] || option['devicekind'])) {
|
|
|
+ historyType.value = option['strtype'] || option['devicekind'];
|
|
|
+ }
|
|
|
+ if (option['strtype']) {
|
|
|
+ deviceTypeStr.value = option['strtype'];
|
|
|
+ }
|
|
|
+ stationType.value = option['stationtype'];
|
|
|
+ nextTick(() => {
|
|
|
+ showCurve.value = calcShowCurveValue();
|
|
|
+ initHistoryCurveColumns();
|
|
|
+ getDataSource();
|
|
|
+ });
|
|
|
},
|
|
|
- {
|
|
|
- label: '1分钟',
|
|
|
- value: '5',
|
|
|
- },
|
|
|
- {
|
|
|
- label: '10分钟',
|
|
|
- value: '6',
|
|
|
- },
|
|
|
- {
|
|
|
- label: '30分钟',
|
|
|
- value: '7',
|
|
|
- },
|
|
|
- {
|
|
|
- label: '1小时',
|
|
|
- value: '8',
|
|
|
- },
|
|
|
- {
|
|
|
- label: '1天',
|
|
|
- value: '9',
|
|
|
- },
|
|
|
- ],
|
|
|
+ },
|
|
|
+ colProps: {
|
|
|
+ span: 5,
|
|
|
+ },
|
|
|
},
|
|
|
- colProps: {
|
|
|
- span: 3,
|
|
|
+ {
|
|
|
+ label: '间隔时间',
|
|
|
+ field: 'skip',
|
|
|
+ component: 'Select',
|
|
|
+ defaultValue: '8',
|
|
|
+ componentProps: {
|
|
|
+ options: [
|
|
|
+ {
|
|
|
+ label: '1秒',
|
|
|
+ value: '1',
|
|
|
+ },
|
|
|
+ {
|
|
|
+ label: '5秒',
|
|
|
+ value: '2',
|
|
|
+ },
|
|
|
+ {
|
|
|
+ label: '10秒',
|
|
|
+ value: '3',
|
|
|
+ },
|
|
|
+ {
|
|
|
+ label: '30秒',
|
|
|
+ value: '4',
|
|
|
+ },
|
|
|
+ {
|
|
|
+ label: '1分钟',
|
|
|
+ value: '5',
|
|
|
+ },
|
|
|
+ {
|
|
|
+ label: '10分钟',
|
|
|
+ value: '6',
|
|
|
+ },
|
|
|
+ {
|
|
|
+ label: '30分钟',
|
|
|
+ value: '7',
|
|
|
+ },
|
|
|
+ {
|
|
|
+ label: '1小时',
|
|
|
+ value: '8',
|
|
|
+ },
|
|
|
+ {
|
|
|
+ label: '1天',
|
|
|
+ value: '9',
|
|
|
+ },
|
|
|
+ ],
|
|
|
+ },
|
|
|
+ colProps: {
|
|
|
+ span: 3,
|
|
|
+ },
|
|
|
},
|
|
|
- },
|
|
|
- ],
|
|
|
- // fieldMapToTime: [['tickectDate', ['ttime_begin', 'ttime_end'], '']],
|
|
|
- },
|
|
|
- // fetchSetting: {
|
|
|
- // listField: 'datalist',
|
|
|
- // totalField: 'datalist.total',
|
|
|
- // },
|
|
|
- pagination: {
|
|
|
- current: 1,
|
|
|
- pageSize: 10,
|
|
|
- pageSizeOptions: ['10', '30', '50', '100'],
|
|
|
- showQuickJumper: false,
|
|
|
+ ],
|
|
|
+ // fieldMapToTime: [['tickectDate', ['ttime_begin', 'ttime_end'], '']],
|
|
|
+ },
|
|
|
+ // fetchSetting: {
|
|
|
+ // listField: 'datalist',
|
|
|
+ // totalField: 'datalist.total',
|
|
|
+ // },
|
|
|
+ pagination: {
|
|
|
+ current: 1,
|
|
|
+ pageSize: 10,
|
|
|
+ pageSizeOptions: ['10', '30', '50', '100'],
|
|
|
+ showQuickJumper: false,
|
|
|
+ },
|
|
|
+ beforeFetch() {
|
|
|
+ const newParams = { ...resetFormParam() };
|
|
|
+ return newParams;
|
|
|
+ },
|
|
|
+ // afterFetch(result) {
|
|
|
+ // const resultItems = result['records'];
|
|
|
+ // resultItems.map((item) => {
|
|
|
+ // Object.assign(item, item['readData']);
|
|
|
+ // });
|
|
|
+ // console.log('result---------------->', result);
|
|
|
+ // return resultItems;
|
|
|
+ // },
|
|
|
},
|
|
|
- beforeFetch() {
|
|
|
- const newParams = { ...resetFormParam() };
|
|
|
- return newParams;
|
|
|
+ exportConfig: {
|
|
|
+ name: '设备历史列表',
|
|
|
+ url: getExportXlsUrl,
|
|
|
},
|
|
|
- // afterFetch(result) {
|
|
|
- // const resultItems = result['records'];
|
|
|
- // resultItems.map((item) => {
|
|
|
- // Object.assign(item, item['readData']);
|
|
|
- // });
|
|
|
- // console.log('result---------------->', result);
|
|
|
- // return resultItems;
|
|
|
- // },
|
|
|
- },
|
|
|
- exportConfig: {
|
|
|
- name: '设备历史列表',
|
|
|
- url: getExportXlsUrl,
|
|
|
- },
|
|
|
-});
|
|
|
-
|
|
|
-//注册table数据
|
|
|
-const [registerTable, { reload, setLoading, getForm, setColumns, getPaginationRef, setPagination }] = tableContext;
|
|
|
-
|
|
|
-function onExportXlsFn() {
|
|
|
- const params = resetFormParam();
|
|
|
- // 判断时间间隔和查询时间区间,数据量下载大时进行提示
|
|
|
- if (stationType.value !== 'redis') {
|
|
|
- return onExportXls(params);
|
|
|
- } else {
|
|
|
- return onExportXlsPost(params);
|
|
|
- }
|
|
|
-}
|
|
|
+ });
|
|
|
|
|
|
-watchEffect(() => {
|
|
|
- if (historyTable.value && dataSource) {
|
|
|
- const data = dataSource.value || [];
|
|
|
- emit('change', data);
|
|
|
- }
|
|
|
-});
|
|
|
+ //注册table数据
|
|
|
+ const [registerTable, { reload, setLoading, getForm, setColumns, getPaginationRef, setPagination }] = tableContext;
|
|
|
|
|
|
-onMounted(async () => {
|
|
|
- await getDeviceList();
|
|
|
- if (deviceOptions.value[0]) {
|
|
|
- nextTick(async () => {
|
|
|
- await getDataSource();
|
|
|
- });
|
|
|
+ function onExportXlsFn() {
|
|
|
+ const params = resetFormParam();
|
|
|
+ // 判断时间间隔和查询时间区间,数据量下载大时进行提示
|
|
|
+ if (stationType.value !== 'redis') {
|
|
|
+ return onExportXls(params);
|
|
|
+ } else {
|
|
|
+ return onExportXlsPost(params);
|
|
|
+ }
|
|
|
}
|
|
|
|
|
|
- watch([() => getPaginationRef()['current'], () => getPaginationRef()['pageSize']], async () => {
|
|
|
+ watchEffect(() => {
|
|
|
+ if (historyTable.value && dataSource) {
|
|
|
+ const data = dataSource.value || [];
|
|
|
+ emit('change', data);
|
|
|
+ }
|
|
|
+ });
|
|
|
+
|
|
|
+ onMounted(async () => {
|
|
|
+ await getDeviceList();
|
|
|
if (deviceOptions.value[0]) {
|
|
|
- if (deviceOptions.value[0]) {
|
|
|
+ nextTick(async () => {
|
|
|
await getDataSource();
|
|
|
- }
|
|
|
+ });
|
|
|
}
|
|
|
+
|
|
|
+ watch([() => getPaginationRef()['current'], () => getPaginationRef()['pageSize']], async () => {
|
|
|
+ if (deviceOptions.value[0]) {
|
|
|
+ if (deviceOptions.value[0]) {
|
|
|
+ await getDataSource();
|
|
|
+ }
|
|
|
+ }
|
|
|
+ });
|
|
|
});
|
|
|
-});
|
|
|
-defineExpose({ setLoading });
|
|
|
+ defineExpose({ setLoading });
|
|
|
</script>
|
|
|
|
|
|
<style scoped lang="less">
|
|
|
-@import '/@/design/theme.less';
|
|
|
-
|
|
|
-:deep(.@{ventSpace}-table-body) {
|
|
|
- height: auto !important;
|
|
|
-}
|
|
|
-:deep(.zxm-picker) {
|
|
|
- height: 30px !important;
|
|
|
-}
|
|
|
-.history-table {
|
|
|
- width: 100%;
|
|
|
- :deep(.jeecg-basic-table-form-container) {
|
|
|
- .@{ventSpace}-form {
|
|
|
- padding: 0 !important;
|
|
|
- border: none !important;
|
|
|
- margin-bottom: 0 !important;
|
|
|
- .@{ventSpace}-picker,
|
|
|
- .@{ventSpace}-select-selector {
|
|
|
- width: 100% !important;
|
|
|
- height: 100%;
|
|
|
- background: #00000017;
|
|
|
- border: 1px solid #b7b7b7;
|
|
|
- input,
|
|
|
- .@{ventSpace}-select-selection-item,
|
|
|
- .@{ventSpace}-picker-suffix {
|
|
|
- color: #fff;
|
|
|
- }
|
|
|
- .@{ventSpace}-select-selection-placeholder {
|
|
|
- color: #ffffffaa;
|
|
|
+ @import '/@/design/theme.less';
|
|
|
+
|
|
|
+ :deep(.@{ventSpace}-table-body) {
|
|
|
+ height: auto !important;
|
|
|
+ }
|
|
|
+ :deep(.zxm-picker) {
|
|
|
+ height: 30px !important;
|
|
|
+ }
|
|
|
+ .history-table {
|
|
|
+ width: 100%;
|
|
|
+ :deep(.jeecg-basic-table-form-container) {
|
|
|
+ .@{ventSpace}-form {
|
|
|
+ padding: 0 !important;
|
|
|
+ border: none !important;
|
|
|
+ margin-bottom: 0 !important;
|
|
|
+ .@{ventSpace}-picker,
|
|
|
+ .@{ventSpace}-select-selector {
|
|
|
+ width: 100% !important;
|
|
|
+ height: 100%;
|
|
|
+ background: #00000017;
|
|
|
+ border: 1px solid #b7b7b7;
|
|
|
+ input,
|
|
|
+ .@{ventSpace}-select-selection-item,
|
|
|
+ .@{ventSpace}-picker-suffix {
|
|
|
+ color: #fff;
|
|
|
+ }
|
|
|
+ .@{ventSpace}-select-selection-placeholder {
|
|
|
+ color: #ffffffaa;
|
|
|
+ }
|
|
|
}
|
|
|
}
|
|
|
+ .@{ventSpace}-table-title {
|
|
|
+ min-height: 0 !important;
|
|
|
+ }
|
|
|
}
|
|
|
- .@{ventSpace}-table-title {
|
|
|
- min-height: 0 !important;
|
|
|
- }
|
|
|
- }
|
|
|
- .pagination-box {
|
|
|
- display: flex;
|
|
|
- justify-content: flex-end;
|
|
|
- align-items: center;
|
|
|
- .page-num {
|
|
|
- border: 1px solid #0090d8;
|
|
|
- padding: 4px 8px;
|
|
|
- margin-right: 5px;
|
|
|
- color: #0090d8;
|
|
|
- }
|
|
|
- .btn {
|
|
|
- margin-right: 10px;
|
|
|
+ .pagination-box {
|
|
|
+ display: flex;
|
|
|
+ justify-content: flex-end;
|
|
|
+ align-items: center;
|
|
|
+ .page-num {
|
|
|
+ border: 1px solid #0090d8;
|
|
|
+ padding: 4px 8px;
|
|
|
+ margin-right: 5px;
|
|
|
+ color: #0090d8;
|
|
|
+ }
|
|
|
+ .btn {
|
|
|
+ margin-right: 10px;
|
|
|
+ }
|
|
|
}
|
|
|
}
|
|
|
-}
|
|
|
|
|
|
-.history-chart {
|
|
|
- background-color: #0090d822;
|
|
|
- margin: 0 10px;
|
|
|
-}
|
|
|
+ .history-chart {
|
|
|
+ background-color: #0090d822;
|
|
|
+ margin: 0 10px;
|
|
|
+ }
|
|
|
</style>
|