forked from gzzfw/frontEnd/gzDyh

xusd
2024-09-13 466f59f771bc9306079728ba4363f4b204d5beca
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
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
/*
 * @Company: hugeInfo
 * @Author: lwh
 * @Date: 2022-02-23
 * @LastEditTime: 2022-03-15 09:33:31
 * @LastEditors: lwh
 * @Version: 1.0.0
 * @Description: 功能管理
 */
import React, { Component } from 'react';
import './index.less';
import PageHead from '../../components/PageHead';
//公共功能
import EditTableView from '../../components/feature/EditTableView';
//功能清单
import FunctionMenuView from '../../components/feature/FunctionMenuView';
import { Card, message, Tabs } from 'antd';
import * as $$ from '../../utils/utility';
const { TabPane } = Tabs;
// 树形结构
function getTree() {
    return $$.ax.request({ url: 'v1/rsApp/getTree', type: 'get', data: { appType: '1' }, service: 'oper' });
}
//一级应用菜单提交接口
function saveRsAPP(data) {
    return $$.ax.request({ url: 'v1/rsApp/saveRsAPP', type: 'post', data, service: 'oper' });
}
//一级应用菜单删除
function removeRsAPP(ids) {
    return $$.ax.request({ url: 'v1/rsApp/removeByIds', type: 'get', data: { ids }, service: 'oper' });
}
//一级应用菜单详情接口
function saveRsAPPById(id) {
    return $$.ax.request({ url: 'v1/rsApp/getById', type: 'get', data: { id }, service: 'oper' });
}
 
//二级、三级菜单提交接口
function saveRsModule(data) {
    return $$.ax.request({ url: 'v1/rsModule/saveRsModule', type: 'post', data, service: 'oper' });
}
//二级、三级菜单详情接口
function saveRsModuleById(id) {
    return $$.ax.request({ url: 'v1/rsModule/getById', type: 'get', data: { id }, service: 'oper' });
}
//二级、三级菜单删除
function removersModule(id) {
    return $$.ax.request({ url: 'v1/rsModule/removeById', type: 'get', data: { id } });
}
 
// 功能列表
function listRsFunction(appClient) {
    return $$.ax.request({ url: 'v1/rsFunction/listQuery', type: 'get', data: { appType: '2', appClient }, service: 'oper' });
}
 
//功能提交接口
function saveRsFunction(data) {
    return $$.ax.request({ url: 'v1/rsFunction/saveRsFunction', type: 'post', data, service: 'oper' });
}
//功能详情接口
function saveRsFunctionById(id) {
    return $$.ax.request({ url: 'v1/rsFunction/getById', type: 'get', data: { id }, service: 'oper' });
}
// 菜单删除
function listQueryRemove(ids) {
    return $$.ax.request({ url: 'v1/rsFunction/removeByIds', type: 'get', data: { ids }, service: 'oper' });
}
 
//删除时拦截是否还有子级菜单
function checkCanRemove(id) {
    return $$.ax.request({ url: 'v1/rsModule/checkCanRemove', type: 'get', data: { id }, service: 'oper' });
}
 
class Feature extends Component {
    constructor(props) {
        super(props);
        this.config = {};
        this.state = {
            EditTableList: [], //公共功能列表
            EditTableData: {}, //公共功能详情对象
            EditTableId: '', //公共功能id
            EditTableKey: '',
            EditTableLoading: false, //公共功能状态
            tabKey: '1', //1.用户PC端  2.当事人小程序  3.调解员小程序
            addDisabled: false, //新增按钮是否可点击
        };
    }
    componentDidMount = async () => {
        //初始化
        const { tabKey } = this.state;
        this.initializedChange(tabKey);
    };
    initializedChange = async (tabKey) => {
        this.setState({ EditTableLoading: true });
        const res = await listRsFunction(tabKey);
        this.setState({ EditTableList: res.data, EditTableLoading: false, EditTableKey: new Date().getTime() });
    };
 
    //保存公共功能
    saveTableData = async (data) => {
        const { tabKey } = this.state;
        this.setState({ EditTableLoading: true });
        const res = await saveRsFunction({ ...data, appClient: tabKey });
        if (res.type) {
            message.success({
                content: '提交成功!',
                duration: 1,
                onClose: async () => {
                    const list = await listRsFunction(tabKey);
                    this.setState({
                        EditTableData: {},
                        EditTableId: '',
                        addDisabled: false,
                        EditTableList: list.data,
                        EditTableLoading: false,
                        EditTableKey: new Date().getTime(),
                    });
                },
            });
        } else {
            this.setState({
                EditTableLoading: false,
            });
        }
    };
 
    //保存并继续公共功能
    saveContinueTableData = async (data) => {
        const { tabKey } = this.state;
        this.setState({ EditTableLoading: true });
        const res = await saveRsFunction({ ...data, appClient: tabKey });
        if (res.type) {
            message.success({
                content: '提交成功!',
                duration: 1,
                onClose: async () => {
                    const list = await listRsFunction(tabKey);
                    if (list.type) {
                        const key = list.data.length + 1;
                        const newData2 = {
                            id: key,
                            name: '',
                            tag: '',
                            des: '',
                        };
                        this.setState({
                            EditTableData: {},
                            EditTableId: key,
                            addDisabled: true,
                            EditTableList: [...list.data, newData2],
                            EditTableLoading: false,
                            EditTableKey: new Date().getTime(),
                        });
                    }
                },
            });
        } else {
            this.setState({
                EditTableLoading: false,
            });
        }
    };
 
    //删除公共功能
    removeTableData = async (id) => {
        const { tabKey } = this.state;
        this.setState({ EditTableLoading: true });
        const res = await listQueryRemove(id);
        if (res.type) {
            message.success('删除成功!');
        }
        const list = await listRsFunction(tabKey);
        this.setState({ EditTableList: list.data, EditTableId: '', EditTableLoading: false, EditTableKey: new Date().getTime() });
    };
 
    // 切换tab页
    TabsChange = (e) => {
        this.setState({ tabKey: e, FunctionMenuViewKey: new Date().getTime() });
        this.initializedChange(e);
    };
 
    render() {
        const { EditTableList, EditTableData, EditTableId, EditTableKey, EditTableLoading, tabKey, FunctionMenuViewKey, addDisabled } = this.state;
        return (
            <div className="feature-main">
                <PageHead title="功能管理" />
                <div className="feature-tab">
                    <Tabs onChange={this.TabsChange} className="feature-tab-style" defaultActiveKey={tabKey}>
                        <TabPane tab="用户PC端" key="1"></TabPane>
                        <TabPane tab="当事人小程序" key="2"></TabPane>
                        <TabPane tab="调解员小程序" key="3"></TabPane>
                    </Tabs>
                </div>
                <div className="feature">
                    <Card bordered={false} style={{ margin: '24px' }}>
                        <EditTableView
                            key={EditTableKey}
                            loading={EditTableLoading}
                            EditTableId={EditTableId}
                            disabled={addDisabled}
                            saveTableData={this.saveTableData}
                            removeTableData={this.removeTableData}
                            saveContinueTableData={this.saveContinueTableData}
                            EditTableData={EditTableData}
                            EditTableList={EditTableList}
                        />
                    </Card>
                    <Card bordered={false} style={{ margin: '24px' }}>
                        <FunctionMenuView key={FunctionMenuViewKey} tabKey={tabKey} />
                    </Card>
                </div>
            </div>
        );
    }
}
 
export default Feature;