<template>
  <view class="order_items">
    <view class="header_no">no.312312312321321</view>
    <view class="user_info">
      <view class="user_name"> 黄先生 <text>一人会有限公司</text> </view>
      <view class="prices"> ¥122.32 </view>
    </view>
    <view class="parameters_body">
      <view class="items"> 塑料类-<text>饮料瓶</text> </view>
      <view class="items"> 计件：<text>32件</text> </view>
    </view>
    <view class="item_footer">
      <view class="phone_btn">
        <uni-icons type="phone" size="13" color="#3da605"></uni-icons>
        打电话
      </view>
      <view class="group_btn">
        <hs-button label="删除" type="delete" />
        <hs-button label="编辑" />
      </view>
    </view>
  </view>
</template>
<style lang="scss" scoped>
.order_items {
  background-color: #fff;
  padding: 30rpx;
  border-radius: 10rpx;
  margin: 30rpx;
  position: relative;
  box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.15);
  .header_no {
    color: #666;
    font-size: 27rpx;
  }
  .user_info {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 15rpx 0;
    .user_name {
      font-size: 27rpx;
      font-weight: 600;
      text {
        padding-left: 30rpx;
        color: #999;
        font-weight: 400;
      }
    }
    .prices {
      font-size: 26rpx;
    }
  }
  .parameters_body {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    font-size: 27rpx;
    color: #333;
    .items {
      width: 50%;
    }
  }
  .item_footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding-top: 25rpx;
    border-top: 1rpx solid #f8f8f8;
    margin-top: 25rpx;
    .phone_btn {
      display: flex;
      align-items: center;
      color: #3da605;
      font-size: 27rpx;
    }
    .group_btn {
      display: flex;
      align-items: center;
      hs-button {
        &:last-child {
          margin-left: 30rpx;
        }
      }
    }
  }
}
</style>
