功能需求：
1：填写表单内容，点击提交审批按钮，提交成功之后，弹出弹框，提示已经提交成功。2：提交成功之后，两秒钟之后自动跳转到首页
主要函数：
sub() {
uni.showToast({
title: '上传成功',
icon: 'success',
duration: 1000
})
setTimeout(() => {
uni.switchTab({
url: "../main",
});
}, 600);
},
参考代码：
<template>
<view>
<form>
<view class="cu-form-group margin-top">
<view class="title">补卡原因</view>
<picker @change="PickerChange" :value="index" :range="picker">
<view class="picker">
{{index>-1?picker[index]:'出差'}}
</view>
</picker>
</view>
<!-- #endif -->
<view class="cu-form-group">
<view class="title">时间选择</view>
<picker mode="time" :value="time" start="09:01" end="21:01" @change="TimeChange">
<view class="picker">
{{time}}
</view>
</picker>
</view>
<view class="cu-form-group">
<view class="title">日期选择</view>
<picker mode="date" :value="date" start="2015-09-01" end="2020-09-01" @change="DateChange">
<view class="picker">
{{date}}
</view>
</picker>
</view>
<view class="cu-form-group align-start">
<view class="title">补卡事由</view>
<textarea maxlength="-1" :disabled="modalName!=null" @input="textareaBInput" placeholder="多行文本输入框"></textarea>
</view>
<view class="uni-btn-v uni-common-mt">
<button class="btn-submit" formType="submit" type="primary" @click="sub">提交审批</button>
</view>
</form>
</view>
</template>
<script>
export default {
data() {
return {
index: -1,
picker: ['出差', '年休', '忘记打卡', '病假', '事假', '外勤'],
// multiIndex: [0, 0, 0],
time: '12:01',
date: '2018-12-25',
modalName: null,
textareaBValue: ''
};
},
methods: {
PickerChange(e) {
this.index = e.detail.value
},
sub() {
uni.showToast({
title: '上传成功',
icon: 'success',
duration: 1000
})
setTimeout(() => {
uni.switchTab({
url: "../main",
});
}, 600);
},
TimeChange(e) {
this.time = e.detail.value
},
DateChange(e) {
this.date = e.detail.value
},
textareaBInput(e) {
this.textareaBValue = e.detail.value
}
}
}
</script>
<style>
.cu-form-group .title {
min-width: calc(4em + 15px);
}
.btn-submit {
background-color: #1C2A86;
margin: 100upx 20upx;
color: #fff;
}
</style>
