Commit 6c7241c1 authored by 前端-许佳敏's avatar 前端-许佳敏
parents ee04d6a4 ac38c1ed
......@@ -178,11 +178,17 @@ export function onRouteChange({ routes, matchedRoutes, location, action }) {
if (whiteLists.includes(location.pathname)) {
return
}
const authInfo = getAuth()
// 是否登录
if (getAuth()) {
if (authInfo) {
const routeAuthUrls = getRouters()
let routeAuthUrls = getRouters()
if (!routeAuthUrls || routeAuthUrls.length === 0) {
const { urls } = authInfo
routeAuthUrls = urls
setRouters(urls)
}
const { pathname } = location
if (userLoginLists.includes(pathname)) {
// 当登录过, 并且尝试访问登录相关页面, 需重定向到首页
......@@ -207,7 +213,7 @@ export function onRouteChange({ routes, matchedRoutes, location, action }) {
return;
}
// 无权限访问时
console.log(pathname)
// console.log(pathname)
history.replace('/memberCenter/noAuth')
} else {
if (whiteLists.includes(location.pathname)) {
......
import React, { useState, useEffect, useCallback, useRef } from 'react'
import { CaretUpOutlined, CaretDownOutlined, UnorderedListOutlined, AppstoreOutlined, CloseOutlined, QuestionCircleOutlined } from '@ant-design/icons'
import React, { useState, useEffect } from 'react'
import { CaretUpOutlined, CaretDownOutlined, UnorderedListOutlined, AppstoreOutlined, CloseOutlined } from '@ant-design/icons'
import Filter from '../components/Filter'
import { FILTER_TYPE } from '@/constants'
import cx from 'classnames'
......@@ -13,7 +13,7 @@ import { store } from '@/store'
import { PublicApi } from '@/services/api'
import { LAYOUT_TYPE } from '@/constants'
import { PostSearchShopEnterpriseGetCommodityListResponseDetail } from '@/services/SearchApi'
import bannerImg from '@/assets/imgs/banner_2.png'
// import bannerImg from '@/assets/imgs/banner_2.png'
import arrowDownIcon from '@/assets/imgs/arrow_down.png'
import arrowDownActiveIcon from '@/assets/imgs/arrow_down_active.png'
import styles from './index.less'
......
......@@ -147,12 +147,13 @@
color: #303133;
text-align: left;
margin-top: 12px;
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
// display: -webkit-box;
// -webkit-box-orient: vertical;
// -webkit-line-clamp: 2;
text-overflow: ellipsis;
overflow: hidden;
-webkit-box-orient: vertical;
white-space: nowrap;
// -webkit-box-orient: vertical;
word-wrap: break-word;
word-break: break-all;
}
......
import React from 'react'
import noResultIcon from '@/assets/imgs/no_result_icon.png'
import styles from './index.less'
interface ErrorResultPropsType {
errorMessage: string
}
const ErrorResult: React.FC<ErrorResultPropsType> = (props) => {
const { errorMessage } = props
return (
<div className={styles.no_result_container}>
<div className={styles.no_result}>
<div className={styles.no_result_tip}>
<div className={styles.no_result_tip_img}>
<img src={noResultIcon} />
</div>
<div className={styles.no_result_tip_text}>
{ errorMessage }
</div>
</div>
<div className={styles.no_result_suggest}>
<ul className={styles.no_result_suggest_list}>
<li>出现的可能原因:</li>
<li>1、管理员冻结了该商品</li>
<li>2、商品链接出现错误</li>
</ul>
</div>
</div>
</div>
)
}
export default ErrorResult
\ No newline at end of file
......@@ -362,4 +362,58 @@
color: #FFF;
}
}
}
.no_result_container {
width: 1200px;
margin: 0 auto;
}
.no_result {
width: 300px;
margin: 0 auto;
padding: 200px 0;
&_tip {
font-size: 14px;
color: #D32F2F;
font-weight: 500;
display: flex;
&_text {
line-height: 30px;
}
&_search {
color: #303133;
}
&_img {
width: 30px;
height: 30px;
overflow: hidden;
margin-right: 16px;
&>img {
width: 30px;
height: 30px;
}
}
}
&_suggest {
margin-top: 12px;
font-size: 12px;
color: #909399;
padding-left: 46px;
&_list {
padding: 0;
margin: 0;
&>li {
list-style: none;
}
}
}
}
\ No newline at end of file
import React, { useState, useEffect, ReactNode } from 'react'
import React, { useState, useEffect } from 'react'
import { QuestionCircleOutlined } from '@ant-design/icons'
import { Tooltip, message, Button } from 'antd'
import { Tooltip, message, Button, Spin } from 'antd'
import cx from 'classnames'
import { history } from 'umi'
import DialogModal from '../components/DialogModal'
......@@ -20,6 +20,7 @@ import { numFormat, priceFormat } from '@/utils/numberFomat'
import jinhuodanIcon from '@/assets/imgs/jinhuodan.png'
import styles from './index.less'
import { GlobalConfig } from '@/global/config'
import ErrorResult from './error'
import { isEmpty } from 'lodash'
import { LAYOUT_TYPE, COMMODITY_TYPE, OrderModalType } from '@/constants'
......@@ -75,6 +76,8 @@ const CommodityDetail = (props) => {
const [purchaseCount, setPurchaseCount] = useState<number>(0)
const [payWayList, setPayWayList] = useState([])
const [commonCategoryCommodityList, setCommonCategoryCommodityList] = useState([])
const [spinLoading, setSpinLoading] = useState<boolean>(true)
const [errorInfo, setErrorInfo] = useState<any>()
let clickFlag = true
......@@ -186,6 +189,7 @@ const CommodityDetail = (props) => {
getDetailFn && getDetailFn(params, { headers }).then(res => {
if (res.code === 1000) {
setErrorInfo(null)
setCommodityDetail(res.data)
initAttributeAndValueList(res.data)
getPayWayListByMemberId(res.data?.memberId)
......@@ -199,7 +203,9 @@ const CommodityDetail = (props) => {
}
} else {
message.info(res.message)
setErrorInfo(res.message)
}
setSpinLoading(false)
})
}
......@@ -856,207 +862,213 @@ const CommodityDetail = (props) => {
}
return (
<div className={styles.commodity_detail}>
<div className={styles.commodity_detail_container}>
<div className={styles.commodity_detail_info}>
<Exhibition layoutType={layoutType} shopInfo={shopInfo} priceType={commodityDetail?.priceType} imgList={commodityImgList} commodityDetail={commodityDetail} />
<div className={styles.product_info_container}>
<div className={styles.product_info}>
<div className={styles.product_info_name}>
<span>{commodityDetail?.name}</span>
{
commodityDetail?.sellingPoint && commodityDetail?.sellingPoint.length > 0 && (
<>
{
commodityDetail?.sellingPoint.map((item, index) => (
<span key={`product_info_tags_item_${index}`}>{item}{index !== commodityDetail?.sellingPoint.length - 1 ? ' ' : ''}</span>
))
}
</>
)
}
</div>
<div className={styles.product_info_tags}>
<div className={styles.product_info_tags_item} >{commodityDetail?.slogan}</div>
</div>
{
commodityDetail?.priceType === COMMODITY_TYPE.prompt && (
<div className={styles.prompt_goods_price}>
<div className={styles.prompt_goods_price_item}>
<div className={cx(styles.label, styles.price)}>价格(CNY)</div>
<Spin spinning={spinLoading}>
<div className={styles.commodity_detail}>
{
!errorInfo ? (
<div className={styles.commodity_detail_container}>
<div className={styles.commodity_detail_info}>
<Exhibition layoutType={layoutType} shopInfo={shopInfo} priceType={commodityDetail?.priceType} imgList={commodityImgList} commodityDetail={commodityDetail} />
<div className={styles.product_info_container}>
<div className={styles.product_info}>
<div className={styles.product_info_name}>
<span>{commodityDetail?.name}</span>
{
(commodityDetail?.isMemberPrice && (parameter || parameter === 0)) && <div className={cx(styles.label, styles.mprice)}>会员价格(CNY)</div>
commodityDetail?.sellingPoint && commodityDetail?.sellingPoint.length > 0 && (
<>
{
commodityDetail?.sellingPoint.map((item, index) => (
<span key={`product_info_tags_item_${index}`}>{item}{index !== commodityDetail?.sellingPoint.length - 1 ? ' ' : ''}</span>
))
}
</>
)
}
<div className={cx(styles.label, styles.count)}>数量({commodityDetail?.unitName})</div>
</div>
<div className={styles.prompt_goods_price_list}>
{
selectCommodityId ? commodityPriceInfo && commodityPriceInfo.map((item, index) => (
<div className={cx(styles.prompt_goods_price_list_item, (commodityPriceInfo.length > 1 && Number(buyCount) >= item.min && Number(buyCount) <= item.max) ? styles.active : "")} key={`prompt_goods_price_list_item_${index}`}>
<div className={styles.price}>{priceFormat(item.price)}</div>
<div className={styles.product_info_tags}>
<div className={styles.product_info_tags_item} >{commodityDetail?.slogan}</div>
</div>
{
commodityDetail?.priceType === COMMODITY_TYPE.prompt && (
<div className={styles.prompt_goods_price}>
<div className={styles.prompt_goods_price_item}>
<div className={cx(styles.label, styles.price)}>价格(CNY)</div>
{
(commodityDetail?.isMemberPrice && (parameter || parameter === 0)) && <div className={cx(styles.label, styles.mprice)}>会员价格(CNY)</div>
}
<div className={cx(styles.label, styles.count)}>数量({commodityDetail?.unitName})</div>
</div>
<div className={styles.prompt_goods_price_list}>
{
(commodityDetail?.isMemberPrice && (parameter || parameter === 0)) && <div className={styles.member_price}>{priceFormat(item.price * parameter)}</div>
selectCommodityId ? commodityPriceInfo && commodityPriceInfo.map((item, index) => (
<div className={cx(styles.prompt_goods_price_list_item, (commodityPriceInfo.length > 1 && Number(buyCount) >= item.min && Number(buyCount) <= item.max) ? styles.active : "")} key={`prompt_goods_price_list_item_${index}`}>
<div className={styles.price}>{priceFormat(item.price)}</div>
{
(commodityDetail?.isMemberPrice && (parameter || parameter === 0)) && <div className={styles.member_price}>{priceFormat(item.price * parameter)}</div>
}
<div className={styles.count}>{item.range === '0-0' ? '不限' : item.range}</div>
</div>
)) : (
<div className={cx(styles.prompt_goods_price_list_item)} >
<div className={styles.price}>{commodityDetail?.min !== commodityDetail?.max ? `${priceFormat(commodityDetail?.min)} ~ ${priceFormat(commodityDetail?.max)}` : priceFormat(commodityDetail?.min)}</div>
{
(commodityDetail?.isMemberPrice && (parameter || parameter === 0)) && <div className={styles.member_price}>{commodityDetail?.min !== commodityDetail?.max ? `${priceFormat(commodityDetail?.min * parameter)} ~ ${priceFormat(commodityDetail?.max * parameter)}` : priceFormat(commodityDetail?.min * parameter)}</div>
}
<div className={styles.count}>不限</div>
</div>
)
}
<div className={styles.count}>{item.range === '0-0' ? '不限' : item.range}</div>
</div>
)) : (
<div className={cx(styles.prompt_goods_price_list_item)} >
<div className={styles.price}>{commodityDetail?.min !== commodityDetail?.max ? `${priceFormat(commodityDetail?.min)} ~ ${priceFormat(commodityDetail?.max)}` : priceFormat(commodityDetail?.min)}</div>
</div>
)
}
{
attributeList.map(item => (
<div className={styles.product_info_line} key={`product_info_line_${item.id}`}>
<div className={styles.product_info_line_label}>{item.customerAttribute.name}</div>
<div className={styles.product_info_line_brief}>
<div className={styles.product_info_line_list}>
{
(commodityDetail?.isMemberPrice && (parameter || parameter === 0)) && <div className={styles.member_price}>{commodityDetail?.min !== commodityDetail?.max ? `${priceFormat(commodityDetail?.min * parameter)} ~ ${priceFormat(commodityDetail?.max * parameter)}` : priceFormat(commodityDetail?.min * parameter)}</div>
item.customerAttributeValueList.map((childItem, index) => (
<div
key={`product_info_line_list_item_${childItem.id}_${index}`}
className={cx(styles.product_info_line_list_item,
judgeSelectAttrInList(selectAttrVal, childItem.id, 'attrValId') ? styles.active : '',
// judgeHasAttr(item.customerAttribute.id, childItem.id) ? '' : styles.disabled
)}
onClick={() => handleSelectAttrVal(item.customerAttribute.id, childItem.id)} >
{
childItem.commodityPic && (
<div className={styles.imgbox}>
<img src={childItem.commodityPic} />
</div>
)
}
<span className={styles.attrName}>{childItem.value}</span>
</div>
))
}
<div className={styles.count}>不限</div>
</div>
)
</div>
</div>
))
}
{
commodityDetail?.priceType === COMMODITY_TYPE.integral && (
<div className={styles.product_info_line}>
<div className={styles.product_info_line_label}>
所需积分
<Tooltip placement="top" title="可使用平台通用积分或商户积分进行兑换">
<QuestionCircleOutlined />
</Tooltip>
</div>
<div className={styles.product_info_line_brief}>
<span className={styles.text}>{commodityPriceInfo && commodityPriceInfo[0]?.price}</span>
</div>
</div>
)
}
{
commodityDetail?.priceType === COMMODITY_TYPE.inquiry ? (
<div className={styles.product_info_line}>
<div className={styles.product_info_line_label}>库存数量</div>
<div className={styles.product_info_line_brief}>
<span className={styles.text}>{getAuth() ? `${numFormat(stockCount)}${commodityDetail?.unitName || ''}` : '仅会员可见'}</span>
</div>
</div>
) : (
<div className={styles.product_info_line}>
<div className={styles.product_info_line_label}>{commodityDetail?.priceType === COMMODITY_TYPE.prompt ? '购买数量' : '兑换数量'}</div>
<div className={cx(styles.product_info_line_brief, styles.row)}>
<InputNumber disabled={stockCount === 0} value={buyCount} min={commodityDetail?.priceType === COMMODITY_TYPE.prompt ? commodityDetail?.minOrder : 1} max={stockCount} onChange={(value) => setBuyCount(value)} />
<span className={cx(styles.text, styles.mar_left_10)}>{commodityDetail?.unitName}</span>
<span className={cx(styles.text, styles.mar_left_10)}>{getAuth() ? `(库存${numFormat(stockCount)}${commodityDetail?.unitName || ''})` : '(仅会员可见)'}</span>
</div>
</div>
)
}
{
commodityDetail?.priceType !== COMMODITY_TYPE.integral && (
<div className={styles.product_info_line}>
<div className={styles.product_info_line_label}>最小购买量</div>
<div className={styles.product_info_line_brief}>
<span className={styles.text}>{commodityDetail?.minOrder} {commodityDetail?.unitName}</span>
</div>
</div>
)
}
{
commodityDetail?.priceType === COMMODITY_TYPE.prompt && (
<div className={styles.product_info_price}>
<div className={styles.product_info_price_text}>{buyCount || 0}<span>{commodityDetail?.unitName}</span></div>
<div className={styles.product_info_price_split}></div>
<div className={styles.product_info_price_text}>{getAmount()}<span></span></div>
</div>
)
}
<div className={styles.product_info_btn_group}>
{
renderBtn()
}
</div>
</div>
)
}
{
attributeList.map(item => (
<div className={styles.product_info_line} key={`product_info_line_${item.id}`}>
<div className={styles.product_info_line_label}>{item.customerAttribute.name}</div>
<div className={styles.product_info_line_brief}>
<div className={styles.product_info_line_list}>
<div className={styles.product_info_line}>
<div className={styles.product_info_line_label}>支付方式</div>
<div className={styles.product_info_line_brief}>
{
item.customerAttributeValueList.map((childItem, index) => (
<div
key={`product_info_line_list_item_${childItem.id}_${index}`}
className={cx(styles.product_info_line_list_item,
judgeSelectAttrInList(selectAttrVal, childItem.id, 'attrValId') ? styles.active : '',
// judgeHasAttr(item.customerAttribute.id, childItem.id) ? '' : styles.disabled
)}
onClick={() => handleSelectAttrVal(item.customerAttribute.id, childItem.id)} >
{
childItem.commodityPic && (
<div className={styles.imgbox}>
<img src={childItem.commodityPic} />
</div>
)
}
<span className={styles.attrName}>{childItem.value}</span>
</div>
))
commodityDetail?.priceType === 3 ? <span className={styles.text}>积分支付</span> :
payWayList.map((item, index) => <span key={`pay_way_item_${index}`} className={styles.text}>{item.payVal}</span>)
}
</div>
</div>
</div>
))
}
{
commodityDetail?.priceType === COMMODITY_TYPE.integral && (
<div className={styles.product_info_line}>
<div className={styles.product_info_line_label}>
所需积分
<Tooltip placement="top" title="可使用平台通用积分或商户积分进行兑换">
<QuestionCircleOutlined />
</Tooltip>
</div>
<div className={styles.product_info_line_brief}>
<span className={styles.text}>{commodityPriceInfo && commodityPriceInfo[0]?.price}</span>
</div>
</div>
)
}
{
commodityDetail?.priceType === COMMODITY_TYPE.inquiry ? (
<div className={styles.product_info_line}>
<div className={styles.product_info_line_label}>库存数量</div>
<div className={styles.product_info_line_brief}>
<span className={styles.text}>{getAuth() ? `${numFormat(stockCount)}${commodityDetail?.unitName || ''}` : '仅会员可见'}</span>
</div>
</div>
) : (
<div className={styles.product_info_line}>
<div className={styles.product_info_line_label}>{commodityDetail?.priceType === COMMODITY_TYPE.prompt ? '购买数量' : '兑换数量'}</div>
<div className={cx(styles.product_info_line_brief, styles.row)}>
<InputNumber disabled={stockCount === 0} value={buyCount} min={commodityDetail?.priceType === COMMODITY_TYPE.prompt ? commodityDetail?.minOrder : 1} max={stockCount} onChange={(value) => setBuyCount(value)} />
<span className={cx(styles.text, styles.mar_left_10)}>{commodityDetail?.unitName}</span>
<span className={cx(styles.text, styles.mar_left_10)}>{getAuth() ? `(库存${numFormat(stockCount)}${commodityDetail?.unitName || ''})` : '(仅会员可见)'}</span>
<div className={cx(styles.product_info_line, styles.mar_top_10)}>
<div className={styles.product_info_line_label}>配送方式</div>
<div className={styles.product_info_line_brief}>
<span className={styles.text}>{Logistics_Type[commodityDetail?.logistics.deliveryType]}</span>
</div>
</div>
)
}
{
commodityDetail?.priceType !== COMMODITY_TYPE.integral && (
<div className={styles.product_info_line}>
<div className={styles.product_info_line_label}>最小购买量</div>
<div className={styles.product_info_line_brief}>
<span className={styles.text}>{commodityDetail?.minOrder} {commodityDetail?.unitName}</span>
</div>
</div>
)
}
{
commodityDetail?.priceType === COMMODITY_TYPE.prompt && (
<div className={styles.product_info_price}>
<div className={styles.product_info_price_text}>{buyCount || 0}<span>{commodityDetail?.unitName}</span></div>
<div className={styles.product_info_price_split}></div>
<div className={styles.product_info_price_text}>{getAmount()}<span></span></div>
</div>
)
}
<div className={styles.product_info_btn_group}>
{
renderBtn()
}
</div>
<BrowseRecords priceType={commodityDetail?.priceType} dataList={commonCategoryCommodityList} {...props} />
</div>
<div className={styles.product_info_line}>
<div className={styles.product_info_line_label}>支付方式</div>
<div className={styles.product_info_line_brief}>
<div className={styles.commodity_detail_body}>
<div className={styles.commodity_detail_body_left}>
{
commodityDetail?.priceType === 3 ? <span className={styles.text}>积分支付</span> :
payWayList.map((item, index) => <span key={`pay_way_item_${index}`} className={styles.text}>{item.payVal}</span>)
layoutType === LAYOUT_TYPE.shop && <ShopInfo {...props} />
}
<Interested priceType={commodityDetail?.priceType} shopInfo={shopInfo} {...props} />
</div>
</div>
<div className={cx(styles.product_info_line, styles.mar_top_10)}>
<div className={styles.product_info_line_label}>配送方式</div>
<div className={styles.product_info_line_brief}>
<span className={styles.text}>{Logistics_Type[commodityDetail?.logistics.deliveryType]}</span>
<div className={styles.commodity_detail_body_right}>
<ProductDescription commodityDetail={commodityDetail} dataList={commonCategoryCommodityList} {...props} />
</div>
</div>
</div>
</div>
<BrowseRecords priceType={commodityDetail?.priceType} dataList={commonCategoryCommodityList} {...props} />
</div>
<div className={styles.commodity_detail_body}>
<div className={styles.commodity_detail_body_left}>
{
layoutType === LAYOUT_TYPE.shop && <ShopInfo {...props} />
}
<Interested priceType={commodityDetail?.priceType} shopInfo={shopInfo} {...props} />
</div>
<div className={styles.commodity_detail_body_right}>
<ProductDescription commodityDetail={commodityDetail} dataList={commonCategoryCommodityList} {...props} />
</div>
</div>
</div>
<DialogModal
title="添加成功"
visible={addSuccessVisible}
onCancel={() => setAddSuccessVisible(false)}
>
<div className={styles.add_success}>
<div className={styles.add_success_info}>
<div className={styles.add_success_info_title}>
<i className={styles.add_success_info_icon}></i>
<span>货品已添加到进货单!</span>
</div>
<div className={styles.add_success_info_text}>
<span>当前进货单共</span>
<b>{purchaseCount}</b>
<span>种商品</span>
) : <ErrorResult errorMessage={errorInfo} />
}
<DialogModal
title="添加成功"
visible={addSuccessVisible}
onCancel={() => setAddSuccessVisible(false)}
>
<div className={styles.add_success}>
<div className={styles.add_success_info}>
<div className={styles.add_success_info_title}>
<i className={styles.add_success_info_icon}></i>
<span>货品已添加到进货单!</span>
</div>
<div className={styles.add_success_info_text}>
<span>当前进货单共</span>
<b>{purchaseCount}</b>
<span>种商品</span>
</div>
</div>
<div className={cx(styles.add_success_btn, styles.primary)} onClick={() => history.push(getPurchaseOrderLink())}>去结算</div>
<div className={styles.add_success_btn} onClick={() => setAddSuccessVisible(false)}>继续购物</div>
</div>
<div className={cx(styles.add_success_btn, styles.primary)} onClick={() => history.push(getPurchaseOrderLink())}>去结算</div>
<div className={styles.add_success_btn} onClick={() => setAddSuccessVisible(false)}>继续购物</div>
</div>
<InterestedCommodity dataList={commonCategoryCommodityList} {...props} />
</DialogModal>
</div>
<InterestedCommodity dataList={commonCategoryCommodityList} {...props} />
</DialogModal>
</div>
</Spin>
)
}
......
......@@ -30,7 +30,7 @@ const PopularShops: React.FC<PopularShopsPropsType> = (props) => {
<div className={styles.popular_shops_list}>
{
shopList && shopList.map((item, index) => index <=5 && (
<div className={styles.popular_shops_list_item}>
<div className={styles.popular_shops_list_item} key={item.memberShopId}>
<div className={styles.popular_shops_rank}>0{index+1}</div>
<div className={styles.popular_shops_logo}>
<ImageBox width={36} height={36} imgUrl={item.memberLogo} />
......
......@@ -48,7 +48,7 @@ const ShoppingNews: React.FC = () => {
</div>
<div className={styles.popular_buy_dynamic_list_item_content}>
<span className={styles.content_text}>{item.count || 0}条回应</span>
<span className={styles.content_time}>{moment(item.deliveryTime).format("MM/DD HH:mm")}</span>
<span className={styles.content_time}>{moment(item.deliveryTime || "").format("MM/DD HH:mm")}</span>
</div>
</div>
))
......
......@@ -195,6 +195,7 @@ const Order: React.FC<OrderPropsType> = (props) => {
if (orderItem.logistics?.deliveryType === 1 && orderItem.logistics?.carriageType === 2 && orderItem.logistics?.useTemplate && templateId) {
orderProductList.push({
templateId,
count: orderItem.count,
weight: orderItem.logistics?.weight,
})
}
......
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