From fb589f120f8d20db2a575a77510c2ca18804c9cd Mon Sep 17 00:00:00 2001 From: xuan Date: Mon, 19 Sep 2022 19:32:47 +0800 Subject: [PATCH] =?UTF-8?q?=E2=9C=A8=20feat(=E5=8F=91=E8=B4=A7=E5=88=97?= =?UTF-8?q?=E8=A1=A8):=20=E5=88=9D=E6=AD=A5=E5=AE=8C=E6=88=90=E5=8F=91?= =?UTF-8?q?=E8=B4=A7=E5=88=97=E8=A1=A8UI=E7=95=8C=E9=9D=A2?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- config/dev.js | 2 +- project.config.json | 4 +- project.private.config.json | 7 + src/app.config.ts | 60 ++---- .../SegmentedControl/index.module.scss | 19 ++ src/components/SegmentedControl/index.tsx | 59 ++++++ src/components/search/index.module.scss | 4 +- src/components/search/index.tsx | 54 +++-- .../components/ItemList/index.module.scss | 50 +++++ .../delivery/components/ItemList/index.tsx | 64 ++++++ src/pages/delivery/index.config.ts | 3 + src/pages/delivery/index.module.scss | 113 ++++++++++ src/pages/delivery/index.tsx | 198 ++++++++++++++++++ .../components/orderStatusList/index.tsx | 2 +- src/pages/order/index.tsx | 85 +++++--- .../components/shoppingCartItem/index.tsx | 48 ++--- src/pages/shopping/index.tsx | 42 ++-- src/use/useCommon.ts | 2 +- 18 files changed, 683 insertions(+), 133 deletions(-) create mode 100644 src/components/SegmentedControl/index.module.scss create mode 100644 src/components/SegmentedControl/index.tsx create mode 100644 src/pages/delivery/components/ItemList/index.module.scss create mode 100644 src/pages/delivery/components/ItemList/index.tsx create mode 100644 src/pages/delivery/index.config.ts create mode 100644 src/pages/delivery/index.module.scss create mode 100644 src/pages/delivery/index.tsx diff --git a/config/dev.js b/config/dev.js index 4e1656f..b817b01 100644 --- a/config/dev.js +++ b/config/dev.js @@ -18,7 +18,7 @@ module.exports = { args: [ { terserOptions: { - compress: true, // 默认使用terser压缩 + compress: false, // 默认使用terser压缩 // compress: { // drop_console: true, // 去掉打印 // }, // 默认使用terser压缩 diff --git a/project.config.json b/project.config.json index 37e46a6..213e44b 100644 --- a/project.config.json +++ b/project.config.json @@ -6,8 +6,8 @@ "setting": { "urlCheck": false, "es6": false, - "postcss": false, - "minified": false, + "postcss": true, + "minified": true, "coverView": true, "lazyloadPlaceholderEnable": false, "preloadBackgroundData": false, diff --git a/project.private.config.json b/project.private.config.json index b612694..073b5dc 100644 --- a/project.private.config.json +++ b/project.private.config.json @@ -9,6 +9,13 @@ "condition": { "miniprogram": { "list": [ + { + "name": "发货列表", + "pathName": "pages/delivery/index", + "query": "", + "launchMode": "default", + "scene": null + }, { "name": "购物页面", "pathName": "pages/shopping/index", diff --git a/src/app.config.ts b/src/app.config.ts index 02b6211..d53df5e 100644 --- a/src/app.config.ts +++ b/src/app.config.ts @@ -1,11 +1,5 @@ export default defineAppConfig({ - pages: [ - 'pages/index/index', - 'pages/order/index', - 'pages/shopping/index', - 'pages/user/index', - 'pages/login/index', - ], + pages: ['pages/index/index', 'pages/order/index', 'pages/shopping/index', 'pages/user/index', 'pages/login/index'], window: { backgroundTextStyle: 'light', navigationBarBackgroundColor: '#fff', @@ -42,55 +36,41 @@ export default defineAppConfig({ 'custom-wrapper': '/custom-wrapper', }, subPackages: [ + { + root: 'pages/delivery', + pages: ['index'], + }, { root: 'pages/colorRelated', - pages: [ - 'sampleComparison/index', - 'takeColor/index', - 'findColor/index' - ], + pages: ['sampleComparison/index', 'takeColor/index', 'findColor/index'], }, { - root: "pages/addAddress", - pages: [ - "index" - ] + root: 'pages/addAddress', + pages: ['index'], }, { - root: "pages/addressManager", - pages: [ - "index" - ] + root: 'pages/addressManager', + pages: ['index'], }, { - root: "pages/customerPage", - pages: [ - "index" - ] + root: 'pages/customerPage', + pages: ['index'], }, { - root: "pages/orderDetails", - pages: [ - "index" - ] + root: 'pages/orderDetails', + pages: ['index'], }, { - root: "pages/saleuserPage", - pages: [ - "index" - ] + root: 'pages/saleuserPage', + pages: ['index'], }, { - root: "pages/searchPage", - pages: [ - "index" - ] + root: 'pages/searchPage', + pages: ['index'], }, { - root: "pages/submitOrder", - pages: [ - "index" - ] + root: 'pages/submitOrder', + pages: ['index'], }, ], }) diff --git a/src/components/SegmentedControl/index.module.scss b/src/components/SegmentedControl/index.module.scss new file mode 100644 index 0000000..3e79f43 --- /dev/null +++ b/src/components/SegmentedControl/index.module.scss @@ -0,0 +1,19 @@ +.status_list{ + background-color: #fff; + font-size: $font_size; + color: #000; + // margin-top: 20px; + .status_item{ + padding: 20px; + box-sizing: border-box; + } + .selected{ + font-weight: 700; + color: #337FFF; + border-bottom: 4px solid #337FFF; + } + .list_scroll{ + white-space: nowrap; + display: flex; + } +} diff --git a/src/components/SegmentedControl/index.tsx b/src/components/SegmentedControl/index.tsx new file mode 100644 index 0000000..10d7ad1 --- /dev/null +++ b/src/components/SegmentedControl/index.tsx @@ -0,0 +1,59 @@ +import { ScrollView, View } from '@tarojs/components' +import classnames from 'classnames' +import { FC, useEffect, useState } from 'react' +import styles from './index.module.scss' + +type PropsType = { + list: { id: number; name: string }[] + defaultId?: number | null + onSelect?: (val: number) => void +} + +const segmentedControl: FC = (props) => { + const [selectInfo, setSelectInfo] = useState({ + selected: -1, //当前选中的id + tabId: '', //需要滚动到的id + }) + const { list, defaultId, onSelect } = props + + useEffect(() => { + if (typeof defaultId === 'number' && defaultId >= 0) { + console.log('defaultId:::', defaultId) + const index = list?.findIndex((item) => { + return item.id == defaultId + }) + if (index !== -1) { + const num = index > 0 ? index - 1 : 0 + setSelectInfo((e) => ({ ...e, tabId: list[num].id.toString() })) + } + } + setSelectInfo((e) => ({ ...e, selected: defaultId || -1 })) + }, [defaultId]) + + const clickEvent = ({ item, index }: { item: any; index: number }) => { + const num = index > 0 ? index - 1 : 0 + setSelectInfo((e) => ({ ...e, tabId: list[num].id.toString(), selected: item.id })) + onSelect?.(item.id) + } + + return ( + + + + {list.map((item, index) => { + return ( + clickEvent({ item, index })} + className={classnames(styles.status_item, selectInfo.selected == item.id && styles.selected)}> + {item.name} + + ) + })} + + + + ) +} +export default segmentedControl diff --git a/src/components/search/index.module.scss b/src/components/search/index.module.scss index bd72902..2e5038e 100644 --- a/src/components/search/index.module.scss +++ b/src/components/search/index.module.scss @@ -12,7 +12,7 @@ position: relative; display: flex; align-items: center; - width: 100%; + flex: 1 1 auto; input{ font-size: 27px; background: #eee; @@ -66,4 +66,4 @@ padding-left: 20px !important; } -} \ No newline at end of file +} diff --git a/src/components/search/index.tsx b/src/components/search/index.tsx index bad058c..7925652 100644 --- a/src/components/search/index.tsx +++ b/src/components/search/index.tsx @@ -18,7 +18,8 @@ type Params = { btnTitle?: string, debounceTime?: number //防抖时间,不设默认为零 defaultValue?: string, - children?: ReactNode + children?: ReactNode, + customRightSlot?: ReactNode } export default memo(forwardRef(({ @@ -33,7 +34,8 @@ export default memo(forwardRef(({ btnTitle = '搜索', //搜索文字 debounceTime = 0, //防抖时间,不设默认为零 defaultValue = '',//默认值 - children + children, + customRightSlot }: Params, ref) => { const [inputCon, setInputCon] = useState('') const debounceTimeRef = useRef(0) @@ -69,18 +71,40 @@ export default memo(forwardRef(({ } return ( - <> - - - {showIcon && } - onInputEven(e)}> - {!!inputCon && - clearInput()} styleObj={{ width: '20rpx', height: '20rpx', backgroundColor: '#fff', border: '0' }} /> - } - - {showBtn && {btnTitle}} - {children} + <> + + + {showIcon && ( + + )} + onInputEven(e)}> + {!!inputCon && ( + + clearInput()} styleObj={{ width: '20rpx', height: '20rpx', backgroundColor: '#fff', border: '0' }} /> + + )} + {customRightSlot} + + {showBtn && ( + + {btnTitle} - + )} + {children} + + ) -})) \ No newline at end of file +})) diff --git a/src/pages/delivery/components/ItemList/index.module.scss b/src/pages/delivery/components/ItemList/index.module.scss new file mode 100644 index 0000000..818974d --- /dev/null +++ b/src/pages/delivery/components/ItemList/index.module.scss @@ -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; +} diff --git a/src/pages/delivery/components/ItemList/index.tsx b/src/pages/delivery/components/ItemList/index.tsx new file mode 100644 index 0000000..69c90a9 --- /dev/null +++ b/src/pages/delivery/components/ItemList/index.tsx @@ -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 +} + +const ItemList:FC = (props) => { + const { itemData } = props + // 查看详情 + const handleDetail = () => { + + } + // 确认审核 + const handleAudit = () => { + + } + + return ( + + + + 单号:XS-LY-2208220092 + 待审核 + + 销售发货单 + + + + + 货品信息: + + + 大货 + + 2种面料,4种颜色,共5米 + + + + 发货地址: + 永川纺织有限公司 + + + 创建时间: + 2022-09-01 18:32:32 + + + + + 查看详情 + + + 确认审核 + + + + ) +} +export default ItemList diff --git a/src/pages/delivery/index.config.ts b/src/pages/delivery/index.config.ts new file mode 100644 index 0000000..0bb51cc --- /dev/null +++ b/src/pages/delivery/index.config.ts @@ -0,0 +1,3 @@ +export default { + navigationBarTitleText: '发货列表', +} diff --git a/src/pages/delivery/index.module.scss b/src/pages/delivery/index.module.scss new file mode 100644 index 0000000..3deedf7 --- /dev/null +++ b/src/pages/delivery/index.module.scss @@ -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; +} diff --git a/src/pages/delivery/index.tsx b/src/pages/delivery/index.tsx new file mode 100644 index 0000000..e98cf5f --- /dev/null +++ b/src/pages/delivery/index.tsx @@ -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 ( + + + + ) + } + + return ( + + + + + + + + + {/* 状态栏 */} + + + + {/* + {clentList.list.map((item, index) => { + return ( + { + selectClient(item) + }}> + {item.name} + {item.phone} + {item.sale_user_name} + + ) + })} + */} + + + + + + + ) +} +export default Delivery diff --git a/src/pages/order/components/orderStatusList/index.tsx b/src/pages/order/components/orderStatusList/index.tsx index c5cc56e..e1c7bb5 100644 --- a/src/pages/order/components/orderStatusList/index.tsx +++ b/src/pages/order/components/orderStatusList/index.tsx @@ -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 diff --git a/src/pages/order/index.tsx b/src/pages/order/index.tsx index 88bc267..05c4373 100644 --- a/src/pages/order/index.tsx +++ b/src/pages/order/index.tsx @@ -580,14 +580,14 @@ export default () => { return ( - + showSelctPopup()}> 筛选 - + @@ -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)} - > + toPay={(e, item) => toPay(e, item)}> ) })} @@ -634,41 +633,76 @@ export default () => { 订单单号 - { handInput(e) }} placeholderStyle='color:#000000; font-size:26rpx' className={styles.orderInput} value={searchObj.orderNo} placeholder={'请输入或扫描条形码'}> - { handScan() }}> + { + 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} - ) - }) - } + {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} - ) - }) - } + {deliveryList.map((item, index) => { + return ( + { + handCheckDelivery(item) + }} + className={classnames(item.checked ? styles.activemodeBox : styles.modeBox)} + key={index}> + {item.name} + + ) + })} {isDisabled} - - - + + {/* */} @@ -682,9 +716,8 @@ export default () => { handsurePay={(obj) => handsurePay(obj)} showSide={showSide} title={title} - picUrl={picUrl} - > + picUrl={picUrl}> setShowOffine(false)} offlineInfo={itemObj}> - + ) } diff --git a/src/pages/shopping/components/shoppingCartItem/index.tsx b/src/pages/shopping/components/shoppingCartItem/index.tsx index ddee3ff..1237010 100644 --- a/src/pages/shopping/components/shoppingCartItem/index.tsx +++ b/src/pages/shopping/components/shoppingCartItem/index.tsx @@ -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((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 ( -