diff --git a/src/assets/close.png b/src/assets/close.png
new file mode 100644
index 0000000..394d244
Binary files /dev/null and b/src/assets/close.png differ
diff --git a/src/components/sp-default/index.js b/src/components/sp-default/index.js
index 37cb1c3..8faffe3 100755
--- a/src/components/sp-default/index.js
+++ b/src/components/sp-default/index.js
@@ -6,7 +6,8 @@ import SpImage from './../sp-image'
import './index.scss'
const TYPES = {
- cart: 'empty_cart.png'
+ // cart: 'empty_cart.png'
+ cart: 'index/logo.png'
}
function SpDefault (props) {
@@ -21,7 +22,7 @@ function SpDefault (props) {
)}
>
- {type && }
+ {type && }
{message}
{children}
diff --git a/src/components/sp-goods-item/index.js b/src/components/sp-goods-item/index.js
index e3f86e9..08e3d4e 100755
--- a/src/components/sp-goods-item/index.js
+++ b/src/components/sp-goods-item/index.js
@@ -37,7 +37,10 @@ function SpGoodsItem (props) {
showPrice = true,
hideStore = false,
renderBrand,
- mode = 'scaleToFill'
+ mode = 'scaleToFill',
+ showSalePrice = true,
+ height = 310,
+ width = 310
} = props
const [info, setInfo] = useState(props.info || null)
const [current, setCurrent] = useState(0)
@@ -102,7 +105,7 @@ function SpGoodsItem (props) {
return (
-
+
NEW
{/* {renderBrand && {renderBrand}} */}
@@ -123,24 +126,26 @@ function SpGoodsItem (props) {
{info.brief}
{info.itemName}
-
- ¥
- {info.activityPrice || info.price}
-
- e.stopPropagation()}>
- setMove(move > 1 ? move - 1 : 0)}>
- {
- console.log(e.detail.scrollLeft / 32)
- // setMove(Math.floor(e.detail.scrollLeft / 32))
- }} scrollLeft={move * 32} scrollX scrollWithAnimation className='color-box' showScrollbar={false}>
- {(info.colors || colors).map((item, index) => (
- setCurrent(index)}>
-
-
- ))}
-
- setMove(move < (info.colors || colors).length - 2 ? move + 1 : move)}>
-
+ {showSalePrice && <>
+
+ ¥
+ {info.activityPrice || info.price}
+
+ e.stopPropagation()}>
+ setMove(move > 1 ? move - 1 : 0)}>
+ {
+ console.log(e.detail.scrollLeft / 32)
+ // setMove(Math.floor(e.detail.scrollLeft / 32))
+ }} scrollLeft={move * 32} scrollX scrollWithAnimation className='color-box' showScrollbar={false}>
+ {(info.colors || colors).map((item, index) => (
+ setCurrent(index)}>
+
+
+ ))}
+
+ setMove(move < (info.colors || colors).length - 2 ? move + 1 : move)}>
+
+ >}
{/* 促销活动标签 */}
@@ -238,7 +243,7 @@ function SpGoodsItem (props) {
)}
- {renderFooter}
+ {renderFooter && {renderFooter}}
{/* {info.brand && (
diff --git a/src/components/sp-note/index.js b/src/components/sp-note/index.js
index 883418b..5d4dc9d 100755
--- a/src/components/sp-note/index.js
+++ b/src/components/sp-note/index.js
@@ -15,7 +15,9 @@ export default class SpNote extends Component {
btnText: '',
to: '',
isUrl: true,
- img: ''
+ img: '',
+ width: 292,
+ height: 224
}
static options = {
@@ -26,18 +28,18 @@ export default class SpNote extends Component {
handleClick = () => { }
- resolveUrl(img) {
+ resolveUrl (img) {
return `/assets/imgs/${img}`
}
- render() {
- const { icon, className, title, button, value, btnText, to, isUrl, img } = this.props
+ render () {
+ const { icon, className, title, button, value, btnText, to, isUrl, img, width, height } = this.props
return (
{/* {icon && } */}
{img && (
-
+
)}
{title || this.props.children}
{button && to && (
diff --git a/src/components/sp-order-item/index.js b/src/components/sp-order-item/index.js
index c6dc3ba..d894f30 100755
--- a/src/components/sp-order-item/index.js
+++ b/src/components/sp-order-item/index.js
@@ -5,14 +5,14 @@ import { View, Text, Image } from '@tarojs/components'
import { SpPage, SpPrice, SpImage, SpPoint } from '@/components'
import './index.scss'
-function SpOrderItem(props) {
+function SpOrderItem (props) {
const {
payType = '',
showExtra = true,
info = null,
isPointitemGood = false,
isShowPointTag = false,
- onClick = () => {},
+ onClick = () => { },
customFooter,
showDesc,
renderDesc,
@@ -24,16 +24,31 @@ function SpOrderItem(props) {
const { market_price: enMarketPrice } = order_page
if (!info) return null
+ const desc = info.item_spec_desc
+ let desc_info = ''
+ if (desc) {
+ try {
+ const descArr = desc.split(',')
+ descArr.forEach((item, index) => {
+ let [_, value] = item.split(':')
+ if (index === 1) {
+ value = value.substring(0, 2)
+ }
+ desc_info += value + ' '
+ })
+ } catch (error) {
+ }
+ }
const showExtraComp = () => {
if (showExtra) {
return (
{info.goods_props}
- {info.num && 数量:{info.num}}
{info.item_spec_desc && (
- {info.item_spec_desc}
+ {desc_info || info.item_spec_desc}
)}
+ {info.num && 数量:{info.num}}
)
}
@@ -41,7 +56,7 @@ function SpOrderItem(props) {
const img = info.pic_path ? info.pic_path : Array.isArray(info.pics) ? info.pics[0] : info.pics
- console.log('order item info:', info)
+ // console.log('order item info:', info)
return (
@@ -79,7 +94,7 @@ function SpOrderItem(props) {
/>
) : (
-
+
{/* {info.market_price > 0 && enMarketPrice && (
)} */}
diff --git a/src/components/sp-order-item/index.scss b/src/components/sp-order-item/index.scss
index 41d6914..1e1a700 100755
--- a/src/components/sp-order-item/index.scss
+++ b/src/components/sp-order-item/index.scss
@@ -4,23 +4,36 @@
display: flex;
align-items: flex-start;
padding: $edge-size;
+ &__extra {
+ width: 450px;
+ font-size: 20px;
+ line-height: 1;
+ color: #000;
+ opacity: 0.85;
+ }
&__hd {
- margin-right: 20px;
+ margin-right: 60px;
}
&__bd {
- width: 50%;
- margin-bottom: 40px;
+ width: 38%;
+ // margin-bottom: 40px;
+ padding: 20px 0;
position: relative;
+ font-size: 20px;
+ line-height: 1;
+ box-sizing: border-box;
}
&__ft {
flex: 1;
text-align: right;
- font-size: $font-size-small;
+ padding-top: 10px;
+ // font-size: $font-size-small;
}
&__title {
// font-size: floor(0.95 * $font-size);
@include multi-ellipsis(1);
- line-height: 1.4;
+ margin-bottom: 26px;
+ color: #000;
// margin: 0 0 15px;
&-tag {
display: inline-block;
@@ -32,16 +45,17 @@
}
}
&__desc {
- color: $color-gray;
- font-size: $font-size-small;
+ // color: $color-gray;
+ // font-size: $font-size-small;
// margin-bottom: 10px;
}
&__spec {
- color: $color-gray;
- font-size: $font-size-small;
+ // color: $color-gray;
+ // font-size: $font-size-small;
max-width: 90%;
min-width: 100px;
display: inline-block;
+ opacity: 0.85;
@include text-overflow();
}
&__price {
@@ -52,7 +66,8 @@
}
&__num {
display: block;
- color: $color-gray;
+ margin-top: 26px;
+ // color: $color-gray;
}
&__pay-type {
display: block;
@@ -60,4 +75,8 @@
font-size: 20px;
color: #c1c1c1;
}
+ .sp-price__symbol,
+ .sp-price__int {
+ font-weight: bold !important;
+ }
}
diff --git a/src/components/sp-page/index.js b/src/components/sp-page/index.js
index 47ad69e..cc61115 100755
--- a/src/components/sp-page/index.js
+++ b/src/components/sp-page/index.js
@@ -3,7 +3,7 @@ import { useSelector, useDispatch } from 'react-redux'
import Taro, { useDidShow, usePageScroll, getCurrentInstance, useReady } from '@tarojs/taro'
import { View, Text, Image } from '@tarojs/components'
import { useImmer } from 'use-immer'
-import { SpNavBar, SpFloatMenuItem, SpNote, SpLoading, SpImage } from '@/components'
+import { SpNavBar, SpFloatMenuItem, SpNote, SpLoading, SpImage, SpChat } from '@/components'
import { TABBAR_PATH } from '@/consts'
import { classNames, styleNames, hasNavbar, isWeixin, isAlipay, isGoodsShelves, entryLaunch, isObject } from '@/utils'
import { AtBadge } from 'taro-ui'
@@ -26,6 +26,7 @@ const initialState = {
function SpPage (props, ref) {
const $instance = getCurrentInstance()
const [state, setState] = useImmer(initialState)
+ const { cartCount = 0 } = useSelector((state) => state.cart)
const { lock, lockStyle, pageTitle, isTabBarPage, customNavigation, cusCurrentPage, showLeftContainer, currentPath, showCustomNavigation, showNavCartIcon } = state
const {
className,
@@ -50,6 +51,7 @@ function SpPage (props, ref) {
showNavLogo = true,
showNavkfIcon = false,
showNavHomeIcon = false,
+ showNavSearchIcon = false,
} = props
let { renderTitle } = props
const wrapRef = useRef(null)
@@ -290,7 +292,7 @@ function SpPage (props, ref) {
/>
}
{/* */}
- {showCustomNavigation ?
+ {showCustomNavigation ? Taro.navigateTo({ url: '/pages/item/list' })} src={`member/chazhao-${isBlack ? "black" : "light"}.png`} height={34} mode='heightFix' isNew />
:
- {showNavCartIcon && Taro.redirectTo({ url: '/pages/cart/espier-index' })} height={36} mode='heightFix' isNew />}
+ {showNavCartIcon && Taro.redirectTo({ url: '/pages/cart/espier-index' })} height={36} mode='heightFix' isNew />}
{showNavHomeIcon && Taro.redirectTo({ url: '/pages/index' })} height={36} mode='heightFix' isNew />}
+ {showNavSearchIcon && Taro.navigateTo({ url: '/pages/item/list' })} src={`member/chazhao-${isBlack ? "black" : "light"}.png`} height={34} mode='heightFix' isNew />}
}
- {showNavkfIcon && Taro.redirectTo({ url: '/pages/cart/espier-index' })} height={46} mode='heightFix' isNew />}
+ {showNavkfIcon && Taro.redirectTo({ url: '/pages/cart/espier-index' })} height={46} mode='heightFix' isNew />}
}
{isWeixin &&
diff --git a/src/components/sp-page/index.scss b/src/components/sp-page/index.scss
index 70a0898..6cd4293 100755
--- a/src/components/sp-page/index.scss
+++ b/src/components/sp-page/index.scss
@@ -108,6 +108,20 @@
.icon-kf {
margin-left: 40px;
}
+ .at-badge {
+ &__num {
+ font-size: 14px;
+ width: 24px;
+ height: 24px;
+ line-height: 24px;
+ top: -6px;
+ right: 4px;
+ padding: 0;
+ border-radius: 50%;
+ overflow: hidden;
+ text-align: center;
+ }
+ }
}
.icon-wrap {
// width: 56px;
@@ -191,7 +205,7 @@
// background: #a0a0a0;
}
.title-container {
- color: #333;
+ color: #000;
}
.custom-status-bar {
background: #fff;
diff --git a/src/components/sp-price/index.js b/src/components/sp-price/index.js
index 0d40bb6..732e2e8 100755
--- a/src/components/sp-price/index.js
+++ b/src/components/sp-price/index.js
@@ -34,7 +34,8 @@ export default class SpPrice extends Component {
appendText,
lineThrough,
plus,
- size
+ size,
+ showSeparator = false
} = this.props
let _value = value
if (isString(value)) {
@@ -78,13 +79,13 @@ export default class SpPrice extends Component {
fontSize: `${size}rpx`
})}
>
- {int.indexOf('-') === 0 ? int.slice(1) : int}
+ {showSeparator ? parseInt(int).toLocaleString() : int.indexOf('-') === 0 ? int.slice(1) : int}
{decimal !== undefined && !noDecimal && (
.{decimal}
diff --git a/src/components/sp-sku-select-new/index.js b/src/components/sp-sku-select-new/index.js
index b73eb4e..21c660d 100755
--- a/src/components/sp-sku-select-new/index.js
+++ b/src/components/sp-sku-select-new/index.js
@@ -1,8 +1,8 @@
-import React, { useEffect, useRef } from 'react'
+import React, { useEffect, useImperativeHandle, useRef } from 'react'
import { useSelector, useDispatch } from 'react-redux'
import Taro from '@tarojs/taro'
import { AtButton } from 'taro-ui'
-import { View, Text } from '@tarojs/components'
+import { View, Text, ScrollView } from '@tarojs/components'
import { useImmer } from 'use-immer'
import {
SpFloatLayout,
@@ -38,7 +38,7 @@ const initialState = {
loading: false
}
-function SpSkuSelect (props) {
+function SpSkuSelect (props, ref) {
const {
info,
open = true,
@@ -47,7 +47,7 @@ function SpSkuSelect (props) {
type,
hideInputNumber = false
} = props
- console.log('SpSkuSelect:info', info)
+ // console.log('SpSkuSelect:info', info)
// const [state, setState] = useImmer(initialState)
const [state, setState] = useAsyncCallback(initialState)
const { selection, curImage, disabledSet, curItem, skuText, num, loading } = state
@@ -62,8 +62,6 @@ function SpSkuSelect (props) {
const init = () => {
const { skuList, specItems } = info
- console.log('skuList:', skuList)
- console.log('specItems:', specItems)
specItems.forEach((item) => {
const key = item.specItem.map((spec) => spec.specId).join('_')
skuDictRef.current[key] = item
@@ -104,18 +102,21 @@ function SpSkuSelect (props) {
}
}
}
- console.log(
- 'skuDict:',
- skuDictRef.current,
- 'selection:',
- selection,
- 'disabledSet:',
- disabledSet
- )
+ // console.log(
+ // 'skuDict:',
+ // skuDictRef.current,
+ // 'selection:',
+ // selection,
+ // 'disabledSet:',
+ // disabledSet
+ // )
const curItem = skuDictRef.current[selection.join('_')]
+ // const skuText = curItem
+ // ? `已选:${curItem.specItem.map((item) => `${item.skuName}:${item.specName}`).join(',')}`
+ // : '请选择规格'
const skuText = curItem
- ? `已选:${curItem.specItem.map((item) => `${item.skuName}:${item.specName}`).join(',')}`
+ ? `已选择 ${curItem.specItem.map((item, index) => `${index === 1 ? item.specName.substr(0, 2) : item.specName}`).join(' ')}码`
: '请选择规格'
setState((draft) => {
@@ -136,11 +137,11 @@ function SpSkuSelect (props) {
if (disabledSet.has(specId)) return
setState(
(draft) => {
- draft.selection[idx] = selection[idx] == specId ? null : specId
+ draft.selection[idx] = selection[idx] == specId ? specId : specId //null
draft.curImage = 1
},
- ({ selection }) => {
- calcDisabled(selection)
+ (row) => {
+ calcDisabled(row.selection)
}
)
}
@@ -175,7 +176,6 @@ function SpSkuSelect (props) {
}
const { skuList } = info
- console.log("🚀 ~ skuList:", skuList)
const addToCart = async () => {
const { nospec } = info
@@ -234,6 +234,14 @@ function SpSkuSelect (props) {
})
}
+ useImperativeHandle(ref, () => {
+ return {
+ fastBuy,
+ addToCart,
+ getImgs
+ }
+ })
+
const renderFooter = () => {
let btnTxt = ''
Object.keys(BUY_TOOL_BTNS).forEach((key) => {
@@ -362,26 +370,43 @@ function SpSkuSelect (props) {
{/* {item.skuName} */}
- {item.skuValue.map((spec, idx) => (
+ {index === 0 &&
+ {item.skuValue?.length > 0 && item.skuValue.map((spec, idx) => spec.specImgs.length > 0 && (
+
+
+
+ )
+ )}
+ }
+ {index > 0 && item.skuValue.map((spec, idx) => (
0
})}
onClick={handleSelectSku.bind(this, spec, index)}
key={`sku-values-item__${idx}`}
>
- {spec.specImgs.length > 0 && (
+ {/* {spec.specImgs.length > 0 && (
- )}
- {index !== 0 && {spec.specName}}
+ )} */}
+ {spec.specName}
))}
))}
{!hideInputNumber && renderLimitTip()}
+ {skuText}
{/* */}
@@ -392,4 +417,4 @@ SpSkuSelect.options = {
addGlobalClass: true
}
-export default SpSkuSelect
+export default React.forwardRef(SpSkuSelect)
diff --git a/src/components/sp-sku-select-new/index.scss b/src/components/sp-sku-select-new/index.scss
index 338fb9a..4e05b55 100755
--- a/src/components/sp-sku-select-new/index.scss
+++ b/src/components/sp-sku-select-new/index.scss
@@ -41,12 +41,20 @@
}
.sku-list {
+ position: relative;
padding: 0 30px;
+ margin: 0;
// margin-top: 30px;
// margin-bottom: 100px;
+ .select {
+ position: absolute;
+ top: 156px;
+ right: 100px;
+ font-size: 22px;
+ }
}
.sku-group {
- margin-bottom: 20px;
+ margin: 30px 0 0;
}
.buy-count {
margin-bottom: 20px;
@@ -70,23 +78,48 @@
.sku-values {
display: flex;
flex-wrap: wrap;
- margin-top: 20px;
+ margin-top: 0px !important;
.spec-name {
display: block;
// max-width: 260px;
// @include text-overflow();
}
+ .sku-img-box {
+ width: 100%;
+ white-space: nowrap;
+ .sku-btn {
+ display: inline-block;
+ margin: 0 20px 0 0;
+ padding: 0;
+ background: #fff;
+ height: 90rpx;
+ overflow: hidden;
+ box-sizing: border-box;
+ // border: none;
+ &:last-child {
+ margin-right: 0;
+ }
+ .sp-image {
+ margin: auto 0;
+ display: inline-block;
+ box-sizing: border-box;
+ &-img {
+ display: inline-block;
+ }
+ }
+ }
+ }
}
.sku-btn {
- padding: 0 16px;
+ padding: 16px 10px;
// height: 60px;
// line-height: 60px;
- background: #f5f5f5;
+ background: #fff;
/* prettier-ignore */
- border: 1PX solid #f5f5f5;
- border-radius: 4px;
- margin: 0 24px 24px 0;
- color: #222;
+ border: 1PX solid #fff;
+ border-radius: 8px;
+ margin: 0 20px 20px 0;
+ color: #333;
box-sizing: border-box;
&.sku-img {
padding: 0;
@@ -105,14 +138,31 @@
margin: 8px 0;
}
}
- &.active {
- background: #fff;
+ &.btn-noac {
/* prettier-ignore */
- border: 1PX solid var(--color-primary);
- color: var(--color-primary);
+ border: 1PX solid #BCBCBC;
+ color: #222;
+ }
+ &.btn-primary {
+ background: var(--color-primary);
+ color: #fff;
+ }
+ .spec-name {
+ font-size: 22px;
+ line-height: 1;
+ &.pad {
+ padding: 0 4px;
+ }
+ }
+ &.active {
+ // background: #fff;
+ /* prettier-ignore */
+ border: 1PX solid #BCBCBC;
+ // color: var(--color-primary);
}
&.disabled {
- color: #cdcdcd;
+ color: #bcbcbc;
+ opacity: 0.7;
}
}
diff --git a/src/components/sp-tabbar/index.scss b/src/components/sp-tabbar/index.scss
index a992719..de50371 100755
--- a/src/components/sp-tabbar/index.scss
+++ b/src/components/sp-tabbar/index.scss
@@ -18,4 +18,21 @@
height: 54px !important;
}
}
+ .at-tab-bar__item {
+ .at-badge {
+ &__num {
+ font-size: 16px;
+ width: 26px;
+ height: 26px;
+ line-height: 26px;
+ top: -4px;
+ right: 8px;
+ padding: 0;
+ border-radius: 50%;
+ overflow: hidden;
+ text-align: center;
+ padding-left: 2px;
+ }
+ }
+ }
}
diff --git a/src/pages/cart/comps/comp-goodsitem.js b/src/pages/cart/comps/comp-goodsitem.js
index f1d1d0a..2c6f357 100755
--- a/src/pages/cart/comps/comp-goodsitem.js
+++ b/src/pages/cart/comps/comp-goodsitem.js
@@ -10,16 +10,17 @@ import './comp-goodsitem.scss'
const initialState = {
localNum: 0
}
-function CompGoodsItem(props) {
+function CompGoodsItem (props) {
const {
info,
children,
isShowAddInput = true,
isShowDeleteIcon = true,
goodType,
- onDelete = () => {},
- onChange = () => {},
- onClickImgAndTitle = () => {}
+ onDelete = () => { },
+ onChange = () => { },
+ onClickImgAndTitle = () => { },
+ onChangeGoodsIsCheck = () => { }
} = props
const { priceSetting } = useSelector((state) => state.sys)
const { userInfo = {}, vipInfo = {} } = useSelector((state) => state.user)
@@ -46,6 +47,7 @@ function CompGoodsItem(props) {
}
const { price, activity_price, member_price, package_price } = info
+ console.log("🚀 ~ info:", info)
let _price
if (!isNaN(activity_price)) {
_price = activity_price
@@ -77,19 +79,21 @@ function CompGoodsItem(props) {
className='comp-goodsitem-image'
mode='aspectFill'
src={info.pics}
- width={180}
- height={180}
+ width={150}
+ height={150}
/>
-
+
{/* {info.activity_type == 'package' && 组合商品} */}
{info.is_plus_buy && 加价购}
{info.item_name}
{isShowDeleteIcon && (
- onDelete(info)}>
+ // onDelete(info)}>
+ onDelete(info)}>
+
)}
@@ -115,24 +119,29 @@ function CompGoodsItem(props) {
-
-
+
+ 数量:
+ {isShowAddInput ? (
+
+ ) : (
+ x {info.num}
+ )}
+
+
{info.market_price > 0 && enMarketPrice && (
)}
- {isShowAddInput ? (
-
- ) : (
- x {info.num}
- )}
+
+
+
diff --git a/src/pages/cart/comps/comp-goodsitem.scss b/src/pages/cart/comps/comp-goodsitem.scss
index ed3fc54..9df38c2 100755
--- a/src/pages/cart/comps/comp-goodsitem.scss
+++ b/src/pages/cart/comps/comp-goodsitem.scss
@@ -1,7 +1,10 @@
.comp-goodsitem {
display: flex;
+ font-size: 26px;
+ line-height: 1;
+ color: #000;
&-hd {
- margin-right: 20px;
+ margin-right: 40px;
}
&-bd {
flex: 1;
@@ -15,16 +18,49 @@
display: flex;
justify-content: space-between;
align-items: center;
+ position: relative;
+ padding-bottom: 26px;
+ font-weight: bold;
+ // @include multi-ellipsis(2)
+ .del-btn {
+ padding: 14px;
+ position: absolute;
+ right: 0px;
+ top: -28rpx;
+ .del-icon {
+ width: 22px;
+ height: 22px;
+ }
+ }
}
.item-ft {
// position: absolute;
// bottom: 0;
// left: 0;
// right: 0;
+ margin-top: 26px;
.goods-price-wrap {
display: flex;
align-items: center;
+ width: 100%;
+ justify-content: space-between;
+ .num-box {
+ font-size: 20px;
+ opacity: 0.9;
+ display: flex;
+ align-items: center;
+ .at-input-number {
+ height: 30px;
+ &__input {
+ top: -8px;
+ width: 36px;
+ }
+ &__btn {
+ width: 30px;
+ }
+ }
+ }
}
.mkt-price {
margin-left: 8px;
@@ -36,6 +72,11 @@
display: flex;
justify-content: space-between;
align-items: center;
+ margin-bottom: 26px;
+ }
+ .item-fd-hd {
+ text-align: end;
+ font-weight: bold;
}
.vip-grade {
/* prettier-ignore */
@@ -99,11 +140,11 @@
}
}
.spec-desc {
- background-color: #f5f5f5;
- font-size: 24px;
- color: #999;
- padding: 5px 13px;
- max-width: 300px;
+ font-size: 20px;
+ color: #000;
+ opacity: 0.8;
+ // padding: 5px 13px;
+ max-width: 400px;
min-width: 100px;
display: inline-block;
@include text-overflow();
diff --git a/src/pages/cart/espier-index.config.js b/src/pages/cart/espier-index.config.js
index dd6bc77..b31855c 100755
--- a/src/pages/cart/espier-index.config.js
+++ b/src/pages/cart/espier-index.config.js
@@ -1,3 +1,4 @@
export default {
- navigationBarTitleText: '购物车'
+ navigationBarTitleText: '',
+ navigationStyle: 'custom',
}
diff --git a/src/pages/cart/espier-index.js b/src/pages/cart/espier-index.js
index 55bdc32..d26eb0d 100755
--- a/src/pages/cart/espier-index.js
+++ b/src/pages/cart/espier-index.js
@@ -1,7 +1,7 @@
import Taro, { getCurrentInstance, useDidShow } from '@tarojs/taro'
import React, { useEffect, useState, useMemo } from 'react'
import { useSelector, useDispatch } from 'react-redux'
-import { View, Text } from '@tarojs/components'
+import { View, Text, ScrollView } from '@tarojs/components'
import { AtButton } from 'taro-ui'
import { useImmer } from 'use-immer'
import qs from 'qs'
@@ -18,7 +18,9 @@ import {
SpLogin,
SpDefault,
SpCheckboxNew,
- SpPrivacyModal
+ SpPrivacyModal,
+ SpImage,
+ SpGoodsItem
} from '@/components'
import CompGoodsItem from './comps/comp-goodsitem'
@@ -52,7 +54,7 @@ function CartIndex () {
const { current, recommendList, policyModal } = state
const { colorPrimary, openRecommend } = useSelector((state) => state.sys)
- const { validCart = [], invalidCart = [] } = useSelector((state) => state.cart)
+ const { validCart = [], invalidCart = [], cartCount } = useSelector((state) => state.cart)
const { tabbar = 1 } = router?.params || {}
// useDepChange(() => {
@@ -70,8 +72,8 @@ function CartIndex () {
const fetch = () => {
if (openRecommend == 1) {
- getRecommendList() // 猜你喜欢
}
+ getRecommendList() // 猜你喜欢
if (isLogin) {
getCartList()
}
@@ -164,6 +166,7 @@ function CartIndex () {
page: 1,
pageSize: 1000
})
+ console.log("🚀 ~ list:----169", list)
setState((draft) => {
draft.recommendList = list
})
@@ -254,7 +257,13 @@ function CartIndex () {
}
const groupsList = resolveActiveGroup()
- console.log(groupsList, 'list')
+
+ const handleClickStore = (item) => {
+ const url = `/subpages/store/index?id=${item.distributor_info?.distributor_id || item.goods_id}`
+ Taro.navigateTo({
+ url
+ })
+ }
return (
}
+ showNavLogo isBlack showNavkfIcon
>
- {!isLogin && (
+ {/* {!isLogin && (
授权登录后同步购物车的商品
{ }}>
授权登录
- )}
+ )} */}
{isLogin && (
{/* */}
@@ -281,8 +291,11 @@ function CartIndex () {
return (
-
- {all_item.shop_name || '自营'}
+ {/* */}
+ {/* {all_item.shop_name || '自营'} */}
+ 购物车
+ {/* 共{all_item.cart_total_num}件 */}
+ 共{cartCount}件
{/** 店铺商品开始 */}
@@ -338,6 +351,7 @@ function CartIndex () {
info={c_sitem}
onDelete={onDeleteCartGoodsItem.bind(this, c_sitem)}
onChange={onChangeCartGoodsItem.bind(this, c_sitem)}
+ onChangeGoodsIsCheck={onChangeGoodsIsCheck.bind(this, c_sitem, 'single', !c_sitem.is_checked)}
onClickImgAndTitle={onClickImgAndTitle.bind(this, c_sitem)}
/>
@@ -382,12 +396,14 @@ function CartIndex () {
label='全选'
onChange={onChangeGoodsIsCheck.bind(this, all_item, 'all')}
/>
+ {/* 共{all_item.cart_total_num}件 */}
+ 共{cartCount}件
- 合计:
-
+ {/* 合计: */}
+
{all_item.discount_fee > 0 && (
@@ -402,11 +418,10 @@ function CartIndex () {
handleCheckout(all_item)}
>
- 结算({all_item.cart_total_num})
+ 立即结算
@@ -443,13 +458,65 @@ function CartIndex () {
)}
{validCart.length == 0 && invalidCart.length == 0 && (
-
-
- 去选购
-
-
+
+ {/*
+
+ 去选购
+
+ */}
+
+ 购物车还是空的
+ 快去挑选自己喜欢的宝贝吧~
+ { }}>
+
+ 前往选购
+
+
+
+
)}
+ {false &&
+ {validCart.length == 0 && invalidCart.length == 0 ? '商品推荐' : '专属推荐'}
+
+ {[
+ {
+ brief: "副标题",
+ itemName: "测试商品1",
+ price: "1099",
+ goods_id: 6,
+ pic: 'https://espier-oss-cdn.oss-cn-shanghai.aliyuncs.com/default_project/image/1/2024/01/15/46fe6ca52277038e39ee2c026a4af3c9xHQuJ96YIcZWtjRS0HBCTzp7dzXIs2pl'
+ },
+ {
+ brief: "副标题",
+ itemName: "测试商品2",
+ price: "1099",
+ goods_id: 6,
+ pic: 'https://espier-oss-cdn.oss-cn-shanghai.aliyuncs.com/default_project/image/1/2024/01/15/801c18d59d95ea26930fefc43bf66febTQjxb65cpnCqVLaOsYmiHdkDdYqBnXVm'
+ },
+ {
+ brief: "副标题",
+ itemName: "测试商品3",
+ price: "1099",
+ goods_id: 6,
+ pic: 'https://espier-oss-cdn.oss-cn-shanghai.aliyuncs.com/default_project/image/1/2024/01/15/46fe6ca52277038e39ee2c026a4af3c90XruENsSSAhRiz0HPI3PjR8XQNVgbxHb'
+ },
+ ].map((item, idx) => (
+
+
+
+ ))}
+
+ }
+
{/* 猜你喜欢 */}
diff --git a/src/pages/cart/espier-index.scss b/src/pages/cart/espier-index.scss
index dd78b2c..dca6f3f 100755
--- a/src/pages/cart/espier-index.scss
+++ b/src/pages/cart/espier-index.scss
@@ -1,5 +1,6 @@
.page-cart-index {
&.has-tabbar {
+ // padding-bottom: calc(#{$tabbar-height} + 140px);
padding-bottom: $tabbar-height;
}
.login-header {
@@ -30,19 +31,31 @@
}
.shop-cart-item {
padding: 0 16px;
- margin-top: 40px;
+ margin-top: 10px;
/* #ifdef alipay */
margin-top: 0;
padding-top: 40px;
/* #endif */
+ margin-bottom: 36px;
&-shadow {
- box-shadow: 0px 2px 10px 0px #eae7e0;
+ // box-shadow: 0px 2px 10px 0px #eae7e0;
}
&-hd {
- font-size: 30px;
- color: #333;
+ font-size: 40px;
+ color: #000;
font-weight: bold;
- margin-bottom: 10px;
+ margin-bottom: 40px;
+ line-height: 1;
+ display: flex;
+ align-items: baseline;
+ padding-left: 6px;
+ .total {
+ font-size: 26px;
+ margin-left: 20px;
+ line-height: 1;
+ font-weight: normal;
+ // color: #999;
+ }
}
&-bd {
background: #fff;
@@ -52,15 +65,45 @@
display: flex;
justify-content: space-between;
align-items: center;
- padding: 20px;
+ padding: 26px 40px 26px 60px;
+ position: fixed;
+ bottom: calc(#{$page-ipx-footer-height} - 2px);
+ z-index: 1080;
+ left: 0;
+ right: 0;
+ border-top: 1px solid #d9d9d9;
+ border-bottom: 1px solid #d9d9d9;
+ .lf {
+ display: flex;
+ align-items: flex-end;
+ .sp-checkbox-new {
+ align-items: flex-end;
+ .icon-my {
+ font-size: 32px;
+ color: #000;
+ }
+ }
+ .total-num {
+ font-size: 26px;
+ margin-left: 20px;
+ }
+ }
.rg {
display: flex;
align-items: center;
.total-pirce {
font-size: 40px;
+ font-weight: bold;
+ .sp-price__int {
+ margin-left: 8px;
+ }
}
.btn-calc {
- margin-left: 16px;
+ margin-left: 30px;
+ height: 74px;
+ line-height: 72px;
+ padding: 0px 28px;
+ border-radius: 6px;
}
}
}
@@ -111,10 +154,21 @@
}
.cart-item-wrap {
- padding: 16px;
+ padding: 60px 36px;
display: flex;
align-items: center;
+ background: #f7f7f7;
+ margin-bottom: 10px;
+ border-radius: 6px;
+ box-sizing: border-box;
// justify-content: space-around;
+ .sp-checkbox-new {
+ .icon-my {
+ font-size: 24px;
+ margin-right: 10px;
+ color: #000;
+ }
+ }
}
.cart-item-warp-disabled {
padding: 16px;
@@ -131,16 +185,16 @@
.cart-goods-item,
.comp-goodsitem {
flex: 1;
- width: 620px;
+ width: 590px;
}
.at-input-number {
- border: 1PX solid #999;
+ border: 1px solid #999;
border-radius: 0;
height: 40px;
&__input {
/* prettier-ignore */
border-left: 1PX solid #999;
- border-right: 1PX solid #999;
+ border-right: 1px solid #999;
width: 60px;
height: 32px;
line-height: 32px;
@@ -238,4 +292,64 @@
.sp-goods-item {
border-radius: 2px;
}
+ .empty-box {
+ padding-top: 90px;
+ display: flex;
+ flex-direction: column;
+ justify-content: center;
+ align-items: center;
+ .sp-image {
+ margin-bottom: 50px;
+ }
+ .at-button {
+ border-radius: 6px;
+ line-height: 1;
+ padding: 28px 82px;
+ height: auto;
+ font-size: 26px;
+ }
+ &-tit {
+ font-size: 30px;
+ color: #000;
+ }
+ &-sub-tit {
+ font-size: 22px;
+ color: #7f7f7f;
+ margin: 20px 0 40px;
+ }
+ .gap {
+ width: 100%;
+ height: 20px;
+ background: #f5f5f5;
+ margin-top: 90px;
+ }
+ }
+ .bottom-box {
+ margin-bottom: 50px;
+ &-tit {
+ font-size: 30px;
+ color: #000;
+ padding-left: 44px;
+ padding-top: 30px;
+ font-weight: 500;
+ line-height: 1;
+ }
+ .shop-box {
+ height: 466px;
+ width: 100%;
+ padding: 30px 30px 30px;
+ box-sizing: border-box;
+ transition: height 0.2s linear 0.2s;
+ white-space: nowrap;
+ .goods-item-wrap {
+ display: inline-block;
+ width: 250px;
+ height: 100%;
+ margin-right: 30px;
+ &:last-child {
+ margin-right: 0;
+ }
+ }
+ }
+ }
}
diff --git a/src/pages/category/comps/comp-series.js b/src/pages/category/comps/comp-series.js
index acdc5c7..d1dd776 100755
--- a/src/pages/category/comps/comp-series.js
+++ b/src/pages/category/comps/comp-series.js
@@ -20,7 +20,7 @@ const CompSeries = (props) => {
const handleClickItem = (item) => {
const { category_id, main_category_id } = item
- let url = ''
+ let url = '/pages/item/list'
if (category_id) {
url = `/pages/item/list?cat_id=${category_id}`
}
@@ -62,7 +62,8 @@ const CompSeries = (props) => {
const renderCategoryChildHandler = (item = selChild) => {
return (
- false && handleCustomClick(item.category_id)}>
+ {/* handleCustomClick(item.category_id) */}
+ handleClickItem(item)}>
探索全部
diff --git a/src/pages/index.js b/src/pages/index.js
index f714079..cdecd71 100755
--- a/src/pages/index.js
+++ b/src/pages/index.js
@@ -18,7 +18,8 @@ import {
SpCouponPackage,
SpNavBar,
SpImage,
- SpGoodsItem
+ SpGoodsItem,
+ SpChat
} from '@/components'
import api from '@/api'
import {
@@ -429,7 +430,7 @@ function Home () {
))}
}
{isUpOperation &&
-
+
}
{isUpOperation &&
diff --git a/src/pages/item/comps/comp-buytoolbar.js b/src/pages/item/comps/comp-buytoolbar.js
index a0e712e..600fe83 100755
--- a/src/pages/item/comps/comp-buytoolbar.js
+++ b/src/pages/item/comps/comp-buytoolbar.js
@@ -2,7 +2,7 @@ import React, { useEffect, useState } from 'react'
import { useSelector, useDispatch } from 'react-redux'
import Taro, { getCurrentInstance } from '@tarojs/taro'
import { View, Text } from '@tarojs/components'
-import { SpImage, SpLogin } from '@/components'
+import { SpImage, SpLogin, SpChat } from '@/components'
import { classNames, navigateTo, showToast, isWeb } from '@/utils'
import { addCart } from '@/store/slices/cart'
import { BUY_TOOL_BTNS, ACTIVITY_LIST } from '@/consts'
@@ -86,11 +86,11 @@ function CompGoodsBuyToolbar (props) {
}
RenderBtns()
- console.log('btns:', btns)
+ // console.log('btns:', btns)
const onChangeLogin = async ({ key }) => {
const { dtid, card_id, user_card_id } = $instance.router.params
- console.log('onChangeLogin:', key)
+ // console.log('onChangeLogin:', key)
if (key == 'notice') {
const { subscribe } = info
if (subscribe) return false
@@ -149,7 +149,7 @@ function CompGoodsBuyToolbar (props) {
return (
-
+
{/*
diff --git a/src/pages/item/espier-detail.js b/src/pages/item/espier-detail.js
index f2e069a..84ea10b 100755
--- a/src/pages/item/espier-detail.js
+++ b/src/pages/item/espier-detail.js
@@ -8,7 +8,7 @@ import Taro, {
} from '@tarojs/taro'
import { View, Text, Swiper, SwiperItem, Video, Canvas, ScrollView } from '@tarojs/components'
import { useImmer } from 'use-immer'
-import { AtCountdown } from 'taro-ui'
+import { AtCountdown, AtAccordion, AtIcon } from 'taro-ui'
import {
SpPrice,
SpCell,
@@ -22,7 +22,8 @@ import {
SpLogin,
SpFloatMenuItem,
SpChat,
- SpGoodsPrice
+ SpGoodsPrice,
+ SpGoodsItem
} from '@/components'
import api from '@/api'
import req from '@/api/req'
@@ -94,7 +95,8 @@ const initialState = {
curItem: null,
recommendList: [],
showSaleTotal: false,
- showSku: true
+ showSku: true,
+ isOpen: false,
}
function EspierDetail (props) {
@@ -107,6 +109,7 @@ function EspierDetail (props) {
const { colorPrimary, openRecommend } = useSelector((state) => state.sys)
const { setNavigationBarTitle } = useNavigation()
const dispatch = useDispatch()
+ const skuSelectRef = useRef()
const [state, setState] = useImmer(initialState)
const {
@@ -133,7 +136,8 @@ function EspierDetail (props) {
curItem,
recommendList,
showSaleTotal,
- showSku
+ showSku,
+ isOpen
} = state
useEffect(() => {
@@ -346,6 +350,13 @@ function EspierDetail (props) {
draft.skuPanelOpen = true
draft.selectType = key
})
+ if (key === 'addcart') {
+ skuSelectRef.current?.addToCart?.()
+
+ } else if (key === 'fastbuy') {
+ skuSelectRef.current?.fastBuy?.()
+
+ }
}
const { windowWidth } = Taro.getSystemInfoSync()
@@ -358,6 +369,13 @@ function EspierDetail (props) {
}
}
+ const handleClickStore = (item) => {
+ const url = `/subpages/store/index?id=${item.distributor_info?.distributor_id || item.goods_id}`
+ Taro.navigateTo({
+ url
+ })
+ }
+
return (
*/}
{!info && }
{info && (
-
+ {
+ // console.log('e', e.detail)
+ const { scrollTop } = e.detail
+ if (scrollTop >= 640) {
+ setState((draft) => {
+ draft.isShowScroll = true
+ })
+ } else {
+ setState((draft) => {
+ draft.isShowScroll = false
+ })
+ }
+ }}>
- 宝贝详情
+
+
+ {info?.itemName}
+
+
{isArray(info.intro) ? (
@@ -676,10 +717,81 @@ function EspierDetail (props) {
))}
) : (
-
+ <>
+ {/* */}
+ >
)}
+ {[{ open: false }, { open: false }, {}, {}, {}, {}, {}, {}].map((item, index) =>
+ {
+ setState((draft) => {
+ draft.isOpen = !draft.isOpen
+ })
+ }}
+ title={'标题' + (index + 1)}
+ >
+ 内容一
+ 内容二
+ 内容三
+ 内容三
+ 内容三
+ 内容三
+ {/* */}
+
+ {
+ setState((draft) => {
+ draft.isOpen = !draft.isOpen
+ })
+ }}>
+ {isOpen ? :
+ }
+ {isOpen ? <>> : }
+
+ )}
+
+ 浏览历史
+
+ {[
+ {
+ brief: "副标题",
+ itemName: "测试商品1",
+ price: "1099",
+ goods_id: 6,
+ pic: 'https://espier-oss-cdn.oss-cn-shanghai.aliyuncs.com/default_project/image/1/2024/01/15/46fe6ca52277038e39ee2c026a4af3c9xHQuJ96YIcZWtjRS0HBCTzp7dzXIs2pl'
+ },
+ {
+ brief: "副标题",
+ itemName: "测试商品2",
+ price: "1099",
+ goods_id: 6,
+ pic: 'https://espier-oss-cdn.oss-cn-shanghai.aliyuncs.com/default_project/image/1/2024/01/15/801c18d59d95ea26930fefc43bf66febTQjxb65cpnCqVLaOsYmiHdkDdYqBnXVm'
+ },
+ {
+ brief: "副标题",
+ itemName: "测试商品3",
+ price: "1099",
+ goods_id: 6,
+ pic: 'https://espier-oss-cdn.oss-cn-shanghai.aliyuncs.com/default_project/image/1/2024/01/15/46fe6ca52277038e39ee2c026a4af3c90XruENsSSAhRiz0HPI3PjR8XQNVgbxHb'
+ },
+ ].map((item, idx) => (
+
+
+
+ ))}
+
+
-
+
)}
diff --git a/src/pages/item/espier-detail.scss b/src/pages/item/espier-detail.scss
index 8c91d67..c89fc1f 100755
--- a/src/pages/item/espier-detail.scss
+++ b/src/pages/item/espier-detail.scss
@@ -71,8 +71,9 @@
opacity: 0.5;
}
.goods-contents {
+ height: calc(100vh - #{$page-ipx-footer-height} - var(--nav-height));
.goods-info {
- margin: 24px 30px;
+ margin: 20px 30px 10px;
background-color: #fff;
// padding: 20px 16px;
// box-shadow: 0px 2px 10px 0px #eae7e0;
@@ -86,16 +87,65 @@
color: #999;
}
}
- .goods-desc {
- margin: 24px 16px;
- background-color: #fff;
- box-shadow: 0px 2px 10px 0px #eae7e0;
- .desc-hd {
- height: 80px;
- text-align: center;
- line-height: 80px;
+ .good-sku {
+ margin: 40px 30px;
+ box-sizing: border-box;
+ .sku-img {
+ white-space: nowrap;
+ width: 100%;
+ &-item {
+ width: 130px;
+ margin-right: 20px;
+ display: inline-block;
+ &:last-child {
+ margin-right: 0;
+ }
+ .sp-image {
+ width: 100%;
+ height: 100%;
+ }
+ }
}
- .desc-title {
+ }
+ .goods-desc {
+ background-color: #fff;
+ // padding: 0 30px;
+ // box-shadow: 0px 2px 10px 0px #eae7e0;
+ height: calc(100vh - #{$page-ipx-footer-height} - var(--nav-height));
+ // padding-bottom: calc(#{$page-ipx-footer-height} + 30px);
+ box-sizing: border-box;
+ position: relative;
+ overflow-y: scroll;
+ &::-webkit-scrollbar {
+ width: 0px;
+ height: 0px;
+ }
+ .desc-hd {
+ height: 160px;
+ padding: 20px 30px 0;
+ display: flex;
+ align-items: center;
+ border-bottom: 1px solid #9e9e9e80;
+ position: sticky;
+ z-index: 2;
+ top: -1px;
+ left: 0;
+ right: 0;
+ width: 100%;
+ background-color: #fff;
+ .desc-title {
+ font-size: 26px;
+ height: 160px;
+ display: flex;
+ align-items: flex-start;
+ justify-content: space-between;
+ flex-direction: column;
+ flex: 1;
+ padding: 24px 50px;
+ box-sizing: border-box;
+ }
+ }
+ .desc-title-no {
color: #222;
position: relative;
&:before {
@@ -119,6 +169,80 @@
right: -24px;
}
}
+ .sp-accordion {
+ position: relative;
+ // padding: ;
+ .at-accordion__header {
+ padding: 26px 40px;
+ color: #000;
+ &::after {
+ border: none;
+ // border-bottom: 1px solid #9e9e9e80;
+ }
+ .at-accordion__info__title {
+ font-size: 26px;
+ }
+ .at-accordion__arrow {
+ display: none;
+ }
+ }
+ .at-accordion__content {
+ &::after {
+ border: none;
+ // border-bottom: 1px solid #9e9e9e80;
+ }
+ }
+ .at-accordion__body {
+ padding: 0 40px;
+ padding-bottom: 30px;
+ }
+ .at-icon {
+ position: absolute;
+ z-index: 0;
+ right: 40px;
+ top: 48px;
+ transform: translateY(-50%);
+ transition: all 0.2s ease-in-out;
+ }
+ .line {
+ display: block;
+ position: absolute;
+ width: 100%;
+ height: 1px;
+ background: #9e9e9e80;
+ top: 90px;
+ right: 0;
+ left: 0;
+ transition: all 0.2s ease-in-out;
+ }
+ }
+ .bottom-box {
+ border-top: 1px solid #9e9e9e80;
+ &-tit {
+ font-size: 30px;
+ color: #000;
+ padding-left: 44px;
+ padding-top: 50px;
+ font-weight: 500;
+ }
+ }
+ .shop-box {
+ height: 466px;
+ width: 100%;
+ padding: 30px 50px 40px;
+ box-sizing: border-box;
+ transition: height 0.2s linear 0.2s;
+ white-space: nowrap;
+ .goods-item-wrap {
+ display: inline-block;
+ width: 250px;
+ height: 100%;
+ margin-right: 30px;
+ &:last-child {
+ margin-right: 0;
+ }
+ }
+ }
}
}
.goods-name {
diff --git a/src/pages/item/list.config.js b/src/pages/item/list.config.js
index fc82040..6915110 100755
--- a/src/pages/item/list.config.js
+++ b/src/pages/item/list.config.js
@@ -1,3 +1,3 @@
export default {
- navigationBarTitleText: '搜索结果'
+ navigationBarTitleText: '搜索列表'
}
diff --git a/src/pages/item/list.js b/src/pages/item/list.js
index 72a60b5..9cfa78a 100755
--- a/src/pages/item/list.js
+++ b/src/pages/item/list.js
@@ -347,6 +347,7 @@ function ItemList () {
{
@@ -73,7 +73,7 @@ export default class DetailItem extends Component {
info
})
}
- handleQuantityChange(item, val) {
+ handleQuantityChange (item, val) {
//改变售后商品的数量
const { info } = this.props
info.orders.map((v) => {
@@ -84,16 +84,16 @@ export default class DetailItem extends Component {
})
}
- render() {
+ render () {
const { customFooter, info, isPointitem, showType } = this.props
return (
+ 商品信息
{info &&
info[showType] &&
info[showType].map((item, idx) => (
- 第{idx + 1}件商品
{info.delivery_code ? null : item.delivery_code ? (
物流单号:{item.delivery_code}
@@ -112,7 +112,7 @@ export default class DetailItem extends Component {
isShowNational
isPointitemGood={isPointitem}
onClick={() => {
- if(info.order_class == 'pointsmall') {
+ if (info.order_class == 'pointsmall') {
Taro.navigateTo({
url: `/subpages/pointshop/espier-detail?id=${item.good_id}`
})
@@ -131,16 +131,16 @@ export default class DetailItem extends Component {
(info.delivery_code
? null
: item.delivery_code && (
-
- 查看物流
-
- ))}
+
+ 查看物流
+
+ ))}
{item.show_aftersales === 1 && (
{},
- onClick: () => {}
+ onClickBtn: () => { },
+ onClick: () => { }
}
static options = {
addGlobalClass: true
}
- handleClickBtn(type) {
+ handleClickBtn (type) {
const { info } = this.props
this.props.onClickBtn && this.props.onClickBtn(type, info)
}
- computeTotalPrice() {
+ computeTotalPrice () {
let total
const {
- info: { point, order_class, freight_fee, freight_type, total_fee, payment, receipt_type },
+ info: { totalItems, point, order_class, freight_fee, freight_type, total_fee, payment, receipt_type },
payType,
pointName
} = this.props
-
+ const [int, decimal] = String(payment || '').split('.')
if (order_class === 'pointsmall') {
if (freight_type === 'point' || (freight_type === 'cash' && freight_fee == 0)) {
- total = `合计:${point} ${pointName}`
+ total = `总计:${point} ${pointName}`
} else if (freight_type === 'cash' && freight_fee != 0) {
- total = `合计:${point} ${pointName} + ¥${formatPriceToHundred(freight_fee)}`
+ total = `总计:${point} ${pointName} + ¥${formatPriceToHundred(freight_fee)}`
}
} else {
if (payType === 'dhpoint') {
- total = `合计:${total_fee}${pointName}`
+ total = `总计:${total_fee}${pointName}`
} else {
- total = `合计:¥${payment}`
+ total = `总计:¥ ${parseInt(int).toLocaleString() + (decimal ? '.' + decimal : '')}`
}
}
return (
-
+
{receipt_type === 'dada' && (
达达同城配送
)}
- {total}
+ 共{totalItems}件商品
+ {/* {total} */}
+ 总计:
+ {`¥ ${parseInt(int).toLocaleString() + (decimal ? '.' + decimal : '')}`}
)
}
- render() {
+ render () {
const {
customFooter,
onClick,
@@ -95,7 +98,7 @@ export default class TradeItem extends Component {
)}
订单编号:{info.tid}
- 下单时间:{info.create_date}
+ 订单时间:{info.create_date}
{info &&
@@ -118,9 +121,9 @@ export default class TradeItem extends Component {
{info.status_desc}
{(info.order_status_des === 'PAYED' || info.order_status_des === 'NOTPAY') &&
- !info.is_logistics &&
- info.can_apply_cancel != 0 &&
- (info.receipt_type !== 'dada' || (info.dada && info.dada.dada_status === 0)) ? (
+ !info.is_logistics &&
+ info.can_apply_cancel != 0 &&
+ (info.receipt_type !== 'dada' || (info.dada && info.dada.dada_status === 0)) ? (
@@ -145,9 +148,9 @@ export default class TradeItem extends Component {
{info.status_desc}
{(info.order_status_des === 'PAYED' || info.order_status_des === 'NOTPAY') &&
- info.can_apply_cancel != 0 &&
- !info.is_logistics &&
- (info.receipt_type !== 'dada' || (info.dada && info.dada.dada_status === 0)) ? (
+ info.can_apply_cancel != 0 &&
+ !info.is_logistics &&
+ (info.receipt_type !== 'dada' || (info.dada && info.dada.dada_status === 0)) ? (
- )}
+ )} */}
- {info.remark && (
+ {/* {info.remark && (
订单备注
{info.remark}
- )}
-
+ )} */}
+ {false &&
下单时间
{info.created_time_str}
@@ -1085,7 +1149,7 @@ export default class TradeDetail extends Component {
)}
-
+ }
{cancelData.cancel_id && (
取消理由:
@@ -1149,7 +1213,7 @@ export default class TradeDetail extends Component {
? 'trade-detail__footer_allWidthBtn'
: ''
}`}
- style={`background: ${colors.data[0].primary}; border-color: ${colors.data[0].primary};`}
+ // style={`background: ${colors.data[0].primary}; border-color: ${colors.data[0].primary};`}
onClick={this.handleClickBtn.bind(this, 'home')}
>
继续购物
@@ -1217,7 +1281,7 @@ export default class TradeDetail extends Component {
)}
-
+
)
}
}
diff --git a/src/subpage/pages/trade/detail.scss b/src/subpage/pages/trade/detail.scss
index 8c5a993..a62a1c9 100755
--- a/src/subpage/pages/trade/detail.scss
+++ b/src/subpage/pages/trade/detail.scss
@@ -3,7 +3,7 @@ $paddingBottom: 100px;
.page-trade-detail {
box-sizing: border-box;
- height: 100vh;
+ height: 100%;
overflow: hidden;
&.paddingBottom {
padding-bottom: $paddingBottom;
@@ -26,12 +26,12 @@ $paddingBottom: 100px;
}
.scroll-view {
- @include page-scroll(0, $tabbar-height);
+ @include page-scroll(var(--nav-height), 140px);
}
&.has-navbar {
.scroll-view {
- top: $navigate-height;
+ // top: $navigate-height;
}
}
@@ -234,7 +234,7 @@ $paddingBottom: 100px;
display: flex;
justify-content: flex-start;
font-size: 28px;
- color: #666;
+ color: #5b5b5b;
align-items: center;
margin-top: 24px;
.receiverName {
@@ -245,23 +245,73 @@ $paddingBottom: 100px;
font-size: 32px;
color: #333;
font-weight: bold;
+ line-height: 1.2;
}
}
.trade-detail-goods {
- margin: 0 20px;
- padding-top: 16px;
+ margin: 14px 22px 0;
+ // padding-top: 16px;
+ padding: 40px 30px 40px 20px;
min-height: 100px;
- background: #fff;
- border-radius: 6px 6px 0 0;
+ background: #f7f7f7;
+ border-radius: 6px;
+ position: relative;
.line {
display: flex;
- padding: 20px;
- font-size: 24px;
+ // padding: 20px;;
+ font-size: 20px;
color: #333;
- .fuzhi {
- margin-left: 20px;
- color: #28a1ff;
+ .right {
+ margin-left: 4px;
+ font-size: 20px;
}
+ .left {
+ font-size: 20px;
+ }
+ .fuzhi {
+ margin-left: 30px;
+ // color: #28a1ff;
+ line-height: 1;
+ border-bottom: 1px solid #101010;
+ }
+ }
+ .order_status_msg {
+ font-size: 26px;
+ color: #000;
+ position: absolute;
+ top: 36px;
+ right: 30px;
+ }
+ .address-txt {
+ font-size: 26px;
+ margin-top: 56px;
+ color: #000;
+ line-height: 1;
+ display: flex;
+ align-items: center;
+ justify-content: space-between;
+ .right {
+ font-size: 20px;
+ color: #000;
+ border-bottom: 1px solid #000;
+ }
+ }
+ .user-info-trade {
+ display: flex;
+ justify-content: flex-start;
+ font-size: 20px;
+ color: #5b5b5b80;
+ align-items: center;
+ line-height: 1;
+ .receiverName {
+ margin-right: 20px;
+ font-size: inherit;
+ }
+ }
+ .address-detail {
+ font-size: 20px;
+ // line-height: 1;
+ color: #5b5b5b80;
}
}
.order-item__pay-type {
@@ -273,7 +323,7 @@ $paddingBottom: 100px;
padding: 10px 38px;
margin: 0 20px 20px 20px;
font-size: 26px;
- color: #5b5b5b;
+ color: #5b5b5b80;
background: #fff;
border-radius: 0 0 6px 6px;
&__num {
@@ -355,29 +405,80 @@ $paddingBottom: 100px;
background: #fff;
}
}
+ .trade-detail-box {
+ background: #f7f7f7;
+ border-radius: 6px;
+ margin: 10px 22px;
+ .gap {
+ padding: 0 54px;
+ width: calc(100% - 108px);
+ box-sizing: border-box;
+ height: 2px;
+ background: #fff;
+ margin: 20px auto;
+ }
+ .trade-detail-info-new {
+ padding: 20px 24px;
+ .line {
+ display: flex;
+ width: 100%;
+ justify-content: space-between;
+ align-items: center;
+ margin-bottom: 18px;
+ .left,
+ .right {
+ font-size: 20px;
+ color: #5b5b5b80;
+ line-height: 1;
+ }
+ }
+ }
+ .trade-detail-info-bottom {
+ display: flex;
+ align-items: center;
+ justify-content: space-between;
+ padding: 20px 22px 50px;
+ .left {
+ font-size: 26px;
+ }
+ .right {
+ font-size: 32px;
+ }
+ .left,
+ .sp-price__symbol,
+ .sp-price__int {
+ font-weight: bold;
+ }
+ }
+ }
.trade-detail__footer {
position: fixed;
left: 0;
width: 100%;
height: 100px;
- bottom: 0;
+ bottom: $edge-margin;
background: #fff;
display: flex;
justify-content: space-evenly;
align-items: center;
&__btn {
width: 338px;
- height: 84px;
+ height: 80px;
flex-shrink: 0;
- line-height: 84px;
+ line-height: 80px;
text-align: center;
- border-radius: 40px;
- color: #333;
- border: 2px solid #bbb;
+ border-radius: 6px;
+ color: #000;
+ border: 2px solid #000;
overflow: hidden;
- font-size: 26px;
+ font-size: 34px;
+ // font-weight: bold;
flex: 1;
- margin: 0 20rpx;
+ margin: 30px 50rpx;
+ margin-bottom: 80px;
+ box-sizing: border-box;
+ background: #fff;
+
&.left {
margin-left: 7%;
width: 396px;
@@ -399,7 +500,7 @@ $paddingBottom: 100px;
}
}
&_active {
- color: #ffffff;
+ // color: #ffffff;
}
&_allWidthBtn {
// width: 100%;
@@ -542,7 +643,8 @@ $paddingBottom: 100px;
.detail-item {
padding: 0;
.detail-item__title {
- padding: 10px 0;
+ padding: 30px 22px 0px;
+ color: #000;
}
.order-item__bd {
margin-bottom: 0;
diff --git a/src/subpage/pages/trade/list.js b/src/subpage/pages/trade/list.js
index d176591..e3fb789 100755
--- a/src/subpage/pages/trade/list.js
+++ b/src/subpage/pages/trade/list.js
@@ -35,8 +35,9 @@ export default class TradeList extends Component {
...this.state,
curTabIdx: 0,
tabList: [
- { title: '全部订单', status: '0' },
- { title: '待支付', status: '5' },
+ { title: '全部', status: '0' },
+ { title: '待付款', status: '5' },
+ { title: '待发货', status: '6' },
{ title: '待收货', status: '1' }
],
// 是否显示待评价
@@ -52,6 +53,7 @@ export default class TradeList extends Component {
const _tabList = JSON.parse(JSON.stringify(this.state.tabList))
if (evaluate == 1) {
_tabList.push({ title: '待评价', status: '7', is_rate: 0 })
+ _tabList.push({ title: '售后', status: '---', is_rate: 0 })
}
const tabIdx = _tabList.findIndex((tab) => tab.status === status)
if (tabIdx >= 0) {
@@ -312,6 +314,7 @@ export default class TradeList extends Component {
className={classNames('page-trade-list', {
'has-navbar': true || isNavbar()
})}
+ showNavSearchIcon
>
正在加载...}
{!page.isLoading && !page.hasNext && !list.length && (
-
- 您还没有商城订单呦~
+
+ 您的{curTabIdx != '0' ? tabList[curTabIdx].title : ''}订单为空
)}
{!!curItemActionsId && }
diff --git a/src/subpage/pages/trade/list.scss b/src/subpage/pages/trade/list.scss
index b6a145b..f253850 100755
--- a/src/subpage/pages/trade/list.scss
+++ b/src/subpage/pages/trade/list.scss
@@ -39,10 +39,12 @@
&__item {
// height: $tabs-height;
color: $color-brand-accent-light;
+ font-size: 26px;
+ padding: 24px 10px;
}
&__item-underline {
- width: 40%;
- left: 30%;
+ width: 70%;
+ left: 15%;
background: $color-brand-primary;
}
&__item--active {
@@ -60,7 +62,8 @@
// $tabs-height + 30px,
// $edge-margin
// );
- @include page-scroll($tabs-height + $navigate-height + 30px, $edge-margin);
+ // @include page-scroll($tabs-height + $navigate-height + 30px, $edge-margin);
+ @include page-scroll(calc(var(--nav-height) + 110px), $edge-margin);
/* #ifdef h5 */
@include page-scroll($navigate-height-h5 + $tabs-height + 30px, $edge-margin);
/* #endif */
@@ -68,6 +71,17 @@
&.with-tabs-wx {
@include page-scroll($navigate-height-h5, $edge-margin);
}
+ .sp-note {
+ .sp-image {
+ margin-top: 400px;
+ }
+ &__text {
+ margin-top: 24px;
+ font-weight: bold;
+ font-size: 40px;
+ color: #000;
+ }
+ }
}
.trade-cont {
.more {
@@ -83,15 +97,17 @@
position: relative;
.btn-action {
width: auto;
- margin-left: 20px;
- padding: 0 22px;
- height: 42px;
- line-height: 42px;
- border-radius: 8px;
- font-size: $font-size-small;
+ margin-left: 10px;
+ padding: 15px 20px;
+ // height: 42px;
+ line-height: 22px;
+ border-radius: 6px;
+ font-size: 20px;
color: #fff;
background: #fff;
margin-top: 0px;
+ box-sizing: border-box;
+ box-shadow: 0 0 0 1px #000000 !important;
&::after {
background: none;
border: none;
diff --git a/src/subpages/member/index.js b/src/subpages/member/index.js
index b411049..f4bc09a 100755
--- a/src/subpages/member/index.js
+++ b/src/subpages/member/index.js
@@ -583,7 +583,7 @@ function MemberIndex (props) {
@@ -611,7 +611,7 @@ function MemberIndex (props) {
@@ -625,7 +625,8 @@ function MemberIndex (props) {
diff --git a/src/subpages/member/index.scss b/src/subpages/member/index.scss
index db8aa05..547709f 100755
--- a/src/subpages/member/index.scss
+++ b/src/subpages/member/index.scss
@@ -217,7 +217,8 @@
.order-bradge {
position: absolute;
top: -6px;
- right: 45px;
+ // right: 45px;
+ right: -16px;
font-size: 20px;
display: block;
border: 3px solid #fff;