choose-business.vue 1.4 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586
  1. <template>
  2. <view>
  3. <view class="box">
  4. <view class="top">
  5. <text class="title">选择业务</text>
  6. </view>
  7. <view v-for="(yewuItem,index) in yewuItemList" :key="index">
  8. <label class="c-item">
  9. <view class="l">
  10. <checkbox class="cb" color="#0080ff" />
  11. </view>
  12. <view class="c">{{yewuItem.text1}}</view>
  13. <view class="r">{{yewuItem.text2}}</view>
  14. </label>
  15. </view>
  16. </view>
  17. <view class="common-btn">录入确认</view>
  18. </view>
  19. </template>
  20. <script>
  21. export default {
  22. data() {
  23. return {
  24. yewuItemList: [{
  25. text1: '入场管理费用',
  26. text2: '34元'
  27. },
  28. {
  29. text1: '定车费用',
  30. text2: '10元'
  31. },
  32. {
  33. text1: '装卸费用',
  34. text2: '52元'
  35. },
  36. {
  37. text1: '核算费用',
  38. text2: '42元'
  39. },
  40. {
  41. text1: '吊装费用',
  42. text2: '124元'
  43. },
  44. ]
  45. }
  46. },
  47. methods: {
  48. }
  49. }
  50. </script>
  51. <style lang="scss">
  52. page {
  53. background-color: #fff;
  54. }
  55. .c-item {
  56. display: flex;
  57. align-items: center;
  58. margin: 15rpx 30rpx;
  59. padding: 40rpx 30rpx;
  60. border-radius: 10rpx;
  61. background-color: #fff;
  62. border: 1rpx solid #f5f5f5;
  63. .l {}
  64. .c {
  65. font-size: 30rpx;
  66. color: #191919;
  67. font-weight: bold;
  68. margin-left: 20rpx;
  69. }
  70. .r {
  71. font-size: 30rpx;
  72. color: #ff4200;
  73. font-weight: bold;
  74. margin-left: auto;
  75. }
  76. }
  77. @import '@/common/common.scss'
  78. </style>