118 lines
5.4 KiB
TypeScript
118 lines
5.4 KiB
TypeScript
import { SaleOrderPreViewApi } from "@/api/order";
|
||
import Popup from "@/components/popup";
|
||
import SearchInput from "@/components/searchInput";
|
||
import { Text, Textarea, View } from "@tarojs/components"
|
||
import Taro, { useRouter } from "@tarojs/taro";
|
||
import classnames from "classnames";
|
||
import { useCallback, useEffect, useRef, 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: '复制成功'
|
||
})
|
||
}
|
||
})
|
||
}
|
||
//获取购物车传过来的id
|
||
type orderPreParam = {shopping_cart_product_color_list:{shopping_cart_product_color_id:number}[], sale_mode:number}
|
||
const router = useRouter()
|
||
const idsAndSaleModel = useRef<orderPreParam>({shopping_cart_product_color_list:[], sale_mode:0})
|
||
useEffect(() => {
|
||
idsAndSaleModel.current.sale_mode = Number(router.params.sale_mode)
|
||
router.params.ids?.split('-')?.map(item => {
|
||
return idsAndSaleModel.current.shopping_cart_product_color_list?.push({
|
||
shopping_cart_product_color_id: Number(item)
|
||
})
|
||
})
|
||
getSaleOrderPreView()
|
||
}, [])
|
||
|
||
//获取销售预览订单
|
||
type preViewOrderParam = {estimate_amount:number, estimate_weight:number, product_color_list:any[], sale_mode:number, sale_mode_name:string}
|
||
const [preViewOrder, setPreViewOrder] = useState<preViewOrderParam>()
|
||
const {fetchData} = SaleOrderPreViewApi()
|
||
const getSaleOrderPreView = async () => {
|
||
if(idsAndSaleModel.current.shopping_cart_product_color_list?.length > 0) {
|
||
let res = await fetchData(idsAndSaleModel.current)
|
||
setPreViewOrder(res.data)
|
||
}
|
||
}
|
||
|
||
useEffect(() => {
|
||
formatData()
|
||
}, [preViewOrder])
|
||
|
||
//格式化数据格式
|
||
const formatData = () => {
|
||
if(preViewOrder?.product_color_list&&preViewOrder?.product_color_list.length > 0) {
|
||
let dataList = {}
|
||
preViewOrder?.product_color_list.map(item => {
|
||
dataList[item.product_code] = dataList[item.product_code]||{}
|
||
dataList[item.product_code].product_code = item.product_code
|
||
dataList[item.product_code].product_name = item.product_name
|
||
dataList[item.product_code].sale_mode_name = item.sale_mode_name
|
||
dataList[item.product_code].color_list = dataList[item.product_code]?.color_list||[]
|
||
dataList[item.product_code].color_list.push(item)
|
||
})
|
||
console.log('dataList::',Object.values(dataList))
|
||
return Object.values(dataList)
|
||
}
|
||
}
|
||
|
||
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>
|
||
<AddressInfo/>
|
||
<KindList/>
|
||
<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}/>
|
||
<View className={styles.order_number_desc}>2种面料，6种颜色，共6条</View>
|
||
</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>
|
||
)
|
||
}
|