瀏覽代碼

消息模块付款页面大体框架

宋飞扬 1 年之前
父節點
當前提交
1cf528ad51
共有 2 個文件被更改,包括 60 次插入4 次删除
  1. 1 1
      src/pages.json
  2. 59 3
      src/pages/message/payment/index.vue

+ 1 - 1
src/pages.json

@@ -179,7 +179,7 @@
         {
           "path": "payment/index",
           "style": {
-            "navigationBarTitleText": "付款通知"
+            "navigationBarTitleText": "付款"
           }
         },
         {

+ 59 - 3
src/pages/message/payment/index.vue

@@ -1,9 +1,65 @@
 <template>
-  <view>付款通知</view>
+  <view>
+    <view style="margin-top: 15px;">
+      <view style="display: flex;justify-content: center;">
+        <u-icon name="checkmark-circle-fill" color="#16a34a" size="60"></u-icon>
+      </view>
+      <view style="display: flex;justify-content: center;">
+        <h1>付款成功</h1>
+      </view>
+    </view>
+    <view style="margin: 15px 0px 0px 15px;">
+      <h3>订单号:{{ orderNum }}</h3>
+      <h3>付款方式:{{ payStyle }}</h3>
+      <h3>付款金额:{{ orderMon }}</h3>
+    </view>
+    <view style="margin: 15px 0px 0px 15px;">
+      <h2>商品名称:{{ productName }}</h2>
+      <h3>规格:个 x{{number}}</h3>
+      <h3>商家名称:{{ name }}</h3>
+    </view>
+    <view style="margin: 15px 0px 0px 15px;">
+      <h2>收件人:{{ productName }}</h2>
+      <h2>联系电话:{{ orderNum }}</h2>
+      <h3>收货地址:{{ name }}</h3>
+      <h3>订单备注:{{ name }}</h3>
+    </view>
+    <view style="margin: 15px 0px 0px 15px;">
+      <h2>物流状态:{{ tranStatu }}</h2>
+      <h3>物流公司:{{ tranName }}</h3>
+      <h3>物流单号:{{ tranNum }}</h3>
+    </view>
+    <view style="margin: 15px 0px 0px 15px;">
+      <view style="display: flex;justify-content: center;">
+        <h3>创建时间:{{ waittime }}</h3>
+      </view>
+      <view style="display: flex;justify-content: center;">
+        <h3>付款时间:{{ waittime }}</h3>
+      </view>
+    </view>
+    <view style="display: flex;justify-content: center;margin: 15px 0px 0px 15px;">
+      <h3>客服热线:400-8888-8888</h3>
+    </view>
+  </view>
 </template>
 
 <script>
-export default {};
+  export default {
+    data() {
+      return {
+        orderNum: 9999999999999,
+        tranNum: 9999999999999,
+        payStyle: '微信支付',
+        productName: '洗车',
+        name: '成都王牌汽车保养店',
+        tranStatu: '已发货',
+        tranName: '成都王牌汽车保养店',
+        number: 3,
+        orderMon: 99999,
+        waittime: "2022年01月01日 12:00:00",
+      };
+    },
+  };
 </script>
 
-<style lang="scss" scoped></style>
+<style lang="scss" scoped></style>