人员薪资

src/views/oa/salary_management/personnelSalary/Payroll.vue

@@ -74,9 +74,6 @@
                 <a @click="handleDetail(record)" >查看详情</a>
                 <a-divider type="vertical" />
                 <a @click="handleDownload(record)" >下载</a>
-                <a-divider type="vertical" />
-                <a @click="handleexport(record)" >导出</a>
-
            </span>
         </a-table>
       </div>
@@ -86,7 +83,7 @@
       <PayrollDetail ref="PayrollDetail"></PayrollDetail>
       <AnnualLeavePayroll ref="AnnualLeavePayroll"></AnnualLeavePayroll>
       <OvertimePayroll ref="OvertimePayroll"></OvertimePayroll>
-      <uploadModal ref="uploadModal"></uploadModal>
+      <uploadModal ref="uploadModal" @ok="searchQuery"></uploadModal>
     </a-card>
   </template>
   
@@ -188,6 +185,14 @@
           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.getTableList()
+        },
         getTableList(){
           this.loading = true
           getAction('/salary/salaryManagement/list',this.queryParam).then(res=>{
@@ -213,6 +218,7 @@
             this.$refs.OvertimePayroll.detail(record.id)
           }else if(record.type=='年休工资单'){
             this.$refs.AnnualLeavePayroll.visible = true
+            this.$refs.AnnualLeavePayroll.detail(record.id)
           }else if(record.type=='月度工资'){
             this.$refs.PayrollDetail.visible = true
             this.$refs.PayrollDetail.detail(record.id)

src/views/oa/salary_management/personnelSalary/modules/AnnualLeavePayroll.vue

@@ -15,41 +15,30 @@
             <div class="table-page-search-wrapper">
                 <a-form-model layout="inline" ref="form" :model="formState" >
                     <a-row :gutter="24">
-                        <a-col :md="6" :sm="8">
-                            <a-form-model-item label="时间"  prop="totalNum">
-                                <a-input placeholder="" v-model="formState.DateTime" />
-                            </a-form-model-item>
-                        </a-col>
-                        <a-col :md="6" :sm="8">
-                            <a-form-model-item label="版本" >
-                                <a-input placeholder="请输入" v-model="formState.version"  />
-                            </a-form-model-item>
-                        </a-col>
                         <a-col :md="6" :sm="8">
                             <a-form-model-item label="姓名"  >
                                 <a-input placeholder="请输入" v-model="formState.name" />
                             </a-form-model-item>
                         </a-col>
+                        <a-col :xl="8" :lg="7" :md="8" :sm="24">
+                            <a-form-item label="部门">
+                                <j-search-select-tag v-model="formState.sysOrgCode" placeholder="请选择部门" 
+                                    dict="sys_depart,depart_name,depart_name,org_type='3' or org_code='TBD' order by org_code"/>
+                            </a-form-item>
+                        </a-col>
                         <a-col :md="6" :sm="8">
                             <a-form-model-item label=""  >
                                 <a-button type="primary" icon="search" @click="searchSonList">查询</a-button>
                             </a-form-model-item>
                         </a-col>
                     </a-row>
-                    <a-row :gutter="24">
-                        <a-col :md="24" :sm="8"> 
-                            <a-form-model-item label="备注"  class="nresume" style="height:100px !important">
-                                <a-input type="textarea" placeholder="请输入" v-model="formState.demo" />
-                            </a-form-model-item>
-                        </a-col>
-                    </a-row>
                 </a-form-model>
                 <a-table
                     bordered
                     :columns="columns"
                     :data-source="dataSource"
                     :loading="loading"
-                    :scroll="{x: 3500 ,y:300}"
+                    :scroll="{x: 1200 ,y:400}"
                     :pagination="false"
                 >
                 </a-table>
@@ -63,12 +52,17 @@
       import pick from 'lodash.pick'
       import { FormTypes } from '@/utils/JEditableTableUtil'
       import { putAction,getAction } from '@/api/manage'
+      import JSearchSelectTag from '@/components/dict/JSearchSelectTag'
+      import JEllipsis from '@/components/jeecg/JEllipsis'
       export default {
         name: 'AnnualLeavePayroll',
         components: {
             moment,
+            JEllipsis,
+            JSearchSelectTag
         },
         data() {
+            let ellipsis = (v, l) => <j-ellipsis value={v} length={l} />
           return {
               formState:{},
               dataSource: [{}],
@@ -78,7 +72,7 @@
                 {
                     title: '序号',
                     align:"center",
-                    width:'2%',
+                    width:'5%',
                     dataIndex: 'index',
                     customRender:function (t, r, index) {
                         return parseInt(index)+1;
@@ -87,135 +81,59 @@
                 {
                     title: '编号',
                     align: "center",
-                    dataIndex: 'number',
+                    dataIndex: 'code',
                     ellipsis: true,
-                    width:'4%'
+                    customRender: (t) => ellipsis(t,17),
+                    width:'10%'
                 },
                 {
                     title: '姓名',
                     align: "center",
                     dataIndex: 'name',
-                    ellipsis: true,
-                    width:'4%'
-                },
-                {
-                    title: '基本薪资',
-                    align: "center",
-                    dataIndex: 'organization',
-                    ellipsis: true,
-                    width:'4%'
-                },
-                {
-                    title: '话费补贴',
-                    align: "center",
-                    dataIndex: 'salaryCardNumber',
-                    ellipsis: true,
-                    width:'4%'
-                },
-                {
-                    title: '午餐补贴',
-                    align: "center",
-                    dataIndex: 'singlesWeekendsOff',
-                    ellipsis: true,
-                    width:'4%'
-                },
-                {
-                    title: '住房补贴',
-                    align: "center",
-                    dataIndex: 'workingHours',
-                    ellipsis: true,
-                    width:'4%'
-                },
-                {
-                    title: '交通补贴',
-                    align: "center",
-                    dataIndex: 'attendanceDays',
-                    ellipsis: true,
-                    width:'4%'
+                    customRender: (t) => ellipsis(t,17),
+                    width:'10%'
                 },
                 {
-                    title: '全勤奖',
+                    title: '年假天数',
                     align: "center",
-                    dataIndex: 'telephoneSubsidy',
+                    dataIndex: 'annualLeave',
                     ellipsis: true,
-                    width:'4%'
+                    width:'10%'
                 },
                 {
-                    title: '合计应发',
+                    title: '已请天数',
                     align: "center",
-                    dataIndex: 'lunchSubsidy',
+                    dataIndex: 'used',
                     ellipsis: true,
-                    width:'4%'
+                    width:'10%'
                 },
                 {
-                    title: '社保',
+                    title: '剩余天数',
                     align: "center",
-                    dataIndex: 'housingSubsidies',
+                    dataIndex: 'surplus',
                     ellipsis: true,
-                    width:'4%'
+                    width:'10%'
                 },
                 {
-                    title: '公积金',
+                    title: '应发薪资',
                     align: "center",
-                    dataIndex: 'transportationSubsidies',
+                    dataIndex: 'wages',
                     ellipsis: true,
-                    width:'4%'
+                    width:'10%'
                 },
                 {
                     title: '个税',
                     align: "center",
-                    dataIndex: 'fullAttendanceAward',
-                    ellipsis: true,
-                    width:'4%'
-                },
-                {
-                    title: '迟到',
-                    align: "center",
-                    dataIndex: 'endowmentInsurance',
-                    ellipsis: true,
-                    width:'4%'
-                },
-                {
-                    title: '事假',
-                    align: "center",
-                    dataIndex: 'unemploymentInsurance',
-                    ellipsis: true,
-                    width:'4%'
-                },
-                {
-                    title: '病假',
-                    align: "center",
-                    dataIndex: 'medicalInsurance',
-                    ellipsis: true,
-                    width:'4%'
-                },
-                {
-                    title: '婚假',
-                    align: "center",
-                    dataIndex: 'accumulationFund',
-                    ellipsis: true,
-                    width:'4%'
-                },
-                {
-                    title: '丧假',
-                    align: "center",
-                    dataIndex: 'salaryDeduction',
+                    dataIndex: 'personalTax',
                     ellipsis: true,
-                    width:'4%'
-                },
-                {
-                    title: '合计应扣',
-                    align: "center",
-                    dataIndex: 'latenessTimes',
-                    ellipsis: true,
-                    width:'4%'
+                    width:'10%'
                 },
                 {
                     title: '实发合计',
                     align: "center",
-                    dataIndex: 'lateDeductionFees',
+                    dataIndex: 'actualOccurrence',
                     ellipsis: true,
-                    width:'4%'
+                    width:'10%'
                 },
              ]
           }
@@ -228,8 +146,24 @@
             handleCancel(){
                 this.visible = false
             },
+            detail(id){
+                this.formState = {}
+                this.formState.id = id
+                this.getTableList()
+            },
+            getTableList(){
+                this.loading = true
+                getAction('/salary/salaryManagement/querySalaryManagementHolidayListByMainId',this.formState).then(res=>{
+                    this.loading = false
+                    if(res.success){
+                        this.dataSource =res.result
+                    }else{
+                        this.$message.error(res.message);
+                    }
+                })
+            },
             searchSonList(){
-
+                this.getTableList()
             }
         }
     }

src/views/oa/salary_management/personnelSalary/modules/OvertimePayroll.vue

@@ -38,7 +38,7 @@
                     :columns="columns"
                     :data-source="dataSource"
                     :loading="loading"
-                    :scroll="{x: 3500 ,y:300}"
+                    :scroll="{x: 1000 ,y:400}"
                     :pagination="false"
                 >
                 </a-table>
@@ -53,13 +53,16 @@
       import { FormTypes } from '@/utils/JEditableTableUtil'
       import { putAction,getAction } from '@/api/manage'
       import JSearchSelectTag from '@/components/dict/JSearchSelectTag'
+      import JEllipsis from '@/components/jeecg/JEllipsis'
       export default {
         name: 'OvertimePayroll',
         components: {
             moment,
-            JSearchSelectTag
+            JSearchSelectTag,
+            JEllipsis
         },
         data() {
+          let ellipsis = (v, l) => <j-ellipsis value={v} length={l} />
           return {
               formState:{},
               dataSource: [{}],
@@ -69,7 +72,7 @@
                 {
                     title: '序号',
                     align:"center",
-                    width:'2%',
+                    width:'5%',
                     dataIndex: 'index',
                     customRender:function (t, r, index) {
                         return parseInt(index)+1;
@@ -79,120 +82,36 @@
                     title: '编号',
                     align: "center",
                     dataIndex: 'code',
-                    ellipsis: true,
-                    width:'4%'
+                    customRender: (t) => ellipsis(t,17),
+                    width:'10%'
                 },
                 {
                     title: '姓名',
                     align: "center",
                     dataIndex: 'name',
-                    ellipsis: true,
-                    width:'4%'
-                },
-                {
-                    title: '一月',
-                    align: "center",
-                    dataIndex: 'january',
-                    ellipsis: true,
-                    width:'4%'
-                },
-                {
-                    title: '二月',
-                    align: "center",
-                    dataIndex: 'february',
-                    ellipsis: true,
-                    width:'4%'
-                },
-                {
-                    title: '三月',
-                    align: "center",
-                    dataIndex: 'march',
-                    ellipsis: true,
-                    width:'4%'
-                },
-                {
-                    title: '四月',
-                    align: "center",
-                    dataIndex: 'april',
-                    ellipsis: true,
-                    width:'4%'
-                },
-                {
-                    title: '五月',
-                    align: "center",
-                    dataIndex: 'may',
-                    ellipsis: true,
-                    width:'4%'
-                },
-                {
-                    title: '六月',
-                    align: "center",
-                    dataIndex: 'june',
-                    ellipsis: true,
-                    width:'4%'
-                },
-                {
-                    title: '七月',
-                    align: "center",
-                    dataIndex: 'july',
-                    ellipsis: true,
-                    width:'4%'
-                },
-                {
-                    title: '八月',
-                    align: "center",
-                    dataIndex: 'august',
-                    ellipsis: true,
-                    width:'4%'
-                },
-                {
-                    title: '九月',
-                    align: "center",
-                    dataIndex: 'september',
-                    ellipsis: true,
-                    width:'4%'
-                },
-                {
-                    title: '十月',
-                    align: "center",
-                    dataIndex: 'october',
-                    ellipsis: true,
-                    width:'4%'
-                },
-                {
-                    title: '十一月',
-                    align: "center",
-                    dataIndex: 'november',
-                    ellipsis: true,
-                    width:'4%'
-                },
-                {
-                    title: '十二月',
-                    align: "center",
-                    dataIndex: 'december',
-                    ellipsis: true,
-                    width:'4%'
+                    customRender: (t) => ellipsis(t,17),
+                    width:'10%'
                 },
                 {
                     title: '加班工资',
                     align: "center",
                     dataIndex: 'workOvertimeCost',
                     ellipsis: true,
-                    width:'4%'
+                    width:'10%'
                 },
                 {
                     title: '个税',
                     align: "center",
                     dataIndex: 'personalTax',
                     ellipsis: true,
-                    width:'4%'
+                    width:'10%'
                 },
                 {
                     title: '实发合计',
                     align: "center",
                     dataIndex: 'actualOccurrence',
-                    ellipsis: true,
-                    width:'4%'
+                    customRender: (t) => ellipsis(t,10),
+                    width:'10%'
                 },
              ]
           }
@@ -218,6 +137,9 @@
                     this.loading = false
                     if(res.success){
                         this.dataSource =res.result
+                        this.dataSource.map(item=>{
+                            item.actualOccurrence = Number(item.actualOccurrence).toFixed(2)
+                        })
                     }else{
                         this.$message.error(res.message);
                     }

src/views/oa/salary_management/personnelSalary/modules/PayrollDetail.vue

@@ -2,7 +2,7 @@
     <div class="reply" ref = "replyModal">
       <a-modal
         title="月度工资单"
-        width="85%"
+        width="95%"
         :visible="visible"
         :confirmLoading="loading"
         :getContainer ='()=>$refs.replyModal'
@@ -38,7 +38,7 @@
                     :columns="columns"
                     :data-source="dataSource"
                     :loading="loading"
-                    :scroll="{x: 3500 ,y:300}"
+                    :scroll="{x: 2500 ,y:400}"
                     :pagination="false"
                 >
                 </a-table>
@@ -53,13 +53,16 @@
       import { FormTypes } from '@/utils/JEditableTableUtil'
       import { putAction,getAction } from '@/api/manage'
       import JSearchSelectTag from '@/components/dict/JSearchSelectTag'
+      import JEllipsis from '@/components/jeecg/JEllipsis'
       export default {
         name: 'PayrollDetail',
         components: {
             moment,
-            JSearchSelectTag
+            JSearchSelectTag,
+            JEllipsis
         },
         data() {
+          let ellipsis = (v, l) => <j-ellipsis value={v} length={l} />
           return {
               formState:{},
               dataSource: [{}],
@@ -80,6 +83,7 @@
                     align: "center",
                     dataIndex: 'code',
                     ellipsis: true,
+                    customRender: (t) => ellipsis(t,17),
                     width:'4%'
                 },
                 {
@@ -87,6 +91,7 @@
                     align: "center",
                     dataIndex: 'name',
                     ellipsis: true,
+                    customRender: (t) => ellipsis(t,5),
                     width:'4%'
                 },
                 {
@@ -94,105 +99,105 @@
                     align: "center",
                     dataIndex: 'wages',
                     ellipsis: true,
-                    width:'4%'
+                    width:'3%'
                 },
                 {
                     title: '话费补贴',
                     align: "center",
                     dataIndex: 'phoneBill',
                     ellipsis: true,
-                    width:'4%'
+                    width:'3%'
                 },
                 {
                     title: '午餐补贴',
                     align: "center",
                     dataIndex: 'lunch',
                     ellipsis: true,
-                    width:'4%'
+                    width:'3%'
                 },
                 {
                     title: '住房补贴',
                     align: "center",
                     dataIndex: 'housingSubsidies',
                     ellipsis: true,
-                    width:'4%'
+                    width:'3%'
                 },
                 {
                     title: '交通补贴',
                     align: "center",
                     dataIndex: 'transportation',
                     ellipsis: true,
-                    width:'4%'
+                    width:'3%'
                 },
                 {
                     title: '全勤奖',
                     align: "center",
                     dataIndex: 'fullAttendance',
                     ellipsis: true,
-                    width:'4%'
+                    width:'3%'
                 },
                 {
                     title: '合计应发',
                     align: "center",
                     dataIndex: 'totalPayable',
                     ellipsis: true,
-                    width:'4%'
+                    width:'3%'
                 },
                 {
                     title: '社保',
                     align: "center",
                     dataIndex: 'socialSecurity',
                     ellipsis: true,
-                    width:'4%'
+                    width:'3%'
                 },
                 {
                     title: '公积金',
                     align: "center",
                     dataIndex: 'accumulationFund',
                     ellipsis: true,
-                    width:'4%'
+                    width:'3%'
                 },
                 {
                     title: '个税',
                     align: "center",
                     dataIndex: 'personalTax',
                     ellipsis: true,
-                    width:'4%'
+                    width:'3%'
                 },
                 {
                     title: '迟到',
                     align: "center",
                     dataIndex: 'latenessCost',
                     ellipsis: true,
-                    width:'4%'
+                    width:'3%'
                 },
                 {
                     title: '事假',
                     align: "center",
                     dataIndex: 'personalCost',
                     ellipsis: true,
-                    width:'4%'
+                    width:'3%'
                 },
                 {
                     title: '病假',
                     align: "center",
                     dataIndex: 'sickCost',
                     ellipsis: true,
-                    width:'4%'
+                    width:'3%'
                 },
                 {
                     title: '婚假',
                     align: "center",
                     dataIndex: 'marriageCost',
                     ellipsis: true,
-                    width:'4%'
+                    width:'3%'
                 },
                 {
                     title: '丧假',
                     align: "center",
                     dataIndex: 'funeralCost',
                     ellipsis: true,
-                    width:'4%'
+                    width:'3%'
                 },
                 {
                     title: '合计应扣',
@@ -218,6 +223,7 @@
         methods: {
             handleCancel(){
                 this.visible = false
+                this.formState = {}
             },
             detail(id){
                 this.formState = {}

src/views/oa/salary_management/personnelSalary/modules/uploadModal.vue

@@ -14,27 +14,41 @@
                 <a-button  @click="handleOk" type="primary" style="margin-left: 8px;">确认</a-button>
             </template>
             <div class="table-page-search-wrapper">
-                <a-form-model layout="inline" ref="form" :model="formState" >
+                <a-form-model layout="inline" ref="form" :model="formState" :rules="validatorRules">
                     <a-row :gutter="24">
+                        <a-col :md="24">
+                            <a-form-model-item label="类型"  prop="type"  :labelCol="{offset: 4}">
+                                <a-select  v-model="formState.type" @change="changeType">
+                                    <a-select-option value="加班工资单">加班工资单</a-select-option>
+                                    <a-select-option value="年休工资单">年休工资单</a-select-option>
+                                    <a-select-option value="月度工资">月度工资</a-select-option>
+                                </a-select>
+                            </a-form-model-item>
+                        </a-col>
                         <a-col :md="24" >
-                            <a-form-model-item label="年月"  prop="name">
-                                <a-month-picker placeholder="请选择" v-model="formState.yearMonth" @change="onChange" style="width:100% !important"/>
+                            <a-form-model-item label="计算月份"  prop="yearWithMonth" :labelCol="{offset: 2}" v-if="formState.type=='加班工资单'||formState.type=='月度工资'">
+                                <a-month-picker placeholder="请选择" v-model="formState.yearWithMonth"  style="width:100% !important"/>
                             </a-form-model-item>
                         </a-col>
-                        <a-col :md="24">
-                            <a-form-model-item label="类型"  prop="totalNum">
-                                <a-select  v-model="formState.type">
-                                    <a-select-option value="加班费">加班费</a-select-option>
-                                    <a-select-option value="年休假补贴">年休假补贴</a-select-option>
-                                    <a-select-option value="月底工资">月底工资</a-select-option>
-                                </a-select>
+                        <a-col :md="24" >
+                            <a-form-model-item label="计算年份"  prop="yearWith" :labelCol="{offset: 2}" v-if="formState.type=='年休工资单'">
+                                <a-date-picker placeholder="请选择" :open="isopen" mode="year" v-model="formState.yearWith" format="YYYY" style="width:100% !important" @openChange="changeopen" @panelChange="handlePanelChange1"/>
                             </a-form-model-item>
                         </a-col>
-                        <a-col :md="24">
-                            <a-form-model-item label="文件" >
-                                <a-upload name="file" :multiple="false"  action="https://www.mocky.io/v2/5cc8019d300000980a055e76"  :headers="headers"   @change="handleChange" >
-                                    <a-button> <a-icon type="upload" /> 上  传 </a-button>
-                                </a-upload>
+                        <a-col :md="24" >
+                            <a-form-model-item label="加班月份区间"  prop="DateTime" v-if="formState.type=='加班工资单'">
+                                <a-range-picker
+                                    style="width: 100% !important"
+                                    v-model="formState.DateTime"
+                                    format="YYYY-MM"
+                                    valueFormat="YYYY-MM"
+                                    :mode="mode2"
+                                    :open="open"
+                                    :placeholder="['开始时间', '结束时间']"
+                                    @panelChange="handlePanelChange2"
+                                    @openChange="onDateChange"
+                                    @change="changeData"
+                                    />
                             </a-form-model-item>
                         </a-col>
                     </a-row>
@@ -48,7 +62,7 @@
       import moment from 'moment'
       import pick from 'lodash.pick'
       import { FormTypes } from '@/utils/JEditableTableUtil'
-      import { putAction,getAction } from '@/api/manage'
+      import { putAction,getAction,postAction } from '@/api/manage'
       export default {
         name: 'uploadModal',
         components: {
@@ -56,14 +70,25 @@
         },
         data() {
           return {
-              formState:{},
+              formState:{
+                type:'月度工资',
+                yearWithMonth:moment().subtract(1, 'months'),
+                DateTime:[],
+                yearWith:''
+              },
+              DateTime:[],
+              open: false,
+              isopen:false,
               dataSource: [{}],
+              mode2: ['month', 'month'],
               visible:false,
-              loading:false,
-              headers: {
-                authorization: 'authorization-text',
-             },
-            
+              loading:false,    
+              validatorRules: {
+                type: [{required: true, message: '请选择!' }],
+                yearWithMonth: [{required: true, message: '请选择!' }],
+                DateTime: [{required: true, message: '请选择!',trigger: 'change' }],
+                yearWith: [{required: true, message: '请选择!',trigger: 'change' }],
+              },           
           }
         },
         created(){
@@ -73,14 +98,89 @@
         methods: {
             handleCancel(){
                 this.visible = false
+                this.formState={
+                    type:'月度工资',
+                    yearWithMonth:moment().subtract(1, 'months')
+                }
+                // this.DateTime = []
+            },
+            changeType(data){
+                if(data=='月度工资'){
+                    this.formState={
+                        type:'月度工资',
+                        yearWithMonth:moment().subtract(1, 'months')
+                    }
+                }else if(data=='加班工资单'){
+                    this.formState={
+                        type:'加班工资单',
+                        yearWithMonth:moment().subtract(1, 'months'),
+                        DateTime:[]
+                    }
+                }else if(data=='年休工资单'){
+                    this.formState={
+                        type:'年休工资单',
+                        yearWith:''
+                    }
+                }
             },
             handleOk(){
+                this.$refs.form.validate((valid,err) => {
+                    if (valid) {
+                        if(this.formState.type=='加班工资单'){
+                            this.formState.beginMonth = moment(this.formState.DateTime[0]).format('YYYY-MM')
+                            this.formState.endMonth = moment(this.formState.DateTime[1]).format('YYYY-MM')
+                            delete this.formState.DateTime
+                        }
+                        if(this.formState.type=='加班工资单'||this.formState.type=='月度工资'){
+                            this.formState.yearWithMonth = moment(this.formState.yearWithMonth).format('YYYY-MM')
+                        }
+                        if(this.formState.type=='年休工资单'){
+                            this.formState.yearWith = moment(this.formState.yearWith).format('YYYY')
+                        }
+                        
+                        this.loading = true
+                        postAction('/salary/salaryManagement/generatePayroll', this.formState).then((res) => {
+                            if (res.success) {
+                                this.$message.success(res.message);
+                                this.handleCancel()
+                                this.$emit('ok')
+                            } else {
+                                this.$message.error(res.message);
+                            }   
+                        }).finally(() => {
+                            this.loading = false
+                        })
+                    }
+                })
 
             },
-            onChange(data){
+            changeData(value){
+                this.formState.DateTime = value
             },
-            handleChange(){
+            onDateChange(status) {
+                if(status){
+                    this.open = true;
+                }else{
+                    this.open = false
+                 }
+            },
+            handlePanelChange2(value,mode){
+                if (this.formState.DateTime[1] && this.formState.DateTime[1]._d != value[1]._d) {
+                    this.open = false;
+                    this.$refs.form.clearValidate();
+                }
+                this.formState.DateTime = value
+                this.mode2 = [mode[0] === 'date' ? 'month' : mode[0], mode[1] === 'date' ? 'month' : mode[1]];
+            },
+            handlePanelChange1(value){
+                this.isopen = false
+                this.formState.yearWith =value
 
+            },
+            changeopen(status){
+                if(status){
+                    this.isopen =  true
+                }
             }
         }
     }