Browse Source

开单销售单报表样式优化

chenrui 1 năm trước cách đây
mục cha
commit
f45a115ffc

+ 78 - 59
src/views/reportData/actualSalesReport/list.vue

@@ -1,8 +1,8 @@
 <template>
-  <a-card size="small" :bordered="false" class="actualSalesReportList-wrap">
-    <a-spin :spinning="spinning" tip="Loading...">
+  <div>
+    <a-card size="small" :bordered="false" class="actualSalesReportList-wrap searchBottomSpace">
       <!-- 搜索条件 -->
-      <div class="table-page-search-wrapper newTableSearchName">
+      <div class="table-page-search-wrapper newTableSearchName" ref="tableSearch">
         <a-form-model
           id="actualSalesReportList-form"
           ref="ruleForm"
@@ -33,16 +33,16 @@
                   allowClear></v-select>
               </a-form-model-item>
             </a-col>
-            
+
             <template v-if="advanced">
               <a-col :md="6" :sm="24">
-              <a-form-model-item label="所在区域">
-                <subarea id="actualSalesReportList-allocateTypeSn" ref="subarea" @change="subareaChange"></subarea>
-              </a-form-model-item>
-            </a-col>
-            <a-col :md="6" :sm="24">
+                <a-form-model-item label="所在区域">
+                  <subarea id="actualSalesReportList-allocateTypeSn" ref="subarea" @change="subareaChange"></subarea>
+                </a-form-model-item>
+              </a-col>
+              <a-col :md="6" :sm="24">
                 <a-form-model-item label="区域负责人">
-                    <BizUser v-model="queryParam.subareaArea.bizUserSn"></BizUser>
+                  <BizUser v-model="queryParam.subareaArea.bizUserSn"></BizUser>
                 </a-form-model-item>
               </a-col>
               <a-col :md="6" :sm="24">
@@ -71,43 +71,48 @@
           </a-row>
         </a-form-model>
       </div>
-      <!-- 列表 -->
-      <s-table
-        class="sTable"
-        ref="table"
-        size="small"
-        :rowKey="(record) => record.no"
-        rowKeyName="no"
-        :columns="columns"
-        :data="loadData"
-        :scroll="{ x: 2250 }"
-        :defaultLoadData="false"
-        bordered>
-        <template slot="footer" v-if="countLabel.length||countBrandLabel.length">
-          <a-row>
-            <a-col span="2">合计:</a-col>
-            <a-col span="22">
-              <a-row>
-                <a-col span="4" v-for="item in countLabel" :key="item.key">
-                  {{ item.title }}:{{ totalData?(totalData[item.dataIndex]||totalData[item.dataIndex]==0)?toThousands(totalData[item.dataIndex]):'--':'--' }}
-                </a-col>
-              </a-row>
-              <a-row>
-                <a-col span="24" style="padding:8px;"></a-col>
-              </a-row>
-              <a-row>
-                <a-col span="4" v-for="item in countBrandLabel" :key="item.key">
-                  {{ item.title }}:{{ totalData?(totalData[item.dataIndex] ||totalData[item.dataIndex]==0)?toThousands(totalData[item.dataIndex]):'--':'--' }}
-                </a-col>
-              </a-row>
-            </a-col>
-          </a-row>
-        </template>
-      </s-table>
-    </a-spin>
-    <!-- 导出提示框 -->
-    <reportModal :visible="showExport" @close="showExport=false"></reportModal>
-  </a-card>
+    </a-card>
+    <a-card size="small" :bordered="false">
+      <a-spin :spinning="spinning" tip="Loading...">
+        <!-- 列表 -->
+        <s-table
+          class="sTable"
+          ref="table"
+          size="small"
+          :rowKey="(record) => record.no"
+          rowKeyName="no"
+          :columns="columns"
+          :data="loadData"
+          :style="{ height: tableHeight+84.5+'px' }"
+          :scroll="{ x: 2250,y: tableHeight-126 }"
+          :defaultLoadData="false"
+          bordered>
+          <template slot="footer" v-if="countLabel.length||countBrandLabel.length">
+            <a-row>
+              <a-col span="2">合计:</a-col>
+              <a-col span="22">
+                <a-row>
+                  <a-col span="4" v-for="item in countLabel" :key="item.key">
+                    {{ item.title }}:{{ totalData?(totalData[item.dataIndex]||totalData[item.dataIndex]==0)?toThousands(totalData[item.dataIndex]):'--':'--' }}
+                  </a-col>
+                </a-row>
+                <a-row>
+                  <a-col span="24" style="padding:8px;"></a-col>
+                </a-row>
+                <a-row>
+                  <a-col span="4" v-for="item in countBrandLabel" :key="item.key">
+                    {{ item.title }}:{{ totalData?(totalData[item.dataIndex] ||totalData[item.dataIndex]==0)?toThousands(totalData[item.dataIndex]):'--':'--' }}
+                  </a-col>
+                </a-row>
+              </a-col>
+            </a-row>
+          </template>
+        </s-table>
+      </a-spin>
+      <!-- 导出提示框 -->
+      <reportModal :visible="showExport" @close="showExport=false"></reportModal>
+    </a-card>
+  </div>
 </template>
 
 <script>
@@ -140,7 +145,7 @@ export default {
         ],
         beginDate: getDate.getCurrMonthDays().starttime,
         endDate: getDate.getCurrMonthDays().endtime,
