@jiangood/open-admin 1.0.0

package/src/pages/system/sysManual/index.jsx

@@ -0,0 +1,127 @@
+import {PlusOutlined} from '@ant-design/icons'
+import {Button, Form, Input, Modal, Popconfirm} from 'antd'
+import React from 'react'
+import {ButtonList, FieldUploadFile, HttpUtils, Page, ProTable} from "../../../framework";
+
+
+export default class extends React.Component {
+
+    state = {
+        formValues: {},
+        formOpen: false
+    }
+
+    formRef = React.createRef()
+    tableRef = React.createRef()
+
+    columns = [
+
+        {
+            title: '名称',
+            dataIndex: 'name',
+
+
+        },
+
+        {
+            title: '版本',
+            dataIndex: 'version',
+            render(version) {
+                return 'v' +version;
+            }
+        },
+
+        {
+            title: '文件',
+            dataIndex: 'fileId',
+            render(id){
+               const url = 'admin/sysFile/preview/' + id;
+                return <a href={url} target='_blank'>查看文件</a>
+            }
+
+        },
+        {
+            title: '操作',
+            dataIndex: 'option',
+            render: (_, record) => (
+                <ButtonList>
+                    <Button size='small' perm='sysManual:save' onClick={() => this.handleEdit(record)}>编辑</Button>
+                    <Popconfirm perm='sysManual:delete' title='是否确定删除操作手册'  onConfirm={() => this.handleDelete(record)}>
+                        <Button size='small'>删除</Button>
+                    </Popconfirm>
+                </ButtonList>
+            ),
+        },
+
+    ]
+
+    handleAdd = () => {
+        this.setState({formOpen: true, formValues: {}})
+    }
+
+    handleEdit = record => {
+        this.setState({formOpen: true, formValues: record})
+    }
+
+
+    onFinish = values => {
+        HttpUtils.post('admin/sysManual/save', values).then(rs => {
+            this.setState({formOpen: false})
+            this.tableRef.current.reload()
+        })
+    }
+
+
+    handleDelete = record => {
+        HttpUtils.get('admin/sysManual/delete', {id: record.id}).then(rs => {
+            this.tableRef.current.reload()
+        })
+    }
+
+    render() {
+        return <Page>
+            <ProTable
+                actionRef={this.tableRef}
+                toolBarRender={(params, {selectedRows, selectedRowKeys}) => {
+                    return <ButtonList>
+                        <Button perm='sysManual:save' type='primary' onClick={this.handleAdd}>
+                            <PlusOutlined/> 新增
+                        </Button>
+                    </ButtonList>
+                }}
+                request={(params) => HttpUtils.get('admin/sysManual/page', params)}
+                columns={this.columns}
+
+            />
+
+            <Modal title='操作手册'
+                   open={this.state.formOpen}
+                   onOk={() => this.formRef.current.submit()}
+                   onCancel={() => this.setState({formOpen: false})}
+                   destroyOnHidden
+                   maskClosable={false}
+            >
+
+                <Form ref={this.formRef} labelCol={{flex: '100px'}}
+                      initialValues={this.state.formValues}
+                      onFinish={this.onFinish}
+                >
+                    <Form.Item name='id' noStyle></Form.Item>
+
+                    <Form.Item label='名称' name='name' rules={[{required: true}]}>
+                        <Input/>
+                    </Form.Item>
+
+                    <Form.Item label='文件' name='fileId' rules={[{required: true}]}>
+                        <FieldUploadFile accept=".pdf" maxCount={1} />
+                    </Form.Item>
+
+                </Form>
+            </Modal>
+        </Page>
+
+
+    }
+}
+
+

package/src/pages/system/user/UserPerm.jsx

