Skip to content

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

fix:修改渠道商品

parent 6e2de4c1
Show whitespace changes
Inline Side-by-side
Showing with 409 additions and 141 deletions
src/module/productModule/index.ts
View file @ cd728ab8
......@@ -32,6 +32,7 @@ interface InnerAttributeValueList {
}
export interface IProductSelectAttribute {
customerAttribute: { id: number; };
attributeName: string;
customerAttributeId: number;
customerAttributeValueList: InnerAttributeValueList[]
......
src/pages/commodity/products/addDirectChannel.tsx
View file @ cd728ab8
......@@ -23,8 +23,9 @@ import { searchBrandOptionEffect, searchCustomerCategoryOptionEffect } from './e
import { addChannelSchema } from './schema/channelSchema';
import { PublicApi } from '@/services/api';
import ModalTable from '@/components/ModalTable'
import { GetProductChannelCommodityGetCommodityListResponse } from '@/services';
import { GetProductChannelCommodityGetChannelCommodityResponse, GetProductChannelCommodityGetCommodityListResponseDetail } from '@/services';
import { useAsyncSelect } from '@/formSchema/effects/useAsyncSelect';
import { query } from 'express';
const {Item}:any = Form
......@@ -51,23 +52,6 @@ const layoutSetPrice = {
wrapperCol: { span: 24 },
}
const dataSetMember = [
{
key: '1',
name: '渠道名称',
type: '渠道企业会员',
role: '渠道采购商',
class: '青铜会员',
},
{
key: '2',
name: '渠道名称',
type: '渠道企业会员',
role: '渠道采购商',
class: '铁皮会员',
},
]
const productFormActions = createAsyncFormActions()
const AddDirectChannel:React.FC<{}> = (props) => {
......@@ -84,14 +68,16 @@ const AddDirectChannel:React.FC<{}> = (props) => {
const [visibleChannelMember, setVisibleChannelMember] = useState(false)
const [visibleAddSpec, setVisibleAddSpec] = useState(false)
const [productRowSelection, productRowCtl] = useRowSelectionTable({type: 'radio'})
const [selectProduct, setSelectProduct] = useState<GetProductChannelCommodityGetCommodityListResponse[]>()
const [selectProduct, setSelectProduct] = useState<GetProductChannelCommodityGetCommodityListResponseDetail[]>()
const [priceType, setPriceType] = useState<number>()
const [productName, setProductName] = useState<string>()
const [specColumn, setSpecColumn] = useState<any[]>([])
const [specTableData, setSpecTableData] = useState<any[]>([])
const [originTableData, setOriginTableData] = useState<any[]>([])
const [selectedSpecRowKeys, setSelectedSpecRowKeys] = useState<any>([])
const [selectSpecRow, setSelectSpecRow] = useState<any[]>([]) // 选中的规格弹框数据
const [priceTableData, setPriceTableData] = useState<any[]>([])
const [priceColumn, setPriceColumn] = useState<any[]>([])
const [isBatchSetting, setIsBatchSetting] = useState<boolean>(false)
......@@ -103,6 +89,9 @@ const AddDirectChannel:React.FC<{}> = (props) => {
const [selectMemberRow, setSelectMemberRow] = useState<any[]>([]) // 选中的会员弹框数据
const [memberColumn, setMemberColumn] = useState<any[]>([])
const [queryId, setQueryId] = useState<number>()
const [productInfoByEdit, setProductInfoByEdit] = useState<GetProductChannelCommodityGetChannelCommodityResponse>()
const productColumns: ColumnType<any>[] = [
{
title: 'ID',
......@@ -116,7 +105,7 @@ const AddDirectChannel:React.FC<{}> = (props) => {
},
{
title: '品类',
dataIndex: ['customerCategory', 'id'],
dataIndex: ['customerCategory', 'name'],
key: 'customerCategory',
},
{
......@@ -160,6 +149,28 @@ const AddDirectChannel:React.FC<{}> = (props) => {
]
useEffect(() => {
const { id } = history.location.query
setQueryId(id)
if(id)
PublicApi.getProductChannelCommodityGetChannelCommodity({id: id}).then(res => {
const { data } = res
setProductInfoByEdit(data)
formProduct.setFieldsValue({source: data.source})
setSource(data.source)
// @ts-ignore
setSelectProduct([data])
productRowCtl.setSelectRow([data])
productRowCtl.setSelectedRowKeys([data.commodityId])
formPrice.setFieldsValue({isMemberPrice: data.isMemberPrice})
formMember.setFieldsValue({channelMemberRoleId: data.channelMemberRoleId, isAllMember: data.isAllMember})
// 还差适用会员...
console.log(data, 'edit')
setOriginTableData(data.unitPriceAndPicList)
structureInitPriceTable(data.unitPriceAndPicList, data.name)
})
else
formProduct.setFieldsValue({source: source})
// 获取会员角色列表
PublicApi.getMemberManageChannelLowerRoleList().then(res => {
const { data } = res
......@@ -174,8 +185,10 @@ const AddDirectChannel:React.FC<{}> = (props) => {
}, [visibleAddSpec])
useEffect(() => {
if(productRowCtl.selectRow.length>0)
setPriceType(productRowCtl.selectRow[0].id)
if(productRowCtl.selectRow.length>0){
setPriceType(productRowCtl.selectRow[0].priceType)
setProductName(productRowCtl.selectRow[0].name)
}
}, [productRowCtl.selectRow])
useEffect(() => {
......@@ -200,7 +213,28 @@ const AddDirectChannel:React.FC<{}> = (props) => {
PublicApi.getProductChannelCommodityGetCommodityUnitPrice({id: productRowCtl.selectedRowKeys[0]}).then(res => {
const { data } = res
setOriginTableData(data)
if(data.length > 0){
if(data.length > 0)
structureTable(data)
})
}
// 获取上级渠道下拉列表
const fetchSelectOptions = async () => {
const { data } = await PublicApi.getMemberManageChannelUpperList();
return data.map(v => ({ label: v.name, value: v.memberId }))
}
// 获取渠道会员
const fetchMemberData = (params: any) => {
return new Promise((resolve, reject) => {
PublicApi.getMemberManageChannelLowerPage(params).then(res => {
const { data } = res
resolve(data)
})
})
}
const structureTable = (data: any, name?: string) => {
// 构建table 列columns
let col: any = []
let temp: any = []
......@@ -248,7 +282,6 @@ const AddDirectChannel:React.FC<{}> = (props) => {
})
setSpecColumn(col)
// 构建table 数据Data
let _tableData: any = []
data.map((item, index) => {
let temp: any = {}
......@@ -259,33 +292,94 @@ const AddDirectChannel:React.FC<{}> = (props) => {
"id": item.id, // 行数据id
"goodsId": item.goods.id, // 货品ID
"索引": index,
"商品名称": productRowCtl.selectRow[0].name,
// "商品名称": productRowCtl.selectRow[0].name,
"商品名称": name || productName,
"对应货品": item.goods.name,
...temp,
"单价": item.unitPrice
})
})
console.log(col, 'col', _tableData)
setSpecTableData(_tableData)
}
console.log(data, 'data')
const structureInitPriceTable = (data: any, name?: string) => {
// 编辑初始 构建table 列columns
let col: any = []
let temp: any = []
data[0].attributeAndValueList.map(_item => {
temp.push({title: _item.customerAttribute.name, dataIndex: [_item.customerAttribute.name, 'value'], key: _item.customerAttribute.name})
})
col.push({
title: 'ID',
dataIndex: 'id',
key: 'id'
},
{
title: 'GoodsId',
dataIndex: 'goodsId',
key: 'id',
className: 'commonHide'
},
{
title: '索引',
dataIndex: '索引',
key: '索引',
className: 'commonHide'
},
{
title: '商品名称',
dataIndex: '商品名称',
key: '商品名称'
},
{
title: '对应货品',
dataIndex: '对应货品',
key: '对应货品'
},
...temp,
{
title: priceType === 3 ? '积分' : '单价',
dataIndex: '单价',
key: '单价',
render: (text, record) => {
if (!text || JSON.stringify(text)==='{}') return null
return Object.keys(text).map((v, i) => {
return <><span key={i}>{v==='0-0'?'':`${v}:`} <span style={{color:'red'}}>￥{text[v]}</span></span><br /></>
})
}
// 获取上级渠道下拉列表
const fetchSelectOptions = async () => {
const { data } = await PublicApi.getMemberManageChannelUpperList();
return data.map(v => ({ label: v.name, value: v.memberId }))
},
{
title: '操作',
dataIndex: 'option',
render: (text: any, record: any) => {
return (
<>
<Button type='link' onClick={()=>clickSetPrice(record)}>{priceType===3?'设置积分':'设置价格'}</Button>
<Button type='link' onClick={()=>clickDelete(record)}>删除</Button>
</>
)
}
}
)
setPriceColumn(col)
// 获取渠道会员
const fetchMemberData = (params: any) => {
return new Promise((resolve, reject) => {
PublicApi.getMemberManageChannelLowerPage(params).then(res => {
const { data } = res
resolve(data)
let _tableData: any = []
data.map((item, index) => {
let temp: any = {}
item.attributeAndValueList.map(_item => {
temp[_item.customerAttribute.name] = {value: _item.customerAttributeValue.value, vId: _item.customerAttributeValue.id, id: _item.customerAttribute.id }
})
_tableData.push({
"id": item.id, // 行数据id
"goodsId": item.goods.id, // 货品ID
"索引": index,
"商品名称": name || productName,
"对应货品": item.goods.name,
...temp,
"单价": item.unitPrice
})
})
setPriceTableData(_tableData)
}
const callback = (key: any) => {
......@@ -354,6 +448,7 @@ const AddDirectChannel:React.FC<{}> = (props) => {
}
})
setPriceColumn(tempColumn)
setPriceTableData(selectSpecRow)
setVisibleAddSpec(false)
}
......@@ -398,18 +493,20 @@ const AddDirectChannel:React.FC<{}> = (props) => {
}
let _row = { ...curretSetPriceRow, 单价: _priceRange }
let newTabeData = [...selectSpecRow]
let newTabeData = [...priceTableData]
if(isBatchSetting){ // 判断是否批量设置价格
newTabeData.map(_item => _item['单价'] = _priceRange)
}else{
newTabeData[curretSetPriceRow['索引']] = _row
}
setSelectSpecRow(newTabeData)
setPriceTableData(newTabeData)
// setSelectSpecRow(newTabeData)
})
}
const clickDelete = (record: any) => {
setSelectSpecRow(selectSpecRow => [...selectSpecRow].filter(item => item.id != record.id))
// setSelectSpecRow(selectSpecRow => [...selectSpecRow].filter(item => item.id != record.id))
setPriceTableData(priceTableData => [...priceTableData].filter(item => item.id != record.id))
setSelectedSpecRowKeys(selectedSpecRowKeys => [...selectedSpecRowKeys].filter(item => item != record.id))
}
......@@ -480,27 +577,28 @@ const AddDirectChannel:React.FC<{}> = (props) => {
)
})
Promise.all(data).then((values) => {
console.log(values, productRowCtl.selectRow, selectSpecRow, memberRowCtl.selectedRowKeys, originTableData, 'vvvv')
let params: any = {...values[0], ...values[1], ...values[2]}
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].id
params.commodityId = productRowCtl.selectRow[0].commodityId
params.parentMemberId = productRowCtl.selectRow[0].parentMemberId
}
if(memberRowCtl.selectRow.length > 0)
params.purchaserList = memberRowCtl.selectedRowKeys
let tempUnitPrice = []
selectSpecRow.map(item => {
priceTableData.map(item => {
tempUnitPrice.push(
{
goodsId: item['goodsId'],
goods: { id: item['goodsId'] },
unitPrice: item['单价'],
goodsCustomerAttributeList: originTableData.filter(_ => _.id === item.id)[0].attributeAndValueList,
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)
......@@ -512,7 +610,7 @@ const AddDirectChannel:React.FC<{}> = (props) => {
return (<PageHeaderWrapper
onBack={() => history.goBack()}
backIcon={<ReutrnEle description="返回"/>}
title="新建渠道直采商品"
title={queryId ? "编辑渠道直采商品" : "新建渠道直采商品"}
extra={[
<Button key="123" type="primary" icon={<SaveOutlined />} onClick={onSave}>
保存
......@@ -535,7 +633,6 @@ const AddDirectChannel:React.FC<{}> = (props) => {
required: true,
message: '请选择商品来源'
}]}
initialValue={source}
>
<Radio.Group onChange={handleSourceChange}>
<Radio value={1}>上级渠道商品</Radio>
......@@ -575,7 +672,7 @@ const AddDirectChannel:React.FC<{}> = (props) => {
<PlusOutlined /> 选择商品规格
</Button>
{
selectSpecRow.length > 0 && priceType != 2 &&
priceTableData.length > 0 && priceType != 2 &&
<Button
type="text"
style={{float: 'right'}}
......@@ -585,7 +682,7 @@ const AddDirectChannel:React.FC<{}> = (props) => {
{priceType === 3 ? '批量设置积分' : '批量设置价格'}
</Button>
}
<Table rowKey="id" dataSource={selectSpecRow} columns={priceColumn} style={{clear: 'both'}} />
<Table rowKey="id" dataSource={priceTableData} columns={priceColumn} style={{clear: 'both'}} />
</TabPane>
<TabPane tab="适用会员" key="3" forceRender={true}>
<Form
......@@ -595,7 +692,7 @@ const AddDirectChannel:React.FC<{}> = (props) => {
labelAlign="left"
>
{
memberRoleList.length>0 && <Form.Item name="memberRoleId">
memberRoleList.length>0 && <Form.Item name="channelMemberRoleId">
<Radio.Group buttonStyle="solid" className={styles.customizeRadio}>
{
memberRoleList.map((item, index) => (
......
src/pages/commodity/products/addProducts.tsx
View file @ cd728ab8
......@@ -3,7 +3,7 @@ import { history } from 'umi';
import { Button, Card, Tabs, message } from 'antd'
import { PageHeaderWrapper } from '@ant-design/pro-layout'
import {
SaveOutlined,
SaveOutlined, EditFilled,
} from '@ant-design/icons'
import ReutrnEle from '@/components/ReturnEle'
......@@ -11,14 +11,14 @@ import BasicInfoForm from './addProductsItem/basicInfoForm'
import SelectGoodsForm from './addProductsItem/selectGoodsForm'
import ProductAttributeForm from './addProductsItem/productAttributeForm'
import PriceAttributeForm from './addProductsItem/priceAttributeForm'
import LogisticsForm from './addProductsItem/logisticsForm';
import OtherForm from './addProductsItem/otherForm';
import ProductImageForm from './addProductsItem/productImageForm';
import ProductDescFormOne from './addProductsItem/productDescFormOne';
import LogisticsForm from './addProductsItem/logisticsForm'
import OtherForm from './addProductsItem/otherForm'
import ProductImageForm from './addProductsItem/productImageForm'
import ProductDescFormOne from './addProductsItem/productDescFormOne'
import { inject, observer } from 'mobx-react'
import { store } from '@/store'
import { PublicApi } from '@/services/api';
import { PublicApi } from '@/services/api'
const { TabPane } = Tabs
......@@ -75,8 +75,10 @@ const AddProducts: React.FC<{}> = (props) => {
// 提交的数据进行处理
console.log(values, productSelectAttribute, productAttributeAndImageParams, '所有数据')
productSelectAttribute.length>0 && productSelectAttribute.map(_itme => {
_itme.customerAttribute = {id: _itme.customerAttributeId }
delete _itme.attributeName
delete _itme.isPrice
delete _itme.customerAttributeId
})
let _bacsicForm = {...values[0]}
_bacsicForm.customerCategoryId = _bacsicForm.customerCategoryId[_bacsicForm.customerCategoryId.length-1]
......@@ -127,10 +129,11 @@ const AddProducts: React.FC<{}> = (props) => {
delete __item.customerAttributeName
// __item.customerAttributeValueId = __item.id
// **** 新字段结构变更
__item.customerAttribute = { id: __item.id }
__item.customerAttributeValue = { id: __item.customerAttributeValueId, value: __item.value }
__item.customerAttribute = { id: __item.customerAttributeId }
__item.customerAttributeValue = { id: __item.id, value: __item.value }
delete __item.id
delete __item.value
delete __item.customerAttributeId
delete __item.customerAttributeValueId
})
}
if(_item.commodityPic.length>0){
......
src/pages/commodity/products/addProductsItem/basicInfoForm.tsx
View file @ cd728ab8
......@@ -162,6 +162,7 @@ const BasicInfoForm: React.FC<Iprops> = (props) => {
const onChangeName = (value: any) => {
setProductName(value)
}
return (<>
<Form
{...layout}
......
src/pages/commodity/products/addProductsItem/productAttributeForm.tsx
View file @ cd728ab8
......@@ -58,7 +58,7 @@ const ProductAttributeForm: React.FC<Iprops> = (props) => {
*/
const onChange = (value, attrItem) => {
let params = { customerAttributeId: attrItem.id, attributeName: attrItem.name, isPrice: attrItem.isPrice, customerAttributeValueList: [] }
console.log(params, 'params')
console.log(params, attributesData, 'params')
if(attrItem.type!==3){
for(let item of attrItem?.customerAttributeValueList){
if(value?.length){
......
src/pages/commodity/products/directChannel.tsx
View file @ cd728ab8
import React, { useState, useEffect, useRef, ReactNode } from 'react'
import { history } from 'umi'
import { Button, Form, Card, Modal, Select, Row, Col, Dropdown, Input, Menu, Space } from 'antd'
import { Button, Form, Card, Modal, Select, Row, Col, Dropdown, Tooltip, Menu, Space, message, Checkbox } from 'antd'
import { PageHeaderWrapper } from '@ant-design/pro-layout'
import {
PlusOutlined,
......@@ -9,11 +9,12 @@ import {
CaretDownOutlined,
DeleteOutlined,
VerticalAlignTopOutlined,
VerticalAlignBottomOutlined
VerticalAlignBottomOutlined,
ExclamationCircleOutlined,
QuestionCircleOutlined
} from '@ant-design/icons'
import { StandardTable } from 'god'
import { ColumnType } from 'antd/lib/table/interface'
import { IFormFilter, IButtonFilter } from 'god/dist/src/standard-table/TableController';
import NiceForm from '@/components/NiceForm'
import { useStateFilterSearchLinkageEffect } from '@/formSchema/effects/useFilterSearch'
import { FORM_FILTER_PATH } from '@/formSchema/const'
......@@ -25,6 +26,7 @@ import { useAsyncSelect } from '@/formSchema/effects/useAsyncSelect'
import { searchBrandOptionEffect, searchCustomerCategoryOptionEffect } from './effect'
import EyePreview from '@/components/EyePreview'
import moment from 'moment'
import { GetProductChannelCommodityGetShopResponse } from '@/services'
// 定义选择的行数据的类型
interface Item {
......@@ -39,15 +41,19 @@ interface Item {
status: string;
}
const { confirm } = Modal;
const formActions = createFormActions();
const DirectChannel: React.FC<{}> = () => {
const ref = useRef<any>({})
const [selectRow, setSelectRow] = useState<Item[]>([]) // 模态框选择的行数据
const [selectedRowKeys, setSelectedRowKeys] = useState<Array<string>>([])
const [deleteBatchModal, setDeleteBatchModal] = useState(false)
const [selectedRowKeys, setSelectedRowKeys] = useState<number[]>([])
const [isUp, setIsUp] = useState(1) // 1上0下架状态
const [upDownModal, setUpDownModal] = useState(false)
const [shopsOption, setShopsOption] = useState<GetProductChannelCommodityGetShopResponse>([])
const [checkedValues, setCheckedValues] = useState<any>([])
const [currentOptionId, setCurrentOptionId] = useState<number>()
const [isDisabledOKbtn, setIsDisabledOKbtn] = useState<boolean>(false)
const columns: ColumnType<any>[] = [
{
......@@ -61,7 +67,7 @@ const DirectChannel: React.FC<{}> = () => {
key: 'name',
className: 'commonPickColor',
render: (text:any, record:any) => <EyePreview
url={`/memberCenter/commodityAbility/commodity/products/viewDirectChannel?id=${record.key}`}
url={`/memberCenter/commodityAbility/commodity/products/viewDirectChannel?id=${record.id}`}
>
{text}
</EyePreview>
......@@ -83,8 +89,9 @@ const DirectChannel: React.FC<{}> = () => {
},
{
title: '价格',
dataIndex: 'price',
key: 'price',
dataIndex: 'min',
key: 'min',
render: (text: any, record: any) => <>￥{record.min} ~ ￥{record.max}</>
},
{
title: '渠道会员名称',
......@@ -114,7 +121,7 @@ const DirectChannel: React.FC<{}> = () => {
else if(record.status === 6)
component = (<span style={{padding:'2px 5px',background:'rgba(244,245,247,1)',borderRadius:'4px'}}>已下架</span>)
else if(record.status === 4)
component = (<span style={{color:'#E63F3B',padding:'2px 5px',background:'rgba(255,235,230,1)',borderRadius:'4px'}}>审核通过</span>)
component = (<span style={{color:'#E63F3B',padding:'2px 5px',background:'rgba(255,235,230,1)',borderRadius:'4px'}}>未上架</span>)
return component
}
},
......@@ -125,16 +132,63 @@ const DirectChannel: React.FC<{}> = () => {
render: (text:any, record:any) => {
return (
<>
{(record.status===6)?<Button type='link' onClick={()=>clickUp(1)}>上架</Button>:''}
{record.status===5?<Button type='link' onClick={()=>clickUp(0)}>下架</Button>:''}
<Button type='link'>修改</Button>
<Button type='link'>删除</Button>
{(record.status===5) ? <Button type='link' onClick={()=>clickUp(0, record.id)}>下架</Button> : ''}
{(record.status===6) ?
<>
<Button type='link' onClick={()=>clickUp(1, record.id)}>上架</Button>
<Button type='link' onClick={()=>clickModify(record.id)}>修改</Button>
</>
: ''}
{(record.status===4) &&
<>
<Button type='link' onClick={()=>clickUp(1, record.id)}>上架</Button>
<Dropdown overlay={
<Menu>
<Menu.Item><Button type='link' onClick={()=>clickModify(record.id)}>修改</Button></Menu.Item>
<Menu.Item><Button type='link' onClick={()=>clickDelete(record.id)}>删除</Button></Menu.Item>
</Menu>
}>
<a className="ant-dropdown-link" onClick={e => e.preventDefault()}>
更多 <CaretDownOutlined />
</a>
</Dropdown>
</>
}
</>
)
}
}
];
const clickModify = (paramId: number) => {
history.push(`/memberCenter/commodityAbility/commodity/products/addDirectChannel?id=${paramId}`)
}
// paramId ? 单个删除 : 批量删除
const clickDelete = (paramId?: number) => {
if(selectedRowKeys.length || paramId )
confirm({
title: '确定要执行删除操作?',
icon: <ExclamationCircleOutlined />,
okText: '确定',
okType: 'danger',
cancelText: '取消',
onOk() {
console.log(selectedRowKeys)
PublicApi.postProductChannelCommodityDeleteBatchChannelCommodity({idList: paramId ? [paramId] : selectedRowKeys}).then(res => {
if(res.code === 1000)
ref.current.reload()
})
},
onCancel() {
console.log('Cancel');
},
})
else
message.error('请先选择需要删除的商品！')
}
const fetchData = (params: any) => {
console.log(params, 'params')
return new Promise((resolve, reject) => {
......@@ -157,60 +211,64 @@ const DirectChannel: React.FC<{}> = () => {
setIsUp(0)
}
const handleBatchDelete = () => {
setDeleteBatchModal(true)
}
// const confirm = () => {
// console.log('confirm')
// }
// const cancel = () => {
// console.log('cancel')
// }
// const handleModify = (record: object) => {
// // 通过传入的params字符串判断是修改那种类型的数据
// console.log('执行状态修改', record)
// }
const rowSelection = {
selectedRowKeys: selectedRowKeys,
onChange: (selectedRowKeys: any, selectedRows: any) => {
setSelectRow(selectedRows);
setSelectedRowKeys(selectedRowKeys);
console.log(`selectedRowKeys: ${selectedRowKeys}`, 'selectedRows: ', selectedRows);
}
}
const handleOkDeleteBatch = () => {
setDeleteBatchModal(false)
console.log('删除批次')
const clickUp = (param: number, paramId: number) => {
setIsUp(param)
setCurrentOptionId(paramId)
// 获取渠道商品上架商城
PublicApi.getProductChannelCommodityGetShop({id: paramId + ''}).then(res => {
const { data } = res
setShopsOption(data)
setCheckedValues(data.filter(_=>_.isCheck))
})
setUpDownModal(true)
}
const handleCancelDelete = () => {
setDeleteBatchModal(false)
console.log('取消删除')
const onChangeUpShop = (values) => {
// 判断上架之前是否有店铺 有即可以上下架
PublicApi.getTemplateShopFindShop().then(res => {
if(res.data.logo){
setCheckedValues(values)
}else{
message.error('您还没有开通店铺，无法上下架商品！')
}
const clickUp = (param: any) => {
setIsUp(param)
setUpDownModal(true)
})
}
const handleUpDown = () => {
console.log('ok上下架')
setIsDisabledOKbtn(true)
let params = {
id: currentOptionId,
shopList: checkedValues
}
if(isUp)
PublicApi.postProductChannelCommodityPublishCommodity(params).then(res => {
setUpDownModal(false)
ref.current.reload()
setIsDisabledOKbtn(false)
})
else
PublicApi.postProductChannelCommodityOffPublishCommodity(params).then(res => {
setUpDownModal(false)
ref.current.reload()
setIsDisabledOKbtn(false)
})
}
const handleCancelUpDown = () => {
console.log('不ok上下架')
setUpDownModal(false)
}
const handleMenuClick = (param) => { // param: 1.批量删除 2.批量上架 3.批量下架
console.log(param,'Click Menu')
if(param.key === '1'){
handleBatchDelete()
clickDelete()
}else if(param.key === '2'){
handleBatchUp()
}else if(param.key === '3'){
......@@ -284,30 +342,35 @@ const DirectChannel: React.FC<{}> = () => {
/>
</Card>
<Modal
title="批量删除"
visible={deleteBatchModal}
onOk={handleOkDeleteBatch}
onCancel={handleCancelDelete}
okButtonProps={{danger: true}}
title={isUp?'商品上架':'商品下架'}
visible={upDownModal}
onOk={handleUpDown}
onCancel={()=>setUpDownModal(false)}
forceRender={true}
okButtonProps={{ disabled: isDisabledOKbtn }}
>
<Form
layout="vertical"
>
<Form.Item label="选择要删除的批次">
<Select placeholder="请选择批次号">
<Select.Option value="542424">4245242452</Select.Option>
</Select>
<Form.Item label={
<span>
请选择需要{isUp ? '上架' : '下架'}的商城&nbsp;
<Tooltip title="已上架的商城为已勾选的商城，不可选择，只可以选择未勾选的商城。">
<QuestionCircleOutlined />
</Tooltip>
</span>}>
<Checkbox.Group style={{ width: '100%' }} onChange={onChangeUpShop} value={checkedValues}>
<Row>
{
Array.isArray(shopsOption) && shopsOption.map((item, index) => <Col key={index} span={6}>
<Checkbox value={item}>{item.name}</Checkbox>
</Col>)
}
</Row>
</Checkbox.Group>
</Form.Item>
</Form>
</Modal>
<Modal
title={isUp?'批量上架':'批量下架'}
visible={upDownModal}
onOk={handleUpDown}
onCancel={handleCancelUpDown}
>
<h1>批量上下架</h1>
</Modal>
</PageHeaderWrapper>
)
}
......
src/pages/commodity/products/index.tsx
View file @ cd728ab8
......@@ -828,7 +828,7 @@ const Products: React.FC<{}> = () => {
<Form.Item label={
<span>
请选择需要{isUp ? '上架' : '下架'}的商城&nbsp;
<Tooltip title="这是一段描述?">
<Tooltip title="已上架的商城为已勾选的商城，不可选择，只可以选择未勾选的商城。">
<QuestionCircleOutlined />
</Tooltip>
</span>}>
......
src/pages/commodity/products/viewDirectChannel.tsx
View file @ cd728ab8
import React, { useState } from 'react'
import React, { useState, useEffect } from 'react'
import { history } from 'umi'
import { Card, Space, Radio, Row, Col, Descriptions, Table, Avatar } from 'antd'
import { PageHeaderWrapper } from '@ant-design/pro-layout'
......@@ -9,9 +9,93 @@ import {
import { ColumnType } from 'antd/lib/table/interface'
import ReutrnEle from '@/components/ReturnEle'
import styles from "./index.less"
import { PublicApi } from '@/services/api'
import { GetProductChannelCommodityGetChannelCommodityResponse } from '@/services'
const ViewDriectChannel: React.FC<{}> = () => {
const [memberType, setMemberType] = useState(1)
const [channelDetails, setChannelDetails] = useState<GetProductChannelCommodityGetChannelCommodityResponse>()
const [priceTableData, setPriceTableData] = useState<any[]>([])
const [priceTableDataColumn, setPrcieTableColumn] = useState<any[]>([])
useEffect(() => {
const { id } = history.location.query
PublicApi.getProductChannelCommodityGetChannelCommodity({id: id}).then(res => {
const { data } = res
setChannelDetails(data)
constructTable(data)
})
}, [])
const constructTable = (param: GetProductChannelCommodityGetChannelCommodityResponse) => {
const { unitPriceAndPicList, priceType } = param
if(unitPriceAndPicList.length > 0){
let col: any = []
let temp: any = []
unitPriceAndPicList[0].attributeAndValueList.map(_item => {
temp.push({title: _item.customerAttribute.name, dataIndex: [_item.customerAttribute.name, 'value'], key: _item.customerAttribute.name})
})
col.push({
title: 'ID',
dataIndex: 'id',
key: 'id'
},
{
title: 'GoodsId',
dataIndex: 'goodsId',
key: 'id',
className: 'commonHide'
},
{
title: '索引',
dataIndex: '索引',
key: '索引',
className: 'commonHide'
},
{
title: '商品名称',
dataIndex: '商品名称',
key: '商品名称'
},
{
title: '对应货品',
dataIndex: '对应货品',
key: '对应货品'
},
...temp,
{
title: priceType === 3 ? '积分' : '单价',
dataIndex: '单价',
key: '单价',
render: (text, record) => {
if (!text || JSON.stringify(text)==='{}') return null
return Object.keys(text).map((v, i) => {
return <><span key={i}>{v==='0-0'?'':`${v}:`} <span style={{color:'red'}}>￥{text[v]}</span></span><br /></>
})
}
})
setPrcieTableColumn(col)
// 构建table 数据Data
let _tableData: any = []
unitPriceAndPicList.map((item, index) => {
let temp: any = {}
item.attributeAndValueList.map(_item => {
temp[_item.customerAttribute.name] = {value: _item.customerAttributeValue.value, vId: _item.customerAttributeValue.id, id: _item.customerAttribute.id }
})
_tableData.push({
"id": item.id, // 行数据id
"goodsId": item.goods.id, // 货品ID
"索引": index,
"商品名称": param.name,
"对应货品": item.goods.name,
...temp,
"单价": item.unitPrice
})
})
console.log(col, 'col', _tableData)
setPriceTableData(_tableData)
}
}
const dataSourcePrice = [
{
......@@ -123,17 +207,28 @@ const ViewDriectChannel: React.FC<{}> = () => {
},
]
const renderStatus = (status: any) => {
if(status === 5)
return <span className={styles.pruductStatus}>已上架</span>
if(status === 6)
return <span style={{padding:'2px 5px',background:'rgba(244,245,247,1)',borderRadius:'4px'}}>已下架</span>
if(status === 4)
return <span style={{color:'#E63F3B',padding:'2px 5px',background:'rgba(255,235,230,1)',borderRadius:'4px'}}>未上架</span>
}
const content = <>
<Descriptions colon={true}>
<Descriptions.Item label="商品状态"><span className={styles.pruductStatus}>已上架</span></Descriptions.Item>
<Descriptions colon={true} style={{marginTop:50}}>
<Descriptions.Item label="商品状态">{renderStatus(channelDetails?.status)}</Descriptions.Item>
<Descriptions.Item label="上级渠道">经销5S店</Descriptions.Item>
<Descriptions.Item label="上架商城"><Avatar size="small" icon={<UserOutlined />} />&nbsp;<Avatar size="small" icon={<UserOutlined />} /></Descriptions.Item>
<Descriptions.Item label="商品品类">牛皮</Descriptions.Item>
<Descriptions.Item label="商品品牌">APPLE</Descriptions.Item>
<Descriptions.Item label="单位">吨</Descriptions.Item>
<Descriptions.Item label="商品ID">10086</Descriptions.Item>
<Descriptions.Item label="上架商城">
{
channelDetails?.commodityShopList?.length>0 && channelDetails.commodityShopList.map((item, index)=><span key={index}>{item.name}&nbsp;</span>)
}
</Descriptions.Item>
<Descriptions.Item label="商品品类">{channelDetails?.customerCategory?.fullName}</Descriptions.Item>
<Descriptions.Item label="商品品牌">{channelDetails?.brand?.name}</Descriptions.Item>
<Descriptions.Item label="单位">{channelDetails?.unitName}</Descriptions.Item>
<Descriptions.Item label="商品ID">{channelDetails?.id}</Descriptions.Item>
</Descriptions>
</>
......@@ -146,9 +241,9 @@ const ViewDriectChannel: React.FC<{}> = () => {
<Space direction="vertical" style={{width:'100%'}}>
<Card headStyle={{borderBottom:'none'}} title="商品信息">
<p>
<Avatar size={48} shape="square" src="https://avatars1.githubusercontent.com/u/8186664?s=460&v=4" />
<span style={{color:'rgba(23,43,77,1)',fontSize:20,fontWeight:500,marginLeft:16}}>进口头层牛皮荔枝纹</span>
<span style={{color:'#E63F3B',padding:'2px 5px',background:'rgba(255,235,230,1)',borderRadius:'4px',marginLeft:16,marginRight:16}}>上级渠道</span>
<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>
</p>
{content}
......@@ -156,7 +251,15 @@ const ViewDriectChannel: React.FC<{}> = () => {
</Space>
<Space direction="vertical" style={{width:'100%'}}>
<Card headStyle={{borderBottom:'none'}} title="单价设置">
<Table dataSource={dataSourcePrice} columns={columnsPrice} pagination={false} />
<Row>
<Col span={3}>
<p>会员折扣：</p>
</Col>
<Col span={21}>
<p>{channelDetails?.isMemberPrice ? '允许使用会员折扣价购买' : '不允许使用会员折扣价购买'}</p>
</Col>
</Row>
<Table dataSource={priceTableData} columns={priceTableDataColumn} pagination={false} />
</Card>
</Space>
<Space direction="vertical" style={{width:'100%'}}>
......@@ -166,10 +269,10 @@ const ViewDriectChannel: React.FC<{}> = () => {
<p>使用渠道会员：</p>
</Col>
<Col span={21}>
<p>{memberType ? <Radio checked>指定渠道会员</Radio> : <Radio checked>所有渠道会员（默认）</Radio>}</p>
<p>{channelDetails?.isAllMember ? '所有渠道会员（默认）': '指定渠道会员'}</p>
</Col>
</Row>
{memberType ? <Table dataSource={dataMember} columns={columnsMember} /> : ''}
{channelDetails?.isAllMember ? '' : <Table dataSource={dataMember} columns={columnsMember} />}
</Card>
</Space>
</PageHeaderWrapper>
......
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