car-manager.vue 3.4 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139
  1. <template>
  2. <view>
  3. <view class="box">
  4. <view class="top">
  5. <text class="title">业务车辆</text>
  6. </view>
  7. <view class="item">
  8. <view class="l"><text style="color: red;">*</text>车牌号:</view>
  9. <view class="r">
  10. <u-input placeholder="输入车牌号" v-model="form.carNo">
  11. </u-input>
  12. </view>
  13. </view>
  14. <view class="item">
  15. <view class="l"><text style="color: red;" v-if="needCarSize==1">*</text>规格(米):</view>
  16. <view class="r">
  17. <u-input placeholder="输入规格" type="number" v-model="form.carSize">
  18. </u-input>
  19. </view>
  20. </view>
  21. <view class="item">
  22. <view class="l">车辆类型:</view>
  23. <view class="r" style="flex: 12;">
  24. <picker v-if="carType.list.length>0" class="p-picker" @change="carTypeChange($event)"
  25. :value="carType.index" :range="carType.list" range-key="name">
  26. <text class="p-text">{{carType.list[carType.index].name}}</text>
  27. </picker>
  28. </view>
  29. </view>
  30. <view class="item" v-if="carType.index==1">
  31. <view class="l"><text style="color: red;" >*</text>载重(kg):</view>
  32. <view class="r">
  33. <u-input placeholder="车辆载重" v-model="form.netWeight">
  34. </u-input>
  35. </view>
  36. </view>
  37. </view>
  38. <view style="margin-top: 50px;">
  39. <u-button type="primary" text="确定" @click="saveFn"></u-button>
  40. <u-button type="info" text="返回" @click="backFn" style="margin-top: 20rpx;"></u-button>
  41. </view>
  42. <!-- ---------------------------------------------------------- -->
  43. <view class="bottom-safety"></view>
  44. </view>
  45. </template>
  46. <script>
  47. export default {
  48. data() {
  49. return {
  50. carType: {
  51. index: 0,
  52. list: []
  53. },
  54. needCarSize: 0,
  55. needWeight: 0,
  56. form: {
  57. carNo: '',
  58. carType: '',
  59. netWeight: '',
  60. carSize: ''
  61. }
  62. }
  63. },
  64. onLoad(options) {
  65. this.form = JSON.parse(options.carJson);
  66. console.log(this.form)
  67. this.needCarSize = options.needCarSize;
  68. this.needWeight = options.needWeight;
  69. this.getCarType();
  70. },
  71. methods: {
  72. getCarType() {
  73. this.$api.getCarType().then(resp => {
  74. let list = resp.data;
  75. this.carType.list = list;
  76. let form=this.form;
  77. if(form.netWeight&&form.netWeight>0){
  78. this.carType.index=1;
  79. }
  80. })
  81. },
  82. carTypeChange(e) {
  83. var value = e.detail.value; //当前picker选中的值
  84. console.log(value)
  85. this.carType.index = value;
  86. },
  87. backFn(){
  88. this.$common.back();
  89. },
  90. saveFn() {
  91. let data = this.form;
  92. if (!data.carNo) {
  93. this.$common.toast('请填写车牌号')
  94. return false;
  95. }
  96. let needCarSize = this.needCarSize;
  97. if (!data.carSize&&needCarSize==1) {
  98. this.$common.toast('请填写车辆规格')
  99. return false;
  100. }
  101. let needWeight = this.needWeight;
  102. if (this.carType.index==1&&(!data.netWeight||data.netWeight<=0)) {
  103. this.$common.toast('请填写车辆载重')
  104. return false;
  105. }
  106. data.carType=this.carType.list[this.carType.index].name;
  107. data.carNo=data.carNo.toUpperCase();
  108. uni.navigateBack({
  109. delta: 1,
  110. success: function(resp) {
  111. uni.$emit('getCar', data) //触发事件
  112. }
  113. })
  114. }
  115. },
  116. }
  117. </script>
  118. <style lang="scss">
  119. page {
  120. background-color: #fff;
  121. }
  122. .save-btn {
  123. background-color: #ff4200;
  124. height: 88rpx;
  125. display: flex;
  126. justify-content: center;
  127. align-items: center;
  128. margin: 60rpx;
  129. color: #fff;
  130. font-size: 30rpx;
  131. font-weight: bold;
  132. border-radius: 10rpx;
  133. }
  134. @import '@/common/common.scss'
  135. </style>