chenrui 2 anos atrás
pai
commit
1e0b860326
1 arquivos alterados com 64 adições e 11 exclusões
  1. 64 11
      src/views/reportData/receivedSendStorageReport/index.vue

+ 64 - 11
src/views/reportData/receivedSendStorageReport/index.vue

@@ -5,15 +5,40 @@
         <a-row :gutter="15">
           <a-col :md="5" :sm="24">
             <a-form-item label="选择月份">
-              <a-range-picker
+              <div class="monthBox" style="display:flex;algin-item:center;">
+                <a-month-picker
+                  v-model="startMonthVal"
+                  :disabled-date="disabledStartDate"
+                  format="YYYY-MM"
+                  placeholder="开始月份"
+                  @openChange="handleStartOpenChange"
+                />
+                <span>~</span>
+                <a-month-picker
+                  v-model="endMonthVal"
+                  :disabled-date="disabledEndDate"
+                  format="YYYY-MM"
+                  placeholder="结束月份"
+                  :open="endOpen"
+                  @openChange="handleEndOpenChange"
+                />
+              </div>
+              <!-- <a-range-picker
                 :placeholder="['开始月份', '结束月份']"
                 format="YYYY-MM"
                 :value="monthVal"
-                :mode="['month','month']"
+                :ranges="{'上月':[moment().add(-1, 'M'),moment().add(-1, 'M')], '本月': [moment(), moment().endOf('month')] }"
+                :disabled-date="disabledDate"
+                :mode="['month', 'month']"
                 @panelChange="handlePanelChange"
                 @change="handleChange"
               >
-              </a-range-picker>
+                <template slot="renderExtraFooter">
+                  <a-button type="primary">
+                    确定
+                  </a-button>
+                </template>
+              </a-range-picker> -->
             </a-form-item>
           </a-col>
           <a-col :md="5" :sm="24">
@@ -80,12 +105,14 @@ import ProductBrand from '@/views/common/productBrand.js'
 import { STable, VSelect } from '@/components'
 import { productTypeQueryAll } from '@/api/productType'
 import gatherList from './list'
+import moment from 'moment'
 export default {
   name: 'PriceDifferenceDetailReportList',
   mixins: [commonMixin],
   components: { STable, VSelect, ProductBrand, gatherList },
   data () {
     return {
+      moment,
       queryParam: {
         name: '',
         queryWord: '',
@@ -96,18 +123,38 @@ export default {
       },
       productType: undefined,
       productTypeList: [],
-      monthVal: [],
       disabled: false,
-      tableHeight: 0
+      tableHeight: 0,
+      endOpen: false,
+      startMonthVal: undefined,
+      endMonthVal: undefined
     }
   },
   methods: {
-    handlePanelChange (value, mode) {
-      this.monthVal = value
+    // 选择月份限制
+    disabledStartDate (startValue) {
+      const endValue = this.endMonthVal
+      if (!startValue || !endValue) {
+        return startValue.valueOf() > this.moment().valueOf()
+      }
+      return startValue.valueOf() >= endValue.valueOf()
     },
-    handleChange (value) {
-      this.monthVal = value
+    disabledEndDate (endValue) {
+      const startValue = this.startMonthVal
+      if (!startValue) {
+        return endValue.valueOf() > this.moment().valueOf()
+      }
+      return endValue.valueOf() < startValue.valueOf() || endValue.valueOf() > this.moment().valueOf()
     },
+    handleStartOpenChange (open) {
+      if (!open) {
+        this.endOpen = true
+      }
+    },
+    handleEndOpenChange (open) {
+      this.endOpen = open
+    },
+
     //  产品分类  change
     changeProductType (val, opt) {
       this.queryParam.productTypeSn1 = val[0] ? val[0] : ''
@@ -128,7 +175,8 @@ export default {
 
     },
     searchForm () {
-
+      console.log('1111:', this.startMonthVal)
+      debugger
     },
     resetSearchForm () {
 
@@ -155,5 +203,10 @@ export default {
 
 </script>
 
-<style>
+<style lang="less" scoped>
+  .monthBox{
+    /deep/.ant-calendar-picker-icon{
+      display:none !important;
+    }
+  }
 </style>