🐞 fix(#1000663#13): 修复购物页面的样式问题

src/components/iconText/index.module.scss

@@ -1,9 +1,20 @@
 .iconText{
   display: flex;
-  flex-flow: row nowrap;
-  align-items: center;
   font-size: 28px;
   .iconfont{
     font-size: 40px;
   }
+  .text{
+    padding: 8px;
+  }
+}
+// 水平方向
+.iconText--horizontal{
+  flex-flow: row nowrap;
+  align-items: center;
+}
+// 垂直方向
+.iconText--vertical{
+  flex-flow: column nowrap;
+  align-items: center;
 }

src/components/iconText/index.tsx

@@ -1,27 +1,54 @@
-import { FC } from "react"
+import React, { FC, useMemo } from "react"
 import { View, Text } from '@tarojs/components'
 import IconFont, { IconNames } from '../iconfont/iconfont'
 import styles from './index.module.scss'
 import classnames from 'classnames'
 
+type Direaction = 'left' | 'right' | 'bottom' | 'top'
+
 type PropsType = {
   iconName: IconNames
   iconSize?: number
   svg?: boolean
   color?: string,
   text?: string
+  direction?: Direaction
   children?: React.ReactNode
   customClass?: string
   customStyle?: React.CSSProperties
   textClassName?: string
+  textCustomStyle?: React.CSSProperties
 }
 
 const IconText: FC<PropsType> = (props) => {
-  const { children, svg = false, iconName, iconSize = 40, text = '', color } = props
+  const { children, svg = false, iconName, iconSize = 40, text = '', color,textCustomStyle,direction='left' } = props
+  const classNameObject = {
+    [styles['iconText--horizontal']]: ['left', 'right'].includes(direction),
+    [styles['iconText--vertical']]: ['bottom', 'top'].includes(direction)
+  }
+  const iconComponent = svg ? <IconFont name={iconName} size={iconSize} color={color}></IconFont> : <Text className={classnames('iconfont', iconName, styles.iconfont)}></Text>
+
+  const textComponent = children ? children : <Text className={classnames(props.textClassName, styles['text'])} style={textCustomStyle}>{text}</Text>
+
+  const component = ()=>{
+    console.log('direction===>',direction);
+    if(direction === 'left' || direction === 'top'){
+      return <>
+      {iconComponent}
+      {textComponent}
+      </>
+    }else if(direction === 'right' || direction === 'bottom'){
+      return <>
+      {textComponent}
+      {iconComponent}
+      </>
+    }
+  }
+  
+
   return (
-    <View className={classnames(styles.iconText, props.customStyle, props.customClass)}>
+    <View className={classnames(styles.iconText,classNameObject, props.customStyle, props.customClass)}>
-      {svg ? <IconFont name={iconName} size={iconSize} color={color}></IconFont> : <Text className={classnames('iconfont', iconName, styles.iconfont)}></Text>}
+      {component()}
-      {children ? children : <Text className={classnames(props.textClassName)}>{text}</Text>}
     </View>
   )
 }

src/components/search/index.tsx

@@ -92,6 +92,7 @@ export default memo(
                 <IconFont
                   name='icon-sousuo'
                   size={37}
+                  color='#ababac'
                   customClassName={classnames(styles.icon_a_sousuo1_self, placeIcon == 'inner' ? styles.icon_inner : styles.icon_out)}></IconFont>
               )}
               <View className={styles.input_bar}>

src/pages/shopping/components/bottomSettleBar/index.module.scss

@@ -33,7 +33,10 @@
 }
 
 .unit{
-  font-size: 24px;
+  font-size: 22px;
   transform: scale(.7);
   margin-right: 10px;
 }
+.money{
+  font-size: 36px;
+}

src/pages/shopping/components/bottomSettleBar/index.tsx

@@ -23,9 +23,10 @@ export default props => {
         <Text className={styles.moneyText}>预估金额：</Text>
         <Text className={styles.moneyNumber}>
           <Text className={styles.unit}>¥</Text>
-          {Number(Number(amount)
+          <Text className={styles.money}>{Number(Number(amount)
             .toFixed(2))
-            .toLocaleString()}
+            .toLocaleString()}</Text>
+          
         </Text>
       </View>
       <View className={styles.bottomRight}>

src/pages/shopping/components/colorKindItem/index.module.scss

@@ -22,6 +22,7 @@
     display: flex;
     flex-flow: column nowrap;
     justify-content: space-between;
+    align-self: stretch;
     flex: 1 1 auto;
     &--title {
       color: $color_font_one;
@@ -46,7 +47,7 @@
     display: flex;
     flex-flow: column nowrap;
     align-items: flex-end;
-    justify-content: space-around;
+    justify-content: space-between;
     align-self: stretch;
     &--price {
       color: $color_money;

src/pages/shopping/components/shoppingCartItem/index.module.scss

@@ -1,7 +1,6 @@
 .layout {
   margin: 24px;
-  padding-left: 0;
+  padding: 30px 0;
-  padding-right: 0;
   border: 1px solid transparent;
   .checkbox {
     padding: 0 24px;