物联设备增加批次查询条件,表格内部增加竖向滚动条
This commit is contained in:
parent
214e6c8134
commit
ef55e801ee
|
|
@ -4,13 +4,19 @@
|
||||||
<a-form ref="formRef" :model="queryParam" :label-col="labelCol"
|
<a-form ref="formRef" :model="queryParam" :label-col="labelCol"
|
||||||
:wrapper-col="wrapperCol">
|
:wrapper-col="wrapperCol">
|
||||||
<a-row :gutter="24">
|
<a-row :gutter="24">
|
||||||
<a-col :lg="6">
|
<a-col :lg="5">
|
||||||
|
<a-form-item name="batchNo">
|
||||||
|
<template #label><span title="设备批次">设备批次</span></template>
|
||||||
|
<a-input v-model:value="queryParam.batchNo" placeholder="请输入设备批次" allow-clear />
|
||||||
|
</a-form-item>
|
||||||
|
</a-col>
|
||||||
|
<a-col :lg="5">
|
||||||
<a-form-item name="nuName">
|
<a-form-item name="nuName">
|
||||||
<template #label><span title="区域名称">区域名称</span></template>
|
<template #label><span title="区域名称">区域名称</span></template>
|
||||||
<a-input v-model:value="queryParam.nuName" placeholder="请输入区域名称" allow-clear />
|
<a-input v-model:value="queryParam.nuName" placeholder="请输入区域名称" allow-clear />
|
||||||
</a-form-item>
|
</a-form-item>
|
||||||
</a-col>
|
</a-col>
|
||||||
<a-col :lg="6">
|
<a-col :lg="5">
|
||||||
<a-form-item name="dimension">
|
<a-form-item name="dimension">
|
||||||
<template #label><span title="设备维度">设备维度</span></template>
|
<template #label><span title="设备维度">设备维度</span></template>
|
||||||
<a-select v-model:value="queryParam.dimension" placeholder="请选择设备维度" allow-clear>
|
<a-select v-model:value="queryParam.dimension" placeholder="请选择设备维度" allow-clear>
|
||||||
|
|
@ -19,19 +25,17 @@
|
||||||
</a-select>
|
</a-select>
|
||||||
</a-form-item>
|
</a-form-item>
|
||||||
</a-col>
|
</a-col>
|
||||||
<a-col :lg="6">
|
<a-col :lg="5">
|
||||||
<a-form-item name="deviceType">
|
<a-form-item name="deviceType">
|
||||||
<template #label><span title="设备类型">设备类型</span></template>
|
<template #label><span title="设备类型">设备类型</span></template>
|
||||||
<j-dict-select-tag v-model:value="queryParam.deviceType" :showLabel="false" dictCode="tplink_device_type" placeholder="请选择设备类型" allow-clear />
|
<j-dict-select-tag v-model:value="queryParam.deviceType" :showLabel="false" dictCode="tplink_device_type" placeholder="请选择设备类型" allow-clear />
|
||||||
</a-form-item>
|
</a-form-item>
|
||||||
</a-col>
|
</a-col>
|
||||||
<a-col :xl="6" :lg="7" :md="8" :sm="24">
|
<a-col :lg="4">
|
||||||
<span style="float: left; overflow: hidden" class="table-page-search-submitButtons">
|
<span style="float: left; overflow: hidden" class="table-page-search-submitButtons">
|
||||||
<a-col :lg="6">
|
|
||||||
<a-button type="primary" preIcon="ant-design:search-outlined" @click="searchQuery">查询</a-button>
|
<a-button type="primary" preIcon="ant-design:search-outlined" @click="searchQuery">查询</a-button>
|
||||||
<a-button type="primary" preIcon="ant-design:reload-outlined" @click="searchReset"
|
<a-button type="primary" preIcon="ant-design:reload-outlined" @click="searchReset"
|
||||||
style="margin-left: 8px">重置</a-button>
|
style="margin-left: 8px">重置</a-button>
|
||||||
</a-col>
|
|
||||||
</span>
|
</span>
|
||||||
</a-col>
|
</a-col>
|
||||||
</a-row>
|
</a-row>
|
||||||
|
|
|
||||||
|
|
@ -5,6 +5,12 @@
|
||||||
<a-form ref="formRef" :model="queryParam" :label-col="labelCol"
|
<a-form ref="formRef" :model="queryParam" :label-col="labelCol"
|
||||||
:wrapper-col="wrapperCol">
|
:wrapper-col="wrapperCol">
|
||||||
<a-row :gutter="24">
|
<a-row :gutter="24">
|
||||||
|
<a-col :lg="6">
|
||||||
|
<a-form-item name="batchNo">
|
||||||
|
<template #label><span title="设备批次">设备批次</span></template>
|
||||||
|
<a-input v-model:value="queryParam.batchNo" placeholder="请输入设备批次" allow-clear />
|
||||||
|
</a-form-item>
|
||||||
|
</a-col>
|
||||||
<a-col :lg="6">
|
<a-col :lg="6">
|
||||||
<a-form-item name="dimension">
|
<a-form-item name="dimension">
|
||||||
<template #label><span title="设备维度">设备维度</span></template>
|
<template #label><span title="设备维度">设备维度</span></template>
|
||||||
|
|
@ -35,24 +41,23 @@
|
||||||
</a-form>
|
</a-form>
|
||||||
</div>
|
</div>
|
||||||
<!--引用表格-->
|
<!--引用表格-->
|
||||||
<BasicTable @register="registerTable">
|
<div class="container-height">
|
||||||
<!--插槽:table标题-->
|
<BasicTable @register="registerTable" >
|
||||||
<template #tableTitle>
|
<!--操作栏-->
|
||||||
</template>
|
<template #action="{ record }">
|
||||||
<!--操作栏-->
|
<TableAction :actions="getTableAction(record)"/>
|
||||||
<template #action="{ record }">
|
</template>
|
||||||
<TableAction :actions="getTableAction(record)"/>
|
<template v-slot:bodyCell="{ column, record, index, text }">
|
||||||
</template>
|
</template>
|
||||||
<template v-slot:bodyCell="{ column, record, index, text }">
|
</BasicTable>
|
||||||
</template>
|
</div>
|
||||||
</BasicTable>
|
|
||||||
<!-- 表单区域 -->
|
<!-- 表单区域 -->
|
||||||
<DevicePreviewFormModal ref="formDrawer" @success="handleSuccess" />
|
<DevicePreviewFormModal ref="formDrawer" @success="handleSuccess" />
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script lang="ts" name="iotManager-areaList" setup>
|
<script lang="ts" name="iotManager-areaList" setup>
|
||||||
import {ref, reactive, defineExpose, nextTick, createVNode} from 'vue';
|
import {ref, reactive, defineExpose, nextTick, createVNode, computed} from 'vue';
|
||||||
import { BasicTable, useTable, TableAction } from '/@/components/Table';
|
import { BasicTable, useTable, TableAction } from '/@/components/Table';
|
||||||
import { useListPage } from '/@/hooks/system/useListPage';
|
import { useListPage } from '/@/hooks/system/useListPage';
|
||||||
import { previewColumns } from '../../manager.data';
|
import { previewColumns } from '../../manager.data';
|
||||||
|
|
@ -63,6 +68,7 @@ import JDictSelectTag from '/@/components/Form/src/jeecg/components/JDictSelectT
|
||||||
import {Modal} from "ant-design-vue";
|
import {Modal} from "ant-design-vue";
|
||||||
import {ExclamationCircleOutlined} from "@ant-design/icons-vue";
|
import {ExclamationCircleOutlined} from "@ant-design/icons-vue";
|
||||||
import {useMethods} from "@/hooks/system/useMethods";
|
import {useMethods} from "@/hooks/system/useMethods";
|
||||||
|
import {useResponsive} from "@/hooks/web/useResponsive";
|
||||||
|
|
||||||
const { handleExportXls} = useMethods();
|
const { handleExportXls} = useMethods();
|
||||||
const formRef = ref();
|
const formRef = ref();
|
||||||
|
|
@ -70,16 +76,23 @@ const queryParam = reactive<any>({});
|
||||||
const formDrawer = ref();
|
const formDrawer = ref();
|
||||||
const orgCode = ref<any>('');
|
const orgCode = ref<any>('');
|
||||||
const userStore = useUserStore();
|
const userStore = useUserStore();
|
||||||
|
const { screenEnum, screenWidth } = useResponsive();
|
||||||
|
// 计算动态高度
|
||||||
|
const scrollY = computed(() => {
|
||||||
|
// 大屏幕(≥1600px)使用 71vh,否则使用 66.5vh
|
||||||
|
return screenWidth.value >= screenEnum.XXL ? '60.8vh' : '58.5vh';
|
||||||
|
});
|
||||||
//注册table数据
|
//注册table数据
|
||||||
const { prefixCls, tableContext, onExportXls, onImportXls } = useListPage({
|
const { prefixCls, tableContext, onExportXls, onImportXls } = useListPage({
|
||||||
tableProps: {
|
tableProps: {
|
||||||
title: '设备清单',
|
|
||||||
api: previewList,
|
api: previewList,
|
||||||
columns: previewColumns,
|
columns: previewColumns,
|
||||||
canResize: false,
|
canResize: false,
|
||||||
useSearchForm: false,
|
useSearchForm: false,
|
||||||
showIndexColumn: true,
|
showIndexColumn: true,
|
||||||
|
showTableSetting: false,
|
||||||
immediate: false,
|
immediate: false,
|
||||||
|
scroll: { y: scrollY.value },
|
||||||
pagination: {
|
pagination: {
|
||||||
current: 1,
|
current: 1,
|
||||||
pageSize: 15,
|
pageSize: 15,
|
||||||
|
|
@ -174,6 +187,10 @@ defineExpose({
|
||||||
|
|
||||||
<style lang="less" scoped>
|
<style lang="less" scoped>
|
||||||
|
|
||||||
|
.container-height {
|
||||||
|
height: 57vh;
|
||||||
|
}
|
||||||
|
|
||||||
.jeecg-basic-table-form-container {
|
.jeecg-basic-table-form-container {
|
||||||
padding: 0;
|
padding: 0;
|
||||||
.table-page-search-submitButtons {
|
.table-page-search-submitButtons {
|
||||||
|
|
|
||||||
|
|
@ -4,7 +4,7 @@ import {FormSchema} from '/@/components/Table';
|
||||||
//列表数据
|
//列表数据
|
||||||
export const columns: BasicColumn[] = [
|
export const columns: BasicColumn[] = [
|
||||||
{
|
{
|
||||||
title: '批次',
|
title: '设备批次',
|
||||||
align: "center",
|
align: "center",
|
||||||
dataIndex: 'batchNo',
|
dataIndex: 'batchNo',
|
||||||
},
|
},
|
||||||
|
|
@ -79,7 +79,7 @@ export const columns: BasicColumn[] = [
|
||||||
//列表数据
|
//列表数据
|
||||||
export const previewColumns: BasicColumn[] = [
|
export const previewColumns: BasicColumn[] = [
|
||||||
{
|
{
|
||||||
title: '批次',
|
title: '设备批次',
|
||||||
align: "center",
|
align: "center",
|
||||||
dataIndex: 'batchNo',
|
dataIndex: 'batchNo',
|
||||||
},
|
},
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue