Commit 5915005d authored by Gavin Peng's avatar Gavin Peng

fix: 对接送货计划协同

parent 7147ca23
...@@ -2,10 +2,34 @@ import React, { useImperativeHandle, useState } from 'react' ...@@ -2,10 +2,34 @@ import React, { useImperativeHandle, useState } from 'react'
import moment from 'moment' import moment from 'moment'
import { Alert, Calendar, Modal } from 'antd' import { Alert, Calendar, Modal } from 'antd'
import { CalendarMode } from 'antd/lib/calendar/generateCalendar' import { CalendarMode } from 'antd/lib/calendar/generateCalendar'
import { CurrentlySelectedDateText, DefaultModalCancelText, DefaultModalOkText, DefaultSelectDateText } from '../translate'
interface CalendarModalProps { interface CalendarModalProps {
/**
* 标题
*/
title?: string,
/**
* 确认按钮文字自定义
*/
okText?: string,
/**
* 取消按钮文字自定义
*/
cancelText?: string,
/**
* Modal 宽度
*/
width?: string,
/**
* 确认操作 -> 反馈
*/
onOk?: (date: string) => void
/**
* 确认操作 -> 反馈
*/
onCancel?: (visible?: boolean) => void
} }
/** /**
...@@ -13,9 +37,11 @@ interface CalendarModalProps { ...@@ -13,9 +37,11 @@ interface CalendarModalProps {
* @author: Gavin * @author: Gavin
* @description: 组件 ref 提供如下方法 * @description: 组件 ref 提供如下方法
* - test: () => void ------> 测试方法 * - test: () => void ------> 测试方法
* - handleOpen: () => void ------> 打开弹窗
* - handleClose: () => void ------> 关闭弹窗
*/ */
const CalendarModal = React.forwardRef((props: CalendarModalProps, ref: React.Ref<unknown>) => { const CalendarModal = React.forwardRef((props: CalendarModalProps, ref: React.Ref<unknown>) => {
const {} = props const { title, width, okText, cancelText, onOk, onCancel } = props
const [visible, setVisible] = useState<boolean>(false) const [visible, setVisible] = useState<boolean>(false)
const [dateValue, setDateValue] = useState<moment.Moment>(moment()) const [dateValue, setDateValue] = useState<moment.Moment>(moment())
...@@ -28,19 +54,43 @@ const CalendarModal = React.forwardRef((props: CalendarModalProps, ref: React.Re ...@@ -28,19 +54,43 @@ const CalendarModal = React.forwardRef((props: CalendarModalProps, ref: React.Re
setDateValue(date) setDateValue(date)
} }
const modalOnOk = () => {
setVisible(false)
if (onOk) onOk(moment(dateValue).format('YYYY-MM-DD'))
}
const modalOnCancel = () => {
setVisible(false)
setDateValue(moment())
if (onCancel) onCancel(false)
}
useImperativeHandle(ref, () => ({ useImperativeHandle(ref, () => ({
test: () => { // 测试调用
console.log('恭喜您调用到我了 :>> ', ) test: () => {
} console.log('恭喜您调用到我了 :>> ',)
},
// 打开弹窗
handleOpen: () => {
setVisible(true)
},
// 关闭弹窗
handleClose: () => {
setVisible(false)
}
})) }))
return ( return (
<Modal <Modal
title={'选择日期'} title={title || DefaultSelectDateText}
visible={visible} visible={visible}
width={1080} width={width || 1080}
okText={okText || DefaultModalOkText}
cancelText={cancelText || DefaultModalCancelText}
onOk={modalOnOk}
onCancel={modalOnCancel}
> >
<Alert message={`当前选择日期: ${dateValue.format('YYYY-MM-DD')}`} /> <Alert message={`${CurrentlySelectedDateText}: ${dateValue.format('YYYY-MM-DD')}`} />
<Calendar value={dateValue} onSelect={onSelect} onPanelChange={onPanelChange} /> <Calendar value={dateValue} onSelect={onSelect} onPanelChange={onPanelChange} />
</Modal> </Modal>
) )
......
...@@ -74,6 +74,7 @@ function DeliveryGoodTableModal(props: DeliveryGoodTableModalProps) { ...@@ -74,6 +74,7 @@ function DeliveryGoodTableModal(props: DeliveryGoodTableModalProps) {
row={data.id} row={data.id}
dataSource={combination} dataSource={combination}
onChange={(keys, index) => { onChange={(keys, index) => {
console.log('keys,index :>> ', keys,index);
selectedRowKeys.set(index, keys); selectedRowKeys.set(index, keys);
}} }}
/> />
......
export const DefaultSelectDateText = '选择日期'
export const CurrentlySelectedDateText = '当前选定日期'
export const DefaultModalOkText = '确定'
export const DefaultModalCancelText = '取消'
export * from './customizedModal' export * from './customizedModal'
\ No newline at end of file export * from './calendarModal'
\ No newline at end of file
...@@ -8,15 +8,15 @@ import { history } from 'umi' ...@@ -8,15 +8,15 @@ import { history } from 'umi'
import moment from 'moment' import moment from 'moment'
import _ from 'lodash' import _ from 'lodash'
import AnchorPage, { AnchorsItem } from '@/components/AnchorPage' import AnchorPage, { AnchorsItem } from '@/components/AnchorPage'
import { Button, Modal, Space, Spin, Steps, Table, Tag } from 'antd' import { Button, message, Modal, Space, Spin, Steps, Table, Tag } from 'antd'
import { CheckCircleOutlined } from '@ant-design/icons' import { CheckCircleOutlined } from '@ant-design/icons'
import BaseInfo from '@/components/BaseInfo/BaseInfo' import BaseInfo from '@/components/BaseInfo/BaseInfo'
import CalendarModal from '../../components/CalendarModal' import CalendarModal from '../../components/CalendarModal'
import { BaseInfo as base_Info, Circulation, ConfirmDeliveryPlan, ExternalRoamRecord, ExternalState, PlanMaterial, PlanningCycle, PlanNumber, PlanSummary, Purchaser, Remarks, SubmitDeliveryPlan, Supplier, SupplyMember, SupplyMembersLabel, PlannedDelivery } from '../../constants' import { BaseInfo as base_Info, Circulation, ConfirmDeliveryPlan, ExternalRoamRecord, ExternalState, PlanMaterial, PlanningCycle, PlanNumber, PlanSummary, Purchaser, Remarks, SubmitDeliveryPlan, Supplier, SupplyMember, SupplyMembersLabel, PlannedDelivery } from '../../constants'
import { ExternalRoamRecordTableColumn } from '../../constants/page-table-column' import { ExternalRoamRecordTableColumn } from '../../constants/page-table-column'
import { BrandColumn, ClassColumn, CommodityNoColumn, ConsigneeNumColumn, DeliveredNumColumn, MaterialModelColumn, MaterialNameColumn, MaterialNoColumn, OrderCreatedAtColumn, OrderNoColumn, OrderNumColumn, OrderSummaryColumn, PlannedDeliveryNumColumn, TradeNameColumn, TransitNumColumn, UntilColumn } from '../../constants/table-column' import { BrandColumn, ClassColumn, CommodityNoColumn, ConsigneeNumColumn, DeliveredNumColumn, MaterialModelColumn, MaterialNameColumn, MaterialNoColumn, OrderCreatedAtColumn, OrderNoColumn, OrderNumColumn, OrderSummaryColumn, PlannedDeliveryNumColumn, TradeNameColumn, TransitNumColumn, UntilColumn } from '../../constants/table-column'
import { getDayAll, godAtob, integrationArrToObj, integrationOjb, TagStatus } from '../../utils' import { getDayAll, godAtob, integrationArrToObj, integrationOjb, newMapValues, TagStatus } from '../../utils'
import { getOrderDeliveryPlanDeliveryHistory, getOrderDeliveryPlanDetail, getOrderDeliveryPlanDetailProductPage } from '@/services/OrderNewV2Api' import { getOrderDeliveryPlanDeliveryHistory, getOrderDeliveryPlanDeliveryOrder, getOrderDeliveryPlanDetail, getOrderDeliveryPlanDetailProductPage, getOrderDeliveryPlanNoticeOrder } from '@/services/OrderNewV2Api'
const columnB2B = [ const columnB2B = [
{ ...CommodityNoColumn, dataIndex: 'skuId', width: 80, }, { ...CommodityNoColumn, dataIndex: 'skuId', width: 80, },
...@@ -69,6 +69,8 @@ const DeliveryPlanCollaborationDetails: React.FC = () => { ...@@ -69,6 +69,8 @@ const DeliveryPlanCollaborationDetails: React.FC = () => {
const [tableData, setTableData] = useState<any>(null) const [tableData, setTableData] = useState<any>(null)
// 外部流转单据记录 // 外部流转单据记录
const [externalRoamRecordData, setExternalRoamRecordData] = useState<any>(null) const [externalRoamRecordData, setExternalRoamRecordData] = useState<any>(null)
// 操作类型 DeliveryNote-送货单、Notice-通知单
const [operation, setOperation] = useState<'Notice' | 'DeliveryNote'>('Notice')
// 动态 TableColumn // 动态 TableColumn
const [tableColumn, setTableColumn] = useState<any>([]) const [tableColumn, setTableColumn] = useState<any>([])
...@@ -84,24 +86,26 @@ const DeliveryPlanCollaborationDetails: React.FC = () => { ...@@ -84,24 +86,26 @@ const DeliveryPlanCollaborationDetails: React.FC = () => {
{ ...PlannedDeliveryNumColumn, dataIndex: 'planCount', width: 128, }, { ...PlannedDeliveryNumColumn, dataIndex: 'planCount', width: 128, },
]) ])
const expandIconRowSelection = { const expandIconRowSelection = (skuId: string) => {
onChange: (selectedRowKeys: React.Key[], selectedRows: any[]) => { return {
// TODO 挂坑 ---> rowKey由于数据返回可能不是唯一值, selectedRowKeys 后续可能出现重复 onChange: (selectedRowKeys: React.Key[], selectedRows: any[]) => {
// console.log(`expandIconRowSelection -> selectedRowKeys: ${selectedRowKeys}`, 'selectedRows: ', selectedRows) // TODO 挂坑 ---> 父级rowKey(skuId)由于数据返回可能不是唯一值, 后续可能出现重复
const ids = selectedRows.map((item: any) => item.planOrderId) // console.log(`expandIconRowSelection -> selectedRowKeys: ${selectedRowKeys}`, 'selectedRows: ', selectedRows)
selectedTableItem.set(selectedRowKeys[0], ids) // console.log('selectedRowKeys :>> ', skuId, '====>', selectedRowKeys)
}, selectedTableItem.set(skuId, selectedRowKeys)
},
}
} }
const expandedRowRender = (record) => { const expandedRowRender = (record: any) => {
return ( return (
<Table <Table
rowKey={'orderProductId'} rowKey={'planOrderId'}
columns={expandIconColumn} columns={expandIconColumn}
dataSource={record.orders} dataSource={record.orders}
pagination={false} pagination={false}
tableLayout="fixed" tableLayout="fixed"
rowSelection={expandIconRowSelection} rowSelection={expandIconRowSelection(record.skuId)}
/> />
) )
} }
...@@ -165,10 +169,66 @@ const DeliveryPlanCollaborationDetails: React.FC = () => { ...@@ -165,10 +169,66 @@ const DeliveryPlanCollaborationDetails: React.FC = () => {
}) })
} }
const handleSubmitVerify = (t: 'Notice' | 'DeliveryNote') => {
setOperation(t)
const _ids = newMapValues(selectedTableItem, true)
if (_.isEmpty(_ids)) {
const msg = t === 'Notice' ? '请勾选需要生成送通知单的订单' : '请勾选需要生成送货单的订单'
message.warning(msg)
return
}
ref.current.handleOpen()
}
// 生成通知单 // 生成通知单
const generateNotice = (date: string) => {
const _ids = newMapValues(selectedTableItem, true)
setSpinning(true)
getOrderDeliveryPlanNoticeOrder({
planId: id,
planOrderIds: _ids,
time: date
}).then((res: any) => {
if (res.code === 1000) {
let noticePath = {}
const time = new Date().getTime()
// 判断跳转
const url = deliveryPlanType === '1' ? '/memberCenter/order/deliveryNoticeManagement/awaitSRM/add' : '/memberCenter/order/deliveryNoticeManagement/awaitB2B/add'
noticePath[time] = res.data
localStorage.setItem('NOTICE_PATH', JSON.stringify(noticePath))
setTimeout(() => {
history.push(`${url}?time=${time}`)
}, 1000)
}
}).finally(() => {
setSpinning(false)
})
}
// 生成送货单 // 生成送货单
const generateDeliveryNote = (date: string) => {
const _ids = newMapValues(selectedTableItem, true)
setSpinning(true)
getOrderDeliveryPlanDeliveryOrder({
planId: id,
planOrderIds: _ids,
time: date
}).then((res: any) => {
console.log('res :>> ', res)
if (res.code === 1000) {
let noticePath = {}
const time = new Date().getTime()
noticePath[time] = res.data
localStorage.setItem('DELIVERY_NOTICE_PATH', JSON.stringify(noticePath))
// 判断跳转
setTimeout(()=> {
history.push(`/memberCenter/order/deliveryNotice/synergy/create?time=${time}&ot=${deliveryPlanType}`)
},1000)
}
}).finally(() => {
setSpinning(false)
})
}
useEffect(() => { useEffect(() => {
getDetails() getDetails()
...@@ -184,8 +244,8 @@ const DeliveryPlanCollaborationDetails: React.FC = () => { ...@@ -184,8 +244,8 @@ const DeliveryPlanCollaborationDetails: React.FC = () => {
extra={ extra={
<Space> <Space>
{/* 条件渲染 */} {/* 条件渲染 */}
<Button type='primary' icon={<CheckCircleOutlined />} onClick={() => { console.log('ref --------:>> ', ref.current.test()) }}>生成通知单</Button> <Button type='primary' icon={<CheckCircleOutlined />} onClick={() => handleSubmitVerify('Notice')}>生成通知单</Button>
<Button type='primary' icon={<CheckCircleOutlined />}>生成送货单</Button> <Button type='primary' icon={<CheckCircleOutlined />} onClick={() => handleSubmitVerify('DeliveryNote')}>生成送货单</Button>
</Space> </Space>
} }
> >
...@@ -232,6 +292,11 @@ const DeliveryPlanCollaborationDetails: React.FC = () => { ...@@ -232,6 +292,11 @@ const DeliveryPlanCollaborationDetails: React.FC = () => {
</AnchorPage> </AnchorPage>
<CalendarModal <CalendarModal
ref={ref} ref={ref}
onOk={(date) => {
operation === 'Notice'
? generateNotice(date)
: generateDeliveryNote(date)
}}
/> />
</Spin> </Spin>
) )
......
...@@ -67,10 +67,26 @@ const godAtob = (str: string) => { ...@@ -67,10 +67,26 @@ const godAtob = (str: string) => {
return str ? decodeURIComponent(window.atob(str)) : str return str ? decodeURIComponent(window.atob(str)) : str
} }
/**
* new Map() value 取出
* - new Map([[key1, value1], [key2, value2]])=> [value1,value2]
* @param newMapArr
* @param isFlat
* @returns
*/
const newMapValues = (newMapArr: Map<any, any>, isFlat?: boolean, depth?: number) => {
let values = []
for (const [key,value] of newMapArr) {
values.push(value)
}
return isFlat ? values.flat(depth ?? 1) : values
}
export { export {
convertArrToObj, convertArrToObj,
integrationOjb, integrationOjb,
integrationArrToObj, integrationArrToObj,
godBtoa, godBtoa,
godAtob, godAtob,
newMapValues,
} }
\ No newline at end of file
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment