lilei 2 rokov pred
rodič
commit
fd36726749
1 zmenil súbory, kde vykonal 203 pridanie a 147 odobranie
  1. 203 147
      src/views/reportData/allocationPresentation/list.vue

+ 203 - 147
src/views/reportData/allocationPresentation/list.vue

@@ -92,42 +92,66 @@
           </a-row>
         </a-form-model>
       </div>
-      <!-- 列表 -->
-      <s-table
-        class="sTable"
-        ref="table"
-        size="small"
-        :defaultLoadData="false"
-        :rowKey="(record) => record.id"
-        :columns="columns"
-        :data="loadData"
-        :scroll="{ x: 1840 }"
-        bordered>
-        <template slot="footer">
-          <a-row>
-            <a-col span="2">合计:</a-col>
-            <a-col span="22">
-              <a-row>
-                <a-col span="4">配送品调拨:{{ (totalData && (totalData.pspdb || totalData.pspdb==0)) ? totalData.pspdb : '--' }}</a-col>
-                <a-col span="4">有偿调拨:{{ (totalData && (totalData.ycdb || totalData.ycdb==0)) ? totalData.ycdb : '--' }}</a-col>
-                <a-col span="4">促销调拨:{{ (totalData && (totalData.cxdb || totalData.cxdb==0)) ? totalData.cxdb : '--' }}</a-col>
-                <a-col span="4">退换品调拨:{{ (totalData && (totalData.thpdb || totalData.thpdb==0)) ? totalData.thpdb : '--' }}</a-col>
-                <a-col span="4">样品调拨:{{ (totalData && (totalData.ypdb || totalData.ypdb==0)) ? totalData.ypdb : '--' }}</a-col>
-                <a-col span="4">仓库误差调拨:{{ (totalData && (totalData.ckwcdb || totalData.ckwcdb==0)) ? totalData.ckwcdb : '--' }}</a-col>
-                <a-col span="4">TBU刹车片配送品调拨:{{ (totalData && (totalData.tbudb || totalData.tbudb==0)) ? totalData.tbudb : '--' }}</a-col>
-                <a-col span="4">NGK配送品调拨:{{ (totalData && (totalData.ngkdb || totalData.ngkdb==0)) ? totalData.ngkdb : '--' }}</a-col>
-                <a-col span="4">德路斯调拨:{{ (totalData && (totalData.dlsdb || totalData.dlsdb==0)) ? totalData.dlsdb : '--' }}</a-col>
-                <a-col span="4">新加盟商政策调拨:{{ (totalData && (totalData.xjmszcdb || totalData.xjmszcdb==0)) ? totalData.xjmszcdb : '--' }}</a-col>
-                <a-col span="4">特殊申请配送品调拨:{{ (totalData && (totalData.tssqpspdb || totalData.tssqpspdb==0)) ? totalData.tssqpspdb : '--' }}</a-col>
-                <a-col span="4">特殊申请促销调拨:{{ (totalData && (totalData.tssqcxdb || totalData.tssqcxdb==0)) ? totalData.tssqcxdb : '--' }}</a-col>
-                <a-col span="4">卡扣配送品调拨:{{ (totalData && (totalData.kkpspdb || totalData.kkpspdb==0)) ? totalData.kkpspdb : '--' }}</a-col>
-                <a-col span="4">客诉样品调拨:{{ (totalData && (totalData.ksypdb || totalData.ksypdb==0)) ? totalData.ksypdb : '--' }}</a-col>
-                <a-col span="6" v-if="$hasPermissions('B_isShowPrice')">调拨单合计金额:{{ (totalData && (totalData.totalCost || totalData.totalCost==0)) ? totalData.totalCost : '--' }}</a-col>
-              </a-row>
-            </a-col>
-          </a-row>
-        </template>
-      </s-table>
+      <a-tabs>
+        <a-tab-pane key="1" tab="费用/调拨类型列表">
+          <!-- 列表 -->
+          <s-table
+            class="sTable"
+            ref="table"
+            size="small"
+            :defaultLoadData="false"
+            :rowKey="(record) => record.id"
+            :columns="columns"
+            :data="loadData"
+            :scroll="{ x: 680 + tableWidth }"
+            bordered>
+          </s-table>
+        </a-tab-pane>
+        <a-tab-pane key="2" tab="费用/调拨类型合计" force-render>
+          <div class="h-title">
+            <div><div>费用类型</div></div>
+            <div><div>调拨类别</div></div>
+            <div><div>调拨类型</div></div>
+          </div>
+          <div class="leve1" v-for="item in totalData" :key="item.name">
+            <div>
+              <div>
+                {{ item.name }}
+              </div>
+              <div>
+                {{ item.cost }}
+              </div>
+            </div>
+            <div>
+              <!-- 二级 -->
+              <div class="leve2" v-for="item2 in item.treeList" :key="item2.name">
+                <div>
+                  <div>
+                    {{ item2.name }}
+                  </div>
+                  <div>
+                    {{ item2.cost }}
+                  </div>
+                </div>
+                <div>
+                  <!-- 三级 -->
+                  <div class="leve3" v-for="item3 in item2.treeList" :key="item3.name">
+                    <div>
+                      <div>
+                        {{ item3.name }}
+                      </div>
+                      <div>
+                        {{ item3.cost }}
+                      </div>
+                    </div>
+                  </div>
+                </div>
+              </div>
+            </div>
+          </div>
+          <div v-if="!totalData" style="text-align: center;padding:100px 0;">暂无合计数据</div>
+        </a-tab-pane>
+      </a-tabs>
     </a-spin>
     <!-- 导出提示框 -->
     <reportModal :visible="showExport" @close="showExport=false"></reportModal>
