wwl
/
bk-shop
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

update

main
王文龙 2024-02-06 18:13:35 +08:00
parent 6ae387165b
commit 7dee2fac1f
19 changed files with 354 additions and 176 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
src/api/member.js
View File

@ -68,7 +68,7 @@ export function homeCouponGet (params = {}) {
export function getCardDetail (params = {}) {
// return req.get('/user/getCardDetail', params)
return req.get('/user/receiveCardByPoint', params) //积分换优惠券操作
return req.post('/user/receiveCardByPoint', params) //积分换优惠券操作
}
export function userUsedCard (params = {}) {

4
src/components/sp-coupon/index.js
View File

@ -41,6 +41,7 @@ function SpCoupon (props) {
status,
valid,
} = info
console.log("🚀 ~ info:", info)
const { tag, invalidBg, bg } = COUPON_TYPE[cardType]
const couponTagBg = info.tagClass === 'used' || info.tagClass === 'overdue' || !info.valid ? invalidBg : bg
@ -60,7 +61,8 @@ function SpCoupon (props) {
{isNew ? <View className="coupons-list-item-desc">有效日期：领取{fixedTerm}天内有效</View> :
<View className="coupons-list-item-desc">有效日期：{beginDate}至{endDate}</View>}
</View>
{!valid || info.tagClass === 'used' || info.tagClass === 'overdue' ? <View className="coupons-list-item-btn">已{info.tagClass === 'used' ? '使用' : '过期'}</View>
{/* !valid || */}
{info.tagClass === 'used' || info.tagClass === 'overdue' ? <View className="coupons-list-item-btn">已{info.tagClass === 'used' ? '使用' : '过期'}</View>
: <View className="coupons-list-item-btn" onClick={onClick}>立即{isNew ? '兑换' : '使用'}</View>}
</View>
</View>)

2
src/components/sp-filter-bar-new/index.js
View File

@ -31,7 +31,7 @@ export default class SpFilterBar extends Component {
curIdx: current,
sortOrder: 1,
value: '0',
sortVal: '0',
sortVal: 0,
showFilter: false
}
}

46
src/components/sp-picker/picker-select.js
View File

@ -1,4 +1,4 @@
import React, { useEffect } from 'react'
import React, { useEffect, useState } from 'react'
import { useImmer } from 'use-immer'
import { useSelector } from 'react-redux'
import { useAsyncCallback } from '@/hooks'
@ -8,7 +8,7 @@ import './picker-select.scss'
const initialState = {
source: [],
value: '0',
value: 0,
markMultiDateTime: false
}
function PickerDateTime (props) {
@ -19,33 +19,18 @@ function PickerDateTime (props) {
{ mode: 'day', unit: '日' },
]
// const [state, setState] = useAsyncCallback({ source: props.list || [], value: props.value || '' })
const [state, setState] = useImmer({ source: list, value: props.value })
const { source, value } = state
// useEffect(() => {
// // const { dateTime, start } = this.props
// // 推荐 上架时间 价格低-高 价格高一低
// setState((draft) => {
// draft.source = [
// { text: '推荐', val: '0' },
// { text: '上架时间', val: '3' },
// { text: '价格低-高', val: '1' },
// { text: '价格高-低', val: '2' },
// ]
// })
// }, [])
// const [state, setState] = useImmer({ value: [props.value || 0] })
// const { source, value } = state
const [value, setState] = useState(props.value || [0])
const onChange = (e, index) => {
const onChange = (e) => {
// const _value = [...value]
// _value[index] = e.detail.value
// console.log(value, e.detail.value)
// const { source, value } = state
// source.item[]
setState(
(draft) => {
draft.value = e.detail.value
},
e.detail.value
// ({ source, value }) => {
// const res = []
// for (let i = 0; i < source.length; i++) {
@ -69,27 +54,26 @@ function PickerDateTime (props) {
// }
)
}
console.log(value)
const handleClick = () => {
onPickerCancel()
handleConfirm(list[value[0]], value[0])
}
return (
<View className='picker-custom'>
<PickerView
indicator-style='height: 40px;'
value={value}
onChange={(e) => onChange(e)}
immediateChange
// 使用acc.concat将多维数组打平成一维数组再求数组长度
>
<PickerViewColumn>
{source.map((item, elementIndex) => (
<View key={elementIndex} >{item.text}</View>
{list.map((item, elementIndex) => (
<View key={'list' + elementIndex} >{item.text}</View>
))}
</PickerViewColumn>
</PickerView>
<View className="picker-btn" onClick={() => {
onPickerCancel()
setTimeout(() => {
handleConfirm(source[value[0]], value[0])
}, 100)
}}>确定</View>
<View className="picker-btn" onClick={handleClick}>确定</View>
</View>
)
}

10
src/components/sp-sku-select-new/index.js
View File

@ -48,7 +48,7 @@ function SpSkuSelect (props, ref) {
hideInputNumber = false,
onChangeImg
} = 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
@ -63,6 +63,7 @@ function SpSkuSelect (props, ref) {
const init = () => {
const { skuList, specItems } = info
console.log("🚀 ~ skuList:", skuList)
specItems.forEach((item) => {
const key = item.specItem.map((spec) => spec.specId).join('_')
skuDictRef.current[key] = item
@ -78,11 +79,12 @@ function SpSkuSelect (props, ref) {
}
const calcDisabled = (selection, i = 0) => {
const { skuList } = info
const disabledSet = new Set()
const makeReg = (sel, row, val) => {
const tSel = sel.slice()
const regStr = tSel.map((s, idx) => (row === idx ? val : !s ? '(\\d+)' : s)).join('_')
// console.log('regStr:', regStr)
console.log('regStr:', regStr)
return new RegExp(regStr)
}
@ -178,7 +180,7 @@ function SpSkuSelect (props, ref) {
return null
}
const { skuList } = info
// const { skuList } = info
const addToCart = async () => {
const { nospec } = info
@ -370,7 +372,7 @@ function SpSkuSelect (props, ref) {
</View>
</View>}
<View className='sku-list'>
{skuList.map((item, index) => (
{info.skuList.map((item, index) => (
<View className='sku-group' key={`sku-group__${index}`}>
{/* <View className='sku-name'>{item.skuName}</View> */}
<View className='sku-values'>

17
src/doc/coupon.js
View File

@ -31,13 +31,18 @@ export const COUPON_ITEM = {
}
},
couponStatus: ({ quantity, get_limit, user_get_num, get_num }) => {
if (quantity - get_num <= 0) {
return 0 // 已领完
} else if (get_limit - user_get_num > 0) {
return 1 // 立即领取
} else if (get_limit - user_get_num <= 0) {
return 2 // 已领取
if (typeof valid === 'undefined') {
return 1
} else {
return valid
}
// if (quantity - get_num <= 0) {
// return 0 // 已领完
// } else if (get_limit - user_get_num > 0) {
// return 1 // 立即领取
// } else if (get_limit - user_get_num <= 0) {
// return 2 // 已领取
// }
},
// fixedTerm: 'fixed_term',
fixedTerm: ({ begin_date, end_date }) => diffInDays(begin_date, end_date),

32
src/doc/trade.js
View File

@ -36,7 +36,25 @@ export const TRADE_ITEM = {
refundNum: 1,
itemSpecDesc: 'item_spec_desc',
point: 'point',
checked: () => false
checked: () => false,
descInfo: ({ item_spec_desc }) => {
const desc = 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) {
}
return desc_info
}
}
})
},
point: 'point',
@ -44,7 +62,7 @@ export const TRADE_ITEM = {
totalFee: ({ total_fee }) => total_fee / 100,
marketFee: ({ market_fee }) => market_fee / 100,
itemFee: ({ item_fee_new }) => item_fee_new / 100,
freightFee: ({ freight_fee }) => freight_fee / 100
freightFee: ({ freight_fee }) => freight_fee / 100,
}
export const SHOP_INFO = {
@ -69,11 +87,11 @@ export const TRADE_AFTER_SALES_ITEM = {
})
},
hasAftersalesAddress: ({ aftersales_address }) => isObject(aftersales_address),
afterSalesName: ({ aftersales_address }) => aftersales_address.aftersales_name,
afterSalesMobile: ({ aftersales_address }) => aftersales_address.aftersales_mobile,
afterSalesAddress: ({ aftersales_address }) => aftersales_address.aftersales_address,
afterSalesContact: ({ aftersales_address }) => aftersales_address.aftersales_contact,
aftersalesHours: ({ aftersales_address }) => aftersales_address.aftersales_hours,
afterSalesName: ({ aftersales_address }) => aftersales_address.aftersales_name,
afterSalesMobile: ({ aftersales_address }) => aftersales_address.aftersales_mobile,
afterSalesAddress: ({ aftersales_address }) => aftersales_address.aftersales_address,
afterSalesContact: ({ aftersales_address }) => aftersales_address.aftersales_contact,
aftersalesHours: ({ aftersales_address }) => aftersales_address.aftersales_hours,
refundFee: ({ refund_fee }) => refund_fee / 100,
refundPoint: 'refund_point',
reason: 'reason',

4
src/pages/cart/espier-checkout.js
View File

@ -910,8 +910,8 @@ function CartCheckout (props) {
<View className='left'>运费</View>
<View className='right'>
{totalInfo.freight_type !== 'point'
? `¥ ${totalInfo.freight_fee}`
: `${totalInfo.freight_fee * 100}${this.props.pointName}`}
? `¥ ${+totalInfo.freight_fee / 100}`
: `${totalInfo.freight_fee}${this.props.pointName}`}
</View>
</View>
</View>

22
src/pages/item/espier-detail.js
View File

@ -66,7 +66,7 @@ import { WgtFilm, WgtSlider, WgtWriting, WgtGoods, WgtHeading, WgtHeadline } fro
import './espier-detail.scss'
const MSpSkuSelect = React.memo(SpSkuSelectNew)
const MSpSkuSelect = SpSkuSelectNew
const initialState = {
id: null,
@ -256,15 +256,15 @@ function EspierDetail (props) {
draft.defaultMsg = '商品已下架'
})
}
if (selColorIdx != 0) {
const spec_values = data.itemSpecDesc?.[0]?.spec_values || []
if (spec_values.length) {
const item = spec_values[selColorIdx]
setTimeout(() => {
skuSelectRef.current?.handleSelectSku({ specId: item.spec_value_id, specValueId: item.spec_value_id }, selColorIdx)
}, 100)
}
}
// if (selColorIdx != 0) {
// const spec_values = data.itemSpecDesc?.[0]?.spec_values || []
// if (spec_values.length) {
// const item = spec_values[selColorIdx]
// setTimeout(() => {
// skuSelectRef.current?.handleSelectSku({ specId: item.spec_value_id, specValueId: item.spec_value_id }, selColorIdx)
// }, 100)
// }
// }
} catch (e) {
setState((draft) => {
draft.isDefault = true
@ -289,7 +289,7 @@ function EspierDetail (props) {
}
})
}
console.log("🚀 ~ data.introList:", data.introList)
console.log("🚀 ~ data.introList:", data)
setState((draft) => {
draft.info = {
...data,

4
src/pages/member/item-fav.js
View File

@ -309,9 +309,9 @@ export default class ItemFav extends Component {
<Text className="goods-list__item__right__footer__fav__text">人收藏</Text>
</View>
<View className='goods-list__item__right__footer__btns'>
<View className="goods-list__item__right__footer__btn white" onClick={() => this.handleClickItem(item)}>
{/* <View className="goods-list__item__right__footer__btn white" onClick={() => this.handleClickItem(item)}>
相似推荐
</View>
</View> */}
<View className="goods-list__item__right__footer__btn black" onClick={() => this.handleClickItem(item)}>
立即购买
</View>

15
src/subpage/pages/trade/cancel.scss
View File

@ -1,4 +1,4 @@
@import "@/style/imports";
@import '@/style/imports';
.page-trade-cancel {
.sp-cell {
@ -9,18 +9,25 @@
}
&__bd {
width: 100%;
.at-tag--active {
color: #000;
border-color: #000;
background-color: #fff;
}
}
.cancel-reason {
margin: 0 6px 0 0;
}
}
.trade-cancel-footer {
width: 100%;
position: fixed;
left: 0;
bottom: 0;
left: 30px;
right: 30px;
bottom: 50px;
width: 690px;
}
.toolbar_btn {
border-radius: 10px;
width: 100%;
box-sizing: border-box;
display: inline-block;

4
src/subpage/pages/trade/comps/new-item.js
View File

@ -221,7 +221,7 @@ export default class TradeItem extends Component {
</View>
<View className='trade-item__ft-bd'>
<Text className='trade-item__status'>{info.status_desc}</Text>
{info.receipt_type !== 'dada' && (
{/* {info.receipt_type !== 'dada' && (
<Button
className='btn-action'
style={`box-shadow: 0 0 0 1PX ${colors.data[0].primary}; color: ${colors.data[0].primary}`}
@ -229,7 +229,7 @@ export default class TradeItem extends Component {
>
查看物流
</Button>
)}
)} */}
{info.receipt_type !== 'dada' && (
<Button
className='btn-action'

83
src/subpage/pages/trade/detail.js
View File

@ -483,21 +483,23 @@ export default class TradeDetail extends Component {
}
handleClickDelivery = async (flag) => {
Taro.showLoading({ title: '' })
let { delivery_type, delivery_id, order_type, tid: order_id } = this.state.info
let list = []
if (delivery_type == 'new') {
list = await api.trade.deliveryInfoNew({ delivery_id })
} else {
list = await api.trade.deliveryInfo(order_type, order_id)
if (flag) {
Taro.showLoading({ title: '' })
let { delivery_type, delivery_id, order_type, tid: order_id } = this.state.info
let list = []
if (delivery_type !== 'new') {
list = await api.trade.deliveryInfoNew({ delivery_id })
} else {
list = await api.trade.deliveryInfo(order_type, order_id)
}
const nList = pickBy(list, {
title: 'AcceptStation',
content: ({ AcceptTime }) => [AcceptTime]
})
this.setState({
deliveryList: nList
})
}
const nList = pickBy(list, {
title: 'AcceptStation',
content: ({ AcceptTime }) => [AcceptTime]
})
this.setState({
deliveryList: nList
})
this.setState({ showDeliveryModal: flag })
Taro.hideLoading()
// Taro.navigateTo({
@ -1208,20 +1210,21 @@ export default class TradeDetail extends Component {
// info.order_class !== 'excard' &&
// !VERSION_IN_PURCHASE &&
// !this.isPointitemGood() && (
info.can_apply_aftersales === 1 && (
<View
className={`trade-detail__footer__btn ${info.is_logistics &&
'trade-detail__footer_active trade-detail__footer_allWidthBtn'
}`}
onClick={this.handleClickBtn.bind(this, 'aftersales')}
>
申请售后
</View>
)
// 先禁止掉！！！
// info.can_apply_aftersales === 1 && (
// <View
// className={`trade-detail__footer__btn ${info.is_logistics &&
// 'trade-detail__footer_active trade-detail__footer_allWidthBtn'
// }`}
// onClick={this.handleClickBtn.bind(this, 'aftersales')}
// >
// 申请售后
// </View>
// )
}
{
// 继续购物
(info.status === 'WAIT_SELLER_SEND_GOODS' ||
// 继续购物 先禁止掉！！！
false && (info.status === 'WAIT_SELLER_SEND_GOODS' ||
(info.status === 'WAIT_BUYER_CONFIRM_GOODS' &&
info.receipt_type === 'dada' &&
info.receipt_type !== 'dada') ||
@ -1251,7 +1254,7 @@ export default class TradeDetail extends Component {
<View
className={`trade-detail__footer__btn trade-detail__footer_active ${info.can_apply_aftersales === 0 && '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};color:#fff`}
onClick={this.handleClickBtn.bind(this, 'confirm')}
>
确认收货
@ -1315,21 +1318,25 @@ export default class TradeDetail extends Component {
<Text className="">物流信息</Text>
</View>
<View className="receiver_name">
{info.receiver_name}：{info.receiver_phone}
{'顺丰快递' || info.receiver_name}：{'SF000000000000' || info.receiver_phone}
</View>
<ScrollView scrollY
scrollWithAnimation className="curtain_content_text" showScrollbar={false} enhanced>
亲爱的用户,感谢您使用Birkenstock微信小程序!为了加强对您个人信息的保护,我们根据最新法律的要求制定/更新了
,我们将基于合法以及正当必要的原则,按照本政策的规定向您提供各项服务
<View>
本政策旨在向您说明休迪贸易 (上海)有限公司及其在中国大陆境内的线上线下门店如何收集、使用、传输和保护您的个人信息
通过《隐私政策》,我们向您主要说明:
<View class="receiver_item">
<View className="receiver_item_left">
02-01 12:00
</View>
<View className="receiver_item_right">
测试--快件达[上海长宁兆丰店]
</View>
</View>
<View className="">
1.您在使用Birkenstock微信小程序时,可以选择浏览模式,也可以选择注册/登录成为Birkenstock微信小程序用户
</View>
<View className="">
2为了向你提供Birkenstock微信小程序的其本服条,我们将基于合法以及正当必要的原则,按照本政策的规定向您提供各项服务
<View class="receiver_item">
<View className="receiver_item_left">
02-01 14:00
</View>
<View className="receiver_item_right">
测试--快件达[上海长宁xx店]
</View>
</View>
</ScrollView>
</View>

19
src/subpage/pages/trade/detail.scss
View File

@ -456,7 +456,8 @@ $paddingBottom: 100px;
left: 0;
width: 100%;
height: 100px;
bottom: $edge-margin;
// bottom: $edge-margin;
bottom: 30px;
background: #fff;
display: flex;
justify-content: space-evenly;
@ -740,6 +741,22 @@ $paddingBottom: 100px;
height: 650px;
color: #000;
font-size: 26px;
.receiver_item {
display: flex;
box-sizing: border-box;
font-style: 20px;
&:not(:last-child) {
margin-bottom: 30px;
}
&_left {
width: 190px;
font-style: 20px;
}
&_right {
flex: 1;
font-style: 20px;
}
}
}
}
.no-text {

12
src/subpage/pages/trade/split-bagpack.js
View File

@ -3,7 +3,7 @@ import Taro, { getCurrentInstance } from '@tarojs/taro'
import { View, Text, Button, Image, ScrollView } from '@tarojs/components'
import { connect } from 'react-redux'
import { AtCountdown } from 'taro-ui'
import { Loading, SpToast, SpNavBar, FloatMenuMeiQia, SpImg } from '@/components'
import { Loading, SpToast, SpNavBar, FloatMenuMeiQia, SpImg, SpPage } from '@/components'
import { pickBy, formatTime, resolveOrderStatus } from '@/utils'
import api from '@/api'
@ -27,7 +27,7 @@ import './split-bagpack.scss'
// }
export default class TradeDetail extends Component {
$instance = getCurrentInstance()
constructor (props) {
constructor(props) {
super(props)
this.state = {
@ -68,8 +68,8 @@ export default class TradeDetail extends Component {
}
return (
<View className='wuliu-detail'>
<SpNavBar title='订单详情' leftIconType='chevron-left' fixed='true' />
<SpPage className='wuliu-detail has-nav' title='订单详情'>
{/* <SpNavBar title='订单详情' leftIconType='chevron-left' fixed='true' /> */}
<View className='wuliu-detail'>
<View className='title-status'>您有{delivery_num}个包裹已发出</View>
@ -97,7 +97,7 @@ export default class TradeDetail extends Component {
)}
<View className='good-list'>
{/* <OrderItem
info={info.orders[0]}
/> */}
<ScrollView scrollX>
@ -112,7 +112,7 @@ export default class TradeDetail extends Component {
{/* <DetailItem info={info} /> */}
</View>
<SpToast></SpToast>
</View>
</SpPage>
)
}
}

12
src/subpages/marketing/coupon-center.js
View File

@ -6,7 +6,7 @@ import api from '@/api'
import doc from '@/doc'
import qs from 'qs'
import { View, Text } from '@tarojs/components'
import { pickBy, showToast, isWeixin, entryLaunch, styleNames } from '@/utils'
import { pickBy, showToast, isWeixin, entryLaunch, styleNames, thousandthFormat } from '@/utils'
import { SpPage, SpScrollView, SpCoupon, SpImage } from '@/components'
import './coupon-center.scss'
@ -23,10 +23,10 @@ function CouponCenter (props) {
useEffect(() => { getMypoint() }, [])
const getMypoint = async () => {
// const { point } = await api.pointitem.getMypoint()
const { point } = await api.member.memberInfo()
const { point } = await api.pointitem.getMypoint()
// const { point } = await api.member.memberInfo()
setState((draft) => {
draft.point = point
draft.point = thousandthFormat(point)
})
}
@ -103,7 +103,7 @@ function CouponCenter (props) {
}
const getCoupon = async ({ cardId }, index) => {
const { status } = await api.member.homeCouponGet({
const { status } = await api.member.getCardDetail({
card_id: cardId
})
if (status) {
@ -151,7 +151,7 @@ function CouponCenter (props) {
}
const getPoint = async () => {
await api.member.depositToPoint({ money: 50000 })
await api.member.depositToPoint({ money: 10000 })
showToast('积分+500')
setState((draft) => {
draft.couponList = []

1
src/subpages/marketing/coupon-picker.js
View File

@ -97,6 +97,7 @@ function CouponPicker (props) {
<SpCheckboxNew onChange={onChangeSelectCoupon.bind(this, null)} checked={select === null}>
暂不使用优惠券
</SpCheckboxNew>
{/* <AtButton >暂不使用优惠券</AtButton> */}
</View>
}
>

140
src/subpages/trade/after-sale.js
View File

@ -1,15 +1,15 @@
import React, { useEffect, useRef } from "react";
import React, { useEffect, useRef } from "react"
import { useSelector } from "react-redux"
import { useImmer } from "use-immer"
import Taro, { getCurrentInstance } from "@tarojs/taro";
import Taro, { getCurrentInstance } from "@tarojs/taro"
import api from "@/api"
import doc from "@/doc"
import { AtButton, AtInput, AtTextarea } from 'taro-ui'
import { SpPage, SpTabs, SpCell, SpCheckbox, SpImage, SpInputNumber, SpFloatLayout, SpUpload, SpPrice, SpHtml } from '@/components'
import { SpPage, SpTabs, SpCell, SpCheckbox, SpImage, SpInputNumber, SpFloatLayout, SpUpload, SpPrice, SpHtml, SpOrderItem } from '@/components'
import { View, Text, Picker } from "@tarojs/components"
import { AFTER_SALE_TYPE, REFUND_FEE_TYPE } from '@/consts'
import { pickBy, showToast, classNames, VERSION_STANDARD, VERSION_PLATFORM } from '@/utils'
import "./after-sale.scss";
import { pickBy, showToast, classNames, VERSION_STANDARD, VERSION_PLATFORM, JumpGoodDetail } from '@/utils'
import "./after-sale.scss"
const initialState = {
info: null,
@ -37,7 +37,7 @@ const initialState = {
}
}
function TradeAfterSale(props) {
function TradeAfterSale (props) {
const $instance = getCurrentInstance()
const [state, setState] = useImmer(initialState)
const pageRef = useRef()
@ -75,7 +75,7 @@ function TradeAfterSale(props) {
const { orderInfo, offline_aftersales_is_open, distributor } = await api.trade.detail(id)
const reasons = await api.aftersales.reasonList()
const { intro, is_open } = await api.aftersales.remindDetail()
const { offline_aftersales } = distributor
const { offline_aftersales } = distributor
const _info = pickBy(orderInfo, doc.trade.TRADE_ITEM)
setState(draft => {
draft.info = _info
@ -205,49 +205,113 @@ function TradeAfterSale(props) {
</View>
}
>
<SpTabs current={curTabIdx} tablist={tabList} onChange={(e) => {
<View className="after-item">
<View className="after-item-label">请选择售后类型:</View>
<Picker
mode='selector'
range={tabList.map(item => item.title)}
onChange={(e) => {
setState(draft => {
draft.curTabIdx = +e.detail.value
})
}}
>
<View className="after-item-input">
<View className="input-txt">{tabList[curTabIdx] ? tabList[curTabIdx].title : '请选择售后类型'}</View>
<View className="iconfont icon-arrowRight" style={{ color: tabList[curTabIdx] > -1 ? '#000' : '#a5a5a5' }}></View>
</View>
</Picker>
</View>
{/* <SpTabs current={curTabIdx} tablist={tabList} onChange={(e) => {
setState(draft => {
draft.curTabIdx = e
})
}} />
}} /> */}
<View className="choose-item">请选择您要退货的商品</View>
<View className="choose-all">
<SpCheckbox label='全选' checked={false} onChange={() => { }} />
</View>
<View className='refund-items'>
<View className='items-container'>
{
info?.items.map((item, index) => (
<View className='item-wrap' key={`item-wrap__${index}`}>
<View className='item-hd'>
<SpCheckbox disabled={!item.leftAftersalesNum} checked={item.checked} onChange={onChangeItemCheck.bind(this, item, index)} />
</View>
<View className='item-bd'>
<SpImage src={item.pic} width={128} height={128} radius={8} circle={8} />
<View className='goods-info'>
<View className='goods-info-hd'>
<Text className='goods-title'>{item.itemName}</Text>
</View>
<View className='goods-info-bd'>
<View>{item.itemSpecDesc && <Text className='sku-info'>{`${item.itemSpecDesc}`}</Text>}</View>
<View><SpPrice size={28} value={item.price / item.num} /> x <Text className='num'>{item.num}</Text></View>
</View>
<View className='goods-info-ft'>
<Text>退款数量</Text>
<SpInputNumber
disabled={!item.leftAftersalesNum}
value={item.refundNum}
max={item.leftAftersalesNum}
min={1}
onChange={(e) => onChangeItemNum(e, index)}
/>
<View className="item-box">
<View className='item-wrap' key={`item-wrap__${index}`}>
<View className='item-hd'>
<SpCheckbox disabled={item.leftAftersalesNum} checked={item.checked} onChange={onChangeItemCheck.bind(this, item, index)} />
</View>
<View className='item-bd'>
{/* <SpOrderItem
key={`item__${index}`}
info={item}
isShowNational
isPointitemGood={false}
onClick={() => {
if (info.order_class == 'pointsmall') {
Taro.navigateTo({
url: `/subpages/pointshop/espier-detail?id=${item.good_id}`
})
} else {
JumpGoodDetail(item.good_id, item.distributor_id)
}
}}
/> */}
<SpImage src={item.pic} width={150} height={150} mode='aspectFill' radius={4} circle={4} />
<View className='goods-info'>
<View className='goods-info-hd'>
<Text className='goods-title'>{item.itemName}</Text>
</View>
<View className='goods-info-bd'>
<View>{item.itemSpecDesc && <Text className='sku-info'>{`${item.descInfo}`}</Text>}</View>
{/* <View><SpPrice size={28} value={item.price / item.num} /> x <Text className='num'>{item.num}</Text></View> */}
</View>
<View className='goods-info-ft'>
<Text>数量：{item.num}</Text>
<SpPrice size={20} value={item.price / item.num} showSeparator noDecimal />
<SpInputNumber
disabled={!item.leftAftersalesNum}
value={item.refundNum}
max={item.leftAftersalesNum}
min={1}
onChange={(e) => onChangeItemNum(e, index)}
/>
</View>
</View>
</View>
</View>
<SpPrice value={item.price} showSeparator noDecimal />
</View>
))
}
</View>
</View>
<View className='picker-reason'>
<View className="after-item mt-40">
<View className="after-item-label color-hui">退货原因:</View>
<Picker
mode='selector'
range={reasons}
onChange={(e) => {
setState(draft => {
draft.reasonIndex = e.detail.value
})
}}
>
<View className="after-item-input">
<View className="input-txt">{`${reasons?.[reasonIndex] || '请选择退货原因'}`}</View>
<View className="iconfont icon-arrowRight" style={{ color: reasons?.[reasonIndex] ? '#000' : '#a5a5a5' }}></View>
</View>
</Picker>
</View>
<View className="after-item mt-40">
<View className="after-item-label color-hui">退货数量:</View>
<View className="after-item-input">
<View className="input-txt color-hui">{`${reasons?.[reasonIndex] || '请选择退货数量'}`}</View>
</View>
</View>
{/* <View className='picker-reason'>
<Picker
mode='selector'
range={reasons}
@ -259,9 +323,11 @@ function TradeAfterSale(props) {
>
<SpCell title='退款原因' isLink value={<Text>{`${reasons?.[reasonIndex] || '请选择取消原因'}`}</Text>}></SpCell>
</Picker>
</View>
</View> */}
<View className='refund-desc-container'>
<View className='refund-detail'>
</View>
{false && <View className='refund-detail'>
<View className='refund-amount'>
<SpCell title='退款金额' value={getRealRefundFee()} />
</View>
@ -270,7 +336,7 @@ function TradeAfterSale(props) {
{/* <SpCell title='退积分' value={info?.point} /> */}
<SpCell title='退积分' value={getRealRefundPoint()} />
</View>
</View>
</View>}
{curTabIdx == 1 && <View className='return-goods-type'>
<SpCell border title='退货方式' value={getRefundTypeName()} isLink onClick={() => {

101
src/subpages/trade/after-sale.scss
View File

@ -1,4 +1,36 @@
.page-trade-after-sale {
.after-item {
padding: 0 22px;
&.mt-40 {
margin-top: 40px;
}
&-label {
color: #000;
font-size: 26px;
line-height: 1;
margin-bottom: 20px;
}
.color-hui {
background: #f5f5f5;
}
&-input {
box-sizing: border-box;
background: #f5f5f5;
border-radius: 6px;
padding: 20px 50px;
color: #000;
position: relative;
.icon-arrowRight {
font-size: 34px;
position: absolute;
right: 60px;
top: 30%;
// transform: translateY(-50%);
color: #000;
rotate: 90deg;
}
}
}
.btn-wrap {
padding: 20px;
}
@ -30,6 +62,18 @@
border-radius: 16px;
overflow: hidden;
}
.choose-item {
margin: 26px 22px 24px;
font-size: 26px;
}
.choose-all {
display: flex;
padding-left: 54px;
box-sizing: border-box;
.sp-checkbox-new__label {
font-style: 26px;
}
}
.reason-container {
background-color: #e2e4ea;
margin-top: 32px;
@ -39,7 +83,7 @@
}
.refund-items {
background-color: #fff;
margin: 24px 16px 0;
margin: 0px 22px 0;
border-radius: 16px;
.title {
font-size: 30px;
@ -50,14 +94,26 @@
}
.items-container {
// padding: 0 32px 20px;
padding: 24px 20px;
padding: 24px 0;
}
.item-box {
padding: 30px;
background: #f7f7f7;
border-radius: 6px;
&:not(:last-child) {
margin-bottom: 10px;
}
.sp-price {
display: block;
text-align: end;
}
}
.item-wrap {
display: flex;
align-items: center;
&:not(:last-child) {
margin-bottom: 20px;
}
}
.item-hd {
margin-right: 40px;
}
.item-bd {
flex: 1;
@ -65,31 +121,46 @@
align-items: center;
}
.goods-info {
margin-left: 24px;
margin-left: 60px;
flex: 1;
margin-top: 8px;
height: 150px;
display: flex;
justify-content: space-between;
flex-direction: column;
padding: 10px 0;
box-sizing: border-box;
&-hd {
display: flex;
font-size: 20px;
justify-content: space-between;
}
&-bd {
display: flex;
justify-content: space-between;
align-items: center;
font-size: 20px;
.num {
font-size: 24px;
}
}
&-ft {
display: flex;
justify-content: space-between;
// justify-content: space-between;
align-items: center;
margin-top: 10px;
// margin-top: 10px;
font-size: 20px;
.sp-price {
margin-left: 30px;
.sp-price__symbol {
margin-right: 2px !important;
}
}
}
.goods-title {
font-weight: 500;
color: #111a34;
font-size: 26px;
// color: #111a34;
color: #000;
font-size: 20px;
}
.goods-num {
font-size: 22px;
@ -97,13 +168,11 @@
color: #111a34;
}
.sku-info {
font-size: 24px;
font-weight: 400;
color: #858b9c;
background: #f5f5f5;
padding: 0 10px;
padding: 20px 0;
height: 34px;
line-height: 34px;
font-size: 20px;
opacity: 0.85;
}
}
.refund-detail {