订单售后

This commit is contained in:
2022-06-08 14:40:07 +08:00
parent c76d6f6448
commit 2c5c3a8ae3
11 changed files with 263 additions and 84 deletions
@@ -116,6 +116,7 @@ export default memo(forwardRef(({onSelect, onChangeShipmentMode, defaultValue =
<View className={styles.order_address_title}>请选择收货地址</View>
<AddressList onSelect={getAddress}/>
</View>
<View className="common_safe_area_y"></View>
</Popup>
</View>
)
@@ -22,55 +22,155 @@
}
}
.apply_after_sales_con{
padding: 0 20px;
.apply_after_sales_title{
display: flex;
align-items: center;
.tag{
font-size: $font_size_min;
background-color: #CDE5FF;
padding: 5px 10px;
border-radius: 6px;
color: $color_main;
}
.title{
font-weight: 700;
font-size: $font_size;
margin-left: 20px;
flex:1;
}
height: 80vh;
.scroll{
height: calc(100% - 80px);
}
.color_list {
.color_item{
.returnSaleInput{
margin: 0 20px;
padding-top: 30px;
border-top: 1px solid #F6F6F6;
.returnSaleInput_item{
display: flex;
align-items: center;
margin: 20px 0;
}
.image{
width: 70px;
height: 70px;
image{
width: 100%;
height: 100%;
border-radius: 50%;
padding-bottom: 20px;
.title{
font-size: $font_size;
font-weight: 700;
}
}
.name_and_number{
padding-left: 30px;
flex:1;
text{
&:nth-child(1) {
font-weight: 700;
font-size: $font_size;
}
&:nth-child(2) {
color: $color_font_two;
font-size: $font_size;
margin-left: 20px;
.select{
flex:1;
height: 60px;
border: 2px solid #e6e6e6;
border-radius: 10px;
margin-left: 20px;
display: flex;
align-items: center;
justify-content: space-between;
padding: 0 20px;
font-size: 26px;
color: $color_font_two;
.miconfont{
font-size: 30px;
}
}
.uploadImg{
width: 202px;
height: 150px;
background: #f0f0f0;
border: 2px dashed #cccccc;
margin-left: 20px;
border-radius: 10px;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
position: relative;
.miconfont{
font-size: 50px;
}
.uploadText{
font-size: 26px;
color: $color_font_three;
}
}
}
}
.other_desc{
padding: 0 20px;
box-sizing: border-box;
.title{
font-size: $font_size;
font-weight: 700;
}
.uploadImg{
position: relative;
.descDataNum{
position: absolute;
right: 10px;
bottom: 10px;
font-size: 22px;
color: #ABABAB;
}
}
Textarea{
background-color: #f3f3f3;
border: 2px solid #e6e6e6;
border-radius: 10px;
width: 100%;
font-size: 25px;
height: 165.4px;
padding: 20px 20px 30px 20px;
box-sizing: border-box;
margin-top: 20px;
}
}
}
.apply_after_sales_list{
padding: 0 20px;
.apply_after_sales_item{
margin-bottom: 30px;
.apply_after_sales_title{
display: flex;
align-items: center;
.tag{
font-size: $font_size_min;
background-color: #CDE5FF;
padding: 5px 10px;
border-radius: 6px;
color: $color_main;
}
.title{
font-weight: 700;
font-size: $font_size;
margin-left: 20px;
flex:1;
}
}
.color_list {
.color_item{
display: flex;
align-items: center;
margin: 20px 0;
}
.image{
width: 70px;
height: 70px;
image{
width: 100%;
height: 100%;
border-radius: 50%;
}
}
.name_and_number{
padding-left: 30px;
flex:1;
text{
&:nth-child(1) {
font-weight: 700;
font-size: $font_size;
}
&:nth-child(2) {
color: $color_font_two;
font-size: $font_size;
margin-left: 20px;
}
}
}
.btn_count{
width: 235px;
height: 64px;
background-color: #ECF5FF;
border-radius: 40px 0px 16px 0px;
padding: 0 20px;
display: flex;
align-items: center;
}
}
}
}
}
@@ -1,4 +1,4 @@
import { Image, Text, View } from "@tarojs/components";
import { Image, ScrollView, Text, Textarea, View } from "@tarojs/components";
import { memo, useState } from "react";
import classnames from "classnames";
import styles from './index.module.scss'
@@ -10,32 +10,98 @@ export default memo(() => {
const [showDesc, setShowDesc] = useState(true)
return (
<View className={styles.apply_after_sales_main}>
<Popup show={showDesc} showTitle={false} onClose={() => setShowDesc(false)} >
<View className={styles.apply_after_sales_head}>申请退货</View>
<View className={styles.kind_number}><Text>2种面料,3种颜色,共6条</Text></View>
<Popup showIconButton={true} show={showDesc} showTitle={false} onClose={() => setShowDesc(false)} >
<View className={styles.apply_after_sales_con}>
<View className={styles.apply_after_sales_title}>
<View className={styles.tag}>大货</View>
<View className={styles.title}>0770# 21S单面平纹(食毛)</View>
</View>
<View className={styles.color_list}>
<View className={styles.color_item}>
<View className={styles.image}><Image src={formatImgUrl('')}/></View>
<View className={styles.name_and_number}><Text>1# 薄荷绿</Text><Text>x1</Text></View>
<View className={styles.count}>
<Counter/>
<View className={styles.apply_after_sales_head}>申请退货</View>
<View className={styles.kind_number}><Text>2种面料,3种颜色,共6条</Text></View>
<ScrollView scrollY className={styles.scroll}>
<View className={styles.apply_after_sales_list}>
<View className={styles.apply_after_sales_item}>
<View className={styles.apply_after_sales_title}>
<View className={styles.tag}>大货</View>
<View className={styles.title}>0770# 21S单面平纹(食毛)</View>
</View>
<View className={styles.color_list}>
<View className={styles.color_item}>
<View className={styles.image}><Image src={formatImgUrl('')}/></View>
<View className={styles.name_and_number}><Text>1# 薄荷绿</Text><Text>x1</Text></View>
<View className={styles.btn_count}>
<Counter/>
</View>
</View>
<View className={styles.color_item}>
<View className={styles.image}><Image src={formatImgUrl('')}/></View>
<View className={styles.name_and_number}><Text>1# 薄荷绿</Text><Text>x1</Text></View>
<View className={styles.btn_count}>
<Counter/>
</View>
</View>
</View>
</View>
<View className={styles.apply_after_sales_item}>
<View className={styles.apply_after_sales_title}>
<View className={styles.tag}>大货</View>
<View className={styles.title}>0770# 21S单面平纹(食毛)</View>
</View>
<View className={styles.color_list}>
<View className={styles.color_item}>
<View className={styles.image}><Image src={formatImgUrl('')}/></View>
<View className={styles.name_and_number}><Text>1# 薄荷绿</Text><Text>x1</Text></View>
<View className={styles.btn_count}>
<Counter/>
</View>
</View>
<View className={styles.color_item}>
<View className={styles.image}><Image src={formatImgUrl('')}/></View>
<View className={styles.name_and_number}><Text>1# 薄荷绿</Text><Text>x1</Text></View>
<View className={styles.btn_count}>
<Counter/>
</View>
</View>
</View>
</View>
</View>
<View className={styles.color_item}>
<View className={styles.image}><Image src={formatImgUrl('')}/></View>
<View className={styles.name_and_number}><Text>1# 薄荷绿</Text><Text>x1</Text></View>
<View className={styles.count}>
<Counter/>
<View className={styles.returnSaleInput}>
<View className={styles.returnSaleInput_item}>
<View className={styles.title}>退货原因</View>
<View className={styles.select}>
<Text>请选择</Text>
<Text className={classnames(styles.miconfont, 'iconfont icon-a-moreback')}></Text>
</View>
</View>
<View className={styles.returnSaleInput_item}>
<View className={styles.title}>货物状况</View>
<View className={styles.select}>
<Text>请选择</Text>
<Text className={classnames(styles.miconfont, 'iconfont icon-a-moreback')}></Text>
</View>
</View>
<View className={styles.returnSaleInput_item}>
<View className={styles.title}>退货说明</View>
<View className={styles.select}>
<Text>请选择</Text>
<Text className={classnames(styles.miconfont, 'iconfont icon-a-moreback')}></Text>
</View>
</View>
<View className={styles.returnSaleInput_item}>
<View className={styles.title}>拍照上传</View>
<View className={styles.uploadImg}>
<Text className={classnames(styles.miconfont, 'iconfont icon-saomazhifu')}></Text>
<Text className={styles.uploadText}>上传照片</Text>
</View>
</View>
</View>
<View className={styles.other_desc}>
<View className={styles.title}>其他说明</View>
<View className={styles.uploadImg}>
<Textarea placeholder="一般情况下选填,当退货说明=“其它问题”时,必填" cursorSpacing={100}></Textarea>
<View className={styles.descDataNum}>0/100</View>
</View>
</View>
</View>
<View className="common_safe_area_y"></View>
</ScrollView>
</View>
<View className="common_safe_area_y"></View>
</Popup>
</View>
)
+1 -1
View File
@@ -226,7 +226,7 @@ import styles from './index.module.scss'
<Remark onSave={(e) => getRemark(e)}/>
</Popup>
<Payment onSubmitSuccess={onPaySuccess} show={payMentShow} onClose={closePayShow} orderInfo={payOrderInfo} />
{/* <ApplyAfterSales/> */}
<ApplyAfterSales/>
<View className="common_safe_area_y"></View>
</View>
)