@@ -0,0 +1,97 @@
+import {Form, Modal} from 'antd';
+import React from 'react';
+import {FieldDictSelect, FieldRemoteSelectMultiple, FieldSysOrgTree, HttpUtils} from "../../../framework";
+
+
+export default class UserPerm extends React.Component {
+
+
+    state = {
+        visible: false,
+
+        confirmLoading: false,
+
+        formValues: {
+            dataPermType: null
+        },
+    }
+    show(item) {
+        this.setState({visible: true})
+
+        HttpUtils.get('admin/sysUser/getPermInfo', {id: item.id}).then(rs => {
+            this.setState({formValues: rs})
+            this.formRef.current.setFieldsValue(rs)
+        })
+    }
+
+    handleSave = (values) => {
+        values.grantOrgIdList = this.state.checked
+
+        this.setState({
+            confirmLoading: true
+        })
+
+
+        HttpUtils.post('admin/sysUser/grantPerm', values).then(rs => {
+            this.setState({
+                visible: false,
+                confirmLoading: false
+            })
+            this.props.onOk()
+        }).finally(()=>{
+            this.setState({
+                confirmLoading: false
+            })
+
+        })
+    }
+
+
+
+    formRef = React.createRef()
+
+
+    render() {
+        let {visible, confirmLoading} = this.state
+
+        return <Modal
+            title="授权"
+            destroyOnHidden
+            width={600}
+            open={visible}
+            confirmLoading={confirmLoading}
+            onCancel={() => this.setState({visible: false})}
+            onOk={() => this.formRef.current.submit()}
+        >
+
+            <Form ref={this.formRef}
+                  onFinish={this.handleSave}
+                  onValuesChange={(change, values) => {
+                      this.setState({formValues: values})
+                  }}
+                  labelCol={{flex: '100px'}}
+            >
+                <Form.Item name='id' noStyle></Form.Item>
+                <Form.Item label='角色' name='roleIds' rules={[{required: true}]}>
+                    <FieldRemoteSelectMultiple url='admin/sysRole/options'/>
+                </Form.Item>
+                <Form.Item label='数据权限' name='dataPermType' rules={[{required: true}]}>
+                    <FieldDictSelect typeCode='dataPermType' />
+                </Form.Item>
+
+
+                {this.state.formValues.dataPermType === 'CUSTOM' && <>
+                    <Form.Item label='组织机构' name='orgIds'>
+                      <FieldSysOrgTree />
+                    </Form.Item>
+                </>}
+
+
+            </Form>
+
+
+        </Modal>
+    }
+
+
+}

package/src/pages/system/user/index.jsx

