🌈 style(样式优化): 样式优化

src/common/constant.ts

@@ -1,11 +1,11 @@
-export const BASE_URL = CURRENT_BASE_URL
+// export const BASE_URL = CURRENT_BASE_URL
 // export const BASE_URL = `http://192.168.0.75:50001/lymarket`
 // export const BASE_URL = `http://192.168.0.89:50001/lymarket`
 // 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://pre.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` // 发
 // export const BASE_URL = `http://192.168.1.30:50001/lymarket` // 发

src/components/counter/index.module.scss

@@ -24,7 +24,7 @@
   }
   .input {
     display: flex;
-    align-items: flex-end;
+    align-items: center;
     background-color: #fff;
     padding: 5px 10px;
     box-sizing: border-box;
@@ -34,6 +34,7 @@
       font-size: $font_size_medium;
       width: 100%;
       padding-right: 10px;
+      text-align: center;
     }
   }
 

src/components/goodsItem/index.module.scss

@@ -60,6 +60,9 @@
     }
 
     .rightFontsbox {
+      display: flex;
+      flex-direction: column;
+      align-items: flex-end;
       .moneyFlex {
         margin-bottom: 14px;
         display: flex;
@@ -79,7 +82,6 @@
       }
 
       .inputBox {
-        width: 189px;
         height: 64px;
         border-radius: 8px;
         border: 1px solid #979797;

src/components/goodsItem/index.tsx

@@ -3,17 +3,17 @@ import { memo, useCallback, useEffect, useMemo, useRef, useState } from 'react'
 import classnames from 'classnames'
 import styles from './index.module.scss'
 import LabAndImg from '@/components/LabAndImg'
+import { formatPriceDiv, formatWeightDiv } from '@/common/format'
 
 interface props {
   clickAdd: (any) => void
-  // onInputEven?: (a: any, c: any) => void,
   clickReduce: (any) => void
   handPlus: (any) => void
   modeFont?: number
   value: {
     showInput?: boolean
     nums?: string
-    bulk_price?: Number | 0
+    bulk_price?: Number
     length_cut_price?: Number
     weight_cut_price?: Number
     code?: string
@@ -33,21 +33,31 @@ interface props {
   onBlur?: (a: any, c: any) => void
 }
 const GoodsItem = (props: props) => {
-  const [value, setValue] = useState<any>({ count: props.value.nums })
+  const {
+    clickAdd,
+    clickReduce,
+    handPlus,
+    modeFont,
+    value: valueInfo,
+    onBlur,
+  } = props
+
+  const [value, setValue] = useState<any>({ count: valueInfo.nums })
+  console.log(value.count, 'value.count')
 
   const onInputEven = (e) => {
     const res = e.detail.value
-    if (props.modeFont == 0) {
+    if (modeFont == 0) {
       if (Number(res) < 1) {
         setValue({ count: '' })
       }
     }
-    if (props.modeFont == 1) {
+    if (modeFont == 1) {
       if (Number(res) < 0) {
         setValue({ count: '' })
       }
     }
-    if (props.modeFont == 2) {
+    if (modeFont == 2) {
       if (Number(res) < 0) {
         setValue({ count: '' })
       }
@@ -55,63 +65,50 @@ const GoodsItem = (props: props) => {
   }
 
   const type = useMemo(() => {
-    if (props.modeFont === 0) {
+    if (modeFont === 0) {
       return 'number'
     }
     else {
       return 'digit'
     }
-  }, [props.modeFont])
+  }, [modeFont])
 
   const labAndImgObj = useCallback((item) => {
     return { lab: item.lab, rgb: item.rgb, texture_url: item.texture_url }
   }, [])
+
   return (
     <View className={styles.goodsBox}>
-
-      {/* {
-        props?.value?.rgb?.r == 0 && props?.value?.rgb?.g == 0 && props?.value?.rgb?.b == 0 && <Image className={styles.pic} mode="aspectFill" src="https://test.cdn.zzfzyc.com/mall/no_img.png"></Image>
-      }
-      {
-        (props?.value?.rgb?.r != 0 || props?.value?.rgb?.g != 0 || props?.value?.rgb?.b != 0)
-                && <View className={styles.pic} style={{ backgroundColor: `rgb(${props?.value?.rgb?.r} ${props?.value?.rgb?.g} ${props?.value.rgb?.b})` }}></View>
-      } */}
       <View className={styles.pic}>
-        <LabAndImg value={labAndImgObj(props.value)} />
+        <LabAndImg value={labAndImgObj(valueInfo)} />
       </View>
       <View className={styles.rightGoodbox}>
         <View className={styles.leftFontsbox}>
-          <View className={styles.title}>{props.value?.code} {props.value?.name}</View>
+          <View className={styles.title}>{valueInfo?.code} {valueInfo?.name}</View>
-          <View className={styles.productNums}>剩：{props.value?.roll}件</View>
+          <View className={styles.productNums}>剩：{valueInfo?.roll}件</View>
           {
-            props?.modeFont === 0 && <View className={styles.productName}>空差：{props?.value?.weight_error as number / 1000 || 0}Kg</View>
+            modeFont === 0 && <View className={styles.productName}>空差：{formatWeightDiv(valueInfo?.weight_error) || 0}Kg</View>
           }
         </View>
         <View className={styles.rightFontsbox}>
           <View className={styles.moneyFlex}>
             {
-              props?.modeFont === 0 && props.value?.last_bulk_price !== props.value?.bulk_price && <View className={styles.lastBox}>¥{props?.modeFont === 0 ? Number(props.value?.last_bulk_price) / 100 : props.modeFont === 1 ? Number(props.value?.last_length_cut_price) / 100 : Number(props.value?.last_weight_cut_price) / 100} {props.modeFont as any != 1 ? '/Kg' : '/m'}</View>
+              modeFont === 0 && valueInfo?.last_bulk_price !== valueInfo?.bulk_price && <View className={styles.lastBox}>¥{modeFont === 0 ? formatPriceDiv(valueInfo?.last_bulk_price) : modeFont === 1 ? formatPriceDiv(valueInfo?.last_length_cut_price) : formatPriceDiv(valueInfo?.last_weight_cut_price)} {modeFont as any != 1 ? '/Kg' : '/m'}</View>
             }
-            <View className={styles.money}>¥{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 != 1 ? '/Kg' : '/m'}</View>
+            <View className={styles.money}>¥{modeFont === 0 ? formatPriceDiv(valueInfo?.bulk_price) : modeFont === 1 ? formatPriceDiv(valueInfo?.length_cut_price) : formatPriceDiv(valueInfo?.weight_cut_price)}{modeFont != 1 ? '/Kg' : '/m'}</View>
           </View>
           {
-            props.value.showInput && <View className={styles.inputBox}>
+            valueInfo.showInput
-              <View className={styles.reduceBox} onClick={() => { props.clickReduce?.(props.value) }}>
+              ? <View className={styles.inputBox}>
-                <View className={styles.reduce}>
+                <View className={styles.reduceBox} onClick={() => { clickReduce?.(valueInfo) }}>
+                  <View className={styles.reduce}></View>
                 </View>
+                <View className={styles.numsBox}>
+                  <Input alwaysEmbed cursorSpacing={100} adjustPosition type={type as any} value={value.count} onInput={onInputEven} onBlur={e => onBlur?.(e, valueInfo.id)}></Input>
+                </View>
+                <View className={styles.addBox} onClick={() => handPlus?.(valueInfo)}>+</View>
               </View>
-              <View className={styles.numsBox}>
+              : <View className={styles.addtine} onClick={() => clickAdd?.(valueInfo)}>+</View>
-                <Input alwaysEmbed cursorSpacing={100} adjustPosition type={type as any} value={value.count} onInput={onInputEven} onBlur={e => props.onBlur?.(e, props.value.id)}></Input>
-
-                {/* <Input type={type as any} value={value.count} onInput={($event) => onInputEven($event, props.value)}></Input> */}
-              </View>
-              <View className={styles.addBox} onClick={() => { props.handPlus?.(props.value) }}>
-                                +
-              </View>
-            </View>
-          }
-          {
-            !props.value.showInput && <View className={styles.addtine} onClick={() => props.clickAdd?.(props.value)}>+</View>
           }
         </View>
       </View>
@@ -119,4 +116,3 @@ const GoodsItem = (props: props) => {
   )
 }
 export default memo(GoodsItem)
-// ($event) => onInputEven($event, props.value)

src/components/shoppingCart/index.tsx

@@ -108,6 +108,7 @@ const ShoppingCart = (props: prosObj, ref) => {
 
   const rows = ({ id, index, style, data }: any) => {
     const item = data[index]
+    console.log('item', item)
     return (
       <>
         <Goods

src/pages/getColorCard/colorCardList/index.module.scss

@@ -96,9 +96,10 @@ page {
   padding: 7px;
   bottom: 0px;
   right: 0px;
-  opacity: 0.70;
+  opacity: 0.7;
   color: #ffffff;
   text-align: center;
   font-size: 24px;
   z-index: 1;
+  background: rgba(0, 0, 0, 0.6);
 }