@jiangood/open-admin 1.0.0-beta.5

package/src/pages/system/role/perm.jsx

@@ -0,0 +1,107 @@
+import React from "react";
+import {Button, Card, Checkbox, Table, Typography} from "antd";
+import {SaveOutlined} from "@ant-design/icons";
+import {ArrUtils, HttpUtils, PageUtils} from "../../../framework";
+export default class extends React.Component {
+
+
+    state = {
+        loading: false,
+        roleInfo: {},
+
+        dataSource: [],
+        rowSelectedKeys: {},
+    }
+
+    columns = [
+        {
+            title: '菜单',
+            dataIndex: 'name',
+        },
+
+        {
+            title: '权限',
+            dataIndex: 'permCodes',
+            render: (permCodes, record) => {
+                if (permCodes == null) {
+                    return
+                }
+                const {permNames} = record
+                const options = [];
+                for (let i = 0; i < permCodes.length; i++) {
+                    const label = permNames[i];
+                    const value = permCodes[i];
+                    options.push({label, value});
+                }
+
+
+                let rowSelectedKey = this.state.rowSelectedKeys[record.id];
+                return <Checkbox.Group options={options}
+                                       value={rowSelectedKey}
+                                       onChange={(ks) => {
+                                           const rowSelectedKeys = this.state.rowSelectedKeys;
+                                           rowSelectedKeys[record.id] = ks;
+                                           this.setState({rowSelectedKeys})
+                                       }}/>
+            }
+        }
+    ]
+
+    componentDidMount() {
+        this.roleId = PageUtils.currentParams().id;
+        this.loadData();
+    }
+
+
+    loadData() {
+        this.setState({loading: true})
+        Promise.all([
+            HttpUtils.get('admin/sysRole/get', {id: this.roleId}).then(rs => {
+                this.setState({roleInfo: rs})
+            }),
+            HttpUtils.get('admin/sysRole/permTreeTable', {id: this.roleId}).then(rs => {
+                this.setState({dataSource: rs})
+            }),
+            HttpUtils.get('admin/sysRole/ownPerms', {id: this.roleId}).then(rs => {
+                this.setState({rowSelectedKeys: rs})
+            })
+        ]).then(rs => {
+            this.setState({loading: false})
+        })
+    }
+
+    savePerms = () => {
+        const {rowSelectedKeys} = this.state;
+        const perms = [];
+        const menus = []
+        for (let menuId in rowSelectedKeys) {
+            const ks = rowSelectedKeys[menuId];
+            if (ks == null || ks.length === 0) {
+                continue;
+            }
+            menus.push(menuId)
+            ArrUtils.addAll(perms, ks)
+        }
+        HttpUtils.post('admin/sysRole/savePerms', {id: this.roleId, perms, menus}).then(rs => {
+            //  Page.open(PageUtils.currentPathname(), PageUtils.currentLabel())
+        })
+    };
+
+
+    render() {
+        return <>
+
+
+            <Card title='角色权限设置' loading={this.state.loading}
+                  variant={"borderless"}
+                  extra={<Button type='primary' icon={<SaveOutlined/>} onClick={this.savePerms}>保存权限</Button>}>
+                <Typography.Text>角色名称：{this.state.roleInfo.name}， 编码：{this.state.roleInfo.code} </Typography.Text>
+                <Table dataSource={this.state.dataSource}
+                       columns={this.columns}
+                       size='small' bordered pagination={false} rowKey='id'
+                       expandable={{defaultExpandAllRows: true}}
+                ></Table>
+            </Card>
+        </>
+    }
+}

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

@@ -0,0 +1,126 @@
+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()
+
+    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()
+        })
+    }
+
+    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>
+            ),
+        },
+
+    ]
+
+    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,94 @@
+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
+        },
+    }
+    formRef = React.createRef()
+
+    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
+            })
+
+        })
+    }
+
+    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,253 @@
+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()
+
+    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})
+    }
+
+    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>;
+            },
+        },
+    ];
+
+    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/views.jsx

@@ -0,0 +1,95 @@
+import {ViewText, ViewBoolean, ViewBooleanEnableDisable, ViewFile, ViewFileButton, ViewImage, ViewPassword, ViewApproveStatus, ViewProcessInstanceProgress, ViewProcessInstanceProgressButton} from "../../framework";
+
+export function ViewTextTest() {
+    return <ViewText value='你好'  />
+}
+
+export function ViewBooleanTest() {
+    return <ViewBoolean value={true}  />
+}
+
+export function ViewBooleanEnableDisableTest() {
+    return <ViewBooleanEnableDisable value={true}  />
+}
+
+export function ViewTextEllipsisTest() {
+    return <ViewText value='这是一段很长的文本，用于测试省略显示功能' ellipsis={true} maxLength={10}  />
+}
+
+export function ViewFileTest() {
+    return <ViewFile value='file123' height='200px'  />
+}
+
+export function ViewFileButtonTest() {
+    return <ViewFileButton value='file123' height='200px'  />
+}
+
+export function ViewImageTest() {
+    return <ViewImage value='https://via.placeholder.com/150'  />
+}
+
+export function ViewPasswordTest() {
+    return <ViewPassword value='password123'  />
+}
+
+export function ViewApproveStatusTest() {
+    return <ViewApproveStatus value='approved'  />
+}
+
+export function ViewProcessInstanceProgressTest() {
+    return <ViewProcessInstanceProgress value='process123'  />
+}
+
+export function ViewProcessInstanceProgressButtonTest() {
+    return <ViewProcessInstanceProgressButton value='process123'  />
+}
+
+export default function () {
+    return <>
+        <h1>View 组件测试</h1>
+        <div style={{marginBottom: '20px'}}>
+            <h2>ViewText</h2>
+            <ViewTextTest/>
+        </div>
+        <div style={{marginBottom: '20px'}}>
+            <h2>ViewBoolean</h2>
+            <ViewBooleanTest/>
+        </div>
+        <div style={{marginBottom: '20px'}}>
+            <h2>ViewBooleanEnableDisable</h2>
+            <ViewBooleanEnableDisableTest/>
+        </div>
+        <div style={{marginBottom: '20px'}}>
+            <h2>ViewText (with ellipsis)</h2>
+            <ViewTextEllipsisTest/>
+        </div>
+        <div style={{marginBottom: '20px'}}>
+            <h2>ViewFile</h2>
+            <ViewFileTest/>
+        </div>
+        <div style={{marginBottom: '20px'}}>
+            <h2>ViewFileButton</h2>
+            <ViewFileButtonTest/>
+        </div>
+        <div style={{marginBottom: '20px'}}>
+            <h2>ViewImage</h2>
+            <ViewImageTest/>
+        </div>
+        <div style={{marginBottom: '20px'}}>
+            <h2>ViewPassword</h2>
+            <ViewPasswordTest/>
+        </div>
+        <div style={{marginBottom: '20px'}}>
+            <h2>ViewApproveStatus</h2>
+            <ViewApproveStatusTest/>
+        </div>
+        <div style={{marginBottom: '20px'}}>
+            <h2>ViewProcessInstanceProgress</h2>
+            <ViewProcessInstanceProgressTest/>
+        </div>
+        <div style={{marginBottom: '20px'}}>
+            <h2>ViewProcessInstanceProgressButton</h2>
+            <ViewProcessInstanceProgressButtonTest/>
+        </div>
+    </>
+}

package/src/pages/ureport/index.jsx

@@ -0,0 +1,16 @@
+import React from 'react'
+import {Button} 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>
+    }
+
+
+}
+
+
+