uniapp：增加部分 confirm 下单确认页

YunaiV
1 parent 4aeaa218
Showing 4 changed files with 78 additions and 1 deletions
yudao-ui-app/App.vue
yudao-ui-app/pages.json
yudao-ui-app/pages/order/confirm.vue
yudao-ui-app/styles/base.scss
@@ -23,7 +23,10 @@ export default {
 </script>
  
 <style lang="scss">
-/* 引入uView基础样式 */
+/** 引入全局基本样式 */
+@import 'styles/base.scss';
+
+/* 引入 uView 基础样式 */
 @import '@/uni_modules/uview-ui/index.scss';
  
 /*每个页面公共scss */
@@ -87,6 +87,12 @@
       }
     },
     {
+      "path": "pages/order/confirm",
+      "style": {
+        "navigationBarTitleText": "确认订单"
+      }
+    },
+    {
       "path": "pages/address/list",
       "style": {
         "navigationBarTitleText": "收货地址"
+<template>
+  <view class="container">
+    <view class="confirm-con">
+      <!-- TODO 收货地址 -->
+      <navigator url="/pages/address/list?type=1">
+        <yd-address-select :address="address"></yd-address-select>
+      </navigator>
+
+      <!-- TODO 商品信息 -->
+      <view class="goods contain">
+        <yd-order-product :productList="productList"></yd-order-product>
+          <view class="item row-between">
+          <view>买家留言</view>
+          <u-input v-model="remark" :clearable="false"
+            placeholder="请添加备注（150 字以内）"></u-input>
+        </view>
+      </view>
+    </view>
+
+    <!-- TODO 优惠劵 -->
+
+    <!-- TODO 价格信息 -->
+
+    <!-- TODO 底部：提交订单 -->
+  </view>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      address: { // 选中的收货地址
+        name: 'test',
+        mobile: '15601691300',
+        area: '奥特曼奥特曼'
+      },
+      productList: [{ // 购买的商品列表
+        coverUrl: '',
+        productTitle: '奥特曼',
+        sellPrice: 1024,
+        productCount: 2048,
+        totalPrice: 1024
+      }],
+      remark: '', // 备注
+      x
+    }
+  }
+}
+</script>
+
+<style>
+  .confirm-con {
+    overflow: hidden;
+    padding-bottom: calc(120rpx + env(safe-area-inset-bottom));
+  }
+
+  .contain {
+    border-radius: 14rpx;
+    margin: 20rpx 20rpx 0;
+    background-color: #fff;
+    overflow: hidden;
+  }
+</style>
+.row-between {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+}
 \ No newline at end of file