From 69724873bfd166903130d712e3c79d7a2b5d57b4 Mon Sep 17 00:00:00 2001 From: czm <2192718639@qq.com> Date: Tue, 10 Jan 2023 11:33:00 +0800 Subject: [PATCH] =?UTF-8?q?=E2=9C=A8=20feat(ID1000720=E8=AF=A6=E6=83=85?= =?UTF-8?q?=E8=9E=BA=E7=BA=B9=E6=8E=A8=E8=8D=90):?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/common/constant.ts | 6 +- .../components/orderCount/index.module.scss | 35 +++++++++ .../details/components/orderCount/index.tsx | 19 +++-- .../components/recommend/index.module.scss | 9 +++ .../details/components/recommend/index.tsx | 73 ++++++++++++++----- src/pages/details/index.tsx | 28 ++++++- 6 files changed, 143 insertions(+), 27 deletions(-) diff --git a/src/common/constant.ts b/src/common/constant.ts index 102d2a1..a2fccba 100644 --- a/src/common/constant.ts +++ b/src/common/constant.ts @@ -4,7 +4,7 @@ // export const BASE_URL = `http://10.0.0.5:50001/lymarket` // export const BASE_URL = `http://192.168.0.89:40001/lymarket` // export const BASE_URL = `http://192.168.1.165:40001/lymarket` // 王霞 -export const BASE_URL = 'https://test.zzfzyc.com/lymarket' // 测试环境 +// export const BASE_URL = 'https://test.zzfzyc.com/lymarket' // 测试环境 // export const BASE_URL = 'https://pre.zzfzyc.com/lymarket' // 预发布 // export const BASE_URL = `http://192.168.1.9:40001/lymarket` // 发 // export const BASE_URL = `http://192.168.1.9:50005/lymarket` // 发 @@ -13,8 +13,8 @@ export const BASE_URL = 'https://test.zzfzyc.com/lymarket' // 测试环境 // export const BASE_URL = 'https://www.zzfzyc.com/lymarket' // 正式环境 // export const BASE_URL = `http://192.168.1.5:40001/lymarket` // 王霞 // export const BASE_URL = 'http://192.168.1.7:50002/lymarket' // 添 -// export const BASE_URL = 'http://192.168.1.28:50002/lymarket' // 婷 -export const BASE_URL = 'http://192.168.1.42:50002/lymarket' // 杰 +export const BASE_URL = 'http://192.168.1.28:50002/lymarket' // 婷 +// export const BASE_URL = 'http://192.168.1.42:50002/lymarket' // 杰 // CDN // 生成密钥 diff --git a/src/pages/details/components/orderCount/index.module.scss b/src/pages/details/components/orderCount/index.module.scss index c24ec47..999b6ae 100644 --- a/src/pages/details/components/orderCount/index.module.scss +++ b/src/pages/details/components/orderCount/index.module.scss @@ -9,6 +9,41 @@ font-size: 32px; font-weight: 700; padding: 20px; + display: flex; + justify-content: space-between; + align-items: center; + .header_title { + display: flex; + align-items: center; + } + .header_label { + width: 212px; + height: 40px; + background: #fcf4e9; + border-radius: 5px; + font-size: 24px; + display: flex; + text { + display: inline-block; + height: 100%; + display: flex; + justify-content: center; + align-items: center; + &:nth-child(1) { + width: 80px; + height: 40px; + background: #fee5cd; + border-radius: 5px 0px 0px 5px; + color: #522b0fff; + } + &:nth-child(2) { + flex: 1; + background: #fcf4e9ff; + border-radius: 0px 5px 5px 0px; + color: #c57c26ff; + } + } + } } .colorFind { padding: 10px 20px; diff --git a/src/pages/details/components/orderCount/index.tsx b/src/pages/details/components/orderCount/index.tsx index 187d567..dbf1e36 100644 --- a/src/pages/details/components/orderCount/index.tsx +++ b/src/pages/details/components/orderCount/index.tsx @@ -27,8 +27,9 @@ interface param { title?: string productId?: number is_first_login?: boolean // 是否首次进来需要展示引导 + recommendStatus?: boolean } -const OrderCount = ({ show = false, onClose, title = '', productId = 0, is_first_login = true }: param) => { +const OrderCount = ({ show = false, onClose, title = '', productId = 0, is_first_login = true, recommendStatus = false }: param) => { const { adminUserInfo } = useSelector(state => state.userInfo) const [selectList, _] = useState([ @@ -137,7 +138,7 @@ const OrderCount = ({ show = false, onClose, title = '', productId = 0, is_first } // 显示获取 useEffect(() => { - if (show) { + if (show && productId) { setSelectIndex(0) condition.current.code_or_name = null setSearchShow(false) @@ -145,7 +146,7 @@ const OrderCount = ({ show = false, onClose, title = '', productId = 0, is_first getColorList() } setShowPopup(show) - }, [show]) + }, [show, productId]) // 重置数据 useEffect(() => { setSearchShow(false) @@ -330,10 +331,18 @@ const OrderCount = ({ show = false, onClose, title = '', productId = 0, is_first closePopup()}> - {title} + + + {title} + + + {recommendStatus && + 推荐 + 配套螺纹 + } + 下单类型 setshowGuidePopup(true)}>: - {selectList.map((item, index) => { return ( diff --git a/src/pages/details/components/recommend/index.module.scss b/src/pages/details/components/recommend/index.module.scss index 5e6fc9a..1f63600 100644 --- a/src/pages/details/components/recommend/index.module.scss +++ b/src/pages/details/components/recommend/index.module.scss @@ -4,6 +4,7 @@ border-radius: 16px; padding: 24px; box-sizing: border-box; + position: relative; .recommend_title { font-size: 28px; color: #000000ff; @@ -44,4 +45,12 @@ margin-right: 24px; } } + .wxBtn { + width: 100%; + height: 100%; + position: absolute; + top: 0; + left: 0; + opacity: 0; + } } diff --git a/src/pages/details/components/recommend/index.tsx b/src/pages/details/components/recommend/index.tsx index 9607ecc..24b2715 100644 --- a/src/pages/details/components/recommend/index.tsx +++ b/src/pages/details/components/recommend/index.tsx @@ -1,28 +1,67 @@ -import { Text, View } from '@tarojs/components' -import { memo } from 'react' +import type { BaseEventOrig } from '@tarojs/components' +import { Button, Text, View } from '@tarojs/components' +import Taro from '@tarojs/taro' +import { memo, useCallback, useMemo } from 'react' import styles from './index.module.scss' import LabAndImg from '@/components/LabAndImg' import IconFont from '@/components/iconfont/iconfont' +import { formatHashTag } from '@/common/fotmat' +import useLogin from '@/use/useLogin' +import { alert } from '@/common/common' +interface DataType { + product_screw_id: number + product_screw_name: string + product_screw_code: string + screw_rgb: { r: number; g: number; b: number } + screw_lab: { l: number; a: number; b: number } + screw_texture_url: string +} interface ParamType { - onClick?: () => void + onClick?: (id: number) => void + data: DataType + is_authorize_phone?: string } export default memo((props: ParamType) => { - const { onClick } = props - return - 螺纹配套 - - - - - - 0033#21支2*2螺纹 - 管家建议选择配套商品 - - - 去选购 - + const { onClick, data } = props + const labAndImgObj = useMemo( + () => { + return { lab: data?.screw_lab, rgb: data?.screw_rgb, texture_url: data?.screw_texture_url } + }, + [data], + ) + + const { getPhoneNumber, userInfo } = useLogin() + const getPhone = async(e) => { + if (!e.detail.code) { return alert.error('请授权手机号') } + try { + await getPhoneNumber(e.detail.code) + } + catch (msg) { + Taro.showToast({ + icon: 'none', + title: msg, + }) + return false + } + } + return + onClick?.(data?.product_screw_id)}> + 螺纹配套 + + + + + + {formatHashTag(data?.product_screw_code, data?.product_screw_name)} + 管家建议选择配套商品 + + + 去选购 + + + {(!userInfo.adminUserInfo?.is_authorize_phone && )} }) diff --git a/src/pages/details/index.tsx b/src/pages/details/index.tsx index ba859b6..2f1d659 100644 --- a/src/pages/details/index.tsx +++ b/src/pages/details/index.tsx @@ -49,6 +49,9 @@ const Details = (props: Params) => { const router = useRouter() const [params, setParams] = useState({ id: '', share: null }) + const [productId, setProductId] = useState(0) + const [recommendStatus, setRecommendStatus] = useState(false) + // 解析短码参数 const { fetchData: fetchDataAnalysisShortCode } = AnalysisShortCodeApi() const analysisShortCode = async() => { @@ -72,6 +75,7 @@ const Details = (props: Params) => { const { fetchData } = GetProductDetailApi() const getProductDetail = async() => { const { data } = await fetchData({ id: params.id }) + setProductId(data.id) setProductInfo(data) Taro.stopPullDownRefresh() } @@ -117,6 +121,7 @@ const Details = (props: Params) => { getProductDetail() } }, [params]) + // 授权手机号和下单 const placeOrder = async(status = 'to_phone', e: any = {}) => { if (!productInfo.id) { return false } @@ -133,6 +138,8 @@ const Details = (props: Params) => { return false } } + setProductId(productInfo.id) + setRecommendStatus(false) setShowOrderCount(true) } @@ -206,6 +213,23 @@ const Details = (props: Params) => { setShowDialog(true) } + const recommendData = useMemo(() => { + return { + product_screw_id: productInfo?.product_screw_id, + product_screw_name: productInfo?.product_screw_name, + product_screw_code: productInfo?.product_screw_code, + screw_rgb: productInfo?.screw_rgb, + screw_lab: productInfo?.screw_lab, + screw_texture_url: productInfo?.screw_texture_url, + } + }, [productInfo]) + + const openProduct = useCallback((id) => { + setProductId(id) + setShowOrderCount(true) + setRecommendStatus(true) + }, []) + return ( @@ -268,7 +292,7 @@ const Details = (props: Params) => { - placeOrder('to_order')} /> + {!!productInfo?.product_screw_id && } 色号信息 ({productInfo?.product_color_list?.length}) @@ -328,7 +352,7 @@ const Details = (props: Params) => { )} - setShowOrderCount(false)} title={productName} productId={productInfo.id} /> + setShowOrderCount(false)} title={productName} productId={productId} /> setShowCart(false)} /> setshowPopup(false)} productName={productName} productIds={Number(params?.id)}>