xuan/TestRestructureWechatLymarketDist
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

合并dev

Browse Source
This commit is contained in:
czm 2022-05-09 09:57:00 +08:00
parent 948bf72622
commit c2766e2b56
12 changed files with 300 additions and 47 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

16
src/common/common.ts
View File

@ -23,6 +23,7 @@ export const goLink = (path = '', params = {}, type:false|true = false) => {
}
}
<<<<<<< HEAD
/**
* 判断对象为空
* @param object
@ -87,3 +88,18 @@ export const retrieval = (data: any, message: string="请填写完信息", rules
resolve(null);
})
}
=======
// 金额千位分割符
export const formatKbPrice = (number: string) => {
const ret = Array.from(number).reverse().reduce((result: string[],next,i,arr) => {
if((i+1)%3 === 0 && (i+1) !== arr.length) {
result.push(next,',')
return result;
}
result.push(next);
return result;
},[])
return ret.reverse().join('');
}
>>>>>>> 1557571 (确认订单)

54
src/pages/order/components/addressInfo/index.module.scss Normal file
View File

@ -0,0 +1,54 @@
.order_address{
height: 178px;
background: #ffffff;
border-radius: 20px;
display: flex;
align-items: center;
padding: 30px;
box-sizing: border-box;
margin-top: 20px;
.order_address_icon{
font-size: 60px;
}
.order_address_text_con{
flex:1;
padding: 0 30px;
box-sizing: border-box;
.order_address_text_title{
font-size: $font_size;
font-weight: 700;
@include common_ellipsis;
}
.order_address_text_name{
margin-top: 20px;
color: $color_font_three;
font-size: $font_size_medium;
text{
&:nth-child(1) {
margin-right: 40px;
}
}
}
}
.order_address_text_no{
flex: 1;
font-size: $font_size;
font-weight: 700;
margin-left: 30px;
}
.order_address_more_icon{
color: $color_font_three;
font-size: $font_size;
}
}
.order_address_list {
height: 900px;
.order_address_title{
font-size: $font_size;
font-weight: 700;
width: 100%;
text-align: center;
padding: 20px 0 30px 0;
}
}

32
src/pages/order/components/addressInfo/index.tsx Normal file
View File

@ -0,0 +1,32 @@
import AddressList from "@/components/AddressList";
import Popup from "@/components/popup";
import { Text, View } from "@tarojs/components"
import classnames from "classnames";
import { useState } from "react";
import styles from './index.module.scss'
export default () => {
const [showAddressList, setShowAddressList] = useState(false)
return (
<View>
<View className={styles.order_address} onClick={() => setShowAddressList(true)}>
<View className={classnames(styles.order_address_icon, 'iconfont icon-shaixuan')}></View>
{/* <View className={styles.order_address_text_no}>请选择收货地址及信息</View> */}
<View className={styles.order_address_text_con}>
<View className={styles.order_address_text_title}>**省**市**区**街道****仓库**省**市**区**街道****仓库</View>
<View className={styles.order_address_text_name}>
<Text>陈先生</Text>
<Text>1818877790</Text>
</View>
</View>
<View className={classnames(styles.order_address_more_icon, 'iconfont icon-jiantou')}></View>
</View>
<Popup show={showAddressList} showTitle={false} onClose={() => setShowAddressList(false)}>
<View className={styles.order_address_list}>
<View className={styles.order_address_title}>选择收货地址</View>
<AddressList onSelect={(item, index) => console.log(index, item)}/>
</View>
</Popup>
</View>
)
}

8
src/pages/order/components/estimatedAmount/index.tsx
View File

