Commit 2471262385230764527b971d9fadfd5fc6876481

Authored by ww
1 parent a5a22bb3

feat: data component list add search conditions

... ... @@ -14,9 +14,9 @@ VITE_PUBLIC_PATH = /
14 14 # VITE_PROXY = [["/api","http://101.133.234.90:8080/api"]]
15 15 # 线上测试环境
16 16 # VITE_PROXY = [["/api","http://localhost:8080/api"],["/thingskit-drawio","http://localhost:3000/"]]
17   -VITE_PROXY = [["/api","https://dev.thingskit.com/api"],["/thingskit-drawio","http://localhost:3000/"]]
  17 +# VITE_PROXY = [["/api","https://dev.thingskit.com/api"],["/thingskit-drawio","http://localhost:3000/"]]
18 18 # VITE_PROXY = [["/api","http://121.37.251.8:8080/api"],["/thingskit-drawio","http://localhost:3000/"]]
19   -# VITE_PROXY = [["/api","http://192.168.10.111:8080/api"],["/thingskit-drawio","http://192.168.10.106:8080/api"]]
  19 +VITE_PROXY = [["/api","http://192.168.10.111:8080/api"],["/thingskit-drawio","http://192.168.10.106:8080/api"]]
20 20
21 21 # 实时数据的ws地址
22 22 # VITE_WEB_SOCKET = ws://localhost:8080/api/ws/plugins/telemetry?token=
... ...
  1 +import { getOrganizationList } from '/@/api/system/system';
1 2 import { FormSchema } from '/@/components/Form';
  3 +import { copyTransFun } from '/@/utils/fnUtils';
2 4 export enum ViewType {
3 5 PRIVATE_VIEW = 'PRIVATE_VIEW',
4 6 PUBLIC_VIEW = 'PUBLIC_VIEW',
... ... @@ -9,12 +11,29 @@ export const formSchema: FormSchema[] = [
9 11 field: 'name',
10 12 label: '名称',
11 13 component: 'Input',
12   - required: true,
  14 + rules: [{ required: true, message: '请输入看板名称' }],
13 15 componentProps: {
14 16 placeholder: '请输入看板名称',
15 17 },
16 18 },
17 19 {
  20 + field: 'organizationId',
  21 + component: 'ApiTreeSelect',
  22 + label: '组织',
  23 + rules: [{ required: true, message: '组织为必填项' }],
  24 + componentProps() {
  25 + return {
  26 + placeholder: '请选择组织',
  27 + api: async () => {
  28 + const data = await getOrganizationList();
  29 + copyTransFun(data as any as any[]);
  30 + return data;
  31 + },
  32 + getPopupContainer: () => document.body,
  33 + };
  34 + },
  35 + },
  36 + {
18 37 field: 'viewType',
19 38 label: '名称',
20 39 component: 'RadioGroup',
... ...
  1 +import { getOrganizationList } from '/@/api/system/system';
  2 +import { FormSchema } from '/@/components/Form';
  3 +import { ColEx } from '/@/components/Form/src/types';
  4 +import { useGridLayout } from '/@/hooks/component/useGridLayout';
  5 +import { copyTransFun } from '/@/utils/fnUtils';
  6 +
  7 +export const formSchema: FormSchema[] = [
  8 + {
  9 + field: 'name',
  10 + label: '看板名称',
  11 + component: 'Input',
  12 + // colProps: { span: 10 },
  13 + colProps: useGridLayout(2, 3, 4) as unknown as ColEx,
  14 + },
  15 + {
  16 + field: 'organizationId',
  17 + component: 'ApiTreeSelect',
  18 + label: '组织',
  19 + // colProps: { span: 10 },
  20 + colProps: useGridLayout(2, 3, 4) as unknown as ColEx,
  21 + componentProps() {
  22 + return {
  23 + placeholder: '请选择组织',
  24 + api: async () => {
  25 + const data = await getOrganizationList();
  26 + copyTransFun(data as any as any[]);
  27 + return data;
  28 + },
  29 + getPopupContainer: () => document.body,
  30 + };
  31 + },
  32 + },
  33 +];
... ...
... ... @@ -19,6 +19,8 @@
19 19 import { computed } from '@vue/reactivity';
20 20 import { usePermission } from '/@/hooks/web/usePermission';
21 21 import { encode } from './config/config';
  22 + import { useForm, BasicForm } from '/@/components/Form';
  23 + import { formSchema } from './config/searchForm';
22 24
23 25 const ListItem = List.Item;
24 26 const router = useRouter();
... ... @@ -28,6 +30,21 @@
28 30 const listEL = ref();
29 31 const loading = ref(false);
30 32 const dataBoardList = ref<DataBoardRecord[]>([]);
  33 +
  34 + const [searchFormRegister, searchFormMethod] = useForm({
  35 + schemas: formSchema,
  36 + labelWidth: 80,
  37 + layout: 'inline',
  38 + submitButtonOptions: {
  39 + loading: loading,
  40 + },
  41 + submitFunc: async () => {
  42 + try {
  43 + await getDatasource();
  44 + } catch (error) {}
  45 + },
  46 + });
  47 +
31 48 //分页相关
32 49 const page = ref(1);
33 50 const pageSize = ref(10);
... ... @@ -87,9 +104,11 @@
87 104 const getDatasource = async () => {
88 105 try {
89 106 loading.value = true;
  107 + const params = searchFormMethod.getFieldsValue() || {};
90 108 const { total, items } = await getDataBoardList({
91 109 page: unref(paginationProp).current,
92 110 pageSize: unref(paginationProp).pageSize,
  111 + ...params,
93 112 });
94 113 dataBoardList.value = items;
95 114 paginationProp.value.total = total;
... ... @@ -176,12 +195,16 @@
176 195
177 196 <template>
178 197 <PageWrapper>
179   - <div class="flex mb-6 items-center bg-light-100 h-78px">
  198 + <div class="flex items-center mb-3 bg-light-100 h-78px">
180 199 <div class="text-lg ml-30px mr-9px font-bold">自定义看板</div>
181 200 <Authority value="api:yt:data_board:add:post">
182 201 <Button type="primary" @click="handleOpenDetailModal">创建看板</Button>
183 202 </Authority>
184 203 </div>
  204 + <div class="bg-light-100 mb-6 w-full p-3 search-form">
  205 + <BasicForm class="flex-auto w-full" @register="searchFormRegister" />
  206 + </div>
  207 + <!-- <div> </div> -->
185 208 <Spin :spinning="loading">
186 209 <List
187 210 ref="listEL"
... ... @@ -266,4 +289,19 @@
266 289 background-image: url('/@/assets/svg/component.svg');
267 290 }
268 291 }
  292 +
  293 + .search-form {
  294 + width: 100%;
  295 + form {
  296 + width: 100%;
  297 + :deep(.ant-row) {
  298 + width: 100%;
  299 + }
  300 +
  301 + :deep(.ant-row > div:last-child) {
  302 + flex: 1;
  303 + max-width: 100%;
  304 + }
  305 + }
  306 + }
269 307 </style>
... ...