确认订单-地址栏

src/pageSubs/orders/submit.vue

@@ -4,10 +4,31 @@
  * @Author: dream
  * @Date: 2021-03-26 13:59:15
  * @LastEditors: dream
- * @LastEditTime: 2021-03-26 14:26:29
+ * @LastEditTime: 2021-03-30 16:55:49
 -->
 <template>
-	<view>Submit Order</view>
+	<view class="submit-order-main">
+    <block v-if="isNoAddress">
+      <view class="order-no-address">
+        <view class="u-flex no-address iph-bg-fff">
+          <view class="local-icon iph-icon-localtion"></view>
+          <view class="u-m-l-16 u-flex-1 u-font-32 u-line-44 text-weight-500">添加收货地址</view>
+          <view class="enter-icon iph-icon-enter"></view>
+        </view>
+        <image class="no-address-line" src="~@/static/common/icon_tiao.png" mode="aspectFit" />
+      </view>
+    </block>
+    <block v-else>
+      <view class="order-address iph-bg-fff">
+        <view class="u-flex">
+          <view class="u-flex-1 u-font-28 i-line-40 text-weight-500">收货人：周科钧</view>
+          <view class="text-weight-500 u-m-r-24">137*****033</view>
+          <view class="enter-icon iph-icon-enter"></view>
+        </view>
+        <view class="detail-address">浙江省杭州市滨江区滨康路619号德邦电子3幢509慕玛披萨</view>
+      </view>
+    </block>
+  </view>
 </template>
 
 <script>
@@ -15,7 +36,7 @@ export default {
   name: 'orderSubmit',
   data () {
     return {
-
+      isNoAddress: false
     }
   },
   onLoad () {
@@ -28,5 +49,41 @@ export default {
 </script>
 
 <style lang="scss" scoped>
-
+.submit-order-main {
+  .order-no-address {
+    position: relative;
+    margin-bottom: 16px;
+    padding-bottom: 6px;
+    .no-address {
+      padding: 0 40px 0 26px;
+      height: 154px;
+      .local-icon {
+        width: 28px;
+        height: 36px;
+      }
+      .enter-icon {
+        width: 20px;
+        height: 20px;
+      }
+    }
+    .no-address-line {
+      position: absolute;
+      bottom: 6px;
+      width: 100%;
+      height: 6px;
+    }
+  }
+  .order-address {
+    padding: 32px 32px 16px 32px;
+    .enter-icon {
+      width: 20px;
+      height: 20px;
+    }
+    .detail-address {
+      margin-top: 16px;
+      margin-right: 44px;
+      color: $iph-empty-text;
+    }
+  }
+}
 </style>

src/uni.scss

@@ -23,6 +23,12 @@ $iph-btn-disabel-bg: #999999;
 .bold {
   font-weight: bold;
 }
+.text-weight-500 {
+  font-weight: 500;
+}
+.text-weight-600 {
+  font-weight: 600;
+}
 .text-through {
   text-decoration: line-through;
 }
@@ -75,3 +81,13 @@ $iph-btn-disabel-bg: #999999;
   background: url('~@/static/common/icon_dian.png') no-repeat center center;
   background-size: contain;
 }
+
+.iph-icon-localtion {
+  background: url('~@/static/common/icon_dingwei.png') no-repeat center center;
+  background-size: contain;
+}
+
+.iph-icon-enter {
+  background: url('~@/static/common/icon_enter.png') no-repeat center center;
+  background-size: contain;
+}