From 8ebca1e661944139be4fc1e5811bb6165767bf4f Mon Sep 17 00:00:00 2001
From: czm <2192718639@qq.com>
Date: Tue, 19 Apr 2022 18:43:24 +0800
Subject: [PATCH] =?UTF-8?q?=E7=A1=AE=E8=AE=A4=E8=AE=A2=E5=8D=95?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit
---
src/app.config.ts | 2 +-
.../estimatedAmount/index.module.scss | 23 ++
.../components/estimatedAmount/index.tsx | 17 ++
src/pages/order/index.config.ts | 3 +
src/pages/order/index.module.scss | 207 ++++++++++++++++++
src/pages/order/index.tsx | 107 +++++++++
6 files changed, 358 insertions(+), 1 deletion(-)
create mode 100644 src/pages/order/components/estimatedAmount/index.module.scss
create mode 100644 src/pages/order/components/estimatedAmount/index.tsx
create mode 100644 src/pages/order/index.config.ts
create mode 100644 src/pages/order/index.module.scss
create mode 100644 src/pages/order/index.tsx
diff --git a/src/app.config.ts b/src/app.config.ts
index 525469c..1f73284 100644
--- a/src/app.config.ts
+++ b/src/app.config.ts
@@ -87,7 +87,7 @@ export default {
]
},
{
- root: "pages/weightListAdd",
+ root: "pages/order",
pages: [
"index"
]
diff --git a/src/pages/order/components/estimatedAmount/index.module.scss b/src/pages/order/components/estimatedAmount/index.module.scss
new file mode 100644
index 0000000..f12d646
--- /dev/null
+++ b/src/pages/order/components/estimatedAmount/index.module.scss
@@ -0,0 +1,23 @@
+.order_price{
+ font-weight: 700;
+ display: flex;
+ align-items: center;
+ .order_price_text{
+ font-size: $font_size_medium;
+ margin-right: 10px;
+ }
+ .order_price_num{
+ text{
+ &:nth-child(1) {
+ font-size: $font_size_min;
+ }
+ &:nth-child(2) {
+ font-size: $font_size_big;
+ }
+ &:nth-child(3) {
+ font-size: $font_size_medium;
+ }
+ }
+ }
+
+}
\ No newline at end of file
diff --git a/src/pages/order/components/estimatedAmount/index.tsx b/src/pages/order/components/estimatedAmount/index.tsx
new file mode 100644
index 0000000..27d63f1
--- /dev/null
+++ b/src/pages/order/components/estimatedAmount/index.tsx
@@ -0,0 +1,17 @@
+import { Text, View } from "@tarojs/components"
+import styles from './index.module.scss'
+type Param = {
+ style?: Object
+}
+export default ({style}:Param) => {
+ return (
+
+ 预估金额
+
+ ¥
+ 6,001
+ .00
+
+
+ )
+}
\ No newline at end of file
diff --git a/src/pages/order/index.config.ts b/src/pages/order/index.config.ts
new file mode 100644
index 0000000..b0cb522
--- /dev/null
+++ b/src/pages/order/index.config.ts
@@ -0,0 +1,3 @@
+export default {
+ navigationBarTitleText: '确认订单'
+}
diff --git a/src/pages/order/index.module.scss b/src/pages/order/index.module.scss
new file mode 100644
index 0000000..84a37bd
--- /dev/null
+++ b/src/pages/order/index.module.scss
@@ -0,0 +1,207 @@
+.order_main{
+ min-height: 100%;
+ background-color:$color_bg_one;
+ padding: 20px;
+ padding-bottom: 190px;
+ box-sizing: border-box;
+ .order_title{
+ display: flex;
+ align-items: center;
+ padding: 20px 30px;
+ box-sizing: border-box;
+ background-color: #fff;
+ height: 116px;
+ border-radius: 20px;
+ text{
+ flex:1;
+ font-size: $font_size;
+ font-weight: 700;
+ }
+ .order_status{
+ background-color: #F0F0F0;
+ width: 148px;
+ height: 55px;
+ color: $color_font_three;
+ text-align: center;
+ line-height: 55px;
+ font-size: $font_size_medium;
+ border-radius: 30px;
+ &:nth-last-child(1) {
+ margin-left: 20px;
+ }
+ }
+ }
+ .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;
+ }
+ }
+ .orders_list_con{
+ margin-top: 20px;
+ background-color: #fff;
+ border-radius: 20px;
+ padding: 20px;
+ }
+ .order_list{
+ &:nth-child(n+2) {
+ margin-top: 30px;
+ }
+ .order_list_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;
+ }
+ .num{
+ color: $color_font_two;
+ font-size: $font_size_min;
+ }
+ }
+ }
+ .order_list_scroll{
+ margin-top: 30px;
+
+ .order_list_item {
+ display: flex;
+ &:nth-child(2) {
+ margin-top: 30px;
+ }
+ .order_list_item_img{
+ width: 126px;
+ height: 126px;
+ border-radius: 20px;
+ background-color: red;
+ }
+ .order_list_item_con{
+ display: flex;
+ width: 100%;
+ flex:1;
+ border-bottom: 1px solid #f0f0f0;
+ height: 150px;
+ padding-top: 20px;
+ box-sizing: border-box;
+ }
+ .order_list_item_des{
+ flex:1;
+ box-sizing: border-box;
+ padding-left: 30px;
+ .order_list_item_title{
+ font-weight: 700;
+ font-size: $font_size;
+ margin-bottom: 15px;
+ }
+ .order_list_item_price{
+ font-size: 26px;
+ color: $color_font_three;
+ }
+ }
+ .order_list_item_count{
+ .count_num{
+ color: $color_main;
+ font-size: $font_size;
+ margin-bottom: 15px;
+ font-weight: 400;
+ text{
+ font-size: $font_size_min;
+ }
+ }
+ .count_price {
+ font-size: $font_size;
+ font-weight: 700;
+ text{
+ font-size: $font_size_min;
+ }
+ }
+ }
+ }
+ }
+ .order_estimated_amount{
+ display: flex;
+ align-items: flex-end;
+ flex-direction: column;
+ padding: 30px 0;
+ .order_price_des{
+ font-size: $font_size_medium;
+ color: $color_font_two;
+ }
+ }
+ .order_desc{
+ display: flex;
+ align-items: center;
+ background-color: #fff;
+ padding: 0 30px;
+ height: 116px;
+ border-radius: 20px;
+ margin-top: 20px;
+ .order_desc_con{
+ flex:1;
+ font-size: $font_size;
+ font-weight: 700;
+ }
+ .order_desc_text{
+ font-size: $font_size_medium;
+ color: $color_font_two;
+ margin-right: 10px;
+ }
+ .miconfont{
+ font-size: 20px;
+ color: $color_font_two;
+ }
+ }
+ .submit_order{
+ display: flex;
+ position: fixed;
+ bottom: 0;
+ left: 0;
+ justify-content: space-between;
+ width: 100%;
+ height: 175px;
+ align-items: center;
+ background-color: #fff;
+ box-shadow: 6px 0px 12px 0px rgba(0,0,0,0.16);
+ padding: 20px 50px;
+ box-sizing: border-box;
+ padding-bottom: constant(safe-area-inset-bottom);
+ padding-bottom: env(safe-area-inset-bottom);
+ .order_btn {
+ width: 250px;
+ height: 90px;
+ opacity: 0.6;
+ background: linear-gradient(38deg,#007aff, #4fa6ff 100%, #68b4ff 100%);
+ border-radius: 46px;
+ display: flex;
+ justify-content: center;
+ align-items: center;
+ color: #fff;
+ }
+ }
+
+}
\ No newline at end of file
diff --git a/src/pages/order/index.tsx b/src/pages/order/index.tsx
new file mode 100644
index 0000000..7dc2644
--- /dev/null
+++ b/src/pages/order/index.tsx
@@ -0,0 +1,107 @@
+import { Text, View } from "@tarojs/components"
+import classnames from "classnames";
+import EstimatedAmount from "./components/estimatedAmount";
+import styles from './index.module.scss'
+
+ export default () => {
+ return (
+
+
+ 收货方式
+ 物流
+ 上门自提
+
+
+
+ 请选择收货地址及信息
+
+
+
+
+
+ 大货
+ 0770# 21S单面平纹(食毛)
+ 共3种
+
+
+
+
+
+
+ 1# 薄荷绿
+ ¥40/kg
+
+
+ ×1条
+ ¥1,000.5
+
+
+
+
+
+
+
+ 1# 薄荷绿
+ ¥40/kg
+
+
+ ×1条
+ ¥1,000.5
+
+
+
+
+
+
+
+ 大货
+ 0770# 21S单面平纹(食毛)
+ 共3种
+
+
+
+
+
+
+ 1# 薄荷绿
+ ¥40/kg
+
+
+ ×1条
+ ¥1,000.5
+
+
+
+
+
+
+
+ 1# 薄荷绿
+ ¥40/kg
+
+
+ ×1条
+ ¥1,000.5
+
+
+
+
+
+
+
+ (按照25kg/条, 预估金额)
+
+
+
+ 订单备注
+ 点击填写
+
+
+
+
+ 提交订单
+
+
+
+ )
+ }
\ No newline at end of file