新生报到移动端V1.0
This commit is contained in:
253
pages/filling/filling.vue
Normal file
253
pages/filling/filling.vue
Normal file
@@ -0,0 +1,253 @@
|
||||
<template>
|
||||
<!-- 信息填报 -->
|
||||
<view class="filling">
|
||||
<u-picker keyName="cateName" v-if="showTransportation" :show="showTransportation" :columns="transportation"
|
||||
@confirm="rightTransportation" @cancel="showTransportation = false" :value="form.transportation"></u-picker>
|
||||
<u-picker :show="showCatch" v-if="showCatch" :columns="columns" @confirm="rightCatch"
|
||||
@cancel="showCatch = false" v-model="form.catch"></u-picker>
|
||||
<u-datetime-picker :show="showDate" v-if="showDate" :value="form.time" mode="datetime" @confirm="rightTime"
|
||||
@cancel="showDate = false"></u-datetime-picker>
|
||||
<u--form labelPosition="top" :model="form" ref="uForm" :rules="rules">
|
||||
<u-form-item label="交通工具" labelWidth="80" prop="transportation" ref="item1">
|
||||
<u--input :disabled="isWrite" value-name="dictValue" label-name="dictLabel" placeholder="请选择交通工具"
|
||||
:readonly="true" :suffixIcon="showTransportation?'arrow-up':'arrow-down'"
|
||||
:value="form.transportationLabel"
|
||||
@click.native="isWrite ? isWrite=true : showTransportation = !showTransportation"></u--input>
|
||||
</u-form-item>
|
||||
<u-form-item label="到达车站/机场" labelWidth="120" prop="station" ref="item1">
|
||||
<u--input :disabled="isWrite" placeholder="请输入到达车站/机场" v-model="form.station"></u--input>
|
||||
</u-form-item>
|
||||
|
||||
<u-form-item label="到达时间" labelWidth="80" prop="time" ref="item1">
|
||||
<u--input placeholder="请选择到达时间" labelWidth="80" :readonly="true" prefixIcon="clock"
|
||||
v-model="currentTime" @click.native="showDateTime"></u--input>
|
||||
</u-form-item>
|
||||
|
||||
<!-- <u-form-item label="是否接站" labelWidth="80" prop="catch" ref="item1">
|
||||
<u--input :disabled="isWrite" placeholder="请选择是否接站" labelWidth="80" :readonly="true"
|
||||
:suffixIcon="showCatch?'arrow-up':'arrow-down'" v-model="form.catch"
|
||||
@click.native="isWrite ? isWrite=true : showCatch = !showCatch"></u--input>
|
||||
</u-form-item> -->
|
||||
<u-button class="submit-btn" :disabled="isWrite" text="完成" type="primary" @click="submit"></u-button>
|
||||
</u--form>
|
||||
|
||||
<u-toast ref="uToast" @show="submit"></u-toast>
|
||||
<FloatBall />
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {
|
||||
getOwnArrInfo,
|
||||
addOwnArrInfo,
|
||||
getVehicle
|
||||
} from "@/api/arrivalinfoApi.js";
|
||||
import {
|
||||
isEmpty
|
||||
} from "@/api/helpFunc.js";
|
||||
import FloatBall from "@/pages/compoents/FloatBall.vue";
|
||||
import moment from "moment"
|
||||
import "moment/locale/zh-cn"
|
||||
export default {
|
||||
components: {
|
||||
FloatBall
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
isWrite: false,
|
||||
|
||||
// 选择时间显示
|
||||
showDate: false,
|
||||
// 选择接站显示or隐藏
|
||||
showCatch: false,
|
||||
// 选择交通工具
|
||||
showTransportation: false,
|
||||
form: {
|
||||
transportation: "",
|
||||
station: "",
|
||||
time: Number(new Date()),
|
||||
catch: "",
|
||||
id:''
|
||||
},
|
||||
currentTime: '',
|
||||
columns: [
|
||||
[
|
||||
"是",
|
||||
"否"
|
||||
]
|
||||
],
|
||||
transportation: [],
|
||||
rules: {
|
||||
name: {
|
||||
type: 'string',
|
||||
required: true,
|
||||
message: '请填写姓名',
|
||||
trigger: ['blur', 'change']
|
||||
},
|
||||
transportation: {
|
||||
type: 'string',
|
||||
required: true,
|
||||
message: '请选择交通工具',
|
||||
trigger: ['blur', 'change']
|
||||
},
|
||||
station: {
|
||||
type: 'string',
|
||||
required: true,
|
||||
message: '请输入到达的站点',
|
||||
trigger: ['blur', 'change']
|
||||
},
|
||||
catch: {
|
||||
type: 'string',
|
||||
required: true,
|
||||
message: '请选择是否要接站',
|
||||
trigger: ['blur', 'change']
|
||||
},
|
||||
time: {
|
||||
type: 'any',
|
||||
required: true,
|
||||
message: '请选择到站时间',
|
||||
trigger: ['blur', 'change']
|
||||
},
|
||||
}
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
async getWrite() {
|
||||
let res = await getOwnArrInfo();
|
||||
if (res.code == 200) {
|
||||
let data = res.data;
|
||||
let temp = this.transportation[0].find((x) => {
|
||||
if (parseInt(x.id) == data.toolsType) {
|
||||
return x;
|
||||
}
|
||||
});
|
||||
this.form.transportationLabel = temp.cateName;
|
||||
this.form.transportation = temp.id;
|
||||
this.form.id=data.id;
|
||||
this.form.station = data.atStation;
|
||||
let time = moment(data.atDatetime).valueOf();
|
||||
|
||||
this.currentTime = data.atDatetime;
|
||||
this.form.time = time;
|
||||
this.form.catch = data.isNeedPick == 1 ? "是" : "否";
|
||||
// this.isWrite = true;
|
||||
}
|
||||
},
|
||||
async getTrans() {
|
||||
let res = await getVehicle();
|
||||
if (res.code == 200) {
|
||||
let temp2 = [];
|
||||
res.data.map(x => {
|
||||
temp2.push({
|
||||
cateName: x.dictLabel,
|
||||
id: x.dictValue
|
||||
});
|
||||
});
|
||||
this.transportation.push([...temp2]);
|
||||
}
|
||||
},
|
||||
|
||||
|
||||
// 选择的时间
|
||||
rightTime(value) {
|
||||
this.currentTime = moment(value.value).format('YYYY年MM月DD日 HH:mm')
|
||||
this.form.time = value.value
|
||||
this.showDate = false
|
||||
},
|
||||
// 显示选择时间的selected
|
||||
showDateTime() {
|
||||
if (this.isWrite) return
|
||||
this.showDate = !this.showDate
|
||||
},
|
||||
// 确认是否接站
|
||||
rightCatch(Array) {
|
||||
this.form.catch = Array.value[0]
|
||||
this.showCatch = false
|
||||
},
|
||||
// 选择出行的方式
|
||||
rightTransportation(Array) {
|
||||
this.form.transportationLabel = Array.value[0].cateName;
|
||||
this.form.transportation = Array.value[0].id;
|
||||
this.showTransportation = false
|
||||
},
|
||||
// 提交表单
|
||||
submit() {
|
||||
if (this.form.station.length > 20) {
|
||||
this.$refs.uToast.show({
|
||||
type: "error",
|
||||
message: "到站不能超过30个字",
|
||||
duration: 1500,
|
||||
});
|
||||
return;
|
||||
}
|
||||
this.$refs.uForm.validate().then(res => {
|
||||
this.$refs.uToast.show({
|
||||
type: "loading",
|
||||
loading: true,
|
||||
message: "保存中",
|
||||
duration: 600,
|
||||
complete: () => {
|
||||
let sdata = {};
|
||||
let temp = {
|
||||
...this.form
|
||||
};
|
||||
sdata.id=temp.id
|
||||
sdata.toolsType = temp.transportation;
|
||||
sdata.atStation = temp.station;
|
||||
sdata.atDatetime = temp.time;
|
||||
sdata.isNeedPick = temp.catch == "是" ? 1 : 0;
|
||||
addOwnArrInfo(sdata).then(res => {
|
||||
console.log(res);
|
||||
if (res.code == 200) {
|
||||
uni.$u.toast('保存成功');
|
||||
// this.isWrite = true;
|
||||
this.getWrite();
|
||||
uni.redirectTo({
|
||||
url: "/pages/newindex/newindex"
|
||||
});
|
||||
}
|
||||
})
|
||||
}
|
||||
})
|
||||
|
||||
uni.setStorageSync("regin", this.form)
|
||||
}).catch(errors => {
|
||||
uni.$u.toast('请填写完整信息')
|
||||
})
|
||||
}
|
||||
},
|
||||
created() {
|
||||
|
||||
this.getTrans();
|
||||
this.getWrite();
|
||||
if (!uni.getStorageSync("regin"))
|
||||
return ""
|
||||
this.form = uni.getStorageSync("regin")
|
||||
this.currentTime = moment(this.form.time).format('YYYY年MM月DD日 HH:mm')
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="less" scoped>
|
||||
.filling {
|
||||
padding: 50rpx;
|
||||
// height: 90vh;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: space-between;
|
||||
|
||||
.u-form-item {
|
||||
/deep/ .u-form-item__body__left {
|
||||
margin-bottom: 10px !important;
|
||||
}
|
||||
}
|
||||
|
||||
.submit-btn {
|
||||
margin-top: 100rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.u-input {
|
||||
background-color: white;
|
||||
}
|
||||
</style>
|
||||
Reference in New Issue
Block a user