perf:更新催信模板菜单;

feat:增加树节点选择显示
dev/ckeditor
LiaoYijun 1 month ago
parent b6903c7a9d
commit 8b6326380d

@ -504,116 +504,246 @@ function Follow() {
orderNo: 'LSS250501006',
country: 'Thailand',
},
{
key: 5093968, //Math.random().toString(36).substring(2, 9),
description: 'Fran Grundman <frangrundman@rogers.com>',
title: 'Re: Asia Travel Tips /LSS250429038',
mailDate: '2025-05-01 19:21:00',
orderNo: 'LSS250501006',
country: 'Thailand',
},
]}
renderItem={(item) => (
<List.Item
className={item.key === activeEmailId ? `bg-blue-100` : ''}
key={item.title}
// actions={[
// <a key="list-vertical-star-o"></a>,
// <a key="list-vertical-refor"></a>,
// ]}
extra={<Checkbox></Checkbox>}>
<List.Item.Meta
className='cursor-pointer'
onClick={() => {
console.info('item: ', item)
setActiveEmailId(item.key)
}}
title={
<a href={item.href} onClick={() => {}}>
{item.title}
</a>
}
description={item.description + ' ' + item.mailDate}
/>
{item.content}LSS250501006, Thailand
</List.Item>
)}
/>
</div>
</Col>
<Col span={10} className='' style={{ height: 'calc(100vh - 166px)' }}>
<EmailDetailInline mailID={activeEmailId || 5291957} emailMsg={{}} variant={'outline'} size={'small'} />
{/* <EmailDetailInline mailID={5277561} emailMsg={{}} variant={'outline'} size={'small'} /> */}
</Col>
</Row>
</Layout.Content>
<Layout.Sider
zeroWidthTriggerStyle={{ top: '30px' }}
width='280'
theme={'light'}
style={{ maxHeight: 'calc(100vh - 166px)', height: 'calc(100vh - 166px)' }}
collapsible
collapsed={collapsed}
onCollapse={(value) => setCollapsed(value)}
collapsedWidth={0}
reverseArrow={true}>
<Flex gap={6} vertical={true} justify='space-between'>
<Typography.Text>
<FieldNumberOutlined className='pr-1' />
LSS250501006
<HeartTwoTone twoToneColor='#eb2f96' />
<MoneyCollectTwoTone twoToneColor='#eb2f96' />
</Typography.Text>
<Typography.Text>
<UserOutlined className=' pr-1' />
Jorgina(R1)
</Typography.Text>
<Typography.Text>
<CompassOutlined className=' pr-1' />
Thailand
</Typography.Text>
<Typography.Text>
<PhoneOutlined className=' pr-1' />
<Button type='link' size={'small'} onClick={() => {}}>
6596823833
</Button>
</Typography.Text>
<Typography.Text>
<MailOutlined className=' pr-1' />
Jorgina@gmail.com
</Typography.Text>
<Typography.Text>
<WhatsAppOutlined className='pr-1' />
<Button type='link' size={'small'} onClick={() => {}}>
6596826951
</Button>
</Typography.Text>
<Typography.Text>
<CalendarOutlined className='pr-1' />
<span>出发日期</span>2025-09-18已下计划
</Typography.Text>
<Typography.Text>
<span>特殊要求</span>
在华城市 桂林 对酒店和房型要求 5-star
</Typography.Text>
<Typography.Text>
<span>外联备注</span>
泰国马来水灯节
</Typography.Text>
</Flex>
<Divider orientation='left'>
<Typography.Text strong>表单信息</Typography.Text>
<FileAddOutlined className='pl-1' />
</Divider>
<p
className='p-2 overflow-auto m-0 break-words whitespace-pre-wrap'
dangerouslySetInnerHTML={{
__html:
'orderDetail.order_detailorderDetail.order_detailorderDetail.order_detailorderDetail.order_detailorderDetail.order_detailorderDetail.order_detailorderDetail.order_detailorderDetail.order_detailorderDetail.order_detailorderDetail.order_detailorderDetail.order_detail',
}}></p>
<Space.Compact block>
<Input addonBefore='附加信息' />
<Button icon={<SaveOutlined />} />
],
},
{
title: '已发送',
key: '0-4-sent',
icon: <RightSquareTwoTone />,
},
{
title: '已处理',
key: '0-5-completed',
icon: <CheckSquareTwoTone />,
},
]}
/>
</Flex></Layout.Sider>
<Layout.Content>
<Row>
<Col className='bg-white' span={16}>
<div className='bg-white h-auto px-1 flex gap-1 items-center'>
<Dropdown.Button className='w-auto' placement="bottom" arrow type={'primary'} menu={{
items: [
{
key: '1',
label: '一催模版1鼓励客人回复和讨论行程',
},
{
key: '2',
label: '一催模版2询问客人对于报价是否有疑问',
},{
type: 'divider',
},
{
key: '3',
label: '二催模版1省钱的方式',
},
{
key: '4',
label: '二催模版2Why us',
},{
type: 'divider',
},
{
key: '5',
label: '三催模版1再次强调服务',
},
{
key: '6',
label: '三催模版2客人常见问题询问',
}],
onClick: (item)=> {console.info('menu', item)},
}} onClick={() => {console.info('新邮件')}}>
新邮件
</Dropdown.Button>
<Input.Search
className=''
allowClear
onChange={(e) => {}}
onPressEnter={(e) => {
return false
}}
placeholder={`邮件主题`}
/>
<Button onClick={() => {}} >高级搜索</Button>
<Flex wrap gap="small">
<Tooltip title="选择">
<Checkbox></Checkbox>
</Tooltip>
<Tooltip title="标记已读">
<Button shape="circle" type="text" size='small' icon={<ReadOutlined />} />
</Tooltip>
<Tooltip title="已处理">
<Button shape="circle" type="text" size='small' icon={<CheckSquareOutlined />} />
</Tooltip>
<Tooltip title="刷新">
<Button shape="circle" type="text" size='small' icon={<ReloadOutlined />} />
</Tooltip>
</Flex>
</div>
<div className='bg-white overflow-y-auto'
style={{height: 'calc(100vh - 198px)'}}>
<List
// header={null}
header={<div>今日任务</div>}
itemLayout="vertical"
size="large"
pagination={false}
dataSource={[
{
key: Math.random().toString(36).substring(2, 9),
description: 'Fran Grundman <frangrundman@rogers.com>',
title: '250520-LSS250429038 团的 变更 <20>确认Japan Fleet',
mailDate: '2025-05-01 19:21:00',
orderNo: 'LSS250501006',
country: 'Thailand',
},
{
key: Math.random().toString(36).substring(2, 9),
description: 'Fran Grundman <frangrundman@rogers.com>',
title: 'Your Thailand Private tour by Asia Highlights 超长主题怎么办????????????到框框到得奖看到',
mailDate: '2025-05-01 19:21:00',
orderNo: 'LSS250501006',
country: 'Thailand',
},
{
key: Math.random().toString(36).substring(2, 9),
description: 'Fran Grundman <frangrundman@rogers.com>',
title: 'Re: Personal information',
mailDate: '2025-05-01 19:21:00',
orderNo: 'LSS250501006',
country: 'Thailand',
},
{
key: Math.random().toString(36).substring(2, 9),
description: 'Fran Grundman <frangrundman@rogers.com>',
title: 'Re: Your Future Trip with Asia Highlights',
mailDate: '2025-05-01 19:21:00',
orderNo: 'LSS250501006',
country: 'Thailand',
},
{
key: Math.random().toString(36).substring(2, 9),
description: 'Fran Grundman <frangrundman@rogers.com>',
title: '回复: 回复中华游251110-LSS250413051(AH)团计划',
mailDate: '2025-05-01 19:21:00',
orderNo: 'LSS250501006',
country: 'Thailand',
},
{
key: Math.random().toString(36).substring(2, 9),
description: 'Fran Grundman <frangrundman@rogers.com>',
title: 'Re: Greeting from Asia Highlights Alisa',
mailDate: '2025-05-01 19:21:00',
orderNo: 'LSS250501006',
country: 'Thailand',
},
{
key: Math.random().toString(36).substring(2, 9),
description: 'Fran Grundman <frangrundman@rogers.com>',
title: 'Re: Have you made any decisions about your Japan trip',
mailDate: '2025-05-01 19:21:00',
orderNo: 'LSS250501006',
country: 'Thailand',
},
{
key: Math.random().toString(36).substring(2, 9),
description: 'Fran Grundman <frangrundman@rogers.com>',
title: 'Re: Sri Lanka tour',
mailDate: '2025-05-01 19:21:00',
orderNo: 'LSS250501006',
country: 'Thailand',
},
{
key: Math.random().toString(36).substring(2, 9),
description: 'Fran Grundman <frangrundman@rogers.com>',
title: 'Re: How do you like the itinerary 3',
mailDate: '2025-05-01 19:21:00',
orderNo: 'LSS250501006',
country: 'Thailand',
},
{
key: Math.random().toString(36).substring(2, 9),
description: 'Fran Grundman <frangrundman@rogers.com>',
title: 'Re: Re: Re: Final cost',
mailDate: '2025-05-01 19:21:00',
orderNo: 'LSS250501006',
country: 'Thailand',
},
{
key: Math.random().toString(36).substring(2, 9),
description: 'Fran Grundman <frangrundman@rogers.com>',
title: 'Reference Number: LSS240628079',
mailDate: '2025-05-01 19:21:00',
orderNo: 'LSS250501006',
country: 'Thailand',
},
{
key: Math.random().toString(36).substring(2, 9),
description: 'Fran Grundman <frangrundman@rogers.com>',
title: 'Re: Personal information and Hiroshima tour for 2 people',
mailDate: '2025-05-01 19:21:00',
orderNo: 'LSS250501006',
country: 'Thailand',
},
{
key: Math.random().toString(36).substring(2, 9),
description: 'Fran Grundman <frangrundman@rogers.com>',
title: 'Re: Asia Travel Tips /LSS250429038',
mailDate: '2025-05-01 19:21:00',
orderNo: 'LSS250501006',
country: 'Thailand',
},
]}
renderItem={item => (
<List.Item
key={item.title}
// actions={[
// <a key="list-vertical-star-o"></a>,
// <a key="list-vertical-refor"></a>,
// ]}
extra={
<Checkbox></Checkbox>
}
>
<List.Item.Meta
className='cursor-pointer'
onClick={() => console.info('item: ', item)}
title={<a href={item.href} onClick={() => setSubject(item.title)}>{item.title}</a>}
description={item.description + ' ' + item.mailDate}
/>
{item.content}LSS250501006, Thailand
</List.Item>
)}
/>
</div>
</Col>
<Col span={8}>
<div>
<Flex gap="small">
<Space.Compact>
<Button color="primary" variant="solid" onClick={() => {
window.open(`/email/reply/5190495`, `${1}-${0}`,'left=20,width=1000')
}}>
回复
</Button>
<Button color="primary" variant="outlined" onClick={() => {
window.open(`/email/reply/5220965`, `${2}-${0}`,'left=20,width=1000')
}}>
回复全部
</Button>
<Button color="primary" variant="outlined" onClick={() => {
window.open(`/email/forward/5128754`, `${3}-${0}`,'left=20,width=1000')
}}>
转发
</Button>
</Space.Compact>
<Flex gap='small'>
<Button

Loading…
Cancel
Save