。

src/components/ShopUnused/index.jsx

@@ -1,7 +1,6 @@
 import Taro from '@tarojs/taro'
-import { useState, useEffect } from 'react'
 import { compressImage } from '@/utils'
-
+import { View, Text,Image } from '@tarojs/components'
 import formatTimes from '@/utils/formatTime'
 
 
@@ -11,28 +10,32 @@ import './style.less'
 export default (props) => {
   const { item } = props
 
-
-
-  useEffect(() => {
-
-  }, [])
-
   return (
-    <view className='orderCard'>
-      <view style={{ overflow: 'hidden' }}>
-        <view className='orderId'>订单编号：{item.orderId}</view>
-        <view className='orderTime'>下单日期：{formatTimes(item.orderDate, 'yyyy-MM-dd hh:mm')}</view>
-      </view>
-      <view className='order'>
-        <image className='orderImg' src={compressImage(item.poster)} mode='aspectFit' />
-        <view className='orderRight'>
-          <view className='foodName'>{item.description}</view>
-          <view className='price'>合计金额：￥<text style={{ fontSize: '24rpx' }}>{((item.actualPrice / 100) - (item.cashback / 100) - (item.commissionCharge / 100)).toFixed(2)}</text>元 <text className='pnum'>数量：<text>1</text>张</text> </view>
-          <view>已下单：等待客户上门就餐</view>
-        </view>
-        <view className='line' />
-        <view className='phone'>客户手机：<text>{item.phone.replace(/^(\d{3})\d{4}(\d+)/, "$1****$2") || ''}</text></view>
-      </view>
-    </view>
+    <View className='orderCard2'>
+      <View className='hardtop'>
+        <View className='orderId'>订单编号：{item.orderId}</View>
+        <View className='orderTime'>下单日期：{formatTimes(item.orderDate, 'yyyy-MM-dd hh:mm')}</View>
+      </View>
+      <View className='order'>
+        <View className='orderTop'>
+          <Image className='orderImg' src={compressImage(item.poster)} mode='aspectFit' />
+          <View className='orderRight'>
+            <View className='foodName'>{item.description}</View>
+            <View className='price'>
+              <Text className='priceleft'>
+                合计金额：￥
+                <Text style={{ fontSize: '24rpx' }}>
+                  {((item.actualPrice / 100) - (item.cashback / 100) - (item.commissionCharge / 100)).toFixed(2)}
+                </Text>元
+              </Text>
+              <Text className='pnum'>数量：1张</Text>
+            </View>
+            <View className='tips'>已下单：等待客户上门就餐</View>
+          </View>
+        </View>
+        <View className='line' />
+        <View className='phone'>客户手机：{item.phone.replace(/^(\d{3})\d{4}(\d+)/, "$1****$2") || ''}</View>
+      </View>
+    </View>
   )
 }

src/components/ShopUnused/style.less