@@ -140,6 +164,7 @@ import { STable, VSelect } from '@/components'
 import rangeDate from '@/views/common/rangeDate.vue'
 import reportModal from '@/views/common/reportModal.vue'
 import subarea from '@/views/common/subarea.js'
+import { allocateTypeTreeList } from '@/api/allocateType'
 import { getArea } from '@/api/data'
 import { hdExportExcel } from '@/libs/exportExcel'
 import { reportAllocateDbjdReportList, reportAllocateDbjdReportCount, reportAllocateDbjdReportExport } from '@/api/reportData'
@@ -194,129 +219,62 @@ export default {
       totalData: null,
       addrProvinceList: [], //  省下拉
       addrCityList: [], //  市下拉
-      addrDistrictList: [] //  区下拉
+      addrDistrictList: [], //  区下拉
+      allocateType: [], // 调拨类型
+      atypeColList: [],
+      tableWidth: 0
     }
   },
   computed: {
     columns () {
-      const arr = [
-        { title: '区域', dataIndex: 'dealerEntity.subareaNameSet', width: 100, align: 'center', customRender: function (text) { return (text && text.length > 0) ? text.join('/') : '--' } },
+      let arr = [
+        { title: '区域', dataIndex: 'subareaName', width: 100, align: 'center', customRender: function (text) { return text || '--' } },
         { title: '调拨单号', dataIndex: 'allocateNo', width: 160, align: 'center', customRender: function (text) { return text || '--' } },
-        { title: '省份', dataIndex: 'dealerEntity.provinceName', width: 90, align: 'center', customRender: function (text) { return text || '--' } },
-        { title: '客户名称', dataIndex: 'targetName',width: 120, align: 'center', customRender: function (text) { return text || '--' }, ellipsis: true },
-        { title: '客户级别', dataIndex: 'dealerEntity.dealerLevelDictValue', width: 120, align: 'center', customRender: function (text) { return text || '--' } },
-        { title: '调拨类型',
-          align: 'center',
-          children: [
-            {
-              title: '配送品调拨',
-              dataIndex: 'pspdb',
-              align: 'center',
-              width: 80,
-              customRender: function (text) { return (text || text == 0) ? ('¥' + text) : '--' }
-            },
-            {
-              title: '有偿调拨',
-              dataIndex: 'ycdb',
-              align: 'center',
-              width: 80,
-              customRender: function (text) { return (text || text == 0) ? ('¥' + text) : '--' }
-            },
-            {
-              title: '促销调拨',
-              dataIndex: 'cxdb',
-              align: 'center',
-              width: 80,
-              customRender: function (text) { return (text || text == 0) ? ('¥' + text) : '--' }
-            },
-            {
-              title: '退换品调拨',
-              dataIndex: 'thpdb',
-              align: 'center',
-              width: 80,
-              customRender: function (text) { return (text || text == 0) ? ('¥' + text) : '--' }
-            },
-            {
-              title: '样品调拨',
-              dataIndex: 'ypdb',
-              align: 'center',
-              width: 80,
-              customRender: function (text) { return (text || text == 0) ? ('¥' + text) : '--' }
-            },
-            {
-              title: '仓库误差调拨',
-              dataIndex: 'ckwcdb',
-              align: 'center',
-              width: 80,
-              customRender: function (text) { return (text || text == 0) ? ('¥' + text) : '--' }
-            },
-            {
-              title: 'TBU刹车片配送品调拨',
-              dataIndex: 'tbudb',
-              align: 'center',
-              width: 80,
-              customRender: function (text) { return (text || text == 0) ? ('¥' + text) : '--' }
-            },
-            {
-              title: 'NGK配送品调拨',
-              dataIndex: 'ngkdb',
-              align: 'center',
-              width: 80,
-              customRender: function (text) { return (text || text == 0) ? ('¥' + text) : '--' }
-            },
-            {
-              title: '德路斯调拨',
-              dataIndex: 'dlsdb',
-              align: 'center',
-              width: 80,
-              customRender: function (text) { return (text || text == 0) ? ('¥' + text) : '--' }
-            },
-            {
-              title: '新加盟商政策调拨',
-              dataIndex: 'xjmszcdb',
-              align: 'center',
-              width: 80,
-              customRender: function (text) { return (text || text == 0) ? ('¥' + text) : '--' }
-            },
-            {
-              title: '特殊申请配送品调拨',
-              dataIndex: 'tssqpspdb',
-              align: 'center',
-              width: 80,
-              customRender: function (text) { return (text || text == 0) ? ('¥' + text) : '--' }
-            },
-            {
-              title: '特殊申请促销调拨',
-              dataIndex: 'tssqcxdb',
-              align: 'center',
-              width: 80,
-              customRender: function (text) { return (text || text == 0) ? ('¥' + text) : '--' }
-            },
-            {
-              title: '卡扣配送品调拨',
-              dataIndex: 'kkpspdb',
-              align: 'center',
-              width: 80,
-              customRender: function (text) { return (text || text == 0) ? ('¥' + text) : '--' }
-            },
-            {
-              title: '客诉样品调拨',
-              dataIndex: 'ksypdb',
-              align: 'center',
-              width: 80,
-              customRender: function (text) { return (text || text == 0) ? ('¥' + text) : '--' }
-            }
-          ]
-        }
-        // { title: '调拨单合计金额', width: 90, dataIndex: 'totalCost', align: 'center', customRender: function (text) { return (text || text == 0) ? ('¥' + text) : '--' } }
+        { title: '省份', dataIndex: 'provinceName', width: 90, 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 || '--' } }
       ]
+      arr = arr.concat(this.atypeColList)
       if (this.$hasPermissions('B_isShowPrice')) { //  售价权限
-        arr.splice(arr.length, 0, { title: '调拨单合计金额', width: 90, dataIndex: 'totalCost', align: 'center', customRender: function (text) { return (text || text == 0) ? ('¥' + text) : '--' } })
+        arr.splice(arr.length, 0, { title: '调拨单合计金额', width: 90, dataIndex: 'totalCost', align: 'center', customRender: function (text) { return text || '--' } })
       }
       return arr
     }
   },
   methods: {
+    getCol (data, key) {
+      const ret = []
+      for (let i = 0; i < data.length; i++) {
+        const row = data[i]
+        row.paths = key ? (key + '_' + row.allocateTypeSn) : row.allocateTypeSn
+        const params = {
+          title: row.name
+        }
+        if (!row.sonList) {
+          params.dataIndex = row.paths
+          params.width = 100
+          params.align = 'center'
+          params.customRender = function (text) { return text || '--' }
+          this.tableWidth += 100
+        } else {
+          params.children = this.getCol(row.sonList, row.paths)
+        }
+        ret.push(params)
+      }
+      return ret
+    },
+    // 获取调拨类型
+    getAllocateType () {
+      allocateTypeTreeList({}).then(res => {
+        if (res.status == 200) {
+          this.allocateType = res.data
+          this.atypeColList = this.getCol(this.allocateType, '')
+          // console.log(JSON.stringify(this.atypeColList))
+        } else {
+          this.allocateType = []
+        }
+      })
+    },
     //  导出
     handleExport () {
       const _this = this
@@ -433,6 +391,7 @@ export default {
     },
     pageInit () {
       this.getArea('province')
+      this.getAllocateType()
     }
   },
   mounted () {
@@ -453,3 +412,100 @@ export default {
   }
 }
 </script>
+<style lang="less">
+  .allocationPresentationList-wrap{
+    .h-title{
+      display: flex;
+      align-items: center;
+      > div{
+        padding: 10px;
+        width: 33.3%;
+        background:#f8f8f8;
+        border-left:1px solid #eee;
+        > div{
+          width: 50%;
+          text-align: center;
+          font-weight:bold;
+          border-right:1px solid #eee;
+        }
+      }
+    }
+    .leve1{
+      border:1px solid #eee;
+      > div{
+        &:first-child{
+          width: 33.3%;
+          display: flex;
+          align-items: center;
+          > div{
+            width: 50%;
+            height: 100%;
+            text-align: center;
+            border-left:1px solid #eee;
+            display: flex;
+            align-items: center;
+            justify-content: center;
+          }
+        }
+        &:last-child{
+          align-items: center;
+          width: 66.6%;
+        }
+      }
+    }
+    .leve2{
+      border-bottom:1px solid #eee;
+      > div{
+        &:first-child{
+          width: 50%;
+          display: flex;
+          align-items: center;
+          > div{
+            width: 50%;
+            height: 100%;
+            padding: 10px;
+            text-align: center;
+            border-left:1px solid #eee;
+            display: flex;
+            align-items: center;
+            justify-content: center;
+          }
+        }
+        &:last-child{
+          align-items: center;
+          width: 50%;
+          border-left:1px solid #eee;
+        }
+      }
+      &:last-child{
+        border-bottom:0;
+      }
+    }
+    .leve3{
+      border-bottom:1px solid #eee;
+      > div{
+        width: 100%;
+        display: flex;
+        align-items: center;
+        > div{
+          width: 50%;
+          height: 100%;
+          padding: 10px;
+          text-align: center;
+          display: flex;
+          align-items: center;
+          justify-content: center;
+          &:last-child{
+            border-left:1px solid #eee;
+          }
+        }
+      }
+      &:last-child{
+        border-bottom:0;
+      }
+    }
+    .leve1,.leve2,.leve3{
+      display:flex;
+    }
+  }
+</style>