xuan/TestRestructureWechatLymarketDist
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Merge branch 'dev' of ssh://git.online.zzfzyc.com:10022/mp/spider_cloud_warehouse into 售后模块

Browse Source
This commit is contained in:
Haiyi
2022-09-20 11:21:51 +08:00
parent 4822150647 2bd4d07fbb
commit fcce5d265d
21 changed files with 3053 additions and 2047 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/pages/delivery/components/ItemList/index.module.scss
+50
View File
@@ -0,0 +1,50 @@
.layoutBlock{
margin: 24px;
}
.topBar {
&__orderNo {
display: flex;
flex-flow: row nowrap;
justify-content: space-between;
color: $color_font_one;
font-size: 28px;
}
&__orderType {
color: rgba($color: #000000, $alpha: 0.6);
font-weight: 550;
}
&__orderStatus {
color: #e42945;
}
}
.content {
&__row {
display: flex;
flex-flow: row nowrap;
justify-content: space-between;
margin: 16px 0;
font-size: 28px;
color: rgba($color: #000000, $alpha: 0.4);
&__left {
}
&__right {
}
}
}
.bottomBar {
display: flex;
flex-flow: row nowrap;
justify-content: flex-end;
align-items: center;
padding: 0 24px;
margin-top: 10px;
&__button {
margin: 0 24px;
}
&__button:last-child {
margin: 0;
}
}
.bord {
color: $color_font_one;
}
src/pages/delivery/components/ItemList/index.tsx
+64
View File
@@ -0,0 +1,64 @@
import LayoutBlock from '@/components/layoutBlock'
import Divider from '@/components/divider'
import Tag from '@/components/tag'
import { View, Text } from '@tarojs/components'
import { FC } from 'react'
import NormalButton from '@/components/normalButton'
import styles from './index.module.scss'
type PropsType = {
itemData?: Record<string, any>
}
const ItemList:FC<PropsType> = (props) => {
const { itemData } = props
// 查看详情
const handleDetail = () => {
}
// 确认审核
const handleAudit = () => {
}
return (
<LayoutBlock circle customClassName={styles.layoutBlock}>
<View className={styles.topBar}>
<View className={styles.topBar__orderNo}>
<View>单号：XS-LY-2208220092</View>
<View className={styles.topBar__orderStatus}>待审核</View>
</View>
<Text className={styles.topBar__orderType}>销售发货单</Text>
</View>
<Divider direction='horizontal'></Divider>
<View className={styles.content}>
<View className={styles.content__row}>
<View className={styles.content__row__left}>货品信息：</View>
<View className={styles.content__row__right}>
<Tag type='primary' circle plain>
大货
</Tag>
2种面料，4种颜色，共5米
</View>
</View>
<View className={styles.content__row}>
<View className={styles.content__row__left}>发货地址：</View>
<View className={styles.content__row__right}>永川纺织有限公司</View>
</View>
<View className={styles.content__row}>
<View className={styles.content__row__left}>创建时间：</View>
<View className={styles.content__row__right}>2022-09-01 18:32:32</View>
</View>
</View>
<View className={styles.bottomBar}>
<NormalButton customClassName={styles.bottomBar__button} type='info' round onClick={handleDetail}>
查看详情
</NormalButton>
<NormalButton customClassName={styles.bottomBar__button} type='primary' round onClick={handleAudit}>
确认审核
</NormalButton>
</View>
</LayoutBlock>
)
}
export default ItemList
src/pages/delivery/index.config.ts
+3
View File
@@ -0,0 +1,3 @@
export default {
navigationBarTitleText: '发货列表',
}
src/pages/delivery/index.module.scss
+113
View File
@@ -0,0 +1,113 @@
page {
background: #f7f7f7;
}
.delivery {
display: flex;
flex-flow: column nowrap;
.searchBox {
display: flex;
align-items: center;
background: #ffffff;
padding: 8px 24px;
}
.listBox {
background-color: #f7f7f7;
}
.itemBox {
margin-left: 24px;
background: #ffffff;
border-radius: 16px;
display: flex;
align-items: center;
margin-top: 24px;
box-sizing: border-box;
.cussName {
margin-left: 48px;
width: 168px;
height: 34px;
font-size: 28px;
font-family: PingFangSC-Medium, PingFang SC;
font-weight: 500;
color: #000000;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
}
.phone {
margin-left: 88px;
font-size: 28px;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
color: #000000;
}
.woker {
margin-left: 88px;
font-size: 28px;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
color: #000000;
}
}
.acticveitemBox {
margin-left: 24px;
width: 702px;
height: 104px;
background: #ffffff;
border-radius: 16px;
display: flex;
align-items: center;
margin-top: 24px;
box-sizing: border-box;
border: 1px solid #337fff;
.cussName {
margin-left: 48px;
width: 168px;
height: 34px;
font-size: 28px;
font-family: PingFangSC-Medium, PingFang SC;
font-weight: 500;
color: #000000;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
}
.phone {
margin-left: 88px;
font-size: 28px;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
color: #000000;
}
.woker {
margin-left: 88px;
font-size: 28px;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
color: #000000;
}
}
}
.scanHandler{
width: 40px;
height: 40px;
position: absolute;
right: 40px;
}
.icon__filter{
padding: 0 20px;
padding-right: 10px;
}
src/pages/delivery/index.tsx
+198
View File
@@ -0,0 +1,198 @@
import { View, Text } from '@tarojs/components'
import { useCallback, useEffect, useMemo, useRef, useState, FC } from 'react'
import styles from './index.module.scss'
import classnames from 'classnames'
import Search from '@/components/search'
import { ClientListApi } from '@/api/order'
import Taro from '@tarojs/taro'
import { useRouter } from '@tarojs/taro'
import InfiniteScroll from '@/components/infiniteScroll'
import { dataLoadingStatus, getFilterData } from '@/common/util'
import IconText from '@/components/iconText'
import SegmentedControl from '@/components/SegmentedControl'
import IconFont from '@/components/iconfont/iconfont'
import ItemList from './components/ItemList'
// 发货列表
const Delivery: FC = () => {
const [search, setSearch] = useState({
name: null,
page: 1,
size: 10,
})
const [clentList, setClientlist] = useState<{ list: any[]; total: number }>({ list: [], total: 0 })
const { fetchData: clitentFetch, state: orderState } = ClientListApi()
//数据加载状态
const statusMore = useMemo(() => {
return dataLoadingStatus({ list: clentList.list, total: clentList.total, status: orderState.loading })
}, [clentList, orderState])
const [clientObj, setclientObj] = useState({
clientId: null,
clientName: '',
})
//输入了搜索关键字
const getSearchData = useCallback((eq) => {
pageNum.current.page = 1
setClientlist(() => ({ list: [], total: 0 }))
setSearch((e) => ({ ...e, name: eq, size: 10 }))
}, [])
const router = useRouter()
useEffect(() => {
if (search.name === '') {
setSearch((e) => ({ ...e, name: null }))
}
if (search.name !== '') getCuss()
}, [search])
//上拉加载数据
const pageNum = useRef({ size: search.size, page: search.page })
const getScrolltolower = useCallback(() => {
if (clentList.list.length < clentList.total) {
pageNum.current.page++
const size = pageNum.current.size * pageNum.current.page
setSearch((e) => ({ ...e, size }))
console.log(search, 11111)
}
}, [clentList])
//列表下拉刷新
const [refresherTriggeredStatus, setRefresherTriggeredStatus] = useState(false)
const getRefresherRefresh = async () => {
pageNum.current.size = 1
setRefresherTriggeredStatus(true)
setSearch((val) => ({ ...val, size: 10 }))
}
const getCuss = async () => {
let res = await clitentFetch({ name: search.name === null ? '' : search.name, page: search.page, size: search.size })
if (router?.params.clientId) {
res.data.list.map((item) => {
if (item.id == router?.params.clientId) {
item.checked = true
} else {
item.checked = false
}
return item
})
}
setClientlist((e) => ({ ...e, list: res.data?.list, total: res.data?.total }))
setRefresherTriggeredStatus(() => false)
}
//选择客户
const selectClient = (item) => {
clentList.list.map((it) => {
if (item.id === it.id) {
it.checked = true
} else {
it.checked = false
}
return it
})
setclientObj(item)
let pages = Taro.getCurrentPages() // 获取当前的页面栈
let prevPage = pages[pages.length - 2]
prevPage.setData({
//设置上一个页面的值
clientId: item.id,
clientName: item.name,
})
setClientlist((e) => ({ ...e, list: clentList?.list, total: clentList?.total }))
Taro.navigateBack({
delta: 1,
})
}
useEffect(() => {
if (clientObj?.clientId !== null) {
setclientObj(clientObj)
} else {
let pages = Taro.getCurrentPages() // 获取当前的页面栈
let prevPage = pages[pages.length - 2]
prevPage.setData({
//设置上一个页面的值
clientId: '',
clientName: '',
})
}
}, [clientObj])
// 筛选列表
const onShowFilter = () => {}
const [statusList, setStatusList] = useState([
{
id: 1,
name: '待发货',
},
{
id: 2,
name: '已完成',
},
])
// //状态改变
const changeStatus = useCallback((e) => {
pageNum.current.page = 1
// setSearchField((value) => ({ ...value, status: e, size: 10 }))
console.log(e, '123123')
// setOrderData(() => ({ list: [], total: 0 }))
}, [])
// 扫描
const handleScan = () => {}
const scanIcon = () => {
return (
<View onClick={handleScan} className={styles.scanHandler}>
<IconFont name='icon-saomiao' size={40}></IconFont>
</View>
)
}
return (
<View className={styles.delivery}>
<View className={styles.searchBox}>
<Search placeholder='请输入或扫描条形码' showBtn={false} changeOnSearch={getSearchData} debounceTime={300} customRightSlot={scanIcon()}>
<View onClick={onShowFilter} className={styles.icon__filter}>
<IconText iconName='icon-shaixuan' text='筛选' customClass={styles['icon--filter']} />
</View>
</Search>
</View>
{/* 状态栏 */}
<SegmentedControl list={statusList} onSelect={changeStatus} defaultId={0} />
<View className={styles.listBox}>
{/* <InfiniteScroll
statusMore={statusMore}
selfonScrollToLower={getScrolltolower}
refresherEnabled={true}
refresherTriggered={refresherTriggeredStatus}
selfOnRefresherRefresh={getRefresherRefresh}>
{clentList.list.map((item, index) => {
return (
<View
className={classnames(item.checked ? styles.acticveitemBox : styles.itemBox)}
key={index}
onClick={() => {
selectClient(item)
}}>
<View className={styles.cussName}>{item.name}</View>
<View className={styles.phone}>{item.phone}</View>
<View className={styles.woker}>{item.sale_user_name}</View>
</View>
)
})}
</InfiniteScroll> */}
<ItemList ></ItemList>
<ItemList ></ItemList>
<ItemList ></ItemList>
<ItemList ></ItemList>
</View>
</View>
)
}
export default Delivery
src/pages/order/components/orderStatusList/index.tsx
+1 -1
View File
@@ -14,7 +14,7 @@ export default memo(({ list = [], defaultId = null, onSelect }: Param) => {
tabId: '', //需要滚动到的id
})
useEffect(() => {
if (defaultId) {
if (typeof defaultId === 'number' && defaultId >= 0) {
console.log('defaultId:::', defaultId)
const index = list?.findIndex((item) => {
return item.id == defaultId
src/pages/order/index.tsx
+59 -26
View File
@@ -580,14 +580,14 @@ export default () => {
return (
<View>
<View style={{ background: '#FFFFFF', paddingLeft: '20rpx', paddingBottom: '20rpx', position: 'sticky', top: '0', zIndex: '99' }}>
<Search placeholder='搜索商品/名称/颜色/订单号' showBtn={false} changeOnSearch={getSearchData} debounceTime={300} >
<Search placeholder='搜索商品/名称/颜色/订单号' showBtn={false} changeOnSearch={getSearchData} debounceTime={300}>
<View className={styles.flexBox} onClick={() => showSelctPopup()}>
<View className={classnames('iconfont', 'icon-shaixuan', !isDisabled ? styles.icon_shaixuan : styles.activeshaixuan)}></View>
<View className={classnames(isDisabled ? styles.shaixuan : styles.activeshai)}>筛选</View>
</View>
</Search>
</View>
<View style={{ background: '#FFFFFF', }}>
<View style={{ background: '#FFFFFF' }}>
<OrderStatusList list={statusList} onSelect={changeStatus} defaultId={-1} />
</View>
<View className={styles.order_list}>
@@ -605,8 +605,7 @@ export default () => {
key={index}
cancle={(e, item) => cancle(e, item)}
nextBuy={(e, item) => nextBuy(e, item)}
toPay={(e, item) => toPay(e, item)}
></ItemList>
toPay={(e, item) => toPay(e, item)}></ItemList>
</View>
)
})}
@@ -634,41 +633,76 @@ export default () => {
<View className={styles.secondBox}>
<View className={styles.secondTopfont}>订单单号</View>
<View className={styles.inputBox}>
<Input onInput={(e) => { handInput(e) }} placeholderStyle='color:#000000; font-size:26rpx' className={styles.orderInput} value={searchObj.orderNo} placeholder={'请输入或扫描条形码'}></Input>
<View className={classnames('iconfont', 'icon-saomiao', styles.saomiao)} onClick={() => { handScan() }}></View>
<Input
onInput={(e) => {
handInput(e)
}}
placeholderStyle='color:#000000; font-size:26rpx'
className={styles.orderInput}
value={searchObj.orderNo}
placeholder={'请输入或扫描条形码'}></Input>
<View
className={classnames('iconfont', 'icon-saomiao', styles.saomiao)}
onClick={() => {
handScan()
}}></View>
</View>
</View>
<View className={styles.thirdBox}>
<View className={styles.thirdTopfont}>订单类型</View>
<View className={styles.flexModebox}>
{
modeList.map((item, index) => {
return (
<View onClick={() => { handCheckMode(item) }} className={classnames(item.checked ? styles.activemodeBox : styles.modeBox)} key={index}>{item.name}</View>
)
})
}
{modeList.map((item, index) => {
return (
<View
onClick={() => {
handCheckMode(item)
}}
className={classnames(item.checked ? styles.activemodeBox : styles.modeBox)}
key={index}>
{item.name}
</View>
)
})}
</View>
</View>
<View className={styles.thirdBox}>
<View className={styles.thirdTopfont}>发货方式</View>
<View className={styles.flexModebox}>
{
deliveryList.map((item, index) => {
return (
<View onClick={() => { handCheckDelivery(item) }} className={classnames(item.checked ? styles.activemodeBox : styles.modeBox)} key={index}>{item.name}</View>
)
})
}
{deliveryList.map((item, index) => {
return (
<View
onClick={() => {
handCheckDelivery(item)
}}
className={classnames(item.checked ? styles.activemodeBox : styles.modeBox)}
key={index}>
{item.name}
</View>
)
})}
</View>
</View>
<View>{isDisabled}</View>
<View style={{ height: '160rpx' }}></View>
<View className={styles.bottomBox}>
<Button className={styles.resetBox} onClick={() => { handReset() }}> 重置</Button >
<Button className={classnames(isDisabled ? styles.button : styles.activeButton)} disabled={isDisabled} onClick={() => { handSure?.() }}> 确认</Button >
<Button
className={styles.resetBox}
onClick={() => {
handReset()
}}>
{' '}
重置
</Button>
<Button
className={classnames(isDisabled ? styles.button : styles.activeButton)}
disabled={isDisabled}
onClick={() => {
handSure?.()
}}>
{' '}
确认
</Button>
</View>
{/* <View className={styles.areaBox}></View> */}
</View>
@@ -682,9 +716,8 @@ export default () => {
handsurePay={(obj) => handsurePay(obj)}
showSide={showSide}
title={title}
picUrl={picUrl}
></PayPopup>
picUrl={picUrl}></PayPopup>
<OfflinePay show={showOffline} onClose={() => setShowOffine(false)} offlineInfo={itemObj}></OfflinePay>
</View >
</View>
)
}
src/pages/shopping/components/shoppingCartItem/index.tsx
+22 -26
View File
@@ -1,5 +1,5 @@
import { Text, View } from '@tarojs/components'
import { memo, useCallback, useContext, useEffect, useMemo, useState } from 'react'
import { FC, memo, useCallback, useContext, useEffect, useMemo, useState } from 'react'
import styles from './index.module.scss'
import classnames from 'classnames'
import { formatPriceDiv } from '@/common/format'
@@ -27,9 +27,8 @@ const DrawerButton = memo<{ isOpen: boolean }>(({ isOpen }) => {
)
})
export default memo((props: PropsType) => {
// const { handleSelectedItem } = useLayoutBlockContext()
export default memo<PropsType>((props) => {
console.log('props==>', props)
const { itemData, selectedId } = props
console.log('重新渲染 shoppingCartItem', selectedId)
@@ -45,25 +44,22 @@ export default memo((props: PropsType) => {
setSelect(type)
}
const [mockList, setMockList] = useState(
{
0: [
{ id: 0, sale_mode: 0, roll: 5, length: 0, checked: true },
{ id: 1, sale_mode: 0, roll: 6, length: 0, checked: false },
{ id: 2, sale_mode: 0, roll: 7, length: 0, checked: true },
],
1: [
{ id: 5, sale_mode: 1, roll: 0, length: 77700, checked: false },
{ id: 6, sale_mode: 1, roll: 0, length: 7600, checked: true },
{ id: 7, sale_mode: 1, roll: 0, length: 400, checked: true },
],
2: [
{ id: 8, sale_mode: 2, roll: 0, length: 11100, checked: false },
{ id: 9, sale_mode: 2, roll: 0, length: 8540, checked: true },
],
}
)
// const [mockList, setMockList] = useState(itemData?.color_list)
const [mockList, setMockList] = useState({
0: [
{ id: 0, sale_mode: 0, roll: 5, length: 0, checked: true },
{ id: 1, sale_mode: 0, roll: 6, length: 0, checked: false },
{ id: 2, sale_mode: 0, roll: 7, length: 0, checked: true },
],
1: [
{ id: 5, sale_mode: 1, roll: 0, length: 77700, checked: false },
{ id: 6, sale_mode: 1, roll: 0, length: 7600, checked: true },
{ id: 7, sale_mode: 1, roll: 0, length: 400, checked: true },
],
2: [
{ id: 8, sale_mode: 2, roll: 0, length: 11100, checked: false },
{ id: 9, sale_mode: 2, roll: 0, length: 8540, checked: true },
],
})
const handleChecked = useCallback(
(current) => {
@@ -120,11 +116,11 @@ export default memo((props: PropsType) => {
console.log('itemData===>', itemData)
}
const {isManager} = useContext(ShoppingContext)
// const { isManager } = useContext(ShoppingContext)
return (
<LayoutBlock circle customClassName={classnames(styles.layout, itemData?.purchaser_id === selectedId ? styles.selected : '')} onClick={handleClickLayout}>
<MCheckbox customClassName={styles['checkbox']} customTextClass={styles['checkbox--text']} triggerLabel={false} hidden={isManager}>
<MCheckbox customClassName={styles['checkbox']} customTextClass={styles['checkbox--text']} triggerLabel={false}>
<View className='flex-row justify-between' onClick={handleOpenDetail}>
<View className={styles.topItem}>
<View className='flex-row items-center'>
@@ -135,7 +131,7 @@ export default memo((props: PropsType) => {
</View>
<View className={styles.summary}>
<Text>
已选 {mockList[selected].filter(item=>item.checked).length} 种面料，1 个颜色，共 {selected === EnumSaleMode.Bulk ? `${4} 条` : `${4} 米`}
已选 {mockList[selected].filter((item) => item.checked).length} 种面料，1 个颜色，共 {selected === EnumSaleMode.Bulk ? `${4} 条` : `${4} 米`}
</Text>
</View>
</View>
src/pages/shopping/index.tsx
+23 -19
View File
@@ -33,7 +33,7 @@ export const Shopping: FC = () => {
// 管理
const onStartToManage = () => {
setManage((isManage) => !isManage)
ShoppingContext.Consumer
// ShoppingContext.Consumer
}
const [selectedAmount, setSelectedAmount] = useState(0)
@@ -59,28 +59,31 @@ export const Shopping: FC = () => {
}, [shoppingCartData, state])
useDidShow(() => {
fetchData()
(async () => {
await fetchData()
let query = Taro.createSelectorQuery()
console.log('query', query)
query.select('#shoppingContainer').boundingClientRect()
query.select('#topBar').boundingClientRect()
query.select('#bottomBar').boundingClientRect()
query.exec((res) => {
console.log('res==>', res)
const containerHeight = res[0].height
const topBarHeight = res[1].height
const bottomBarHeight = res[2].height
const listHeight = containerHeight - topBarHeight - bottomBarHeight
setListHeight(listHeight + 'px')
})
})()
})
useEffect(() => {
setShoppingCartData({ list: state.data, total: state.data.length })
}, [state])
useEffect(() => {
let query = Taro.createSelectorQuery()
console.log(query)
query.select('#shoppingContainer').boundingClientRect()
query.select('#topBar').boundingClientRect()
query.select('#bottomBar').boundingClientRect()
query.exec((res) => {
const containerHeight = res[0].height
const topBarHeight = res[1].height
const bottomBarHeight = res[2].height
const listHeight = containerHeight - topBarHeight - bottomBarHeight
console.log('res==>', listHeight)
setListHeight(listHeight + 'px')
})
}, [])
useDidShow(() => {
})
const [selectedId, setSelectedId] = useState<number>()
@@ -105,8 +108,9 @@ export const Shopping: FC = () => {
<View className={classnames(styles.shopping__list__container, 'flex-item')} style={{ height: listHeight }}>
<ShoppingContext.Provider value={{isManager:false}}>
<InfiniteScroll statusMore={statusMore}>
{!!shoppingCartData.list?.length &&
shoppingCartData.list?.map((item, index) => {
{!!shoppingCartData?.list?.length &&
shoppingCartData?.list?.map((item, index) => {
console.log('item==>', item)
return <ItemList itemData={item} key={index} selectedId={selectedId}></ItemList>
})}
</InfiniteScroll>