@jiangood/springboot-admin-starter 0.0.1

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

@@ -0,0 +1,314 @@
+import {PlusOutlined} from '@ant-design/icons'
+import {Button, Form, Input, InputNumber, Modal, Popconfirm, Transfer, Tree} from 'antd'
+import React from 'react'
+import {ButtonList, Ellipsis, FieldRadioBoolean, HttpUtil, Page, PageUtil, ProTable} from "../../../framework";
+
+
+export default class extends React.Component {
+
+    state = {
+        formValues: {},
+        formOpen: false,
+
+        usersModalOpen: false,
+
+
+        userList: [],
+        targetKeys: [],
+        selectedKeys: [],
+
+        menuOpen:false,
+        menuTree:[],
+        menuTreeLoading:false,
+        menuChecked:[],
+        menuHalfChecked:[]
+    }
+
+    formRef = React.createRef()
+    tableRef = React.createRef()
+
+    columns = [
+
+        {
+            title: '名称',
+            dataIndex: 'name',
+
+
+        },
+
+        {
+            title: '编号',
+            dataIndex: 'code',
+
+
+        },
+
+        {
+            title: '排序',
+            dataIndex: 'seq',
+
+
+        },
+
+        {
+            title: '备注',
+            dataIndex: 'remark',
+
+
+        },
+
+        {
+            title: '启用',
+            dataIndex: 'enabled',
+
+
+            render(v) {
+                return v == null ? null : (v ? '是' : '否')
+            },
+
+
+        },
+        {
+            title: '是否内置',
+            dataIndex: 'builtin',
+
+
+            render(v) {
+                return v == null ? null : (v ? '是' : '否')
+            },
+
+
+        },
+
+        {
+            title: '权限码',
+            dataIndex: 'perms',
+            width: 300,
+            render(v) {
+                if (v) {
+                    return <Ellipsis>{v.join(',')}</Ellipsis>
+                }
+            }
+
+        },
+
+
+        {
+            title: '操作',
+            dataIndex: 'option',
+            render: (_, record) => {
+
+                return (
+                    <ButtonList>
+                        <Button size='small' perm='sysRole:save'
+                                onClick={() => this.handleEditUser(record)}>用户设置</Button>
+
+                        <Button size='small' perm='sysRole:save' disabled={record.builtin}
+                                onClick={() => PageUtil.open('/system/role/perm?id='+record.id, '角色权限设置')}>权限设置</Button>
+
+                        <Button size='small' perm='sysRole:save' disabled={record.builtin}
+                                onClick={() => this.handleEdit(record)}>编辑</Button>
+                        <Popconfirm perm='sysRole:delete' disabled={record.builtin} 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}, () => {
+
+        })
+    }
+
+
+    handleEditUser = record => {
+        this.setState({usersModalOpen: true, formValues: record})
+        HttpUtil.get('admin/sysRole/userList', {id: record.id}).then(rs => {
+            this.setState({userList: rs.list, targetKeys: rs.selectedKeys})
+        })
+    }
+
+
+
+    onFinish = values => {
+        HttpUtil.post('admin/sysRole/save', values).then(rs => {
+            this.setState({formOpen: false})
+            this.tableRef.current.reload()
+        })
+    }
+
+
+    handleDelete = record => {
+        HttpUtil.get('admin/sysRole/delete', {id: record.id}).then(rs => {
+            this.tableRef.current.reload()
+        })
+    }
+
+    handleSaveUsers =()=>{
+        const params = {
+            id: this.state.formValues.id,
+            userIdList:this.state.targetKeys
+        }
+        HttpUtil.post('admin/sysRole/grantUsers', params).then(rs => {
+            this.setState({usersModalOpen:false})
+        })
+    }
+
+    handleEditMenu =(record)=>{
+        this.setState({menuOpen:true,formValues:record,menuTreeLoading:true})
+        HttpUtil.get('admin/sysRole/ownMenu', {id: record.id}).then(rs => {
+            this.setState({menuChecked:rs.checked,menuHalfChecked:rs.halfChecked})
+        })
+        HttpUtil.get('admin/sysRole/menuTree').then(rs => {
+            this.setState({menuTree:rs, menuTreeLoading:false})
+        })
+    }
+    handleGrantMenu =()=>{
+        const params = {
+            id: this.state.formValues.id,
+            menuIds:[...this.state.menuChecked, ...this.state.menuHalfChecked]
+        }
+        HttpUtil.post('admin/sysRole/grantMenu', params).then(rs => {
+            debugger
+            this.setState({menuOpen:false})
+        })
+    }
+
+    render() {
+        return <Page>
+            <ProTable
+                actionRef={this.tableRef}
+                toolBarRender={() => {
+                    return <ButtonList>
+                        <Button perm='sysRole:save' type='primary' onClick={this.handleAdd}>
+                            <PlusOutlined/> 新增
+                        </Button>
+                    </ButtonList>
+                }}
+                request={(params) => HttpUtil.pageData('admin/sysRole/page', params)}
+                columns={this.columns}
+
+            />
+
+            <Modal title='系统角色'
+                   open={this.state.formOpen}
+                   onOk={() => this.formRef.current.submit()}
+                   onCancel={() => this.setState({formOpen: false})}
+                   destroyOnHidden
+                   maskClosable={false}
+                   width={600}
+            >
+
+                <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='code' rules={[{required: true}]}>
+                        <Input/>
+                    </Form.Item>
+
+
+                    <Form.Item label='排序' name='seq'>
+                        <InputNumber/>
+                    </Form.Item>
+
+
+                    <Form.Item label='备注' name='remark'>
+                        <Input/>
+                    </Form.Item>
+
+                    <Form.Item label='启用' name='enabled' rules={[{required: true}]}>
+                        <FieldRadioBoolean/>
+                    </Form.Item>
+
+
+
+
+                </Form>
+            </Modal>
+
+
+            <Modal title={'角色用户' +"【" +this.state.formValues?.name + '】'}
+                   open={this.state.usersModalOpen }
+                   destroyOnHidden
+                   maskClosable={false}
+                   width={800}
+                   onCancel={() => this.setState({usersModalOpen: false})}
+                   onOk={this.handleSaveUsers}
+            >
+
+
+                <Transfer
+                    listStyle={{height:'60vh', width:300}}
+
+                    dataSource={this.state.userList} titles={["未选择", "已选择"]}
+                    targetKeys={this.state.targetKeys}
+                    selectedKeys={this.state.selectedKeys}
+                    render={item => item.title}
+                    onChange={(nextTargetKeys, direction, moveKeys) => {
+                        this.setState({
+                            targetKeys: nextTargetKeys
+                        })
+                    }}
+                    onSelectChange={(sourceSelectedKeys, targetSelectedKeys)=>{
+                        this.setState({
+                            selectedKeys: [...sourceSelectedKeys, ...targetSelectedKeys]
+                        })
+                    }}
+                    showSearch
+                />
+
+
+            </Modal>
+
+            <Modal title={'角色授权菜单权限' +"【" +this.state.formValues?.name + '】'}
+                   open={this.state.menuOpen }
+                   destroyOnHidden
+                   maskClosable={false}
+                   width={800}
+                   onCancel={() => this.setState({menuOpen: false})}
+                   onOk={this.handleGrantMenu}
+                   loading={this.state.menuTreeLoading}
+            >
+
+
+                    <Tree
+                        height={600}
+                        treeData={this.state.menuTree}
+                        multiple
+                        checkable
+                        checkedKeys={{checked:this.state.menuChecked}}
+                        onCheck={(keys,e) =>{
+                            this.setState({menuChecked:keys,menuHalfChecked:e.halfCheckedKeys})
+                        }}
+                        defaultExpandAll
+                        titleRender={node=>{
+                            return <span title={node.perm} >{node.title}</span>
+                        }}
+                    >
+                    </Tree>
+
+
+
+            </Modal>
+        </Page>
+
+
+    }
+}
+

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

@@ -0,0 +1,111 @@
+import React from "react";
+import {Alert, Button, Card, Checkbox, Table, Typography} from "antd";
+import {SaveOutlined} from "@ant-design/icons";
+import {ArrUtil, HttpUtil, PageUtil} from "../../../framework";
+
+export default class extends React.Component {
+
+
+    state = {
+        loading: false,
+        roleInfo: {},
+
+        dataSource: [],
+        rowSelectedKeys: {},
+    }
+
+    columns = [
+        {
+            title: '菜单',
+            dataIndex: 'name',
+        },
+
+        {
+            title: '权限',
+            dataIndex: 'perms',
+            render: (perms, record) => {
+                if (perms == null) {
+                    if (record.path) {
+                        return <Alert type='error' message='错误：无按钮权限，请在application-data-**.yml中添加'/>
+                    }
+                    // 文件夹
+                    return
+                }
+                const options = perms.map(perm => {
+                    return {
+                        label: perm.name,
+                        value: perm.perm
+                    }
+                })
+
+
+                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 = PageUtil.currentParams().id;
+        this.loadData();
+    }
+
+
+    loadData() {
+        this.setState({loading: true})
+        Promise.all([
+            HttpUtil.get('admin/sysRole/get', {id: this.roleId}).then(rs => {
+                this.setState({roleInfo: rs})
+            }),
+            HttpUtil.get('admin/sysRole/permTreeTable', {id: this.roleId}).then(rs => {
+                this.setState({dataSource: rs})
+            }),
+            HttpUtil.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)
+            ArrUtil.addAll(perms, ks)
+        }
+        HttpUtil.post('admin/sysRole/savePerms', {id: this.roleId, perms, menus}).then(rs => {
+            //  Page.open(PageUtil.currentPathname(), PageUtil.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,127 @@
+import {PlusOutlined} from '@ant-design/icons'
+import {Button, Form, Input, Modal, Popconfirm} from 'antd'
+import React from 'react'
+import {ButtonList, FieldUploadFile, HttpUtil, Page, ProTable, SysUtil} 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 = SysUtil.wrapServerUrl('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 => {
+        HttpUtil.post('admin/sysManual/save', values).then(rs => {
+            this.setState({formOpen: false})
+            this.tableRef.current.reload()
+        })
+    }
+
+
+    handleDelete = record => {
+        HttpUtil.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) => HttpUtil.pageData('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} listType='text'/>
+                    </Form.Item>
+
+                </Form>
+            </Modal>
+        </Page>
+
+
+    }
+}
+
+

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

@@ -0,0 +1,132 @@
+import {Form, Modal, Spin, Tree} from 'antd';
+import React from 'react';
+import {FieldDictSelect, FieldSelect, HttpUtil} from "../../../framework";
+
+
+export default class UserPerm extends React.Component {
+
+
+    state = {
+        visible: false,
+
+        confirmLoading: false,
+
+        formValues: {
+            dataPermType: null
+        },
+    }
+    show(item) {
+        this.setState({visible: true})
+
+        HttpUtil.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
+        })
+
+
+        HttpUtil.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, treeData, confirmLoading, checked} = 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}]}>
+                    <FieldSelect url='admin/sysRole/options' multiple/>
+                </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'>
+                        <FieldTree/>
+                    </Form.Item>
+                </>}
+
+
+            </Form>
+
+
+        </Modal>
+    }
+
+
+}
+
+class FieldTree extends React.Component {
+
+    state = {
+        treeLoading: true,
+        treeData: [],
+    }
+
+    componentDidMount() {
+        HttpUtil.get('admin/sysOrg/unitTree').then(treeData => {
+            this.setState({treeData, treeLoading: false})
+        })
+    }
+
+
+    render() {
+        if (this.state.treeLoading) {
+            return <Spin />
+        }
+        return <Tree
+            multiple
+            checkable
+            onCheck={e => this.props.onChange(e.checked)}
+            checkedKeys={this.props.value}
+            treeData={this.state.treeData}
+            defaultExpandAll
+            checkStrictly
+        >
+        </Tree>
+    }
+}
+
+
+
+