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

perf：调整邮件列表样式和代码

Browse Source
dev/ckeditor
LiaoYijun 2 weeks ago
parent 095a8f3d3b
commit 06a3e95e1a
2 changed files with 121 additions and 124 deletions
Show Stats Download Patch File Download Diff File

56
src/components/OrderProfile.jsx
Unescape Escape View File

@ -1,7 +1,7 @@
import { WhatsAppOutlined, FileAddOutlined, MailOutlined, PhoneOutlined, UserOutlined, FieldNumberOutlined, CompassOutlined, CalendarOutlined, EditOutlined, CheckOutlined } from '@ant-design/icons'
import { useEffect, useState } from 'react'
import { App, Flex, Select, Tooltip, Tabs, Button, Divider, Typography, Skeleton, Checkbox } from 'antd'
import { App, Flex, Select, Tooltip, Divider, Typography, Skeleton, Checkbox } from 'antd'
import { useOrderStore, fetchSetRemindStateAction, OrderLabelDefaultOptions, OrderStatusDefaultOptions, remindStatusOptions } from '@/stores/OrderStore'
import { copy, isEmpty } from '@/utils/commons'
const OrderProfile = ({ coliSN, ...props }) => {
@ -21,7 +21,7 @@ const OrderProfile = ({ coliSN, ...props }) => {
s.appendOrderComment,
])
const [orderRemindState, setOrderRemindState] = useState(orderDetail.remindstate);
const [orderRemindState, setOrderRemindState] = useState(orderDetail.remindstate)
useEffect(() => {
if (coliSN) {
setLoading(true)
@ -40,20 +40,20 @@ const OrderProfile = ({ coliSN, ...props }) => {
}, [coliSN])
const handleSetRemindState = async (checkedValue) => {
const state = checkedValue.filter(v => v !== orderRemindState);
const oldState = orderRemindState;
const state = checkedValue.filter((v) => v !== orderRemindState)
const oldState = orderRemindState
try {
if (isEmpty(state)) {
setOrderRemindState(null);
setOrderRemindState(null)
} else {
setOrderRemindState(state[0]);
setOrderRemindState(state[0])
}
await fetchSetRemindStateAction({ coli_sn: coliSN, remindstate: state });
message.success('设置成功');
await fetchSetRemindStateAction({ coli_sn: coliSN, remindstate: state })
message.success('设置成功')
} catch (error) {
notification.warning({ message: '设置失败', description: error.message, placement: 'top', duration: 60 });
setOrderRemindState(oldState);
notification.warning({ message: '设置失败', description: error.message, placement: 'top', duration: 60 })
setOrderRemindState(oldState)
}
}
@ -79,7 +79,7 @@ const OrderProfile = ({ coliSN, ...props }) => {
})}
/> */}
<Skeleton active loading={loading}>
<Flex gap='small' vertical={true} justify='space-between'>
<Flex gap='small' vertical={true} justify='space-between' className='p-2'>
<Typography.Text>
<FieldNumberOutlined className='pr-1' />
{orderDetail.order_no}
@ -129,19 +129,19 @@ const OrderProfile = ({ coliSN, ...props }) => {
width: '100%',
}}
variant='underlined'
onSelect={value => {
setOrderPropValue(coliSN, "orderlabel", value)
onSelect={(value) => {
setOrderPropValue(coliSN, 'orderlabel', value)
.then(() => {
message.success("设置成功");
message.success('设置成功')
})
.catch(reason => {
.catch((reason) => {
notification.error({
message: "设置出错",
message: '设置出错',
description: reason.message,
placement: "top",
placement: 'top',
duration: 60,
});
});
})
})
}}
value={orderDetail.tags}
options={orderLabelOptions}
@ -154,19 +154,19 @@ const OrderProfile = ({ coliSN, ...props }) => {
width: '100%',
}}
variant='underlined'
onSelect={value => {
setOrderPropValue(coliSN, "orderstatus", value)
onSelect={(value) => {
setOrderPropValue(coliSN, 'orderstatus', value)
.then(() => {
message.success("设置成功");
message.success('设置成功')
})
.catch(reason => {
.catch((reason) => {
notification.error({
message: "设置出错",
message: '设置出错',
description: reason.message,
placement: "top",
placement: 'top',
duration: 60,
});
});
})
})
}}
value={orderDetail.states}
options={orderStatusOptions}
@ -176,7 +176,7 @@ const OrderProfile = ({ coliSN, ...props }) => {
<Divider orientation='left'>
<Typography.Text strong>催信</Typography.Text>
</Divider>
<Checkbox.Group key='substatus' className="px-2" value={[orderRemindState]} options={remindStatusOptions} onChange={handleSetRemindState} />
<Checkbox.Group key='substatus' className='px-2' value={[orderRemindState]} options={remindStatusOptions} onChange={handleSetRemindState} />
<Divider orientation='left'>
<Typography.Text strong>表单信息</Typography.Text>

61
src/views/orders/components/MailBox.jsx
Unescape Escape View File

@ -1,6 +1,6 @@
import { useEffect, useState } from 'react'
import { ReloadOutlined, ReadOutlined, CheckSquareOutlined, RightOutlined, LeftOutlined, ExpandOutlined } from '@ant-design/icons'
import { Flex, Button, Tooltip, List, Form, Row, Col, Dropdown, Input, Checkbox, DatePicker, Switch, Breadcrumb, Skeleton } from 'antd'
import { ReloadOutlined, ReadOutlined, RightOutlined, LeftOutlined, ExpandOutlined } from '@ant-design/icons'
import { Flex, Button, Tooltip, List, Form, Row, Col, Input, Checkbox, DatePicker, Switch, Breadcrumb, Skeleton } from 'antd'
import dayjs from 'dayjs'
import { useEmailList } from '@/hooks/useEmail'
import { isEmpty } from '@/utils/commons'
@ -12,7 +12,7 @@ const { RangePicker } = DatePicker
const PAGE_SIZE = 50 // 每页显示条数
const MailBox = ({ mailboxDir, onMailItemClick, onSelect, ...props }) => {
const MailBox = ({ mailboxDir, onMailItemClick, ...props }) => {
const DATE_RANGE_PRESETS = [
{
label: '本周',
@ -100,21 +100,18 @@ const MailBox = ({ mailboxDir, onMailItemClick, onSelect, ...props }) => {
const mailStateClass = item.MOI_ReadState === 0 ? 'font-bold' : ''
const hasAtta = item.MAI_Attachment !== 0 ? <AttachmentIcon className='text-blue-500' /> : null
return (
<li
className={`flex border border-solid border-t-0 border-x-0 border-gray-200 hover:bg-neutral-50 active:bg-gray-200 p-2 ${props.currentActiveMailItem === item.key ? 'bg-neutral-100' : ''}`}>
<li className={`flex border border-solid border-t-0 border-x-0 border-gray-200 hover:bg-neutral-50 active:bg-gray-200 p-2 ${props.currentActiveMailItem === item.key ? 'bg-neutral-100' : ''}`}>
<div className=''>
<Checkbox
checked={selectedItems.some((i) => i.MAI_SN === item.MAI_SN)}
onClick={e => {
const isChecked = e.target.checked;
const updatedSelection = isChecked
? [...selectedItems, item]
: selectedItems.filter((item) => item.MAI_SN !== item.MAI_SN)
onClick={(e) => {
const isChecked = e.target.checked
const updatedSelection = isChecked ? [...selectedItems, item] : selectedItems.filter((item) => item.MAI_SN !== item.MAI_SN)
setSelectedItems(updatedSelection)
}
}></Checkbox>
}}></Checkbox>
</div>
<div className='flex-1 pl-2'
<div
className='flex-1 pl-2'
onClick={() => {
onMailItemClick(item)
}}>
@ -138,38 +135,38 @@ const MailBox = ({ mailboxDir, onMailItemClick, onSelect, ...props }) => {
<Flex wrap gap='middle' justify={'center'} className='min-w-40'>
<Tooltip title='全选'>
<Checkbox
indeterminate={
selectedItems.length > 0 &&
selectedItems.length < pagination.pagedList.length
}
checked={pagination.pagedList.length === 0 ? false : pagination.pagedList.every((item) =>
selectedItems.some((selected) => selected.MAI_SN === item.MAI_SN)
)}
indeterminate={selectedItems.length > 0 && selectedItems.length < pagination.pagedList.length}
checked={pagination.pagedList.length === 0 ? false : pagination.pagedList.every((item) => selectedItems.some((selected) => selected.MAI_SN === item.MAI_SN))}
onChange={(e) => {
const isChecked = e.target.checked;
const isChecked = e.target.checked
if (isChecked) {
setSelectedItems((prev) => [
...prev,
...pagination.pagedList,
]);
setSelectedItems((prev) => [...prev, ...pagination.pagedList])
} else {
setSelectedItems([]);
setSelectedItems([])
}
}}
></Checkbox>
}}></Checkbox>
</Tooltip>
<Tooltip title='标记已读'>
<Button shape='circle' type='text' size='small' icon={<ReadOutlined />}
<Button
shape='circle'
type='text'
size='small'
icon={<ReadOutlined />}
onClick={() => {
markAsRead(selectedItems.map((item) => item.MAI_SN))
}}
/>
</Tooltip>
<Tooltip title='已处理'>
<Button shape='circle' type='text' size='small' icon={<MailCheckIcon />}
<Button
shape='circle'
type='text'
size='small'
icon={<MailCheckIcon />}
onClick={() => {
markAsProcessed(selectedItems.map((item) => item.MAI_SN))
}} />
}}
/>
</Tooltip>
<Tooltip title='刷新'>
<Button shape='circle' type='text' size='small' icon={<ReloadOutlined />} onClick={refresh} />
@ -214,7 +211,7 @@ const MailBox = ({ mailboxDir, onMailItemClick, onSelect, ...props }) => {
</Form>
</div>
<div className='bg-white overflow-y-auto' style={{ height: 'calc(100vh - 198px)' }}>
<div className='bg-white overflow-y-auto px-2' style={{ height: 'calc(100vh - 198px)' }}>
<Skeleton active loading={loading}>
<List
loading={loading}

Write Preview
Loading…
Cancel
Save