|
@@ -12,15 +12,25 @@
|
|
|
</template>
|
|
|
</template>
|
|
|
</BasicTable>
|
|
|
- <BarAndLine
|
|
|
- v-else
|
|
|
- class="echarts-line"
|
|
|
- xAxisPropType="createTime"
|
|
|
- :dataSource="dataSource"
|
|
|
- height="300px"
|
|
|
- :chartsColumns="chartColumns"
|
|
|
- :option="echatsOption"
|
|
|
- />
|
|
|
+ <div v-else>
|
|
|
+ <Pagination
|
|
|
+ size="small"
|
|
|
+ v-model:current="currentPage"
|
|
|
+ v-model:page-size="pageSize"
|
|
|
+ :total="total"
|
|
|
+ :show-total="(total) => `共 ${total} 条`"
|
|
|
+ style="position: absolute; z-index: 99; top: 2px; right: 30px"
|
|
|
+ />
|
|
|
+ <BarAndLine
|
|
|
+ class="echarts-line"
|
|
|
+ xAxisPropType="createTime"
|
|
|
+ :dataSource="dataSource"
|
|
|
+ height="300px"
|
|
|
+ chartsType="history"
|
|
|
+ :chartsColumns="chartColumns"
|
|
|
+ :option="echatsOption"
|
|
|
+ />
|
|
|
+ </div>
|
|
|
</div>
|
|
|
</template>
|
|
|
|
|
@@ -60,10 +70,10 @@
|
|
|
});
|
|
|
const echatsOption = {
|
|
|
grid: {
|
|
|
- top: '35',
|
|
|
- left: '30',
|
|
|
- right: '45',
|
|
|
- bottom: '25',
|
|
|
+ top: '40',
|
|
|
+ left: '20',
|
|
|
+ right: '0',
|
|
|
+ bottom: '60',
|
|
|
containLabel: true,
|
|
|
},
|
|
|
toolbox: {
|
|
@@ -73,23 +83,101 @@
|
|
|
const dataSource = ref();
|
|
|
const columns = ref([]);
|
|
|
const chartColumns = ref([]);
|
|
|
- const deviceOptions = ref([]);
|
|
|
+ const currentPage = ref<number>(1);
|
|
|
+ const pageSize = ref<number>(20);
|
|
|
+ const total = ref(0);
|
|
|
+
|
|
|
const tableScroll = props.scroll.y ? ref({ y: props.scroll.y - 100 }) : ref({});
|
|
|
+ // 列表页面公共参数、方法
|
|
|
+ const { tableContext } = useListPage({
|
|
|
+ tableProps: {
|
|
|
+ dataSource: dataSource,
|
|
|
+ columns: columns,
|
|
|
+ canResize: true,
|
|
|
+ showTableSetting: false,
|
|
|
+ showActionColumn: false,
|
|
|
|
|
|
+ bordered: false,
|
|
|
+ size: 'small',
|
|
|
+ scroll: tableScroll,
|
|
|
+ showIndexColumn: true,
|
|
|
+ formConfig: {
|
|
|
+ labelAlign: 'left',
|
|
|
+ showAdvancedButton: false,
|
|
|
+ showSubmitButton: false,
|
|
|
+ schemas: [
|
|
|
+ // {
|
|
|
+ // field: 'createTime_begin',
|
|
|
+ // label: '开始时间',
|
|
|
+ // component: 'DatePicker',
|
|
|
+ // defaultValue: dayjs().add(-30, 'day').format('YYYY-MM-DD HH:mm:ss'),
|
|
|
+ // required: true,
|
|
|
+ // componentProps: {
|
|
|
+ // showTime: true,
|
|
|
+ // valueFormat: 'YYYY-MM-DD HH:mm:ss',
|
|
|
+ // getPopupContainer: getAutoScrollContainer,
|
|
|
+ // },
|
|
|
+ // colProps: {
|
|
|
+ // span: 4,
|
|
|
+ // },
|
|
|
+ // },
|
|
|
+ // {
|
|
|
+ // field: 'createTime_end',
|
|
|
+ // label: '结束时间',
|
|
|
+ // component: 'DatePicker',
|
|
|
+ // defaultValue: dayjs(),
|
|
|
+ // required: true,
|
|
|
+ // componentProps: {
|
|
|
+ // showTime: true,
|
|
|
+ // valueFormat: 'YYYY-MM-DD HH:mm:ss',
|
|
|
+ // getPopupContainer: getAutoScrollContainer,
|
|
|
+ // },
|
|
|
+ // colProps: {
|
|
|
+ // span: 4,
|
|
|
+ // },
|
|
|
+ // },
|
|
|
+ ],
|
|
|
+ },
|
|
|
+ fetchSetting: {
|
|
|
+ listField: 'records',
|
|
|
+ },
|
|
|
+ pagination: {
|
|
|
+ current: 1,
|
|
|
+ pageSize: 10,
|
|
|
+ pageSizeOptions: ['10', '30', '50', '100'],
|
|
|
+ showQuickJumper: false,
|
|
|
+ },
|
|
|
+ },
|
|
|
+ });
|
|
|
+ //注册table数据
|
|
|
+ const [registerTable, { reload, setLoading, setPagination, getPaginationRef }] = tableContext;
|
|
|
async function getDataSource() {
|
|
|
- const pagination = getPaginationRef();
|
|
|
- const res = await defHttp.post({
|
|
|
- url: '/ventanaly-device/safety/ventanalyDeviceInfo/getZrfyInfoLogList',
|
|
|
- data: { sysId: props.sysId, pageNo: pagination['current'], pageSize: pagination['pageSize'] },
|
|
|
- });
|
|
|
- setPagination({
|
|
|
- total: res['total'] || 0,
|
|
|
- current: res['current'] || 1,
|
|
|
- pageSize: res['size'] || 1,
|
|
|
- size: res['pages'] || 1,
|
|
|
- });
|
|
|
- if (res.records && res.records.length > 0) {
|
|
|
- dataSource.value = res.records;
|
|
|
+ if (props.type == 'chart') {
|
|
|
+ const res = await defHttp.post({
|
|
|
+ url: '/ventanaly-device/safety/ventanalyDeviceInfo/getZrfyInfoLogList',
|
|
|
+ data: { sysId: props.sysId, pageNo: currentPage.value, pageSize: pageSize.value },
|
|
|
+ });
|
|
|
+ total.value = res['total'];
|
|
|
+ if (res.records && res.records.length > 0) {
|
|
|
+ dataSource.value = res.records;
|
|
|
+ }
|
|
|
+ } else {
|
|
|
+ const pagination = getPaginationRef();
|
|
|
+ if (pagination) {
|
|
|
+ const res = await defHttp.post({
|
|
|
+ url: '/ventanaly-device/safety/ventanalyDeviceInfo/getZrfyInfoLogList',
|
|
|
+ data: { sysId: props.sysId, pageNo: pagination['current'], pageSize: pagination['pageSize'] },
|
|
|
+ });
|
|
|
+ setPagination({
|
|
|
+ total: res['total'] || 0,
|
|
|
+ current: res['current'] || 1,
|
|
|
+ pageSize: res['size'] || 1,
|
|
|
+ size: res['pages'] || 1,
|
|
|
+ });
|
|
|
+ if (res.records && res.records.length > 0) {
|
|
|
+ dataSource.value = res.records;
|
|
|
+ }
|
|
|
+ }
|
|
|
}
|
|
|
}
|
|
|
watch(
|
|
@@ -126,70 +214,6 @@
|
|
|
}
|
|
|
);
|
|
|
|
|
|
- // 列表页面公共参数、方法
|
|
|
- const { tableContext } = useListPage({
|
|
|
- tableProps: {
|
|
|
- dataSource: dataSource,
|
|
|
- columns: columns,
|
|
|
- canResize: true,
|
|
|
- showTableSetting: false,
|
|
|
- showActionColumn: false,
|
|
|
-
|
|
|
- bordered: false,
|
|
|
- size: 'small',
|
|
|
- scroll: tableScroll,
|
|
|
- showIndexColumn: true,
|
|
|
- formConfig: {
|
|
|
- labelAlign: 'left',
|
|
|
- showAdvancedButton: false,
|
|
|
- showSubmitButton: false,
|
|
|
- schemas: [
|
|
|
- {
|
|
|
- field: 'createTime_begin',
|
|
|
- label: '开始时间',
|
|
|
- component: 'DatePicker',
|
|
|
- defaultValue: dayjs().add(-30, 'day').format('YYYY-MM-DD HH:mm:ss'),
|
|
|
- required: true,
|
|
|
- componentProps: {
|
|
|
- showTime: true,
|
|
|
- valueFormat: 'YYYY-MM-DD HH:mm:ss',
|
|
|
- getPopupContainer: getAutoScrollContainer,
|
|
|
- },
|
|
|
- colProps: {
|
|
|
- span: 4,
|
|
|
- },
|
|
|
- },
|
|
|
- {
|
|
|
- field: 'createTime_end',
|
|
|
- label: '结束时间',
|
|
|
- component: 'DatePicker',
|
|
|
- defaultValue: dayjs(),
|
|
|
- required: true,
|
|
|
- componentProps: {
|
|
|
- showTime: true,
|
|
|
- valueFormat: 'YYYY-MM-DD HH:mm:ss',
|
|
|
- getPopupContainer: getAutoScrollContainer,
|
|
|
- },
|
|
|
- colProps: {
|
|
|
- span: 4,
|
|
|
- },
|
|
|
- },
|
|
|
- ],
|
|
|
- },
|
|
|
- fetchSetting: {
|
|
|
- listField: 'records',
|
|
|
- },
|
|
|
- pagination: {
|
|
|
- current: 1,
|
|
|
- pageSize: 10,
|
|
|
- pageSizeOptions: ['10', '30', '50', '100'],
|
|
|
- showQuickJumper: false,
|
|
|
- },
|
|
|
- },
|
|
|
- });
|
|
|
- //注册table数据
|
|
|
- const [registerTable, { reload, setLoading, setPagination, getPaginationRef }] = tableContext;
|
|
|
-
|
|
|
onMounted(async () => {
|
|
|
await getDataSource();
|
|
|
watch([() => getPaginationRef()['current'], () => getPaginationRef()['pageSize']], async () => {
|