forked from huge/frontEnd/hugeOA

Mr Ke
2020-10-20 b701009667f62901cfd4be9be1f11fe38c630352
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
/* eslint-disable */
import React from 'react';
import { Link } from 'react-router-dom';
import { Row, Col, Icon, Button, message, Modal, Divider } from 'antd';
import TableView from '../../components/common/TableView';
import SearchFormView from '../../components/common/SearchFormView';
import moment from 'moment';
import fetch from '../../api/request';
 
const confirm = Modal.confirm;
 
export default class GroupManage extends React.Component {
  constructor(props) {
    super(props);
    this.state = {
      formData: {
        __key: Date.now(),
        page: 1,
        size: 10,
      },
    };
  }
 
  componentDidMount() { }
 
  setFormData = data => {
    this.setState({
      formData: data,
    });
  }
 
  renderColumns = () => {
    let obj = this;
    return [
      { title: '标识符', className: "txt-c", dataIndex: 'symbol' },
      { title: '组名称', className: "txt-c", dataIndex: 'name' },
      { title: '组类型', className: "txt-c", dataIndex: 'groupType', render: (text, record) => text == "1" ? "用户类型" : text == "2" ? "角色类型" : text == "3" ? "资源类型" : "" },
      { title: '描述', className: "txt-c", dataIndex: 'description', render: (text, record) => text == null ? text : (text.length <= 20 ? text : (text.substring(0, 20) + '...')) },
      { title: '创建时间', className: "txt-c", dataIndex: 'createTime', render: (text, record) => text !== "" && text != null ? moment(text).format("YYYY-MM-DD HH:mm") : "" },
      {
        title: '操作', className: "txt-c", key: 'operation', render: (text, record) => {
          return <div>
            <Link to={{ pathname: "/baseManage/group/Detail/" + record.id + '/Modify', query: { id: record.id } }}>修改</Link>
            <span>&nbsp;|&nbsp;</span>
            <a onClick={() => this.delete(record.id)}>删除</a>
          </div>
        }
      }
    ]
  }
 
  // 新增组
  add = () => {
    this.props.history.push('/baseManage/group/Detail/new/Add')
  }
 
  //删除组
  delete = (id) => {
    let _this = this
    confirm({
      title: <span style={{ fontSize: 19 }}>确定要删除该组吗?</span>,
      content: <span style={{ fontSize: 18 }}>删除该组的同时,会删除与该组的所有关系。</span>,
      onOk() {
        fetch({
          url: `api/group/delete`,
          params: {
            ids: id
          }
        }).then(res => {
          if (res) {
            message.success("删除成功");
            _this.setState({
              formData: {
                ..._this.state.formData,
                __key: Date.now()
              }
            })
          }
        })
      },
      onCancel() { },
    });
  }
 
  render() {
    const { formData } = this.state;
    let tableParams = {
      url: `api/group/query`,
      formData,
      key: formData.__key,
      columns: this.renderColumns(),
      extraFromData: {},
      setFormData: this.setFormData
    }
    return (
      <div className="groupmanage-main margin padding bg-white">
        <SearchFormView
          formData={formData}
          setFormData={this.setFormData}
          data={[
            { type: 'input', name: '标识符', label: '标识符', key: 'symbol' },
            { type: 'input', name: '组名称', label: '组名称', key: 'name' },
            {
              type: 'select', name: '组类型', label: '组类型', key: 'groupType', list: [
                { name: 0, value: '全部' },
                { name: 1, value: '用户类型' },
                { name: 2, value: '角色类型' },
                { name: 3, value: '资源类型' },
              ]
            },
          ]} />
        <Row type="flex" gutter={20} className="margin-bottom">
          <Col>
            <Button type="primary" onClick={this.add}>新增组</Button>
          </Col>
        </Row>
        <TableView {...tableParams} />
      </div>
    )
  }
}