You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
143 lines
3.8 KiB
143 lines
3.8 KiB
<template>
|
|
<view>
|
|
<view class="leave_cont">
|
|
<view class="ul">
|
|
<view class="li">
|
|
<text class="font15 fcor333">开始时间</text>
|
|
<view class="flex1">
|
|
<picker mode="date" :value="start_date" :start="start_date" @change="bindDateChange">
|
|
<view class="date">{{start_date}}</view>
|
|
</picker>
|
|
</view>
|
|
</view>
|
|
<view class="li">
|
|
<text class="font15 fcor333">结束时间</text>
|
|
<view class="flex1">
|
|
<picker mode="date" :value="end_date" :start="end_date" @change="bindDateChange2">
|
|
<view class="date">{{end_date}}</view>
|
|
</picker>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<view class="btnw94">立即查询</view>
|
|
<view class="height30 backcorfff width100"></view>
|
|
</view>
|
|
<view class="width100 backcorfff mart10">
|
|
<view class="font13 fotct fcor666 paddtop15">账号余额(元)</view>
|
|
<view class="mart15 font16 fcor089 fotct ">￥<text class="font28">444.96</text></view>
|
|
<view class="font13 fotct fcor666 paddtop5 paddbotm10">31964698964646646646</view>
|
|
</view>
|
|
<view class="width100 backcorfff mart10">
|
|
<view class="width100 height50 bor-botm1 paddleft5 paddtright5">
|
|
<view class="width60 flleft fcor333 font14 text1">个人账户规帐(2020-09-1)</view>
|
|
<view class="width35 flright fcoreb5 font14 fotct">+102.54元</view>
|
|
</view>
|
|
<view class="width100 height50 bor-botm1 paddleft5 paddtright5">
|
|
<view class="width60 flleft fcor333 font14 text1">个人账户规帐(2020-09-1)</view>
|
|
<view class="width35 flright fcoreb5 font14 fotct">+102.54元</view>
|
|
</view>
|
|
<view class="width100 height50 bor-botm1 paddleft5 paddtright5">
|
|
<view class="width60 flleft fcor333 font14 text1">个人账户规帐(2020-09-1)</view>
|
|
<view class="width35 flright fcoreb5 font14 fotct">+102.54元</view>
|
|
</view>
|
|
<view class="width100 height50 bor-botm1 paddleft5 paddtright5">
|
|
<view class="width60 flleft fcor333 font14 text1">个人账户规帐(2020-09-1)</view>
|
|
<view class="width35 flright fcoreb5 font14 fotct">+102.54元</view>
|
|
</view>
|
|
<view class="width100 height50 bor-botm1 paddleft5 paddtright5">
|
|
<view class="width60 flleft fcor333 font14 text1">个人账户规帐(2020-09-1)</view>
|
|
<view class="width35 flright fcoreb5 font14 fotct">+102.54元</view>
|
|
</view>
|
|
</view>
|
|
<view class="height25 width100"></view>
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
export default {
|
|
data() {
|
|
const currentDate = this.getDate({
|
|
format: true
|
|
})
|
|
return {
|
|
start_date: currentDate,
|
|
end_date: currentDate,
|
|
other: '请输入'
|
|
}
|
|
},
|
|
methods: {
|
|
// 选择日期
|
|
bindDateChange: function(e) {
|
|
this.start_date = e.target.value
|
|
|
|
},
|
|
bindDateChange2: function(e) {
|
|
this.end_date = e.target.value;
|
|
},
|
|
// 获取当前时间
|
|
getDate(type) {
|
|
const date = new Date();
|
|
let year = date.getFullYear();
|
|
let month = date.getMonth() + 1;
|
|
let day = date.getDate();
|
|
|
|
if (type === 'start') {
|
|
year = year - 60;
|
|
} else if (type === 'end') {
|
|
year = year + 2;
|
|
}
|
|
month = month > 9 ? month : '0' + month;;
|
|
day = day > 9 ? day : '0' + day;
|
|
return `${year}-${month}-${day}`;
|
|
},
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style lang="scss">
|
|
page {
|
|
background-color: #F5F5F5;
|
|
}
|
|
|
|
.leave_cont {
|
|
background: #FFFFFF;
|
|
}
|
|
|
|
.leave_cont .ul {
|
|
padding-left: 30rpx;
|
|
}
|
|
|
|
.leave_cont .ul .li {
|
|
display: flex;
|
|
align-items: center;
|
|
border-bottom: 1px solid #efefef;
|
|
}
|
|
|
|
.leave_cont .ul .li text {
|
|
padding: 40rpx 0;
|
|
}
|
|
|
|
.leave_cont .ul .li .flex1 {
|
|
flex: 1;
|
|
text-align: right;
|
|
padding-right: 25rpx;
|
|
color: #999999;
|
|
font-size: 32rpx;
|
|
}
|
|
|
|
.date {
|
|
height: 42rpx;
|
|
}
|
|
|
|
.btnw94 {
|
|
width: 94%;
|
|
margin-left: 3%;
|
|
height: 45px;
|
|
line-height: 45px;
|
|
color: white;
|
|
text-align: center;
|
|
margin-top: 30px;
|
|
background-color: #0083f5;
|
|
border-radius: 25px;
|
|
}
|
|
</style>
|
|
|