feat: 提交订单页面搭建

src/components/Stepper/index.vue

@@ -1,8 +1,10 @@
 <template>
-  <view class="stepper-wrapper">
-    <uni-icons type="minus" size="24" color="#999" @click="decrease" />
-    <text class="stepper-text">{{ value }}</text>
-    <uni-icons type="plus" size="24" color="#999" @click="increase" />
+  <view class="stepper-wrapper border-box flex flex-items-center rounded-8">
+    <uni-icons type="minus" size="24" color="#D1D1D1" @click="decrease" />
+    <text class="stepper-text text-center font-size-14 font-500 color-000">
+      {{ value }} {{ unit }}
+    </text>
+    <uni-icons type="plus" size="24" color="#198CFF" @click="increase" />
   </view>
 </template>
 
@@ -23,6 +25,10 @@ const props = defineProps({
     type: Number,
     default: 100,
   },
+  unit: {
+    type: String,
+    default: "",
+  },
 });
 
 // Emit

src/components/Stepper/styles/index.scss

@@ -1,11 +1,8 @@
 .stepper-wrapper {
-  display: flex;
-  align-items: center;
+  background-color: #f3f9ff;
+  padding: 4px 7px;
 }
 
 .stepper-text {
-  width: 40px;
-  font-size: $uni-font-size-lg;
-  color: $uni-text-color;
-  text-align: center;
+  width: 30px;
 }