С³ÌÐòÖбí¸ñչʾÊý¾ÝµÄʵÏÖ

<van-cell-group title="µ±ÌìÊý¾ÝÁбí">
  <view class='history-table-wrap'>
    <view class="trHead">
     <view class="th th1">¶©µ¥</view>
     <view class="th th2">ÏßÌå</view>
     <view class="th th3">¹¤Ðò</view>
     <view class="th th4">¼þÊý</view>
     <view class="th th5">ʱ¼ä</view>
     <view class="th th6">״̬</view>
    </view>
    <view class="table">
   <block wx:for="{{dataArray}}" wx:key="key">
   <view class="tr_refuse" wx:if="{{item.status == '2'}}">
     <!-- <view class="td td1"style="width: 124rpx; height: 98rpx; display: block; box-sizing: border-box; left: NaNrpx; top: NaNrpx">{{item.ordername}}</view> -->
     <view class="td td1">{{item.ordername}}</view>
     <view class="td td2">{{item.linename}}</view>
     <view class="td td3">{{item.procedurename}}</view>
     <view class="td td4">{{item.number}}</view>
     <view class="td td5">{{item.time}}</view>
     <view class="td td6">{{item.status == '0'?'ÒÑÇ©ºË':(item.status == '1'?'´ýÇ©ºË':'ÒѾܾø')}}</view>
   </view>
   <view class="tr" wx:if="{{item.status != '2'}}">
     <view class="td td1">{{item.ordername}}</view>
     <view class="td td2">{{item.linename}}</view>
     <view class="td td3">{{item.procedurename}}</view>
     <view class="td td4">{{item.number}}</view>
     <view class="td td5">{{item.time}}</view>
     <view class="td td6">{{item.status == '0'?'ÒÑÇ©ºË':item.status == '1'?'´ýÇ©ºË':item.status == '3'?'×÷·ÏÈ·ÈÏ':'ÒÑ×÷·Ï'}}</view>
   </view>
   </block>
    </view>
  </view>
</van-cell-group>

 .select{
  box-sizing: border-box;
  width: 100%;
  height: 70rpx;
  border:1px solid #282828;
  border-radius: 8rpx;
  display: flex;
  align-items: center;
  padding: 0 20rpx;
 }
 .select_text{
  font-size: 30rpx;
  flex: 1;
 }
 .select_img{
  width: 40rpx;
  height: 40rpx;
  display: block;
  transition:transform 0.3s;
 }
 .select_img_rotate{
  transform:rotate(180deg); 
 }
 .option_box{
  position: absolute;
  top: 70rpx;
  width: 100%;
  border:1px solid #282828;
  box-sizing: border-box;
  height: 0;
  overflow-y: auto;
  border-top: 0;
  background: #282828;
  transition: height 0.3s;
 }
 .option{
  display: block;
  line-height: 40rpx;
  font-size: 30rpx;
  border-bottom: 1px solid #282828;
  padding: 10rpx;
 }
 .picker{
  background-color: #282828;
}
.stepper{
  margin-top: -70rpx;
  margin-left: 220rpx;
}
.t{
  line-height: 44px;
  font-size: 26rpx;
  color:#767778;
  margin-left: 30rpx;
  text-align: center;
  margin-top: 40rpx;
}
.unit{
  background-color: #FFFFFF;
  height: 80rpx;
}
.history-table-wrap{
  position: absolute;
  width: 100%;
  height: calc(100vh - 800rpx); 
  left: 50%;
  margin-left: -400rpx;
  top: 7rpx;
  overflow-y: scroll;
  overflow-x: hidden;
 }
 /* ±í¸ñ´úÂë  */
 .table{
 margin-top: 70rpx;
 border:1px solid #080808;
 border-right:0;
 border-bottom: 0;
 width: 100%;
 margin-left: 3%;
 }
 .trHead{
  width:100%;
  display: flex;
  justify-content: space-between;
  position:fixed; 
  left: 1rpx;
 }
 .tr{
  margin-left: 3rpx;
  width:100%;
  display: flex;
  justify-content: space-between;
 }
 .th{
  padding: 10px;
  border-bottom: 1px solid #dadada;
  border-right: 1px solid #dadada;
  text-align: center;
  width: 100%;
  font-weight: 800;
  background-color: #00B26B;
  font-size: 28rpx;
  color: #fff;
 }
 .td{
  word-break:break-all;
  padding: 5px;
  border-bottom: 1px solid #dadada;
  border-right: 1px solid #dadada;
  text-align: center;
  width: 100%;
  font-size: 20rpx;
  color: #fff;
 }
 .tr_refuse{
  margin-left: 3rpx;
  width:100%;
  display: flex;
  justify-content: space-between;
  background-color: rgb(248, 0, 0);
 }
 .value-class {
  flex: none !important;
}
.title{
  color: #585858;
  font-size: 16px;
}