Commit 2471262385230764527b971d9fadfd5fc6876481
1 parent
a5a22bb3
feat: data component list add search conditions
Showing
4 changed files
with
94 additions
and
4 deletions
| ... | ... | @@ -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', | ... | ... |
src/views/visual/board/config/searchForm.ts
0 → 100644
| 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> | ... | ... |