Skip to content

Commit 7416166

Browse files
ZhipingLi1994ZhipingLi1994
authored
Add noticeTemplate and noticeObjects copy function (#110)
* Update index.jsx Add copy * Update index.jsx update * Update index.jsx * Update index.jsx * Update index.jsx add copy * Update NoticeTemplateCreateModal.jsx fix add from bug.
1 parent 3482715 commit 7416166

File tree

3 files changed

+92
-11
lines changed

3 files changed

+92
-11
lines changed

‎src/pages/notice/index.jsx‎

Lines changed: 43 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
import React, { useState, useEffect, useCallback } from 'react';
22
import {Button, Table, Popconfirm, message, Input, Tag, Space, Tooltip, Drawer, Select} from 'antd';
33
import { CreateNoticeObjectModal } from './NoticeObjectCreateModal';
4-
import { deleteNotice, getNoticeList } from '../../api/notice';
4+
import { deleteNotice, getNoticeList, createNotice } from '../../api/notice';
55
import {getDutyManagerList} from "../../api/duty";
66
import {CopyOutlined, DeleteOutlined, EditOutlined, PlusOutlined} from "@ant-design/icons";
77
import { copyToClipboard } from "../../utils/copyToClipboard";
@@ -21,6 +21,7 @@ export const NoticeObjects = () => {
2121
const [height, setHeight] = useState(window.innerHeight);
2222
const [historyDrawerVisible, setHistoryDrawerVisible] = useState(false);
2323
const [selectedNoticeObject, setSelectedNoticeObject] = useState(null);
24+
const [createSelectedRow, setCreateSelectedRow] = useState(null); // 用于存放复制时带入的数据
2425
const columns = [
2526
{
2627
title: '名称',
@@ -116,7 +117,7 @@ export const NoticeObjects = () => {
116117
title: '操作',
117118
dataIndex: 'operation',
118119
fixed: 'right',
119-
width: 100,
120+
width: 140, // 增加宽度以容纳三个按钮
120121
render: (_, record) =>
121122
list.length >= 1 ? (
122123
<Space size="middle">
@@ -128,6 +129,15 @@ export const NoticeObjects = () => {
128129
style={{ color: "#1677ff" }}
129130
/>
130131
</Tooltip>
132+
{/* 新增的复制按钮 */}
133+
<Tooltip title="复制">
134+
<Button
135+
type="text"
136+
icon={<CopyOutlined />}
137+
onClick={(e) => handleCopy(record, e)}
138+
style={{ color: "#52c41a" }} // 使用绿色区分
139+
/>
140+
</Tooltip>
131141
<Tooltip title="删除">
132142
<Popconfirm
133143
title="确定要删除吗?"
@@ -208,9 +218,29 @@ export const NoticeObjects = () => {
208218
message.error(error);
209219
}
210220
};
221+
222+
const handleCopy = (record, e) => {
223+
// 1. 阻止事件冒泡，防止表格被意外选中或拦截
224+
if (e) {
225+
e.stopPropagation();
226+
e.preventDefault();
227+
}
228+
229+
// 2. 打印日志用于调试（按 F12 可以在控制台看到这行输出）
230+
console.log("【调试】点击了复制按钮，当前行数据：", record);
231+
232+
// 3. 使用深拷贝，彻底切断与原表格数据的引用关联
233+
const copiedRecord = JSON.parse(JSON.stringify(record));
234+
copiedRecord.name = `${copiedRecord.name}-复制`;
235+
236+
// 4. 设置状态并打开抽屉
237+
setCreateSelectedRow(copiedRecord);
238+
setVisible(true);
239+
};
211240

212241
const handleModalClose = () => {
213242
setVisible(false);
243+
setCreateSelectedRow(null); // 关闭弹窗时清空复制产生的数据
214244
};
215245

216246
const onSearch = async (value) => {
@@ -245,7 +275,9 @@ export const NoticeObjects = () => {
245275
<div>
246276
<Button
247277
type="primary"
248-
onClick={() => setVisible(true)}
278+
onClick={() => {
279+
setCreateSelectedRow(null); // 确保正常创建时是个空表单
280+
setVisible(true)}}
249281
style={{
250282
backgroundColor: '#000000'
251283
}}
@@ -256,7 +288,13 @@ export const NoticeObjects = () => {
256288
</div>
257289
</div>
258290

259-
<CreateNoticeObjectModal visible={visible} onClose={handleModalClose} type='create' handleList={handleList} />
291+
<CreateNoticeObjectModal
292+
visible={visible}
293+
onClose={handleModalClose}
294+
selectedRow={createSelectedRow}
295+
type='create'
296+
handleList={handleList}
297+
/>
260298

261299
<CreateNoticeObjectModal visible={updateVisible} onClose={handleUpdateModalClose} selectedRow={selectedRow} type='update' handleList={handleList} />
262300

@@ -295,4 +333,4 @@ export const NoticeObjects = () => {
295333
</Drawer>
296334
</>
297335
);
298-
};
336+
};

‎src/pages/notice/tmpl/NoticeTemplateCreateModal.jsx‎

Lines changed: 10 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -75,6 +75,13 @@ const NoticeTemplateCreateModal = ({ visible, onClose, selectedRow, type, handle
7575
setNotifyType(selectedRow.noticeType)
7676
setSelectedNotifyCard(t)
7777
console.log(t)
78+
}else {
79+
// 当 selectedRow 为空（即纯新建）时，强制重置表单和各个状态
80+
form.resetFields()
81+
setSpaceValue('')
82+
setIsChecked(false)
83+
setNotifyType('FeiShu')
84+
setSelectedNotifyCard(0)
7885
}
7986
}, [selectedRow, form])
8087

@@ -175,10 +182,11 @@ const NoticeTemplateCreateModal = ({ visible, onClose, selectedRow, type, handle
175182

176183
return (
177184
<Drawer
178-
title="创建通知模版"
185+
title={type === 'update' ? '更新通知模版' : '创建通知模版'}
179186
open={visible}
180187
onClose={onClose}
181188
size='large'
189+
destroyOnClose={true}
182190
footer={
183191
<div style={{display: 'flex', justifyContent: 'flex-end'}}>
184192
<Button
@@ -318,4 +326,4 @@ const NoticeTemplateCreateModal = ({ visible, onClose, selectedRow, type, handle
318326
)
319327
}
320328

321-
export default NoticeTemplateCreateModal
329+
export default NoticeTemplateCreateModal

‎src/pages/notice/tmpl/index.jsx‎

Lines changed: 39 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,7 @@ import { ReactComponent as DingdingIcon } from '../img/dingding.svg';
77
import { ReactComponent as EmailIcon } from '../img/Email.svg';
88
import { ReactComponent as WeChatIcon } from '../img/qywechat.svg'
99
import { ReactComponent as SlackIcon } from '../img/slack.svg'
10-
import {CopyOutlined, DeleteOutlined, EditOutlined, PlusOutlined} from "@ant-design/icons";
10+
import { DeleteOutlined, EditOutlined, PlusOutlined, CopyOutlined } from "@ant-design/icons";
1111
import {copyToClipboard} from "../../../utils/copyToClipboard";
1212
import {HandleShowTotal} from "../../../utils/lib";
1313
import {Breadcrumb} from "../../../components/Breadcrumb";
@@ -19,6 +19,7 @@ export const NoticeTemplate = () => {
1919
const [selectedRow, setSelectedRow] = useState(null);
2020
const [updateVisible, setUpdateVisible] = useState(false);
2121
const [visible, setVisible] = useState(false);
22+
const [createSelectedRow, setCreateSelectedRow] = useState(null);
2223
const [list, setList] = useState([]);
2324

2425
// 表头
@@ -142,7 +143,7 @@ export const NoticeTemplate = () => {
142143
{
143144
title: '操作',
144145
dataIndex: 'operation',
145-
width: 120,
146+
width: 140,
146147
fixed: 'right',
147148
render: (_, record) =>
148149
list.length >= 1 ? (
@@ -155,6 +156,15 @@ export const NoticeTemplate = () => {
155156
style={{ color: "#1677ff" }}
156157
/>
157158
</Tooltip>
159+
{/* 新增的复制按钮 */}
160+
<Tooltip title="复制">
161+
<Button
162+
type="text"
163+
icon={<CopyOutlined />}
164+
onClick={(e) => handleCopy(record, e)}
165+
style={{ color: "#52c41a" }}
166+
/>
167+
</Tooltip>
158168
<Tooltip title="删除">
159169
<Popconfirm
160170
title="确定要删除此模版吗?"
@@ -202,6 +212,7 @@ export const NoticeTemplate = () => {
202212
};
203213

204214
const handleModalClose = () => {
215+
setCreateSelectedRow(null); // 关闭弹窗时清空数据
205216
setVisible(false);
206217
};
207218

@@ -229,6 +240,21 @@ export const NoticeTemplate = () => {
229240
console.error(error);
230241
}
231242
};
243+
// 新增：处理复制逻辑
244+
const handleCopy = (record, e) => {
245+
if (e) {
246+
e.stopPropagation();
247+
e.preventDefault();
248+
}
249+
250+
// 深拷贝切断引用
251+
const copiedRecord = JSON.parse(JSON.stringify(record));
252+
copiedRecord.name = `${copiedRecord.name}-复制`;
253+
254+
// 设置状态并打开抽屉
255+
setCreateSelectedRow(copiedRecord);
256+
setVisible(true);
257+
};
232258

233259
return (
234260
<>
@@ -245,7 +271,10 @@ export const NoticeTemplate = () => {
245271
<div>
246272
<Button
247273
type="primary"
248-
onClick={() => setVisible(true)}
274+
onClick={() => {
275+
setCreateSelectedRow(null); // 确保正常创建时清空状态
276+
setVisible(true)
277+
}}
249278
style={{
250279
backgroundColor: '#000000'
251280
}}
@@ -256,7 +285,13 @@ export const NoticeTemplate = () => {
256285
</div>
257286
</div>
258287

259-
<NoticeTemplateCreateModal visible={visible} onClose={handleModalClose} type="create" handleList={handleList} />
288+
<NoticeTemplateCreateModal
289+
visible={visible}
290+
onClose={handleModalClose}
291+
selectedRow={createSelectedRow}
292+
type='create'
293+
handleList={handleList}
294+
/>
260295

261296
<NoticeTemplateCreateModal
262297
visible={updateVisible}

0 commit comments

Comments
 (0)