✨ feat:客户管理对接85%

This commit is contained in:
Haiyi
2022-10-27 18:24:18 +08:00
parent bd494b1759
commit 05e9e4d532
13 changed files with 234 additions and 64 deletions
@@ -1,5 +1,5 @@
import { View, ScrollView } from '@tarojs/components'
import React, { useCallback, memo, useEffect, useMemo, useRef, useState, ReactNode } from 'react'
import React, { useCallback, memo, useEffect, useMemo, useRef, useState, ReactNode, forwardRef, useImperativeHandle } from 'react'
import styles from "./index.module.scss"
import classnames from "classnames";
import Taro, { usePullDownRefresh, useRouter, useDidShow } from '@tarojs/taro';
@@ -10,15 +10,19 @@ import { GetAddressListApi } from "@/api/addressList";
import Tabs from "../tabs"
import IconFont from '@/components/iconfont/iconfont';
interface Props {
handCity?: (any) => void
handCity?: (province: any, city: any) => void
}
export default memo((props: Props) => {
export default memo(forwardRef((props: Props, ref) => {
useImperativeHandle(ref, () => ({
close
}))
const DropDownItemRef = useRef<any>()
// const close = () => {
// DropDownItemRef.current.closePopup()
// }
const close = () => {
DropDownItemRef.current.closePopup()
}
//获取地址
const { fetchData } = GetAddressListApi()
@@ -36,7 +40,9 @@ export default memo((props: Props) => {
}
//已选的集合市
// const [choseCityArr, setchoseCityArr] = useState<any[]>([])
const choseCityArr = useRef<any>({ list: [] })
//省数组
const [list, setlist] = useState<any[]>([])
@@ -65,8 +71,6 @@ export default memo((props: Props) => {
list.map(it => {
if (item.id == it.id) {
it.check = true
} else {
it.check = false
}
return it
})
@@ -77,7 +81,6 @@ export default memo((props: Props) => {
if (it.id == currentValue) {
it.name = item.name
it.showBorder = false
} else {
it.showBorder = true
}
@@ -91,6 +94,14 @@ export default memo((props: Props) => {
const getCity = async (id) => {
let res = await fetchData({ parent_id: id })
if (res.data) {
res.data.list.map(item => {
choseCityArr.current.list.forEach(it => {
if (item.id == it.id) {
item.check = true
}
})
return item
})
setcityList([...res.data.list])
}
}
@@ -105,10 +116,32 @@ export default memo((props: Props) => {
return it
})
setcityList([...cityList])
let arr = cityList.filter(next => { return next.check })
props.handCity?.(arr)
let provinceArr = list.filter(next => { return next.check })
if (item.check) {
choseCityArr.current.list.push(item)
} else {
deleteById(item.id, choseCityArr.current.list)
}
props.handCity?.(provinceArr, choseCityArr.current.list)
}
/**
* 根据id删除数组项
* @param {Number} id 需要删除的id
* @param {Array} list 目标数组
*
* @return {Array}
*/
function deleteById(id, list) {
for (let index = list.length - 1; index >= 0; index--) {
if (list[index] && list[index].id === id) {
list.splice(index, 1)
}
}
return list
}
return (
<DropDownItem ref={DropDownItemRef} title={'所有省市'} value={-1} activeColor='#337fff'>
<View className={styles.mainBox}>
@@ -144,4 +177,4 @@ export default memo((props: Props) => {
</View>
</DropDownItem>
)
})
}))
@@ -37,7 +37,7 @@ export default memo((props: Props) => {
</View>
<View className={styles.item_tag_box}>
<View className={styles.item_tagItem}>二批</View>
<View className={styles.item_tagItem}>{props.obj.sale_user_name}</View>
<View className={styles.item_tagItem}>{props.obj.sale_user_name || '暂无'}</View>
</View>
</View>
</View>
@@ -48,8 +48,8 @@ export default memo((props: Props) => {
</View>
<View className={styles.line}></View>
<View className={styles.flex_bottom}>
<View className={styles.flex_left}>{props.obj.default_address.province_name + props.obj.default_address.city_name + props.obj.default_address.district_name}</View>
<View className={styles.flex_right}>更新时间:{formatDateTime(props.obj.recent_order_time)}</View>
<View className={styles.flex_left}>{props.obj.default_address.province_name + props.obj.default_address.city_name + props.obj.default_address.district_name || '暂无'}</View>
<View className={styles.flex_right}>更新时间:{formatDateTime(props.obj.recent_order_time) || '暂无'}</View>
</View>
</View >
)
@@ -6,9 +6,12 @@ import Taro, { usePullDownRefresh, useRouter, useDidShow } from '@tarojs/taro';
import { alert } from '@/common/common'
import { formatPriceDiv, formatDateTime, formatWeightDiv } from '@/common/format'
import DropDownItem from '@/components/dropDown-item'
interface Props {
handType: (any) => void,
handTags: (any) => void
}
export default memo(() => {
export default memo((props: Props) => {
const DropDownItemRef = useRef<any>()
@@ -53,11 +56,14 @@ export default memo(() => {
const handItem = (it) => {
list.map(item => {
if (item.id == it.id) {
item.checked = !item.checked
item.checked = true
} else {
item.checked = false
}
return item
})
setlist([...list])
props.handType(list)
}
const handTag = (it) => {
@@ -68,6 +74,7 @@ export default memo(() => {
return item
})
settaglist([...taglist])
props.handTags(taglist)
}
return (
@@ -36,7 +36,7 @@
}
.order_list {
height: calc(100vh - env(safe-area-inset-bottom) - 160px);
height: calc(100vh - env(safe-area-inset-bottom) - 200px);
background: #f7f7f7;
}
+44 -6
View File
@@ -18,10 +18,24 @@ import { ClientListApi } from '@/api/order'
import { goLink } from '@/common/common'
export default () => {
const [searchField, setSearchField] = useState<{ page: number; size: number; order_no: string }>({
const [searchField, setSearchField] = useState<
{
page: number;
size: number;
label_ids: any[] | '',
purchaser_type: number | string,
name_phone_or_sale_user: string,
province_id: any[] | string,
city_id: any[] | string,
}
>({
page: 1,
size: 10,
order_no: '',
label_ids: '',
purchaser_type: '',
name_phone_or_sale_user: '',
province_id: '',
city_id: ''
})
const [orderData, setOrderData] = useState<{ list: any[]; total: number }>({ list: [], total: 0 })
@@ -44,7 +58,7 @@ export default () => {
const getSearchData = useCallback((e) => {
pageNum.current.page = 1
setOrderData(() => ({ list: [], total: 0 }))
setSearchField((val) => ({ ...val, order_no: e, size: 10 }))
setSearchField((val) => ({ ...val, name_phone_or_sale_user: e, size: 10 }))
}, [])
//数据加载状态
@@ -76,7 +90,31 @@ export default () => {
}, [])
//筛选城市
const handCity = useCallback((val) => {
const ChoseCityRef = useRef<any>()
const handCity = useCallback((provinceVal, cityVal) => {
const provinceArr: number[] = []
const cityArr: number[] = []
provinceVal.forEach(item => {
provinceArr.push(item.id)
})
cityVal.forEach(item => {
cityArr.push(item.id)
})
console.log(provinceArr, cityArr)
pageNum.current.page = 1
setSearchField((val) => ({ ...val, province_id: provinceArr, city_id: cityArr, size: 10 }))
// ChoseCityRef.current.close()
}, [])
//选择客户类型
const handType = useCallback((val) => {
val.filter(item => { return item.checked })
pageNum.current.page = 1
setSearchField((val) => ({ ...val, size: 10, purchaser_type: val[0]?.id }))
}, [])
//选择标签
const handTags = useCallback((val) => {
console.log(val, 899999)
}, [])
@@ -88,8 +126,8 @@ export default () => {
</View>
<View className={styles.menuBox}>
<Sort handSort={handSort}></Sort>
<ChoseCity handCity={handCity}></ChoseCity>
<Tag></Tag>
<ChoseCity ref={ChoseCityRef} handCity={handCity}></ChoseCity>
<Tag handTags={handTags} handType={handType}></Tag>
</View>
</View>
<View className={styles.totalFont}>共 {orderData?.total || 0} 个客户</View>