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.
184 lines
4.2 KiB
184 lines
4.2 KiB
<template> |
|
<view> |
|
<uni-popup ref="popup" background-color="#fff" @change="change"> |
|
<view class="seniorPagePopup_body"> |
|
<view class="seniorPagePopup_header"> |
|
<view @click="reset">重置</view> |
|
<view @click="close">确认</view> |
|
</view> |
|
<view class="seniorPagePopup_container" > |
|
<view class="seniorPagePopup_title">统计年月</view> |
|
<view class="seniorPagePopup_datetime"> |
|
<uni-datetime-picker placeholder='请选择统计年月' type="date" v-model="single" @maskClick="maskClick" /> |
|
<view class="seniorPagePopup_datetime_tip"> |
|
注意：报告日为每月4日。<br/> |
|
4日及4日后，可查上个月报告数据，<br/> |
|
4日前，最多只能查询前个月数据。 |
|
</view> |
|
</view> |
|
<view class="seniorPagePopup_footer"> |
|
<view class="seniorPagePopup_title">向前统计滚动周期</view> |
|
<view class="seniorPagePopup_footer_select_container flex"> |
|
<view @click="selectIndex=index" v-for="(item,index) in statypeList" :key='index' :class="selectIndex==index? 'seniorPagePopup_footer_select_item_slecct':'seniorPagePopup_footer_select_item '" class="flex jc ac"> |
|
{{item.value}} |
|
</view> |
|
</view> |
|
</view> |
|
</view> |
|
</view> |
|
</uni-popup> |
|
</view> |
|
</template> |
|
<script> |
|
export default { |
|
options: { |
|
styleIsolation: 'shared', // 解除样式隔离 |
|
}, |
|
props:{ |
|
isShow:{ |
|
type:Boolean, |
|
default: false |
|
} |
|
}, |
|
data() { |
|
return { |
|
statypeList:[ |
|
{ |
|
value:12 |
|
}, |
|
{ |
|
value:6 |
|
}, |
|
{ |
|
value:3 |
|
} |
|
], |
|
show: true, |
|
single:'', |
|
selectIndex:0, |
|
} |
|
}, |
|
created() { |
|
this.single = this.getNowFormatDate() |
|
}, |
|
watch:{ |
|
isShow(n,o){ |
|
console.log(n); |
|
if(n){ |
|
this.$refs.popup.open('bottom') |
|
}else{ |
|
this.$refs.popup.close() |
|
} |
|
} |
|
}, |
|
methods: { |
|
getNowFormatDate() { |
|
var date = new Date(); |
|
var seperator1 = "-"; |
|
var year = date.getFullYear(); |
|
var month = date.getMonth() + 1; |
|
var strDate = date.getDate(); |
|
if (month >= 1 && month <= 9) { |
|
month = "0" + month; |
|
} |
|
if (strDate >= 0 && strDate <= 9) { |
|
strDate = "0" + strDate; |
|
} |
|
var currentdate = year + seperator1 + month + seperator1 + strDate; |
|
return currentdate; |
|
}, |
|
reset(){ |
|
this.selectIndex = 0; |
|
this.single = this.getNowFormatDate(); |
|
// this.$refs.popup.close() |
|
}, |
|
close(){ |
|
this.$refs.popup.close() |
|
}, |
|
seniorPageCallBack(){ |
|
return { |
|
statype:this.statypeList[this.selectIndex].value||'', |
|
queryDate:this.single||'' |
|
} |
|
}, |
|
maskClick(){}, |
|
change(e) { |
|
if(!e.show){ |
|
this.$emit('update:isShow', false) |
|
} |
|
} |
|
} |
|
} |
|
</script> |
|
<style> |
|
.seniorPagePopup_footer_select_item_slecct{ |
|
background-color: #FF6700; |
|
height: 80rpx; |
|
width: 140rpx; |
|
border-radius: 10px; |
|
margin-right: 20rpx; |
|
color: #FFFFFF; |
|
} |
|
.jc{ |
|
justify-content: center; |
|
} |
|
.ac{ |
|
align-items: center; |
|
} |
|
.seniorPagePopup_footer_select_container{ |
|
|
|
} |
|
.seniorPagePopup_footer_select_item:last-child{ |
|
margin-right: 0rpx; |
|
} |
|
.seniorPagePopup_footer_select_item{ |
|
height: 80rpx; |
|
width: 140rpx; |
|
background: #F0F0F0; |
|
border-radius: 10px; |
|
margin-right: 20rpx; |
|
} |
|
.seniorPagePopup_container_footer{ |
|
|
|
} |
|
.seniorPagePopup_datetime_tip{ |
|
font-weight: 400; |
|
font-size: 28rpx; |
|
line-height: 32rpx; |
|
color: #BBBBBB; |
|
margin-top: 10rpx; |
|
margin: 26rpx 0 ; |
|
} |
|
.seniorPagePopup_title{ |
|
margin-bottom: 20rpx; |
|
color: #FF6700; |
|
font-size: 32rpx; |
|
} |
|
.seniorPagePopup_container .uni-date-x{ |
|
background: #F0F0F0 !important; |
|
border-radius: 10px !important; |
|
} |
|
.seniorPagePopup_container .uni-date-x--border{ |
|
border: 0px !important; |
|
} |
|
.seniorPagePopup_container{ |
|
padding: 34rpx 70rpx; |
|
box-sizing: border-box; |
|
} |
|
.seniorPagePopup_header{ |
|
width: 100%; |
|
display: flex; |
|
justify-content: space-between; |
|
font-size: 32rpx; |
|
color: #FF6700; |
|
} |
|
.seniorPagePopup_header view:first-child{ |
|
color: #BBBBBB; |
|
} |
|
.seniorPagePopup_body{ |
|
width: 100vw; |
|
height: 580rpx; |
|
padding-bottom: env(safe-area-inset-bottom); |
|
padding: 30rpx 62rpx; |
|
} |
|
</style>
|
|
|