From ef9f19d827fb5cc66ebde5e67941ff224a3f832e Mon Sep 17 00:00:00 2001
From: java110 <928255095@qq.com>
Date: Mon, 16 Aug 2021 01:12:09 +0800
Subject: [PATCH] =?UTF-8?q?=E4=BC=98=E5=8C=96=20=E4=BB=A3=E7=A0=81?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../reportHuaningOweFeeDetail.html            | 44 ++++++++++
 .../reportHuaningOweFeeDetail.js              | 81 +++++++++++++++++++
 .../property/reportHuaning/reportHuaning.html |  8 ++
 3 files changed, 133 insertions(+)
 create mode 100644 public/components/property/reportHuaningOweFeeDetail/reportHuaningOweFeeDetail.html
 create mode 100644 public/components/property/reportHuaningOweFeeDetail/reportHuaningOweFeeDetail.js

diff --git a/public/components/property/reportHuaningOweFeeDetail/reportHuaningOweFeeDetail.html b/public/components/property/reportHuaningOweFeeDetail/reportHuaningOweFeeDetail.html
new file mode 100644
index 000000000..245d1eb8e
--- /dev/null
+++ b/public/components/property/reportHuaningOweFeeDetail/reportHuaningOweFeeDetail.html
@@ -0,0 +1,44 @@
+<div>
+    <div class="margin-top">
+        <div class="row">
+            <div class="col-sm-12 margin-lr-0 padding-lr-0">
+                <table class="footable table table-stripped " style="margin-top:10px" data-page-size="10">
+                    <thead>
+                        <tr>
+                            <th class="text-center " style="border-bottom: none;">房号</th>
+                            <th class="text-center" style="border-bottom: none;">面积</th>
+                            <th class="text-center " style="border-bottom: none;">单价</th>
+                            <th class="text-center " style="border-bottom: none;">月收费</th>
+                            <th class="text-center " style="border-bottom: none;">费用开始时间</th>
+                            <th class="text-center " style="border-bottom: none;">费用截止时间</th>
+                            <th class="text-center " style="border-bottom: none;">总未收金额</th>
+                            <th class="text-center " style="border-bottom: none;">2021年1-7月未收金额</th>
+                            <th class="text-center " style="border-bottom: none;">2021年前未收金额</th>
+                        </tr>
+                    </thead>
+                    <tbody>
+                        <tr v-for="fee in reportHuaningOweFeeDetailInfo.fees">
+                            <td class="text-center ">{{fee.payerObjName}}</td>
+                            <td class="text-center ">{{fee.builtUpArea}}</td>
+                            <td class="text-center ">{{fee.squarePrice}}</td>
+                            <td class="text-center">{{_getMonthFee(fee)}}</td>
+                            <td class="text-center">{{fee.startTime}}</td>
+                            <td class="text-center">{{fee.endTime}}</td>
+                            <td class="text-center">{{fee.oweAmount}}</td>
+                            <td class="text-center">{{fee.btAmount}}</td>
+                            <td class="text-center">{{fee.bfAmount}}</td>
+                        </tr>
+                    </tbody>
+                </table>
+            </div>
+        </div>
+        <div class="row">
+            <div class="col-sm-5">
+                <span> </span>
+            </div>
+            <div class="col-sm-7 float-right">
+                <vc:create namespace="reportHuaningOweFeeDetail" path="frame/paginationPlus"></vc:create>
+            </div>
+        </div>
+    </div>
+</div>
\ No newline at end of file
diff --git a/public/components/property/reportHuaningOweFeeDetail/reportHuaningOweFeeDetail.js b/public/components/property/reportHuaningOweFeeDetail/reportHuaningOweFeeDetail.js
new file mode 100644
index 000000000..684842404
--- /dev/null
+++ b/public/components/property/reportHuaningOweFeeDetail/reportHuaningOweFeeDetail.js
@@ -0,0 +1,81 @@
+/**
+ 入驻小区
+ **/
+(function (vc) {
+    var DEFAULT_PAGE = 1;
+    var DEFAULT_ROWS = 10;
+    vc.extends({
+        data: {
+            reportHuaningOweFeeDetailInfo: {
+                fees: [],
+                listColumns: [],
+                roomId: '',
+                roomName: '',
+                conditions: {
+                    year: new Date().getFullYear(),
+                    month: new Date().getMonth() + 1
+                },
+                dateStr: vc.dateFormat(new Date().getTime())
+            }
+        },
+        _initMethod: function () {
+        },
+        _initEvent: function () {
+            //切换 至费用页面
+            vc.on('reportHuaningOweFeeDetail', 'switch', function (_param) {
+                $that.clearReportHuaningOweFeeDetailInfo();
+                $that.reportHuaningOweFeeDetailInfo.conditions = _param;
+                $that._listReportHuaningOweFeeDetail(DEFAULT_PAGE, DEFAULT_ROWS);
+            });
+            vc.on('reportHuaningOweFeeDetail', 'notify', function () {
+                $that._listReportHuaningOweFeeDetail(DEFAULT_PAGE, DEFAULT_ROWS);
+            });
+            vc.on('reportHuaningOweFeeDetail', 'paginationPlus', 'page_event',
+                function (_currentPage) {
+                    vc.component._listReportHuaningOweFeeDetail(_currentPage, DEFAULT_ROWS);
+                });
+        },
+        methods: {
+            _listReportHuaningOweFeeDetail: function (_page, _row) {
+                $that.reportHuaningOweFeeDetailInfo.conditions.page = _page;
+                $that.reportHuaningOweFeeDetailInfo.conditions.row = _row;
+                $that.reportHuaningOweFeeDetailInfo.conditions.communityId = vc.getCurrentCommunity().communityId;
+                let param = {
+                    params: $that.reportHuaningOweFeeDetailInfo.conditions
+                };
+                //发送get请求
+                vc.http.apiGet('/reportFeeMonthStatistics/queryHuaningOweFeeDetail',
+                    param,
+                    function (json) {
+                        let _feeConfigInfo = JSON.parse(json);
+                        vc.component.reportHuaningOweFeeDetailInfo.total = _feeConfigInfo.total;
+                        vc.component.reportHuaningOweFeeDetailInfo.records = _feeConfigInfo.records;
+                        vc.component.reportHuaningOweFeeDetailInfo.fees = _feeConfigInfo.data;
+                        vc.emit('reportHuaningOweFeeDetail', 'paginationPlus', 'init', {
+                            total: _feeConfigInfo.records,
+                            currentPage: _page
+                        });
+                    }, function () {
+                        console.log('请求失败处理');
+                    }
+                );
+            },
+            clearReportHuaningOweFeeDetailInfo: function () {
+                $that.reportHuaningOweFeeDetailInfo = {
+                    fees: [],
+                    roomId: '',
+                    roomName: '',
+                    name: '',
+                    conditions: {
+                        year: new Date().getFullYear(),
+                        month: new Date().getMonth() + 1
+                    },
+                    dateStr: vc.dateFormat(new Date().getTime())
+                }
+            },
+            _getMonthFee: function (_fee) {
+                return (_fee.builtUpArea * _fee.squarePrice).toFixed(2);
+            }
+        }
+    });
+})(window.vc);
diff --git a/public/pages/property/reportHuaning/reportHuaning.html b/public/pages/property/reportHuaning/reportHuaning.html
index 2b8cd21db..e91279285 100644
--- a/public/pages/property/reportHuaning/reportHuaning.html
+++ b/public/pages/property/reportHuaning/reportHuaning.html
@@ -87,6 +87,10 @@
                     <a class="nav-link" v-bind:class="{active:reportHuaningInfo._currentTab == 'reportHuaningPayFeeTwo'}"
                         v-on:click="changeTab('reportHuaningPayFeeTwo')">当月收费情况表2</a>
                 </li>
+                <li class="nav-item">
+                    <a class="nav-link" v-bind:class="{active:reportHuaningInfo._currentTab == 'reportHuaningOweFeeDetail'}"
+                        v-on:click="changeTab('reportHuaningOweFeeDetail')">物业费欠费明细表</a>
+                </li>
             </ul>
         </div>
         <div v-if="reportHuaningInfo._currentTab == 'reportHuaningOweFee'">
@@ -99,5 +103,9 @@
         <div v-if="reportHuaningInfo._currentTab == 'reportHuaningPayFeeTwo'">
             <vc:create path="property/reportHuaningPayFeeTwo"></vc:create>
         </div>
+        <div v-if="reportHuaningInfo._currentTab == 'reportHuaningOweFeeDetail'">
+            <vc:create path="property/reportHuaningOweFeeDetail"></vc:create>
+        </div>
+        
     </div>
 </div>
\ No newline at end of file