소스 검색

style:订单详情样式优化

qianxinyu 4 달 전
부모
커밋
618ec99f2d
6개의 변경된 파일59개의 추가작업 그리고 16개의 파일을 삭제
  1. 0 1
      pages/car/index.vue
  2. 1 1
      pages/car/order.vue
  3. 56 12
      pages/orders/detail.vue
  4. 1 1
      pages/orders/index.vue
  5. 1 1
      pages/orders/receipt.vue
  6. BIN
      static/icon/shop_fill.png

+ 0 - 1
pages/car/index.vue

@@ -4,7 +4,6 @@
       <view v-for="(pItem, pIndex) in cartListByGroup" :key="pIndex">
         <view class="business_name" v-if="pItem.products.length !== 0">
           <image @click="selectBussiness(pIndex)" class="checkbox" :src="pItem.checked ? '../../static/icon/checked.png' : '../../static/icon/checkbox.png'"></image>&nbsp;
-          <image src="../../static/icon/shop_fill.png" class="business_icon" />
           {{ pItem.business_name }}
         </view>
         <view class="product_group">

+ 1 - 1
pages/car/order.vue

@@ -18,7 +18,7 @@
     </view>
     <view class="car_list">
       <view v-for="(pItem, pIndex) in cartListByGroup" :key="pIndex">
-        <view class="business_name"><image src="../../static/icon/shop_fill.png" class="business_icon" />{{ pItem.business_name }}</view>
+        <view class="business_name">{{ pItem.business_name }}</view>
         <view class="car_item" v-for="(item, index) in pItem.products" :key="index">
           <view class="box_left">
             <image class="car_image" :src="item.thumb" mode=""></image>

+ 56 - 12
pages/orders/detail.vue

@@ -16,7 +16,7 @@
       >
     </view>
     <view class="car_list">
-      <view class="business_name"><image src="../../static/icon/shop_fill.png" class="business_icon" /> {{ order_datail?.business_name }}</view>
+      <view class="business_name"> {{ order_datail?.business_name }}</view>
 
       <view class="car_item" v-for="(item, index) in order_datail.order_items" :key="index" @click="_navToProduct(item.product_id)">
         <view class="box_left">
@@ -40,25 +40,29 @@
 
     <view class="price_content">
       <view class="price_content_item">
-        <view>订单总价</view>
-        <view class="price">¥{{ order_datail?.price_total }}</view>
+        <view>订单编号</view>
+        <view style="display: flex; align-items: center">
+          <view>{{ order_datail?.order_code }}</view
+          >&nbsp;
+          <view v-if="order_datail?.order_code" class="copy_btn" @click="_copyorderCode(order_datail?.order_code)">复制</view>
+        </view>
       </view>
       <view class="price_content_item">
-        <view>优惠价格</view>
-        <view class="price">¥-{{ order_datail?.coupon_total }}</view>
+        <view>下单时间</view>
+        <view>{{ order_datail?.insert_time }}</view>
       </view>
+      <view class="price_content_title"></view>
       <view class="price_content_item">
-        <view>订单金额</view>
-        <view class="price">¥{{ order_datail?.pay_total }}</view>
+        <view>订单总价</view>
+        <view>¥{{ order_datail?.price_total }}</view>
       </view>
-      <view class="price_content_title"></view>
       <view class="price_content_item">
-        <view>订单编号</view>
-        <view>{{ order_datail?.order_code }}</view>
+        <view>优惠价格</view>
+        <view>¥-{{ order_datail?.coupon_total }}</view>
       </view>
       <view class="price_content_item">
-        <view>下单时间</view>
-        <view>{{ order_datail?.insert_time }}</view>
+        <view>订单金额</view>
+        <view class="price">¥{{ order_datail?.pay_total }}</view>
       </view>
     </view>
   </view>
@@ -98,6 +102,36 @@ export default {
         });
       }
     },
+    _copyorderCode(info) {
+      // #ifndef H5
+      //uni.setClipboardData方法就是讲内容复制到粘贴板
+      uni.setClipboardData({
+        data: info, //要被复制的内容
+        success: () => {
+          //复制成功的回调函数
+          uni.showToast({
+            //提示
+            title: "复制成功",
+          });
+        },
+      });
+      // #endif
+
+      // #ifdef H5
+      let textarea = document.createElement("textarea");
+      textarea.value = info;
+      textarea.readOnly = "readOnly";
+      document.body.appendChild(textarea);
+      textarea.select(); // 选中文本内容
+      textarea.setSelectionRange(0, info.length);
+      uni.showToast({
+        //提示
+        title: "复制成功",
+      });
+      result = document.execCommand("copy");
+      textarea.remove();
+      // #endif
+    },
   },
 };
 </script>
@@ -268,5 +302,15 @@ export default {
       color: red;
     }
   }
+  .copy_btn {
+    border-radius: 20rpx;
+    background-color: #f3f3f3;
+    font-size: 24rpx;
+    width: 100rpx;
+    height: 45rpx;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+  }
 }
 </style>

+ 1 - 1
pages/orders/index.vue

@@ -10,7 +10,7 @@
       <view class="order_item" v-for="(item, index) in orderList" :key="index">
         <view @click.stop="goDetail(item.id)">
           <view class="order_title">
-            <view class="business_name"><image src="../../static/icon/shop_fill.png" class="business_icon" />{{ item.business_name }}</view>
+            <view class="business_name">{{ item.business_name }}</view>
             <view class="order_status">{{ item.state }}</view>
           </view>
           <view class="product_list" :class="item.contents_class ? 'active' : ''">

+ 1 - 1
pages/orders/receipt.vue

@@ -2,7 +2,7 @@
   <view>
     <view class="order_info">
       <view class="order_title">
-        <view class="business_name"><image src="../../static/icon/shop_fill.png" class="business_icon" />{{ orderInfo.business_name }}</view>
+        <view class="business_name">{{ orderInfo.business_name }}</view>
       </view>
       <view class="product_list">
         <view class="product_item" v-for="(product_info, k) in orderInfo.product_list" :key="k">

BIN
static/icon/shop_fill.png