e-equipment.vue 994 B

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960
  1. <template>
  2. <view>
  3. <view class="equipmentList">
  4. <view class="title" v-if="equipmentList">{{equipmentList[0].title}}</view>
  5. <view class="list">
  6. <view class="item" v-for="item in equipmentList" :key="item.id">
  7. <view class="name">{{item.paramName}}</view>
  8. <view class="inner">{{item.paramContent}}</view>
  9. </view>
  10. </view>
  11. </view>
  12. </view>
  13. </template>
  14. <script>
  15. export default {
  16. props:[
  17. "equipmentList"
  18. ],
  19. data() {
  20. return {
  21. };
  22. },
  23. methods:{
  24. }
  25. }
  26. </script>
  27. <style lang="scss">
  28. .equipmentList{
  29. .title{
  30. line-height: 30px;
  31. border-left: 4px solid #009FE8;
  32. border-radius: 4px;
  33. padding-left: 10px;
  34. margin-bottom: 10px;
  35. }
  36. .list{
  37. .item{
  38. padding: 20rpx 25rpx;
  39. border-bottom: 1rpx solid #f4f4f4;
  40. display: flex;
  41. justify-content: space-between;
  42. .name{
  43. white-space: nowrap;
  44. overflow: hidden;
  45. text-overflow:ellipsis;
  46. }
  47. .inner{
  48. color: #999;
  49. }
  50. }
  51. }
  52. }
  53. </style>