@@ -1,89 +1,76 @@
-.orderCard {
-  margin-bottom: 20px;
-  .orderId {
-    font-size: 20px;
+.orderCard2{
+  .hardtop{
     color: #666666;
-    line-height: 44px;
-    float: left;
-    margin: 60px 0 0 0;
-  }
-  .orderTime {
+    line-height: 44px;    
     font-size: 20px;
-    color: #666666;
-    line-height: 44px;
-    float: right;
-    margin: 60px 0 0 0;
+    position: relative;
+    margin: 20px 0;
+    .orderId{
+      display: inline-block;
+    }
+    .orderTime{
+      position: absolute;
+      right: 30px;
+      display: inline-block;
+      justify-self: right;
+    }
   }
-  .order {
-    background: #ffffff;
+  .order{
     box-shadow: 0px 8px 32px 0px rgba(0, 0, 0, 0.08);
     border-radius: 12px;
     padding: 20px;
-    .orderImg {
-      width: 194px;
-      height: 194px;
-      border-radius: 22px;
-      float: left;
-      margin: 0 26px 0 0;
-    }
-    .orderRight {
-      .foodName {
-        font-size: 24px;
-        color: #333333;
-        margin-top: 40px;
+    margin: 0 5px;
+    .orderTop{
+      display: flex;
+      .orderImg{
+        flex: none;
+        width: 194px;
+        height: 194px;
+        margin-right: 25px;
+        margin-bottom: 30px;
       }
-      .price {
-        font-size: 20px;
-        font-weight: bold;
-        color: #202020;
-        margin: 0 0 10px 0;
-        .pnum {
+      .orderRight{
+        flex: auto;
+        .foodName{
+          font-size: 24px;
           color: #333333;
-          font-weight: 400;
-          margin-left: 47px;
+          line-height: 40px;
+          margin-top: 30px;
+        }
+        .price{
+          font-size: 20px;
+          font-weight: bold;
+          color: #202020;
+          line-height: 44px;
+          display: flex;
+          .priceleft{
+            flex: 1;
+          }
+          .pnum {
+            color: #333333;
+            flex: 1;
+            font-weight: 400;
+          }
+        }
+        .tips{
+          font-size: 20px;
+          font-weight: bold;
+          color: #FF3434;
+          line-height: 44px;
         }
-      }
-      .price + view {
-        font-size: 20px;
-        font-weight: bold;
-        color: #ff3434;
-        line-height: 44px;
-        margin-bottom: 35px;
-        height: 19px;
       }
     }
-    .line {
-      margin-top: 30px;
-
+    .line{
       width: 100%;
       height: 2px;
       background: #000;
       opacity: 0.1;
+      margin-bottom: 30px;
     }
-    .phone {
-      font-size: 24px;
-      color: #666666;
-      line-height: 44px;
-      height: 23px;
-      margin: 37px 0;
-    }
-    .button-OK {
-      width: 160px;
-      height: 40px;
-      background: #1a3b83;
-      line-height: 40px;
-      border-radius: 12px;
-      font-size: 23px;
-      color: #ffffff;
-      position: relative;
-      right: -8em;
-      top: -2em;
-    }
-    .tripTime {
+    .phone{
       font-size: 24px;
       color: #666666;
       line-height: 44px;
-      margin-bottom: 30px;
     }
   }
-}
+}

src/components/ShopUsed/index.jsx

@@ -1,6 +1,6 @@
 import Taro from '@tarojs/taro'
 import { setGetVerifiedOrder } from '@/services/shopBoss'
-import { View, Text, Image } from '@tarojs/components'
+import { View, Text, Image,Button } from '@tarojs/components'
 import { compressImage } from '@/utils'
 import { useState } from 'react'
 import formatTimes from '@/utils/formatTime'
@@ -31,26 +31,59 @@ export default (props) => {
 
 
   return (
-    <View className='orderCard'>
-      <View style={{ overflow: 'hidden' }}>
+    // <View className='orderCard'>
+    //   <View style={{ overflow: 'hidden' }}>
+    //     <View className='orderId'>订单编号：{item.orderId}</View>
+    //     <View className='orderTime'>下单日期：{formatTimes(item.orderDate, 'yyyy-MM-dd hh:mm') || ''}</View>
+    //   </View>
+    //   <View className='order'>
+    //     <Image className='orderImg' src={compressImage(item.poster)} mode='aspectFit' />
+    //     <View className='orderRight'>
+    //       <View className='foodName'>{item.description}</View>
+    //       <View className='price'>合计金额：￥<Text style={{ fontSize: '24rpx' }}>{((item.actualPrice / 100) - (item.cashback / 100) - (item.commissionCharge / 100)).toFixed(2)}</Text>元 <Text className='pnum'>数量：<Text>1</Text>张</Text> </View>
+    //     </View>
+    //     <View className='veri_Date' > 核销时间：{formatTimes(item.verifiedDate, 'yyyy-MM-dd hh:mm')}</View>
+    //     <View className='line' />
+    //     <View className='phone'>客户手机：<Text>{item.phone.replace(/^(\d{3})\d{4}(\d+)/, "$1****$2") || ''}</Text>
+    //       {
+    //         !item.isConfirmVerified && <button className='Button-OK' onClick={confirmOrder} style={{ display: buttonStyle }}  >确认核销</button>
+    //       }
+    //     </View>
+    //   </View>
+    // </View>
+
+    <View className='orderCard3'>
+      <View className='hardtop'>
         <View className='orderId'>订单编号：{item.orderId}</View>
-        <View className='orderTime'>下单日期：{formatTimes(item.orderDate, 'yyyy-MM-dd hh:mm') || ''}</View>
+        <View className='orderTime'>下单日期：{formatTimes(item.orderDate, 'yyyy-MM-dd hh:mm')}</View>
       </View>
       <View className='order'>
-        <Image className='orderImg' src={compressImage(item.poster)} mode='aspectFit' />
-        <View className='orderRight'>
-          <View className='foodName'>{item.description}</View>
-          <View className='price'>合计金额：￥<Text style={{ fontSize: '24rpx' }}>{((item.actualPrice / 100) - (item.cashback / 100) - (item.commissionCharge / 100)).toFixed(2)}</Text>元 <Text className='pnum'>数量：<Text>1</Text>张</Text> </View>
+        <View className='orderTop'>
+          <Image className='orderImg' src={compressImage(item.poster)} mode='aspectFit' />
+          <View className='orderRight'>
+            <View className='foodName'>{item.description}</View>
+            <View className='price'>
+              <Text className='priceleft'>
+                合计金额：￥
+                <Text style={{ fontSize: '24rpx' }}>
+                  {((item.actualPrice / 100) - (item.cashback / 100) - (item.commissionCharge / 100)).toFixed(2)}
+                </Text>元
+              </Text>
+              <Text className='pnum'>数量：1张</Text>
+            </View>
+            <View className='veri_Date' > 核销时间：{formatTimes(item.verifiedDate, 'yyyy-MM-dd hh:mm')}</View>
+          </View>
         </View>
-        <View className='veri_Date' > 核销时间：{formatTimes(item.verifiedDate, 'yyyy-MM-dd hh:mm')}</View>
         <View className='line' />
-        <View className='phone'>客户手机：<Text>{item.phone.replace(/^(\d{3})\d{4}(\d+)/, "$1****$2") || ''}</Text>
+        <View className='phone'>
+          客户手机：{item.phone.replace(/^(\d{3})\d{4}(\d+)/, "$1****$2") || ''}
           {
-            !item.isConfirmVerified && <button className='Button-OK' onClick={confirmOrder} style={{ display: buttonStyle }}  >确认核销</button>
+            !item.isConfirmVerified && <Button className='Button-OK' onClick={confirmOrder} style={{ display: buttonStyle }}  >确认核销</Button>
           }
         </View>
       </View>
     </View>
+
   )
 }
 

src/components/ShopUsed/style.less

@@ -1,104 +1,193 @@
-.orderCard {
-  margin-bottom: 20px;
-  .orderId {
-    font-size: 20px;
+// .orderCard {
+//   margin-bottom: 20px;
+//   .orderId {
+//     font-size: 20px;
+//     color: #666666;
+//     line-height: 44px;
+//     float: left;
+//     margin: 60px 0 32px 0;
+//   }
+//   .orderTime {
+//     font-size: 20px;
+//     color: #666666;
+//     line-height: 44px;
+//     float: right;
+//     margin: 60px 0 32px 0;
+//   }
+//   .order {
+//     background: #ffffff;
+//     box-shadow: 0px 8px 32px 0px rgba(0, 0, 0, 0.08);
+//     border-radius: 12px;
+//     padding: 20px;
+//     .orderImg {
+//       width: 194px;
+//       height: 194px;
+//       border-radius: 22px;
+//       float: left;
+//       margin: 0 26px 30px 0;
+//     }
+//     .orderRight {
+//       .foodName {
+//         font-size: 24px;
+//         color: #333333;
+//       }
+//       .price {
+//         font-size: 20px;
+//         font-weight: bold;
+//         color: #202020;
+//         line-height: 44px;
+//         height: 19px;
+//         .pnum {
+//           color: #333333;
+//           font-weight: 400;
+//           margin-left: 47px;
+//         }
+//       }
+//       .price + view {
+//         font-size: 20px;
+//         font-weight: bold;
+//         color: #ff3434;
+//         line-height: 44px;
+//         margin-bottom: 35px;
+//         height: 19px;
+//       }
+//     }
+//     .veri_Date {
+//       color: red;
+//       letter-spacing: 1px;
+//       font-size: 30px;
+//       padding-top: 20px;
+//     }
+//     .line {
+//       margin-top: 30px;
+
+//       width: 100%;
+//       height: 2px;
+//       background: #000;
+//       opacity: 0.1;
+//       margin-top: 30px;
+//     }
+//     .phone {
+//       font-size: 24px;
+//       color: #666666;
+//       line-height: 44px;
+//       height: 23px;
+//       margin: 37px 0;
+//       // .Button-OK{
+//       //   font-size: 28px;
+//       //   color: #C0C8D3;
+//       //   line-height: 34px;
+//       //   text-align: center;
+//       //   padding:40px 0 100px 0;
+//       // }
+//     }
+
+//     .tripTime {
+//       font-size: 24px;
+//       color: #666666;
+//       line-height: 44px;
+//       margin-bottom: 30px;
+//     }
+//   }
+// }
+// button {
+//   width: 160px;
+//   height: 40px;
+//   background: #1a3b83;
+//   line-height: 40px;
+//   border-radius: 12px;
+//   font-size: 23px;
+//   color: #ffffff;
+//   position: relative;
+//   right: -8em;
+//   top: -2em;
+// }
+
+.orderCard3{
+  .hardtop{
     color: #666666;
-    line-height: 44px;
-    float: left;
-    margin: 60px 0 32px 0;
-  }
-  .orderTime {
+    line-height: 44px;    
     font-size: 20px;
-    color: #666666;
-    line-height: 44px;
-    float: right;
-    margin: 60px 0 32px 0;
+    position: relative;
+    margin: 20px 0;
+    .orderId{
+      display: inline-block;
+    }
+    .orderTime{
+      position: absolute;
+      right: 30px;
+      display: inline-block;
+      justify-self: right;
+    }
   }
-  .order {
-    background: #ffffff;
+  .order{
     box-shadow: 0px 8px 32px 0px rgba(0, 0, 0, 0.08);
     border-radius: 12px;
     padding: 20px;
-    .orderImg {
-      width: 194px;
-      height: 194px;
-      border-radius: 22px;
-      float: left;
-      margin: 0 26px 30px 0;
-    }
-    .orderRight {
-      .foodName {
-        font-size: 24px;
-        color: #333333;
+    margin: 0 5px;
+    .orderTop{
+      display: flex;
+      .orderImg{
+        flex: none;
+        width: 194px;
+        height: 194px;
+        margin-right: 25px;
+        margin-bottom: 30px;
       }
-      .price {
-        font-size: 20px;
-        font-weight: bold;
-        color: #202020;
-        line-height: 44px;
-        height: 19px;
-        .pnum {
+      .orderRight{
+        flex: auto;
+        .foodName{
+          font-size: 24px;
           color: #333333;
-          font-weight: 400;
-          margin-left: 47px;
+          line-height: 40px;
+          margin-top: 30px;
+        }
+        .price{
+          font-size: 20px;
+          font-weight: bold;
+          color: #202020;
+          line-height: 44px;
+          display: flex;
+          .priceleft{
+            flex: 1;
+          }
+          .pnum {
+            color: #333333;
+            flex: 1;
+            font-weight: 400;
+          }
+        }        
+        .veri_Date {
+          color: red;
+          letter-spacing: 1px;
+          font-size: 30px;
         }
       }
-      .price + view {
-        font-size: 20px;
-        font-weight: bold;
-        color: #ff3434;
-        line-height: 44px;
-        margin-bottom: 35px;
-        height: 19px;
-      }
-    }
-    .veri_Date {
-      color: red;
-      letter-spacing: 1px;
-      font-size: 30px;
-      padding-top: 20px;
     }
-    .line {
-      margin-top: 30px;
-
+    .line{
       width: 100%;
       height: 2px;
       background: #000;
       opacity: 0.1;
-      margin-top: 30px;
-    }
-    .phone {
-      font-size: 24px;
-      color: #666666;
-      line-height: 44px;
-      height: 23px;
-      margin: 37px 0;
-      // .Button-OK{
-      //   font-size: 28px;
-      //   color: #C0C8D3;
-      //   line-height: 34px;
-      //   text-align: center;
-      //   padding:40px 0 100px 0;
-      // }
+      margin-bottom: 30px;
     }
-
-    .tripTime {
+    .phone{
       font-size: 24px;
       color: #666666;
-      line-height: 44px;
-      margin-bottom: 30px;
+      line-height: 44px;  
+      position: relative;  
+      button {
+        width: 160px;
+        position: absolute;
+        right: 60px;
+        top: 0;
+        height: 40px;
+        background: #1a3b83;
+        line-height: 40px;
+        border-radius: 12px;
+        font-size: 23px;
+        color: #ffffff;
+      }
     }
   }
-}
-button {
-  width: 160px;
-  height: 40px;
-  background: #1a3b83;
-  line-height: 40px;
-  border-radius: 12px;
-  font-size: 23px;
-  color: #ffffff;
-  position: relative;
-  right: -8em;
-  top: -2em;
-}
+}

src/shop/components/ShopKeeper/shopKeeper.jsx

@@ -154,7 +154,6 @@ export default (props) => {
           {/* 已核销 */}
           {activeTab === 1 &&
             <view style={{ height: '45vh' }}>
-
               <List
                 style={{ height: '100%' }}
                 noData={<NoData />}