@ -1,5 +1,6 @@
import { Text, View } from "@tarojs/components"
import { useCallback, useEffect, useMemo } from "react"
import {formatKbPrice} from '@/common/common'
import styles from './index.module.scss'
type Param = {
style?: Object,
@ -8,16 +9,19 @@ type Param = {
export default ({style, number = 0}:Param) => {
const priceDom = useCallback(() => {
let res = number.toFixed(2).split('.')
let int_num = parseInt(res[0]).toLocaleString()
let int_num = parseInt(res[0]) + ''
let decimals_num = res[1]
return (
<>
<Text>¥</Text>
<Text>{int_num}</Text>
<Text>{formatPrice(int_num)}</Text>
<Text>.{decimals_num}</Text>
</>
)
}, [number])
const formatPrice = useCallback((number: string) => {
return formatKbPrice(number)
}, [])
return (
<View className={styles.order_price}>
<Text className={styles.order_price_text}>预估金额</Text>

18
src/pages/order/components/orderState/index.module.scss Normal file
View File

@ -0,0 +1,18 @@
.order_flow_state{
display: flex;
align-items: center;
padding: 0 30px;
height: 116px;
background-color: #fff;
border-radius: 20px;
.order_flow_state_text{
color: $color_main;
font-size:$font_size;
font-weight: 700;
}
.order_flow_state_desc{
color: $color_font_three;
font-size: $font_size_medium;
margin-left: 50px;
}
}

14
src/pages/order/components/orderState/index.tsx Normal file
View File

@ -0,0 +1,14 @@
import { View } from "@tarojs/components"
import styles from './index.module.scss'
export default ({
state = '',
desc = ''
}) => {
return (
<View className={styles.order_flow_state}>
<View className={styles.order_flow_state_text}>{state}</View>
<View className={styles.order_flow_state_desc}>{desc}</View>
</View>
)
}

47
src/pages/order/components/remark/index.module.scss Normal file
View File

@ -0,0 +1,47 @@
.order_popup{
display: flex;
flex-direction: column;
align-items: center;
padding: 20px 0;
.order_popup_title{
color: $font_size_big;
font-weight: 700;
color: #000000;
padding-bottom: 20px;
}
.order_popup_input{
width: 100%;
padding: 0 25px;
box-sizing: border-box;
margin-top: 43px;
position: relative;
.descDataNum{
position: absolute;
right: 40px;
bottom: 10px;
height: 39px;
font-size: $font_size_medium;
color: $color_font_two;
}
textarea{
background-color: $color_bg_one;
border-radius: 10px;
width: 100%;
height: 313px;
padding: 20px;
padding-bottom: 50px;
box-sizing: border-box;
font-size: $font_size;
}
}
.order_save_address{
height: 82px;
background: #007aff;
border-radius: 40px;
width: 668px;
text-align: center;
line-height: 82px;
color: #fff;
margin-top: 60px;
}
}

35
src/pages/order/components/remark/index.tsx Normal file
View File

@ -0,0 +1,35 @@
import Popup from "@/components/popup"
import { Textarea, View } from "@tarojs/components"
import { useCallback, useState } from "react"
import styles from './index.module.scss'
type Param = {
onBlur?: (val:any) => void
onSave?: (val: string) => void
}
export default ({onBlur, onSave}:Param) => {
const [descData, setDescData] = useState({
number: 0,
value: ''
})
const getDesc = useCallback((e) => {
let value = e.detail.value
setDescData({...descData, number:value.length, value})
},[])
const setSave = () => {
onSave?.(descData.value)
}
return (
<View className={styles.order_popup}>
<View className={styles.order_popup_title}>添加备注</View>
<View className={styles.order_popup_input}>
<Textarea placeholder="请添加备注" maxlength={200} cursorSpacing={100} onInput={(e) => getDesc(e)} onBlur={(e) => onBlur?.(e)}></Textarea>
<View className={styles.descDataNum}>{descData.number}/200</View>
</View>
<View className={styles.order_save_address} onClick={() => setSave()}>保存</View>
</View>
)
}

55
src/pages/order/index.module.scss
View File

@ -4,6 +4,7 @@
padding: 20px;
padding-bottom: 190px;
box-sizing: border-box;
.order_title{
display: flex;
align-items: center;
@ -12,6 +13,7 @@
background-color: #fff;
height: 116px;
border-radius: 20px;
margin-top: 20px;
text{
flex:1;
font-size: $font_size;
@ -31,35 +33,11 @@
}
}
}
.order_address{
height: 178px;
background: #ffffff;
border-radius: 20px;
display: flex;
align-items: center;
padding: 30px;
box-sizing: border-box;
margin-top: 20px;
.order_address_icon{
font-size: 60px;
}
.order_address_text{
flex: 1;
font-size: $font_size;
font-weight: 700;
margin-left: 30px;
}
.order_address_more_icon{
color: $color_font_three;
font-size: $font_size;
}
}
.order_desc{
display: flex;
align-items: center;
background-color: #fff;
padding: 0 30px;
padding: 0 20px;
height: 116px;
border-radius: 20px;
margin-top: 20px;
@ -109,5 +87,32 @@
color: $color_font_two;
}
}
.order_info{
background-color: #fff;
margin-top: 20px;
border-radius: 20px;
padding: 20px;
.order_info_title{
font-size: $font_size;
font-weight: 700;
margin-bottom: 20px;
}
.order_num{
display: flex;
justify-content: space-between;
align-items: center;
.order_num_btn{
font-size: $font_size_medium;
padding: 5px 10px;
border: 2px solid #007cf7;
border-radius: 10px;
color: $color_main;
}
}
text{
font-size: $font_size;
}
}
}

47
src/pages/order/index.tsx
View File

@ -1,31 +1,57 @@
import { Text, View } from "@tarojs/components"
import Popup from "@/components/popup";
import SearchInput from "@/components/searchInput";
import { Text, Textarea, View } from "@tarojs/components"
import Taro from "@tarojs/taro";
import classnames from "classnames";
import { useEffect, useState } from "react";
import { useCallback, useEffect, useState } from "react";
import AddressInfo from "./components/addressInfo";
import EstimatedAmount from "./components/estimatedAmount";
import KindList from "./components/kindList";
import OrderState from "./components/orderState";
import Remark from "./components/remark";
import styles from './index.module.scss'
export default () => {
const [price, setPrice] = useState(123000.33)
const [showDesc, setShowDesc] = useState(false)
const clipboardData = () => {
Taro.setClipboardData({
data: '123123121321',
success: function (res) {
Taro.showToast({
icon: 'none',
title: '复制成功'
})
}
})
}
return (
<View className={styles.order_main}>
<OrderState state="预约中" desc="客服已接单，等待仓库配布出单..."/>
<View className={styles.order_title}>
<Text>收货方式</Text>
<View className={styles.order_status}>物流</View>
<View className={styles.order_status}>上门自提</View>
</View>
<View className={styles.order_address}>
<View className={classnames(styles.order_address_icon, 'iconfont icon-shaixuan')}></View>
<View className={styles.order_address_text}>请选择收货地址及信息</View>
<View className={classnames(styles.order_address_more_icon, 'iconfont icon-jiantou')}></View>
</View>
<AddressInfo/>
<KindList/>
<View className={styles.order_desc}>
<View className={styles.order_desc} onClick={() => setShowDesc(true)}>
<View className={styles.order_desc_con}>订单备注</View>
<View className={styles.order_desc_text}>点击填写</View>
<View className={classnames(styles.miconfont, 'iconfont icon-jiantou')}></View>
</View>
<View className={styles.order_info} >
<View className={styles.order_info_title}>订单备注</View>
<SearchInput showBorder={false} title='单号'>
<View className={styles.order_num}>
<Text>13535359535</Text>
<View className={styles.order_num_btn} onClick={() => clipboardData()}>复制</View>
</View>
</SearchInput>
<SearchInput showBorder={false} title='下单时间'>
<Text>2022-4-5 10:11:55</Text>
</SearchInput>
</View>
<View className={styles.submit_order}>
<View className={styles.submit_order_number}>
<EstimatedAmount style={{color:'#007AFF'}} number={price}/>
@ -33,6 +59,9 @@ import styles from './index.module.scss'
</View>
<View className={styles.order_btn}>提交订单</View>
</View>
<Popup show={showDesc} showTitle={false} onClose={() => setShowDesc(false)} >
<Remark onSave={(e) => console.log(e)}/>
</Popup>
<View className="common_safe_area_y"></View>
</View>
)

4
src/pages/searchList/search.tsx
View File

@ -9,12 +9,12 @@ export default () => {
return (
<View className={styles.main}>
<View className={styles.search}>
<Search style={{width: '100%'}} placeholder="请输入面料关键词" placeIcon="out" showBtn={true} clickOnSearch={() => goLink('/pages/searchList/searchList')}/>
<Search style={{width: '100%'}} placeholder="请输入面料关键词" placeIcon="out" showBtn={true} clickOnSearch={() => {}}/>
</View>
<View className={styles.hot}>
<View className={styles.hot_header}>
<View className={styles.hot_header_title}>热门面料</View>
<View className={styles.hot_header_up}>高级搜索</View>
<View className={styles.hot_header_up} onClick={() => goLink('/pages/searchList/searchList')}>高级搜索</View>
</View>
<View className={styles.list}>
<View className={styles.item}>9265</View>

1
src/pages/searchList/searchList.tsx
View File

@ -5,7 +5,6 @@ import Filter from "@/components/filter";
import InfiniteScroll from '@/components/infiniteScroll'
import SortBtn from "@/components/sortBtn";
import SelectData from "./components/selectData";
import Tabs from "@/components/tabs";
import { goLink } from "@/common/common";
import styles from './searchList.module.scss'
import { useCallback, useState } from "react";