-        subareaArea:{
+        subareaArea: {
           subareaSn: undefined,
           subareaAreaSn: undefined,
           bizUserSn: undefined
@@ -162,9 +167,6 @@ export default {
       loadData: parameter => {
         this.disabled = true
         this.spinning = true
-        if (this.tableHeight == 0) {
-          this.tableHeight = window.innerHeight - 380
-        }
         const paramsPage = Object.assign(this.queryParam, { pageNo: parameter.pageNo, pageSize: parameter.pageSize }) //  有分页
         return salesBillRealAmountQueryPageList(paramsPage).then(res => {
           let data
@@ -184,7 +186,18 @@ export default {
       totalData: null,
       columns: [],
       countLabel: [],
-      countBrandLabel:[]
+      countBrandLabel: []
+    }
+  },
+  watch: {
+    advanced (newValue, oldValue) {
+      const _this = this
+      this.$nextTick(() => { // 页面渲染完成后的回调
+        _this.setTableH()
+      })
+    },
+    '$store.state.app.winHeight' (newValue, oldValue) { //  窗口变更时,需同时更改表格高度
+      this.setTableH()
     }
   },
   methods: {
@@ -263,9 +276,9 @@ export default {
         dealerLevel: undefined
       }
       this.queryParam.subareaArea = {
-          subareaSn: undefined,
-          subareaAreaSn: undefined,
-          bizUserSn: undefined
+        subareaSn: undefined,
+        subareaAreaSn: undefined,
+        bizUserSn: undefined
       }
       this.totalData = null
       if (this.advanced) {
@@ -286,33 +299,39 @@ export default {
       const _this = this
       const tableTitle = await salesBillRealReportTitle().then(res => res.data)
       this.columns = tableTitle.list
-      this.countLabel = tableTitle.count.filter(item => item.title.indexOf('品牌')<0)
-      this.countBrandLabel = tableTitle.count.filter(item => item.title.indexOf('品牌')>=0)
+      this.countLabel = tableTitle.count.filter(item => item.title.indexOf('品牌') < 0)
+      this.countBrandLabel = tableTitle.count.filter(item => item.title.indexOf('品牌') >= 0)
       this.columns.map(item => {
         let mw = 20
         if (item.customRender == 'amount') {
           mw = 15
           item.customRender = function (text) { return (text || text == 0) ? _this.toThousands(text) : '--' }
-        }else{
+        } else {
           item.customRender = function (text) { return text || '--' }
         }
         const w = item.title.length * mw
-        const tw = w <= 80 ? mw*5 : w
+        const tw = w <= 80 ? mw * 5 : w
         item.width = tw + 'px'
         this.tableWidth = this.tableWidth + tw
       })
       this.resetSearchForm()
+    },
+    setTableH () {
+      const tableSearchH = this.$refs.tableSearch.offsetHeight
+      this.tableHeight = window.innerHeight - tableSearchH - 230
     }
   },
   mounted () {
     if (!this.$store.state.app.isNewTab) { // 页签刷新时调用
       this.getTableTitle()
+      this.setTableH()
     }
   },
   activated () {
     // 如果是新页签打开,则重置当前页面
     if (this.$store.state.app.isNewTab) {
       this.getTableTitle()
+      this.setTableH()
     }
   },
   beforeRouteEnter (to, from, next) {

+ 75 - 56
src/views/reportData/salesAmountReport/list.vue

@@ -1,8 +1,8 @@
 <template>
-  <a-card size="small" :bordered="false" class="salesAmountReportList-wrap">
-    <a-spin :spinning="spinning" tip="Loading...">
+  <div>
+    <a-card size="small" :bordered="false" class="salesAmountReportList-wrap searchBottomSpace">
       <!-- 搜索条件 -->
-      <div class="table-page-search-wrapper newTableSearchName">
+      <div class="table-page-search-wrapper newTableSearchName" ref="tableSearch">
         <a-form-model
           id="salesAmountReportList-form"
           ref="ruleForm"
@@ -35,13 +35,13 @@
             </a-col>
             <template v-if="advanced">
               <a-col :md="6" :sm="24">
-              <a-form-model-item label="所在区域">
-                <subarea id="salesAmountReportList-allocateTypeSn" ref="subarea" @change="subareaChange"></subarea>
-              </a-form-model-item>
-            </a-col>
-            <a-col :md="6" :sm="24">
+                <a-form-model-item label="所在区域">
+                  <subarea id="salesAmountReportList-allocateTypeSn" ref="subarea" @change="subareaChange"></subarea>
+                </a-form-model-item>
+              </a-col>
+              <a-col :md="6" :sm="24">
                 <a-form-model-item label="区域负责人">
-                    <BizUser v-model="queryParam.subareaArea.bizUserSn"></BizUser>
+                  <BizUser v-model="queryParam.subareaArea.bizUserSn"></BizUser>
                 </a-form-model-item>
               </a-col>
               <a-col :md="6" :sm="24">
@@ -70,43 +70,48 @@
           </a-row>
         </a-form-model>
       </div>
-      <!-- 列表 -->
-      <s-table
-        class="sTable"
-        ref="table"
-        size="small"
-        :defaultLoadData="false"
-        :rowKey="(record) => record.no"
-        rowKeyName="no"
-        :columns="columns"
-        :data="loadData"
-        :scroll="{ x: 2250 }"
-        bordered>
-        <template slot="footer" v-if="countLabel.length||countBrandLabel.length">
-          <a-row>
-            <a-col span="2">合计:</a-col>
-            <a-col span="22">
-              <a-row>
-                <a-col span="4" v-for="item in countLabel" :key="item.key">
-                  {{ item.title }}:{{ totalData?(totalData[item.dataIndex]||totalData[item.dataIndex]==0)?toThousands(totalData[item.dataIndex]):'--':'--' }}
-                </a-col>
-              </a-row>
-              <a-row>
-                <a-col span="24" style="padding:8px;"></a-col>
-              </a-row>
-              <a-row>
-                <a-col span="4" v-for="item in countBrandLabel" :key="item.key">
-                  {{ item.title }}:{{ totalData?(totalData[item.dataIndex] ||totalData[item.dataIndex]==0)?toThousands(totalData[item.dataIndex]):'--':'--' }}
-                </a-col>
-              </a-row>
-            </a-col>
-          </a-row>
-        </template>
-      </s-table>
-    </a-spin>
-    <!-- 导出提示框 -->
-    <reportModal :visible="showExport" @close="showExport=false"></reportModal>
-  </a-card>
+    </a-card>
+    <a-card size="small" :bordered="false">
+      <a-spin :spinning="spinning" tip="Loading...">
+        <!-- 列表 -->
+        <s-table
+          class="sTable"
+          ref="table"
+          size="small"
+          :defaultLoadData="false"
+          :rowKey="(record) => record.no"
+          rowKeyName="no"
+          :columns="columns"
+          :data="loadData"
+          :style="{ height: tableHeight+84.5+'px' }"
+          :scroll="{ x: 2250 ,y: tableHeight-136 }"
+          bordered>
+          <template slot="footer" v-if="countLabel.length||countBrandLabel.length">
+            <a-row>
+              <a-col span="2">合计:</a-col>
+              <a-col span="22">
+                <a-row>
+                  <a-col span="4" v-for="item in countLabel" :key="item.key">
+                    {{ item.title }}:{{ totalData?(totalData[item.dataIndex]||totalData[item.dataIndex]==0)?toThousands(totalData[item.dataIndex]):'--':'--' }}
+                  </a-col>
+                </a-row>
+                <a-row>
+                  <a-col span="24" style="padding:8px;"></a-col>
+                </a-row>
+                <a-row>
+                  <a-col span="4" v-for="item in countBrandLabel" :key="item.key">
+                    {{ item.title }}:{{ totalData?(totalData[item.dataIndex] ||totalData[item.dataIndex]==0)?toThousands(totalData[item.dataIndex]):'--':'--' }}
+                  </a-col>
+                </a-row>
+              </a-col>
+            </a-row>
+          </template>
+        </s-table>
+      </a-spin>
+      <!-- 导出提示框 -->
+      <reportModal :visible="showExport" @close="showExport=false"></reportModal>
+    </a-card>
+  </div>
 </template>
 
 <script>
@@ -144,15 +149,15 @@ export default {
         citySn: undefined,
         districtSn: undefined,
         dealerLevel: undefined,
-        subareaArea:{
+        subareaArea: {
           subareaSn: undefined,
           subareaAreaSn: undefined,
           bizUserSn: undefined
-        },
+        }
       },
       columns: [],
       countLabel: [],
-      countBrandLabel:[],
+      countBrandLabel: [],
       rules: {
         'time': [{ required: true, message: '请选择销售日期', trigger: 'change' }]
       },
@@ -162,9 +167,6 @@ export default {
       loadData: parameter => {
         this.disabled = true
         this.spinning = true
-        if (this.tableHeight == 0) {
-          this.tableHeight = window.innerHeight - 380
-        }
         const paramsPage = Object.assign(this.queryParam, { pageNo: parameter.pageNo, pageSize: parameter.pageSize }) //  有分页
         return salesBillReportGroupByBuyerList(paramsPage).then(res => {
           let data
@@ -184,6 +186,17 @@ export default {
       totalData: null
     }
   },
+  watch: {
+    advanced (newValue, oldValue) {
+      const _this = this
+      this.$nextTick(() => { // 页面渲染完成后的回调
+        _this.setTableH()
+      })
+    },
+    '$store.state.app.winHeight' (newValue, oldValue) { //  窗口变更时,需同时更改表格高度
+      this.setTableH()
+    }
+  },
   methods: {
     //  导出
     handleExport () {
@@ -279,33 +292,39 @@ export default {
       const _this = this
       const tableTitle = await salesKdxxReportTitle().then(res => res.data)
       this.columns = tableTitle.list
-      this.countLabel = tableTitle.count.filter(item => item.title.indexOf('品牌')<0)
-      this.countBrandLabel = tableTitle.count.filter(item => item.title.indexOf('品牌')>=0)
+      this.countLabel = tableTitle.count.filter(item => item.title.indexOf('品牌') < 0)
+      this.countBrandLabel = tableTitle.count.filter(item => item.title.indexOf('品牌') >= 0)
       this.columns.map(item => {
         let mw = 20
         if (item.customRender == 'amount') {
           mw = 15
           item.customRender = function (text) { return (text || text == 0) ? _this.toThousands(text) : '--' }
-        }else{
+        } else {
           item.customRender = function (text) { return text || '--' }
         }
         const w = item.title.length * mw
-        const tw = w <= 80 ? mw*5 : w
+        const tw = w <= 80 ? mw * 5 : w
         item.width = tw + 'px'
         this.tableWidth = this.tableWidth + tw
       })
       this.resetSearchForm()
+    },
+    setTableH () {
+      const tableSearchH = this.$refs.tableSearch.offsetHeight
+      this.tableHeight = window.innerHeight - tableSearchH - 230
     }
   },
   mounted () {
     if (!this.$store.state.app.isNewTab) { // 页签刷新时调用
       this.getTableTitle()
+      this.setTableH()
     }
   },
   activated () {
     // 如果是新页签打开,则重置当前页面
     if (this.$store.state.app.isNewTab) {
       this.getTableTitle()
+      this.setTableH()
     }
   },
   beforeRouteEnter (to, from, next) {

+ 55 - 31
src/views/reportData/salesDetails/list.vue

@@ -1,8 +1,8 @@
 <template>
-  <a-card size="small" :bordered="false" class="salesDetailsList-wrap">
-    <a-spin :spinning="spinning" tip="Loading...">
+  <div>
+    <a-card size="small" :bordered="false" class="salesDetailsList-wrap searchBottomSpace">
       <!-- 搜索条件 -->
-      <div class="table-page-search-wrapper">
+      <div class="table-page-search-wrapper" ref="tableSearch">
         <a-form-model
           id="salesSlipReportList-form"
           ref="ruleForm"
@@ -123,34 +123,39 @@
           </a-row>
         </a-form-model>
       </div>
-      <!-- 列表 -->
-      <s-table
-        class="sTable"
-        ref="table"
-        size="small"
-        :rowKey="(record) => record.no"
-        rowKeyName="no"
-        :columns="columns"
-        :data="loadData"
-        :scroll="{ x: 2480 }"
-        :defaultLoadData="false"
-        bordered>
-        <template slot="footer">
-          <a-row :gutter="15">
-            <a-col :md="4" :sm="24">数量:{{ (totalData && (totalData.qty || totalData.qty==0)) ? totalData.qty : '--' }}</a-col>
-            <a-col :md="4" :sm="24" v-if="$hasPermissions('M_salesDetailsList_salesPrice')">实售价:{{ (totalData && (totalData.totalRealSaleAmount || totalData.totalRealSaleAmount==0)) ? toThousands(totalData.totalRealSaleAmount) : '--' }}</a-col>
-            <a-col :md="4" :sm="24" v-if="$hasPermissions('M_salesDetailsList_salesPrice')">开单价:{{ (totalData && (totalData.totalAmount || totalData.totalAmount==0)) ? toThousands(totalData.totalAmount) : '--' }}</a-col>
-            <a-col :md="4" :sm="24" v-if="$hasPermissions('M_salesDetailsList_costPrice')">成本:{{ (totalData && (totalData.totalRealCost || totalData.totalRealCost==0)) ? toThousands(totalData.totalRealCost) : '--' }}</a-col>
-            <a-col :md="4" :sm="24" v-if="$hasPermissions('M_salesDetailsList_salesPrice')">优惠金额:{{ (totalData && (totalData.discountAmount || totalData.discountAmount==0)) ? toThousands(totalData.discountAmount) : '--' }}</a-col>
-          <!--  <a-col :md="4" :sm="24" v-if="$hasPermissions('M_salesDetailsList_salesPrice')">折后金额:{{ (totalData && (totalData.discountedAmount || totalData.discountedAmount==0)) ? toThousands(totalData.discountedAmount) : '--' }}</a-col>
+    </a-card>
+    <a-card size="small" :bordered="false">
+      <a-spin :spinning="spinning" tip="Loading...">
+        <!-- 列表 -->
+        <s-table
+          class="sTable"
+          ref="table"
+          size="small"
+          :rowKey="(record) => record.no"
+          rowKeyName="no"
+          :columns="columns"
+          :data="loadData"
+          :style="{ height: tableHeight+84.5+'px' }"
+          :scroll="{ x: 2480 , y: tableHeight }"
+          :defaultLoadData="false"
+          bordered>
+          <template slot="footer">
+            <a-row :gutter="15">
+              <a-col :md="4" :sm="24">数量:{{ (totalData && (totalData.qty || totalData.qty==0)) ? totalData.qty : '--' }}</a-col>
+              <a-col :md="4" :sm="24" v-if="$hasPermissions('M_salesDetailsList_salesPrice')">实售价:{{ (totalData && (totalData.totalRealSaleAmount || totalData.totalRealSaleAmount==0)) ? toThousands(totalData.totalRealSaleAmount) : '--' }}</a-col>
+              <a-col :md="4" :sm="24" v-if="$hasPermissions('M_salesDetailsList_salesPrice')">开单价:{{ (totalData && (totalData.totalAmount || totalData.totalAmount==0)) ? toThousands(totalData.totalAmount) : '--' }}</a-col>
+              <a-col :md="4" :sm="24" v-if="$hasPermissions('M_salesDetailsList_costPrice')">成本:{{ (totalData && (totalData.totalRealCost || totalData.totalRealCost==0)) ? toThousands(totalData.totalRealCost) : '--' }}</a-col>
+              <a-col :md="4" :sm="24" v-if="$hasPermissions('M_salesDetailsList_salesPrice')">优惠金额:{{ (totalData && (totalData.discountAmount || totalData.discountAmount==0)) ? toThousands(totalData.discountAmount) : '--' }}</a-col>
+              <!--  <a-col :md="4" :sm="24" v-if="$hasPermissions('M_salesDetailsList_salesPrice')">折后金额:{{ (totalData && (totalData.discountedAmount || totalData.discountedAmount==0)) ? toThousands(totalData.discountedAmount) : '--' }}</a-col>
             <a-col :md="4" :sm="24" v-if="$hasPermissions('M_salesDetailsList_salesPrice')">折扣金额:{{ (totalData && (totalData.discountAmount || totalData.discountAmount==0)) ? toThousands(totalData.discountAmount) : '--' }}</a-col> -->
-          </a-row>
-        </template>
-      </s-table>
-    </a-spin>
-    <!-- 导出提示框 -->
-    <reportModal :visible="showExport" @close="showExport=false"></reportModal>
-  </a-card>
+            </a-row>
+          </template>
+        </s-table>
+      </a-spin>
+      <!-- 导出提示框 -->
+      <reportModal :visible="showExport" @close="showExport=false"></reportModal>
+    </a-card>
+  </div>
 </template>
 
 <script>
@@ -287,6 +292,17 @@ export default {
       return arr
     }
   },
+  watch: {
+    advanced (newValue, oldValue) {
+      const _this = this
+      this.$nextTick(() => { // 页面渲染完成后的回调
+        _this.setTableH()
+      })
+    },
+    '$store.state.app.winHeight' (newValue, oldValue) { //  窗口变更时,需同时更改表格高度
+      this.setTableH()
+    }
+  },
   methods: {
     // 盘点库存日期
     handleStock () {
@@ -398,7 +414,15 @@ export default {
       this.queryParam.dealerCountySn = val[2] ? val[2] : ''
     },
     pageInit () {
-      this.resetSearchForm()
+      const _this = this
+      this.$nextTick(() => { // 页面渲染完成后的回调
+        _this.setTableH()
+      })
+      _this.resetSearchForm()
+    },
+    setTableH () {
+      const tableSearchH = this.$refs.tableSearch.offsetHeight
+      this.tableHeight = window.innerHeight - tableSearchH - 230
     }
   },
   mounted () {

+ 348 - 75
src/views/reportData/salesOrderTotal/list.vue

@@ -1,8 +1,8 @@
 <template>
-  <a-card size="small" :bordered="false" class="salesOrderTotalList-wrap">
-    <a-spin :spinning="spinning" tip="Loading...">
+  <div>
+    <a-card size="small" :bordered="false" class="salesOrderTotalList-wrap searchBottomSpace">
       <!-- 搜索条件 -->
-      <div class="table-page-search-wrapper">
+      <div class="table-page-search-wrapper" ref="tableSearch">
         <a-form-model
           id="salesOrderTotalList-form"
           ref="ruleForm"
@@ -17,14 +17,22 @@
                 <rangeDate ref="rangeDate" :value="queryParam.time" @change="dateChange" />
               </a-form-model-item>
             </a-col>
-            <a-col :md="5" :sm="24">
+            <a-col :md="6" :sm="24">
               <a-form-model-item label="销售单号">
-                <a-input id="salesOrderTotalList-salesBillNo" v-model.trim="queryParam.salesBillNo" allowClear placeholder="请输入销售单号"/>
+                <a-input
+                  id="salesOrderTotalList-salesBillNo"
+                  v-model.trim="queryParam.salesBillNo"
+                  allowClear
+                  placeholder="请输入销售单号" />
               </a-form-model-item>
             </a-col>
-            <a-col :md="5" :sm="24">
+            <a-col :md="6" :sm="24">
               <a-form-model-item label="客户名称">
-                <a-input id="salesOrderTotalList-dealerName" v-model.trim="queryParam.dealerName" allowClear placeholder="请输入客户名称"/>
+                <a-input
+                  id="salesOrderTotalList-dealerName"
+                  v-model.trim="queryParam.dealerName"
+                  allowClear
+                  placeholder="请输入客户名称" />
               </a-form-model-item>
             </a-col>
             <template v-if="advanced">
@@ -49,30 +57,46 @@
                     :showSearch="true"
                     option-filter-prop="children"
                     :filter-option="filterOption">
-                    <a-select-option v-for="item in operatorList" :key="item.sn" :value="item.sn">{{ item.name }}</a-select-option>
+                    <a-select-option
+                      v-for="item in operatorList"
+                      :key="item.sn"
+                      :value="item.sn">{{ item.name }}</a-select-option>
                   </a-select>
                 </a-form-model-item>
               </a-col>
-              <a-col :md="5" :sm="24">
+              <a-col :md="6" :sm="24">
                 <a-form-model-item label="所在区域">
                   <subarea id="salesOrderTotalList-subareaSn" ref="subarea" @change="subareaChange"></subarea>
                 </a-form-model-item>
               </a-col>
-              <a-col :md="5" :sm="24">
+              <a-col :md="6" :sm="24">
                 <a-form-model-item label="地区" prop="dealerProvinceSn">
-                  <Area id="salesOrderTotalList-shippingAddrProvinceSn" defValKey="id" v-model="queryParam.dealerProvinceSn" placeholder="请选择省"></Area>
+                  <Area
+                    id="salesOrderTotalList-shippingAddrProvinceSn"
+                    defValKey="id"
+                    v-model="queryParam.dealerProvinceSn"
+                    placeholder="请选择省"></Area>
                 </a-form-model-item>
               </a-col>
             </template>
-            <a-col :md="8" :sm="24" style="margin-bottom: 10px;">
+            <a-col :md="6" :sm="24" style="margin-bottom: 10px;">
               <a-button
                 type="primary"
                 class="button-info"
                 size="small"
                 @click="handleStock"
                 id="salesOrderTotalList-stockDate">盘点区间日期</a-button>
-              <a-button style="margin-left: 5px" type="primary" @click="handleSearch" :disabled="disabled" id="salesOrderTotalList-refresh">查询</a-button>
-              <a-button style="margin-left: 8px" @click="resetSearchForm" :disabled="disabled" id="salesOrderTotalList-reset">重置</a-button>
+              <a-button
+                style="margin-left: 5px"
+                type="primary"
+                @click="handleSearch"
+                :disabled="disabled"
+                id="salesOrderTotalList-refresh">查询</a-button>
+              <a-button
+                style="margin-left: 8px"
+                @click="resetSearchForm"
+                :disabled="disabled"
+                id="salesOrderTotalList-reset">重置</a-button>
               <a-button
                 style="margin-left: 10px"
                 type="primary"
@@ -84,60 +108,106 @@
                 id="salesOrderTotalList-export">导出</a-button>
               <a @click="advanced=!advanced" style="margin-left: 5px">
                 {{ advanced ? '收起' : '展开' }}
-                <a-icon :type="advanced ? 'up' : 'down'"/>
+                <a-icon :type="advanced ? 'up' : 'down'" />
               </a>
             </a-col>
           </a-row>
         </a-form-model>
       </div>
-      <!-- 列表 -->
-      <s-table
-        class="sTable"
-        ref="table"
-        size="small"
-        :rowKey="(record) => record.salesBillNo"
-        rowKeyName="salesBillNo"
-        :columns="columns"
-        :data="loadData"
-        :scroll="{ x: 1990 }"
-        :defaultLoadData="false"
-        bordered>
-        <template slot="footer">
-          <a-row :gutter="15">
-            <a-col :md="4" :sm="24">数量:{{ (totalData && (totalData.totalQty || totalData.totalQty==0)) ? totalData.totalQty : '--' }}</a-col>
-            <a-col :md="4" :sm="24" v-if="$hasPermissions('M_salesOrderTotalList_salesPrice')">实售价:{{ (totalData && (totalData.totalRealSaleAmount || totalData.totalRealSaleAmount==0)) ? toThousands(totalData.totalRealSaleAmount) : '--' }}</a-col>
-            <a-col :md="4" :sm="24" v-if="$hasPermissions('M_salesOrderTotalList_salesPrice')">开单价:{{ (totalData && (totalData.totalAmount || totalData.totalAmount==0)) ? toThousands(totalData.totalAmount) : '--' }}</a-col>
-            <a-col :md="4" :sm="24" v-if="$hasPermissions('M_salesOrderTotalList_costPrice')">成本:{{ (totalData && (totalData.totalCost || totalData.totalCost==0)) ? toThousands(totalData.totalCost) : '--' }}</a-col>
-            <a-col :md="4" :sm="24" v-if="$hasPermissions('M_salesOrderTotalList_costPrice')&&$hasPermissions('M_salesOrderTotalList_salesPrice')">毛利:{{ (totalData && (totalData.grossProfit || totalData.grossProfit==0)) ? toThousands(totalData.grossProfit) : '--' }}</a-col>
-            <a-col :md="4" :sm="24" v-if="$hasPermissions('M_salesOrderTotalList_salesPrice')">返利:{{ (totalData && (totalData.rebateAmount || totalData.rebateAmount==0)) ? toThousands(totalData.rebateAmount) : '--' }}</a-col>
-            <a-col :md="4" :sm="24" v-if="$hasPermissions('M_salesOrderTotalList_salesPrice')">优惠金额:{{ (totalData && (totalData.discountAmount || totalData.discountAmount==0)) ? toThousands(totalData.discountAmount) : '--' }}</a-col>
-            <!-- <a-col :md="4" :sm="24" v-if="$hasPermissions('M_salesOrderTotalList_salesPrice')">折扣金额:{{ (totalData && (totalData.totalDiscountAmount || totalData.totalDiscountAmount==0)) ? toThousands(totalData.totalDiscountAmount) : '--' }}</a-col>
+    </a-card>
+    <a-card size="small" :bordered="false">
+      <a-spin :spinning="spinning" tip="Loading...">
+        <!-- 列表 -->
+        <s-table
+          class="sTable"
+          ref="table"
+          size="small"
+          :rowKey="(record) => record.salesBillNo"
+          :style="{ height: tableHeight+84.5+'px' }"
+          rowKeyName="salesBillNo"
+          :columns="columns"
+          :data="loadData"
+          :scroll="{ x: 1990, y: tableHeight-32 }"
+          :defaultLoadData="false"
+          bordered>
+          <template slot="footer">
+            <a-row :gutter="15">
+              <a-col
+                :md="4"
+                :sm="24">数量:{{ (totalData && (totalData.totalQty || totalData.totalQty==0)) ? totalData.totalQty : '--' }}</a-col>
+              <a-col
+                :md="4"
+                :sm="24"
+                v-if="$hasPermissions('M_salesOrderTotalList_salesPrice')">实售价:{{ (totalData && (totalData.totalRealSaleAmount || totalData.totalRealSaleAmount==0)) ? toThousands(totalData.totalRealSaleAmount) : '--' }}</a-col>
+              <a-col
+                :md="4"
+                :sm="24"
+                v-if="$hasPermissions('M_salesOrderTotalList_salesPrice')">开单价:{{ (totalData && (totalData.totalAmount || totalData.totalAmount==0)) ? toThousands(totalData.totalAmount) : '--' }}</a-col>
+              <a-col
+                :md="4"
+                :sm="24"
+                v-if="$hasPermissions('M_salesOrderTotalList_costPrice')">成本:{{ (totalData && (totalData.totalCost || totalData.totalCost==0)) ? toThousands(totalData.totalCost) : '--' }}</a-col>
+              <a-col
+                :md="4"
+                :sm="24"
+                v-if="$hasPermissions('M_salesOrderTotalList_costPrice')&&$hasPermissions('M_salesOrderTotalList_salesPrice')">毛利:{{ (totalData && (totalData.grossProfit || totalData.grossProfit==0)) ? toThousands(totalData.grossProfit) : '--' }}</a-col>
+              <a-col
+                :md="4"
+                :sm="24"
+                v-if="$hasPermissions('M_salesOrderTotalList_salesPrice')">返利:{{ (totalData && (totalData.rebateAmount || totalData.rebateAmount==0)) ? toThousands(totalData.rebateAmount) : '--' }}</a-col>
+              <a-col
+                :md="4"
+                :sm="24"
+                v-if="$hasPermissions('M_salesOrderTotalList_salesPrice')">优惠金额:{{ (totalData && (totalData.discountAmount || totalData.discountAmount==0)) ? toThousands(totalData.discountAmount) : '--' }}</a-col>
+              <!-- <a-col :md="4" :sm="24" v-if="$hasPermissions('M_salesOrderTotalList_salesPrice')">折扣金额:{{ (totalData && (totalData.totalDiscountAmount || totalData.totalDiscountAmount==0)) ? toThousands(totalData.totalDiscountAmount) : '--' }}</a-col>
             <a-col :md="4" :sm="24" v-if="$hasPermissions('M_salesOrderTotalList_salesPrice')">折后金额:{{ (totalData && (totalData.totalDiscountedAmount || totalData.totalDiscountedAmount==0)) ? toThousands(totalData.totalDiscountedAmount) : '--' }}</a-col> -->
-          </a-row>
-        </template>
-      </s-table>
-    </a-spin>
-    <!-- 导出提示框 -->
-    <reportModal :visible="showExport" @close="showExport=false"></reportModal>
-  </a-card>
+            </a-row>
+          </template>
+        </s-table>
+      </a-spin>
+      <!-- 导出提示框 -->
+      <reportModal :visible="showExport" @close="showExport=false"></reportModal>
+    </a-card>
+  </div>
 </template>
 
 <script>
-import { commonMixin } from '@/utils/mixin'
+import {
+  commonMixin
+} from '@/utils/mixin'
 import getDate from '@/libs/getDate.js'
-import { STable, VSelect } from '@/components'
+import {
+  STable,
+  VSelect
+} from '@/components'
 import rangeDate from '@/views/common/rangeDate.vue'
 import subarea from '@/views/common/subarea.js'
 import custList from '@/views/common/custList.vue'
 import reportModal from '@/views/common/reportModal.vue'
 import Area from '@/views/common/area.js'
-import { hdExportExcel } from '@/libs/exportExcel'
-import { userQueryList } from '@/api/power-user'
-import { reportSalesBillList, reportSalesBillCount, reportSalesBillExport } from '@/api/reportData'
+import {
+  hdExportExcel
+} from '@/libs/exportExcel'
+import {
+  userQueryList
+} from '@/api/power-user'
+import {
+  reportSalesBillList,
+  reportSalesBillCount,
+  reportSalesBillExport
+} from '@/api/reportData'
 export default {
   name: 'SalesOrderTotalList',
   mixins: [commonMixin],
-  components: { STable, VSelect, rangeDate, custList, subarea, reportModal, Area },
+  components: {
+    STable,
+    VSelect,
+    rangeDate,
+    custList,
+    subarea,
+    reportModal,
+    Area
+  },
   data () {
     return {
       spinning: false,
@@ -162,7 +232,11 @@ export default {
         dealerProvinceSn: undefined
       },
       rules: {
-        'time': [{ required: true, message: '请选择销售日期', trigger: 'change' }]
+        'time': [{
+          required: true,
+          message: '请选择销售日期',
+          trigger: 'change'
+        }]
       },
       disabled: false, //  查询、重置按钮是否可操作
       exportLoading: false,
@@ -194,16 +268,91 @@ export default {
   computed: {
     columns () {
       const _this = this
-      const arr = [
-        { title: '销售单号', dataIndex: 'salesBillNo', width: 160, align: 'center', customRender: function (text) { return text || '--' } },
-        { title: '开单日期', dataIndex: 'createDate', width: 130, align: 'center', customRender: function (text) { return text || '--' } },
-        { title: '销售日期', dataIndex: 'auditDate', width: 130, align: 'center', customRender: function (text) { return text || '--' } },
-        { title: '客户名称', dataIndex: 'dealerName', width: 120, align: 'center', customRender: function (text) { return text || '--' }, ellipsis: true },
-        { title: '客户级别', dataIndex: 'dealerLevelDictValue', width: 120, align: 'center', customRender: function (text) { return text || '--' }, ellipsis: true },
-        { title: '直接绑定客户名称', dataIndex: 'directDealerName', width: 120, align: 'center', customRender: function (text) { return text || '--' }, ellipsis: true },
-        { title: '间接绑定客户名称', dataIndex: 'indirectDealerName', width: 120, align: 'center', customRender: function (text) { return text || '--' }, ellipsis: true },
-        { title: '总数量', dataIndex: 'totalQty', width: 70, align: 'center', customRender: function (text) { return ((text || text == 0) ? text : '--') } },
-        { title: '数量(促)', dataIndex: 'giftQty', width: 70, align: 'center', customRender: function (text) { return ((text || text == 0) ? text : '--') } }
+      const arr = [{
+        title: '销售单号',
+        dataIndex: 'salesBillNo',
+        width: 160,
+        align: 'center',
+        customRender: function (text) {
+          return text || '--'
+        }
+      },
+      {
+        title: '开单日期',
+        dataIndex: 'createDate',
+        width: 130,
+        align: 'center',
+        customRender: function (text) {
+          return text || '--'
+        }
+      },
+      {
+        title: '销售日期',
+        dataIndex: 'auditDate',
+        width: 130,
+        align: 'center',
+        customRender: function (text) {
+          return text || '--'
+        }
+      },
+      {
+        title: '客户名称',
+        dataIndex: 'dealerName',
+        width: 120,
+        align: 'center',
+        customRender: function (text) {
+          return text || '--'
+        },
+        ellipsis: true
+      },
+      {
+        title: '客户级别',
+        dataIndex: 'dealerLevelDictValue',
+        width: 120,
+        align: 'center',
+        customRender: function (text) {
+          return text || '--'
+        },
+        ellipsis: true
+      },
+      {
+        title: '直接绑定客户名称',
+        dataIndex: 'directDealerName',
+        width: 120,
+        align: 'center',
+        customRender: function (text) {
+          return text || '--'
+        },
+        ellipsis: true
+      },
+      {
+        title: '间接绑定客户名称',
+        dataIndex: 'indirectDealerName',
+        width: 120,
+        align: 'center',
+        customRender: function (text) {
+          return text || '--'
+        },
+        ellipsis: true
+      },
+      {
+        title: '总数量',
+        dataIndex: 'totalQty',
+        width: 70,
+        align: 'center',
+        customRender: function (text) {
+          return ((text || text == 0) ? text : '--')
+        }
+      },
+      {
+        title: '数量(促)',
+        dataIndex: 'giftQty',
+        width: 70,
+        align: 'center',
+        customRender: function (text) {
+          return ((text || text == 0) ? text : '--')
+        }
+      }
         // { title: '实售价', dataIndex: 'totalRealSaleAmount', width: 70, align: 'center', customRender: function (text) { return ((text || text == 0) ? text : '--') } },
         // { title: '开单价', dataIndex: 'totalAmount', width: 70, align: 'center', customRender: function (text) { return ((text || text == 0) ? text : '--') } },
         // { title: '成本价', dataIndex: 'totalCost', width: 70, align: 'center', customRender: function (text) { return ((text || text == 0) ? text : '--') } },
@@ -219,37 +368,153 @@ export default {
 
       ]
       if (this.$hasPermissions('M_salesOrderTotalList_salesPrice')) {
-        arr.push({ title: '实售价', dataIndex: 'totalRealSaleAmount', width: 70, align: 'right', customRender: function (text) { return ((text || text == 0) ? _this.toThousands(text) : '--') } })
-        arr.push({ title: '开单价', dataIndex: 'totalAmount', width: 70, align: 'right', customRender: function (text) { return ((text || text == 0) ? _this.toThousands(text) : '--') } })
+        arr.push({
+          title: '实售价',
+          dataIndex: 'totalRealSaleAmount',
+          width: 70,
+          align: 'right',
+          customRender: function (text) {
+            return ((text || text == 0) ? _this.toThousands(text) : '--')
+          }
+        })
+        arr.push({
+          title: '开单价',
+          dataIndex: 'totalAmount',
+          width: 70,
+          align: 'right',
+          customRender: function (text) {
+            return ((text || text == 0) ? _this.toThousands(text) : '--')
+          }
+        })
       }
       if (this.$hasPermissions('M_salesOrderTotalList_costPrice')) { //  成本价权限
-        arr.push({ title: '成本价', dataIndex: 'totalCost', width: 70, align: 'right', customRender: function (text) { return ((text || text == 0) ? _this.toThousands(text) : '--') } })
-        arr.push({ title: '成本价(促)', dataIndex: 'totalGiftCost', width: 90, align: 'right', customRender: function (text) { return ((text || text == 0) ? _this.toThousands(text) : '--') } })
+        arr.push({
+          title: '成本价',
+          dataIndex: 'totalCost',
+          width: 70,
+          align: 'right',
+          customRender: function (text) {
+            return ((text || text == 0) ? _this.toThousands(text) : '--')
+          }
+        })
+        arr.push({
+          title: '成本价(促)',
+          dataIndex: 'totalGiftCost',
+          width: 90,
+          align: 'right',
+          customRender: function (text) {
+            return ((text || text == 0) ? _this.toThousands(text) : '--')
+          }
+        })
         if (this.$hasPermissions('M_salesOrderTotalList_salesPrice')) {
-          arr.push({ title: '毛利', dataIndex: 'grossProfit', width: 70, align: 'right', customRender: function (text) { return ((text || text == 0) ? _this.toThousands(text) : '--') } })
+          arr.push({
+            title: '毛利',
+            dataIndex: 'grossProfit',
+            width: 70,
+            align: 'right',
+            customRender: function (text) {
+              return ((text || text == 0) ? _this.toThousands(text) : '--')
+            }
+          })
         }
       }
       if (this.$hasPermissions('M_salesOrderTotalList_provincePrice')) {
-        arr.push({ title: '省级价', dataIndex: 'totalProvinceAmount', width: 70, align: 'right', customRender: function (text) { return ((text || text == 0) ? _this.toThousands(text) : '--') } })
+        arr.push({
+          title: '省级价',
+          dataIndex: 'totalProvinceAmount',
+          width: 70,
+          align: 'right',
+          customRender: function (text) {
+            return ((text || text == 0) ? _this.toThousands(text) : '--')
+          }
+        })
       }
       if (this.$hasPermissions('M_salesOrderTotalList_cityPrice')) {
-        arr.push({ title: '市级价', dataIndex: 'totalCityAmount', width: 70, align: 'right', customRender: function (text) { return ((text || text == 0) ? _this.toThousands(text) : '--') } })
+        arr.push({
+          title: '市级价',
+          dataIndex: 'totalCityAmount',
+          width: 70,
+          align: 'right',
+          customRender: function (text) {
+            return ((text || text == 0) ? _this.toThousands(text) : '--')
+          }
+        })
       }
       if (this.$hasPermissions('M_salesOrderTotalList_specialPrice')) {
-        arr.push({ title: '特约加盟店价', dataIndex: 'totalSpecialAmount', width: 90, align: 'right', customRender: function (text) { return ((text || text == 0) ? _this.toThousands(text) : '--') } })
+        arr.push({
+          title: '特约加盟店价',
+          dataIndex: 'totalSpecialAmount',
+          width: 90,
+          align: 'right',
+          customRender: function (text) {
+            return ((text || text == 0) ? _this.toThousands(text) : '--')
+          }
+        })
       }
       if (this.$hasPermissions('M_salesOrderTotalList_salesPrice')) {
-        arr.push({ title: '直接差价', dataIndex: 'directRebateAmount', width: 70, align: 'right', customRender: function (text) { return ((text || text == 0) ? _this.toThousands(text) : '--') } })
-        arr.push({ title: '间接差价', dataIndex: 'indirectRebateAmount', width: 70, align: 'right', customRender: function (text) { return ((text || text == 0) ? _this.toThousands(text) : '--') } })
-        arr.push({ title: '返利', dataIndex: 'rebateAmount', width: 70, align: 'right', customRender: function (text) { return ((text || text == 0) ? _this.toThousands(text) : '--') } })
-        arr.push({ title: '优惠金额', dataIndex: 'discountAmount', width: 70, align: 'right', customRender: function (text) { return ((text || text == 0) ? _this.toThousands(text) : '--') } })
+        arr.push({
+          title: '直接差价',
+          dataIndex: 'directRebateAmount',
+          width: 70,
+          align: 'right',
+          customRender: function (text) {
+            return ((text || text == 0) ? _this.toThousands(text) : '--')
+          }
+        })
+        arr.push({
+          title: '间接差价',
+          dataIndex: 'indirectRebateAmount',
+          width: 70,
+          align: 'right',
+          customRender: function (text) {
+            return ((text || text == 0) ? _this.toThousands(text) : '--')
+          }
+        })
+        arr.push({
+          title: '返利',
+          dataIndex: 'rebateAmount',
+          width: 70,
+          align: 'right',
+          customRender: function (text) {
+            return ((text || text == 0) ? _this.toThousands(text) : '--')
+          }
+        })
+        arr.push({
+          title: '优惠金额',
+          dataIndex: 'discountAmount',
+          width: 70,
+          align: 'right',
+          customRender: function (text) {
+            return ((text || text == 0) ? _this.toThousands(text) : '--')
+          }
+        })
         // arr.push({ title: '折扣金额', dataIndex: 'totalDiscountAmount', width: 70, align: 'right', customRender: function (text) { return ((text || text == 0) ? _this.toThousands(text) : '--') } })
         // arr.push({ title: '折后金额', dataIndex: 'totalDiscountedAmount', width: 70, align: 'right', customRender: function (text) { return ((text || text == 0) ? _this.toThousands(text) : '--') } })
       }
-      arr.push({ title: '操作员', dataIndex: 'operatorName', width: 100, align: 'center', customRender: function (text) { return text || '--' }, ellipsis: true })
+      arr.push({
+        title: '操作员',
+        dataIndex: 'operatorName',
+        width: 100,
+        align: 'center',
+        customRender: function (text) {
+          return text || '--'
+        },
+        ellipsis: true
+      })
       return arr
     }
   },
+  watch: {
+    advanced (newValue, oldValue) {
+      const _this = this
+      this.$nextTick(() => { // 页面渲染完成后的回调
+        _this.setTableH()
+      })
+    },
+    '$store.state.app.winHeight' (newValue, oldValue) { //  窗口变更时,需同时更改表格高度
+      this.setTableH()
+    }
+  },
   methods: {
     // 盘点库存日期
     handleStock () {
@@ -352,7 +617,15 @@ export default {
       })
     },
     pageInit () {
-      this.getUserList()
+      const _this = this
+      _this.getUserList()
+      this.$nextTick(() => { // 页面渲染完成后的回调
+        _this.setTableH()
+      })
+    },
+    setTableH () {
+      const tableSearchH = this.$refs.tableSearch.offsetHeight
+      this.tableHeight = window.innerHeight - tableSearchH - 236
     }
   },
   mounted () {

+ 73 - 55
src/views/reportData/salesSlipReport/list.vue

@@ -1,8 +1,8 @@
 <template>
-  <a-card size="small" :bordered="false" class="salesSlipReportList-wrap">
-    <a-spin :spinning="spinning" tip="Loading...">
+  <div>
+    <a-card size="small" :bordered="false" class="salesSlipReportList-wrap searchBottomSpace">
       <!-- 搜索条件 -->
-      <div class="table-page-search-wrapper newTableSearchName">
+      <div class="table-page-search-wrapper newTableSearchName" ref="tableSearch">
         <a-form-model
           id="salesSlipReportList-form"
           ref="ruleForm"
@@ -33,13 +33,12 @@
                   allowClear></v-select>
               </a-form-model-item>
             </a-col>
-            
             <template v-if="advanced">
               <a-col :md="6" :sm="24">
-              <a-form-model-item label="销售单号">
-                <a-input id="salesSlipReportList-allocateTypeSn" v-model.trim="queryParam.salesBillNo" allowClear placeholder="请输入销售单号"/>
-              </a-form-model-item>
-            </a-col>
+                <a-form-model-item label="销售单号">
+                  <a-input id="salesSlipReportList-allocateTypeSn" v-model.trim="queryParam.salesBillNo" allowClear placeholder="请输入销售单号"/>
+                </a-form-model-item>
+              </a-col>
               <a-col :md="6" :sm="24">
                 <a-form-model-item label="所在区域">
                   <subarea id="salesSlipReportList-allocateTypeSn" ref="subarea" @change="subareaChange"></subarea>
@@ -47,7 +46,7 @@
               </a-col>
               <a-col :md="6" :sm="24">
                 <a-form-model-item label="区域负责人">
-                    <BizUser v-model="queryParam.subareaArea.bizUserSn"></BizUser>
+                  <BizUser v-model="queryParam.subareaArea.bizUserSn"></BizUser>
                 </a-form-model-item>
               </a-col>
               <a-col :md="6" :sm="24">
@@ -76,43 +75,48 @@
           </a-row>
         </a-form-model>
       </div>
-      <!-- 列表 -->
-      <s-table
-        class="sTable"
-        ref="table"
-        size="small"
-        :defaultLoadData="false"
-        :rowKey="(record) => record.no"
-        rowKeyName="no"
-        :columns="columns"
-        :data="loadData"
-        :scroll="{ x: 2410 }"
-        bordered>
-        <template slot="footer" v-if="countLabel.length||countBrandLabel.length">
-          <a-row>
-            <a-col span="2">合计:</a-col>
-            <a-col span="22">
-              <a-row>
-                <a-col span="4" v-for="item in countLabel" :key="item.key">
-                  {{ item.title }}:{{ totalData?(totalData[item.dataIndex]||totalData[item.dataIndex]==0)?toThousands(totalData[item.dataIndex]):'--':'--' }}
-                </a-col>
-              </a-row>
-              <a-row>
-                <a-col span="24" style="padding:8px;"></a-col>
-              </a-row>
-              <a-row>
-                <a-col span="4" v-for="item in countBrandLabel" :key="item.key">
-                  {{ item.title }}:{{ totalData?(totalData[item.dataIndex] ||totalData[item.dataIndex]==0)?toThousands(totalData[item.dataIndex]):'--':'--' }}
-                </a-col>
-              </a-row>
-            </a-col>
-          </a-row>
-        </template>
-      </s-table>
-    </a-spin>
-    <!-- 导出提示框 -->
-    <reportModal :visible="showExport" @close="showExport=false"></reportModal>
-  </a-card>
+    </a-card>
+    <a-card size="small" :bordered="false">
+      <a-spin :spinning="spinning" tip="Loading...">
+        <!-- 列表 -->
+        <s-table
+          class="sTable"
+          ref="table"
+          size="small"
+          :defaultLoadData="false"
+          :rowKey="(record) => record.no"
+          rowKeyName="no"
+          :columns="columns"
+          :data="loadData"
+          :style="{ height: tableHeight+84.5+'px' }"
+          :scroll="{ x: 2410,y: tableHeight-136 }"
+          bordered>
+          <template slot="footer" v-if="countLabel.length||countBrandLabel.length">
+            <a-row>
+              <a-col span="2">合计:</a-col>
+              <a-col span="22">
+                <a-row>
+                  <a-col span="4" v-for="item in countLabel" :key="item.key">
+                    {{ item.title }}:{{ totalData?(totalData[item.dataIndex]||totalData[item.dataIndex]==0)?toThousands(totalData[item.dataIndex]):'--':'--' }}
+                  </a-col>
+                </a-row>
+                <a-row>
+                  <a-col span="24" style="padding:8px;"></a-col>
+                </a-row>
+                <a-row>
+                  <a-col span="4" v-for="item in countBrandLabel" :key="item.key">
+                    {{ item.title }}:{{ totalData?(totalData[item.dataIndex] ||totalData[item.dataIndex]==0)?toThousands(totalData[item.dataIndex]):'--':'--' }}
+                  </a-col>
+                </a-row>
+              </a-col>
+            </a-row>
+          </template>
+        </s-table>
+      </a-spin>
+      <!-- 导出提示框 -->
+      <reportModal :visible="showExport" @close="showExport=false"></reportModal>
+    </a-card>
+  </div>
 </template>
 
 <script>
@@ -150,7 +154,7 @@ export default {
         provinceSn: undefined,
         citySn: undefined,
         districtSn: undefined,
-        subareaArea:{
+        subareaArea: {
           subareaSn: undefined,
           subareaAreaSn: undefined,
           bizUserSn: undefined
@@ -159,7 +163,7 @@ export default {
       },
       columns: [],
       countLabel: [],
-      countBrandLabel:[],
+      countBrandLabel: [],
       rules: {
         'time': [{ required: true, message: '请选择销售日期', trigger: 'change' }]
       },
@@ -169,9 +173,6 @@ export default {
       loadData: parameter => {
         this.disabled = true
         this.spinning = true
-        if (this.tableHeight == 0) {
-          this.tableHeight = window.innerHeight - 380
-        }
         const paramsPage = Object.assign(this.queryParam, { pageNo: parameter.pageNo, pageSize: parameter.pageSize }) //  有分页
         return salesBillReportList(paramsPage).then(res => {
           let data
@@ -191,6 +192,17 @@ export default {
       totalData: null
     }
   },
+  watch: {
+    advanced (newValue, oldValue) {
+      const _this = this
+      this.$nextTick(() => { // 页面渲染完成后的回调
+        _this.setTableH()
+      })
+    },
+    '$store.state.app.winHeight' (newValue, oldValue) { //  窗口变更时,需同时更改表格高度
+      this.setTableH()
+    }
+  },
   methods: {
     //  导出
     handleExport () {
@@ -287,33 +299,39 @@ export default {
       const _this = this
       const tableTitle = await salesKdxxdReportTitle().then(res => res.data)
       this.columns = tableTitle.list
-      this.countLabel = tableTitle.count.filter(item => item.title.indexOf('品牌')<0)
-      this.countBrandLabel = tableTitle.count.filter(item => item.title.indexOf('品牌')>=0)
+      this.countLabel = tableTitle.count.filter(item => item.title.indexOf('品牌') < 0)
+      this.countBrandLabel = tableTitle.count.filter(item => item.title.indexOf('品牌') >= 0)
       this.columns.map(item => {
         let mw = 20
         if (item.customRender == 'amount') {
           mw = 15
           item.customRender = function (text) { return (text || text == 0) ? _this.toThousands(text) : '--' }
-        }else{
+        } else {
           item.customRender = function (text) { return text || '--' }
         }
         const w = item.title.length * mw
-        const tw = w <= 80 ? mw*5 : w
+        const tw = w <= 80 ? mw * 5 : w
         item.width = tw + 'px'
         this.tableWidth = this.tableWidth + tw
       })
       this.resetSearchForm()
+    },
+    setTableH () {
+      const tableSearchH = this.$refs.tableSearch.offsetHeight
+      this.tableHeight = window.innerHeight - tableSearchH - 230
     }
   },
   mounted () {
     if (!this.$store.state.app.isNewTab) { // 页签刷新时调用
       this.getTableTitle()
+      this.setTableH()
     }
   },
   activated () {
     // 如果是新页签打开,则重置当前页面
     if (this.$store.state.app.isNewTab) {
       this.getTableTitle()
+      this.setTableH()
     }
   },
   beforeRouteEnter (to, from, next) {