🐞 fix(修复ui):
This commit is contained in:
parent
f659bfb591
commit
990b8a4f1d
@ -32,9 +32,9 @@
|
|||||||
border-radius: 10px;
|
border-radius: 10px;
|
||||||
input {
|
input {
|
||||||
font-size: $font_size_medium;
|
font-size: $font_size_medium;
|
||||||
// text-align: right;
|
text-align: center;
|
||||||
width: 100%;
|
width: 100%;
|
||||||
padding-right: 10px;
|
// padding-right: 10px;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
@ -2,7 +2,7 @@
|
|||||||
display: flex;
|
display: flex;
|
||||||
background-color: #fff;
|
background-color: #fff;
|
||||||
font-size: 32px;
|
font-size: 32px;
|
||||||
font-weight: 500;
|
color: #000000cc;
|
||||||
.select_list_item {
|
.select_list_item {
|
||||||
height: 96px;
|
height: 96px;
|
||||||
text-align: center;
|
text-align: center;
|
||||||
@ -18,6 +18,7 @@
|
|||||||
.select_list_ed {
|
.select_list_ed {
|
||||||
text {
|
text {
|
||||||
border-bottom: 6px solid #337fff;
|
border-bottom: 6px solid #337fff;
|
||||||
|
font-weight: 500;
|
||||||
}
|
}
|
||||||
color: #4581ff;
|
color: #4581ff;
|
||||||
}
|
}
|
||||||
|
|||||||
@ -82,6 +82,7 @@
|
|||||||
font-size: 28px;
|
font-size: 28px;
|
||||||
text-align: right;
|
text-align: right;
|
||||||
margin-top: 16px;
|
margin-top: 16px;
|
||||||
|
font-weight: 700;
|
||||||
}
|
}
|
||||||
.btns {
|
.btns {
|
||||||
padding-top: 32px;
|
padding-top: 32px;
|
||||||
@ -95,6 +96,7 @@
|
|||||||
border: 1px solid rgba(0, 0, 0, 0.06);
|
border: 1px solid rgba(0, 0, 0, 0.06);
|
||||||
text-align: center;
|
text-align: center;
|
||||||
line-height: 72px;
|
line-height: 72px;
|
||||||
|
font-size: 28px;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
@ -83,6 +83,7 @@
|
|||||||
font-size: 28px;
|
font-size: 28px;
|
||||||
text-align: right;
|
text-align: right;
|
||||||
margin-top: 16px;
|
margin-top: 16px;
|
||||||
|
font-weight: 700;
|
||||||
}
|
}
|
||||||
.btns {
|
.btns {
|
||||||
padding-top: 32px;
|
padding-top: 32px;
|
||||||
@ -96,6 +97,7 @@
|
|||||||
border: 1px solid rgba(0, 0, 0, 0.06);
|
border: 1px solid rgba(0, 0, 0, 0.06);
|
||||||
text-align: center;
|
text-align: center;
|
||||||
line-height: 72px;
|
line-height: 72px;
|
||||||
|
font-size: 28px;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
@ -12,6 +12,9 @@
|
|||||||
justify-content: space-between;
|
justify-content: space-between;
|
||||||
border-bottom: 1px solid rgba(0, 0, 0, 0.1);
|
border-bottom: 1px solid rgba(0, 0, 0, 0.1);
|
||||||
text {
|
text {
|
||||||
|
&:nth-child(1) {
|
||||||
|
font-weight: 700;
|
||||||
|
}
|
||||||
&:nth-child(2) {
|
&:nth-child(2) {
|
||||||
color: rgba(0, 0, 0, 0.8);
|
color: rgba(0, 0, 0, 0.8);
|
||||||
}
|
}
|
||||||
@ -25,5 +28,8 @@
|
|||||||
height: 82px;
|
height: 82px;
|
||||||
line-height: 82px;
|
line-height: 82px;
|
||||||
color: rgba(0, 0, 0, 0.4);
|
color: rgba(0, 0, 0, 0.4);
|
||||||
|
.seleced {
|
||||||
|
color: rgba(0, 0, 0, 0.8);
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
@ -1,5 +1,6 @@
|
|||||||
import { Text, View } from '@tarojs/components'
|
import { Text, View } from '@tarojs/components'
|
||||||
import { useEffect, useState } from 'react'
|
import { useEffect, useState } from 'react'
|
||||||
|
import classNames from 'classnames'
|
||||||
import styles from './index.module.scss'
|
import styles from './index.module.scss'
|
||||||
import Remark from '@/components/remark'
|
import Remark from '@/components/remark'
|
||||||
import IconFont from '@/components/iconfont/iconfont'
|
import IconFont from '@/components/iconfont/iconfont'
|
||||||
@ -26,7 +27,7 @@ export default (props: Param) => {
|
|||||||
<View className={styles.more}>填写/修改备注 <IconFont color="#000000FF" name="icon-rukou" size={30} /></View>
|
<View className={styles.more}>填写/修改备注 <IconFont color="#000000FF" name="icon-rukou" size={30} /></View>
|
||||||
</View>
|
</View>
|
||||||
<View className={styles.remarks_message}>
|
<View className={styles.remarks_message}>
|
||||||
<Text>{data || '尚未备注信息'}</Text>
|
<Text className={classNames(data ? styles.seleced : '')}>{data || '尚未备注信息'}</Text>
|
||||||
</View>
|
</View>
|
||||||
</View>
|
</View>
|
||||||
<Remark show={showRemark} onSave={getOnSave} onClose={() => setShowRemark(false)} />
|
<Remark show={showRemark} onSave={getOnSave} onClose={() => setShowRemark(false)} />
|
||||||
|
|||||||
@ -10,6 +10,7 @@
|
|||||||
font-size: 28px;
|
font-size: 28px;
|
||||||
color: rgba(0, 0, 0, 0.8);
|
color: rgba(0, 0, 0, 0.8);
|
||||||
border-bottom: 1px solid rgba(0, 0, 0, 0.1);
|
border-bottom: 1px solid rgba(0, 0, 0, 0.1);
|
||||||
|
font-weight: 700;
|
||||||
}
|
}
|
||||||
.order_info_list {
|
.order_info_list {
|
||||||
font-size: 28px;
|
font-size: 28px;
|
||||||
|
|||||||
@ -11,6 +11,9 @@
|
|||||||
justify-content: space-between;
|
justify-content: space-between;
|
||||||
border-bottom: 1px solid rgba(0, 0, 0, 0.1);
|
border-bottom: 1px solid rgba(0, 0, 0, 0.1);
|
||||||
text {
|
text {
|
||||||
|
&:nth-child(1) {
|
||||||
|
font-weight: 700;
|
||||||
|
}
|
||||||
&:nth-child(2) {
|
&:nth-child(2) {
|
||||||
color: rgba(0, 0, 0, 0.8);
|
color: rgba(0, 0, 0, 0.8);
|
||||||
}
|
}
|
||||||
|
|||||||
@ -1,6 +1,7 @@
|
|||||||
import { Text, View } from '@tarojs/components'
|
import { Text, View } from '@tarojs/components'
|
||||||
import Taro, { getCurrentPages, useDidShow } from '@tarojs/taro'
|
import Taro, { getCurrentPages, useDidShow } from '@tarojs/taro'
|
||||||
import { memo, useCallback, useEffect, useState } from 'react'
|
import { memo, useCallback, useEffect, useState } from 'react'
|
||||||
|
import classNames from 'classnames'
|
||||||
import styles from './index.module.scss'
|
import styles from './index.module.scss'
|
||||||
import Counter from '@/components/counter'
|
import Counter from '@/components/counter'
|
||||||
import LabAndImg from '@/components/LabAndImg'
|
import LabAndImg from '@/components/LabAndImg'
|
||||||
@ -36,14 +37,15 @@ export interface Param {
|
|||||||
value: ColorItem
|
value: ColorItem
|
||||||
onChangeNum?: (val: { id: number; count: number }) => void
|
onChangeNum?: (val: { id: number; count: number }) => void
|
||||||
onDelData?: (val: number) => void
|
onDelData?: (val: number) => void
|
||||||
|
bottomStatus?: boolean
|
||||||
}
|
}
|
||||||
|
|
||||||
export default memo((props: Param) => {
|
export default memo((props: Param) => {
|
||||||
return <ProductItem onChangeNum={props.onChangeNum} onDelData={props.onDelData} value={props.value} />
|
return <ProductItem onChangeNum={props.onChangeNum} onDelData={props.onDelData} value={props.value} bottomStatus={props.bottomStatus} />
|
||||||
})
|
})
|
||||||
|
|
||||||
const ProductItem = memo((props: Param) => {
|
const ProductItem = memo((props: Param) => {
|
||||||
const { value } = props
|
const { value, bottomStatus = true } = props
|
||||||
const labAndImgObj = useCallback(
|
const labAndImgObj = useCallback(
|
||||||
(item) => {
|
(item) => {
|
||||||
return { lab: item.lab, rgb: item.rgb, texture_url: item.texture_url }
|
return { lab: item.lab, rgb: item.rgb, texture_url: item.texture_url }
|
||||||
@ -72,7 +74,7 @@ const ProductItem = memo((props: Param) => {
|
|||||||
return <>
|
return <>
|
||||||
<View key={value.id} className={styles.card_item}>
|
<View key={value.id} className={styles.card_item}>
|
||||||
<View className={styles.img}><LabAndImg value={labAndImgObj(props.value)} /></View>
|
<View className={styles.img}><LabAndImg value={labAndImgObj(props.value)} /></View>
|
||||||
<View className={styles.name_count}>
|
<View className={classNames(styles.name_count, bottomStatus && styles.bottom_styles)}>
|
||||||
<Text>{formatHashTag(value.code, value.name)}</Text>
|
<Text>{formatHashTag(value.code, value.name)}</Text>
|
||||||
<View className={styles.btns}>
|
<View className={styles.btns}>
|
||||||
<View className={styles.count_btn}>
|
<View className={styles.count_btn}>
|
||||||
@ -82,7 +84,7 @@ const ProductItem = memo((props: Param) => {
|
|||||||
defaultNum={value.count}
|
defaultNum={value.count}
|
||||||
onClickBtn={onChangeNum}
|
onClickBtn={onChangeNum}
|
||||||
onBlue={onChangeNum}
|
onBlue={onChangeNum}
|
||||||
unit="件"
|
unit="份"
|
||||||
onMin={onMin}
|
onMin={onMin}
|
||||||
onMax={onMax}
|
onMax={onMax}
|
||||||
/>
|
/>
|
||||||
|
|||||||
@ -12,6 +12,9 @@
|
|||||||
justify-content: space-between;
|
justify-content: space-between;
|
||||||
border-bottom: 1px solid rgba(0, 0, 0, 0.1);
|
border-bottom: 1px solid rgba(0, 0, 0, 0.1);
|
||||||
text {
|
text {
|
||||||
|
&:nth-child(1) {
|
||||||
|
font-weight: 700;
|
||||||
|
}
|
||||||
&:nth-child(2) {
|
&:nth-child(2) {
|
||||||
color: rgba(0, 0, 0, 0.8);
|
color: rgba(0, 0, 0, 0.8);
|
||||||
}
|
}
|
||||||
|
|||||||
@ -5,6 +5,11 @@
|
|||||||
.backIcon {
|
.backIcon {
|
||||||
transform: rotate(180deg);
|
transform: rotate(180deg);
|
||||||
}
|
}
|
||||||
|
.address_info {
|
||||||
|
padding: 20px 20px 0 20px;
|
||||||
|
}
|
||||||
|
.remark {
|
||||||
|
}
|
||||||
.add_card_btn {
|
.add_card_btn {
|
||||||
margin: 24px;
|
margin: 24px;
|
||||||
height: 82px;
|
height: 82px;
|
||||||
|
|||||||
@ -223,18 +223,18 @@ export default () => {
|
|||||||
</View>
|
</View>
|
||||||
} title="领取剪样"
|
} title="领取剪样"
|
||||||
></NavBar>
|
></NavBar>
|
||||||
<Address onSelect={getAddress} defaultValue={addressInfo} />
|
<View className={styles.address_info}><Address onSelect={getAddress} defaultValue={addressInfo} /></View>
|
||||||
<View className={styles.add_card_btn} onClick={onAddCard}>添加剪样</View>
|
<View className={styles.add_card_btn} onClick={onAddCard}>添加剪样</View>
|
||||||
{list?.map(item => <View key={item.id} className={styles.card_con}>
|
{list?.map((item, index) => <View key={item.id} className={styles.card_con}>
|
||||||
<View className={styles.card_header}>{formatHashTag(item.code, item.name)}</View>
|
<View className={styles.card_header}>{formatHashTag(item.code, item.name)}</View>
|
||||||
<View className={styles.card_list}>
|
<View className={styles.card_list}>
|
||||||
{item.colors?.map(citem =>
|
{item.colors?.map(citem =>
|
||||||
<ProductCard key={citem.id} value={citem} onDelData={onDelData(item)} onChangeNum={onChangeNum} />,
|
<ProductCard key={citem.id} value={citem} onDelData={onDelData(item)} onChangeNum={onChangeNum} />,
|
||||||
)}
|
)}
|
||||||
<View className={styles.express_btn}>快递到付</View>
|
{(list?.length - 1 === index) && <View className={styles.express_btn}>快递到付</View>}
|
||||||
</View>
|
</View>
|
||||||
</View>)}
|
</View>)}
|
||||||
<Remark onSave={onRemark} defaultValue={remarkData} />
|
<View className={styles.remark}><Remark onSave={onRemark} defaultValue={remarkData} /></View>
|
||||||
<View className={styles.order_btn}>
|
<View className={styles.order_btn}>
|
||||||
<View className={styles.btn_con} onClick={onSubmitData}>
|
<View className={styles.btn_con} onClick={onSubmitData}>
|
||||||
<Text>{numText}</Text>
|
<Text>{numText}</Text>
|
||||||
|
|||||||
@ -10,6 +10,7 @@
|
|||||||
font-size: 28px;
|
font-size: 28px;
|
||||||
color: rgba(0, 0, 0, 0.8);
|
color: rgba(0, 0, 0, 0.8);
|
||||||
border-bottom: 1px solid rgba(0, 0, 0, 0.1);
|
border-bottom: 1px solid rgba(0, 0, 0, 0.1);
|
||||||
|
font-weight: 700;
|
||||||
}
|
}
|
||||||
.order_info_list {
|
.order_info_list {
|
||||||
font-size: 28px;
|
font-size: 28px;
|
||||||
@ -31,6 +32,7 @@
|
|||||||
line-height: 32px;
|
line-height: 32px;
|
||||||
color: #337fffff;
|
color: #337fffff;
|
||||||
margin-left: 10px;
|
margin-left: 10px;
|
||||||
|
font-size: 24px;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
@ -38,7 +38,7 @@ export default (props: Param) => {
|
|||||||
[value],
|
[value],
|
||||||
)
|
)
|
||||||
return <>
|
return <>
|
||||||
{value?.map((pitem) => {
|
{value?.map((pitem, pindex) => {
|
||||||
return <View key={pitem.product_id} className={styles.card_con}>
|
return <View key={pitem.product_id} className={styles.card_con}>
|
||||||
<View className={styles.card_header}>{formatHashTag(pitem.code, pitem.name)}</View>
|
<View className={styles.card_header}>{formatHashTag(pitem.code, pitem.name)}</View>
|
||||||
<View className={styles.card_list}>
|
<View className={styles.card_list}>
|
||||||
@ -54,7 +54,7 @@ export default (props: Param) => {
|
|||||||
</View>
|
</View>
|
||||||
</View>
|
</View>
|
||||||
})}
|
})}
|
||||||
<View className={styles.express_btn}>快递到付</View>
|
{(value.length - 1 === pindex) && <View className={styles.express_btn}>快递到付</View>}
|
||||||
</>
|
</>
|
||||||
</View>
|
</View>
|
||||||
</View>
|
</View>
|
||||||
|
|||||||
@ -11,6 +11,9 @@
|
|||||||
justify-content: space-between;
|
justify-content: space-between;
|
||||||
border-bottom: 1px solid rgba(0, 0, 0, 0.1);
|
border-bottom: 1px solid rgba(0, 0, 0, 0.1);
|
||||||
text {
|
text {
|
||||||
|
&:nth-child(1) {
|
||||||
|
font-weight: 700;
|
||||||
|
}
|
||||||
&:nth-child(2) {
|
&:nth-child(2) {
|
||||||
color: rgba(0, 0, 0, 0.8);
|
color: rgba(0, 0, 0, 0.8);
|
||||||
}
|
}
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user