Commit 52bf3f9e authored by GuanHua's avatar GuanHua

fix: 1.商品列表排序问题;2.模板装修品类参数问题

parent f52b6d98
......@@ -49,8 +49,7 @@ const InputNumber: React.FC<InputNumberPropsType> = (props) => {
const handleChange = (e) => {
const { value } = e.target;
const reg = /^\d*([.]?\d{0,3})$/
// console.log(reg.test(value), value)
if (reg.test(value)) {
if (reg.test(String(value))) {
onChange(value, 'change')
}
}
......@@ -62,7 +61,7 @@ const InputNumber: React.FC<InputNumberPropsType> = (props) => {
if(reg.test(num)) {
num = value.replace('.', "")
}
console.log(num, "num")
if (num === "") {
onChange(minCount, 'blur')
} else {
......
......@@ -152,6 +152,10 @@ export enum FILTER_TYPE {
*/
name = 'name',
/**
* 排序
*/
sort = 'sort',
/**
* 价格排序
*/
priceSort = 'priceSort',
......
......@@ -56,7 +56,9 @@ const GoodsSetting: React.FC<GoodsSettingPropsType> = (props) => {
const fetchCategoryList = () => {
const param: any = {
categoryId: categoryid,
templateId: templateid
templateId: templateid,
current: 1,
pageSize: 100
}
PublicApi.getTemplateShopFindCategoryList(param).then(res => {
if (res.code === 1000) {
......@@ -328,7 +330,7 @@ const GoodsSetting: React.FC<GoodsSettingPropsType> = (props) => {
name="twoCategoryId"
className={styles.mar_bot_0}
>
<Select placeholder="品类" style={{ width: 180 }}>
<Select allowClear placeholder="品类" style={{ width: 180 }} onChange={handleSearch}>
{
categoryResponseList.map((item, index) => <Select.Option key={`select_category_item_${index}`} value={item.categoryId}>{item.categoryName}</Select.Option>)
}
......@@ -340,7 +342,7 @@ const GoodsSetting: React.FC<GoodsSettingPropsType> = (props) => {
name="brandId"
className={styles.mar_bot_0}
>
<Select placeholder="品牌" style={{ width: 180 }}>
<Select allowClear placeholder="品牌" style={{ width: 180 }} onChange={handleSearch}>
{
noSelectBrands.map((item, index) => (<Select.Option key={`select_brand_item_${index}`} value={item.brandId}>{item.brandName}</Select.Option>))
}
......
......@@ -188,64 +188,64 @@ const Commodity: React.FC<CommodityPropsType> = (props) => {
/**
* 判断当前筛选项是否含有价格排序的筛选
*/
if (filterList.some(item => item.type === FILTER_TYPE.priceSortHighToLow)) {
if (filterList.some(item => item.key === FILTER_TYPE.priceSortHighToLow)) {
onFilter({
key: null,
title: '价格从高到低',
type: FILTER_TYPE.priceSortHighToLow,
type: FILTER_TYPE.sort,
})
onFilter({
key: 'priceSortLowToHigh',
title: '价格从低到高',
type: FILTER_TYPE.priceSortLowToHigh,
type: FILTER_TYPE.sort,
})
} else if (filterList.some(item => item.type === FILTER_TYPE.priceSortLowToHigh)) {
} else if (filterList.some(item => item.key === FILTER_TYPE.priceSortLowToHigh)) {
onFilter({
key: null,
title: '价格从低到高',
type: FILTER_TYPE.priceSortLowToHigh,
type: FILTER_TYPE.sort,
})
onFilter({
key: 'priceSortHighToLow',
title: '价格从高到低',
type: FILTER_TYPE.priceSortHighToLow,
type: FILTER_TYPE.sort,
})
} else {
onFilter({
key: 'priceSortHighToLow',
title: '价格从高到低',
type: FILTER_TYPE.priceSortHighToLow,
type: FILTER_TYPE.sort,
})
}
break
case FILTER_TYPE.soldSort:
if (filterList.some(item => item.type === FILTER_TYPE.soldSort)) {
if (filterList.some(item => item.key === FILTER_TYPE.soldSort)) {
onFilter({
key: null,
title: '销量从高到低',
type: FILTER_TYPE.soldSort,
type: FILTER_TYPE.sort,
})
} else {
onFilter({
key: 'soldSort',
title: '销量从高到低',
type: FILTER_TYPE.soldSort,
type: FILTER_TYPE.sort,
})
}
break
case FILTER_TYPE.creditSort:
if (filterList.some(item => item.type === FILTER_TYPE.creditSort)) {
if (filterList.some(item => item.key === FILTER_TYPE.creditSort)) {
onFilter({
key: null,
title: '信用从高到低',
type: FILTER_TYPE.creditSort,
type: FILTER_TYPE.sort,
})
} else {
onFilter({
key: 'creditSort',
title: '信用从高到低',
type: FILTER_TYPE.creditSort,
type: FILTER_TYPE.sort,
})
}
break
......@@ -296,7 +296,7 @@ const Commodity: React.FC<CommodityPropsType> = (props) => {
<span>销量</span>
<i className={styles.icon}>
{
filterList.some(item => item.type === FILTER_TYPE.soldSort) ? <img src={arrowDownActiveIcon} /> : <img src={arrowDownIcon} />
filterList.some(item => item.key === FILTER_TYPE.soldSort) ? <img src={arrowDownActiveIcon} /> : <img src={arrowDownIcon} />
}
</i>
</div>
......@@ -304,15 +304,15 @@ const Commodity: React.FC<CommodityPropsType> = (props) => {
<span>信用</span>
<i className={styles.icon}>
{
filterList.some(item => item.type === FILTER_TYPE.creditSort) ? <img src={arrowDownActiveIcon} /> : <img src={arrowDownIcon} />
filterList.some(item => item.key === FILTER_TYPE.creditSort) ? <img src={arrowDownActiveIcon} /> : <img src={arrowDownIcon} />
}
</i>
</div>
<div className={styles.tool_bar_filter_item} onClick={() => handleSort(FILTER_TYPE.priceSort)}>
<span>价格</span>
<div className={styles.price_filter_box}>
<CaretUpOutlined className={cx(styles.icon, filterList.some(item => item.type === FILTER_TYPE.priceSortLowToHigh) ? styles.active : '')} />
<CaretDownOutlined className={cx(styles.icon, filterList.some(item => item.type === FILTER_TYPE.priceSortHighToLow) ? styles.active : '')} />
<CaretUpOutlined className={cx(styles.icon, filterList.some(item => item.key === FILTER_TYPE.priceSortLowToHigh) ? styles.active : '')} />
<CaretDownOutlined className={cx(styles.icon, filterList.some(item => item.key === FILTER_TYPE.priceSortHighToLow) ? styles.active : '')} />
</div>
</div>
</div>
......
......@@ -26,7 +26,6 @@ const CommodityList: React.FC<CommodityListPropsType> = (props) => {
<label>{priceFormat(commodityItem.min)}</label>
</div>
)
break
// 价格需要询价
case 2:
return (
......@@ -34,7 +33,6 @@ const CommodityList: React.FC<CommodityListPropsType> = (props) => {
<label>在线询价</label>
</div>
)
break
// 积分兑换商品
case 3:
break
......@@ -66,7 +64,7 @@ const CommodityList: React.FC<CommodityListPropsType> = (props) => {
{
commodityList.map((item, index) => (
<div key={`commodity_list_item_${index}`} className={cx(styles.commodity_list_item, styles.row)}>
<a href={getCommodityDetailLink(item)} target="_blank">
<a href={getCommodityDetailLink(item)} target="_blank" rel="noreferrer">
<div className={styles.goods_img}>
{
item.mainPic ? <img src={item.mainPic} /> : <Skeleton.Image style={{ width: 220, height: 220 }} />
......@@ -99,7 +97,7 @@ const CommodityList: React.FC<CommodityListPropsType> = (props) => {
{
commodityList.map((item, index) => (
<div key={`commodity_list_item_column_${index}`} className={cx(styles.commodity_list_item, styles.column)}>
<a href={getCommodityDetailLink(item)} target="_blank">
<a href={getCommodityDetailLink(item)} target="_blank" rel="noreferrer">
<div className={styles.goods_img}>
{
item.mainPic ? <img src={item.mainPic} /> : <Skeleton.Image style={{ width: 120, height: 120 }} />
......
......@@ -15,6 +15,7 @@ import { LAYOUT_TYPE } from '@/constants'
import { useLocalStore, observer } from 'mobx-react'
import { PostSearchShopEnterpriseGetCommodityListResponseDetail } from '@/services/SearchApi'
import arrowDownIcon from '@/assets/imgs/arrow_down.png'
import arrowDownActiveIcon from '@/assets/imgs/arrow_down_active.png'
import { GlobalConfig } from '@/global/config'
import styles from './index.less'
......@@ -26,7 +27,7 @@ interface CommodityPropsType {
memberId: number
}
interface filterQuery {
interface FilterQuery {
current: number;
pageSize: number;
name?: string;
......@@ -47,7 +48,7 @@ const CommoditySearch: React.FC<CommodityPropsType> = (props) => {
const UserStore = useLocalStore(() => store.UserStore)
const FilterStore = useLocalStore(() => store.FilterStore)
const { userInfo } = UserStore
const { filterList, filterUpdate, filterParam, onDeleteFilterItem, onResetFilter, onFilterParamChange } = FilterStore
const { filterList, filterUpdate, filterParam, onFilter, onDeleteFilterItem, onResetFilter, onFilterParamChange } = FilterStore
const { layoutType, shopId, shopUrlParam, memberId } = props
const { query: { search = "" } } = props.location
const [loading, setLoading] = useState<boolean>(true)
......@@ -73,7 +74,7 @@ const CommoditySearch: React.FC<CommodityPropsType> = (props) => {
useEffect(() => {
if (userInfo && layoutType === LAYOUT_TYPE.mall) {
let temp = JSON.parse(JSON.stringify(filterConfig))
const temp = JSON.parse(JSON.stringify(filterConfig))
temp.unshift(FILTER_TYPE.commonlyUsed)
setFilterConfig(temp)
}
......@@ -83,11 +84,11 @@ const CommoditySearch: React.FC<CommodityPropsType> = (props) => {
}, [layoutType])
const fetchCommodityList = (currentParam?: number) => {
let param: filterQuery = {
let param: FilterQuery = {
current: currentParam ? currentParam : current,
pageSize
}
if (!!search) {
if (search) {
param.name = search
}
......@@ -114,7 +115,6 @@ const CommoditySearch: React.FC<CommodityPropsType> = (props) => {
break
}
//@ts-ignore
getFn && getFn(param).then(res => {
setLoading(false)
if (res.code === 1000) {
......@@ -171,6 +171,82 @@ const CommoditySearch: React.FC<CommodityPropsType> = (props) => {
}
/**
* 排序
*/
const handleSort = (type: FILTER_TYPE) => {
switch (type) {
case FILTER_TYPE.priceSort:
/**
* 判断当前筛选项是否含有价格排序的筛选
*/
if (filterList.some(item => item.key === FILTER_TYPE.priceSortHighToLow)) {
onFilter({
key: null,
title: '价格从高到低',
type: FILTER_TYPE.sort,
})
onFilter({
key: 'priceSortLowToHigh',
title: '价格从低到高',
type: FILTER_TYPE.sort,
})
} else if (filterList.some(item => item.key === FILTER_TYPE.priceSortLowToHigh)) {
onFilter({
key: null,
title: '价格从低到高',
type: FILTER_TYPE.sort,
})
onFilter({
key: 'priceSortHighToLow',
title: '价格从高到低',
type: FILTER_TYPE.sort,
})
} else {
onFilter({
key: 'priceSortHighToLow',
title: '价格从高到低',
type: FILTER_TYPE.sort,
})
}
break
case FILTER_TYPE.soldSort:
if (filterList.some(item => item.key === FILTER_TYPE.soldSort)) {
onFilter({
key: null,
title: '销量从高到低',
type: FILTER_TYPE.sort,
})
} else {
onFilter({
key: 'soldSort',
title: '销量从高到低',
type: FILTER_TYPE.sort,
})
}
break
case FILTER_TYPE.creditSort:
if (filterList.some(item => item.key === FILTER_TYPE.creditSort)) {
onFilter({
key: null,
title: '信用从高到低',
type: FILTER_TYPE.sort,
})
} else {
onFilter({
key: 'creditSort',
title: '信用从高到低',
type: FILTER_TYPE.sort,
})
}
break
default:
break
}
}
return (
<div className={styles.commodity}>
<div className={styles.mall_container}>
......@@ -179,23 +255,27 @@ const CommoditySearch: React.FC<CommodityPropsType> = (props) => {
<div className={styles.commodity_main}>
<div className={styles.tool_bar}>
<div className={styles.tool_bar_left}>
<div className={styles.tool_bar_filter_item}>
<div className={styles.tool_bar_filter_item} onClick={() => handleSort(FILTER_TYPE.soldSort)}>
<span>销量</span>
<i className={styles.icon}>
<img src={arrowDownIcon} />
{
filterList.some(item => item.key === FILTER_TYPE.soldSort) ? <img src={arrowDownActiveIcon} /> : <img src={arrowDownIcon} />
}
</i>
</div>
<div className={styles.tool_bar_filter_item}>
<div className={styles.tool_bar_filter_item} onClick={() => handleSort(FILTER_TYPE.creditSort)}>
<span>信用</span>
<i className={styles.icon}>
<img src={arrowDownIcon} />
{
filterList.some(item => item.key === FILTER_TYPE.creditSort) ? <img src={arrowDownActiveIcon} /> : <img src={arrowDownIcon} />
}
</i>
</div>
<div className={styles.tool_bar_filter_item}>
<div className={styles.tool_bar_filter_item} onClick={() => handleSort(FILTER_TYPE.priceSort)}>
<span>价格</span>
<div className={styles.price_filter_box}>
<CaretUpOutlined className={styles.icon} />
<CaretDownOutlined className={styles.icon} />
<CaretUpOutlined className={cx(styles.icon, filterList.some(item => item.key === FILTER_TYPE.priceSortLowToHigh) ? styles.active : '')} />
<CaretDownOutlined className={cx(styles.icon, filterList.some(item => item.key === FILTER_TYPE.priceSortHighToLow) ? styles.active : '')} />
</div>
</div>
</div>
......@@ -212,8 +292,6 @@ const CommoditySearch: React.FC<CommodityPropsType> = (props) => {
<div className={styles.filter_bar}>
<div className={styles.filter_bar_left}>
<div className={styles.filter_bar_left_text1}>当前搜索:</div>
{/* <div className={styles.filter_bar_left_split}></div>
<div className={styles.filter_bar_left_text} onClick={handleResetFilter}>重置</div> */}
</div>
<div className={styles.filter_bar_list}>
{
......
......@@ -22,6 +22,7 @@ import styles from './index.less'
import { GlobalConfig } from '@/global/config'
import ErrorResult from './error'
import { isEmpty } from 'lodash'
import useStoreId from '@/hooks/useStoreId'
import { LAYOUT_TYPE, COMMODITY_TYPE, OrderModalType } from '@/constants'
......@@ -56,8 +57,27 @@ const integralPayWay = [
]
const getLayoutType = (layoutType: LAYOUT_TYPE, commodityType: COMMODITY_TYPE) => {
switch(layoutType) {
case LAYOUT_TYPE.mall:
case LAYOUT_TYPE.shop:
if(commodityType === COMMODITY_TYPE.integral) {
return LAYOUT_TYPE.scoreMall
} else {
return LAYOUT_TYPE.mall
}
case LAYOUT_TYPE.channel:
case LAYOUT_TYPE.ichannel:
if(commodityType === COMMODITY_TYPE.integral) {
return LAYOUT_TYPE.channelScoreMall
} else {
return layoutType
}
}
}
const CommodityDetail = (props) => {
const { query: { id } } = props.location
const { query: { id, type } } = props.location
const { shopInfo = {}, shopId, layoutType, memberId, shopUrlParam } = props
const OrderStore = useLocalStore(() => store.OrderStore)
const { updateOrderInfo } = OrderStore
......@@ -78,6 +98,7 @@ const CommodityDetail = (props) => {
const [commonCategoryCommodityList, setCommonCategoryCommodityList] = useState([])
const [spinLoading, setSpinLoading] = useState<boolean>(true)
const [errorInfo, setErrorInfo] = useState<any>()
const { storeId } = useStoreId(getLayoutType(layoutType, Number(type)))
let clickFlag = true
......@@ -523,7 +544,7 @@ const CommodityDetail = (props) => {
supplyMembersId: commodityDetail.memberId,
supplyMembersRoleId: commodityDetail.memberRoleId,
isInvoice: commodityDetail.isInvoice,
shopId: shopInfo.id,
shopId: storeId,
orderList: [{
id: shopInfo.id,
shopname: shopInfo.company,
......
......@@ -71,7 +71,7 @@ const Order: React.FC<OrderPropsType> = (props) => {
const [electronicContractId, setElectronicContractId] = useState<number>()
const [agreeSingLoading, setAgreeSignLoading] = useState<boolean>(false)
const [btnDisabled] = useState<boolean>(false)
const { storeId } = useStoreId(getLayoutType(layoutType, type))
const { storeId } = useStoreId(getLayoutType(layoutType, Number(type)))
useEffect(() => {
if (!userInfo) {
......
......@@ -35,7 +35,7 @@ const CommodityList: React.FC<CommodityListPropsType> = (props) => {
{
commodityList.map((item, index) => (
<div key={item.id} className={cx(styles.point_commodity_list_item, styles.row)}>
<a href={getCommodityDetailUrl(item)} target="_blank">
<a href={getCommodityDetailUrl(item)} target="_blank" rel="noreferrer">
<div className={styles.goods_img}>
{
item.mainPic ? <img src={item.mainPic} /> : <Skeleton.Image style={{ width: 220, height: 220 }} />
......
......@@ -582,7 +582,7 @@ const PurchaseOrder: React.FC<PurchaseOrderPropsType> = (props) => {
supplyMembersName: selectItem.shopname,
supplyMembersId: selectItem.memberId,
supplyMembersRoleId: selectItem.memberRoleId,
// shopId: shopInfo.id,
shopId: storeId,
orderList: [{
id: selectItem.id,
shopname: selectItem.shopname,
......
......@@ -161,6 +161,22 @@ class FilterStore {
case FILTER_TYPE.city:
tempFilterParam.cityCode = filterItem.key
break
case FILTER_TYPE.sort:
switch(filterItem.key) {
case 'soldSort':
tempFilterParam.orderType = 1
break
case 'creditSort':
tempFilterParam.orderType = 2
break
case 'priceSortHighToLow':
tempFilterParam.orderType = 3
break
case 'priceSortLowToHigh':
tempFilterParam.orderType = 4
break
}
break
case FILTER_TYPE.soldSort:
tempFilterParam.orderType = 1
break
......
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