364 lines
12 KiB
Vue
364 lines
12 KiB
Vue
<!-- 用车管理 -->
|
|
<template>
|
|
<view class="container">
|
|
<scroll-view scroll-y style="padding-bottom: 180rpx;background-color: #fff;">
|
|
<uni-forms v-model="form" label-width="180upx">
|
|
<ticketd :ticket_="form.ticket_"></ticketd>
|
|
<uni-forms-item label="用车事由" required>
|
|
<uni-easyinput v-model="form.reason" placeholder="请输入用车事由" v-if="mode!='show'"/>
|
|
<span v-else>{{form.location}}</span>
|
|
</uni-forms-item>
|
|
<uni-forms-item label="使用车辆" required>
|
|
<uni-data-select
|
|
v-if="mode!='show'"
|
|
v-model="form.vehreg"
|
|
:localdata="vehRegList"
|
|
:disabled="mode=='show'"
|
|
@change="vehregChange"
|
|
></uni-data-select>
|
|
<span v-else>{{form.vehreg_name}}</span>
|
|
</uni-forms-item>
|
|
<uni-forms-item label="用车范围" required>
|
|
<uni-data-checkbox v-model="form.is_city" :localdata="hobby" :disabled="mode=='show'"></uni-data-checkbox>
|
|
</uni-forms-item>
|
|
<uni-forms-item label="出发地点" required>
|
|
<uni-easyinput v-model="form.location" placeholder="请输入出发地点" v-if="mode!='show'"/>
|
|
<span v-else>{{form.location}}</span>
|
|
</uni-forms-item>
|
|
<uni-forms-item label="出发公里数" required>
|
|
<uni-number-box v-model="form.start_km" v-if="mode!='show'"></uni-number-box>
|
|
<span v-else>{{form.start_km}}</span>
|
|
</uni-forms-item>
|
|
<uni-forms-item label="归还公里数" required v-if="form.ticket_&&form.ticket_.state_&&(form.ticket_.state_.name=='用车中'||form.ticket_.state_.type==2)">
|
|
<uni-number-box v-if="form.ticket_?.state_?.name=='用车中'" v-model="ticket_data.end_km"></uni-number-box>
|
|
<span v-else>{{form.ticket_.ticket_data.end_km}}</span>
|
|
</uni-forms-item>
|
|
<uni-forms-item label="途经地点" required>
|
|
<uni-easyinput v-model="form.via" placeholder="请输入途经地点" v-if="mode!='show'"/>
|
|
<span v-else>{{form.via}}</span>
|
|
</uni-forms-item>
|
|
<uni-forms-item label="到达地点" required>
|
|
<uni-easyinput v-model="form.destination" placeholder="请输入到达地点" v-if="mode!='show'"/>
|
|
<span v-else>{{form.destination}}</span>
|
|
</uni-forms-item>
|
|
<uni-forms-item label="接待人员" required>
|
|
<uni-easyinput v-model="form.reception" placeholder="请输入接待人员" v-if="mode!='show'"/>
|
|
<span v-else>{{form.reception}}</span>
|
|
</uni-forms-item>
|
|
<uni-forms-item label="使用日期" required>
|
|
<uni-datetime-picker type="date" :clear-icon="false" v-model="form.vdate" @change="vdateChange"
|
|
v-if="mode!='show'"/>
|
|
<span v-else>{{form.vdate}}</span>
|
|
</uni-forms-item>
|
|
<uni-forms-item label="用车时间段" v-if="mode=='show'">
|
|
<span v-for="(time,index1) in form.time_ranges">
|
|
{{time}}
|
|
<span v-if="index1<(form.time_ranges.length-1)">、</span>
|
|
</span>
|
|
</uni-forms-item>
|
|
</uni-forms>
|
|
<view class="timeView" v-if="mode!='show'">
|
|
<view style="height: 70upx;line-height: 70upx;">
|
|
<text>凌晨：</text>
|
|
<view class="iconsWrap" @click="showAmChange">
|
|
<uni-icons v-if="showAm" type="up" size="20" color="#ffffff"></uni-icons>
|
|
<uni-icons v-else type="down" size="20" color="#ffffff"></uni-icons>
|
|
</view>
|
|
</view>
|
|
<view :class="{'amBlockHide':!showAm,'amBlock': showAm}">
|
|
<view v-for="(item,index) in timesListAm" :key="item.value" class="timeBlock ">
|
|
<view :class="{'isSelected':item.isSelect,'isSloted':item.sloted,'timeItem': true}" @click="timeItemClickAm(index)">{{item.label}}</view>
|
|
</view>
|
|
</view>
|
|
<view v-for="(item,index) in timesListPm" :key="item.value" class="timeBlock">
|
|
<view :class="{'isSelected':item.isSelect,'isSloted':item.sloted,'timeItem': true}" @click="timeItemClickPm(index)">{{item.label}}</view>
|
|
</view>
|
|
</view>
|
|
</scroll-view>
|
|
<view class="footer_fixed">
|
|
<ticketd_b :workflow_key="'wf_vehicle'" :title="'用车申请'" :t_id="form.id" :ticket_="form.ticket_" :ticket_data="ticket_data"
|
|
@success="submitSuccess" :submit_b_func="submit_b_func" ref="ticketd_b_start"></ticketd_b>
|
|
</view>
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
import ticketd_b from "../wf/ticketd_b.vue"
|
|
import ticketd from "../wf/ticketd.vue"
|
|
import {actStateEnum} from "@/utils/enum.js"
|
|
export default {
|
|
components: { ticketd_b, ticketd },
|
|
data(){
|
|
return{
|
|
form:{
|
|
id:null,
|
|
via:"",
|
|
vdate:"",
|
|
vehreg:"",
|
|
reason:"",
|
|
is_city:"",
|
|
location:"",
|
|
reception:"",
|
|
destination:"",
|
|
start_km:"",
|
|
slots:[],
|
|
},
|
|
ticket_data:{
|
|
end_km:0,
|
|
},
|
|
showAm:false,
|
|
vehRegList:[],
|
|
hobby:[{text: '市内', value: true},{text: '市外', value: false}],
|
|
//凌晨0-6点
|
|
timesListAm:[
|
|
{value:0,label:'00:00-00:30',isSelect:false,sloted:false},
|
|
{value:1,label:'00:30-01:00',isSelect:false,sloted:false},
|
|
{value:2,label:'01:00-01:30',isSelect:false,sloted:false},
|
|
{value:3,label:'01:30-02:00',isSelect:false,sloted:false},
|
|
{value:4,label:'02:00-02:30',isSelect:false,sloted:false},
|
|
{value:5,label:'02:30-03:00',isSelect:false,sloted:false},
|
|
{value:6,label:'03:00-03:30',isSelect:false,sloted:false},
|
|
{value:7,label:'03:30-04:00',isSelect:false,sloted:false},
|
|
{value:8,label:'04:00-04:30',isSelect:false,sloted:false},
|
|
{value:9,label:'04:30-05:00',isSelect:false,sloted:false},
|
|
{value:10,label:'05:00-05:30',isSelect:false,sloted:false},
|
|
{value:11,label:'05:30-06:00',isSelect:false,sloted:false}
|
|
],
|
|
timesListPm:[
|
|
{value:12,label:'06:00-06:30',isSelect:false,sloted:false},
|
|
{value:13,label:'06:30-07:00',isSelect:false,sloted:false},
|
|
{value:14,label:'07:00-07:30',isSelect:false,sloted:false},
|
|
{value:15,label:'07:30-08:00',isSelect:false,sloted:false},
|
|
{value:16,label:'08:00-08:30',isSelect:false,sloted:false},
|
|
{value:17,label:'08:30-09:00',isSelect:false,sloted:false},
|
|
{value:18,label:'09:00-09:30',isSelect:false,sloted:false},
|
|
{value:19,label:'09:30-10:00',isSelect:false,sloted:false},
|
|
{value:20,label:'10:00-10:30',isSelect:false,sloted:false},
|
|
{value:21,label:'10:30-11:00',isSelect:false,sloted:false},
|
|
{value:22,label:'11:00-11:30',isSelect:false,sloted:false},
|
|
{value:23,label:'11:30-12:00',isSelect:false,sloted:false},
|
|
{value:24,label:'12:00-12:30',isSelect:false,sloted:false},
|
|
{value:25,label:'12:30-13:00',isSelect:false,sloted:false},
|
|
{value:26,label:'13:00-13:30',isSelect:false,sloted:false},
|
|
{value:27,label:'13:30-14:00',isSelect:false,sloted:false},
|
|
{value:28,label:'14:00-14:30',isSelect:false,sloted:false},
|
|
{value:29,label:'14:30-15:00',isSelect:false,sloted:false},
|
|
{value:30,label:'15:00-15:30',isSelect:false,sloted:false},
|
|
{value:31,label:'15:30-16:00',isSelect:false,sloted:false},
|
|
{value:32,label:'16:00-16:30',isSelect:false,sloted:false},
|
|
{value:33,label:'16:30-17:00',isSelect:false,sloted:false},
|
|
{value:34,label:'17:00-17:30',isSelect:false,sloted:false},
|
|
{value:35,label:'17:30-18:00',isSelect:false,sloted:false},
|
|
{value:36,label:'18:00-18:30',isSelect:false,sloted:false},
|
|
{value:37,label:'18:30-19:00',isSelect:false,sloted:false},
|
|
{value:38,label:'19:00-19:30',isSelect:false,sloted:false},
|
|
{value:39,label:'19:30-20:00',isSelect:false,sloted:false},
|
|
{value:40,label:'20:00-20:30',isSelect:false,sloted:false},
|
|
{value:41,label:'20:30-21:00',isSelect:false,sloted:false},
|
|
{value:42,label:'21:00-21:30',isSelect:false,sloted:false},
|
|
{value:43,label:'21:30-22:00',isSelect:false,sloted:false},
|
|
{value:44,label:'22:00-22:30',isSelect:false,sloted:false},
|
|
{value:45,label:'22:30-23:00',isSelect:false,sloted:false},
|
|
{value:46,label:'23:00-23:30',isSelect:false,sloted:false},
|
|
{value:47,label:'23:30-24:00',isSelect:false,sloted:false}
|
|
]
|
|
}
|
|
},
|
|
async onLoad(options) {
|
|
let that = this;
|
|
that.form.id='';
|
|
that.mode = options.mode?options.mode:'show';
|
|
that.t_id = options.t_id?options.t_id:null;
|
|
if(that.mode != "add"){
|
|
if(that.t_id) {
|
|
that.form = await that.$api.vehicleItem(that.t_id);
|
|
that.form.slots.forEach(slot=>{
|
|
if(slot<12){
|
|
that.timesListAm[slot].sloted = true;
|
|
}else{
|
|
that.timesListPm[slot].sloted = true;
|
|
}
|
|
})
|
|
if(that.form.ticket_.state_.type == 1 && that.form.create_by == uni.getStorageSync("userInfo").id ) {
|
|
that.mode = "edit";
|
|
}else{
|
|
that.mode = "show";
|
|
}
|
|
}else{
|
|
}
|
|
}
|
|
},
|
|
mounted() {
|
|
this.form.belong_dept = uni.getStorageSync("userInfo").belong_dept;
|
|
this.getVehRegList();
|
|
},
|
|
methods:{
|
|
showAmChange(){
|
|
this.showAm = !this.showAm;
|
|
},
|
|
getVehRegList(){
|
|
let that = this;
|
|
that.$api.vehRegList({page:0}).then(res=>{
|
|
res.forEach(item=>{
|
|
item.text = item.name;
|
|
item.value = item.id;
|
|
})
|
|
that.vehRegList = res;
|
|
})
|
|
},
|
|
vehregChange(){
|
|
let that = this;
|
|
that.vehRegList.forEach(item=>{
|
|
if(item.id == that.form.vehreg){
|
|
that.mroomName = item.name;
|
|
that.bookingTitle = item.name+"预定";
|
|
if(that.form.vdate!==''&&that.form.vdate!==null){
|
|
that.getmVehicleSlot();
|
|
}
|
|
}
|
|
})
|
|
},
|
|
vdateChange(){
|
|
let that = this;
|
|
if(that.form.vehreg!==''&&that.form.vehreg!==null){
|
|
that.getmVehicleSlot();
|
|
}
|
|
},
|
|
getmVehicleSlot(){
|
|
let that = this;
|
|
let form = {};
|
|
form.page = 0;
|
|
form.vehreg = that.form.vehreg;
|
|
form.vdate = that.form.vdate;
|
|
console.log('that.form',that.form)
|
|
that.timesListAm.forEach(slot=>{
|
|
slot.sloted = false;
|
|
})
|
|
that.timesListPm.forEach(slot=>{
|
|
slot.sloted = false;
|
|
})
|
|
that.$api.vehicleSlot(form).then(res=>{
|
|
res.forEach(item=>{
|
|
if(item.slot<12){
|
|
if(item.booking == that.form.id) {
|
|
that.timesListAm[item.slot].isSelect = true;
|
|
}else{
|
|
that.timesListAm[item.slot].sloted = true;
|
|
}
|
|
}else{
|
|
if(item.booking == that.form.id) {
|
|
that.timesListPm[item.slot-12].isSelect = true;
|
|
}else{
|
|
that.timesListPm[item.slot-12].sloted = true;
|
|
}
|
|
}
|
|
})
|
|
})
|
|
},
|
|
timeItemClickAm(index){
|
|
if(this.timesListPm[index].sloted){
|
|
|
|
}else{
|
|
this.timesListAm[index].isSelect = !this.timesListAm[index].isSelect;
|
|
this.clickItems();
|
|
}
|
|
},
|
|
timeItemClickPm(index){
|
|
if(this.timesListPm[index].sloted){
|
|
|
|
}else{
|
|
this.timesListPm[index].isSelect = !this.timesListPm[index].isSelect;
|
|
this.clickItems();
|
|
}
|
|
},
|
|
clickItems(){
|
|
let that = this;
|
|
that.selectList = [];
|
|
let lists = [],slots=[];
|
|
that.timesListAm.forEach(item=>{
|
|
if(item.isSelect){
|
|
lists.push(item)
|
|
slots.push(item.value);
|
|
}
|
|
})
|
|
that.timesListPm.forEach(item2=>{
|
|
if(item2.isSelect){
|
|
lists.push(item2)
|
|
slots.push(item2.value);
|
|
}
|
|
})
|
|
setTimeout(()=>{
|
|
that.totalCount = slots.length*0.5;
|
|
that.selectList = lists;
|
|
that.form.slots = slots;
|
|
},500)
|
|
},
|
|
//选择会议室和日期后查询有无预定
|
|
async submit_b_func(id){
|
|
let that = this;
|
|
if (that.mode != 'show') {
|
|
if(that.form.id) {
|
|
await that.$api.vehicleUpdate(that.form.id, that.form);
|
|
}else{
|
|
let res = await that.$api.vehicleCreate(that.form);
|
|
that.form.id = res.id;
|
|
}
|
|
}
|
|
},
|
|
submitSuccess(){
|
|
uni.navigateTo({
|
|
url: "/pages/index/index"
|
|
})
|
|
},
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style scoped>
|
|
.iconsWrap{
|
|
width: 40upx;
|
|
height: 40upx;
|
|
display: inline-block;
|
|
line-height: 40upx;
|
|
border-radius: 25upx;
|
|
text-align: center;
|
|
background-color: #74ddfc;
|
|
border: 1px solid #74ddfc;
|
|
}
|
|
.timeView{
|
|
width: 100%;
|
|
padding: 10upx;
|
|
box-sizing: border-box;
|
|
}
|
|
.amBlock{
|
|
display: block;
|
|
}
|
|
.amBlockHide{
|
|
display: none;
|
|
}
|
|
.timeBlock{
|
|
width: 25%;
|
|
padding: 6upx;
|
|
height: 70upx;
|
|
margin: 10upx 0;
|
|
font-size: 28upx;
|
|
line-height: 70upx;
|
|
display: inline-block;
|
|
box-sizing: border-box;
|
|
}
|
|
.timeItem{
|
|
color: #666666;
|
|
text-align: center;
|
|
border-radius: 10upx;
|
|
background-color: #b9f0cb;
|
|
border: 1upx solid #eeeeee;
|
|
}
|
|
.timeItem.isSelected{
|
|
background-color: #00a870;
|
|
color: #fff;
|
|
}
|
|
.timeItem.isSloted{
|
|
background-color: #fac275!important;
|
|
color: #fff;
|
|
}
|
|
</style> |