myorderItem.vue 2.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081
  1. <template>
  2. <view >
  3. <view class="itemContent" v-for="(item,index) in orderObj">
  4. <view style="width: 100%;height: 4rpx;background-color:lightgray;"></view>
  5. <view class="contentInRowL" style="padding-top: 30rpx;align-items: center;">
  6. <text class="dateText">{{item.date}}</text>
  7. <text class="datedsText">{{item.dateds}}</text>
  8. </view>
  9. <view class="contentInRowS">
  10. <view class="contentColumn" style="justify-content: center;padding-top: 10rpx;align-items: center;">
  11. <text class="stateText">{{$t('order.wanchengdingd')}}</text>
  12. <view class="contentInRowL" style="align-items: baseline;">
  13. <text class="shuliangText">25</text>
  14. <text class="danweiText">{{$t('order.danweidan')}}</text>
  15. </view>
  16. </view>
  17. <view class="contentColumn" style="justify-content: center;padding-top: 10rpx;align-items: center;">
  18. <text class="stateText">{{$t('order.quxiaodingdan')}}</text>
  19. <view class="contentInRowL" style="align-items: baseline;">
  20. <text class="shuliangText">1</text>
  21. <text class="danweiText">{{$t('order.danweidan')}}</text>
  22. </view>
  23. </view>
  24. <view class="contentColumn" style="justify-content: center;padding-top: 10rpx;align-items: center;">
  25. <text class="stateText">{{$t('order.peisonglc')}}</text>
  26. <view class="contentInRowL" style="align-items: baseline;">
  27. <text class="shuliangText">304.5</text>
  28. <text class="danweiText">Km</text>
  29. </view>
  30. </view>
  31. </view>
  32. </view>
  33. </view>
  34. </template>
  35. <script>
  36. export default {
  37. name:"myorderItem",
  38. props:{
  39. orderObj:''
  40. },
  41. data() {
  42. return {
  43. };
  44. }
  45. }
  46. </script>
  47. <style lang="scss">
  48. @import '@/common/common.scss';
  49. .itemContent{
  50. width: 94%;
  51. margin-left: 3%;
  52. padding-bottom: 30rpx;
  53. }
  54. .dateText{
  55. font-size: 28rpx;
  56. font-weight: bold;
  57. }
  58. .datedsText{
  59. font-size: 24rpx;
  60. color: darkgray;
  61. padding-left: 30rpx;
  62. }
  63. .stateText{
  64. font-size: 26rpx;
  65. color: darkgray;
  66. }
  67. .shuliangText{
  68. font-size: 40rpx;
  69. font-weight: bold;
  70. }
  71. .danweiText{
  72. font-size: 24rpx;
  73. }
  74. </style>