✨ feat(优化码单):
This commit is contained in:
@@ -1,135 +0,0 @@
|
||||
import React, { useContext, useReducer } from 'react'
|
||||
import { CustomPrintCalculationApi } from '@/api/codeManage'
|
||||
|
||||
interface params {
|
||||
productData?: any
|
||||
dispatch?: any
|
||||
}
|
||||
interface PropsType {
|
||||
children: React.ReactNode
|
||||
}
|
||||
|
||||
type ACTIONTYPE =
|
||||
| { type: 'setInitData'; data: any }
|
||||
| { type: 'updateData'; data: any }
|
||||
| { type: 'changeAdjustType'; data: number }
|
||||
| { type: 'changeSaveStatus'; data: boolean }
|
||||
|
||||
function createCtx<A extends {} | null>() {
|
||||
const ctx = React.createContext<A | undefined>(undefined)
|
||||
function useCtx() {
|
||||
const c = useContext(ctx)
|
||||
if (c === undefined) { throw new Error('useCtx must be inside a Provider with a value') }
|
||||
return c
|
||||
}
|
||||
return [useCtx, ctx.Provider] as const
|
||||
}
|
||||
export const [useCurrenCode, CurrentUserProvider] = createCtx<params>()
|
||||
|
||||
export default (props: PropsType) => {
|
||||
const initialState = {
|
||||
data: null, // 码单数据
|
||||
adjust_type: 1, // 码单调整类型
|
||||
custom_print_id: 0, // 自定义码单id
|
||||
sale_order_id: 0, // 销售码单id
|
||||
admin_data: null, // 需要传给后端的数据
|
||||
save_status: false, // 是否保存了数据
|
||||
}
|
||||
function reducer(state: typeof initialState, action: ACTIONTYPE) {
|
||||
switch (action.type) {
|
||||
case 'setInitData':
|
||||
return onInitData(state, action)
|
||||
case 'updateData':
|
||||
return onUpdateData(state, action)
|
||||
case 'changeAdjustType':
|
||||
return { ...state, adjust_type: action.data }
|
||||
case 'changeSaveStatus':
|
||||
return { ...state, save_status: action.data }
|
||||
default:
|
||||
throw new Error('reducer没找到对应的type')
|
||||
}
|
||||
}
|
||||
|
||||
// 初始化数据
|
||||
const onInitData = (state, action) => {
|
||||
const { data, custom_print_id, sale_order_id } = action
|
||||
const custom_order_total = {
|
||||
total_weight_error: data?.total_weight_error,
|
||||
total_sale_weight: data?.total_sale_weight,
|
||||
total_amount: data?.total_amount,
|
||||
}
|
||||
data.weight_admin = 0
|
||||
data.price_admin = 0
|
||||
data.weight_error_admin = 0
|
||||
data?.product_details?.map((item, index) => {
|
||||
item.weight_admin = 0
|
||||
item.price_admin = 0
|
||||
item.weight_error_admin = 0
|
||||
item.index_str = index.toString()
|
||||
return item?.product_color_details?.map((citem, cindex) => {
|
||||
citem.index_str = `${item.index_str}_${cindex}` // 通过这个可以快速定位数组位置
|
||||
citem.weight_setting = citem.weight
|
||||
citem.weight_error_setting = citem.weight_error
|
||||
citem.price_setting = citem.price
|
||||
citem.weight_admin = 0
|
||||
citem.price_admin = 0
|
||||
citem.weight_error_admin = 0
|
||||
return citem
|
||||
})
|
||||
})
|
||||
return {
|
||||
...state,
|
||||
data,
|
||||
custom_print_id,
|
||||
sale_order_id,
|
||||
custom_order_total,
|
||||
admin_data: null,
|
||||
init_state: true,
|
||||
}
|
||||
}
|
||||
|
||||
// 后端所需数据
|
||||
const onUpdateData = (state, action) => {
|
||||
const { data } = action
|
||||
const updateData = {
|
||||
adjust_type: parseInt(state.adjust_type),
|
||||
purchaser_form_title_id: 0,
|
||||
custom_print_product: [],
|
||||
price: 0,
|
||||
weight: 0,
|
||||
weight_error: 0,
|
||||
custom_print_id: parseInt(state.custom_print_id!),
|
||||
sale_order_id: parseInt(state.sale_order_id!),
|
||||
}
|
||||
updateData.weight = data?.weight_admin || 0
|
||||
updateData.price = data?.price_admin || 0
|
||||
updateData.weight_error = data?.weight_error_admin || 0
|
||||
data?.product_details?.map((item) => {
|
||||
const product_item = {
|
||||
price: item.price_admin || 0,
|
||||
weight: item.weight_admin || 0,
|
||||
weight_error: item.weight_error_admin || 0,
|
||||
product_id: item.product_id,
|
||||
product_name: item.product_name,
|
||||
custom_print_product_color: [],
|
||||
}
|
||||
item?.product_color_details?.map((citem) => {
|
||||
product_item.custom_print_product_color.push({
|
||||
price: citem.price_admin || 0,
|
||||
weight: citem.weight_admin || 0,
|
||||
weight_error: citem.weight_error_admin || 0,
|
||||
product_color_id: citem.product_color_id,
|
||||
product_color_name: citem.product_color_name,
|
||||
})
|
||||
})
|
||||
updateData.custom_print_product.push(product_item)
|
||||
})
|
||||
return { ...state, admin_data: updateData, data: { ...data } }
|
||||
}
|
||||
|
||||
const [productData, dispatch] = useReducer(reducer, initialState)
|
||||
|
||||
return (
|
||||
<CurrentUserProvider value={{ productData, dispatch }} children={props.children}></CurrentUserProvider>
|
||||
)
|
||||
}
|
||||
@@ -0,0 +1,43 @@
|
||||
import React, { useContext, useReducer } from 'react'
|
||||
import { useDispatch } from 'react-redux'
|
||||
import { CustomPrintCalculationApi } from '@/api/codeManage'
|
||||
import type { CodeParam } from '@/reducers/codeData'
|
||||
import { useSelector } from '@/reducers/hooks'
|
||||
|
||||
interface params {
|
||||
state: CodeParam
|
||||
dispatch: React.Dispatch<any>
|
||||
}
|
||||
interface PropsType {
|
||||
children: React.ReactNode
|
||||
}
|
||||
|
||||
function createCtx<A extends {} | null>() {
|
||||
const ctx = React.createContext<A | undefined>(undefined)
|
||||
function useCtx() {
|
||||
const c = useContext(ctx)
|
||||
if (c === undefined) { throw new Error('useCtx must be inside a Provider with a value') }
|
||||
return c
|
||||
}
|
||||
return [useCtx, ctx.Provider] as const
|
||||
}
|
||||
export const [useCurrenCode, CurrentProvider] = createCtx<params>()
|
||||
|
||||
// https://dev.to/elisealcala/react-context-with-usereducer-and-typescript-4obm
|
||||
export default (props: PropsType) => {
|
||||
const initialState = { count: 0 }
|
||||
function reducer(state, action) {
|
||||
switch (action.type) {
|
||||
case 'increment':
|
||||
return { count: state.count + 1 }
|
||||
case 'decrement':
|
||||
return { count: state.count - 1 }
|
||||
default:
|
||||
return state
|
||||
}
|
||||
}
|
||||
const [state, dispatch] = useReducer(reducer, initialState)
|
||||
return (
|
||||
<CurrentProvider value={{ state, dispatch }} children={props.children}></CurrentProvider>
|
||||
)
|
||||
}
|
||||
Reference in New Issue
Block a user