@@ -0,0 +1,258 @@
+import {PlusOutlined} from '@ant-design/icons';
+import {Button, Form, Input, Modal, Popconfirm, Splitter, Tabs} from 'antd';
+import React from 'react';
+import {
+    ButtonList, DictUtils,
+    FieldBoolean,
+    FieldSysOrgTreeSelect, HttpUtils,
+    OrgTree,
+    Page,
+    ProTable,
+    RoleTree
+} from "../../../framework";
+import UserPerm from "./UserPerm";
+
+export default class extends React.Component {
+
+    state = {
+        showAddForm: false,
+        showEditForm: false,
+        formValues: {},
+
+        currentOrgId: null,
+        currentRoleId:null,
+    }
+    permRef = React.createRef();
+
+    formRef = React.createRef()
+    tableRef = React.createRef()
+
+    columns = [
+        {
+            title: '单位',
+            dataIndex: 'unitLabel',
+        },
+        {
+            title: '部门',
+            dataIndex: 'deptLabel',
+        },
+        {
+            title: '姓名',
+            dataIndex: 'name',
+            sorter: true
+        },
+        {
+            title: '登录账号',
+            dataIndex: 'account',
+            sorter: true
+        },
+
+
+        {
+            title: '手机',
+            dataIndex: 'phone'
+        },
+        {
+            title: '邮箱',
+            dataIndex: 'email'
+        },
+
+        {
+            title: '角色',
+            dataIndex: 'roleIds',
+            render: (_, row) => {
+                if (row.roleNames) {
+                    return row.roleNames.join(',')
+                }
+            },
+        },
+        {
+            title: '状态',
+            dataIndex: 'enabled',
+            render(v) {
+                return v == null ? null : (v ? '是' : '否')
+            },
+        },
+        {
+            title: '数据权限',
+            dataIndex: 'dataPermType',
+            render(v) {
+                return DictUtils.dictTag('dataPermType', v)
+            }
+        },
+
+        {
+            title: '创建时间',
+            dataIndex: 'createTime',
+        },
+        {
+            title: '操作',
+            dataIndex: 'option',
+            fixed:'right',
+            render: (_, record) => {
+                return <ButtonList>
+                    <Button size='small' perm='sysUser:save' onClick={() => this.handleEdit(record)}> 编辑 </Button>
+
+                    <Button size='small' perm='sysUser:grantPerm'
+                            onClick={() => this.permRef.current.show(record)}> 授权 </Button>
+
+                    <Popconfirm perm='sysUser:resetPwd' title='确认重置密码？' onConfirm={() => this.resetPwd(record)}>
+                        <Button  size='small' >重置密码</Button>
+                    </Popconfirm>
+
+                    <Popconfirm perm='sysUser:delete' title={'是否确定删除用户'}
+                                onConfirm={() => this.handleDelete(record)}>
+                        <Button  size='small' >删除</Button>
+                    </Popconfirm>
+                </ButtonList>;
+            },
+        },
+    ];
+
+
+
+
+    resetPwd(row) {
+        HttpUtils.post('admin/sysUser/resetPwd', {id: row.id}).then(rs => {
+            Modal.success({
+                title: '重置密码成功',
+                content: rs
+            })
+        })
+    }
+
+
+    handleDelete = r => {
+        HttpUtils.get('admin/sysUser/delete', {id: r.id}).then(rs => {
+            this.tableRef.current.reload();
+        })
+    }
+
+
+
+    onSelectOrg = (key) => {
+        this.setState({currentOrgId: key}, () => this.tableRef.current.reload())
+    }
+    onSelectRole = (key) => {
+        this.setState({currentRoleId: key}, () => this.tableRef.current.reload())
+    }
+
+
+    handleAdd = () => {
+        this.setState({formOpen: true, formValues: {}})
+    }
+
+    handleEdit = record => {
+        record.deptId = record.deptId || record.unitId
+        this.setState({formOpen: true, formValues: record})
+    }
+
+
+    onFinish = values => {
+        HttpUtils.post('admin/sysUser/save', values).then(rs => {
+            this.setState({formOpen: false})
+            this.tableRef.current.reload()
+        })
+    }
+
+    render() {
+
+        return <Page >
+            <Splitter >
+                <Splitter.Panel defaultSize={400}   >
+                    <Tabs
+                        type='card'
+                        size='small'
+                        items={[
+                            {
+                                key: 'org',
+                                label: '按组织机构',
+                                children:  <OrgTree onChange={this.onSelectOrg}/>
+                            },
+                            {
+                                key: 'role',
+                                label: '按角色',
+                                children: <RoleTree onSelect={this.onSelectRole}/>
+                            }
+                        ]}/>
+
+                </Splitter.Panel>
+                <Splitter.Panel style={{paddingLeft:16}}>
+                    <ProTable
+                        actionRef={this.tableRef}
+                        toolBarRender={() => {
+                            return <ButtonList>
+                                <Button
+                                    perm='sysUser:save'
+                                    type="primary"
+                                    onClick={this.handleAdd}>
+                                    <PlusOutlined/> 新增
+                                </Button>
+
+
+                            </ButtonList>
+                        }}
+                        showToolbarSearch
+                        request={(params) => {
+                            params.orgId = this.state.currentOrgId
+                            params.roleId = this.state.currentRoleId
+                            return HttpUtils.get('admin/sysUser/page', params)
+                        }
+                        }
+                        columns={this.columns}
+                    >
+
+                    </ProTable>
+                </Splitter.Panel>
+            </Splitter>
+
+
+            <Modal title='系统用户'
+                   open={this.state.formOpen}
+                   onOk={() => this.formRef.current.submit()}
+                   onCancel={() => this.setState({formOpen: false})}
+                   destroyOnHidden
+            >
+
+                <Form ref={this.formRef} labelCol={{flex: '100px'}}
+                      initialValues={this.state.formValues}
+                      onFinish={this.onFinish}>
+                    <Form.Item name='id' noStyle></Form.Item>
+
+                    <Form.Item label='所属机构' name='deptId' rules={[{required: true}]}>
+                        <FieldSysOrgTreeSelect />
+                    </Form.Item>
+
+                    <Form.Item label='姓名' name='name' rules={[{required: true}]}>
+                        <Input/>
+                    </Form.Item>
+                    <Form.Item label='账号' name='account' rules={[{required: true}]}>
+                        <Input/>
+                    </Form.Item>
+
+
+                    <Form.Item label='电话' name='phone'>
+                        <Input/>
+                    </Form.Item>
+                    <Form.Item label='邮箱' name='email'>
+                        <Input/>
+                    </Form.Item>
+
+                    <Form.Item label='启用状态' name='enabled' rules={[{required: true}]}>
+                        <FieldBoolean/>
+                    </Form.Item>
+
+                </Form>
+            </Modal>
+
+
+            <UserPerm ref={this.permRef} onOk={() => this.tableRef.current.reload()}/>
+
+        </Page>
+    }
+
+
+}
+
+
+

package/src/pages/test.jsx

