|
@@ -15,9 +15,27 @@
|
|
|
</a-select>
|
|
|
</a-form-item>
|
|
|
</a-col>
|
|
|
+ <a-col :xl="6" :lg="7" :md="8" :sm="24">
|
|
|
+ <a-form-item label="年度">
|
|
|
+ <a-date-picker placeholder="请选择" :allowClear="true" :open="isopen" mode="year" format="YYYY" v-model="yearWith"
|
|
|
+ @openChange="changeopen" @panelChange="handlePanelChange1" @change="onChange" style="width:100% !important"/>
|
|
|
+ </a-form-item>
|
|
|
+ </a-col>
|
|
|
<a-col :xl="6" :lg="7" :md="8" :sm="24">
|
|
|
<a-form-item label="时间">
|
|
|
- <a-month-picker placeholder="请选择" :allowClear="false" v-model="yearWithMonth" @change="onChange" style="width:100% !important"/>
|
|
|
+ <!-- <a-month-picker placeholder="请选择" :allowClear="false" v-model="yearWithMonth" @change="onChange" style="width:100% !important"/> -->
|
|
|
+ <a-range-picker
|
|
|
+ style="width: 100% !important"
|
|
|
+ v-model="DateTime"
|
|
|
+ format="YYYY-MM"
|
|
|
+ valueFormat="YYYY-MM"
|
|
|
+ :mode="mode2"
|
|
|
+ :open="open"
|
|
|
+ :placeholder="['开始时间', '结束时间']"
|
|
|
+ @panelChange="handlePanelChange2"
|
|
|
+ @openChange="onDateChange"
|
|
|
+ @change="changeData"
|
|
|
+ />
|
|
|
</a-form-item>
|
|
|
</a-col>
|
|
|
<a-col :xl="6" :lg="7" :md="8" :sm="24">
|
|
@@ -101,7 +119,11 @@
|
|
|
data () {
|
|
|
return {
|
|
|
description: '工资单列表',
|
|
|
- yearWithMonth:'',
|
|
|
+ yearWith:'',
|
|
|
+ mode2: ['month', 'month'],
|
|
|
+ DateTime:[],
|
|
|
+ open:false,
|
|
|
+ isopen:false,
|
|
|
// 表头
|
|
|
columns: [
|
|
|
{
|
|
@@ -174,16 +196,14 @@
|
|
|
this.getTableList()
|
|
|
},
|
|
|
methods: {
|
|
|
- onChange(data){
|
|
|
- this.yearWithMonth = data
|
|
|
- this.queryParam.yearWithMonth = this.yearWithMonth?moment(this.yearWithMonth).format('YYYY-MM'):''
|
|
|
- },
|
|
|
+
|
|
|
searchQuery(){
|
|
|
this.queryParam.pageNo = 1
|
|
|
this.getTableList()
|
|
|
},
|
|
|
searchReset(){
|
|
|
this.queryParam={}
|
|
|
+ this.DateTime = []
|
|
|
this.getTableList()
|
|
|
},
|
|
|
getTableList(){
|
|
@@ -265,6 +285,48 @@
|
|
|
this.queryParam.pageSize = pagination.pageSize
|
|
|
this.getTableList()
|
|
|
},
|
|
|
+ handlePanelChange2(value,mode){
|
|
|
+ if (this.DateTime[1] && this.DateTime[1]._d != value[1]._d) {
|
|
|
+ this.open = false;
|
|
|
+ }
|
|
|
+ this.DateTime = value
|
|
|
+ this.queryParam.yearWithMonth_begin = this.DateTime[0]&&this.DateTime[0]!==''?moment(this.DateTime[0]).format('YYYY-MM'):''
|
|
|
+ this.queryParam.yearWithMonth_end = this.DateTime[1]&&this.DateTime[1]!==''?moment(this.DateTime[1]).format('YYYY-MM'):''
|
|
|
+ this.mode2 = [mode[0] === 'date' ? 'month' : mode[0], mode[1] === 'date' ? 'month' : mode[1]];
|
|
|
+ },
|
|
|
+ onDateChange(status) {
|
|
|
+ if(status){
|
|
|
+ this.open = true;
|
|
|
+ }else{
|
|
|
+ this.open = false
|
|
|
+ }
|
|
|
+ },
|
|
|
+ changeData(value){
|
|
|
+ if(value == null || value.length == 0){
|
|
|
+ this.queryParam.yearWithMonth_begin = ''
|
|
|
+ this.queryParam.yearWithMonth_end = ''
|
|
|
+ }
|
|
|
+ this.DateTime = value
|
|
|
+
|
|
|
+ },
|
|
|
+ handlePanelChange1(value){
|
|
|
+ this.isopen = false
|
|
|
+ this.yearWith = value
|
|
|
+ this.queryParam.yearWith = this.yearWith?moment(this.yearWith).format('YYYY'):''
|
|
|
+ },
|
|
|
+ changeopen(status){
|
|
|
+ if(status){
|
|
|
+ this.isopen = true
|
|
|
+ }
|
|
|
+ },
|
|
|
+ onChange(data){
|
|
|
+ // if(data == null || data == ''){
|
|
|
+ // this.yearWithMonth = ''
|
|
|
+ // this.queryParam.yearWithMonth = ''
|
|
|
+ // }
|
|
|
+ this.yearWith = data
|
|
|
+ this.queryParam.yearWith = this.yearWith?moment(this.yearWith).format('YYYY'):''
|
|
|
+ }
|
|
|
}
|
|
|
}
|
|
|
</script>
|