✨ feat(ID1000868): 内部商城用户申请领取色卡
【商城用户申请领取色卡】 https://www.tapd.cn/53459131/prong/stories/view/1153459131001000868
This commit is contained in:
xuan
@@ -5,7 +5,7 @@ import classnames from 'classnames'
|
||||
import VirtualList from '@tarojs/components/virtual-list'
|
||||
import Goods from '../goodsItem'
|
||||
import styles from './index.module.scss'
|
||||
import Divider from '@/components/Divider'
|
||||
import Divider from '@/components/divider'
|
||||
import Search from '@/components/search'
|
||||
import Popup from '@/components/popup'
|
||||
import BottomCustomer from '@/components/BottomCustomer'
|
||||
|
||||
@@ -89,9 +89,11 @@ const CustomerPage = () => {
|
||||
setclientObj(item)
|
||||
const pages = Taro.getCurrentPages() // 获取当前的页面栈
|
||||
const prevPage = pages[pages.length - 2]
|
||||
console.log('prevPage', prevPage)
|
||||
prevPage.setData({ // 设置上一个页面的值
|
||||
clientId: item.id,
|
||||
clientName: item.name,
|
||||
clientPhone: item.phone,
|
||||
})
|
||||
setClientlist(e => ({ ...e, list: clentList?.list, total: clentList?.total }))
|
||||
Taro.navigateBack({
|
||||
|
||||
@@ -0,0 +1,3 @@
|
||||
export default {
|
||||
navigationBarTitleText: '领取色卡',
|
||||
}
|
||||
@@ -0,0 +1,132 @@
|
||||
page {
|
||||
background: #f7f7f7;
|
||||
height: 100%;
|
||||
display: flex;
|
||||
flex-flow: column nowrap;
|
||||
}
|
||||
.layoutBlock {
|
||||
padding: 24px 34px;
|
||||
}
|
||||
.main {
|
||||
background-color: $color_bg_one;
|
||||
height: 100%;
|
||||
display: flex;
|
||||
flex-flow: column nowrap;
|
||||
overflow: hidden;
|
||||
}
|
||||
.context {
|
||||
flex: 1 1 auto;
|
||||
height: 100%;
|
||||
overflow-y: scroll;
|
||||
}
|
||||
.addButton {
|
||||
margin-left: 24px;
|
||||
margin-right: 24px;
|
||||
margin-top: 24px;
|
||||
}
|
||||
.customerTop {
|
||||
color: #333333;
|
||||
font-size: 28px;
|
||||
}
|
||||
.customerBottom {
|
||||
display: flex;
|
||||
flex-flow: row nowrap;
|
||||
justify-content: space-between;
|
||||
color: #9b9b9b;
|
||||
font-size: 28px;
|
||||
}
|
||||
|
||||
.colorCardTop {
|
||||
font-size: 28px;
|
||||
}
|
||||
.colorCardBottom {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
flex-flow: row nowrap;
|
||||
justify-content: space-between;
|
||||
overflow: hidden;
|
||||
margin-bottom: 24px;
|
||||
.leftCont {
|
||||
width: 134px;
|
||||
height: 134px;
|
||||
border-radius: 8px;
|
||||
margin-right: 24px;
|
||||
}
|
||||
.rightCont {
|
||||
flex: 1 1 auto;
|
||||
overflow: hidden;
|
||||
display: flex;
|
||||
flex-flow: column nowrap;
|
||||
justify-content: space-between;
|
||||
&__top {
|
||||
font-size: 28px;
|
||||
@include common_ellipsis(1);
|
||||
}
|
||||
&__bottom {
|
||||
display: flex;
|
||||
flex-flow: row nowrap;
|
||||
justify-content: space-between;
|
||||
width: 100%;
|
||||
align-items: flex-end;
|
||||
}
|
||||
&__left {
|
||||
flex: 1 1 auto;
|
||||
overflow: hidden;
|
||||
}
|
||||
&__right {
|
||||
width: 30%;
|
||||
}
|
||||
}
|
||||
}
|
||||
.paymentMethod {
|
||||
text-align: right;
|
||||
font-size: 28px;
|
||||
color: #f64861;
|
||||
}
|
||||
|
||||
.remarkTop {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
.remarkTitle {
|
||||
font-size: 28px;
|
||||
font-weight: 500;
|
||||
color: #393939;
|
||||
}
|
||||
.remarkTag {
|
||||
display: flex;
|
||||
flex-flow: row nowrap;
|
||||
font-size: 24px;
|
||||
color: #626262;
|
||||
}
|
||||
}
|
||||
|
||||
.remarkBottom {
|
||||
.remarkContent {
|
||||
font-size: 28px;
|
||||
color: #999999;
|
||||
}
|
||||
}
|
||||
|
||||
.bottomBar {
|
||||
.bottomTotal {
|
||||
color: #aeaeae;
|
||||
font-size: 24px;
|
||||
}
|
||||
position: relative;
|
||||
z-index: 99;
|
||||
box-shadow: 0 -4px 6px -1px rgb(0 0 0 / 0.1), 0 -2px 4px -2px rgb(0 0 0 / 0.1);
|
||||
flex: none;
|
||||
display: flex;
|
||||
flex-flow: row nowrap;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
padding-left: 20px;
|
||||
padding-right: 20px;
|
||||
padding-top: 24px;
|
||||
background-color: white;
|
||||
padding-bottom: calc(20px + constant(safe-area-inset-bottom));
|
||||
padding-bottom: calc(20px + env(safe-area-inset-bottom));
|
||||
}
|
||||
.bottomBar__button {
|
||||
font-size: 28px;
|
||||
}
|
||||
@@ -0,0 +1,385 @@
|
||||
import { Text, View } from '@tarojs/components'
|
||||
import Taro, { useDidShow, useUnload } from '@tarojs/taro'
|
||||
import { useCallback, useEffect, useState } from 'react'
|
||||
import styles from './index.module.scss'
|
||||
import LayoutBlock from '@/components/layoutBlock'
|
||||
import NormalButton from '@/components/normalButton'
|
||||
import Divider from '@/components/divider'
|
||||
import IconFont from '@/components/iconfont/iconfont'
|
||||
import LabAndImg from '@/components/LabAndImg'
|
||||
import Counter from '@/components/counter'
|
||||
import Tag from '@/components/tag'
|
||||
import { alert, goLink } from '@/common/common'
|
||||
import { ClientListApi } from '@/api/order'
|
||||
import AddressDetailBox from '@/pages/orderDetails/components/addressDetailBox'
|
||||
import Popup from '@/components/popup'
|
||||
import Remark from '@/pages/orderDetails/components/remark'
|
||||
import { formatRemoveHashTag } from '@/common/format'
|
||||
import { SubmitColorCardOrder } from '@/api/colorCard'
|
||||
import MoveBtn from '@/components/moveBtn'
|
||||
|
||||
const AddColorCard = () => {
|
||||
// 获取选择的客户
|
||||
const pages = Taro.getCurrentPages()
|
||||
const currPage = pages[pages.length - 1] // 获取当前页面
|
||||
const [addressInfo, setAddressInfo] = useState<any>({})
|
||||
|
||||
// 获取客户
|
||||
const [clientList, setClientList] = useState<any[]>([])
|
||||
const { fetchData: fetchClientData } = ClientListApi()
|
||||
|
||||
const [order, setOrder] = useState<any[]>([])
|
||||
|
||||
useDidShow(() => {
|
||||
const colorCardCache = Taro.getStorageSync('colorCardCache')
|
||||
if (colorCardCache) {
|
||||
console.log('colorCardCache', JSON.parse(colorCardCache))
|
||||
setOrder(JSON.parse(colorCardCache))
|
||||
}
|
||||
})
|
||||
|
||||
const [clientInfo, setClientInfo] = useState({
|
||||
clientId: -1,
|
||||
clientName: '',
|
||||
clientPhone: '',
|
||||
})
|
||||
|
||||
const getClient = async() => {
|
||||
const res = await fetchClientData({
|
||||
page: 1, size: 10,
|
||||
})
|
||||
if (!res.success) {
|
||||
return alert.error(res.msg)
|
||||
}
|
||||
currPage.data.clientId = res.data.list.length > 0 ? res.data.list[0]?.id : -1
|
||||
currPage.data.clientName = res.data.list.length > 0 ? res.data.list[0]?.name : ''
|
||||
currPage.data.clientPhone = res.data.list.length > 0 ? res.data.list[0]?.phone : ''
|
||||
const {
|
||||
clientId,
|
||||
clientName,
|
||||
clientPhone,
|
||||
} = currPage.data
|
||||
setClientInfo({
|
||||
clientId,
|
||||
clientName,
|
||||
clientPhone,
|
||||
})
|
||||
setClientList([...res.data.list])
|
||||
}
|
||||
|
||||
useEffect(() => {
|
||||
getClient()
|
||||
}, [])
|
||||
|
||||
useUnload(() => {
|
||||
Taro.removeStorageSync('colorCardCache')
|
||||
})
|
||||
|
||||
// 选择客户
|
||||
const handleSelectCustomer = () => {
|
||||
goLink(`/pages/customerPage/index?clientId=${clientInfo?.clientId}`)
|
||||
}
|
||||
// 添加色卡
|
||||
const handleAddColorCard = () => {
|
||||
Taro.setStorageSync('colorCardCache', JSON.stringify(order))
|
||||
|
||||
goLink('/pages/getColorCard/colorCardList/index', { isGoBack: true })
|
||||
}
|
||||
|
||||
const { fetchData } = SubmitColorCardOrder()
|
||||
// 提交订单
|
||||
const handleSubmitOrder = async() => {
|
||||
if (!addressInfo.address_id) {
|
||||
Taro.showToast({
|
||||
title: '请选择地址',
|
||||
icon: 'none',
|
||||
duration: 2000,
|
||||
})
|
||||
return
|
||||
}
|
||||
if (!clientInfo.clientId) {
|
||||
Taro.showToast({
|
||||
title: '请选择客户',
|
||||
icon: 'none',
|
||||
duration: 2000,
|
||||
})
|
||||
return
|
||||
}
|
||||
// 请求数据
|
||||
const res = await fetchData({
|
||||
address_id: addressInfo.address_id,
|
||||
color_card_infos: order.map(item => ({ id: item.id, count: item.count || 1 })),
|
||||
purchaser_id: clientInfo.clientId,
|
||||
remark,
|
||||
})
|
||||
if (res.success) {
|
||||
Taro.showToast({
|
||||
title: '提交成功',
|
||||
icon: 'success',
|
||||
duration: 2000,
|
||||
})
|
||||
Taro.removeStorageSync('colorCardCache')
|
||||
setTimeout(() => {
|
||||
goLink('/pages/getColorCard/colorCardDetail/index', { id: res.data.id }, 'redirectTo')
|
||||
}, 2000)
|
||||
}
|
||||
}
|
||||
|
||||
const labAndImgObj = useCallback((item) => {
|
||||
return { lab: item?.lab, rgb: item?.rgb, texture_url: item?.texture_url }
|
||||
}, [])
|
||||
|
||||
const getInputValue = () => {
|
||||
|
||||
}
|
||||
|
||||
const deleteColorCard = (id) => {
|
||||
setOrder((prev) => {
|
||||
return prev.filter(item => item.id !== id)
|
||||
})
|
||||
Taro.setStorageSync('colorCardCache', JSON.stringify(order.filter(item => item.id !== id)))
|
||||
}
|
||||
|
||||
const handleCountChange = (value: number, id: number) => {
|
||||
console.log('value', value)
|
||||
if (order.length === 1 && value === 0) {
|
||||
Taro.showToast({
|
||||
title: '最后一个色卡不能删除',
|
||||
icon: 'none',
|
||||
duration: 2000,
|
||||
})
|
||||
return
|
||||
}
|
||||
if (value === 0) {
|
||||
Taro.showModal({
|
||||
content: '确认删除所选色卡？',
|
||||
confirmText: '删除',
|
||||
confirmColor: '#337fff',
|
||||
success(res) {
|
||||
if (res.confirm) {
|
||||
deleteColorCard(id)
|
||||
}
|
||||
},
|
||||
})
|
||||
return
|
||||
}
|
||||
setOrder((prev) => {
|
||||
const newOlder = prev.map((item) => {
|
||||
if (item.id === id) {
|
||||
item.count = value
|
||||
}
|
||||
return item
|
||||
})
|
||||
Taro.setStorageSync('colorCardCache', JSON.stringify(newOlder))
|
||||
return newOlder
|
||||
})
|
||||
}
|
||||
|
||||
const handSelect = () => {
|
||||
goLink(`/pages/addressManager/index?purchaser_id=${clientInfo.clientId}`)
|
||||
}
|
||||
// 接受选择客户页面传递过来的数据
|
||||
useDidShow(() => {
|
||||
// 判断是否有跳转选择客户
|
||||
if (currPage.data?.clientId && currPage.data?.clientId !== '') {
|
||||
setClientInfo({
|
||||
clientId: currPage.data?.clientId,
|
||||
clientName: currPage.data?.clientName,
|
||||
clientPhone: currPage.data?.clientPhone,
|
||||
})
|
||||
}
|
||||
// 默认客户
|
||||
if (currPage.data?.clientId == null) {
|
||||
setClientInfo(() => {
|
||||
return {
|
||||
clientId: clientList.length > 0 ? clientList[0]?.id : -1,
|
||||
clientName: clientList.length > 0 ? clientList[0]?.name : '',
|
||||
clientPhone: clientList.length > 0 ? clientList[0]?.phone : '',
|
||||
}
|
||||
})
|
||||
}
|
||||
})
|
||||
|
||||
const initAddressInfo = () => {
|
||||
setAddressInfo(val => ({
|
||||
...val,
|
||||
province_name: '',
|
||||
address_id: '',
|
||||
city_name: '',
|
||||
address_detail: '',
|
||||
district_name: '',
|
||||
target_user_name: '',
|
||||
purchaser_phone: '',
|
||||
}))
|
||||
}
|
||||
|
||||
useDidShow(() => {
|
||||
// 获取选择的地址
|
||||
console.log('addressObj', currPage.data?.addressObj, clientInfo.clientId, currPage.data?.clientId)
|
||||
if (!currPage.data?.addressObj) { return initAddressInfo() }
|
||||
const {
|
||||
purchaser_id,
|
||||
province_name,
|
||||
id,
|
||||
city_name,
|
||||
address_detail,
|
||||
district_name,
|
||||
name,
|
||||
phone,
|
||||
} = currPage.data?.addressObj
|
||||
if (purchaser_id === currPage.data?.clientId) {
|
||||
setAddressInfo(val => ({
|
||||
...val,
|
||||
province_name: province_name || '',
|
||||
address_id: id || '',
|
||||
city_name: city_name || '',
|
||||
address_detail: address_detail || '',
|
||||
district_name: district_name || '',
|
||||
target_user_name: name || '',
|
||||
purchaser_phone: phone || '',
|
||||
}))
|
||||
}
|
||||
else {
|
||||
initAddressInfo()
|
||||
}
|
||||
const selectId = id
|
||||
const obj = currPage?.data?.ids?.filter((item) => { return item == selectId })
|
||||
console.log('ids', currPage?.data?.ids)
|
||||
if (currPage?.data?.ids && obj.length === 0) {
|
||||
initAddressInfo()
|
||||
}
|
||||
})
|
||||
|
||||
// 备注操作
|
||||
const [showDesc, setShowDesc] = useState(false)
|
||||
const [remark, setRemark] = useState('')
|
||||
const handleShowDesc = () => {
|
||||
setShowDesc(true)
|
||||
}
|
||||
|
||||
const getRemark = useCallback((value: string) => {
|
||||
setShowDesc(false)
|
||||
console.log('remark', value)
|
||||
setRemark(value)
|
||||
}, [])
|
||||
|
||||
return <MoveBtn showList={['businessManager']}>
|
||||
<View className={styles.main}>
|
||||
<View className={styles.context}>
|
||||
{/* 客户信息 */}
|
||||
<LayoutBlock circle onClick={handleSelectCustomer} customStyle={{ marginTop: '12px' }} customClassName={styles.layoutBlock}>
|
||||
<View className={styles.customerTop}>
|
||||
<View>客户信息</View>
|
||||
</View>
|
||||
<Divider direction="horizontal" customStyles={{ margin: '12px 0' }}></Divider>
|
||||
<View className={styles.customerBottom}>
|
||||
{
|
||||
clientInfo.clientId !== -1
|
||||
? (<>
|
||||
<Text>
|
||||
{clientInfo.clientName}
|
||||
</Text>
|
||||
<Text>
|
||||
{clientInfo.clientPhone}
|
||||
</Text>
|
||||
</>
|
||||
)
|
||||
: <View>选择领取客户</View>
|
||||
}
|
||||
<IconFont name="icon-chakanquanbukehu" color="#444444" size={32}></IconFont>
|
||||
</View>
|
||||
</LayoutBlock>
|
||||
{
|
||||
clientInfo.clientId !== -1 && <AddressDetailBox
|
||||
showBtn={false}
|
||||
showWhatFont="物流"
|
||||
navSelect={handSelect}
|
||||
obj={addressInfo}
|
||||
receivingStatus={2}
|
||||
icon={<IconFont name="icon-dizhi1" size={60}></IconFont>}
|
||||
></AddressDetailBox>
|
||||
}
|
||||
|
||||
<NormalButton customClassName={styles.addButton} circle onClick={handleAddColorCard} plain size="normal" type="primary">添加色卡</NormalButton>
|
||||
{/* 色卡信息 */}
|
||||
<LayoutBlock customStyle={{ marginTop: '12px' }} circle customClassName={styles.layoutBlock}>
|
||||
<View className={styles.colorCardTop}>色卡信息</View>
|
||||
<Divider direction="horizontal" customStyles={{ margin: '12px 0' }}></Divider>
|
||||
{
|
||||
order.map((item) => {
|
||||
return (
|
||||
<View className={styles.colorCardBottom} key={item.id}>
|
||||
<View style={{ minWidth: '24%' }}>
|
||||
<View className={styles.leftCont}>
|
||||
<LabAndImg value={labAndImgObj(item)} />
|
||||
</View>
|
||||
</View>
|
||||
<View className={styles.rightCont}>
|
||||
<View className={styles.rightCont__top}>
|
||||
{item.color_card_name}
|
||||
</View>
|
||||
<View className={styles.rightCont__bottom}>
|
||||
<View className={styles.rightCont__left}>
|
||||
{
|
||||
item.affiliation_product.map((product_color, index) => {
|
||||
return <Tag customStyle={{ marginRight: '5px', marginBottom: '2px', padding: '5px', background: '#e3ecff', color: '#558cff', borderColor: '#e3ecff' }} key={index} size="small" circle>{formatRemoveHashTag(product_color.code)}</Tag>
|
||||
})
|
||||
}
|
||||
</View>
|
||||
<View className={styles.rightCont__right}>
|
||||
<Counter
|
||||
onBlue={getInputValue}
|
||||
defaultNum={item?.count || 1}
|
||||
onChange={e => handleCountChange(e, item.id)}
|
||||
onClickBtn={getInputValue}
|
||||
unit="本"
|
||||
minNum={0}
|
||||
maxNum={999}
|
||||
/>
|
||||
</View>
|
||||
</View>
|
||||
<Divider direction="horizontal" customStyles={{ margin: '12px 0 0 ' }}></Divider>
|
||||
</View>
|
||||
</View>
|
||||
)
|
||||
})
|
||||
}
|
||||
<View className={styles.paymentMethod}>快递到付</View>
|
||||
</LayoutBlock>
|
||||
{/* 备注信息 */}
|
||||
<LayoutBlock circle customClassName={styles.layoutBlock} onClick={handleShowDesc}>
|
||||
<View className={styles.remarkTop}>
|
||||
<View className={styles.remarkTitle}>备注信息</View>
|
||||
<View className={styles.remarkTag}>
|
||||
<Text>填写/修改备注</Text>
|
||||
<IconFont name="icon-chakanquanbukehu" color="#444444" size={32}></IconFont>
|
||||
</View>
|
||||
</View>
|
||||
<Divider direction="horizontal" customStyles={{ margin: '12px 0' }}></Divider>
|
||||
<View className={styles.remarkBottom}>
|
||||
<View className={styles.remarkContent}>{ remark || '尚未备注信息' }</View>
|
||||
</View>
|
||||
</LayoutBlock>
|
||||
|
||||
</View>
|
||||
<View className={styles.bottomBar}>
|
||||
<View className={styles.bottomTotal}>
|
||||
当前共 {order.length} 种色卡,共 {order.reduce((total, curr) => total + (curr.count || 1), 0)} 本
|
||||
</View>
|
||||
<NormalButton
|
||||
customClassName={styles.bottomBar__button}
|
||||
type="primary"
|
||||
round
|
||||
onClick={handleSubmitOrder}
|
||||
>
|
||||
提交订单
|
||||
</NormalButton>
|
||||
|
||||
</View>
|
||||
<Popup show={showDesc} showTitle={false} onClose={() => setShowDesc(false)}>
|
||||
<Remark onSave={getRemark} defaultValue={remark} showInput={!!showDesc} />
|
||||
</Popup>
|
||||
</View>
|
||||
</MoveBtn>
|
||||
}
|
||||
export default AddColorCard
|
||||
@@ -0,0 +1,3 @@
|
||||
export default {
|
||||
navigationBarTitleText: '色卡详情',
|
||||
}
|
||||
@@ -0,0 +1,203 @@
|
||||
page {
|
||||
background: #f7f7f7;
|
||||
height: 100%;
|
||||
display: flex;
|
||||
flex-flow: column nowrap;
|
||||
}
|
||||
.main {
|
||||
background-color: $color_bg_one;
|
||||
height: 100%;
|
||||
display: flex;
|
||||
flex-flow: column nowrap;
|
||||
overflow: hidden;
|
||||
.context {
|
||||
flex: 1 1 auto;
|
||||
height: 100%;
|
||||
overflow-y: scroll;
|
||||
}
|
||||
.orderProcess {
|
||||
font-size: 28px;
|
||||
}
|
||||
.orderInfoTop {
|
||||
font-size: 28px;
|
||||
color: $color_font_one;
|
||||
}
|
||||
.customerTop {
|
||||
color: #333333;
|
||||
font-size: 28px;
|
||||
}
|
||||
.customerBottom {
|
||||
display: flex;
|
||||
flex-flow: row nowrap;
|
||||
justify-content: space-between;
|
||||
color: #343434;
|
||||
font-size: 28px;
|
||||
}
|
||||
|
||||
.colorCardTop {
|
||||
font-size: 28px;
|
||||
}
|
||||
.colorCardBottom {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
flex-flow: row nowrap;
|
||||
justify-content: space-between;
|
||||
overflow: hidden;
|
||||
margin-bottom: 24px;
|
||||
.leftCont {
|
||||
width: 134px;
|
||||
height: 134px;
|
||||
border-radius: 8px;
|
||||
margin-right: 24px;
|
||||
}
|
||||
.rightCont {
|
||||
flex: 1 1 auto;
|
||||
overflow: hidden;
|
||||
display: flex;
|
||||
flex-flow: column nowrap;
|
||||
justify-content: space-between;
|
||||
&__top {
|
||||
font-size: 28px;
|
||||
@include common_ellipsis(1);
|
||||
}
|
||||
&__bottom {
|
||||
display: flex;
|
||||
flex-flow: row nowrap;
|
||||
justify-content: space-between;
|
||||
width: 100%;
|
||||
}
|
||||
&__container {
|
||||
display: flex;
|
||||
flex-flow: row nowrap;
|
||||
}
|
||||
&__left {
|
||||
flex: 1 1 auto;
|
||||
overflow: hidden;
|
||||
display: flex;
|
||||
flex-flow: column nowrap;
|
||||
}
|
||||
&__right {
|
||||
font-size: 28px;
|
||||
}
|
||||
}
|
||||
}
|
||||
.paymentMethod {
|
||||
text-align: right;
|
||||
font-size: 28px;
|
||||
color: #f64861;
|
||||
}
|
||||
}
|
||||
.address_box {
|
||||
display: flex;
|
||||
.address_box_left {
|
||||
margin-right: 24px;
|
||||
.cirle {
|
||||
border-radius: 50%;
|
||||
width: 64px;
|
||||
height: 64px;
|
||||
background: #4a7fff;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
}
|
||||
.address_box_right {
|
||||
flex: 1 1 auto;
|
||||
.address {
|
||||
height: 78px;
|
||||
font-size: 28px;
|
||||
font-weight: 500;
|
||||
@include common_ellipsis(2);
|
||||
color: #000000;
|
||||
margin-right: 41px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
display: -webkit-box;
|
||||
-webkit-box-orient: vertical;
|
||||
-webkit-line-clamp: 2; /*这里设置几行*/
|
||||
overflow: hidden;
|
||||
}
|
||||
.bottom {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
.reatName {
|
||||
font-size: 28px;
|
||||
font-weight: 500;
|
||||
color: #337fff;
|
||||
margin-right: 32px;
|
||||
}
|
||||
.leftbottom {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
.name {
|
||||
line-height: 34px;
|
||||
width: 84px;
|
||||
height: 34px;
|
||||
@include common_ellipsis();
|
||||
font-size: 28px;
|
||||
font-weight: 400;
|
||||
color: #343434;
|
||||
margin-right: 16px;
|
||||
}
|
||||
|
||||
.phone {
|
||||
height: 34px;
|
||||
font-size: 28px;
|
||||
font-weight: 400;
|
||||
color: #343434;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.bottomBar {
|
||||
position: relative;
|
||||
z-index: 99;
|
||||
box-shadow: 0 -4px 6px -1px rgb(0 0 0 / 0.1), 0 -2px 4px -2px rgb(0 0 0 / 0.1);
|
||||
flex: none;
|
||||
display: flex;
|
||||
flex-flow: row nowrap;
|
||||
justify-content: flex-end;
|
||||
align-items: center;
|
||||
padding-left: 20px;
|
||||
padding-right: 20px;
|
||||
padding-top: 24px;
|
||||
background-color: white;
|
||||
padding-bottom: calc(20px + constant(safe-area-inset-bottom));
|
||||
padding-bottom: calc(20px + env(safe-area-inset-bottom));
|
||||
}
|
||||
.bottomBar__button {
|
||||
font-size: 28px;
|
||||
}
|
||||
.remark {
|
||||
font-size: 28px;
|
||||
color: #9b9b9b;
|
||||
}
|
||||
|
||||
.step-title {
|
||||
display: flex;
|
||||
flex-flow: row nowrap;
|
||||
font-size: 28px;
|
||||
align-items: center;
|
||||
}
|
||||
.step-status {
|
||||
font-weight: 550;
|
||||
color: #393939;
|
||||
margin-right: 40px;
|
||||
}
|
||||
.attachment{
|
||||
display: flex;
|
||||
flex-flow: row nowrap;
|
||||
.step-url-container {
|
||||
margin-right: 16px;
|
||||
width: 128px;
|
||||
height: 128px;
|
||||
}
|
||||
.step-url {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
border-radius: 8px;
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,245 @@
|
||||
import { Image, Text, View } from '@tarojs/components'
|
||||
import Taro, { useRouter } from '@tarojs/taro'
|
||||
import { useCallback, useEffect, useState } from 'react'
|
||||
import styles from './index.module.scss'
|
||||
import LayoutBlock from '@/components/layoutBlock'
|
||||
import Divider from '@/components/divider'
|
||||
import AddressDetailBox from '@/pages/orderDetails/components/addressDetailBox'
|
||||
import LabAndImg from '@/components/LabAndImg'
|
||||
import Tag from '@/components/tag'
|
||||
import Cell from '@/components/cell'
|
||||
import { formatDateTime, formatRemoveHashTag } from '@/common/format'
|
||||
import NormalButton from '@/components/normalButton'
|
||||
import Steps from '@/components/steps'
|
||||
import Step from '@/components/steps/components/step'
|
||||
import { CancelColorCardOrder, GetColorCardOrderDetail } from '@/api/colorCard'
|
||||
import { alert } from '@/common/common'
|
||||
import IconFont from '@/components/iconfont/iconfont'
|
||||
import MoveBtn from '@/components/moveBtn'
|
||||
import { BUSINESS_MANAGER } from '@/common/constant'
|
||||
|
||||
const ColorCardDetail = () => {
|
||||
const { fetchData } = GetColorCardOrderDetail()
|
||||
|
||||
const router = useRouter()
|
||||
|
||||
const getData = async() => {
|
||||
console.log('id', router.params.id)
|
||||
const res = await fetchData({ id: Number(router.params.id) })
|
||||
if (!res.success) {
|
||||
return alert.error(res.msg)
|
||||
}
|
||||
setOrder(res.data)
|
||||
}
|
||||
|
||||
const [order, setOrder] = useState<any>({})
|
||||
|
||||
const [addressInfo, setAddressInfo] = useState()
|
||||
|
||||
const labAndImgObj = useCallback((item) => {
|
||||
return { lab: item?.lab, rgb: item?.rgb, texture_url: item?.texture_url }
|
||||
}, [])
|
||||
// 复制
|
||||
const handleCopy = (data: string) => {
|
||||
Taro.setClipboardData({
|
||||
data,
|
||||
success() {
|
||||
Taro.showToast({
|
||||
title: '复制成功',
|
||||
})
|
||||
},
|
||||
})
|
||||
}
|
||||
|
||||
const { fetchData: cancelOrderApi } = CancelColorCardOrder()
|
||||
|
||||
const cancelOrder = async(id: number) => {
|
||||
const res = await cancelOrderApi({ id })
|
||||
if (res.success) {
|
||||
getData()
|
||||
alert.success('取消成功')
|
||||
}
|
||||
else {
|
||||
alert.error(res.msg)
|
||||
}
|
||||
}
|
||||
|
||||
// 取消订单
|
||||
const handleCancel = () => {
|
||||
Taro.showModal({
|
||||
content: '确定取消该订单？',
|
||||
confirmColor: '#337fff',
|
||||
confirmText: '确认',
|
||||
success: (res) => {
|
||||
if (res.confirm) {
|
||||
cancelOrder(Number(router.params.id))
|
||||
console.log('用户点击确定')
|
||||
}
|
||||
},
|
||||
})
|
||||
}
|
||||
|
||||
useEffect(() => {
|
||||
getData()
|
||||
}, [])
|
||||
|
||||
return <MoveBtn showList={['businessManager']}>
|
||||
<View className={styles.main} >
|
||||
<View className={styles.context}>
|
||||
<LayoutBlock circle customStyle={{ padding: '24rpx', marginTop: '24rpx' }}>
|
||||
<View className={styles.orderProcess}>订单进程</View>
|
||||
<Divider direction="horizontal" customStyles={{ margin: '12px 0' }}></Divider>
|
||||
<View className={styles.orderProcessBottom}>
|
||||
<Steps current={order.order_status === 1 ? 0 : 1} direction="vertical" customStyle={{ padding: '0' }}>
|
||||
{/*
|
||||
申请中 -> 已完成 2
|
||||
申请中 -> 已取消 4
|
||||
申请中 -> 已拒绝 3
|
||||
*/}
|
||||
<Step
|
||||
title={
|
||||
<View className={styles['step-title']}>
|
||||
<Text className={styles['step-status']}>申请中</Text>
|
||||
<Text>{formatDateTime(order?.order_progress?.[0].audit_time)}</Text>
|
||||
</View>
|
||||
}
|
||||
/>
|
||||
{/* order.order_status === 1 申请中 */}
|
||||
{
|
||||
order.order_status !== 1
|
||||
? <Step status={order.order_status === 3 ? 'error' : undefined} title={
|
||||
<View className={styles['step-title']}>
|
||||
<Text className={styles['step-status']}>{order?.order_progress?.[1].order_status_name}</Text>
|
||||
<Text>{formatDateTime(order?.order_progress?.[1].audit_time)}</Text>
|
||||
</View>
|
||||
} description={
|
||||
<>
|
||||
{
|
||||
order?.order_progress?.[1].audit_remark ? <View>{formatDateTime(order?.order_progress?.[1].audit_remark)}</View> : null
|
||||
}
|
||||
{
|
||||
order?.order_progress?.[1].delivery_appendix_url
|
||||
? <View className={styles.attachment}>
|
||||
{
|
||||
order?.order_progress?.[1].delivery_appendix_url?.map((url, index) => {
|
||||
return <View className={styles['step-url-container']} key={index}>
|
||||
<Image className={styles['step-url']} src={url} lazyLoad mode="aspectFill" />
|
||||
</View>
|
||||
})
|
||||
}
|
||||
</View>
|
||||
: null
|
||||
}
|
||||
</>
|
||||
}
|
||||
/>
|
||||
: <Step title="已完成" />
|
||||
}
|
||||
|
||||
</Steps>
|
||||
</View>
|
||||
</LayoutBlock>
|
||||
<LayoutBlock circle customStyle={{ padding: '24rpx' }}>
|
||||
<View className={styles.customerTop}>客户信息</View>
|
||||
<Divider direction="horizontal" customStyles={{ margin: '12px 0' }}></Divider>
|
||||
<View className={styles.customerBottom}>
|
||||
<Text>{order?.purchaser_name}</Text>
|
||||
<Text>{order?.purchaser_phone}</Text>
|
||||
<Text></Text>
|
||||
</View>
|
||||
</LayoutBlock>
|
||||
<LayoutBlock circle>
|
||||
<View className={styles.address_box}>
|
||||
|
||||
<View className={styles.address_box_left}>
|
||||
<View className={styles.cirle}>
|
||||
<IconFont name="icon-dizhi1" size={60}></IconFont>
|
||||
</View>
|
||||
</View>
|
||||
<View className={styles.address_box_right}>
|
||||
<View className={styles.address}>{order?.address}</View>
|
||||
<Divider direction="horizontal" customStyles={{ margin: '12px 0', marginTop: '6px' }}></Divider>
|
||||
<View className={styles.bottom}>
|
||||
<View className={styles.leftbottom}>
|
||||
<View className={styles.name}>{order.target_user_name}</View>
|
||||
<View className={styles.phone}>{order.target_user_phone}</View>
|
||||
</View>
|
||||
<View className={styles.reatName}>{order.shipment_mode_name}</View>
|
||||
</View>
|
||||
</View>
|
||||
</View>
|
||||
</LayoutBlock>
|
||||
{/* 色卡信息 */}
|
||||
<LayoutBlock customStyle={{ padding: '24rpx', marginTop: '24rpx' }} circle customClassName={styles.layoutBlock}>
|
||||
<View className={styles.colorCardTop}>色卡信息</View>
|
||||
<Divider direction="horizontal" customStyles={{ margin: '12px 0' }}></Divider>
|
||||
{
|
||||
order.color_card_info?.map((item) => {
|
||||
return (
|
||||
<View className={styles.colorCardBottom} key={item.id}>
|
||||
<View style={{ minWidth: '24%' }}>
|
||||
<View className={styles.leftCont}>
|
||||
<LabAndImg value={labAndImgObj(item)} />
|
||||
</View>
|
||||
</View>
|
||||
<View className={styles.rightCont}>
|
||||
<View className={styles.rightCont__container}>
|
||||
<View className={styles.rightCont__left}>
|
||||
<View className={styles.rightCont__top}>
|
||||
{item.name}
|
||||
</View>
|
||||
<View className={styles.rightCont__bottom}>
|
||||
{
|
||||
item.affiliation_product?.map((product_color, index) => {
|
||||
return <Tag customStyle={{ marginRight: '5px', marginBottom: '2px', padding: '5px', background: '#e3ecff', color: '#558cff', borderColor: '#e3ecff' }} key={index} size="small" circle>{formatRemoveHashTag(product_color)}</Tag>
|
||||
})
|
||||
}
|
||||
</View>
|
||||
</View>
|
||||
<View className={styles.rightCont__right}>
|
||||
x{item.count}本
|
||||
</View>
|
||||
</View>
|
||||
<Divider direction="horizontal" customStyles={{ margin: '0' }}></Divider>
|
||||
</View>
|
||||
</View>
|
||||
)
|
||||
})
|
||||
}
|
||||
<View className={styles.paymentMethod}>快递到付</View>
|
||||
</LayoutBlock>
|
||||
<LayoutBlock circle customStyle={{ padding: '24rpx' }}>
|
||||
<View className={styles.orderInfoTop}>订单信息</View>
|
||||
<Divider direction="horizontal" customStyles={{ margin: '12px 0' }}></Divider>
|
||||
<View className={styles.orderInfoDetail}>
|
||||
<Cell title="订单编号：" desc={
|
||||
<>
|
||||
<Text className={styles.orderInfoDetail__desc}>{order.order_no}</Text>
|
||||
<Tag type="primary" onClick={() => handleCopy(order.order_no)}>复制</Tag>
|
||||
</>
|
||||
}
|
||||
></Cell>
|
||||
<Cell title="创建时间：" desc={formatDateTime(order?.create_time) || '暂无创建时间'}></Cell>
|
||||
<Cell title="业务员：" desc={order.sale_user_name}></Cell>
|
||||
</View>
|
||||
</LayoutBlock>
|
||||
<LayoutBlock circle customStyle={{ padding: '24rpx' }}>
|
||||
<View className={styles.orderInfoTop}>备注信息</View>
|
||||
<Divider direction="horizontal" customStyles={{ margin: '12px 0' }}></Divider>
|
||||
<View className={styles.remark}>{order?.remark || '暂无备注信息'}</View>
|
||||
</LayoutBlock>
|
||||
</View>
|
||||
<View className={styles.bottomBar}>
|
||||
{
|
||||
order.order_status === 1
|
||||
? <NormalButton customClassName={styles.bottomBar__button} type="info" plain round onClick={handleCancel} >
|
||||
取消订单
|
||||
</NormalButton>
|
||||
: null
|
||||
}
|
||||
|
||||
</View>
|
||||
</View>
|
||||
</MoveBtn>
|
||||
}
|
||||
export default ColorCardDetail
|
||||
@@ -0,0 +1,3 @@
|
||||
export default {
|
||||
navigationBarTitleText: '添加色卡',
|
||||
}
|
||||
@@ -0,0 +1,102 @@
|
||||
page {
|
||||
background: #f7f7f7;
|
||||
height: 100%;
|
||||
display: flex;
|
||||
flex-flow: column nowrap;
|
||||
}
|
||||
.main {
|
||||
background-color: $color_bg_one;
|
||||
height: 100%;
|
||||
display: flex;
|
||||
flex-flow: column nowrap;
|
||||
overflow: hidden;
|
||||
}
|
||||
.search {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
padding: 20px;
|
||||
box-sizing: border-box;
|
||||
align-items: center;
|
||||
background-color: #fff;
|
||||
border-bottom: 1px solid #e5e5e5;
|
||||
&__cancel {
|
||||
margin: 0 32px;
|
||||
color: #727272;
|
||||
font-size: 28px;
|
||||
}
|
||||
}
|
||||
|
||||
.context {
|
||||
flex: 1 1 auto;
|
||||
height: 100%;
|
||||
overflow: hidden;
|
||||
background-color: white;
|
||||
}
|
||||
|
||||
.bottomBar {
|
||||
position: relative;
|
||||
z-index: 99;
|
||||
box-shadow: 0 -4px 6px -1px rgb(0 0 0 / 0.1), 0 -2px 4px -2px rgb(0 0 0 / 0.1);
|
||||
flex: none;
|
||||
display: flex;
|
||||
flex-flow: row nowrap;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
padding-left: 20px;
|
||||
padding-right: 20px;
|
||||
padding-top: 24px;
|
||||
background-color: white;
|
||||
padding-bottom: calc(20px + constant(safe-area-inset-bottom));
|
||||
padding-bottom: calc(20px + env(safe-area-inset-bottom));
|
||||
}
|
||||
.bottomBar__button {
|
||||
width: 100%;
|
||||
font-size: 28px;
|
||||
}
|
||||
|
||||
.colorCard {
|
||||
padding: 24px 0;
|
||||
border-bottom: 1px solid #f6f6f6;
|
||||
display: flex;
|
||||
flex-flow: row nowrap;
|
||||
justify-content: space-between;
|
||||
&__image {
|
||||
width: 144px;
|
||||
height: 144px;
|
||||
border-radius: 8px;
|
||||
margin-right: 24px;
|
||||
overflow: hidden;
|
||||
position: relative;
|
||||
}
|
||||
&__title {
|
||||
font-size: 28px;
|
||||
color: #383838;
|
||||
}
|
||||
&__code {
|
||||
}
|
||||
&__content {
|
||||
flex: 1 1 auto;
|
||||
display: flex;
|
||||
flex-flow: column nowrap;
|
||||
}
|
||||
.addButton {
|
||||
width: 20%;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
}
|
||||
.imageTag {
|
||||
width: 100%;
|
||||
box-sizing: border-box;
|
||||
position: absolute;
|
||||
padding: 7px;
|
||||
bottom: 0px;
|
||||
right: 0px;
|
||||
opacity: 0.55;
|
||||
color: #ffffff;
|
||||
text-align: center;
|
||||
font-size: 24px;
|
||||
z-index: 1;
|
||||
}
|
||||
@@ -0,0 +1,231 @@
|
||||
import { View } from '@tarojs/components'
|
||||
import Taro, { useDidShow, useRouter, useUnload } from '@tarojs/taro'
|
||||
import { useCallback, useEffect, useMemo, useRef, useState } from 'react'
|
||||
import styles from './index.module.scss'
|
||||
import Search from '@/components/search'
|
||||
import NormalButton from '@/components/normalButton'
|
||||
import LabAndImg from '@/components/LabAndImg'
|
||||
import Tag from '@/components/tag'
|
||||
import MCheckbox from '@/components/checkbox'
|
||||
import InfiniteScroll from '@/components/infiniteScroll'
|
||||
import { dataLoadingStatus, debounce, getFilterData } from '@/common/util'
|
||||
import { alert, goLink } from '@/common/common'
|
||||
import { GetCanAddCardList } from '@/api/colorCard'
|
||||
import { formatRemoveHashTag } from '@/common/format'
|
||||
|
||||
const ColorCardList = () => {
|
||||
const { fetchData, state } = GetCanAddCardList()
|
||||
|
||||
const [orderList, setOrderList] = useState<{ list: any[]; total: number }>({
|
||||
list: [],
|
||||
total: 0,
|
||||
})
|
||||
const multipleSelection = useRef<typeof orderList['list']>([])
|
||||
// 搜索
|
||||
const getSearchData = debounce((value: string) => {
|
||||
console.log('search', value)
|
||||
}, 300)
|
||||
// 取消
|
||||
const handleCancel = () => {
|
||||
Taro.navigateBack()
|
||||
}
|
||||
|
||||
const router = useRouter()
|
||||
|
||||
// redirectTo 会触发 onLoad 事件
|
||||
let isRedirect = false
|
||||
// 确认
|
||||
const handleSubmit = () => {
|
||||
const cache = Taro.getStorageSync('colorCardCache')
|
||||
let cacheArr: any[] = multipleSelection.current
|
||||
if (cache) {
|
||||
cacheArr = [...cacheArr, ...JSON.parse(cache)]
|
||||
}
|
||||
Taro.setStorageSync('colorCardCache', JSON.stringify(cacheArr))
|
||||
if (router?.params.isGoBack) {
|
||||
isRedirect = true
|
||||
Taro.navigateBack({
|
||||
delta: 1,
|
||||
})
|
||||
}
|
||||
else {
|
||||
isRedirect = true
|
||||
// 携带id跳转
|
||||
goLink('/pages/getColorCard/addColorCard/index', null, 'redirectTo')
|
||||
}
|
||||
}
|
||||
|
||||
const labAndImgObj = useCallback((item) => {
|
||||
return { lab: item?.lab, rgb: item?.rgb, texture_url: item?.texture_url }
|
||||
}, [])
|
||||
// 页码和页数
|
||||
const [searchField, setSearchField] = useState<{ name?: string; color_card_ids?: number[]; page: number; size: number }>({
|
||||
name: '',
|
||||
color_card_ids: [],
|
||||
page: 1,
|
||||
size: 10,
|
||||
})
|
||||
|
||||
const getData = async() => {
|
||||
const res = await fetchData(getFilterData(searchField))
|
||||
if (!res.success) {
|
||||
return alert.error(res.msg)
|
||||
}
|
||||
setOrderList({ list: res.data.list, total: res.data.total })
|
||||
}
|
||||
|
||||
useEffect(() => {
|
||||
getData()
|
||||
}, [searchField])
|
||||
|
||||
useDidShow(() => {
|
||||
const cache = Taro.getStorageSync('colorCardCache')
|
||||
if (cache) {
|
||||
setSearchField(val => ({ ...val, color_card_ids: JSON.parse(cache).map(item => item.id) }))
|
||||
}
|
||||
})
|
||||
|
||||
useDidShow(() => {
|
||||
|
||||
})
|
||||
|
||||
// 上拉加载数据
|
||||
const pageNum = useRef({ size: searchField.size, page: searchField.page })
|
||||
// 列表下拉刷新
|
||||
const [refresherTriggeredStatus, setRefresherTriggeredStatus] = useState(false)
|
||||
// 下拉刷新
|
||||
const getRefresherRefresh = async() => {
|
||||
pageNum.current.size = 1
|
||||
setRefresherTriggeredStatus(true)
|
||||
setSearchField(val => ({ ...val, size: 10 }))
|
||||
}
|
||||
// 数据加载状态
|
||||
const statusMore = useMemo(() => {
|
||||
return dataLoadingStatus({ list: orderList.list, total: orderList.total, status: state.loading! })
|
||||
}, [orderList, state.loading])
|
||||
|
||||
const getScrollToLower = useCallback(() => {
|
||||
if (orderList.list.length < orderList.total) {
|
||||
pageNum.current.page++
|
||||
const size = pageNum.current.size * pageNum.current.page
|
||||
setSearchField({ ...searchField, size })
|
||||
}
|
||||
}, [orderList])
|
||||
// 选择
|
||||
const onSelect = (item: any) => {
|
||||
console.log('item==>', item)
|
||||
setOrderList((prev: any) => {
|
||||
prev.list?.forEach((val) => {
|
||||
if (val.id === item.id) {
|
||||
val.status = true
|
||||
multipleSelection.current = [...multipleSelection.current, val]
|
||||
}
|
||||
})
|
||||
return { list: prev.list, total: prev.total }
|
||||
})
|
||||
}
|
||||
// 未选择
|
||||
const onUnSelect = (item: any) => {
|
||||
setOrderList((prev: any) => {
|
||||
prev.list?.forEach((val) => {
|
||||
if (val.id === item.id) {
|
||||
val.status = false
|
||||
multipleSelection.current = multipleSelection.current.filter(mul => mul.id !== val.id)
|
||||
}
|
||||
})
|
||||
return { list: prev.list, total: prev.total }
|
||||
})
|
||||
console.log('multipleSelection', multipleSelection.current)
|
||||
}
|
||||
|
||||
const handleClickCheckBox = (item: any) => {
|
||||
console.log('item', item)
|
||||
if (!item.is_add) {
|
||||
if (item.status) {
|
||||
onUnSelect(item)
|
||||
}
|
||||
else {
|
||||
onSelect(item)
|
||||
}
|
||||
}
|
||||
}
|
||||
const noop = (e) => {
|
||||
e.stopPropagation()
|
||||
}
|
||||
|
||||
useUnload(() => {
|
||||
console.log('onUnload', isRedirect)
|
||||
if (!isRedirect) {
|
||||
Taro.removeStorageSync('colorCardCache')
|
||||
}
|
||||
})
|
||||
|
||||
return <View className={styles.main}>
|
||||
<View className={styles.search}>
|
||||
<Search placeholder="请输入搜索面料/色卡" showBtn={false} changeOnSearch={getSearchData} >
|
||||
<View className={styles.search__cancel} onClick={handleCancel}>取消</View>
|
||||
</Search>
|
||||
</View>
|
||||
<View className={styles.context}>
|
||||
<InfiniteScroll
|
||||
statusMore={statusMore}
|
||||
selfonScrollToLower={getScrollToLower}
|
||||
refresherEnabled
|
||||
refresherTriggered={refresherTriggeredStatus}
|
||||
selfOnRefresherRefresh={getRefresherRefresh}
|
||||
safeAreaInsetBottom={false}
|
||||
>
|
||||
{
|
||||
orderList.list.map((item) => {
|
||||
return <View key={item.id} style={{ padding: '0 16px', backgroundColor: 'white' }} onClick={() => handleClickCheckBox(item)}>
|
||||
<View className={styles.colorCard}>
|
||||
<View style={{ minWidth: '24%' }}>
|
||||
<View className={styles.colorCard__image}>
|
||||
<LabAndImg value={labAndImgObj(item)} />
|
||||
{
|
||||
item.is_multiple_product ? <View className={styles.imageTag}>多面料共用</View> : null
|
||||
}
|
||||
</View>
|
||||
</View>
|
||||
<View className={styles.colorCard__content}>
|
||||
<View className={styles.colorCard__title}>{item.color_card_name}</View>
|
||||
<View className={styles.colorCard__code}>
|
||||
{
|
||||
item.affiliation_product?.map((colorCode, index) => {
|
||||
return <Tag customStyle={{ marginRight: '5px', marginBottom: '2px', padding: '5px', background: '#e3ecff', color: '#558cff', borderColor: '#e3ecff' }} key={index} size="small" circle>{formatRemoveHashTag(colorCode.code)}</Tag>
|
||||
})
|
||||
}
|
||||
</View>
|
||||
</View>
|
||||
<View className={styles.addButton} onClick={noop}>
|
||||
<MCheckbox
|
||||
disabled={item.is_add}
|
||||
status={item.is_add || item.status}
|
||||
onSelect={() => onSelect(item)}
|
||||
onClose={() => onUnSelect(item)}
|
||||
/>
|
||||
</View>
|
||||
</View>
|
||||
</View>
|
||||
})
|
||||
}
|
||||
</InfiniteScroll>
|
||||
|
||||
</View>
|
||||
<View className={styles.bottomBar}>
|
||||
<NormalButton
|
||||
customClassName={styles.bottomBar__button}
|
||||
type="primary"
|
||||
round
|
||||
disabled={multipleSelection.current.length === 0}
|
||||
onClick={handleSubmit}
|
||||
>
|
||||
{
|
||||
multipleSelection.current.length ? `确认（已选 ${multipleSelection.current.length} 个）` : '确认'
|
||||
}
|
||||
</NormalButton>
|
||||
|
||||
</View>
|
||||
</View>
|
||||
}
|
||||
export default ColorCardList
|
||||
@@ -0,0 +1,135 @@
|
||||
.topItem {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
|
||||
.orderNo {
|
||||
font-size: 28px;
|
||||
font-weight: 550;
|
||||
color: #000000;
|
||||
}
|
||||
|
||||
.status {
|
||||
font-size: 28px;
|
||||
font-weight: 550;
|
||||
color: #0d7cff;
|
||||
}
|
||||
}
|
||||
.flexBox {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
.pussName {
|
||||
margin-right: 10px;
|
||||
font-size: 28px;
|
||||
font-weight: 500;
|
||||
color: #666666;
|
||||
}
|
||||
.tag {
|
||||
background-color: #e3ecff;
|
||||
border-color: transparent;
|
||||
color: #337fff;
|
||||
}
|
||||
}
|
||||
|
||||
.contBox {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
overflow: hidden;
|
||||
.leftCont {
|
||||
width: 134px;
|
||||
height: 134px;
|
||||
border-radius: 8px;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.rightCont {
|
||||
width: calc(100% - 134px);
|
||||
flex: 1 1 auto;
|
||||
display: flex;
|
||||
flex-flow: column nowrap;
|
||||
overflow: hidden;
|
||||
margin-left: 24px;
|
||||
justify-content: space-between;
|
||||
.rightTop {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
margin-bottom: 12px;
|
||||
|
||||
.productName {
|
||||
width: 70%;
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
text-overflow: ellipsis;
|
||||
margin-right: 8px;
|
||||
font-size: 28px;
|
||||
color: #000000;
|
||||
}
|
||||
|
||||
.shipMode {
|
||||
width: 25%;
|
||||
font-size: 28px;
|
||||
color: #000000;
|
||||
text-align: right;
|
||||
}
|
||||
}
|
||||
|
||||
.colorsBox {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
||||
.colorName {
|
||||
flex: 1;
|
||||
font-size: 28px;
|
||||
color: #797979;
|
||||
text-align: right;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.lineOne {
|
||||
// width: 638px;
|
||||
margin-right: 32px;
|
||||
height: 1px;
|
||||
background: #e7e7e7;
|
||||
// opacity: 0.1;
|
||||
margin-left: 32px;
|
||||
margin-top: 24px;
|
||||
}
|
||||
|
||||
.bottomMsg {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
margin-bottom: 16px;
|
||||
|
||||
.msgLeft {
|
||||
font-size: 24px;
|
||||
font-weight: 400;
|
||||
color: #a1a1a1;
|
||||
}
|
||||
|
||||
.msgRight {
|
||||
font-size: 24px;
|
||||
font-weight: 400;
|
||||
color: #a1a1a1;
|
||||
}
|
||||
}
|
||||
.paymentMethod {
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
.msgRightOne {
|
||||
font-size: 28px;
|
||||
font-weight: 500;
|
||||
color: #f64861;
|
||||
align-self: flex-end;
|
||||
}
|
||||
}
|
||||
|
||||
.bottomBox {
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
margin-top: 32px;
|
||||
}
|
||||
@@ -0,0 +1,87 @@
|
||||
import type { ITouchEvent } from '@tarojs/components'
|
||||
import { ScrollView, View } from '@tarojs/components'
|
||||
import Taro from '@tarojs/taro'
|
||||
import { memo, useCallback, useEffect, useMemo, useState } from 'react'
|
||||
import classnames from 'classnames'
|
||||
import styles from './index.module.scss'
|
||||
import BottomBtns from '@/components/BottomBtns'
|
||||
import { formatPriceDiv } from '@/common/format'
|
||||
import LabAndImg from '@/components/LabAndImg'
|
||||
import NormalButton from '@/components/normalButton'
|
||||
import Divider from '@/components/divider'
|
||||
import Tag from '@/components/tag'
|
||||
import LayoutBlock from '@/components/layoutBlock'
|
||||
import { goLink } from '@/common/common'
|
||||
|
||||
interface PropsType {
|
||||
data?: any
|
||||
cancel?: (e: ITouchEvent) => void
|
||||
}
|
||||
const ItemList = (props: PropsType) => {
|
||||
const { data, cancel } = props
|
||||
|
||||
const labAndImgObj = useCallback((item) => {
|
||||
return { lab: item?.lab, rgb: item?.rgb, texture_url: item?.texture_url }
|
||||
}, [])
|
||||
// 进入详情页
|
||||
const navTo = () => {
|
||||
goLink('/pages/getColorCard/colorCardDetail/index', { id: data.order_id })
|
||||
}
|
||||
|
||||
return (
|
||||
<LayoutBlock onClick={navTo} circle>
|
||||
<View className={styles.topItem}>
|
||||
<View className={styles.orderNo}>单号：{data.order_no}</View>
|
||||
<View className={styles.status}>{data.order_status_name}</View>
|
||||
</View>
|
||||
<View className={styles.flexBox}>
|
||||
<View className={styles.pussName}>{data.purchaser_name}</View>
|
||||
<Tag type="primary" size="normal" circle customClassName={styles.tag} plain>
|
||||
{data.sale_user_name}
|
||||
</Tag>
|
||||
</View>
|
||||
<Divider direction="horizontal" customStyles={{ margin: '12px 0' }}></Divider>
|
||||
<View className={styles.contBox}>
|
||||
<View style={{ minWidth: '24%' }}>
|
||||
<View className={styles.leftCont}>
|
||||
<LabAndImg value={labAndImgObj(data.color_card_info[0])} />
|
||||
</View>
|
||||
</View>
|
||||
|
||||
<View className={styles.rightCont}>
|
||||
<View className={styles.rightTop}>
|
||||
<View className={styles.productName}>{data.color_card_info[0].name}</View>
|
||||
<View className={styles.shipMode}>{data.shipment_mode_name}</View>
|
||||
</View>
|
||||
<View className={styles.colorsBox}>
|
||||
<View className={styles.colorName}>x{data.color_card_info[0].count || 0}本</View>
|
||||
</View>
|
||||
</View>
|
||||
</View>
|
||||
<Divider direction="horizontal" customStyles={{ margin: '12px 0' }}></Divider>
|
||||
<View className={styles.bottomMsg}>
|
||||
<View className={styles.msgLeft}>色卡信息：</View>
|
||||
<View className={styles.msgRight}>{data?.color_card_count || 0} 种色卡，共 {data?.color_card_number || 0} 本</View>
|
||||
</View>
|
||||
<View className={styles.paymentMethod}>
|
||||
<View className={styles.msgRightOne}>快递到付</View>
|
||||
</View>
|
||||
<View className={styles.bottomBox}>
|
||||
{
|
||||
data.order_status === 1 && <NormalButton
|
||||
customStyles={{ fontSize: '14px' }}
|
||||
type="info"
|
||||
size="normal"
|
||||
round
|
||||
plain
|
||||
onClick={cancel}
|
||||
>
|
||||
取消订单
|
||||
</NormalButton>
|
||||
}
|
||||
|
||||
</View>
|
||||
</LayoutBlock>
|
||||
)
|
||||
}
|
||||
export default memo(ItemList)
|
||||
@@ -0,0 +1,3 @@
|
||||
export default {
|
||||
navigationBarTitleText: '领取色卡',
|
||||
}
|
||||
@@ -0,0 +1,66 @@
|
||||
page {
|
||||
background: #f7f7f7;
|
||||
height: 100%;
|
||||
display: flex;
|
||||
flex-flow: column nowrap;
|
||||
}
|
||||
.main {
|
||||
background-color: $color_bg_one;
|
||||
height: 100%;
|
||||
display: flex;
|
||||
flex-flow: column nowrap;
|
||||
overflow: hidden;
|
||||
|
||||
.search {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
padding: 20px;
|
||||
box-sizing: border-box;
|
||||
align-items: center;
|
||||
background-color: #fff;
|
||||
border-bottom: 1px solid #e5e5e5;
|
||||
}
|
||||
.tab_bar{
|
||||
position: relative;
|
||||
z-index: 99;
|
||||
display: flex;
|
||||
flex-flow: row nowrap;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
padding: 20px;
|
||||
background-color: white;
|
||||
box-shadow: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1);
|
||||
}
|
||||
.color_card_list{
|
||||
flex: 1 1 auto;
|
||||
height: 100%;
|
||||
overflow: hidden;
|
||||
.order_item{
|
||||
margin: 20px 0;
|
||||
}
|
||||
}
|
||||
.bottomBar {
|
||||
position: relative;
|
||||
z-index: 99;
|
||||
box-shadow: 0 -4px 6px -1px rgb(0 0 0 / 0.1), 0 -2px 4px -2px rgb(0 0 0 / 0.1);
|
||||
flex: none;
|
||||
display: flex;
|
||||
flex-flow: row nowrap;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
padding-left: 20px;
|
||||
padding-right: 20px;
|
||||
padding-top: 24px;
|
||||
background-color: white;
|
||||
padding-bottom: calc(20px + constant(safe-area-inset-bottom));
|
||||
padding-bottom: calc(20px + env(safe-area-inset-bottom));
|
||||
}
|
||||
}
|
||||
.tab_bar .button{
|
||||
padding: 0 60px;
|
||||
}
|
||||
.bottomBar__button{
|
||||
width: 100%;
|
||||
font-size: 28px;
|
||||
}
|
||||
@@ -0,0 +1,169 @@
|
||||
import type { ITouchEvent } from '@tarojs/components'
|
||||
import { View } from '@tarojs/components'
|
||||
import Taro from '@tarojs/taro'
|
||||
import { useCallback, useEffect, useMemo, useRef, useState } from 'react'
|
||||
import styles from './index.module.scss'
|
||||
import ItemList from './components/itemList'
|
||||
import Search from '@/components/search'
|
||||
import NormalButton from '@/components/normalButton'
|
||||
import InfiniteScroll from '@/components/infiniteScroll'
|
||||
import { dataLoadingStatus, debounce, getFilterData } from '@/common/util'
|
||||
import FilterButton from '@/components/filterButton'
|
||||
import { alert, goLink } from '@/common/common'
|
||||
import { CancelColorCardOrder, GetColorCardOrderList } from '@/api/colorCard'
|
||||
import IconFont from '@/components/iconfont/iconfont'
|
||||
import Empty from '@/components/empty'
|
||||
import { COLOR_CARD_LIST_EMPTY_IMAGE } from '@/common/constant'
|
||||
|
||||
const GetColorCard = () => {
|
||||
const { fetchData, state } = GetColorCardOrderList()
|
||||
const getData = async() => {
|
||||
const res = await fetchData(getFilterData(searchField))
|
||||
if (!res.success) {
|
||||
return alert.error(res.msg)
|
||||
}
|
||||
setColorList({ list: res.data.list, total: res.data.total })
|
||||
}
|
||||
|
||||
// status 1 申请中 2 已完成
|
||||
// 页码和页数
|
||||
const [searchField, setSearchField] = useState<{ name?: string; status?: number; page: number; size: number }>({
|
||||
name: '',
|
||||
status: 0,
|
||||
page: 1,
|
||||
size: 10,
|
||||
})
|
||||
const [colorList, setColorList] = useState<{ list: any[]; total: number }>({ list: [], total: 0 })
|
||||
|
||||
// 列表下拉刷新
|
||||
const [refresherTriggeredStatus, setRefresherTriggeredStatus] = useState(false)
|
||||
// 数据加载状态
|
||||
const statusMore = useMemo(() => {
|
||||
return dataLoadingStatus({ list: colorList.list, total: colorList.total, status: state.loading! })
|
||||
}, [colorList, state.loading])
|
||||
// 筛选参数
|
||||
// 上拉加载数据
|
||||
const pageNum = useRef({ size: searchField.size, page: searchField.page })
|
||||
|
||||
const getRefresherRefresh = async() => {
|
||||
pageNum.current.size = 1
|
||||
setRefresherTriggeredStatus(true)
|
||||
setSearchField(val => ({ ...val, size: 10 }))
|
||||
}
|
||||
const getScrollToLower = useCallback(() => {
|
||||
if (colorList.list.length < colorList.total) {
|
||||
pageNum.current.page++
|
||||
const size = pageNum.current.size * pageNum.current.page
|
||||
setSearchField({ ...searchField, size })
|
||||
}
|
||||
}, [colorList])
|
||||
|
||||
// 领取色卡
|
||||
const getColorCard = () => {
|
||||
goLink('/pages/getColorCard/colorCardList/index')
|
||||
}
|
||||
|
||||
// 搜索
|
||||
const getSearchData = debounce((value: string) => {
|
||||
setSearchField(e => ({ ...e, name: value }))
|
||||
}, 300)
|
||||
|
||||
const FilterOptions = [
|
||||
{
|
||||
key: 0,
|
||||
label: '全部记录',
|
||||
},
|
||||
{
|
||||
key: 1,
|
||||
label: '申请中',
|
||||
},
|
||||
{
|
||||
key: 2,
|
||||
label: '已完成',
|
||||
},
|
||||
]
|
||||
|
||||
const handleClickFilter = (item: typeof FilterOptions[number]) => {
|
||||
if (searchField.status === item.key) { return }
|
||||
setSearchField(e => ({ ...e, status: item.key }))
|
||||
}
|
||||
|
||||
useEffect(() => {
|
||||
getData()
|
||||
}, [searchField])
|
||||
|
||||
const { fetchData: cancelOrderApi } = CancelColorCardOrder()
|
||||
|
||||
const cancelOrder = async(id) => {
|
||||
const res = await cancelOrderApi({ id })
|
||||
if (res.success) {
|
||||
getData()
|
||||
}
|
||||
}
|
||||
|
||||
// 取消订单
|
||||
const handleCancel = (e: ITouchEvent, id: number) => {
|
||||
e.stopPropagation()
|
||||
Taro.showModal({
|
||||
content: '确定取消该订单？',
|
||||
confirmColor: '#337fff',
|
||||
confirmText: '确认',
|
||||
success: (res) => {
|
||||
if (res.confirm) {
|
||||
cancelOrder(id)
|
||||
console.log('用户点击确定')
|
||||
}
|
||||
},
|
||||
})
|
||||
}
|
||||
|
||||
// 监听选择的类型
|
||||
// useEffect(() => {
|
||||
// setSearchObj(search)
|
||||
// if (search.goodsId) { getGoodList() }
|
||||
// }, [search])
|
||||
|
||||
return <View className={styles.main}>
|
||||
<View className={styles.search}>
|
||||
<Search placeholder="请输入客户或业务员" showBtn={false} changeOnSearch={getSearchData} />
|
||||
</View>
|
||||
<View className={styles.tab_bar}>
|
||||
{
|
||||
FilterOptions.map((item, index) => {
|
||||
return <FilterButton key={index} isActive={searchField.status === item.key} round customClassName={styles.button} size="small" onClick={() => handleClickFilter(item)}>{item.label}</FilterButton>
|
||||
})
|
||||
}
|
||||
</View>
|
||||
<View className={styles.color_card_list}>
|
||||
<InfiniteScroll
|
||||
emptySlot={<Empty picUrl={COLOR_CARD_LIST_EMPTY_IMAGE} text="还没有领取过色卡" />}
|
||||
statusMore={statusMore}
|
||||
selfonScrollToLower={getScrollToLower}
|
||||
refresherEnabled
|
||||
refresherTriggered={refresherTriggeredStatus}
|
||||
selfOnRefresherRefresh={getRefresherRefresh}
|
||||
safeAreaInsetBottom={false}
|
||||
>
|
||||
{colorList?.list?.map((item, index) => {
|
||||
return (
|
||||
<View key={item.id} className={styles.order_item}>
|
||||
<ItemList data={item} key={index} cancel={e => handleCancel(e, item.order_id)}></ItemList>
|
||||
</View>
|
||||
)
|
||||
})}
|
||||
</InfiniteScroll>
|
||||
</View>
|
||||
<View className={styles.bottomBar}>
|
||||
<NormalButton
|
||||
customClassName={styles.bottomBar__button}
|
||||
type="primary"
|
||||
round
|
||||
onClick={getColorCard}
|
||||
>
|
||||
领取色卡
|
||||
</NormalButton>
|
||||
</View>
|
||||
</View>
|
||||
}
|
||||
|
||||
export default GetColorCard
|
||||
@@ -11,6 +11,7 @@ import IconCard from '@/components/iconCard'
|
||||
import { LoginApi } from '@/api'
|
||||
import { alert } from '@/common/common'
|
||||
import useUserInfo from '@/use/useUserInfo'
|
||||
import { BUSINESS_MANAGER_PHONE } from '@/common/constant'
|
||||
|
||||
const QuickLogin: FC = () => {
|
||||
return (
|
||||
@@ -85,7 +86,7 @@ const Login: FC = () => {
|
||||
}
|
||||
// 处理忘记密码的逻辑
|
||||
const handleForgetPwd = () => {
|
||||
Taro.showToast({ title: '联系客服:0757-86834274', icon: 'none' })
|
||||
Taro.showToast({ title: `联系客服:${BUSINESS_MANAGER_PHONE}`, icon: 'none' })
|
||||
}
|
||||
|
||||
return (
|
||||
|
||||
@@ -5,29 +5,45 @@ import styles from './index.module.scss'
|
||||
import IconFont from '@/components/iconfont/iconfont'
|
||||
import { alert } from '@/common/common'
|
||||
|
||||
interface AddressInfo {
|
||||
take_goods_address: string
|
||||
province_name: string
|
||||
city_name: string
|
||||
district_name: string
|
||||
address_detail: string
|
||||
target_user_name: string
|
||||
purchaser_phone: string
|
||||
}
|
||||
interface propsObj {
|
||||
receivingStatus: Number | null
|
||||
onReceivingStatus?: (any, Number) => void
|
||||
obj?: any
|
||||
receivingStatus: Number | null // 1 自提 2 物流
|
||||
onReceivingStatus?: (any, Number) => void // 切换自提或者物流
|
||||
obj?: AddressInfo
|
||||
navSelect?: (any) => void
|
||||
icon?: React.ReactNode
|
||||
showBtn?: boolean
|
||||
showWhatFont?: string
|
||||
isReadonly?: boolean
|
||||
}
|
||||
const AddressDetailBox = (props: propsObj) => {
|
||||
const {
|
||||
receivingStatus = null,
|
||||
onReceivingStatus,
|
||||
obj = {},
|
||||
obj = {
|
||||
target_user_name: '暂无',
|
||||
purchaser_phone: '暂无',
|
||||
} as AddressInfo,
|
||||
navSelect,
|
||||
showBtn = true,
|
||||
showWhatFont = '',
|
||||
isReadonly = false,
|
||||
icon,
|
||||
} = props
|
||||
|
||||
return (
|
||||
<View className={styles.addressBox}>
|
||||
<View className={styles.topBox} onClick={() => navSelect?.(obj)}>
|
||||
<View className={styles.cirle}>
|
||||
<IconFont name="icon-cangku1" size={60}></IconFont>
|
||||
{icon ?? <IconFont name="icon-cangku1" size={60}></IconFont>}
|
||||
</View>
|
||||
{
|
||||
receivingStatus == 1 && <View className={styles.address}>{obj.take_goods_address || '中华人民共和国广东省佛山市禅城区陆盈纺织仓库'}</View>
|
||||
@@ -38,11 +54,12 @@ const AddressDetailBox = (props: propsObj) => {
|
||||
}
|
||||
{
|
||||
(obj?.province_name == '' && receivingStatus == 2)
|
||||
&& <View className={styles.address}></View>
|
||||
&& <View className={styles.address}>请选择地址</View>
|
||||
}
|
||||
{
|
||||
receivingStatus !== 1
|
||||
&& <IconFont name="icon-chakanquanbukehu" size={50} ></IconFont>
|
||||
(receivingStatus !== 1 && !isReadonly)
|
||||
? <IconFont name="icon-chakanquanbukehu" size={50} ></IconFont>
|
||||
: null
|
||||
}
|
||||
</View>
|
||||
<View className={styles.line}></View>
|
||||
|
||||
@@ -8,7 +8,7 @@ import { ProductRankApi, PurchaserRankApi, SaleOrderDataFormApi, SalesmanRankApi
|
||||
import { dataUnit, formatHashTag, formatPriceDiv, setPriceUnit } from '@/common/format'
|
||||
import { getFilterData } from '@/common/util'
|
||||
import Cell from '@/components/cell'
|
||||
import Divider from '@/components/Divider'
|
||||
import Divider from '@/components/divider'
|
||||
import Iconfont from '@/components/iconfont/iconfont'
|
||||
import LayoutBlock from '@/components/layoutBlock'
|
||||
import SelectMarketingDepartment from '@/components/SelectMarketingDepartment'
|
||||
|
||||
@@ -129,13 +129,13 @@ const DeliveryFilter = (props: DeliveryPropsType) => {
|
||||
<View className={styles.filterItem}>
|
||||
<View className={styles['filterItem--title']}>提货类型</View>
|
||||
<View className={classnames(styles['filterItem--wrapper'], styles['filter--type'])}>
|
||||
<FilterButton isActive={searchFilter.take_goods_order_type == undefined} onClick={() => handleSelectedType('default')}>
|
||||
<FilterButton circle isActive={searchFilter.take_goods_order_type == undefined} onClick={() => handleSelectedType('default')}>
|
||||
不限
|
||||
</FilterButton>
|
||||
{!!typeList?.length
|
||||
&& typeList?.map((item, key) => {
|
||||
return (
|
||||
<FilterButton key={key} isActive={searchFilter.take_goods_order_type === item?.id} onClick={() => handleSelectedType(item?.id)}>
|
||||
<FilterButton key={key} circle isActive={searchFilter.take_goods_order_type === item?.id} onClick={() => handleSelectedType(item?.id)}>
|
||||
{item.name}
|
||||
</FilterButton>
|
||||
// <NormalButton type='info' circle onClick={() => handleSelectedType(item?.id)}>
|
||||
@@ -151,12 +151,12 @@ const DeliveryFilter = (props: DeliveryPropsType) => {
|
||||
<View className={classnames(styles['filterItem--wrapper'], styles['filter--time'])}>
|
||||
{Object.entries(filterTimeOptions).map(([key, value], index) => {
|
||||
return (
|
||||
<FilterButton key={index} isActive={searchFilter.timeKey === key} onClick={() => handleSelectedTime(key)}>
|
||||
<FilterButton circle key={index} isActive={searchFilter.timeKey === key} onClick={() => handleSelectedTime(key)}>
|
||||
{value.name}
|
||||
</FilterButton>
|
||||
)
|
||||
})}
|
||||
<FilterButton isActive={searchFilter.timeKey === '6'} customClassName={styles.filterTimeButton} onClick={() => handleSelectedTime('6')}>
|
||||
<FilterButton circle isActive={searchFilter.timeKey === '6'} customClassName={styles.filterTimeButton} onClick={() => handleSelectedTime('6')}>
|
||||
自定义时间<IconFont name="icon-chakanquanbukehu" size={40} color={searchFilter.timeKey === '6' ? '#4581ff' : '#909090'}></IconFont>
|
||||
</FilterButton>
|
||||
</View>
|
||||
|
||||
@@ -12,7 +12,7 @@ import { TabBarIndex } from '@/reducers/tabBar'
|
||||
import { TabBarType } from '@/constants/tabbar'
|
||||
import NormalButton from '@/components/normalButton'
|
||||
import Tag from '@/components/tag'
|
||||
import Divider from '@/components/Divider'
|
||||
import Divider from '@/components/divider'
|
||||
import LayoutBlock from '@/components/layoutBlock'
|
||||
import IconCard from '@/components/iconCard'
|
||||
import type { IconNames } from '@/components/iconfont/iconfont'
|
||||
@@ -37,12 +37,6 @@ interface IconCardType {
|
||||
}
|
||||
|
||||
const feature: IconCardType[] = [
|
||||
{
|
||||
iconName: 'icon-lingquseka',
|
||||
name: '领取色卡',
|
||||
path: '',
|
||||
jurisdiction: 'receive_color_card_page',
|
||||
},
|
||||
{
|
||||
iconName: 'icon-pandiansaoma',
|
||||
name: '盘点扫码',
|
||||
@@ -85,6 +79,12 @@ const feature: IconCardType[] = [
|
||||
path: '/pages/customerManagement/index',
|
||||
jurisdiction: 'customer_list_page',
|
||||
},
|
||||
{
|
||||
iconName: 'icon-lingquseka',
|
||||
name: '领取色卡',
|
||||
path: '/pages/getColorCard/index',
|
||||
jurisdiction: 'receive_color_card_page',
|
||||
},
|
||||
]
|
||||
|
||||
const fabric: IconCardType[] = [
|
||||
|
||||
Reference in New Issue
Block a user