202 lines
4.5 KiB
Vue
202 lines
4.5 KiB
Vue
<template>
|
|
<view class="zd_container">
|
|
<nav-bar :title="title"></nav-bar>
|
|
<view class="zd_content">
|
|
<view class="zd_wrapper">
|
|
<view class="zd-row border-bottom">
|
|
<view class="zd-col-7">
|
|
<span class="filter_label">点位</span>
|
|
</view>
|
|
<view class="zd-col-17">
|
|
<search-box
|
|
v-model="point"
|
|
/>
|
|
</view>
|
|
</view>
|
|
<view class="zd-row border-bottom">
|
|
<view class="zd-col-7">
|
|
<span class="filter_label">载具编码</span>
|
|
</view>
|
|
<view class="zd-col-17">
|
|
<search-box
|
|
v-model="vehicle"
|
|
/>
|
|
</view>
|
|
</view>
|
|
<button type="primary" class="mgt20" @tap="handleAddItem">添加</button>
|
|
</view>
|
|
<view class="zd_wrapper grid-wraper">
|
|
<view class="slide_new">
|
|
<table class="table">
|
|
<thead>
|
|
<tr>
|
|
<th>点位</th>
|
|
<th>载具编码</th>
|
|
<th>删除</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
<tr v-for="(e, i) in dataList" :key="i">
|
|
<td>{{e.point_code}}</td>
|
|
<td>{{e.vehicle_code}}</td>
|
|
<td><view class="delete-btn" @tap="deleteItem(i)">删除</view></td>
|
|
</tr>
|
|
</tbody>
|
|
</table>
|
|
<view v-if="dataList.length === 0" class="tip">请扫描点位和载具编码</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<view class="zd-row submit-bar">
|
|
<button class="zd-col-24 button-primary" :class="{'button-info': !canSubmit}" :disabled="disabled" @tap="_emptyVehicleWarehousing">提交</button>
|
|
</view>
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
import NavBar from '@/components/NavBar.vue'
|
|
import SearchBox from '@/components/SearchBox.vue'
|
|
import {emptyVehicleWarehousing} from '@/utils/getData2.js'
|
|
export default {
|
|
components: {
|
|
NavBar,
|
|
SearchBox
|
|
},
|
|
data() {
|
|
return {
|
|
title: '',
|
|
point: '',
|
|
vehicle: '',
|
|
dataList: [],
|
|
disabled: false
|
|
};
|
|
},
|
|
computed: {
|
|
canSubmit() {
|
|
return this.dataList.length > 0 || (this.point && this.vehicle);
|
|
}
|
|
},
|
|
onLoad (options) {
|
|
this.title = options.title
|
|
},
|
|
methods: {
|
|
handleAddItem() {
|
|
if (!this.point || !this.vehicle) {
|
|
uni.showToast({
|
|
title: '请完整填写点位和载具编码',
|
|
icon: 'none'
|
|
})
|
|
return
|
|
}
|
|
|
|
const exists = this.dataList.some(item =>
|
|
item.point_code === this.point && item.vehicle_code === this.vehicle
|
|
)
|
|
|
|
if (exists) {
|
|
uni.showToast({
|
|
title: '该组合已存在',
|
|
icon: 'none'
|
|
})
|
|
return
|
|
}
|
|
|
|
this.dataList.push({
|
|
point_code: this.point,
|
|
vehicle_code: this.vehicle
|
|
})
|
|
|
|
this.$nextTick(() => {
|
|
this.point = ''
|
|
this.vehicle = ''
|
|
})
|
|
},
|
|
deleteItem(index) {
|
|
this.dataList.splice(index, 1)
|
|
},
|
|
async _emptyVehicleWarehousing () {
|
|
this.disabled = true
|
|
let submitData = []
|
|
if (this.dataList.length > 0) {
|
|
submitData = this.dataList
|
|
}
|
|
else if (this.point && this.vehicle) {
|
|
submitData = [{
|
|
point_code: this.point,
|
|
vehicle_code: this.vehicle
|
|
}]
|
|
}
|
|
else {
|
|
uni.showToast({
|
|
title: '请填写点位和载具编码或添加列表数据',
|
|
icon: 'none'
|
|
})
|
|
this.disabled = false
|
|
return
|
|
}
|
|
|
|
try {
|
|
let res = await emptyVehicleWarehousing(submitData)
|
|
this.clearUp()
|
|
uni.showToast({
|
|
title: res.message,
|
|
icon: 'none'
|
|
})
|
|
} catch (e) {
|
|
console.log(e)
|
|
this.disabled = false
|
|
}
|
|
},
|
|
clearUp () {
|
|
this.point = ''
|
|
this.vehicle = ''
|
|
this.disabled = false
|
|
this.dataList = []
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style lang="stylus" scoped>
|
|
@import '../../common/style/mixin.styl';
|
|
.table
|
|
width 100%
|
|
border-spacing 0
|
|
.uncompleted-row
|
|
td
|
|
background-color #fffaf0
|
|
color #333
|
|
font-style italic
|
|
td
|
|
line-height 36rpx
|
|
padding 20rpx 10rpx
|
|
white-space pre-wrap
|
|
word-break break-all
|
|
.tip
|
|
font-size 32rpx
|
|
text-align: center;
|
|
padding: 40rpx 0;
|
|
color: #ff6a00;
|
|
.delete-btn
|
|
_font(34rpx, 50rpx, #4e6ef2,,center)
|
|
padding 10rpx 20rpx
|
|
background-color #fff
|
|
border-radius 8rpx
|
|
display inline-block
|
|
border 1rpx solid #4e6ef2
|
|
&:active
|
|
color #fff
|
|
background-color #4e6ef2
|
|
|
|
.clear-btn
|
|
_font(34rpx, 50rpx, #ff6a00,,center)
|
|
padding 10rpx 20rpx
|
|
background-color #fff
|
|
border-radius 8rpx
|
|
display inline-block
|
|
border 1rpx solid #ff6a00
|
|
&:active
|
|
color #fff
|
|
background-color #ff6a00
|
|
</style>
|