From caf70666639a1be19df2b509bb1a75ddf4cc9b71 Mon Sep 17 00:00:00 2001 From: Haiyi <1021441632@qq.com> Date: Wed, 7 Sep 2022 14:42:31 +0800 Subject: [PATCH] =?UTF-8?q?=F0=9F=A6=84=20refactor:=E8=B4=AD=E7=89=A9?= =?UTF-8?q?=E8=BD=A6=E6=B7=BB=E5=8A=A0=E8=99=9A=E6=8B=9F=E5=88=97=E8=A1=A8?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/api/order.ts | 7 + src/app.config.ts | 9 +- src/components/closeBtn/index.tsx | 2 +- src/components/goodsItem/index.tsx | 35 ++- src/components/shoppingCart/index.module.scss | 21 +- src/components/shoppingCart/index.tsx | 49 ++-- src/pages/customerPage/index.module.scss | 4 + src/pages/customerPage/index.tsx | 122 ++++++--- src/pages/index/index.tsx | 46 ++-- src/pages/order/index.module.scss | 210 +++++++++++--- src/pages/order/index.tsx | 257 ++++++++++++------ src/pages/saleuserPage/index.config.ts | 3 + src/pages/saleuserPage/index.module.scss | 110 ++++++++ src/pages/saleuserPage/index.tsx | 151 ++++++++++ 14 files changed, 805 insertions(+), 221 deletions(-) create mode 100644 src/pages/saleuserPage/index.config.ts create mode 100644 src/pages/saleuserPage/index.module.scss create mode 100644 src/pages/saleuserPage/index.tsx diff --git a/src/api/order.ts b/src/api/order.ts index 247f504..a05a8b1 100644 --- a/src/api/order.ts +++ b/src/api/order.ts @@ -41,3 +41,10 @@ export const mpsaleOrderpreView = () => { method: "put" }) } +//业务员枚举 +export const mpenumsaleUserlist = () => { + return useRequest({ + url: `/v1/mp/enum/saleUser/list`, + method: "get" + }) +} diff --git a/src/app.config.ts b/src/app.config.ts index afd9268..9636b70 100644 --- a/src/app.config.ts +++ b/src/app.config.ts @@ -1,5 +1,12 @@ export default defineAppConfig({ - pages: ['pages/user/index', 'pages/index/index', 'pages/order/index', 'pages/shopping/index', 'pages/searchPage/index', 'pages/customerPage/index'], + pages: ['pages/user/index', + 'pages/index/index', + 'pages/order/index', + 'pages/shopping/index', + 'pages/searchPage/index', + 'pages/customerPage/index', + 'pages/saleuserPage/index', + ], window: { backgroundTextStyle: 'light', navigationBarBackgroundColor: '#fff', diff --git a/src/components/closeBtn/index.tsx b/src/components/closeBtn/index.tsx index 9b24b14..2cdb4b1 100644 --- a/src/components/closeBtn/index.tsx +++ b/src/components/closeBtn/index.tsx @@ -14,7 +14,7 @@ export default memo(({onClose, styleObj = {}}:Params) => { className={style.icon_a_cuowuwrong_self} onClick={onClose} > - + ) }) diff --git a/src/components/goodsItem/index.tsx b/src/components/goodsItem/index.tsx index 1344f01..c741f54 100644 --- a/src/components/goodsItem/index.tsx +++ b/src/components/goodsItem/index.tsx @@ -5,7 +5,7 @@ import classnames from "classnames"; interface props { clickAdd: (any) => void, - onInputEven: (a: any, c: any) => void, + // onInputEven?: (a: any, c: any) => void, clickReduce: (any) => void, handPlus: (any) => void, modeFont?: number @@ -18,38 +18,53 @@ interface props { code?: string, rgb?: { r: number, g: number, b: number }, name?: string, - roll?: number | string + roll?: number | string, + buyNums?: number | string, } } export default memo((props: props) => { + const [value, setValue] = useState({ count: props.value.nums }) + const onInputEven = (e) => { + + let res = e.detail.value + if (props.modeFont !== 2) { + if (Number(res) == 0 || Number(res) < 1) { + setValue({ count: 1 }) + } + } else { + if (Number(res) == 0 || Number(res) < 3) { + setValue({ count: 3 }) + } + } + } const type = useMemo(() => { if (props.modeFont === 0) { return 'number' } else { - return 'type' + return 'digit' } }, [props.modeFont]) return ( { - props.value?.rgb?.r == 0 && props.value?.rgb?.g == 0 && props.value?.rgb?.b == 0 && + props?.value?.rgb?.r == 0 && props?.value?.rgb?.g == 0 && props?.value?.rgb?.b == 0 && } { - (props.value?.rgb?.r != 0 || props.value?.rgb?.g != 0 || props.value?.rgb?.b != 0) && - + (props?.value?.rgb?.r != 0 || props?.value?.rgb?.g != 0 || props?.value?.rgb?.b != 0) && + } - {props.value.code} {props.value.name}环保黑 + {props.value?.code} {props.value?.name}环保黑 {/* 0681# 26S全棉平纹 */} 剩:{props.value?.roll}件 - ¥{props.modeFont === 0 ? Number(props.value?.bulk_price) / 100 : props.modeFont === 1 ? Number(props.value?.length_cut_price) / 100 : Number(props.value?.weight_cut_price) / 100}{props.modeFont === 0 ? '/Kg' : '/m'} + ¥{props?.modeFont === 0 ? Number(props.value?.bulk_price) / 100 : props.modeFont === 1 ? Number(props.value?.length_cut_price) / 100 : Number(props.value?.weight_cut_price) / 100}{props.modeFont === 0 ? '/Kg' : '/m'} { props.value.showInput && { props.clickReduce?.(props.value) }}> @@ -57,7 +72,9 @@ export default memo((props: props) => { - props.onInputEven($event, props.value)}> + + + {/* onInputEven($event, props.value)}> */} { props.handPlus?.(props.value) }}> + diff --git a/src/components/shoppingCart/index.module.scss b/src/components/shoppingCart/index.module.scss index 27dc209..6b55305 100644 --- a/src/components/shoppingCart/index.module.scss +++ b/src/components/shoppingCart/index.module.scss @@ -76,7 +76,7 @@ display: flex; margin-bottom: 24px; align-items: center; - + padding-bottom: 10px; .kingFont { font-size: 28px; @@ -91,7 +91,7 @@ width: 148px; height: 30px; border-radius: 4px; - border: 1px solid #E42945; + border: 1PX solid #E42945; font-size: 22px; font-family: PingFangSC-Medium, PingFang SC; font-weight: 500; @@ -106,15 +106,22 @@ margin-bottom: 32px; } - .scrollview { - height: 500px; + .scrollviewBig { + .scrollview { + height: 300px; - .kongBox { - height: 181px; - width: 100%; + .kongBox { + height: 181px; + width: 100%; + } + } + + .kongOne { + height: 100px; } } + .posBox { width: 100%; position: fixed; diff --git a/src/components/shoppingCart/index.tsx b/src/components/shoppingCart/index.tsx index 7355a4d..ebe817c 100644 --- a/src/components/shoppingCart/index.tsx +++ b/src/components/shoppingCart/index.tsx @@ -6,7 +6,7 @@ import classnames from "classnames"; import Popup from '@/components/popup' import Goods from "@/components/goodsItem" import BottomCustomer from "@/components/BottomCustomer" - +import VirtualList from '@tarojs/components/virtual-list' interface prosObj { showPopup?: false | true, @@ -86,9 +86,20 @@ export default memo(forwardRef((props: prosObj, ref) => { return s; }, [goodList]) + // onInputEven={(e, obj) => oninputEvent?.(e, obj)} - - + const rows = memo(({ id, index, style, data }: any) => { + let item = data[index] + return ( + <> + handPlus?.(item)} + value={item || {}} + clickAdd={(item) => addNums?.(item)} + clickReduce={(item) => { reduceNums?.(item) }}> + + ) + }) return ( closePopup?.()}> @@ -114,20 +125,21 @@ export default memo(forwardRef((props: prosObj, ref) => { - + + + {rows} + + + + - { - goodList.map((item, index) => { - return ( - handPlus?.(item)} key={index} value={item} onInputEven={(e, obj) => oninputEvent?.(e, obj)} clickAdd={(item) => addNums?.(item)} clickReduce={(item) => { reduceNums?.(item) }}> - ) - }) - } - - 0 && clientName !== '' ? false : true} handSure={() => { handSure() }}> @@ -135,4 +147,7 @@ export default memo(forwardRef((props: prosObj, ref) => { ) -})) \ No newline at end of file + + +})) + diff --git a/src/pages/customerPage/index.module.scss b/src/pages/customerPage/index.module.scss index bf15794..9d8704f 100644 --- a/src/pages/customerPage/index.module.scss +++ b/src/pages/customerPage/index.module.scss @@ -20,6 +20,10 @@ page { } } + .listBox { + height: 100vh; + } + .itemBox { margin-left: 24px; width: 702px; diff --git a/src/pages/customerPage/index.tsx b/src/pages/customerPage/index.tsx index 9d3a612..cb9ca2b 100644 --- a/src/pages/customerPage/index.tsx +++ b/src/pages/customerPage/index.tsx @@ -7,47 +7,68 @@ import { ClientListApi } from '@/api/order' import { useDidShow } from '@tarojs/taro'; import Taro from '@tarojs/taro' import { useRouter } from '@tarojs/taro' +import InfiniteScroll from '@/components/infiniteScroll' +import { dataLoadingStatus, getFilterData } from '@/common/util' export default () => { + + const [search, setSearch] = useState({ - name: null + name: null, + page: 1, + size: 10, }) - const [clentList, setClientlist] = useState([]) + 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({}) + const [clientObj, setclientObj] = useState({ + clientId: null, + clientName: '' + }) //输入了搜索关键字 const getSearchData = useCallback((eq) => { - - setSearch({ name: eq }) - + pageNum.current.page = 1 + setClientlist(() => ({ list: [], total: 0 })) + setSearch((e) => ({ ...e, name: eq, size: 10 })) }, []) const router = useRouter() - // useDidShow(() => { - // if (router?.params.clientId) { - // clentList.map(item => { - // if (item.id == router?.params.clientId) { - // item.checked = true - // }else{ - - // } - // }) - // } - // }) useEffect(() => { - setSearch(search) + 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 { fetchData: clitentFetch } = ClientListApi() + //列表下拉刷新 + 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 }) + 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) { @@ -58,15 +79,15 @@ export default () => { return item }) } - // res.data.list.map(item => { - // item.checked = false - // }) - setClientlist([...res.data.list]) + setClientlist((e) => ({ ...e, list: res.data?.list, total: res.data?.total })) + setRefresherTriggeredStatus(() => false) } + + //选择客户 const selectClient = (item) => { - clentList.map(it => { + clentList.list.map(it => { if (item.id === it.id) { it.checked = true } else { @@ -74,19 +95,30 @@ export default () => { } return it }) + setclientObj(item) let pages = Taro.getCurrentPages(); // 获取当前的页面栈 let prevPage = pages[pages.length - 2]; prevPage.setData({ //设置上一个页面的值 clientId: item.id, - clientName: item.name + clientName: item.name, }); - setClientlist([...clentList]) - setclientObj(item) + 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]) return ( @@ -95,17 +127,27 @@ export default () => { - { - clentList.map((item, index) => { - return ( - { selectClient(item) }}> - {item.name} - {item.phone} - {item.sale_user_name} - - ) - }) - } + + + { + clentList.list.map((item, index) => { + return ( + { selectClient(item) }}> + {item.name} + {item.phone} + {item.sale_user_name} + + ) + }) + } + + + ) diff --git a/src/pages/index/index.tsx b/src/pages/index/index.tsx index 1f15f3b..523b94b 100644 --- a/src/pages/index/index.tsx +++ b/src/pages/index/index.tsx @@ -14,7 +14,7 @@ import { dataLoadingStatus } from '@/common/util' import Taro, { useDidShow } from '@tarojs/taro' import goodsItem from '@/components/goodsItem' import { WX_APPID } from '@/common/constant' - +import { debounce } from "@/common/util"; export default () => { useEffect(() => { categoryList() @@ -182,30 +182,6 @@ export default () => { }) setGoodlist([...goodList]) }, [goodList]) - //加减输入框 - const oninputEvent = useCallback((e, item) => { - goodList.map((it) => { - if (item.id === it.id) { - if (search.modeId !== 2) { - if (Number(e.detail.value) < item.nums || e.detail.value === '') { - it.nums = 1 - } else { - it.nums = Number(e.detail.value) - } - - } else { - if (Number(e.detail.value) < item.nums || e.detail.value === '') { - it.nums = 3 - } else { - it.nums = Number(e.detail.value) - } - } - - } - return item - }) - setGoodlist([...goodList]) - }, [goodList]) //输入了搜索关键字 @@ -262,7 +238,6 @@ export default () => { return item }) setGoodlist([...goodList]) - setSearchObj((e) => ({ ...e, goodsId: null })) console.log(search, '000000.0.0.') Taro.hideLoading() } else { @@ -300,8 +275,25 @@ export default () => { - handSure()} clientName={clientObj?.clientName} clientId={clientObj?.clientId} modeFont={search.modeId} handPlus={(item) => handPlus(item)} obj={goodObj} ref={ShopCartRef} getSearchData={(e) => { getSearchData(e) }} oninputEvent={(e, item) => { oninputEvent(e, item) }} reduceNums={(item) => { reduceNums(item) }} addNums={(item) => { handAdd(item) }} showPopup={showShopCart} handCheck={(item) => { handCheckMode(item) }} closePopup={() => closePoup()} goodList={goodList} typeList={typeList}> + handSure()} + clientName={clientObj?.clientName} + clientId={clientObj?.clientId} + modeFont={search.modeId} + handPlus={(item) => handPlus(item)} + obj={goodObj} + ref={ShopCartRef} + getSearchData={(e) => { getSearchData(e) }} + + reduceNums={(item) => { reduceNums(item) }} + addNums={(item) => { handAdd(item) }} + showPopup={showShopCart} + handCheck={(item) => { handCheckMode(item) }} + closePopup={() => closePoup()} + goodList={goodList} + typeList={typeList} + > // ) } +// oninputEvent={(e, item) => { oninputEvent(e, item) }} \ No newline at end of file diff --git a/src/pages/order/index.module.scss b/src/pages/order/index.module.scss index b2105d1..cc86e88 100644 --- a/src/pages/order/index.module.scss +++ b/src/pages/order/index.module.scss @@ -6,6 +6,12 @@ } .icon_shaixuan { + color: #0D7CFF; + font-size: 35px; + margin-right: 10px; +} + +.activeshaixuan { color: #000; font-size: 35px; margin-right: 10px; @@ -19,6 +25,14 @@ color: #000000; } +.activeshai { + color: #0D7CFF; + margin-right: 32px; + font-size: 28px; + font-family: PingFangSC-Regular, PingFang SC; + font-weight: 400; +} + .popupBox { .topBox { display: flex; @@ -38,9 +52,9 @@ align-items: center; width: 319px; height: 68px; - background: #E9E9E9; + background: #f6f6f6; border-radius: 8px; - opacity: 0.4; + // opacity: 0.4; justify-content: space-between; margin-right: 16px; @@ -57,73 +71,185 @@ font-size: 30px; } } + + .activelefttopSelectBox { + width: 319px; + height: 68px; + background: rgba(51, 127, 255, 0.1); + border-radius: 8px; + border: 1px solid #337FFF; + display: flex; + align-items: center; + justify-content: space-between; + margin-right: 16px; + + .lefttopSelectName { + font-size: 28px; + font-family: PingFangSC-Regular, PingFang SC; + font-weight: 400; + color: #337FFF; + margin-left: 24px; + } + + .icon_more { + margin-right: 24px; + font-size: 30px; + color: #337FFF; + } + } } } -} -.popupTwobox { - padding-left: 40px; - padding-right: 40px; + .secondBox { + margin-top: 40px; + padding-left: 48px; - .scrollview { - height: 400px; + .secondTopfont { + font-size: 28px; + font-family: PingFangSC-Medium, PingFang SC; + font-weight: 500; + color: #000000; + } - .btnBox { - margin-top: 40px; + .inputBox { + width: 654px; + height: 68px; + background: #f6f6f6; + border-radius: 8px; + // opacity: 0.4; + margin-top: 24px; display: flex; - flex-wrap: wrap; + justify-content: space-between; + align-items: center; - .itemBox { - width: 213px; - height: 80px; - background: #f5f5f5; + .orderInput { + margin-left: 24px; + width: 400px; + font-size: 28px; + font-family: PingFangSC-Regular, PingFang SC; + font-weight: 400; + color: #000000; + } + + .saomiao { + margin-right: 24px; + font-size: 26px; + color: #000; + } + } + } + + .thirdBox { + margin-top: 40px; + padding-left: 48px; + + .thirdTopfont { + font-size: 28px; + font-family: PingFangSC-Medium, PingFang SC; + font-weight: 500; + color: #000000; + } + + .flexModebox { + margin-top: 24px; + display: flex; + + .activemodeBox { + margin-right: 16px; + width: 152px; + height: 68px; + background: rgba(51, 127, 255, 0.1); border-radius: 8px; font-size: 28px; font-family: PingFangSC-Regular, PingFang SC; font-weight: 400; - color: #000; - line-height: 80px; - text-align: center; - margin-right: 16px; - box-sizing: border-box; - margin-bottom: 16px; - flex-shrink: 0; - } - - .activeitemBox { - border-radius: 8px; - flex-shrink: 0; - font-family: PingFangSC-Regular, PingFang SC; - line-height: 80px; - text-align: center; - width: 213px; - height: 80px; - font-size: 28px; color: #337FFF; - margin-right: 16px; - background: #e8effd; + text-align: center; + line-height: 68px; border: 1px solid #337FFF; - margin-bottom: 16px; box-sizing: border-box; } - .activeitemBox:nth-child(3n-0) { - margin-right: 0px; - } - - .itemBox:nth-child(3n-0) { - margin-right: 0px; + .modeBox { + margin-right: 16px; + width: 152px; + height: 68px; + background: #f6f6f6; + border-radius: 8px; + font-size: 28px; + font-family: PingFangSC-Regular, PingFang SC; + font-weight: 400; + color: #000000; + text-align: center; + line-height: 68px; + box-sizing: border-box; + // opacity: 0.4; } } } + .bottomBox { + width: 750px; + height: 160px; + background: #FFFFFF; + position: fixed; + bottom: 0; + z-index: 99; + display: flex; + padding-top: 16px; + justify-content: space-between; + .resetBox { + margin-left: 48px; + width: 311px; + height: 80px; + border-radius: 44px; + border: 1px solid #087EFF; + font-size: 28px; + font-family: PingFangSC-Medium, PingFang SC; + font-weight: 500; + color: #337FFF; + text-align: center; + line-height: 80px; + } + + .button { + margin-right: 32px; + width: 311px; + height: 80px; + background: #68b4ff; + border-radius: 44px; + font-size: 32px; + font-family: PingFangSC-Medium, PingFang SC; + font-weight: 500; + color: #FFFFFF; + text-align: center; + line-height: 80px; + } + + .activeButton { + margin-right: 32px; + width: 311px; + height: 80px; + background: #337FFF; + border-radius: 44px; + font-size: 32px; + font-family: PingFangSC-Medium, PingFang SC; + font-weight: 500; + color: #fff; + text-align: center; + line-height: 80px; + } + } } + + .order_list { height: calc(100vh - 160px); .bigBpx { height: 200px; } + } \ No newline at end of file diff --git a/src/pages/order/index.tsx b/src/pages/order/index.tsx index d9cb9de..8d378d8 100644 --- a/src/pages/order/index.tsx +++ b/src/pages/order/index.tsx @@ -1,6 +1,6 @@ -import { View, ScrollView } from '@tarojs/components' +import { View, ScrollView, Input, Button } from '@tarojs/components' import { useCallback, useEffect, useMemo, useRef, useState, } from 'react' -import { mpenumsaleorderstatus, OrderListApi, ClientListApi } from '@/api/order' +import { mpenumsaleorderstatus, OrderListApi } from '@/api/order' import OrderStatusList from './components/orderStatusList' import Search from '@/components/search' import { dataLoadingStatus, getFilterData } from '@/common/util' @@ -9,6 +9,7 @@ import classnames from "classnames"; import Popup from '@/components/popup' import InfiniteScroll from '@/components/infiniteScroll' import { compose } from 'redux' +import Taro, { useDidShow } from '@tarojs/taro' export default () => { //页码和页数 @@ -23,8 +24,12 @@ export default () => { const { fetchData: listFetchData, state: orderState } = OrderListApi() const [orderData, setOrderData] = useState<{ list: any[]; total: number }>({ list: [], total: 0 }) const getOrderList = async () => { - let res = await listFetchData(getFilterData(searchField)) + let res = await listFetchData({ + ...getFilterData(searchField), + ...getFilterData(searchObj) + }) setOrderData((e) => ({ ...e, list: res.data?.list, total: res.data?.total })) + setshowPopup(false) setRefresherTriggeredStatus(() => false) } @@ -91,67 +96,143 @@ export default () => { const closePopup = () => { setshowPopup(false) } - //客户筛选内容展示 - const [choseTitle, setChoseTitle] = useState('客户') - const [showPopupTwo, setshowPopupTwo] = useState(false) - const showPopupDesige = (index) => { - if (index === 1) { - setChoseTitle('客户') - } else { - setChoseTitle('业务员') - } - setshowPopupTwo(true) - } - //客户关闭筛选内容展示 - const closePopupTwo = () => { - setshowPopupTwo(false) - } - //获取客户或者业务员数据 - const { fetchData: purchaserFetch } = ClientListApi() - const [itemList, setItemList] = useState([{ id: -100, name: '不限' }]) - const getPurchaser = async () => { - let res = await purchaserFetch() - res.data.list.map(item => { - if (item.id === -100) { - item.checked = true - } else { - item.checked = false - return item - } - }) - setItemList((e) => [...e, ...res.data.list]) - } - //选择客户或者业务员 - const choseUser = (it, index) => { - itemList.map(item => { - if (item.id === it.id) { - item.checked = true - } else { - item.checked = false - return item - } - }) - setItemList(() => [...itemList]) - console.log(itemList, 123) - } - //搜索客户或者业务员 - const getSearchDataPurchaser = useCallback(async (e) => { - getPurchaser() - // let res = await purchaserFetch({ name: e }) - // setItemList((e) => [...e, ...res.data.list]) - }, []) + useDidShow(() => { + + //获取选择的客户 + let pages = Taro.getCurrentPages(); + let currPage = pages[pages.length - 1]; // 获取当前页面 + console.log(currPage.data, '8888') + + setsearchObj((e) => ({ + ...e, + purchaser_id: currPage.data?.clientId ? currPage.data?.clientId : '', + clientName: currPage.data?.clientName ? currPage.data?.clientName : '', + sale_user_id: currPage.data?.saleuserId ? currPage.data?.saleuserId : '', + saleuserName: currPage.data?.saleuserName ? currPage.data?.saleuserName : '', + })) + }) + + interface filterObj { + purchaser_id?: string | number, + clientName?: string, + sale_user_id?: string | number, + saleuserName?: string, + orderNo?: string | undefined, + sale_mode?: Number | undefined, + shipment_mode?: Number | undefined + } + + //筛选参数 + const [searchObj, setsearchObj] = useState({ + purchaser_id: '', + clientName: '', + sale_user_id: '', + saleuserName: '', + orderNo: '', + sale_mode: undefined, + shipment_mode: undefined + }) + // 跳转选择客户 + const navTo = (index) => { + if (index === 1) { + Taro.navigateTo({ + url: '/pages/customerPage/index?clientId=' + searchObj?.purchaser_id + }) + } else { + Taro.navigateTo({ + url: '/pages/saleuserPage/index?saleuserId=' + searchObj?.sale_user_id + }) + } + } + //订单号输入框 + const handInput = (eq) => { + setsearchObj((e) => ({ ...e, orderNo: eq.detail.value })) + } + + //订单类型 + const [modeList, setModeList] = useState([{ id: -1, name: '不限' }, { id: 0, name: '大货' }, { id: 1, name: '剪版' }, { id: 2, name: '散剪' }]) + //选择订单类型 + const handCheckMode = (item) => { + modeList.map(it => { + if (it.id === item.id) { + it.checked = true + } else { + it.checked = false + } + return it + }) + setModeList([...modeList]) + setsearchObj((e) => ({ ...e, sale_mode: item.id })) + } + + ///发货方式类型 + const [deliveryList, setdeliveryList] = useState([{ id: -1, name: '不限' }, { id: 1, name: '自提' }, { id: 2, name: '物流' }]) + //选择发货方式类型 + const handCheckDelivery = (item) => { + deliveryList.map(it => { + if (it.id === item.id) { + it.checked = true + } else { + it.checked = false + } + return it + }) + setdeliveryList([...deliveryList]) + setsearchObj((e) => ({ ...e, shipment_mode: item.id })) + } + //是否不允许确认筛选 + const isDisabled = useMemo(() => { + if (searchObj.clientName !== '' || + searchObj.orderNo !== '' || + searchObj.saleuserName !== '' || + searchObj.sale_mode !== undefined || + searchObj.shipment_mode !== undefined + ) { + return false + } else { + return true + } + }, [searchObj]) + + //重置 + const handReset = () => { + setsearchObj({ + purchaser_id: '', + clientName: '', + sale_user_id: '', + saleuserName: '', + orderNo: '', + sale_mode: undefined, + shipment_mode: undefined + }) + } + //确认筛选 + const handSure = async () => { + getOrderList() + } + //扫描 + const handScan = () => { + Taro.scanCode({ + success(res) { + setsearchObj((e) => ({ ...e, orderNo: res.result })) + }, + fail(res) { + console.log(res); + }, + }); + } + useEffect(() => { getOrderStatusList() - getPurchaser() }, []) return ( showSelctPopup()}> - - 筛选 + + 筛选 @@ -175,40 +256,62 @@ export default () => { closePopup()}> - showPopupDesige(1)}> + navTo(1)}> 客户信息 - - 请选择客户 + + {searchObj.clientName === '' ? '请选择客户' : searchObj.clientName} - showPopupDesige(2)}> + navTo(2)}> 业务员 - - 请选择业务员 + + {searchObj.saleuserName === '' ? '请选择客户' : searchObj.saleuserName} - - - closePopupTwo()}> - - - - - - {itemList.map((item, index) => choseUser(item, index)}>{item.name})} + + 订单单号 + + { handInput(e) }} placeholderStyle='color:#000000; font-size:26rpx' className={styles.orderInput} value={searchObj.orderNo} placeholder={'请输入或扫描条形码'}> + { handScan() }}> - + + + 订单类型 + + { + modeList.map((item, index) => { + return ( + { handCheckMode(item) }} className={classnames(item.checked ? styles.activemodeBox : styles.modeBox)} key={index}>{item.name} + ) + }) + } + + + + 发货方式 + + { + deliveryList.map((item, index) => { + return ( + { handCheckDelivery(item) }} className={classnames(item.checked ? styles.activemodeBox : styles.modeBox)} key={index}>{item.name} + ) + }) + } + + + {isDisabled} + + + + + + + - ) diff --git a/src/pages/saleuserPage/index.config.ts b/src/pages/saleuserPage/index.config.ts new file mode 100644 index 0000000..4b0d8e4 --- /dev/null +++ b/src/pages/saleuserPage/index.config.ts @@ -0,0 +1,3 @@ +export default { + navigationBarTitleText: '选择业务员', +} diff --git a/src/pages/saleuserPage/index.module.scss b/src/pages/saleuserPage/index.module.scss new file mode 100644 index 0000000..4de4ecc --- /dev/null +++ b/src/pages/saleuserPage/index.module.scss @@ -0,0 +1,110 @@ +page { + background: #f7f7f7; +} + +.cussBox { + + .searchBox { + position: sticky; + top: 0; + width: 750px; + height: 96px; + background: #FFFFFF; + display: flex; + align-items: center; + + .two { + width: 702px; + height: 72px; + margin-left: 24px; + } + } + + .listBox { + height: calc(100vh - 96px); + } + + .itemBox { + margin-left: 24px; + width: 702px; + height: 104px; + 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; + } + } +} \ No newline at end of file diff --git a/src/pages/saleuserPage/index.tsx b/src/pages/saleuserPage/index.tsx new file mode 100644 index 0000000..a78954c --- /dev/null +++ b/src/pages/saleuserPage/index.tsx @@ -0,0 +1,151 @@ +import { View, ScrollView, Image, Input, Button } from '@tarojs/components' +import { useCallback, useEffect, useMemo, useRef, useState, memo } from 'react' +import styles from "./index.module.scss" +import classnames from "classnames"; +import Search from '@/components/search' +import { mpenumsaleUserlist } from '@/api/order' +import { useDidShow } from '@tarojs/taro'; +import Taro from '@tarojs/taro' +import { useRouter } from '@tarojs/taro' +import InfiniteScroll from '@/components/infiniteScroll' +import { dataLoadingStatus, getFilterData } from '@/common/util' + +export default () => { + + + + 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 } = mpenumsaleUserlist() + //数据加载状态 + const statusMore = useMemo(() => { + return dataLoadingStatus({ list: clentList.list, total: clentList.total, status: orderState.loading }) + }, [clentList, orderState]) + + const [clientObj, setclientObj] = useState({ + saleuserId: null, + saleuserName: '' + }) + + //输入了搜索关键字 + 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 + }) + let pages = Taro.getCurrentPages(); // 获取当前的页面栈 + let prevPage = pages[pages.length - 2]; + prevPage.setData({ //设置上一个页面的值 + saleuserId: item.id, + saleuserName: item.name + }); + setClientlist((e) => ({ ...e, list: clentList?.list, total: clentList?.total })) + setclientObj(item) + Taro.navigateBack({ + delta: 1 + }) + } + useEffect(() => { + if (clientObj?.saleuserId !== null) { + setclientObj(clientObj) + } else { + let pages = Taro.getCurrentPages(); // 获取当前的页面栈 + let prevPage = pages[pages.length - 2]; + prevPage.setData({ //设置上一个页面的值 + saleuserId: '', + saleuserName: '', + }); + } + }, [clientObj]) + return ( + + + + + + + + + + { + clentList.list.map((item, index) => { + return ( + { selectClient(item) }}> + {item.name} + {item.phone} + {item.sale_user_name} + + ) + }) + } + + + + + + ) +} \ No newline at end of file