|
@@ -35,6 +35,8 @@ const columns = [{ |
|
@@ -35,6 +35,8 @@ const columns = [{ |
35
|
key: 'add_time',
|
35
|
key: 'add_time',
|
36
|
}];
|
36
|
}];
|
37
|
|
37
|
|
|
|
38
|
+let globalSort = [];
|
|
|
39
|
+
|
38
|
|
40
|
|
39
|
function ActionButton(props) {
|
41
|
function ActionButton(props) {
|
40
|
function editClick() {
|
42
|
function editClick() {
|
|
@@ -45,8 +47,6 @@ function ActionButton(props) { |
|
@@ -45,8 +47,6 @@ function ActionButton(props) { |
45
|
}
|
47
|
}
|
46
|
return (
|
48
|
return (
|
47
|
<span>
|
49
|
<span>
|
48
|
- <a href="javascript:;" onClick={editClick}>编辑</a>
|
|
|
49
|
- <Divider type="vertical" />
|
|
|
50
|
<a href="javascript:;" onClick={deleteClick}>删除</a>
|
50
|
<a href="javascript:;" onClick={deleteClick}>删除</a>
|
51
|
</span>
|
51
|
</span>
|
52
|
);
|
52
|
);
|
|
@@ -58,43 +58,74 @@ class OptionModal extends React.Component { |
|
@@ -58,43 +58,74 @@ class OptionModal extends React.Component { |
58
|
|
58
|
|
59
|
this.props = props;
|
59
|
this.props = props;
|
60
|
this.state = {
|
60
|
this.state = {
|
61
|
- showModal: false,
|
|
|
62
|
- sorts: []
|
61
|
+ sorts: globalSort || []
|
63
|
};
|
62
|
};
|
64
|
|
63
|
|
|
|
64
|
+ this.renderData = Object.assign({}, props.record || {});
|
|
|
65
|
+
|
65
|
this.hotApi = new HotApi();
|
66
|
this.hotApi = new HotApi();
|
66
|
- this.handleOk = this.handleOk.bind(this);
|
67
|
+
|
|
|
68
|
+ this.loadHotList = props.loadHotList;
|
|
|
69
|
+ this.hideOptionModal = props.hideOptionModal;
|
67
|
this.handleKeywordChange = this.handleKeywordChange.bind(this);
|
70
|
this.handleKeywordChange = this.handleKeywordChange.bind(this);
|
68
|
this.handleDescChange = this.handleDescChange.bind(this);
|
71
|
this.handleDescChange = this.handleDescChange.bind(this);
|
69
|
this.handleSortChange = this.handleSortChange.bind(this);
|
72
|
this.handleSortChange = this.handleSortChange.bind(this);
|
70
|
this.handleImageChange = this.handleImageChange.bind(this);
|
73
|
this.handleImageChange = this.handleImageChange.bind(this);
|
71
|
this.loadSortData = this.loadSortData.bind(this);
|
74
|
this.loadSortData = this.loadSortData.bind(this);
|
72
|
|
75
|
|
73
|
- this.loadSortDataAsync().then(result => {
|
|
|
74
|
- this.setState({sorts: result});
|
76
|
+
|
|
|
77
|
+ switch (this.renderData.type) {
|
|
|
78
|
+ case 'edit':
|
|
|
79
|
+ this.modalTitle = '编辑关键词';
|
|
|
80
|
+ this.handleOk = this.handleSave.bind(this);
|
|
|
81
|
+ break;
|
|
|
82
|
+ case 'delete':
|
|
|
83
|
+ this.modalTitle = '删除关键词';
|
|
|
84
|
+ this.handleOk = this.handleDelete.bind(this);
|
|
|
85
|
+ break;
|
|
|
86
|
+ default:
|
|
|
87
|
+ this.modalTitle = '新建关键词';
|
|
|
88
|
+ this.handleOk = this.handleSave.bind(this);
|
|
|
89
|
+ break;
|
|
|
90
|
+ }
|
|
|
91
|
+
|
|
|
92
|
+ if (!globalSort.length) {
|
|
|
93
|
+ this.loadSortDataAsync().then(result => {
|
|
|
94
|
+ this.setState({sorts: result});
|
|
|
95
|
+ globalSort = result;
|
|
|
96
|
+ });
|
|
|
97
|
+ }
|
|
|
98
|
+ }
|
|
|
99
|
+ handleDelete() {
|
|
|
100
|
+ return this.hotApi.delHotKeywords([this.renderData.id]).then(result => {
|
|
|
101
|
+ if (result.code === 200) {
|
|
|
102
|
+ this.loadHotList && this.loadHotList();
|
|
|
103
|
+ this.hideOptionModal && this.hideOptionModal();
|
|
|
104
|
+ } else {
|
|
|
105
|
+ message.error(result.message);
|
|
|
106
|
+ }
|
75
|
});
|
107
|
});
|
76
|
}
|
108
|
}
|
77
|
- handleOk() {
|
|
|
78
|
- this.hotApi.saveHotKeywords(this.renderData).then(result => {
|
109
|
+ handleSave() {
|
|
|
110
|
+ return this.hotApi.saveHotKeywords(this.renderData).then(result => {
|
79
|
if (result.code === 200) {
|
111
|
if (result.code === 200) {
|
80
|
- this.props.loadHotList && this.props.loadHotList();
|
112
|
+ this.loadHotList && this.loadHotList();
|
|
|
113
|
+ this.hideOptionModal && this.hideOptionModal();
|
|
|
114
|
+ } else {
|
|
|
115
|
+ message.error(result.message);
|
81
|
}
|
116
|
}
|
82
|
- })
|
|
|
83
|
- this.props.hideOptionModal && this.props.hideOptionModal();
|
117
|
+ });
|
84
|
}
|
118
|
}
|
85
|
handleKeywordChange(e) {
|
119
|
handleKeywordChange(e) {
|
86
|
this.renderData.keyword = e.target.value;
|
120
|
this.renderData.keyword = e.target.value;
|
87
|
- console.log(this.renderData);
|
|
|
88
|
}
|
121
|
}
|
89
|
handleDescChange(e) {
|
122
|
handleDescChange(e) {
|
90
|
this.renderData.describe = e.target.value;
|
123
|
this.renderData.describe = e.target.value;
|
91
|
- console.log(this.renderData);
|
|
|
92
|
}
|
124
|
}
|
93
|
handleSortChange(select) {
|
125
|
handleSortChange(select) {
|
94
|
this.renderData.msort = select[0];
|
126
|
this.renderData.msort = select[0];
|
95
|
this.renderData.misort = select[1];
|
127
|
this.renderData.misort = select[1];
|
96
|
this.renderData.sort_id = select[2];
|
128
|
this.renderData.sort_id = select[2];
|
97
|
- console.log(this.renderData);
|
|
|
98
|
}
|
129
|
}
|
99
|
handleImageChange() {
|
130
|
handleImageChange() {
|
100
|
// this.renderData.goods_img = select[2];
|
131
|
// this.renderData.goods_img = select[2];
|
|
@@ -119,6 +150,7 @@ class OptionModal extends React.Component { |
|
@@ -119,6 +150,7 @@ class OptionModal extends React.Component { |
119
|
this.loadSortDataAsync(targetOption.value).then(result => {
|
150
|
this.loadSortDataAsync(targetOption.value).then(result => {
|
120
|
targetOption.loading = false;
|
151
|
targetOption.loading = false;
|
121
|
targetOption.children = result;
|
152
|
targetOption.children = result;
|
|
|
153
|
+ globalSort = this.state.sorts;
|
122
|
this.setState({sorts: this.state.sorts});
|
154
|
this.setState({sorts: this.state.sorts});
|
123
|
});
|
155
|
});
|
124
|
}
|
156
|
}
|
|
@@ -148,45 +180,29 @@ class OptionModal extends React.Component { |
|
@@ -148,45 +180,29 @@ class OptionModal extends React.Component { |
148
|
return result;
|
180
|
return result;
|
149
|
});
|
181
|
});
|
150
|
}
|
182
|
}
|
|
|
183
|
+ uploadButton(loading) {
|
|
|
184
|
+ return (
|
|
|
185
|
+ <div>
|
|
|
186
|
+ <Icon type={loading ? 'loading' : 'plus'} />
|
|
|
187
|
+ <div className="ant-upload-text">Upload</div>
|
|
|
188
|
+ </div>);
|
|
|
189
|
+ }
|
151
|
render() {
|
190
|
render() {
|
152
|
- const {showModal, hideOptionModal, record} = this.props;
|
191
|
+ const record = this.renderData;
|
153
|
|
192
|
|
154
|
let title = '';
|
193
|
let title = '';
|
155
|
|
194
|
|
156
|
- this.renderData = Object.assign({}, record || {});
|
|
|
157
|
-
|
|
|
158
|
- if (record) {
|
|
|
159
|
- switch (record.type) {
|
|
|
160
|
- case 'edit':
|
|
|
161
|
- title = '编辑关键词';
|
|
|
162
|
- break;
|
|
|
163
|
- case 'delete':
|
|
|
164
|
- title = '删除关键词';
|
|
|
165
|
- break;
|
|
|
166
|
- default:
|
|
|
167
|
- title = '新建关键词';
|
|
|
168
|
- break;
|
|
|
169
|
- }
|
|
|
170
|
- }
|
|
|
171
|
-
|
|
|
172
|
if (record && record.type === 'delete') {
|
195
|
if (record && record.type === 'delete') {
|
173
|
return (
|
196
|
return (
|
174
|
- <Modal title={title} visible={showModal} onOk={this.handleOk} onCancel={hideOptionModal}>
|
197
|
+ <Modal title={this.modalTitle} visible={true} onOk={this.handleOk} onCancel={this.hideOptionModal}>
|
175
|
<p>确认删除该关键词?</p>
|
198
|
<p>确认删除该关键词?</p>
|
176
|
</Modal>
|
199
|
</Modal>
|
177
|
)
|
200
|
)
|
178
|
} else {
|
201
|
} else {
|
179
|
- const uploadButton = (
|
|
|
180
|
- <div>
|
|
|
181
|
- <Icon type={this.state.loading ? 'loading' : 'plus'} />
|
|
|
182
|
- <div className="ant-upload-text">Upload</div>
|
|
|
183
|
- </div>
|
|
|
184
|
- );
|
|
|
185
|
-
|
|
|
186
|
const imageUrl = '';
|
202
|
const imageUrl = '';
|
187
|
|
203
|
|
188
|
return (
|
204
|
return (
|
189
|
- <Modal title={title} visible={showModal} onOk={this.handleOk} onCancel={hideOptionModal}>
|
205
|
+ <Modal title={this.modalTitle} visible={true} onOk={this.handleOk} onCancel={this.hideOptionModal}>
|
190
|
<div style={{ paddingBottom: 10 }}>
|
206
|
<div style={{ paddingBottom: 10 }}>
|
191
|
<span>关键词:</span>
|
207
|
<span>关键词:</span>
|
192
|
<Input onChange={this.handleKeywordChange} />
|
208
|
<Input onChange={this.handleKeywordChange} />
|
|
@@ -206,7 +222,7 @@ class OptionModal extends React.Component { |
|
@@ -206,7 +222,7 @@ class OptionModal extends React.Component { |
206
|
beforeUpload={this.beforeUpload}
|
222
|
beforeUpload={this.beforeUpload}
|
207
|
onChange={this.handleImageChange}
|
223
|
onChange={this.handleImageChange}
|
208
|
style={{ width: 600 }}>
|
224
|
style={{ width: 600 }}>
|
209
|
- {imageUrl ? <img src={imageUrl} alt="" /> : uploadButton}
|
225
|
+ {imageUrl ? <img src={imageUrl} alt="" /> : this.uploadButton(this.state.loading)}
|
210
|
</Upload>
|
226
|
</Upload>
|
211
|
</div>
|
227
|
</div>
|
212
|
<div style={{ paddingBottom: 10 }}>
|
228
|
<div style={{ paddingBottom: 10 }}>
|
|
@@ -249,6 +265,13 @@ class HotKeywords extends React.Component { |
|
@@ -249,6 +265,13 @@ class HotKeywords extends React.Component { |
249
|
};
|
265
|
};
|
250
|
|
266
|
|
251
|
this.hotApi = new HotApi();
|
267
|
this.hotApi = new HotApi();
|
|
|
268
|
+
|
|
|
269
|
+ this.loadHotList = this.loadHotList.bind(this);
|
|
|
270
|
+ this.handleTableChange = this.handleTableChange.bind(this);
|
|
|
271
|
+ this.deleteTableRow = this.deleteTableRow.bind(this);
|
|
|
272
|
+ this.hideOptionModal = this.hideOptionModal.bind(this);
|
|
|
273
|
+ this.addTableRow = this.addTableRow.bind(this);
|
|
|
274
|
+
|
252
|
this.loadHotList();
|
275
|
this.loadHotList();
|
253
|
}
|
276
|
}
|
254
|
loadHotList(params = {}) {
|
277
|
loadHotList(params = {}) {
|
|
@@ -304,16 +327,17 @@ class HotKeywords extends React.Component { |
|
@@ -304,16 +327,17 @@ class HotKeywords extends React.Component { |
304
|
this.modelRecord = null;
|
327
|
this.modelRecord = null;
|
305
|
this.setState({showModal: false});
|
328
|
this.setState({showModal: false});
|
306
|
}
|
329
|
}
|
|
|
330
|
+ optionModal(showModal) {
|
|
|
331
|
+ if (showModal) {
|
|
|
332
|
+ return <OptionModal hideOptionModal={this.hideOptionModal} record={this.modelRecord} loadHotList={this.loadHotList}/>
|
|
|
333
|
+ } else {
|
|
|
334
|
+ return <div></div>;
|
|
|
335
|
+ }
|
|
|
336
|
+ }
|
307
|
render() {
|
337
|
render() {
|
308
|
const { showModal, dataSource, columns, selectedRowKeys, pagination, loading } = this.state;
|
338
|
const { showModal, dataSource, columns, selectedRowKeys, pagination, loading } = this.state;
|
309
|
const hasSelected = selectedRowKeys.length > 0;
|
339
|
const hasSelected = selectedRowKeys.length > 0;
|
310
|
|
340
|
|
311
|
- const loadHotList = this.loadHotList.bind(this);
|
|
|
312
|
- const handleTableChange = this.handleTableChange.bind(this);
|
|
|
313
|
- const deleteTableRow = this.deleteTableRow.bind(this);
|
|
|
314
|
- const hideOptionModal = this.hideOptionModal.bind(this);
|
|
|
315
|
- const addTableRow = this.addTableRow.bind(this);
|
|
|
316
|
-
|
|
|
317
|
const rowSelection = {
|
341
|
const rowSelection = {
|
318
|
selectedRowKeys,
|
342
|
selectedRowKeys,
|
319
|
onChange: this.onSelectChange.bind(this)
|
343
|
onChange: this.onSelectChange.bind(this)
|
|
@@ -327,14 +351,14 @@ class HotKeywords extends React.Component { |
|
@@ -327,14 +351,14 @@ class HotKeywords extends React.Component { |
327
|
return (
|
351
|
return (
|
328
|
<div>
|
352
|
<div>
|
329
|
<div style={{ paddingBottom: 10 }}>
|
353
|
<div style={{ paddingBottom: 10 }}>
|
330
|
- <Button type="primary" onClick={deleteTableRow} disabled={!hasSelected} loading={loading}>删除</Button>
|
|
|
331
|
- <Button type="primary" style={{ marginLeft: 10 }} onClick={addTableRow}>添加</Button>
|
354
|
+ <Button type="primary" onClick={this.deleteTableRow} disabled={!hasSelected} loading={loading}>删除</Button>
|
|
|
355
|
+ <Button type="primary" style={{ marginLeft: 10 }} onClick={this.addTableRow}>添加</Button>
|
332
|
<Button type="primary" style={{ marginLeft: 10 }} onClick={this.sendToBaidu}>推送百度</Button>
|
356
|
<Button type="primary" style={{ marginLeft: 10 }} onClick={this.sendToBaidu}>推送百度</Button>
|
333
|
- <OptionModal showModal={showModal} hideOptionModal={hideOptionModal} record={this.modelRecord} loadHotList={loadHotList}/>
|
357
|
+ {this.optionModal(showModal)}
|
334
|
</div>
|
358
|
</div>
|
335
|
|
359
|
|
336
|
<Table rowSelection={rowSelection} dataSource={dataSource} columns={columns}
|
360
|
<Table rowSelection={rowSelection} dataSource={dataSource} columns={columns}
|
337
|
- rowKey={rowKey} pagination={pagination} onChange={handleTableChange}/>
|
361
|
+ rowKey={rowKey} pagination={pagination} onChange={this.handleTableChange}/>
|
338
|
</div>
|
362
|
</div>
|
339
|
);
|
363
|
);
|
340
|
}
|
364
|
}
|