From f50ccb6f80b311dd24c7d6d107787d2f2f024c52 Mon Sep 17 00:00:00 2001 From: xuan Date: Tue, 28 Feb 2023 11:49:53 +0800 Subject: [PATCH] =?UTF-8?q?=F0=9F=90=9E=20fix(ID1001357):=20=E3=80=90?= =?UTF-8?q?=E9=A2=86=E5=8F=96=E8=89=B2=E5=8D=A1=E3=80=91--=E6=B7=BB?= =?UTF-8?q?=E5=8A=A0=E8=89=B2=E5=8D=A1=E5=A4=9A=E4=B8=AA=EF=BC=8C=E5=88=A0?= =?UTF-8?q?=E9=99=A4=E6=9C=80=E5=90=8E=E4=B8=80=E5=BC=A0=E8=89=B2=E5=8D=A1?= =?UTF-8?q?=EF=BC=8C=E6=B2=A1=E5=BC=B9=E6=A1=86=E6=8F=90=E7=A4=BA=EF=BC=8C?= =?UTF-8?q?=E5=88=A0=E9=99=A4=E5=85=A8=E9=83=A8=E8=89=B2=E5=8D=A1=E5=90=8E?= =?UTF-8?q?=EF=BC=8C=E6=8F=90=E4=BA=A4=E8=AE=A2=E5=8D=95=E6=88=90=E5=8A=9F?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit 【【内部商城小程序】-【领取色卡】--添加色卡多个,删除最后一张色卡,没弹框提示,删除全部色卡后,提交订单成功】 https://www.tapd.cn/53459131/bugtrace/bugs/view/1153459131001001357 --- project.private.config.json | 7 +++ .../colorCardItem/index.module.scss | 39 +++++++++++++ .../components/colorCardItem/index.tsx | 57 ++++++++++++++++++ src/pages/getColorCard/addColorCard/index.tsx | 58 ++++--------------- 4 files changed, 114 insertions(+), 47 deletions(-) create mode 100644 src/pages/getColorCard/addColorCard/components/colorCardItem/index.module.scss create mode 100644 src/pages/getColorCard/addColorCard/components/colorCardItem/index.tsx diff --git a/project.private.config.json b/project.private.config.json index 7f413cf..c66a3ea 100644 --- a/project.private.config.json +++ b/project.private.config.json @@ -58,6 +58,13 @@ "query": "", "launchMode": "default", "scene": null + }, + { + "name": "", + "pathName": "pages/getColorCard/addColorCard/index", + "query": "", + "launchMode": "default", + "scene": null } ] } diff --git a/src/pages/getColorCard/addColorCard/components/colorCardItem/index.module.scss b/src/pages/getColorCard/addColorCard/components/colorCardItem/index.module.scss new file mode 100644 index 0000000..5a9dd7a --- /dev/null +++ b/src/pages/getColorCard/addColorCard/components/colorCardItem/index.module.scss @@ -0,0 +1,39 @@ +.colorCardBottom { + width: 100%; + display: flex; + flex-flow: row nowrap; + justify-content: space-between; + overflow: hidden; + margin-bottom: 24px; + .leftCont { + width: 134px; + height: 134px; + border-radius: 8px; + margin-right: 24px; + } + .rightCont { + flex: 1 1 auto; + overflow: hidden; + display: flex; + flex-flow: column nowrap; + justify-content: space-between; + &__top { + font-size: 28px; + @include common_ellipsis(1); + } + &__bottom { + display: flex; + flex-flow: row nowrap; + justify-content: space-between; + width: 100%; + align-items: flex-end; + } + &__left { + flex: 1 1 auto; + overflow: hidden; + } + &__right { + width: 30%; + } + } +} diff --git a/src/pages/getColorCard/addColorCard/components/colorCardItem/index.tsx b/src/pages/getColorCard/addColorCard/components/colorCardItem/index.tsx new file mode 100644 index 0000000..add85dc --- /dev/null +++ b/src/pages/getColorCard/addColorCard/components/colorCardItem/index.tsx @@ -0,0 +1,57 @@ +import { View } from '@tarojs/components' +import { useCallback } from 'react' +import styles from './index.module.scss' +import LabAndImg from '@/components/LabAndImg' +import Tag from '@/components/tag' +import { formatRemoveHashTag } from '@/common/format' +import Counter from '@/components/counter' +import Divider from '@/components/divider' + +interface PropsType { + item: any + onChangeCounter?: (value: number, id: number) => void +} + +const ColorCardItem = (props: PropsType) => { + const { item, onChangeCounter } = props + const labAndImgObj = useCallback((item) => { + return { lab: item?.lab, rgb: item?.rgb, texture_url: item?.texture_url } + }, []) + + const handleCountChange = (value: number) => { + onChangeCounter?.(value, item.id) + } + + return + + + + + + + + {item.color_card_name} + + + + { + item.affiliation_product.map((product_color, index) => { + return {formatRemoveHashTag(product_color.code)} + }) + } + + + + + + + + +} +export default ColorCardItem diff --git a/src/pages/getColorCard/addColorCard/index.tsx b/src/pages/getColorCard/addColorCard/index.tsx index dba9cb7..46b5350 100644 --- a/src/pages/getColorCard/addColorCard/index.tsx +++ b/src/pages/getColorCard/addColorCard/index.tsx @@ -1,7 +1,8 @@ import { Text, View } from '@tarojs/components' import Taro, { useDidShow, useUnload } from '@tarojs/taro' -import { useCallback, useEffect, useState } from 'react' +import { useCallback, useEffect, useRef, useState } from 'react' import styles from './index.module.scss' +import ColorCardItem from './components/colorCardItem' import LayoutBlock from '@/components/layoutBlock' import NormalButton from '@/components/normalButton' import Divider from '@/components/divider' @@ -30,6 +31,9 @@ const AddColorCard = () => { const { fetchData: fetchClientData } = ClientListApi() const [order, setOrder] = useState([]) + const orderRef = useRef(order) + orderRef.current = order + console.log('AddColorCard rerender', order) useDidShow(() => { const colorCardCache = Taro.getStorageSync('colorCardCache') @@ -106,6 +110,7 @@ const AddColorCard = () => { }) return } + if (order.length === 0) { return alert.none('请选择色卡') } // 请求数据 const res = await fetchData({ address_id: addressInfo.address_id, @@ -130,26 +135,17 @@ const AddColorCard = () => { return { lab: item?.lab, rgb: item?.rgb, texture_url: item?.texture_url } }, []) - const getInputValue = () => { - - } - const deleteColorCard = (id) => { setOrder((prev) => { return prev.filter(item => item.id !== id) }) - Taro.setStorageSync('colorCardCache', JSON.stringify(order.filter(item => item.id !== id))) + Taro.setStorageSync('colorCardCache', JSON.stringify(orderRef.current.filter(item => item.id !== id))) } const handleCountChange = (value: number, id: number) => { - console.log('value', value, order) - if (order.length === 1 && value === 0) { - Taro.showToast({ - title: '最后一个色卡不能删除', - icon: 'none', - duration: 2000, - }) - return + console.log('value', value, orderRef.current) + if (orderRef.current.length === 1 && value === 0) { + return alert.none('最后一个色卡不能删除') } if (value === 0) { Taro.showModal({ @@ -328,39 +324,7 @@ const AddColorCard = () => { { order.map((item) => { return ( - - - - - - - - - {item.color_card_name} - - - - { - item.affiliation_product.map((product_color, index) => { - return {formatRemoveHashTag(product_color.code)} - }) - } - - - handleCountChange(e, item.id)} - onClickBtn={getInputValue} - unit="本" - minNum={0} - maxNum={2} - /> - - - - - + ) }) }