Merge branch 'dev' of ssh://git.online.zzfzyc.com:10022/mp/spider_cloud_warehouse into 订单页
This commit is contained in:
Haiyi
@@ -0,0 +1,181 @@
|
||||
// 订单
|
||||
export const OrderForm = {
|
||||
summary: {
|
||||
summaryTitle: '订单总数',
|
||||
tips: '已成功下单的总单数',
|
||||
value: {
|
||||
num: '',
|
||||
cls: '',
|
||||
},
|
||||
total: {
|
||||
num: '',
|
||||
cls: '',
|
||||
},
|
||||
},
|
||||
form: {
|
||||
processing_order_number: {
|
||||
cellTitle: '待配布订单',
|
||||
tips: '已经预约和正在配布的订单数',
|
||||
value: {
|
||||
num: '',
|
||||
cls: '',
|
||||
},
|
||||
},
|
||||
processed_order_number: {
|
||||
cellTitle: '已配布订单',
|
||||
tips: '所有配完布、已批准发货、已经发货的订单总单数',
|
||||
value: {
|
||||
num: '',
|
||||
cls: '',
|
||||
},
|
||||
},
|
||||
},
|
||||
}
|
||||
// 配布
|
||||
export const ArrangedForm = {
|
||||
summary: {
|
||||
summaryTitle: '已配布匹数',
|
||||
tips: '所有配完布、已批准发货、已经发货的订单总匹数',
|
||||
value: {
|
||||
num: '',
|
||||
cls: '',
|
||||
},
|
||||
total: {
|
||||
num: '',
|
||||
cls: '',
|
||||
},
|
||||
},
|
||||
form: {
|
||||
wait_collect_order_number: {
|
||||
cellTitle: '待收款单数',
|
||||
tips: '已配完布但未批准发货的所有订单总单数',
|
||||
value: {
|
||||
num: '',
|
||||
cls: '',
|
||||
},
|
||||
},
|
||||
wait_collect_number: {
|
||||
cellTitle: '待收款匹数',
|
||||
tips: '已配完布但未批准发货的所有订单总匹数',
|
||||
value: {
|
||||
num: '',
|
||||
cls: '',
|
||||
},
|
||||
},
|
||||
wait_collect_amount_sum: {
|
||||
cellTitle: '待收款金额',
|
||||
tips: '已配完布但未批准发货的所有订单总金额',
|
||||
value: {
|
||||
num: '',
|
||||
cls: '',
|
||||
},
|
||||
},
|
||||
not_shipped_order_number: {
|
||||
cellTitle: '待发货单数',
|
||||
tips: '已批准发货但未发货出库的所有订单总单数',
|
||||
value: {
|
||||
num: '',
|
||||
cls: '',
|
||||
},
|
||||
},
|
||||
not_shipped_number: {
|
||||
cellTitle: '待发货匹数',
|
||||
tips: '已批准发货但未发货出库的所有订单总匹数',
|
||||
value: {
|
||||
num: '',
|
||||
cls: '',
|
||||
},
|
||||
},
|
||||
not_shipped_amount_sum: {
|
||||
cellTitle: '待发货金额',
|
||||
tips: '已批准发货但未发货出库的所有订单总金额',
|
||||
value: {
|
||||
num: '',
|
||||
cls: '',
|
||||
},
|
||||
},
|
||||
shipped_order_number: {
|
||||
cellTitle: '已发货单数',
|
||||
tips: '已经发货出库的所有订单总单数',
|
||||
value: {
|
||||
num: '',
|
||||
cls: '',
|
||||
},
|
||||
},
|
||||
shipped_number: {
|
||||
cellTitle: '已发货匹数',
|
||||
tips: '已经发货出库的所有订单总匹数',
|
||||
value: {
|
||||
num: '',
|
||||
cls: '',
|
||||
},
|
||||
},
|
||||
shipped_amount_sum: {
|
||||
cellTitle: '已发货金额',
|
||||
tips: '已经发货出库的所有订单总金额',
|
||||
value: {
|
||||
num: '',
|
||||
cls: '',
|
||||
},
|
||||
},
|
||||
},
|
||||
}
|
||||
// 货款
|
||||
export const PaymentAmountForm = {
|
||||
summary: {
|
||||
summaryTitle: '货款金额',
|
||||
tips: '已经发货出库的所有订单总金额',
|
||||
value: {
|
||||
num: '',
|
||||
cls: '',
|
||||
},
|
||||
},
|
||||
form: {
|
||||
amount_unreceived_sum: {
|
||||
cellTitle: '未收金额',
|
||||
tips: '已经批准发货出库但未收到货款的所有订单总金额',
|
||||
value: {
|
||||
num: '',
|
||||
cls: '',
|
||||
},
|
||||
},
|
||||
amount_received_sum: {
|
||||
cellTitle: '已收金额',
|
||||
tips: '已收且已经发货出库的所有订单总金额',
|
||||
value: {
|
||||
num: '',
|
||||
cls: '',
|
||||
},
|
||||
},
|
||||
},
|
||||
}
|
||||
// 退货
|
||||
export const ReturnGoodsOrderForm = {
|
||||
summary: {
|
||||
summaryTitle: '退货单数',
|
||||
tips: '已经完成退货入库的退货单总单数',
|
||||
value: {
|
||||
num: '',
|
||||
cls: '',
|
||||
},
|
||||
},
|
||||
form: {
|
||||
return_goods_number: {
|
||||
cellTitle: '退货匹数',
|
||||
tips: '已经完成退货入库的退货单总匹数',
|
||||
value: {
|
||||
num: '',
|
||||
cls: '',
|
||||
},
|
||||
},
|
||||
return_amount_sum: {
|
||||
cellTitle: '退货金额',
|
||||
tips: '已经完成退货入库的退货单总金额',
|
||||
value: {
|
||||
num: '',
|
||||
cls: '',
|
||||
},
|
||||
},
|
||||
},
|
||||
}
|
||||
|
||||
@@ -87,3 +87,5 @@ page {
|
||||
.amount {
|
||||
color: $color_main;
|
||||
}
|
||||
|
||||
|
||||
|
||||
+506
-324
@@ -1,166 +1,159 @@
|
||||
import AtCalendar from '@/components/calendar'
|
||||
import { ProductRankApi, PurchaserRankApi, SaleOrderDataFormApi, SalesmanRankApi } from '@/api/statistic/saleStatistic'
|
||||
import { formatPriceDiv, setPriceUnit, dataUnit } from '@/common/format'
|
||||
import { getFilterData } from '@/common/util'
|
||||
import Cell from '@/components/cell'
|
||||
import Divider from '@/components/Divider'
|
||||
import DropDownItem, { DropDownOptions } from '@/components/dropDown-item'
|
||||
import Iconfont from '@/components/iconfont/iconfont'
|
||||
import LayoutBlock from '@/components/layoutBlock'
|
||||
import SelectMarketingDepartment from '@/components/SelectMarketingDepartment'
|
||||
import SelectSaleRankingIndicators from '@/components/SelectSaleRankingIndicators'
|
||||
import SelectSaleType from '@/components/SelectSaleType'
|
||||
import SelectTimePicker, { ChangedValue } from '@/components/SelectTimePicker'
|
||||
import Table from '@/components/table'
|
||||
import TimePicker from '@/components/timePicker'
|
||||
import Table, { TablePropsType } from '@/components/table'
|
||||
import ToolTip from '@/components/toolTips'
|
||||
import { View, Text } from '@tarojs/components'
|
||||
import classnames from 'classnames'
|
||||
import dayjs from 'dayjs'
|
||||
import { useState } from 'react'
|
||||
import { memo, useCallback, useEffect, useRef, useState } from 'react'
|
||||
import styles from './index.module.scss'
|
||||
import { OrderForm, ArrangedForm, PaymentAmountForm, ReturnGoodsOrderForm } from './config'
|
||||
|
||||
//处理金额(后端单位分，转元)
|
||||
const priceformat = (val: number) => {
|
||||
return dataUnit(val / 100)
|
||||
}
|
||||
|
||||
const defaultLimit = 10
|
||||
|
||||
const FilterTimeOptions = {
|
||||
'0': {
|
||||
name: '今天',
|
||||
date_min: `${dayjs(new Date())
|
||||
.add(0, 'day')
|
||||
.format('YYYY-MM-DD')} 00:00:00`,
|
||||
date_max: `${dayjs(new Date())
|
||||
.add(1, 'day')
|
||||
.format('YYYY-MM-DD')} 00:00:00`,
|
||||
},
|
||||
'1': {
|
||||
name: '昨日',
|
||||
date_min: `${dayjs(new Date())
|
||||
.add(-1, 'day')
|
||||
.format('YYYY-MM-DD')} 00:00:00`,
|
||||
date_max: `${dayjs(new Date())
|
||||
.add(0, 'day')
|
||||
.format('YYYY-MM-DD')} 00:00:00`,
|
||||
},
|
||||
'2': {
|
||||
name: '近7日',
|
||||
date_min: `${dayjs(new Date())
|
||||
.add(-7, 'day')
|
||||
.format('YYYY-MM-DD')} 00:00:00`,
|
||||
date_max: `${dayjs(new Date())
|
||||
.add(0, 'day')
|
||||
.format('YYYY-MM-DD')} 00:00:00`,
|
||||
},
|
||||
'3': {
|
||||
name: '近30日',
|
||||
date_min: `${dayjs(new Date())
|
||||
.add(-30, 'day')
|
||||
.format('YYYY-MM-DD')} 00:00:00`,
|
||||
date_max: `${dayjs(new Date())
|
||||
.add(0, 'day')
|
||||
.format('YYYY-MM-DD')} 00:00:00`,
|
||||
},
|
||||
'4': {
|
||||
name: '近90日',
|
||||
date_min: `${dayjs(new Date())
|
||||
.add(-90, 'day')
|
||||
.format('YYYY-MM-DD')} 00:00:00`,
|
||||
date_max: `${dayjs(new Date())
|
||||
.add(0, 'day')
|
||||
.format('YYYY-MM-DD')} 00:00:00`,
|
||||
},
|
||||
}
|
||||
|
||||
// 销售统计
|
||||
const saleStatistic = () => {
|
||||
const onChangeTimePicker = (value: ChangedValue) => {
|
||||
const { fetchData } = SaleOrderDataFormApi()
|
||||
|
||||
const [saleType, setSaleType] = useState<number | null>(0)
|
||||
const [saleDepartmentId, setSaleDepartmentId] = useState<number | null>(null)
|
||||
const [dateRange, setDateRange] = useState({
|
||||
date_min: FilterTimeOptions[0].date_min,
|
||||
date_max: FilterTimeOptions[0].date_max,
|
||||
})
|
||||
|
||||
useEffect(() => {
|
||||
getData()
|
||||
}, [saleType, saleDepartmentId, dateRange])
|
||||
|
||||
const getData = async () => {
|
||||
const res = await fetchData(
|
||||
getFilterData({
|
||||
sale_type: saleType,
|
||||
sale_department_id: saleDepartmentId,
|
||||
date_min: dateRange.date_min,
|
||||
date_max: dateRange.date_max,
|
||||
}),
|
||||
)
|
||||
if (res.data) {
|
||||
// 订单
|
||||
OrderForm.summary.value = setPriceUnit(res.data.order_number)
|
||||
OrderForm.summary.total = setPriceUnit(res.data.total_roll)
|
||||
OrderForm.form.processed_order_number.value = setPriceUnit(res.data.processed_order_number)
|
||||
OrderForm.form.processing_order_number.value = setPriceUnit(res.data.processing_order_number)
|
||||
// 配布
|
||||
ArrangedForm.summary.total = setPriceUnit(res.data.arranged_amount_sum)
|
||||
ArrangedForm.summary.value = setPriceUnit(res.data.arranged_number)
|
||||
ArrangedForm.form.not_shipped_amount_sum.value = setPriceUnit(formatPriceDiv(res.data.not_shipped_amount_sum) as number)
|
||||
ArrangedForm.form.not_shipped_number.value = setPriceUnit(res.data.not_shipped_amount_sum)
|
||||
ArrangedForm.form.not_shipped_order_number.value = setPriceUnit(res.data.not_shipped_order_number)
|
||||
ArrangedForm.form.shipped_amount_sum.value = setPriceUnit(formatPriceDiv(res.data.shipped_amount_sum) as number)
|
||||
ArrangedForm.form.shipped_number.value = setPriceUnit(res.data.shipped_number)
|
||||
ArrangedForm.form.shipped_order_number.value = setPriceUnit(res.data.shipped_order_number)
|
||||
ArrangedForm.form.wait_collect_amount_sum.value = setPriceUnit(formatPriceDiv(res.data.wait_collect_amount_sum) as number)
|
||||
ArrangedForm.form.wait_collect_number.value = setPriceUnit(res.data.wait_collect_number)
|
||||
ArrangedForm.form.wait_collect_order_number.value = setPriceUnit(res.data.wait_collect_order_number)
|
||||
// 货款
|
||||
PaymentAmountForm.summary.value = setPriceUnit(formatPriceDiv(res.data.payment_amount_sum) as number)
|
||||
PaymentAmountForm.form.amount_received_sum.value = setPriceUnit(formatPriceDiv(res.data.amount_received_sum) as number)
|
||||
PaymentAmountForm.form.amount_unreceived_sum.value = setPriceUnit(formatPriceDiv(res.data.amount_unreceived_sum) as number)
|
||||
// 退货
|
||||
ReturnGoodsOrderForm.summary.value = setPriceUnit(res.data.return_goods_order_number)
|
||||
ReturnGoodsOrderForm.form.return_amount_sum.value = setPriceUnit(formatPriceDiv(res.data.return_amount_sum) as number)
|
||||
ReturnGoodsOrderForm.form.return_goods_number.value = setPriceUnit(res.data.return_goods_number)
|
||||
console.log(res.data)
|
||||
}
|
||||
}
|
||||
|
||||
const onChangeTimePicker = useCallback((value: ChangedValue) => {
|
||||
console.log(value)
|
||||
}
|
||||
const onChangeSaleType = (saleType: number) => {
|
||||
setDateRange({
|
||||
date_max: value[1],
|
||||
date_min: value[0],
|
||||
})
|
||||
}, [])
|
||||
|
||||
const onChangeSaleType = useCallback((saleType: number) => {
|
||||
console.log('saleType', saleType)
|
||||
}
|
||||
const onChangeDepartment = (department: number) => {
|
||||
// 全部
|
||||
if (saleType === -1) {
|
||||
setSaleType(null)
|
||||
} else {
|
||||
setSaleType(saleType)
|
||||
}
|
||||
}, [])
|
||||
|
||||
const onChangeDepartment = useCallback((department: number) => {
|
||||
console.log('department', department)
|
||||
}
|
||||
|
||||
const onChangeIndicators = (indicators: number) => {
|
||||
console.log('indicators', indicators)
|
||||
}
|
||||
|
||||
//需要传进来的数据示例
|
||||
const exampledataSource = [
|
||||
{
|
||||
key: '1',
|
||||
username: '小红',
|
||||
count: '123打发手动阀手动阀啊手动阀',
|
||||
gb: '321',
|
||||
dbd: '¥6634.93w',
|
||||
},
|
||||
{
|
||||
key: '2',
|
||||
username: '小红',
|
||||
count: '123',
|
||||
gb: '321',
|
||||
dbd: '¥6634.93w',
|
||||
},
|
||||
{
|
||||
key: '3',
|
||||
username: '小红',
|
||||
count: '123',
|
||||
gb: '321',
|
||||
dbd: '¥6634.93w',
|
||||
},
|
||||
{
|
||||
key: '4',
|
||||
username: '小红',
|
||||
count: '123',
|
||||
gb: '321',
|
||||
dbd: '¥6634.93w',
|
||||
},
|
||||
{
|
||||
key: '5',
|
||||
username: '小红',
|
||||
count: '123',
|
||||
gb: '321',
|
||||
dbd: '¥6634.93w',
|
||||
},
|
||||
{
|
||||
key: '6',
|
||||
username: '小红',
|
||||
count: '123',
|
||||
gb: '321',
|
||||
dbd: '¥6634.93w',
|
||||
},
|
||||
{
|
||||
key: '7',
|
||||
username: '小红',
|
||||
count: '123',
|
||||
gb: '321',
|
||||
dbd: '¥6634.93w',
|
||||
},
|
||||
{
|
||||
key: '8',
|
||||
username: '小红',
|
||||
count: '123',
|
||||
gb: '321',
|
||||
dbd: '¥6634.93w',
|
||||
},
|
||||
{
|
||||
key: '9',
|
||||
username: '小红',
|
||||
count: '123',
|
||||
gb: '321',
|
||||
dbd: '¥6634.93w',
|
||||
},
|
||||
{
|
||||
key: '10',
|
||||
username: '小红',
|
||||
count: '123',
|
||||
gb: '321',
|
||||
dbd: '¥6634.93w',
|
||||
},
|
||||
]
|
||||
|
||||
//需要传进来的表头数据示例
|
||||
const examplecolumns = [
|
||||
{
|
||||
key: 'username',
|
||||
title: '编号',
|
||||
dataIndex: 'username',
|
||||
width: '20%',
|
||||
},
|
||||
{
|
||||
key: 'count',
|
||||
title: '面料名称',
|
||||
dataIndex: 'count',
|
||||
width: '20%',
|
||||
ellipsis: {
|
||||
isEllipsis: true,
|
||||
rows: 2,
|
||||
},
|
||||
},
|
||||
{
|
||||
key: 'gb',
|
||||
title: '匹数',
|
||||
dataIndex: 'gb',
|
||||
width: '30%',
|
||||
},
|
||||
{
|
||||
key: 'dbd',
|
||||
title: '交易金额',
|
||||
dataIndex: 'dbd',
|
||||
width: '30%',
|
||||
render: (text: string) => <Text className={styles.amount}>{text}</Text>,
|
||||
},
|
||||
]
|
||||
|
||||
const tabsConfig = [
|
||||
{
|
||||
name: '面料',
|
||||
key: 0,
|
||||
},
|
||||
{
|
||||
name: '客户',
|
||||
key: 1,
|
||||
},
|
||||
{
|
||||
name: '业务员',
|
||||
key: 2,
|
||||
},
|
||||
]
|
||||
|
||||
const [currentKey, setCurrentKey] = useState(tabsConfig[0].key)
|
||||
|
||||
const handleClickTab = event => {
|
||||
const key = event.target.dataset.key
|
||||
if (key === currentKey) return
|
||||
setCurrentKey(key)
|
||||
}
|
||||
// 全部
|
||||
if (department === -1) {
|
||||
setSaleDepartmentId(null)
|
||||
} else {
|
||||
setSaleDepartmentId(department)
|
||||
}
|
||||
}, [])
|
||||
|
||||
return (
|
||||
<View className={styles.saleStatistic}>
|
||||
@@ -168,7 +161,7 @@ const saleStatistic = () => {
|
||||
<View className={styles['saleStatistic--filterBar']}>
|
||||
<SelectSaleType onChange={onChangeSaleType}></SelectSaleType>
|
||||
<SelectMarketingDepartment onChange={onChangeDepartment}></SelectMarketingDepartment>
|
||||
<SelectTimePicker onChange={onChangeTimePicker}></SelectTimePicker>
|
||||
<SelectTimePicker onChange={onChangeTimePicker} defaultValue='0' timeOptions={FilterTimeOptions}></SelectTimePicker>
|
||||
</View>
|
||||
<View className={styles['saleStatistic--content']}>
|
||||
<LayoutBlock circle flexDirection='col'>
|
||||
@@ -178,33 +171,35 @@ const saleStatistic = () => {
|
||||
</View>
|
||||
<Divider direction='horizontal' customStyles={{ margin: '30rpx 0' }}></Divider>
|
||||
<View className={styles.totalSummary}>
|
||||
<ToolTip placement='top' content='请填入提示信息'>
|
||||
<ToolTip placement='top' content={OrderForm.summary.tips}>
|
||||
<View className='flex-row items-center'>
|
||||
<Text className={styles['totalSummary--title']}>订单总数</Text>
|
||||
<Text className={styles['totalSummary--title']}>{OrderForm.summary.summaryTitle}</Text>
|
||||
<Iconfont name='icon-tishi' size={36} color='#707070'></Iconfont>
|
||||
</View>
|
||||
</ToolTip>
|
||||
<View className={styles['totalSummary--current']}>3425</View>
|
||||
<View className={styles['totalSummary--totalNum']}>（共432423匹）</View>
|
||||
<View className={classnames(styles['totalSummary--current'], OrderForm.summary.value.cls)}>{OrderForm.summary.value.num}</View>
|
||||
<View className={classnames(styles['totalSummary--totalNum'])}>
|
||||
（共 <Text className={OrderForm.summary.total.cls}>{OrderForm.summary.total.num}</Text>
|
||||
匹）
|
||||
</View>
|
||||
</View>
|
||||
<Cell
|
||||
title={
|
||||
<View className='flex-row items-center'>
|
||||
<Text className={styles.title}>待配布订单</Text>
|
||||
<Iconfont name='icon-tishi' size={36}></Iconfont>
|
||||
</View>
|
||||
}
|
||||
desc={'323'}
|
||||
customClassName={styles['cell-desc']}></Cell>
|
||||
<Cell
|
||||
title={
|
||||
<View className='flex-row items-center'>
|
||||
<Text className={styles.title}>已配布订单</Text>
|
||||
<Iconfont name='icon-tishi' size={36}></Iconfont>
|
||||
</View>
|
||||
}
|
||||
desc={'2972'}
|
||||
customClassName={styles['cell-desc']}></Cell>
|
||||
{Object.entries(OrderForm.form).map(([key, value]) => {
|
||||
return (
|
||||
<Cell
|
||||
key={key}
|
||||
title={
|
||||
<ToolTip placement='top' content={value.tips}>
|
||||
<View className='flex-row items-center'>
|
||||
<Text className={styles.title}>{value.cellTitle}</Text>
|
||||
<Iconfont name='icon-tishi' size={36}></Iconfont>
|
||||
</View>
|
||||
</ToolTip>
|
||||
}
|
||||
desc={value.value.num}
|
||||
customDescClassName={value.value.cls}
|
||||
customClassName={styles['cell-desc']}></Cell>
|
||||
)
|
||||
})}
|
||||
</LayoutBlock>
|
||||
<LayoutBlock circle flexDirection='col'>
|
||||
<View className='flex-row items-center'>
|
||||
@@ -213,96 +208,37 @@ const saleStatistic = () => {
|
||||
</View>
|
||||
<Divider direction='horizontal' customStyles={{ margin: '30rpx 0' }}></Divider>
|
||||
<View className={styles.totalSummary}>
|
||||
<View className='flex-row items-center'>
|
||||
<Text className={styles['totalSummary--title']}>已配布匹数</Text>
|
||||
<Iconfont name='icon-tishi' size={36} color='#707070'></Iconfont>
|
||||
<ToolTip placement='top' content={ArrangedForm.summary.tips}>
|
||||
<View className='flex-row items-center'>
|
||||
<Text className={styles['totalSummary--title']}>{ArrangedForm.summary.summaryTitle}</Text>
|
||||
<Iconfont name='icon-tishi' size={36} color='#707070'></Iconfont>
|
||||
</View>
|
||||
</ToolTip>
|
||||
<View className={classnames(styles['totalSummary--current'], ArrangedForm.summary.value.cls)}>{ArrangedForm.summary.value.num}</View>
|
||||
<View className={classnames(styles['totalSummary--totalNum'])}>
|
||||
（共计 <Text className={ArrangedForm.summary.total.cls}>{ArrangedForm.summary.total.num}</Text>）
|
||||
</View>
|
||||
<View className={styles['totalSummary--current']}>3425</View>
|
||||
<View className={styles['totalSummary--totalNum']}>（共计 ¥231.23w）</View>
|
||||
</View>
|
||||
<Cell
|
||||
title={
|
||||
<View className='flex-row items-center'>
|
||||
<Text className={styles.title}>待收款单数</Text>
|
||||
<Iconfont name='icon-tishi' size={36}></Iconfont>
|
||||
</View>
|
||||
}
|
||||
desc={'323'}
|
||||
customClassName={styles['cell-desc']}></Cell>
|
||||
<Cell
|
||||
title={
|
||||
<View className='flex-row items-center'>
|
||||
<Text className={styles.title}>待收款匹数</Text>
|
||||
<Iconfont name='icon-tishi' size={36}></Iconfont>
|
||||
</View>
|
||||
}
|
||||
desc={'2972'}
|
||||
customClassName={styles['cell-desc']}></Cell>
|
||||
<Cell
|
||||
title={
|
||||
<View className='flex-row items-center'>
|
||||
<Text className={styles.title}>待收款金额</Text>
|
||||
<Iconfont name='icon-tishi' size={36}></Iconfont>
|
||||
</View>
|
||||
}
|
||||
desc={'2972'}
|
||||
customClassName={styles['cell-desc']}></Cell>
|
||||
<Divider direction='horizontal' customStyles={{ margin: '30rpx 0' }}></Divider>
|
||||
<Cell
|
||||
title={
|
||||
<View className='flex-row items-center'>
|
||||
<Text className={styles.title}>待发货单数</Text>
|
||||
<Iconfont name='icon-tishi' size={36}></Iconfont>
|
||||
</View>
|
||||
}
|
||||
desc={'323'}
|
||||
customClassName={styles['cell-desc']}></Cell>
|
||||
<Cell
|
||||
title={
|
||||
<View className='flex-row items-center'>
|
||||
<Text className={styles.title}>待发货匹数</Text>
|
||||
<Iconfont name='icon-tishi' size={36}></Iconfont>
|
||||
</View>
|
||||
}
|
||||
desc={'2972'}
|
||||
customClassName={styles['cell-desc']}></Cell>
|
||||
<Cell
|
||||
title={
|
||||
<View className='flex-row items-center'>
|
||||
<Text className={styles.title}>待发货金额</Text>
|
||||
<Iconfont name='icon-tishi' size={36}></Iconfont>
|
||||
</View>
|
||||
}
|
||||
desc={'2972'}
|
||||
customClassName={styles['cell-desc']}></Cell>
|
||||
<Divider direction='horizontal' customStyles={{ margin: '30rpx 0' }}></Divider>
|
||||
<Cell
|
||||
title={
|
||||
<View className='flex-row items-center'>
|
||||
<Text className={styles.title}>已发货单数</Text>
|
||||
<Iconfont name='icon-tishi' size={36}></Iconfont>
|
||||
</View>
|
||||
}
|
||||
desc={'2972'}
|
||||
customClassName={styles['cell-desc']}></Cell>
|
||||
<Cell
|
||||
title={
|
||||
<View className='flex-row items-center'>
|
||||
<Text className={styles.title}>已发货匹数</Text>
|
||||
<Iconfont name='icon-tishi' size={36}></Iconfont>
|
||||
</View>
|
||||
}
|
||||
desc={'2972'}
|
||||
customClassName={styles['cell-desc']}></Cell>
|
||||
<Cell
|
||||
title={
|
||||
<View className='flex-row items-center'>
|
||||
<Text className={styles.title}>已发货金额</Text>
|
||||
<Iconfont name='icon-tishi' size={36}></Iconfont>
|
||||
</View>
|
||||
}
|
||||
desc={'2972'}
|
||||
customClassName={styles['cell-desc']}></Cell>
|
||||
{Object.entries(ArrangedForm.form).map(([key, value], index) => {
|
||||
return (
|
||||
<>
|
||||
<Cell
|
||||
key={key}
|
||||
title={
|
||||
<ToolTip placement='top' content={value.tips}>
|
||||
<View className='flex-row items-center'>
|
||||
<Text className={styles.title}>{value.cellTitle}</Text>
|
||||
<Iconfont name='icon-tishi' size={36}></Iconfont>
|
||||
</View>
|
||||
</ToolTip>
|
||||
}
|
||||
desc={value.value.num}
|
||||
customDescClassName={value.value.cls}
|
||||
customClassName={styles['cell-desc']}></Cell>
|
||||
{(index + 1) % 3 === 0 && <Divider direction='horizontal' customStyles={{ margin: '30rpx 0' }}></Divider>}
|
||||
</>
|
||||
)
|
||||
})}
|
||||
</LayoutBlock>
|
||||
<LayoutBlock circle flexDirection='col'>
|
||||
<View className='flex-row items-center'>
|
||||
@@ -311,30 +247,31 @@ const saleStatistic = () => {
|
||||
</View>
|
||||
<Divider direction='horizontal' customStyles={{ margin: '30rpx 0' }}></Divider>
|
||||
<View className={styles.totalSummary}>
|
||||
<View className='flex-row items-center'>
|
||||
<Text className={styles['totalSummary--title']}>货款金额</Text>
|
||||
<Iconfont name='icon-tishi' size={36} color='#707070'></Iconfont>
|
||||
</View>
|
||||
<View className={styles['totalSummary--current']}>56133.32</View>
|
||||
<ToolTip placement='top' content={PaymentAmountForm.summary.tips}>
|
||||
<View className='flex-row items-center'>
|
||||
<Text className={styles['totalSummary--title']}>{PaymentAmountForm.summary.summaryTitle}</Text>
|
||||
<Iconfont name='icon-tishi' size={36} color='#707070'></Iconfont>
|
||||
</View>
|
||||
</ToolTip>
|
||||
<View className={classnames(styles['totalSummary--current'], PaymentAmountForm.summary.value.cls)}>{PaymentAmountForm.summary.value.num}</View>
|
||||
</View>
|
||||
<Cell
|
||||
title={
|
||||
<View className='flex-row items-center'>
|
||||
<Text className={styles.title}>未收金额</Text>
|
||||
<Iconfont name='icon-tishi' size={36}></Iconfont>
|
||||
</View>
|
||||
}
|
||||
desc={'2972'}
|
||||
customClassName={styles['cell-desc']}></Cell>
|
||||
<Cell
|
||||
title={
|
||||
<View className='flex-row items-center'>
|
||||
<Text className={styles.title}>已收金额</Text>
|
||||
<Iconfont name='icon-tishi' size={36}></Iconfont>
|
||||
</View>
|
||||
}
|
||||
desc={'2972'}
|
||||
customClassName={styles['cell-desc']}></Cell>
|
||||
{Object.entries(PaymentAmountForm.form).map(([key, value]) => {
|
||||
return (
|
||||
<Cell
|
||||
key={key}
|
||||
title={
|
||||
<ToolTip placement='top' content={value.tips}>
|
||||
<View className='flex-row items-center'>
|
||||
<Text className={styles.title}>{value.cellTitle}</Text>
|
||||
<Iconfont name='icon-tishi' size={36}></Iconfont>
|
||||
</View>
|
||||
</ToolTip>
|
||||
}
|
||||
desc={value.value.num}
|
||||
customDescClassName={value.value.cls}
|
||||
customClassName={styles['cell-desc']}></Cell>
|
||||
)
|
||||
})}
|
||||
</LayoutBlock>
|
||||
<LayoutBlock circle flexDirection='col'>
|
||||
<View className='flex-row items-center'>
|
||||
@@ -343,59 +280,304 @@ const saleStatistic = () => {
|
||||
</View>
|
||||
<Divider direction='horizontal' customStyles={{ margin: '30rpx 0' }}></Divider>
|
||||
<View className={styles.totalSummary}>
|
||||
<View className='flex-row items-center'>
|
||||
<Text className={styles['totalSummary--title']}>退货单数</Text>
|
||||
<Iconfont name='icon-tishi' size={36} color='#707070'></Iconfont>
|
||||
</View>
|
||||
<View className={styles['totalSummary--current']}>42</View>
|
||||
</View>
|
||||
<Cell
|
||||
title={
|
||||
<ToolTip placement='top' content={ReturnGoodsOrderForm.summary.tips}>
|
||||
<View className='flex-row items-center'>
|
||||
<Text className={styles.title}>退货匹数</Text>
|
||||
<Iconfont name='icon-tishi' size={36}></Iconfont>
|
||||
<Text className={styles['totalSummary--title']}>{ReturnGoodsOrderForm.summary.summaryTitle}</Text>
|
||||
<Iconfont name='icon-tishi' size={36} color='#707070'></Iconfont>
|
||||
</View>
|
||||
}
|
||||
desc={'2972'}
|
||||
customClassName={styles['cell-desc']}></Cell>
|
||||
<Cell
|
||||
title={
|
||||
<View className='flex-row items-center'>
|
||||
<Text className={styles.title}>退货金额</Text>
|
||||
<Iconfont name='icon-tishi' size={36}></Iconfont>
|
||||
</View>
|
||||
}
|
||||
desc={'2972'}
|
||||
customClassName={styles['cell-desc']}></Cell>
|
||||
</LayoutBlock>
|
||||
{/* 销售排行 */}
|
||||
<LayoutBlock circle flexDirection='col' customStyle={{ padding: 0 }}>
|
||||
<View className={classnames(styles.rankingIndicatorTitle, 'flex-row justify-between')} style={{ position: 'relative' }}>
|
||||
<View className='flex-row items-center'>
|
||||
<Iconfont name='icon-paiming' size={32}></Iconfont>
|
||||
<Text className={styles.title}>销售排行</Text>
|
||||
</View>
|
||||
<View style={{ width: '90px' }}>
|
||||
<SelectSaleRankingIndicators onChange={onChangeIndicators}></SelectSaleRankingIndicators>
|
||||
</ToolTip>
|
||||
<View className={classnames(styles['totalSummary--current'], ReturnGoodsOrderForm.summary.value.cls)}>
|
||||
{ReturnGoodsOrderForm.summary.value.num}
|
||||
</View>
|
||||
</View>
|
||||
<View style={{ padding: '0 32rpx' }}>
|
||||
<Divider direction='horizontal' customStyles={{ margin: '10rpx 0 30rpx 0' }}></Divider>
|
||||
<View className={styles.rankingTabs} onClick={handleClickTab}>
|
||||
{tabsConfig.map(item => {
|
||||
return (
|
||||
<View data-key={item.key} className={classnames(styles.rankingTab, item.key === currentKey ? styles.active : '')} key={item.key}>
|
||||
{item.name}
|
||||
</View>
|
||||
)
|
||||
})}
|
||||
</View>
|
||||
<Table columns={examplecolumns} dataSource={exampledataSource}></Table>
|
||||
</View>
|
||||
{Object.entries(ReturnGoodsOrderForm.form).map(([key, value]) => {
|
||||
return (
|
||||
<Cell
|
||||
key={key}
|
||||
title={
|
||||
<ToolTip placement='top' content={value.tips}>
|
||||
<View className='flex-row items-center'>
|
||||
<Text className={styles.title}>{value.cellTitle}</Text>
|
||||
<Iconfont name='icon-tishi' size={36}></Iconfont>
|
||||
</View>
|
||||
</ToolTip>
|
||||
}
|
||||
desc={value.value.num}
|
||||
customDescClassName={value.value.cls}
|
||||
customClassName={styles['cell-desc']}></Cell>
|
||||
)
|
||||
})}
|
||||
</LayoutBlock>
|
||||
<RankingBlock saleType={saleType} saleDepartmentId={saleDepartmentId} date_min={dateRange.date_min} date_max={dateRange.date_max}></RankingBlock>
|
||||
</View>
|
||||
</View>
|
||||
)
|
||||
}
|
||||
|
||||
//需要传进来的数据示例
|
||||
|
||||
//需要传进来的表头数据示例
|
||||
const productRankingColumns = [
|
||||
{
|
||||
key: 'index',
|
||||
title: '编号',
|
||||
dataIndex: 'index',
|
||||
width: '20%',
|
||||
},
|
||||
{
|
||||
key: 'product_name',
|
||||
title: '面料名称',
|
||||
dataIndex: 'product_name',
|
||||
width: '20%',
|
||||
ellipsis: {
|
||||
isEllipsis: true,
|
||||
rows: 2,
|
||||
},
|
||||
},
|
||||
{
|
||||
key: 'roll',
|
||||
title: '匹数',
|
||||
dataIndex: 'roll',
|
||||
width: '30%',
|
||||
},
|
||||
{
|
||||
key: 'sales_amount',
|
||||
title: '交易金额',
|
||||
dataIndex: 'sales_amount',
|
||||
width: '30%',
|
||||
render: (text: string) => <Text className={styles.amount}>{text}</Text>,
|
||||
},
|
||||
]
|
||||
|
||||
//需要传进来的表头数据示例
|
||||
const purchaserRankingColumns = [
|
||||
{
|
||||
key: 'index',
|
||||
title: '编号',
|
||||
dataIndex: 'index',
|
||||
width: '20%',
|
||||
},
|
||||
{
|
||||
key: 'purchaser_name',
|
||||
title: '客户名称',
|
||||
dataIndex: 'purchaser_name',
|
||||
width: '20%',
|
||||
ellipsis: {
|
||||
isEllipsis: true,
|
||||
rows: 2,
|
||||
},
|
||||
},
|
||||
{
|
||||
key: 'roll',
|
||||
title: '交易匹数',
|
||||
dataIndex: 'roll',
|
||||
width: '30%',
|
||||
},
|
||||
{
|
||||
key: 'sales_amount',
|
||||
title: '交易金额',
|
||||
dataIndex: 'sales_amount',
|
||||
width: '30%',
|
||||
render: (text: string) => <Text className={styles.amount}>{text}</Text>,
|
||||
},
|
||||
]
|
||||
|
||||
//需要传进来的表头数据示例
|
||||
const salesmanRankingColumns = [
|
||||
{
|
||||
key: 'index',
|
||||
title: '编号',
|
||||
dataIndex: 'index',
|
||||
width: '20%',
|
||||
},
|
||||
{
|
||||
key: 'sale_user_name',
|
||||
title: '业务员名称',
|
||||
dataIndex: 'sale_user_name',
|
||||
width: '25%',
|
||||
ellipsis: {
|
||||
isEllipsis: true,
|
||||
rows: 2,
|
||||
},
|
||||
},
|
||||
{
|
||||
key: 'roll',
|
||||
title: '销售匹数',
|
||||
dataIndex: 'roll',
|
||||
width: '25%',
|
||||
},
|
||||
{
|
||||
key: 'sales_amount',
|
||||
title: '销售金额',
|
||||
dataIndex: 'sales_amount',
|
||||
width: '30%',
|
||||
render: (text: string) => <Text className={styles.amount}>{text}</Text>,
|
||||
},
|
||||
]
|
||||
|
||||
const tabsConfig = [
|
||||
{
|
||||
name: '面料',
|
||||
key: 0,
|
||||
},
|
||||
{
|
||||
name: '客户',
|
||||
key: 1,
|
||||
},
|
||||
{
|
||||
name: '业务员',
|
||||
key: 2,
|
||||
},
|
||||
]
|
||||
|
||||
interface RankingBlockPropsType {
|
||||
saleType?: number | null
|
||||
saleDepartmentId?: number | null
|
||||
date_min?: string
|
||||
date_max?: string
|
||||
}
|
||||
// 销售排行
|
||||
const RankingBlock = memo<RankingBlockPropsType>(props => {
|
||||
const { saleType, saleDepartmentId, date_min, date_max } = props
|
||||
|
||||
const { fetchData: fetchProductRank } = ProductRankApi()
|
||||
const { fetchData: fetchPurchaserRank } = PurchaserRankApi()
|
||||
const { fetchData: fetchSalesmanRank } = SalesmanRankApi()
|
||||
|
||||
let [limit, setLimit] = useState(defaultLimit)
|
||||
|
||||
const [indicator, setIndicator] = useState<number | null>(null)
|
||||
|
||||
// 切换排行指标
|
||||
const onChangeIndicators = useCallback((indicators: number) => {
|
||||
console.log('indicators', indicators)
|
||||
if (indicators === -1) {
|
||||
setIndicator(null)
|
||||
} else {
|
||||
setIndicator(indicators)
|
||||
}
|
||||
}, [])
|
||||
|
||||
const [currentKey, setCurrentKey] = useState(tabsConfig[0].key)
|
||||
|
||||
const handleClickTab = event => {
|
||||
const key = event.target.dataset.key
|
||||
if (key === currentKey) return
|
||||
setCurrentKey(key)
|
||||
setLimit(defaultLimit)
|
||||
}
|
||||
|
||||
const getData = useCallback(
|
||||
async (tabKey: number) => {
|
||||
let res: any
|
||||
const payload = {
|
||||
limit,
|
||||
saleType,
|
||||
saleDepartmentId,
|
||||
date_min,
|
||||
date_max,
|
||||
data_form_status: indicator,
|
||||
}
|
||||
if (tabKey === 0) {
|
||||
res = await fetchProductRank(getFilterData(payload))
|
||||
} else if (tabKey === 1) {
|
||||
res = await fetchPurchaserRank(getFilterData(payload))
|
||||
} else {
|
||||
res = await fetchSalesmanRank(getFilterData(payload))
|
||||
}
|
||||
if (res.data) {
|
||||
console.log('排名', res.data)
|
||||
if (tabKey === 0) {
|
||||
setCurrentTable(() => ({
|
||||
columns: productRankingColumns,
|
||||
dataSource: {
|
||||
list: res.data.list.map((item, index: number) => ({
|
||||
key: index,
|
||||
index: index + 1,
|
||||
product_name: item.product_name || '--',
|
||||
sales_amount: `￥${priceformat(item.sales_amount)}`,
|
||||
roll: dataUnit(item.roll),
|
||||
})),
|
||||
total: res.data.total,
|
||||
},
|
||||
}))
|
||||
} else if (tabKey === 1) {
|
||||
setCurrentTable(() => ({
|
||||
columns: purchaserRankingColumns,
|
||||
dataSource: {
|
||||
list: res.data.list.map((item, index: number) => ({
|
||||
key: index,
|
||||
index: index + 1,
|
||||
purchaser_name: item.purchaser_name || '--',
|
||||
sales_amount: `￥${priceformat(item.sales_amount)}`,
|
||||
roll: dataUnit(item.roll),
|
||||
})),
|
||||
total: res.data.total,
|
||||
},
|
||||
}))
|
||||
} else {
|
||||
setCurrentTable(() => ({
|
||||
columns: salesmanRankingColumns,
|
||||
dataSource: {
|
||||
list: res.data.list.map((item, index: number) => ({
|
||||
key: index,
|
||||
index: index + 1,
|
||||
sale_user_name: item.sale_user_name || '--',
|
||||
sales_amount: `￥${priceformat(item.sales_amount)}`,
|
||||
roll: dataUnit(item.roll),
|
||||
})),
|
||||
total: res.data.total,
|
||||
},
|
||||
}))
|
||||
}
|
||||
}
|
||||
},
|
||||
[limit, saleType, saleDepartmentId, date_min, date_max, indicator],
|
||||
)
|
||||
|
||||
useEffect(() => {
|
||||
getData(currentKey)
|
||||
}, [currentKey, getData])
|
||||
|
||||
const handleLoadMore = () => {
|
||||
console.log('loadmore')
|
||||
// TODO（优化）：结合接口的offset 和 limit 分段请求接口然后通过 push 将旧数据和新数据拼接起来
|
||||
setLimit(v => v + defaultLimit)
|
||||
}
|
||||
|
||||
const [currentTable, setCurrentTable] = useState<TablePropsType>({
|
||||
columns: productRankingColumns,
|
||||
})
|
||||
|
||||
return (
|
||||
<>
|
||||
{/* 销售排行 */}
|
||||
<LayoutBlock circle flexDirection='col' customStyle={{ padding: 0 }}>
|
||||
<View className={classnames(styles.rankingIndicatorTitle, 'flex-row justify-between')} style={{ position: 'relative' }}>
|
||||
<View className='flex-row items-center'>
|
||||
<Iconfont name='icon-paiming' size={32}></Iconfont>
|
||||
<Text className={styles.title}>销售排行</Text>
|
||||
</View>
|
||||
<View style={{ width: '90px' }}>
|
||||
<SelectSaleRankingIndicators onChange={onChangeIndicators}></SelectSaleRankingIndicators>
|
||||
</View>
|
||||
</View>
|
||||
<View style={{ padding: '0 32rpx' }}>
|
||||
<Divider direction='horizontal' customStyles={{ margin: '10rpx 0 30rpx 0' }}></Divider>
|
||||
<View className={styles.rankingTabs} onClick={handleClickTab}>
|
||||
{tabsConfig.map(item => {
|
||||
return (
|
||||
<View data-key={item.key} className={classnames(styles.rankingTab, item.key === currentKey ? styles.active : '')} key={item.key}>
|
||||
{item.name}
|
||||
</View>
|
||||
)
|
||||
})}
|
||||
</View>
|
||||
<Table columns={currentTable.columns} dataSource={currentTable.dataSource} onLoadMore={handleLoadMore}></Table>
|
||||
</View>
|
||||
</LayoutBlock>
|
||||
</>
|
||||
)
|
||||
})
|
||||
|
||||
export default saleStatistic
|
||||
|
||||
@@ -22,7 +22,7 @@ export default memo<PropsType>((props) => {
|
||||
<Text className={styles.moneyText}>预估金额：</Text>
|
||||
<Text className={styles.moneyNumber}>
|
||||
<Text className={styles.unit}>¥</Text>
|
||||
{amount}
|
||||
{amount.toFixed(2)}
|
||||
</Text>
|
||||
</View>
|
||||
<View className={styles.bottomRight}>
|
||||
|
||||
@@ -1,21 +1,20 @@
|
||||
import Search from '@/components/search'
|
||||
import { View } from '@tarojs/components'
|
||||
import Taro, { useDidShow } from '@tarojs/taro'
|
||||
import React, { FC, memo, useCallback, useContext, useEffect, useLayoutEffect, useMemo, useRef, useState } from 'react'
|
||||
import Taro, { useDidHide, useDidShow, useRouter } from '@tarojs/taro'
|
||||
import React, { FC, memo, useCallback, useEffect, useLayoutEffect, useMemo, useRef, useState } from 'react'
|
||||
import styles from './index.module.scss'
|
||||
import classnames from 'classnames'
|
||||
import IconText from '@/components/iconText'
|
||||
import InfiniteScroll from '@/components/infiniteScroll'
|
||||
import ItemList from './components/shoppingCartItem/index'
|
||||
import BottomBtns from '@/components/BottomBtns'
|
||||
import { formatPriceDiv } from '@/common/format'
|
||||
import BottomSettleBar from './components/bottomSettleBar'
|
||||
import BottomEditBar from './components/bottomEditBar'
|
||||
import { ShoppingCartDeleteApi, ShoppingCartListApi } from '@/api/index'
|
||||
import { dataLoadingStatus, debounce } from '@/common/util'
|
||||
import { ShoppingCart, TriggerCheckboxOptions } from './components/shoppingCart/index'
|
||||
import { GoodsMeta, Goods, useShoppingCart, useShoppingContext } from './context'
|
||||
import { alert, goLink } from '@/common/common'
|
||||
import { dataLoadingStatus, debounce, getFilterData } from '@/common/util'
|
||||
import { ShoppingCart } from './components/shoppingCart/index'
|
||||
import { Goods, useShoppingContext } from './context'
|
||||
import { alert, goLink, isEmptyObject } from '@/common/common'
|
||||
|
||||
export const Shopping: FC = memo(() => {
|
||||
// 计算总的预估金额
|
||||
@@ -48,6 +47,9 @@ export const Shopping: FC = memo(() => {
|
||||
interface InternalContainer {}
|
||||
|
||||
const ShoppingCartContainer: FC<InternalContainer> = () => {
|
||||
|
||||
let isFirst = useRef(true)
|
||||
|
||||
const { isManageStatus, setManageStatus, selectedAmount, currentCheckedPurchaserId, currentCheckedSaleMode, colorStore, setColorStore } = useShoppingContext()
|
||||
|
||||
// 管理
|
||||
@@ -55,16 +57,30 @@ const ShoppingCartContainer: FC<InternalContainer> = () => {
|
||||
setManageStatus(!isManageStatus)
|
||||
}
|
||||
|
||||
const [listHeight, setListHeight] = useState('auto')
|
||||
const listHeightRef = useRef('auto')
|
||||
|
||||
const { fetchData, state } = ShoppingCartListApi()
|
||||
|
||||
const [searchOptions, setSearchOptions] = useState({
|
||||
short_name_or_phone: '',
|
||||
})
|
||||
useDidShow(()=>{
|
||||
console.log('onShow');
|
||||
if (!isFirst.current){
|
||||
|
||||
fetchData(searchOptions)
|
||||
}
|
||||
})
|
||||
useDidHide(() => {
|
||||
console.log('onHide');
|
||||
})
|
||||
console.log('rerender');
|
||||
|
||||
useEffect(() => {
|
||||
fetchData(searchOptions)
|
||||
console.log('useEffect fetchData')
|
||||
if (!isEmptyObject(getFilterData(searchOptions))){
|
||||
fetchData(searchOptions)
|
||||
}
|
||||
}, [searchOptions])
|
||||
|
||||
// 输入了搜索关键字
|
||||
@@ -82,7 +98,9 @@ const ShoppingCartContainer: FC<InternalContainer> = () => {
|
||||
// useLayoutEffect 执行在DOM更新之后，浏览器绘制之前 如果放在 useEffect 里面会产生多一次不必要的回流和重绘，可能会引起视图闪现
|
||||
useLayoutEffect(() => {
|
||||
;(async () => {
|
||||
console.log('useLayoutEffect')
|
||||
await fetchData()
|
||||
isFirst.current = false
|
||||
let query = Taro.createSelectorQuery()
|
||||
console.log('query', query)
|
||||
query.select('#shoppingContainer').boundingClientRect()
|
||||
@@ -94,7 +112,7 @@ const ShoppingCartContainer: FC<InternalContainer> = () => {
|
||||
const topBarHeight = res[1].height
|
||||
const bottomBarHeight = res[2].height
|
||||
const listHeight = containerHeight - topBarHeight - bottomBarHeight
|
||||
setListHeight(listHeight + 'px')
|
||||
listHeightRef.current = listHeight + 'px'
|
||||
})
|
||||
})()
|
||||
}, [])
|
||||
@@ -191,12 +209,8 @@ const ShoppingCartContainer: FC<InternalContainer> = () => {
|
||||
</Search>
|
||||
</View>
|
||||
<View className={classnames('flex-item', 'flex-col', styles['shopping--context'])}>
|
||||
<View className={classnames(styles.shopping__list__container, 'flex-item')} style={{ height: listHeight }}>
|
||||
<InfiniteScroll
|
||||
statusMore={statusMore}
|
||||
refresherEnabled={true}
|
||||
selfOnRefresherRefresh={handleRefresh}
|
||||
refresherTriggered={refreshStatus}>
|
||||
<View className={classnames(styles.shopping__list__container, 'flex-item')} style={{ height: listHeightRef.current }}>
|
||||
<InfiniteScroll statusMore={statusMore} refresherEnabled={true} selfOnRefresherRefresh={handleRefresh} refresherTriggered={refreshStatus}>
|
||||
{!!shoppingCartData?.list?.length &&
|
||||
shoppingCartData?.list?.map((item, index) => {
|
||||
return <ItemList itemData={item} key={index}></ItemList>
|
||||
|
||||
@@ -39,7 +39,8 @@ page{
|
||||
.left {
|
||||
}
|
||||
.middle {
|
||||
margin: 0 40px;
|
||||
max-width: 40%;
|
||||
padding: 0 40px;
|
||||
flex: 1 1 auto;
|
||||
}
|
||||
.right {
|
||||
@@ -58,11 +59,13 @@ page{
|
||||
display: block;
|
||||
font-size: 36px;
|
||||
font-weight: 600;
|
||||
@include common_ellipsis()
|
||||
}
|
||||
.userno {
|
||||
display: block;
|
||||
font-size: 28px;
|
||||
color: $color_font_two;
|
||||
@include common_ellipsis()
|
||||
}
|
||||
.userTitle {
|
||||
color: #626262;
|
||||
|
||||
Reference in New Issue
Block a user