xuxy
2024-06-24 a3ad988e9f74049a6b17efd4f3db8389ae6fe7ed
pages/farmer/order-records/order-records.vue
@@ -1,6 +1,55 @@
<template>
   <view>
   <view class="order-records">
      <view class="tj-container-p">
         <view class="tj-container">
            <view class="tj-each">
               <view class="value">9</view>
               <view class="label">买家</view>
            </view>
            <view class="tj-each">
               <view class="value">9扎</view>
               <view class="label">交易</view>
            </view>
            <view class="tj-each">
               <view class="value">0.00</view>
               <view class="label">理赔</view>
            </view>
            <view class="tj-each">
               <view class="value">401.12</view>
               <view class="label">交易合计</view>
            </view>
         </view>
      </view>
      <view class="p15" style="min-height: calc(100vh - 160rpx);">
         <no-data v-if="!list||list.length==0" style="width: 100%;"></no-data>
         <view v-for="(item,index) in list" :key="index" class="order-records-list list-container">
            <view class="order-records-item list-item">
               <view class="title flex">
                  <view>{{item.title}}</view>
                  <view class="m-l-a m-r-0 topic-gray">测试人员</view>
               </view>
               <view class="line"></view>
               <view class="form">
                  <view class="form-item">
                     <view class="label">数量</view>
                     <view class="value">1</view>
                  </view>
                  <view class="form-item">
                     <view class="label">单价</view>
                     <view class="value">¥32.00</view>
                  </view>
                  <view class="form-item">
                     <view class="label">小计</view>
                     <view class="value red">¥32.00</view>
                  </view>
               </view>
            </view>
         </view>
      </view>
      <!-- 判断是否到底了,自动吧 -->
      <footer-msg :more="page.total>0&&page.total>page.current*page.size"></footer-msg>
   </view>
</template>
@@ -8,15 +57,101 @@
   export default {
      data() {
         return {
         }
      },
      methods: {
      }
   }
</script>
<style>
<style lang="scss" scoped>
   .order-records {
      .order-records-list {
         padding: 20rpx 30rpx;
</style>
         .order-records-item {
            padding: 24rpx 34rpx;
            margin-bottom: 20rpx;
            .title {
               font-weight: 600;
               font-size: 28rpx;
               color: #000000;
               line-height: 40rpx;
            }
            .line {
               height: 2rpx solid #EEEEEE;
               margin-top: 16rpx;
               margin-bottom: 16rpx;
            }
            .form {
               display: flex;
               .form-item {
                  flex: 1;
                  min-width: 40%;
                  max-width: 50%;
                  .label {
                     font-weight: 400;
                     font-size: 24rpx;
                     color: #666666;
                     line-height: 34rpx;
                  }
                  .label::after {
                     content: ":";
                     font-weight: 400;
                     font-size: 24rpx;
                     color: #666666;
                     line-height: 34rpx;
                  }
                  .value {
                     font-weight: 400;
                     font-size: 24rpx;
                     color: #000000;
                     line-height: 34rpx;
                  }
                  .value.red {
                     color: #CF0000;
                  }
               }
            }
         }
      }
      .tj-container-p {
         background: #E6F2EB;
         padding: 30rpx;
         .tj-container {
            height: 148rpx;
            background: #FFFFFF;
            border-radius: 8rpx;
            .tj-each {
               .label {
                  font-weight: 400;
                  font-size: 24rpx;
                  color: #000000;
                  line-height: 34rpx;
               }
               .value {
                  font-weight: 400;
                  font-size: 32rpx;
                  color: #CF0000;
                  line-height: 44rpx;
               }
            }
         }
      }
   }
</style>