| | |
| | | import React, { useState, useRef, useEffect } from 'react'; |
| | | import React, { useState, useRef, useEffect, useMemo } from 'react'; |
| | | import { |
| | | ProForm, |
| | | ProFormDigit, |
| | |
| | | import Http from '@/utils/http'; |
| | | |
| | | const Edit = (props) => { |
| | | const [menuType, setMenuType] = useState(0); |
| | | const [form] = Form.useForm(); |
| | | const { } = props; |
| | | |
| | |
| | | { label: '菜单', value: 0 }, |
| | | { label: '按钮', value: 1 }, |
| | | ]} |
| | | fieldProps={{ |
| | | defaultValue: 0, |
| | | onChange: (e) => { |
| | | setMenuType(e); |
| | | }, |
| | | }} |
| | | /> |
| | | </ProForm.Group> |
| | | <ProForm.Group> |
| | |
| | | <ProFormText |
| | | name="icon" |
| | | label="菜单图标" |
| | | hidden={menuType !== 0} |
| | | colProps={{ md: 12, xl: 12 }} |
| | | placeholder="请输入" |
| | | /> |
| | |
| | | { label: '正常', value: 1 }, |
| | | { label: '禁用', value: 0 }, |
| | | ]} |
| | | /> |
| | | <ProFormDateTimePicker |
| | | name="createTime" |
| | | label="添加时间" |
| | | colProps={{ md: 12, xl: 12 }} |
| | | placeholder="请选择" |
| | | transform={(value) => moment(value).toISOString()} |
| | | /> |
| | | </ProForm.Group> |
| | | <ProForm.Group> |
| | | <ProFormSelect |
| | | name="createBy" |
| | | label="添加人员" |
| | | colProps={{ md: 12, xl: 12 }} |
| | | fieldProps={{ precision: 0 }} |
| | | placeholder="请选择" |
| | | showSearch |
| | | debounceTime={300} |
| | | request={async ({ keyWords }) => { |
| | | const resp = await Http.doPostForm('api/user/query', { condition: keyWords }); |
| | | return resp.data; |
| | | }} |
| | | /> |
| | | <ProFormDateTimePicker |
| | | name="updateTime" |
| | | label="修改时间" |
| | | colProps={{ md: 12, xl: 12 }} |
| | | placeholder="请选择" |
| | | transform={(value) => moment(value).toISOString()} |
| | | /> |
| | | </ProForm.Group> |
| | | <ProForm.Group> |
| | | <ProFormSelect |
| | | name="updateBy" |
| | | label="修改人员" |
| | | colProps={{ md: 12, xl: 12 }} |
| | | fieldProps={{ precision: 0 }} |
| | | placeholder="请选择" |
| | | showSearch |
| | | debounceTime={300} |
| | | request={async ({ keyWords }) => { |
| | | const resp = await Http.doPostForm('api/user/query', { condition: keyWords }); |
| | | return resp.data; |
| | | }} |
| | | /> |
| | | </ProForm.Group> |
| | | |
| | |
| | | hidden: false, |
| | | width: 100, |
| | | render: (_, record) => { |
| | | console.log(_); |
| | | return <span style={{ fontWeight: "bold" }}>{_}</span> |
| | | return <span st yle={{ fontWeight: "bold" }}>{_}</span> |
| | | } |
| | | }, |
| | | { |
| | |
| | | }} |
| | | request={(params, sorter, filter) => |
| | | Http.doPostPromise('/api/menu/tree', { ...params, ...searchParam }, (res) => { |
| | | console.log(res.data); |
| | | // console.log(res); return; |
| | | // const records = res.data.records; |
| | | // console.log(records); |
| | | |
| | | // const rootMenu = { id: 0, label: '主类目', children: [], value: 0 }; |
| | | // const memuData = buildTreeData(records, 'menuId', 'menuName', '', '', ''); |
| | | // rootMenu.children = memuData; |
| | | // const treeData = []; |
| | | // treeData.push(rootMenu); |
| | | // setTreeData(treeData); |
| | | |
| | | setTreeData(res.data) |
| | | return { |
| | | data: res.data, |
| | | success: true, |
| | |
| | | <Edit |
| | | open={modalVisible} |
| | | values={currentRow || {}} |
| | | treeData = {treeData} |
| | | onCancel={ |
| | | () => { |
| | | setModalVisible(false); |
| | |
| | | actionRef.current.reload(); |
| | | } |
| | | } |
| | | } |
| | | } |
| | | }} |
| | | /> |
| | | </PageContainer> |
| | | ); |