@@ -0,0 +1,200 @@
+import React from "react";
+import {Button, Card, Divider, Form, Space} from "antd";
+import {
+    FieldBoolean,
+    FieldDate,
+    FieldDateRange,
+    FieldEditor,
+    FieldPercent,
+    FieldRemoteSelect,
+    FieldRemoteSelectMultiple,
+    FieldRemoteTree,
+    FieldRemoteTreeCascader,
+    FieldRemoteTreeSelect,
+    FieldRemoteTreeSelectMultiple,
+    FieldSysOrgTree,
+    FieldSysOrgTreeSelect,
+    FieldTable,
+    FieldTableSelect,
+    FieldUploadFile
+} from "../framework";
+
+export default class extends React.Component {
+
+
+    state = {
+        formValues: {}
+    }
+
+
+    componentDidMount() {
+        const json = localStorage.getItem("_test")
+        const formValues = json ? JSON.parse(json) : {}
+        this.formRef.current.setFieldsValue(formValues)
+        this.setState({formValues})
+    }
+
+    formRef = React.createRef()
+
+
+    render() {
+
+        return <>
+            <Card title='表单组件-自定义封装'>
+                {JSON.stringify(this.state.formValues)}
+                <Divider></Divider>
+                <Form
+                    ref={this.formRef}
+                    onValuesChange={(changedValues, allValues) => {
+                        this.setState({formValues: allValues})
+                    }}
+                    onReset={() => {
+                        this.setState({formValues: {}})
+                    }}
+
+                    onFinish={values => {
+                        localStorage.setItem("_test", JSON.stringify(values))
+                    }}
+
+                    labelAlign={'left'}
+                    labelCol={{flex: '400px',}}
+                    layout='horizontal'
+                >
+                    <Form.Item label='上传'   name='file'>
+                        <FieldUploadFile cropImage={true} />
+                    </Form.Item>
+
+                    <Form.Item label='百分数'   name='number'>
+                        <FieldPercent />
+                    </Form.Item>
+                    <Form.Item label='机构树选择 （部门） FieldSysOrgTree'   name='org'>
+                        <FieldSysOrgTree />
+                    </Form.Item>
+                    <Form.Item label='机构树选择 （部门） FieldSysOrgTreeSelect'   name='org'>
+                        <FieldSysOrgTreeSelect />
+                    </Form.Item>
+
+                    <Form.Item label='机构树选择（单位） FieldSysOrgTreeSelect'   name='org'>
+                        <FieldSysOrgTreeSelect type='unit' />
+                    </Form.Item>
+
+
+
+                    <Form.Item label='选择表格 FieldTableSelect' name='user'>
+                        <FieldTableSelect url='admin/sysUser/page'  columns={[
+                            {title: '姓名', dataIndex: 'name'},
+                            {title: '账号', dataIndex: 'account'},
+                        ]}/>
+                    </Form.Item>
+
+                    <Form.Item label='可编辑表格' name='tableData'>
+                        <FieldTable columns={[
+                            {title: '名称', dataIndex: 'name'},
+                            {title: '年龄', dataIndex: 'age'},
+                            {title: '婚否', dataIndex: 'marry',render(){
+                                return <FieldBoolean type='select'></FieldBoolean>
+                                }},
+                        ]}></FieldTable>
+                    </Form.Item>
+
+                    <Divider>日期区间 FieldDateRange</Divider>
+                    <Form.Item label=' YYYY-MM-DD HH:mm:ss' name='dateRange'>
+                        <FieldDateRange type='YYYY-MM-DD HH:mm:ss'></FieldDateRange>
+                    </Form.Item>
+                    <Form.Item label='YYYY-MM-DD HH:mm' name='dateRange'>
+                        <FieldDateRange type='YYYY-MM-DD HH:mm'></FieldDateRange>
+                    </Form.Item>
+                    <Form.Item label='日期' name='dateRange'>
+                        <FieldDateRange ></FieldDateRange>
+                    </Form.Item>
+                    <Form.Item label='YYYY-QQ 季度' name='dateRange'>
+                        <FieldDateRange type='YYYY-QQ'></FieldDateRange>
+                    </Form.Item>
+                    <Form.Item label='YYYY-MM' name='dateRange'>
+                        <FieldDateRange type='YYYY-MM'></FieldDateRange>
+                    </Form.Item>
+                    <Form.Item label='YYYY' name='dateRange'>
+                        <FieldDateRange type='YYYY'></FieldDateRange>
+                    </Form.Item>
+                    <Form.Item label='HH:mm' name='dateRange'>
+                        <FieldDateRange type='HH:mm'></FieldDateRange>
+                    </Form.Item>
+                    <Form.Item label='HH:mm:ss' name='dateRange'>
+                        <FieldDateRange type='HH:mm:ss'></FieldDateRange>
+                    </Form.Item>
+
+
+                    <Divider>日期</Divider>
+                    <Form.Item label='YYYY-MM-DD HH:mm:ss' name='date'>
+                        <FieldDate type='YYYY-MM-DD HH:mm:ss'></FieldDate>
+                    </Form.Item>
+                    <Form.Item label='FieldDate YYYY-MM-DD HH:mm' name='date'>
+                        <FieldDate type='YYYY-MM-DD HH:mm'></FieldDate>
+                    </Form.Item>
+                    <Form.Item label='FieldDate 日期' name='date'>
+                        <FieldDate ></FieldDate>
+                    </Form.Item>
+                    <Form.Item label='FieldDate YYYY-QQ 季度' name='date'>
+                        <FieldDate type='YYYY-QQ'></FieldDate>
+                    </Form.Item>
+                    <Form.Item label='FieldDate YYYY-MM' name='date'>
+                        <FieldDate type='YYYY-MM'></FieldDate>
+                    </Form.Item>
+                    <Form.Item label='FieldDate YYYY' name='date'>
+                        <FieldDate type='YYYY'></FieldDate>
+                    </Form.Item>
+                    <Form.Item label='FieldDate HH:mm' name='date'>
+                        <FieldDate type='HH:mm'></FieldDate>
+                    </Form.Item>
+                    <Form.Item label='FieldDate HH:mm:ss' name='date'>
+                        <FieldDate type='HH:mm:ss'></FieldDate>
+                    </Form.Item>
+                    <Divider>布尔</Divider>
+                    <Form.Item label='FieldBoolean 布尔 (switch)' name='boolean'>
+                        <FieldBoolean type='switch'></FieldBoolean>
+                    </Form.Item>
+                    <Form.Item label='FieldBoolean 布尔 (checkbox)' name='boolean'>
+                        <FieldBoolean type='checkbox'></FieldBoolean>
+                    </Form.Item>
+                    <Form.Item label='FieldBoolean 布尔 (radio)' name='boolean'>
+                        <FieldBoolean type='radio'></FieldBoolean>
+                    </Form.Item>
+                    <Form.Item label='FieldBoolean 布尔 (选择框)' name='boolean'>
+                        <FieldBoolean type='select'></FieldBoolean>
+                    </Form.Item>
+                    <Form.Item label='FieldRemoteTreeSelectMultiple 远程树选择(多选)' name='users'>
+                        <FieldRemoteTreeSelectMultiple url='admin/sysUser/tree'/>
+                    </Form.Item>
+
+                    <Divider>选择</Divider>
+                    <Form.Item label='远程树选择' name='user'>
+                        <FieldRemoteTreeSelect url='admin/sysUser/tree'/>
+                    </Form.Item>
+                    <Form.Item label='远程树（多选）' name='users'>
+                        <FieldRemoteTree url='admin/sysUser/tree'/>
+                    </Form.Item>
+                    <Form.Item label='远程树级联选择' name='user'>
+                        <FieldRemoteTreeCascader url='admin/sysUser/tree'/>
+                    </Form.Item>
+
+                    <Form.Item label='单选' name='user'>
+                        <FieldRemoteSelect url='admin/sysUser/options'/>
+                    </Form.Item>
+                    <Form.Item label='多选' name='users'>
+                        <FieldRemoteSelectMultiple url='admin/sysUser/options'/>
+                    </Form.Item>
+                    <Form.Item label='富文本' name='富文本'>
+                        <FieldEditor height={100}/>
+                    </Form.Item>
+
+                    <Space>
+                        <Button type='primary' htmlType='submit'>保存</Button>
+                        <Button htmlType='reset'>重置</Button>
+                    </Space>
+                </Form>
+
+
+            </Card>
+        </>
+    }
+}

package/src/pages/ureport/index.jsx

@@ -0,0 +1,16 @@
+import React from 'react'
+import {Button, Flex} from "antd";
+
+export default class extends React.Component {
+
+    render() {
+        return <div style={{display:'flex',alignItems:'center',justifyContent:'center'}}>
+            <Button type='primary' href='/ureport/designer'>打开设计器</Button>
+        </div>
+    }
+
+
+}
+
+
+