Commit d371fe85 authored by 前端-钟卫鹏's avatar 前端-钟卫鹏

fix:

parent 38aa787a
import { GetProductChannelCommodityGetCommodityListResponseDetail, GetProductChannelCommodityGetCommodityUnitPriceResponse } from '@/services';
export interface IRole {
key: string;
value: number;
children: string;
}
export interface IChannel {
name: string;
memberId?: number;
}
export interface IChannelProductModule {
productSelectRowInStore: GetProductChannelCommodityGetCommodityListResponseDetail;
priceType: number;
productName: string;
currentActiveKey: string;
currentOperateChannel: string;
currentOperateChannel: IChannel;
selectedRole: IRole;
tableDataInSetPrice: GetProductChannelCommodityGetCommodityUnitPriceResponse[];
setProductSelectRowInStore(data: GetProductChannelCommodityGetCommodityListResponseDetail): void;
setPriceType(data: number): void;
setProductName(data: string): void;
setCurrentActiveKey(data: string): void;
setCurrentOperateChannel(data: string): void;
setCurrentOperateChannel(data: IChannel): void;
setSelectedRole(data: IRole): void;
setTableDataInSetPrice(data: GetProductChannelCommodityGetCommodityUnitPriceResponse[]): void;
}
\ No newline at end of file
......@@ -12,6 +12,7 @@ import ModalTable from '@/components/ModalTable'
import { store } from '@/store'
import { inject, observer } from 'mobx-react'
import EyePreview from '@/components/EyePreview';
const { Search } = Input
const { Option } = Select
......@@ -35,16 +36,28 @@ interface IProps {
onRef: (refs: any) => void;
}
export interface IMemberTableData {
memberId: number;
name: string;
roleId: number;
roleName: string;
memberTypeName: string;
level: number;
levelTag: string;
status: number; // 5 上架 6 下架
}
const SelectChannel:React.FC<IProps> = (props) => {
const { onRef } = props
const [formMember] = Form.useForm()
const [isAllMember, setIsAllMember] = useState(true)
const [visibleChannelMember, setVisibleChannelMember] = useState(false)
const [memberRowSelection, memberRowCtl] = useRowSelectionTable({ customKey: 'memberId' })
const [memberRowSelection, memberRowCtl] = useRowSelectionTable({customKey: 'memberId'})
const [memberRoleList, setMemberRoleList] = useState<any[]>([])
const [selectedMemberRowKeys, setSelectedMemberRowKeys] = useState<any>([])
const [selectMemberRow, setSelectMemberRow] = useState<any[]>([]) // 选中的会员弹框数据
const [selectedMemberRowKeys, setSelectedMemberRowKeys] = useState<any>([]) // 页面表格选中的会员数据
const [selectMemberRow, setSelectMemberRow] = useState<any[]>([])
const [selectedOption ,setSelectedOption] = useState<IOption>()
const [memberTableData, setMemberTableData] = useState<IMemberTableData[]>()
const { ChannelProudctStore } = store
const {
......@@ -52,7 +65,9 @@ const SelectChannel:React.FC<IProps> = (props) => {
productName,
productSelectRowInStore,
setCurrentActiveKey,
setCurrentOperateChannel
setCurrentOperateChannel,
selectedRole,
setSelectedRole
} = ChannelProudctStore
const columnsSetMember: ColumnType<any>[] = [
......@@ -93,6 +108,12 @@ const SelectChannel:React.FC<IProps> = (props) => {
title: '会员名称',
dataIndex: 'name',
key: 'name',
className: history.location.query?.id ? 'commonPickColor' : '',
render: (text:any, record:any) => (history.location.query?.id ? <EyePreview
url={`/memberCenter/commodityAbility/commodity/products/directChannel/viewDirectChannel?id=${record.id}`}
>
{text}
</EyePreview> : text)
},
{
title: '会员类型',
......@@ -110,11 +131,24 @@ const SelectChannel:React.FC<IProps> = (props) => {
key: 'levelTag',
},
{
title: '状态',
dataIndex: 'status',
key: 'status',
render: (text: number, record: IMemberTableData) => {
if (text === 5)
return (<span style={{ color: '#00B37A', padding: '2px 5px', background: 'rgba(235,247,242,1)', borderRadius: '4px' }}>已上架</span>)
else if (text === 6)
return (<span style={{ padding: '2px 5px', background: 'rgba(244,245,247,1)', borderRadius: '4px' }}>已下架</span>)
}
},
{
title: '操作',
dataIndex: 'option',
render: (text: any, record: any) => {
return (
<>
<Button type='link' onClick={()=>clickSetPriceForChannel(record)}>设置</Button>
{history.location.query?.id && (record.status === 6 ? <Button type='link'>上架</Button> : <Button type='link'>下架</Button>)}
<Button type='link' onClick={()=>clickDeleteMember(record)}>删除</Button>
</>
)
......@@ -124,8 +158,8 @@ const SelectChannel:React.FC<IProps> = (props) => {
useEffect(() => {
onRef(formMember)
// 获取所有的会员角色
PublicApi.getMemberManageRoleList().then(res => {
const { data } = res
setMemberRoleList(data)
......@@ -136,14 +170,44 @@ const SelectChannel:React.FC<IProps> = (props) => {
children: data[0].roleName
}
setSelectedOption(initSelectOption)
setSelectedRole(initSelectOption)
}
})
}, [])
useEffect(() => {
// 选择变动 重新构建数据 手动添加 status(5上架6下架)字段
selectMemberRow.map(item => item.status = 6)
setMemberTableData(selectMemberRow)
}, [selectMemberRow])
useEffect(() => {
// 表格数据变动 先保存
if(memberTableData && memberTableData.length > 0){
console.log(memberTableData, formMember.getFieldsValue(), '传输数据')
let params: any = { ...formMember.getFieldsValue() }
let _memberList = []
memberTableData.map(item => {
_memberList.push({
memberId: item.memberId,
memberName: item.name,
status: item.status
})
})
params.memberList = _memberList
params.commodityId = productSelectRowInStore.id
params.channelMemberRoleName = selectedRole.children
PublicApi.postProductChannelCommoditySaveOrUpdateChannelCommodity(params).then(res=>{
if(res.code === 1000)
console.log(res, '二步保存')
})
}
}, [memberTableData])
// 获取渠道会员
const fetchMemberData = (params: any) => {
return new Promise((resolve, reject) => {
PublicApi.getMemberManageChannelLowerPage({ memberIds: [], name: selectedOption.children, roleId: selectedOption.value ,...params }).then(res => {
PublicApi.getMemberManageLowerChannelPageByname(params).then(res => {
const { data } = res
resolve(data)
})
......@@ -154,7 +218,8 @@ const SelectChannel:React.FC<IProps> = (props) => {
setIsAllMember(v.target.value)
}
const rowSelectionSetMember = {
// 页面表格选中项
const rowSelectionMemberInPage = {
selectedRowKeys: selectedMemberRowKeys,
onChange: (selectedRowKeys: any, selectedRows: any) => {
setSelectMemberRow(selectedRows)
......@@ -175,11 +240,16 @@ const SelectChannel:React.FC<IProps> = (props) => {
const handleOkAddMember = () => {
setVisibleChannelMember(false)
console.log(memberRowCtl.selectRow, memberRowCtl.selectedRowKeys, '选中的项')
setSelectMemberRow(memberRowCtl.selectRow)
}
const clickDeleteMember = (record: any) => {
setSelectMemberRow(selectMemberRow => [...selectMemberRow].filter(item => item.memberId != record.memberId))
setSelectedMemberRowKeys(selectedMemberRowKeys => [...selectedMemberRowKeys].filter(item => item != record.memberId))
setMemberTableData(memberTableData => [...memberTableData].filter(item => item.memberId != record.memberId))
// memberRowCtl.setSelectedRowKeys(selectedRowKeys => [...selectedRowKeys].filter(item => item != record.memberId))
let _keys = [...memberRowCtl.selectedRowKeys]
console.log([..._keys].filter(item => item != record.memberId))
memberRowCtl.setSelectedRowKeys([..._keys].filter(item => item != record.memberId))
}
const handleCancelAddMember = () => {
......@@ -188,11 +258,25 @@ const SelectChannel:React.FC<IProps> = (props) => {
const clickBatchSetting = () => {
setCurrentActiveKey('3') // 跳转第三个tab
setCurrentOperateChannel('所有渠道会员')
setCurrentOperateChannel({name: '所有渠道会员'})
}
const roleChange = (value: number, option: IOption) => {
setSelectedOption(option)
setSelectedRole(option)
}
const clickSetPriceForChannel = (record: any) => {
console.log(record)
setCurrentActiveKey('3') // 跳转第三个tab
setCurrentOperateChannel({name: record.name, memberId: record.memberId})
}
const clickSearchChannel = (value: string) => {
if(value)
setMemberTableData(memberTableData => memberTableData.filter(item => item.name === value))
else
setMemberTableData(memberRowCtl.selectRow)
}
return (<>
......@@ -247,7 +331,7 @@ const SelectChannel:React.FC<IProps> = (props) => {
<p>
<Search
placeholder="渠道会员名称"
onSearch={value => console.log(value)}
onSearch={value => clickSearchChannel(value)}
style={{ width: 256 }}
/>
</p>
......@@ -270,7 +354,7 @@ const SelectChannel:React.FC<IProps> = (props) => {
<Button onClick={handleAddButton} style={{width:'100%', marginBottom: 24, backgroundColor: '#fafbfc'}}>
<PlusOutlined /> 选择指定会员
</Button>
<Table rowKey="memberId" dataSource={selectMemberRow} columns={columnsPageMemeber} rowSelection={{...rowSelectionSetMember}} />
<Table rowKey="memberId" dataSource={memberTableData} columns={columnsPageMemeber} rowSelection={{...rowSelectionMemberInPage}} />
</> : ''
}
......@@ -301,7 +385,7 @@ const SelectChannel:React.FC<IProps> = (props) => {
}
}
tableProps={{
rowKey: 'memberId'
rowKey: 'memberId',
}}
/>
</>)
......
......@@ -39,7 +39,6 @@ const layoutSetPrice = {
wrapperCol: { span: 24 },
}
interface IProps {
onRef: (refs: any) => void;
}
......@@ -324,10 +323,28 @@ const SetPrice:React.FC<IProps> = (props) => {
newTabeData[curretSetPriceRow['索引']] = _row
}
setPriceTableData(newTabeData)
constructedPrarams()
console.log(newTabeData, '价格修改之后的tableData')
})
}
/** 生成传输数据 */
const constructedPrarams = () => {
// 从原data中过滤出选择的数据,覆写价格
let ids = priceTableData.map(item => item.id)
let selectData = originTableData.filter(item => { return ids.includes(item.id) })
let _data = selectData.map(item => {
let price = priceTableData.filter(_i => _i.id === item.id)[0]['单价']
return {...item, unitPrice: price}
})
console.log(originTableData, priceTableData, selectData, _data, '过滤')
setTableDataInSetPrice(_data) // 设置传输数据
}
const clickDelete = (record: any) => {
setPriceTableData(priceTableData => [...priceTableData].filter(item => item.id != record.id))
setSelectedSpecRowKeys(selectedSpecRowKeys => [...selectedSpecRowKeys].filter(item => item != record.id))
......@@ -379,7 +396,7 @@ const SetPrice:React.FC<IProps> = (props) => {
<Form.Item
label="当前设置会员"
>
{currentOperateChannel || '所有渠道会员'}
{currentOperateChannel?.name || '所有渠道会员'}
</Form.Item>
<Form.Item
name="isMemberPrice"
......
......@@ -16,6 +16,7 @@ import SetPrice from './addChannelItem/setPrice'
import { store } from '@/store'
import { inject, observer } from 'mobx-react'
import { PublicApi } from '@/services/api';
const { TabPane } = Tabs
......@@ -31,6 +32,8 @@ const AddDirectChannel:React.FC<{}> = (props) => {
productSelectRowInStore,
currentActiveKey,
currentOperateChannel,
tableDataInSetPrice,
selectedRole,
setCurrentActiveKey
} = ChannelProudctStore
......@@ -49,42 +52,28 @@ const AddDirectChannel:React.FC<{}> = (props) => {
}
const onSave = () => {
console.log(formRefs, 'formRefs')
let data = formRefs.map(async __ => {
console.log(__, '____')
return (
await __.validateFields()
)
})
Promise.all(data).then((values) => {
console.log(values,'vv')
// console.log(values, productRowCtl.selectRow, priceTableData, memberRowCtl.selectedRowKeys, originTableData, 'vvvv')
// let params: any = { ...values[0], ...values[1], ...values[2] }
// if(productRowCtl.selectRow.length > 0){
// params.commodityId = productRowCtl.selectRow[0].commodityId
// params.parentMemberId = productRowCtl.selectRow[0].parentMemberId
// params.parentMemberName = productRowCtl.selectRow[0].parentMemberName
// }
// if(memberRowCtl.selectRow.length > 0)
// params.purchaserList = memberRowCtl.selectedRowKeys
// let tempUnitPrice = []
// priceTableData.map(item => {
// tempUnitPrice.push(
// {
// goods: { id: item['goodsId'] },
// unitPrice: item['单价'],
// attributeAndValueList: originTableData.filter(_ => _.id === item.id)[0].attributeAndValueList,
// commodityPic: originTableData.filter(_ => _.id === item.id)[0].commodityPic
// }
// )
// })
// params.unitPriceAndPicList = tempUnitPrice
// params.channelMemberRoleId = 1 //仅供调试
// queryId ? params.id = queryId : null
// console.log(params, 'paramsparamsparamsparams')
// PublicApi.postProductChannelCommoditySaveOrUpdateChannelCommodity(params).then(res=>{
// if(res.code === 1000)
// history.goBack()
// })
console.log(values, tableDataInSetPrice,'vv')
let params: any = {}
values.map(item => {
params = { ...params, ...item }
})
params.unitPriceAndPicList = tableDataInSetPrice
params.commodityId = productSelectRowInStore.id
params.channelMemberRoleName = selectedRole.children
if(params.isAllMember)
params.isAllMemberPrice = true
PublicApi.postProductChannelCommoditySaveOrUpdateChannelCommodity(params).then(res=>{
if(res.code === 1000)
history.goBack()
})
})
}
......@@ -100,17 +89,17 @@ const AddDirectChannel:React.FC<{}> = (props) => {
>
<Card>
<Tabs onChange={callback} type="card" activeKey={currentActiveKey}>
<TabPane tab="选择商品" key="1" forceRender={false}>
<TabPane tab="选择商品" key="1">
<SelectProduct
onRef={(refs)=>setFormRefs([...formRefs, refs])}
/>
</TabPane>
<TabPane tab="适用渠道" key="2" forceRender={false}>
<TabPane tab="适用渠道" key="2">
<SelectChannel
onRef={(refs)=>setFormRefs([...formRefs, refs])}
/>
</TabPane>
<TabPane tab="设置价格" key="3" forceRender={false}>
<TabPane tab="设置价格" key="3">
<SetPrice
onRef={(refs)=>setFormRefs([...formRefs, refs])}
/>
......
......@@ -255,12 +255,12 @@ const BasicInfoForm: React.FC<Iprops> = (props) => {
</Tooltip>
</span>
}
rules={[
{
required: true,
message: '请填入商品标语'
},
]}
// rules={[
// {
// required: true,
// message: '请填入商品标语'
// },
// ]}
>
<Input placeholder="请输入商品标语" maxLength={45} />
</Form.Item>
......@@ -274,12 +274,12 @@ const BasicInfoForm: React.FC<Iprops> = (props) => {
</Tooltip>
</span>
}
rules={[
{
required: true,
message: '请添加卖点标签',
},
]}
// rules={[
// {
// required: true,
// message: '请添加卖点标签',
// },
// ]}
>
<Select
mode="tags"
......
......@@ -36,6 +36,7 @@ let _tableDataSource: any = []
const PriceAttributeForm: React.FC<Iprops> = (props) => {
const { onRef } = props
const priceFormRef = useRef()
const updateFlag = useRef(true) // 是否第一次构建
const [priceForm] = Form.useForm()
const [setPriceForm] = Form.useForm()
const [planPrice, setPlanPrice] = useState(1) //商品定价类型
......@@ -82,8 +83,7 @@ const PriceAttributeForm: React.FC<Iprops> = (props) => {
useEffect(()=>{
constructedCallback()
console.log('重新构造')
},[productName, selectedGoods, productSelectAttribute, planPrice])
},[productName,selectedGoods, productSelectAttribute, planPrice])
/* 生成建表所需要的属性 属性值等数组数据 */
const generateNeedData = (hasAttribute: IProductSelectAttribute[]) => {
......@@ -157,27 +157,6 @@ const PriceAttributeForm: React.FC<Iprops> = (props) => {
let needObject = generateNeedData(_priceAttribute)
let { _attributeNameArr, _attributeValueArr, _temp_attributeObjArr, _temp_attributeValObjArr } = needObject
// let len = _priceAttribute.length
// console.log(productName, _priceAttribute, len, productSelectAttribute, _tableDataSource, '---construct data---')
// let _temp_attributeObjArr = [] // 取id备用
// let _temp_attributeValObjArr = [] // 取id备用
// let _attributeNameArr = []
// let _attributeValueArr = []
// if(len){ // 提取价格属性 属性名数组 属性值SKU数组
// _priceAttribute.map(_item=>{
// _attributeNameArr.push(_item.attributeName) // 用于列header
// _temp_attributeObjArr.push({attributeName: _item.attributeName, customerAttributeId: _item.customerAttributeId})
// let _tempArr = []
// let _tempObjArr = [] // 取id备用
// _item.customerAttributeValueList.map(__item => {
// _tempArr.push(__item.value)
// _tempObjArr.push({id: __item.id, value: __item.value})
// })
// _attributeValueArr.push(_tempArr) // 价格属性的属性值数组 用于SKU组合
// _temp_attributeValObjArr.push(_tempObjArr)
// })
// }
console.log(_priceAttribute, _attributeNameArr, _attributeValueArr, _temp_attributeObjArr, _temp_attributeValObjArr, selectedGoods, '---constructimg---') // 编辑直接进入价格设置 都为空数组
......@@ -296,6 +275,12 @@ const PriceAttributeForm: React.FC<Iprops> = (props) => {
}
console.log(_tableData, '_tableData') // 只有一项 变动情况下表格数据的key获取不到
_tableDataSource = _tableData
// 有前面tab变动引起的二次构建 需要清空价格数据
if(updateFlag.current){
updateFlag.current = false
} else {
_tableDataSource.map(item => item['单价'] = {})
}
setTableDataSource(productName ? _tableDataSource : []) // 通过商品名称来判断是否显示表格数据
constructedPrarams()
......@@ -313,10 +298,6 @@ const PriceAttributeForm: React.FC<Iprops> = (props) => {
let _tempArr: any = []
Array.isArray(item) ? item.map((_item, _index) => {
let _tempObject: any = {};
// _tempObject.customerAttributeId = attributeObjArr[_index].customerAttributeId
// _tempObject.customerAttributeName = attributeObjArr[_index].attributeName
// _tempObject.id = attributeValObjArr.map(item =>item.find(_ => _.value===_item)).filter(__ => __)[0].id
// _tempObject.value = item[_index]
/* 新格式 */
_tempObject.customerAttribute = {
id: attributeObjArr[_index].customerAttributeId,
......@@ -328,10 +309,6 @@ const PriceAttributeForm: React.FC<Iprops> = (props) => {
}
_tempArr.push(_tempObject)
}) : _tempArr.push({
// customerAttributeId: attributeObjArr[0].customerAttributeId,
// customerAttributeName: attributeObjArr[0].attributeName,
// id: attributeValObjArr[0][0].id,
// value: item.toString()
/* 新格式 */
customerAttribute: {
id: attributeObjArr[0].customerAttributeId,
......@@ -590,12 +567,12 @@ const PriceAttributeForm: React.FC<Iprops> = (props) => {
</Tooltip>
</span>
}
rules={[{
required: true,
type: 'number',
message: '最小起订数不能小于0',
min: 0,
}]}
// rules={[{
// required: true,
// type: 'number',
// message: '最小起订数不能小于0',
// min: 0,
// }]}
>
<InputNumber style={{width: '100%'}} min={0} placeholder="请输入最小起订数" onChange={(e: number) => setMinOrderNumber(e)} />
</Form.Item>
......
......@@ -245,7 +245,7 @@ const DirectChannel: React.FC<{}> = () => {
const handleUpDown = () => {
setIsDisabledOKbtn(true)
let params = {
id: currentOptionId,
channelCommodityId: currentOptionId,
shopList: checkedValues
}
if(isUp)
......
......@@ -244,7 +244,7 @@ const ViewDriectChannel: React.FC<{}> = () => {
<Avatar size={48} shape="square" src={channelDetails?.unitPriceAndPicList[0]?.commodityPic && channelDetails.unitPriceAndPicList[0].commodityPic[0]} />
<span style={{color:'rgba(23,43,77,1)',fontSize:20,fontWeight:500,marginLeft:16}}>{channelDetails?.name}</span>
<span style={{color:'#E63F3B',padding:'2px 5px',background:'rgba(255,235,230,1)',borderRadius:'4px',marginLeft:16,marginRight:16}}>{channelDetails?.source === 1 ? "上级渠道" : "渠道自有"}</span>
<a>去查看 &gt;</a>
<a href={channelDetails?.source === 1 ? `/shop/commodity/detail?id=${channelDetails?.id}` : `/memberCenter/commodityAbility/commodity/products/viewProducts?id=${channelDetails?.id}`}>去查看 &gt;</a>
</p>
{content}
</Card>
......
......@@ -118,7 +118,7 @@ const viewBrand: React.FC<{}> = () => {
const fixProveUrl = (proveInfo: any) => {
if(proveInfo){
let imgArray = Object.values(proveInfo)
return imgArray.map((item: string, index: number) => <Col key={index} span={3}>
return imgArray.map((item: string, index: number) => <Col key={index} span={3} xxl={3} xl={4} lg={4}>
<div className={styles.proveBox}>
<img src={item} alt=""/>
</div>
......
import {action, computed, observable, runInAction} from 'mobx'
import { IChannelProductModule } from '@/module/channelProductModule'; // mobx要用到的数据类型
import { IChannelProductModule, IRole, IChannel } from '@/module/channelProductModule'; // mobx要用到的数据类型
import { GetProductChannelCommodityGetCommodityListResponseDetail, GetProductChannelCommodityGetCommodityUnitPriceResponse } from '@/services';
/**
......@@ -12,8 +12,9 @@ class ChannelProductStore implements IChannelProductModule {
@observable public priceType: number = null
@observable public productName: string = null
@observable public currentActiveKey: string = '1'
@observable public currentOperateChannel: string = null
@observable public currentOperateChannel: IChannel = null
@observable public tableDataInSetPrice: GetProductChannelCommodityGetCommodityUnitPriceResponse[] = null
@observable public selectedRole: IRole = null
// 加工接口返回的数据,用户编辑回显数据
......@@ -45,7 +46,7 @@ class ChannelProductStore implements IChannelProductModule {
}
@action.bound
public setCurrentOperateChannel(data: string){
public setCurrentOperateChannel(data: IChannel){
this.currentOperateChannel = data;
}
......@@ -54,6 +55,11 @@ class ChannelProductStore implements IChannelProductModule {
this.tableDataInSetPrice = data;
}
@action.bound
public setSelectedRole(data: IRole){
this.selectedRole = data;
}
}
export default ChannelProductStore
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