Skip to content

J
jinfa-platform
Commit ac612aec authored by 前端-钟卫鹏's avatar 前端-钟卫鹏
Browse files
Options

fix: 处理商品编辑下：修改商品名称会恢复原编辑数据的问题、由商品属性变动触发的价格属性表格渲染应清空数据的问题、替换选择的货品在条目为1的情况下价格属性表格无法同步选中的问题

parent eb098284
Hide whitespace changes
Inline Side-by-side
Showing with 67 additions and 54 deletions
src/pages/commodity/products/addProductsItem/priceAttributeForm.tsx
View file @ ac612aec
......@@ -30,16 +30,14 @@ export interface Iprops {
}
const { Option } = Select
const { Item } = Form
let _tableDataSource: any = []
// let fff = 0
const PriceAttributeForm: React.FC<Iprops> = (props) => {
const { onRef } = props
const priceFormRef = useRef()
const updateFlag = useRef(true) // 是否第一次构建
const fff = useRef<number>(0)
const updateAttributeFlag = useRef(true) // 是否第一次商品属性变动的构建
const [priceForm] = Form.useForm()
const [setPriceForm] = Form.useForm()
const [planPrice, setPlanPrice] = useState(1)
......@@ -56,6 +54,19 @@ const PriceAttributeForm: React.FC<Iprops> = (props) => {
const flagRef = useRef<boolean>(false)
const [isChangePriceType, setIsChangePriceType] = useState<boolean>(false) // 价格类型是否有变动
const [combineAttributeChangeFatories, setCombineAttributeChangeFatories] = useState<number>(0)
const memoizedValue = useMemo(() => {
let len = combineAttributeArray.length
console.log(len, combineAttributeChangeFatories)
if(len === combineAttributeChangeFatories){
return false
}else{
setCombineAttributeChangeFatories(len)
return true
}
} , [combineAttributeArray.length]) // 监听属性组合是否有变动（由属性组合引发数据构建清空价格）
const [colums, setColumns] = useState<ColumnType<any>[]>()
const { ProductStore } = store
const {
......@@ -83,6 +94,7 @@ const PriceAttributeForm: React.FC<Iprops> = (props) => {
handleUnitSearch(getPriceAttributeFormParamsByEdit.unitName)
setMinOrderNumber(productInfoByEdit?.minOrder)
priceForm.setFieldsValue(getPriceAttributeFormParamsByEdit)
setCombineAttributeChangeFatories(productInfoByEdit?.unitPriceAndPicList.length)
}
return ()=>{
console.log('价格属性组件卸载')
......@@ -103,7 +115,6 @@ const PriceAttributeForm: React.FC<Iprops> = (props) => {
useEffect(()=>{
constructedCallback()
fff.current++
},[productName, selectedGoods, productSelectAttribute, planPrice, tabClickItem])
/* 生成建表所需要的属性 属性值等数组数据 */
......@@ -205,7 +216,7 @@ const PriceAttributeForm: React.FC<Iprops> = (props) => {
key: '对应货品',
width: 360,
render: (text: any, record: any) => <>
<Select style={{width:'100%'}} defaultValue={text} onChange={(v)=> {tableSelelctChange(v, record) }}>
<Select style={{width:'100%'}} defaultValue={text} value={text} onChange={(v)=> {tableSelelctChange(v, record) }}>
{
selectedGoods.length>0 && selectedGoods.map(_item => (
<Option key={_item.id} value={_item.id}>{_item.code}/{_item.name}/{_item.type}/￥{_item.costPrice}</Option>
......@@ -269,33 +280,38 @@ const PriceAttributeForm: React.FC<Iprops> = (props) => {
}) : _tempObj[_attributeNameArr[i]||_attributeNameArr[0]] = _rowArr // 当一项变动的时候 找_attributeNameArr可能会找不到 找不到的情况下置为索引0的那项
if(history.location.query?.id){
// 编辑的时候，先指定数据中的货品id，如果是重新组合的不存在id就使用选择的货品中的第一个，如果没有置为0；同理，不存在单价就置为{}
console.log(selectedGoods[i] && selectedGoods[i]?.id || selectedGoods[0]?.id || 0, '0000')
_tempObj['对应货品'] = selectedGoods[i] && selectedGoods[i]?.id || selectedGoods[0]?.id || 0
if(!fff.current){ // 初次渲染tab 再次进入tab采用缓存数据
// _tempObj['对应货品'] = selectedGoods[i] && selectedGoods[i]?.id || selectedGoods[0]?.id || 0
_tempObj['对应货品'] = selectedGoods.length > 0 ? selectedGoods[0].id : 0
if(updateFlag.current){ // 初次渲染tab 再次进入tab采用缓存数据
_tempObj['单价'] = productInfoByEdit.unitPriceAndPicList[i]?.unitPrice || {}
}else{
_tempObj['单价'] = _tableDataSource[i] && tableDataSource[i]['单价'] || {} // *bug* 替换属性价格会上位 货品替换数量不变表格选项未更新 传图片后再构建会被清空
_tempObj['单价'] = _tableDataSource[i] && tableDataSource[i]['单价'] || {}
}
}else{
_tempObj['对应货品'] = selectedGoods.length > 0 ? selectedGoods[0].id : 0
// _tempObj['单价'] = {}
_tempObj['单价'] = _tableDataSource[i] && tableDataSource[i]['单价'] || {}
}
console.log(_tableDataSource,tabClickItem,fff.current,selectedGoods,'构建表格单价数据')
// 价格属性变动引发的构建清空价格
if(memoizedValue){ _tempObj['单价'] = {} }
// selectedGoods数据是前面表格选择的数组
console.log(_tableDataSource , selectedGoods, '构建表格单价数据', memoizedValue)
_tableData.push(_tempObj)
})
}else{ // length不存在，默认只有商品名称一行（无价格属性组合）只有一行的情况下单价可能有，可能阶梯价，也可能没有
let _tempObj: any = { 索引: 0 ,商品名称: productName }
_tempObj['对应货品'] = selectedGoods.length > 0 ? selectedGoods[0].id : 0 // 编辑情况下 对应货品id和单价 特殊处理
// _tempObj['单价'] = productInfoByEdit?.unitPriceAndPicList[0]?.unitPrice || {}
if(!fff.current){
if(updateFlag.current){
_tempObj['单价'] = productInfoByEdit?.unitPriceAndPicList[0]?.unitPrice || {}
}else{
_tempObj['单价'] = _tableDataSource[0] && tableDataSource[0]['单价'] || {} // *bug* 替换属性价格会上位 货品替换数量不变表格选项未更新 传图片后再构建会被清空
_tempObj['单价'] = _tableDataSource[0] && tableDataSource[0]['单价'] || {}
}
_tableData.push(_tempObj)
}
// console.log(_tableData, '_tableData') // 只有一项 变动情况下表格数据的key获取不到
_tableDataSource = _tableData
// 有前面tab变动引起的二次构建 需要清空价格数据 (商品属性二次变动可考虑清空价格)
if(updateFlag.current){
......@@ -369,12 +385,10 @@ const PriceAttributeForm: React.FC<Iprops> = (props) => {
* @param record table行记录
*/
const tableSelelctChange = (v: number, record: any) => {
// console.log(v, record, 'record')
let _row = { ...record, 对应货品: v }
let newTabeData = [..._tableDataSource]
newTabeData[record['索引']] = _row
_tableDataSource = newTabeData
// console.log(_tableDataSource,'_tableDataSource', newTabeData)
setTableDataSource(_tableDataSource)
constructedPrarams()
}
......@@ -384,7 +398,6 @@ const PriceAttributeForm: React.FC<Iprops> = (props) => {
* @param {[[],[]..]} chunks 传入不同的属性值数组进行组合
*/
const SKUCombine = (arr: any[]) => {
// console.log(arr, 'arr')
if(arr.length){
if (arr[0].children)
arr = arr.map((item: any) => {
......@@ -429,7 +442,6 @@ const PriceAttributeForm: React.FC<Iprops> = (props) => {
let _row = { ...curretSetPriceRow, 单价: _priceRange }
let newTabeData = [..._tableDataSource]
// console.log(newTabeData, 'newTableData')
if(isBatchSetting){ // 判断是否批量设置价格
_tableDataSource.map(_item => _item['单价'] = _priceRange)
}else{
......@@ -437,13 +449,11 @@ const PriceAttributeForm: React.FC<Iprops> = (props) => {
}
_tableDataSource = newTabeData
setTableDataSource(_tableDataSource)
// console.log(_tableDataSource, curretSetPriceRow, v, isBatchSetting, 'setPriceOk')
})
}
const setPriceCancel = () => {
setSetPriceModal(false)
// console.log('setPriceCancel')
}
const clickSetPrice = (record: any) => {
......
src/pages/commodity/products/addProductsItem/productImageForm.tsx
View file @ ac612aec
......@@ -13,6 +13,7 @@ import { inject, observer } from 'mobx-react'
import { store } from '@/store'
const ProductImageForm: React.FC<{}> = (props) => {
const fff = useRef<number>(0)
const [defaultChecked, setDefaultChecked] = useState(-1)
const [priceAttributeParamsByRender, setPriceAttributeParamsByRender] = useState<any[]>([])
const [commonImageList, setCommonImageList] = useState<any>([])
......@@ -20,10 +21,9 @@ const ProductImageForm: React.FC<{}> = (props) => {
const [previewImage, setPreviewImage] = useState('')
const [previewTitle, setPreviewTitle] = useState('')
const [setImageType, setSetImageType] = useState<boolean>(true)
// 处理新增二次变更价格保留图片数据
// 二次变更价图片数据持久化
const [maintainImageData, setMaintainImageData] = useState<any>([])
const [openFileDialogFlag, setOpenFileDialogFlag] = useState<boolean>(false)
const flagRef = useRef<boolean>(false)
// 选中的图片
......@@ -36,6 +36,27 @@ const ProductImageForm: React.FC<{}> = (props) => {
useEffect(() => {
if(history.location.query?.id){
setSetImageType(productInfoByEdit.isAllAttributePic)
let o = productInfoByEdit.unitPriceAndPicList.map((_item, _index) => {
// 编辑初始图片数据缓存（手动生成供图片回显数据）
let _pic = null
let _priceAndPicList = productInfoByEdit.unitPriceAndPicList
for(let i = 0; i < _priceAndPicList.length; i++) {
if(_priceAndPicList[i].attributeAndValueList.map(item => item.customerAttributeValue.id).sort().toString() == _item.attributeAndValueList.map(item => item.customerAttributeValue.id).sort().toString()){
_pic = _priceAndPicList[i].commodityPic
}
}
let _commodityPicItem = Array.isArray(_pic) ? _pic.map((__ele, __i) => {
return {
uid: (__i+1) * -1,
status: 'done',
url: __ele,
}
}) : []
return _commodityPicItem
})
setMaintainImageData(o)
}
}, [])
......@@ -66,43 +87,24 @@ const ProductImageForm: React.FC<{}> = (props) => {
}else if(history.location.query?.id){ // 不点击前面 直接进入图片tab
constructImageListByRender(productInfoByEdit.unitPriceAndPicList)
}
},[priceAttributeParams])
},[priceAttributeParams, maintainImageData])
/* 给数据添加图片字段 */
/* 直接进入商品图片编辑的时候 参数为空数组 但是没有价格属性的时候 也可能为空数组 区别在于是否有url id */
const constructImageListByRender = (priceAttributeParams?: any) => {
let _priceAttributeParams: any = []
if(history.location.query?.id){ // id判断是否新增还是编辑
// setSetImageType(productInfoByEdit.isAllAttributePic)
setIsAllAttributePic(productInfoByEdit.isAllAttributePic)
setIsAllAttributePic(setImageType)
_priceAttributeParams = priceAttributeParams.map((_item, _index) => {
// 为图片字符串数组手动添加 uid 和 status
// 查询编辑详情中属性值id相匹配的图片
let _pic = null
let _priceAndPicList = productInfoByEdit.unitPriceAndPicList
for(let i = 0; i < _priceAndPicList.length; i++) {
if(_priceAndPicList[i].attributeAndValueList.map(item => item.customerAttributeValue.id).sort().toString() == _item.attributeAndValueList.map(item => item.customerAttributeValue.id).sort().toString()){
_pic = _priceAndPicList[i].commodityPic
}
}
let _commodityPicItem = Array.isArray(_pic) ? _pic.map((__ele, __i) => {
return {
uid: (__i+1) * -1,
status: 'done',
url: __ele,
}
}) : []
let _obj = {..._item}
_obj.commodityPic = _commodityPicItem
_obj.commodityPic = maintainImageData[_index] || []
// _obj.commodityPic = _commodityPicItem
return _obj
})
}else{
_priceAttributeParams = priceAttributeParams.map((_item, _i) => {
let _obj = {..._item}
// ****这里 新增情况下 价格属性参数变动引起constructImageListByRender数据构建 []会清空之前已经上传的图片
// _obj.commodityPic = []
_obj.commodityPic = maintainImageData[_i] || []
return _obj
})
......
src/pages/payandSettle/capitalAccounts/accountLists/accountDetail.tsx
View file @ ac612aec
......@@ -16,6 +16,7 @@ import { PublicApi } from '@/services/api'
import { StandardTable } from 'god'
import QRCode from 'qrcode';
import { ScanOutlined } from '@ant-design/icons'
import { useAsyncSelect } from '@/formSchema/effects/useAsyncSelect'
const schemaActions = createFormActions()
......@@ -23,7 +24,7 @@ const AccountDetail: React.FC<{}> = () => {
const modalRef = useRef<any>()
const refTrade = useRef<any>({})
const [moveData, setMoveData] = useState<any>()
const [ details, setDetails ] = useState<any>({ accountBalance: 0, lockBalance: 0})
const [details, setDetails] = useState<any>({ accountBalance: 0, lockBalance: 0})
const [pageId, setPageId] = useState<any>()
const [isBtnLoading, setIsBtnLoading] = useState<boolean>(false)
const [scanVisible, setScanVisible] = useState<boolean>(false)
......@@ -347,18 +348,18 @@ const AccountDetail: React.FC<{}> = () => {
destroyOnClose: true
}}
// effects={($, {setFieldState}) => {
// $('onFieldInputChange', 'money').subscribe(parentState => {
// console.log(parentState.value)
// setFieldState('money', state => {
// state.value = `${parentState.value}`.replace(/\B(?=(\d{3})+(?!\d))/g, ',')
// })
// })
// useAsyncSelect('addresId', async () => (await PublicApi.getLogisticsSelectListShipperAddress()).data, ['fullAddress', 'id'])
// $('onFieldInit', 'type').subscribe(parentState => {
// PublicApi.getPayMemberPayList({memberId: details.memberId, memberType: details.memberLevelType}).then(res => {
// console.log(res, 'res')
// })
// setFieldState('type', state => {
// state.props["x-component-props"].dataSource = []
// });
// })
// }}
/>
{/* 扫码充值 */}
<Modal
// title={rechargeType === 1 ? '微信扫码充值' : '支付宝扫码充值'}
title='账户充值'
visible={scanVisible}
onOk={handleScan}
......
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