Haina
/
Global-sales
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

perf: Dev 不发送 PageSpy；初步开发订单跟踪

Browse Source
dev/ckeditor
LiaoYijun 4 months ago
parent 1f972f417b
commit c395ea1e8d
2 changed files with 514 additions and 39 deletions
Show Stats Download Patch File Download Diff File

4
src/components/ErrorBoundary.jsx
Unescape Escape View File

@ -15,7 +15,9 @@ class ErrorBoundary extends PureComponent {
componentDidCatch(error, info) {
console.error('Sorry, Something went wrong.')
console.error(error)
window.$pageSpy.triggerPlugins('onOfflineLog', 'upload');
if (import.meta.env.PROD && window.$pageSpy) {
window.$pageSpy.triggerPlugins('onOfflineLog', 'upload')
}
this.setState({ hasError: true, info: error.message })
}

549
src/views/orders/Follow.jsx
Unescape Escape View File

@ -4,8 +4,30 @@ import { PERM_IMPORT_EMAIL } from '@/stores/AuthStore'
import useFormStore from '@/stores/FormStore'
import { useOrderStore } from '@/stores/OrderStore'
import { copy, isNotEmpty, isEmpty } from '@/utils/commons'
import { WhatsAppOutlined, ImportOutlined } from '@ant-design/icons'
import { App, Badge, Empty, Flex, Button, Radio, Space, Switch, Table, Tabs, Divider, Tag, Tooltip } from 'antd'
import {
WhatsAppOutlined,
ImportOutlined,
FileAddOutlined,
BarsOutlined,
DownOutlined,
MailOutlined,
PhoneOutlined,
UserOutlined,
FieldNumberOutlined,
SaveOutlined,
PlusOutlined,
MehOutlined,
SmileOutlined,
CheckSquareTwoTone,
CarryOutTwoTone,
MailTwoTone,
SwitcherTwoTone,
FolderTwoTone,
CalendarTwoTone,
CalendarOutlined,
HeartTwoTone, MoneyCollectTwoTone
} from '@ant-design/icons'
import { App, Badge, Empty, Flex, Button, Drawer , Space, Radio, Table, Tabs, Divider, Tag, Tooltip, Row, Col, Segmented, Tree, Typography, Input, Descriptions, Checkbox } from 'antd'
import dayjs from 'dayjs'
import { useCallback, useEffect, useState } from 'react'
import { Link } from 'react-router-dom'
@ -313,6 +335,13 @@ function OrderGroupTable({ formValues }) {
}
function Follow() {
const [openMail, setOpenMail] = useState(false);
const [mailSubject, setSubject] = useState('');
const [openOrder, setOpenOrder] = useState(false);
const [formValues, setFormValues] = useFormStore(useShallow((state) => [state.orderFollowForm, state.setOrderFollowForm]))
const [advanceChecked, toggleAdvance] = useFormStore(useShallow((state) => [state.orderFollowAdvanceChecked, state.setOrderFollowAdvanceChecked]))
@ -329,45 +358,489 @@ function Follow() {
return (
<>
<Space direction='vertical' size='large' style={{ width: '100%' }}>
<Flex gap='large' justify='start' align='center' horizontal='true'>
<Radio.Group
options={[
{ label: '今日任务', value: 'today' },
{ label: '重点订单', value: 'zhongdian' },
{ label: '次重点客户', value: 'qianli' },
{ label: '成行', value: 'chengxing' },
{ label: '走团中', value: 'zoutuan' },
{ label: '走团后一月', value: 'zoutuanhou' },
<Row gutter={16}>
<Col span={4}>
<Flex justify='start' align='start' vertical>
<Segmented className='w-full' block shape='round' options={['AH', 'CH', 'GH']} />
<Tree
showIcon
showLine
defaultExpandedKeys={['0-0', '0-1']}
defaultSelectedKeys={['0-0-0']}
treeData={[
{
title: '今日任务',
key: '0-0',
icon: <CalendarTwoTone />,
children: [
{
title: '(新订单)HXZ240913082',
key: '0-0-0',
},
{
title: '(老邮件)HXZ241017089',
key: '0-0-1',
},
],
},
{
title: '待办任务',
key: '0-1',
icon: <SwitcherTwoTone />,
children: [
{
title: '(一催)HXZ250213117',
key: '0-1-0',
},
{
title: '(二催)HXZ250213117',
key: '0-1-1',
},
{
title: '(三催)HXZ250213117',
key: '0-1-2',
},
{
title: '(余款收付)HXZ250209048',
key: '0-1-3',
},
{
title: '(入境提醒)HXZ250209048',
key: '0-1-4',
},
],
},
{
title: '草稿',
key: '0-2',
icon: <MailTwoTone />,
},
{
title: '收件箱',
key: '0-3',
icon: <FolderTwoTone />,
children: [
{
title: '1月',
key: '0-3-0',
icon: <FolderTwoTone />,
},
{
title: '2月',
key: '0-3-1',
icon: <FolderTwoTone />,
},
{
title: '3月',
key: '0-3-2',
icon: <FolderTwoTone />,
},
{
title: '4月',
key: '0-3-3',
icon: <FolderTwoTone />,
},
{
title: '5月',
key: '0-3-4',
icon: <FolderTwoTone />,
},
],
},
{
title: '已发送',
key: '0-4',
icon: <CarryOutTwoTone />,
},
{
title: '已处理',
key: '0-5',
icon: <CheckSquareTwoTone />,
},
]}
/>
</Flex>
</Col>
<Col span={14}>
<div className='flex gap-1 items-center'>
<Button onClick={() => {}} icon={<PlusOutlined />} type={'primary'} ghost shape={'circle'} size='small' />
<Input.Search
className=''
allowClear
onChange={(e) => {}}
onPressEnter={(e) => {
return false
}}
placeholder={`名称/号码/订单号`}
/>
</div>
<Table
onRow={(record) => {
return {
onClick: (event) => {console.info(event)}, // 点击行
onDoubleClick: (event) => {},
onContextMenu: (event) => {},
onMouseEnter: (event) => {}, // 鼠标移入行
onMouseLeave: (event) => {},
};
}}
pagination={false}
columns={[
{
title: '收/发件人',
dataIndex: 'name',
key: 'name',
render: (text) => <a>{text}</a>,
},
{
title: '主题',
dataIndex: 'subject',
key: 'subject',
render: (text) => <a onClick={() => {
setSubject(text)
setOpenMail(true)
}}>{text}</a>,
},
{
title: '收/发日期',
dataIndex: 'mailDate',
key: '收/发日期',
},
{
title: '订单号',
key: 'orderNo',
dataIndex: 'orderNo',
},
{
title: '国籍',
key: 'country',
dataIndex: 'country',
},
{
title: '操作',
key: 'action',
render: (_, record) => (
<Space size='middle'>
<a>回复</a>
<a>转发</a>
</Space>
),
},
]}
dataSource={[
{
key: Math.random().toString(36).substring(2, 9),
name: 'Fran Grundman <frangrundman@rogers.com>',
subject: 'Your Thailand Private tour by "Asia Highlights" ' + Math.random().toString(36).substring(2, 9),
mailDate: '2025-05-01 19:21:00',
orderNo: 'LSS250501006',
country: 'Thailand',
},
{
key: Math.random().toString(36).substring(2, 9),
name: 'Fran Grundman <frangrundman@rogers.com>',
subject: '【阿里云邮】弱密改密提醒 ' + Math.random().toString(36).substring(2, 9),
mailDate: '2025-05-01 19:21:00',
orderNo: 'LSS250501006',
country: 'Thailand',
},
{
key: Math.random().toString(36).substring(2, 9),
name: 'Fran Grundman <frangrundman@rogers.com>',
subject: 'Your Thailand Private tour by "Asia Highlights" ' + Math.random().toString(36).substring(2, 9),
mailDate: '2025-05-01 19:21:00',
orderNo: 'LSS250501006',
country: 'Thailand',
},
{
key: Math.random().toString(36).substring(2, 9),
name: 'Fran Grundman <frangrundman@rogers.com>',
subject: 'Your Thailand Private tour by "Asia Highlights" ' + Math.random().toString(36).substring(2, 9),
mailDate: '2025-05-01 19:21:00',
orderNo: 'LSS250501006',
country: 'Thailand',
},
{
key: Math.random().toString(36).substring(2, 9),
name: 'Fran Grundman <frangrundman@rogers.com>',
subject: 'Your Thailand Private tour by "Asia Highlights" ' + Math.random().toString(36).substring(2, 9),
mailDate: '2025-05-01 19:21:00',
orderNo: 'LSS250501006',
country: 'Thailand',
},
{
key: Math.random().toString(36).substring(2, 9),
name: 'Fran Grundman <frangrundman@rogers.com>',
subject: 'Your Thailand Private tour by "Asia Highlights" ' + Math.random().toString(36).substring(2, 9),
mailDate: '2025-05-01 19:21:00',
orderNo: 'LSS250501006',
country: 'Thailand',
},
{
key: Math.random().toString(36).substring(2, 9),
name: 'Fran Grundman <frangrundman@rogers.com>',
subject: 'Your Thailand Private tour by "Asia Highlights" ' + Math.random().toString(36).substring(2, 9),
mailDate: '2025-05-01 19:21:00',
orderNo: 'LSS250501006',
country: 'Thailand',
},
{
key: Math.random().toString(36).substring(2, 9),
name: 'Fran Grundman <frangrundman@rogers.com>',
subject: 'Your Thailand Private tour by "Asia Highlights" ' + Math.random().toString(36).substring(2, 9),
mailDate: '2025-05-01 19:21:00',
orderNo: 'LSS250501006',
country: 'Thailand',
},
{
key: Math.random().toString(36).substring(2, 9),
name: 'Fran Grundman <frangrundman@rogers.com>',
subject: 'Your Thailand Private tour by "Asia Highlights" ' + Math.random().toString(36).substring(2, 9),
mailDate: '2025-05-01 19:21:00',
orderNo: 'LSS250501006',
country: 'Thailand',
},
{
key: Math.random().toString(36).substring(2, 9),
name: 'Fran Grundman <frangrundman@rogers.com>',
subject: 'Your Thailand Private tour by "Asia Highlights" ' + Math.random().toString(36).substring(2, 9),
mailDate: '2025-05-01 19:21:00',
orderNo: 'LSS250501006',
country: 'Thailand',
},
{
key: Math.random().toString(36).substring(2, 9),
name: 'Fran Grundman <frangrundman@rogers.com>',
subject: 'Your Thailand Private tour by "Asia Highlights" ' + Math.random().toString(36).substring(2, 9),
mailDate: '2025-05-01 19:21:00',
orderNo: 'LSS250501006',
country: 'Thailand',
},
{
key: Math.random().toString(36).substring(2, 9),
name: 'Fran Grundman <frangrundman@rogers.com>',
subject: 'Your Thailand Private tour by "Asia Highlights" ' + Math.random().toString(36).substring(2, 9),
mailDate: '2025-05-01 19:21:00',
orderNo: 'LSS250501006',
country: 'Thailand',
},
{
key: Math.random().toString(36).substring(2, 9),
name: 'Fran Grundman <frangrundman@rogers.com>',
subject: 'Your Thailand Private tour by "Asia Highlights" ' + Math.random().toString(36).substring(2, 9),
mailDate: '2025-05-01 19:21:00',
orderNo: 'LSS250501006',
country: 'Thailand',
},
]}
value={formValues.type}
onChange={({ target: { value } }) => {
setFormValues({
...formValues,
type: value,
})
}}
optionType='button'
buttonStyle='solid'
disabled={advanceChecked}
/>
<Switch
checkedChildren='高级查询'
unCheckedChildren='高级查询'
checked={advanceChecked}
onChange={() => {
toggleAdvance(!advanceChecked)
}}
/>
{/*
<Divider />
<Descriptions title="Your Thailand Private tour by 'Asia Highlights' 超长主题怎么办？？？？？？？？？？？？到框框到得奖看到" items={[
{
key: '1',
label: '发件人',
children: '"阿里邮箱" <no-reply@mailsupport.aliyun.com>',
},
{
key: '2',
label: '收件人',
children: '<liaoyijun@chinahighlights.com>',
},
{
key: '3',
label: '发送日期',
children: '2025-05-16 14:11',
},
]} />
<Flex gap="small">
<Space.Compact>
<Button color="primary" variant="solid">
回复
</Button>
<Button color="primary" variant="outlined">
回复全部
</Button>
<Button color="primary" variant="outlined" >
转发
</Button>
</Space.Compact>
<Button color="cyan" variant="outlined">
已处理
</Button>
<Button color="cyan" variant="outlined">
绑定订单
</Button>
</Flex>
<div className='border-solid border rounded border-gray-300'>
<div id='__preHtml__' className='whitespace-pre-wrap break-words' dangerouslySetInnerHTML={{ __html: '邮件内容。。。。。<br/>换行了。。。看看 ' }}></div>
</div> */}
</Col>
<Col span={6}>
<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>
<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="附加信息" style={{ width: 'calc(100% - 200px)' }} />
<Button icon={<SaveOutlined />} />
</Space.Compact>
<Flex gap="small">
<Button color="cyan" variant="outlined" onClick={() => {
setOpenOrder(true)
}}>
订单状态
</Button>
<Button color="cyan" variant="outlined">
提醒中心
</Button>
</Flex>
</Col>
</Row>
<Drawer
title={mailSubject}
placement="right"
// getContainer={false}
size={'large'}
mask={false}
maskClosable={true}
open={openMail}
onClose={() => setOpenMail(false)}
extra={
<Space>
<Button color="primary" variant="solid">
回复
</Button>
<Button color="primary" variant="outlined">
回复全部
</Button>
<Button color="primary" variant="outlined" >
转发
</Button>
<Button color="cyan" variant="outlined">
已处理
</Button>
</Space>
}
footer={
<Space>footer</Space>
}
>
<Descriptions column={1} title="Your Thailand Private tour by 'Asia Highlights' 超长主题怎么办？？？？？？？？？？？？到框框到得奖看到" items={[
{
key: '1',
label: '发件人',
children: '"阿里邮箱" <no-reply@mailsupport.aliyun.com>',
},
{
key: '2',
label: '收件人',
children: '<liaoyijun@chinahighlights.com>',
},
{
key: '3',
label: '发送日期',
children: '2025-05-16 14:11',
},
]} />
<p>{Math.random().toString(36).substring(2, 9)}Some contents...</p>
<p>Some contents...</p>
<p>Some contents...</p>
</Drawer>
<Drawer
title={'订单状态'}
placement="right"
// getContainer={false}
size={'large'}
mask={false}
maskClosable={true}
open={openOrder}
onClose={() => setOpenOrder(false)}
>
<Divider orientation="left">
<Typography.Text strong>是否重要</Typography.Text>
</Divider>
<Radio.Group options={[
{ label: '重点', value: '1' },
{ label: '次重点', value: '2' },
{ label: '一般', value: '3' },
]} />
<Divider orientation="left">
<Typography.Text strong>状态</Typography.Text>
</Divider>
<Radio.Group options={[
{ label: '新订单', value: '4' },
{ label: '报价中', value: '5' },
{ label: '以后联系', value: '6' },
{ label: '等待付订金', value: '7' },
{ label: '成行', value: '8' },
{ label: '丢失', value: '9' },
{ label: '取消', value: '10' },
{ label: '未报价', value: '11' },
]} />
<Divider orientation="left">
<Typography.Text strong> 催信</Typography.Text>
</Divider>
<Checkbox.Group options={[
{ label: '一催', value: 'Apple', className: 'label-1' },
{ label: '二催', value: 'Pear', className: 'label-2' },
{ label: '三催', value: 'Orange', className: 'label-3' },
{ label: '重点团', value: '2233342', className: 'label-3' },
{ label: '已发 travel advisor survey', value: '43535', className: 'label-3' },
]} defaultValue={['Apple']} />
</Drawer>
<Conditional
condition={isPermitted(PERM_IMPORT_EMAIL)}
whenTrue={<Button type='default' shape='round' icon={<ImportOutlined />} size='small' onClick={handleImportEmail}/>}
/>
</Flex>
<Conditional condition={advanceChecked} whenTrue={<AdvanceSearchForm onSubmit={handleSubmit} initialValues={formValues} />} />
<OrderGroupTable formValues={formValues} />
</Space>
</>
)
}

Write Preview
Loading…
Cancel
Save