| public/pages/property/flowchartManage/flowchartManage.html | ●●●●● 补丁 | 查看 | 原始文档 | blame | 历史 | |
| public/pages/property/flowchartManage/flowchartManage.js | ●●●●● 补丁 | 查看 | 原始文档 | blame | 历史 |
public/pages/property/flowchartManage/flowchartManage.html
New file @@ -0,0 +1,184 @@ <div> <div class="ibox"> <div class="ibox-title"> <h5> <vc:i18n name="查询条件" namespace="flowchartManage"></vc:i18n> </h5> <div class="ibox-tools" style="top:10px;"> <button type="button" class="btn btn-link btn-sm" style="margin-right:10px;" v-on:click="_moreCondition()"> {{flowchartFee.moreCondition == true?'隐藏':'更多'}} </button> </div> </div> <div class="ibox-content"> <div class="row"> <div class="col-sm-2"> <div class="form-group input-group"> <input type="text" :placeholder="vc.i18n('请选择缴费开始时间','flowchartManage')" v-model="flowchartFee.conditions.startDate" class=" form-control startDate"> </div> </div> <div class="col-sm-2"> <div class="form-group input-group"> <input type="text" :placeholder="vc.i18n('请选择缴费结束时间','flowchartManage')" v-model="flowchartFee.conditions.endDate" class=" form-control endDate"> </div> </div> <div class="col-sm-2"> <div class="form-group"> <input type="text" :placeholder="vc.i18n('请填写房屋编号/合同名称/车牌号','flowchartManage')" class="form-control form-control-md" v-model.trim="flowchartFee.conditions.objName"> </div> </div> <div class="col-sm-2"> <button type="button" class="btn btn-primary btn-md" v-on:click="_queryMethod()"> <i class="fa fa-search"></i> <vc:i18n name="查询" namespace="flowchartManage"></vc:i18n> </button> <button type="button" class="btn btn-primary btn-md" v-on:click="_resetMethod()"> <i class="fa fa-repeat"></i> <vc:i18n name="重置" namespace="flowchartManage"></vc:i18n> </button> </div> </div> <div class="row" v-show="flowchartFee.moreCondition == true"> <div class="col-sm-2"> <div class="form-group input-group"> <input type="text" :placeholder="vc.i18n('请填写业主名称','flowchartManage')" v-model.trim="flowchartFee.conditions.ownerName" class=" form-control"> </div> </div> <div class="col-sm-2"> <div class="form-group"> <input type="text" :placeholder="vc.i18n('请填写业主手机号','flowchartManage')" class="form-control form-control-md" v-model.trim="flowchartFee.conditions.link"> </div> </div> <div class="col-sm-2" v-if="flowchartFee.communitys.length>1"> <select class="form-control-md form-control input-s-sm inline" v-model="flowchartFee.conditions.communityId" @change="_changCommunity()"> <option disabled selected value="">{{vc.i18n('请选择小区','reportFeeSummary')}}</option> <option v-for="(item,index) in flowchartFee.communitys" :key="index" v-bind:value="item.communityId">{{item.name}} </option> </select> </div> </div> </div> </div> <div class="white-bg padding-lg"> <div class="margin-top"> <div> <div class="text-right"> <button type="button" class="btn btn-primary btn-sm" v-on:click="_exportflowchartManageOwnerExcel()"> <i class="fa fa-plus"></i> <vc:i18n name="导出" namespace="flowchartManageOwner"></vc:i18n> </button> </div> <div class="margin-top"> <div class="hc-table-div" :style="{'width':_computeTableDivWidth()}"> <table class="table table-bordered" data-page-size="15"> <thead> <tr> <th rowspan="6" class="text-center"> <vc:i18n name="类别" namespace="flowchartManageOwner"></vc:i18n> </th> <th rowspan="2" colspan="2" class="text-center"> <vc:i18n name="名称" namespace="flowchartManageOwner"></vc:i18n> </th> <th colspan="3" class="text-center"> <vc:i18n name="当年应收款项" namespace="flowchartManageOwner"></vc:i18n> </th> <th rowspan="2" class="text-center"> <vc:i18n name="当年收缴率" namespace="flowchartManageOwner"></vc:i18n> </th> <th rowspan="2" class="text-center"> <vc:i18n name="折扣" namespace="flowchartManageOwner"></vc:i18n> </th> <th rowspan="2" v-for="year in flowchartFee.history" :key="year.year" class="text-center">{{year.year}}年实收</th> <th colspan="4" class="text-center">{{flowchartFee.today.year}}年实收</th> <th rowspan="2" v-for="month in 12" :key="month" class="text-center">{{flowchartFee.today.year}}年{{month}}月</th> </tr> <tr> <th class="text-center"> <vc:i18n name="合计" namespace="flowchartManageOwner"></vc:i18n> </th> <th class="text-center"> <vc:i18n name="每月费用" namespace="flowchartManageOwner"></vc:i18n> </th> <th class="text-center"> <vc:i18n name="应收月份数" namespace="flowchartManageOwner"></vc:i18n> </th> <th class="text-center"> <vc:i18n name="预算" namespace="flowchartManageOwner"></vc:i18n> </th> <th class="text-center"> <vc:i18n name="实收/实付" namespace="flowchartManageOwner"></vc:i18n> </th> <th class="text-center"> <vc:i18n name="折扣" namespace="flowchartManageOwner"></vc:i18n> </th> <th class="text-center"> <vc:i18n name="欠款" namespace="flowchartManageOwner"></vc:i18n> </th> </tr> <tr> <th colspan="2" class="text-center"> <vc:i18n name="收入合计（白单流水）" namespace="flowchartManageOwner"></vc:i18n> </th> </tr> <tr> <th colspan="2" class="text-center"> <vc:i18n name="物业费+代收合计" namespace="flowchartManageOwner"></vc:i18n> </th> </tr> <tr> <th colspan="2" class="text-center"> <vc:i18n name="物业费合计（1+2）" namespace="flowchartManageOwner"></vc:i18n> </th> </tr> <tr> <th colspan="2" class="text-center"> <vc:i18n name="物业费代收合计" namespace="flowchartManageOwner"></vc:i18n> </th> </tr> </thead> <tbody> <tr v-for="fee in flowchartFee.fees"> <td class="text-center" v-if="fee.link">{{fee.ownerName}}({{fee.link}})</td> <td class="text-center" v-else>{{fee.ownerName}}</td> <td class="text-center">{{fee.oweFee || '0'}}</td> <template v-if="flowchartFee.history"> <template v-for="(item, index) in flowchartFee.history" :key="index"> <td class="text-center">{{ item.value1 }}</td> <td class="text-center">{{ item.value2 }}</td> <td class="text-center">{{ item.value3 }}</td> </template> </template> <td class="text-center hc-table-fix-right-td"> <div class="btn-group"> <button class="btn-white btn btn-xs" v-on:click="_toDetail(fee)"> <vc:i18n name="详情" namespace="room"></vc:i18n> </button> </div> </td> </tr> </tbody> </table> </div> </div> </div> <!-- <div class="row margin-top-xs"> <div class="col-sm-12 float-right"> <vc:create namespace="flowchartManageOwner" path="frame/paginationPlus"></vc:create> </div> </div> --> </div> </div> </div> </div> public/pages/property/flowchartManage/flowchartManage.js
New file @@ -0,0 +1,222 @@ (function (vc) { var DEFAULT_PAGE = 1; var DEFAULT_ROWS = 10; vc.extends({ data: { flowchartFee: { _currentTab: 'reportFeeDetailRoom', floors: [], moreCondition: false, communitys: [], fees: [], feeTypeCds: [], total: 0, records: 0, conditions: { floorId: '', objName: '', startDate: '', endDate: '', configId: '', feeTypeCd: '', ownerName: '', link: '', communityId: '' }, years:[2020,2021,2022,2023,2024,2025], history: [{ year: 2020, value1: 200, value2: 200, value3: 200, }, { year: 2021, value1: 200, value2: 200, value3: 200, }, { year: 2023, value1: 200, value2: 200, value3: 200, }, { year: 2024, value1: 200, value2: 200, value3: 200, }, ], today: { year: 2025, value1: 200, value2: 200, value3: 200, value4: 200, } }, }, _initMethod: function () { $that._initDate(); $that._loadStaffCommunitys(); $that.flowchartFee.conditions.communityId = vc.getCurrentCommunity().communityId; // $that.changeTab($that.flowchartFee._currentTab); vc.getDict('pay_fee_config', "fee_type_cd_show", function (_data) { $that.flowchartFee.feeTypeCds = _data }); $that._listReportFeeDetailOwners(DEFAULT_PAGE, DEFAULT_ROWS); }, _initEvent: function () { vc.on("indexContext", "_queryIndexContextData", function (_param) {}); vc.on('reportFeeDetailOwner', 'switch', function (_data) { $that.flowchartFee.conditions = _data; $that._listReportFeeDetailOwners(DEFAULT_PAGE, DEFAULT_ROWS); }); vc.on('reportFeeDetailOwner', 'notify', function (_data) { $that.flowchartFee.conditions = _data; $that._listReportFeeDetailOwners(DEFAULT_PAGE, DEFAULT_ROWS); }); vc.on('reportFeeDetailOwner', 'paginationPlus', 'page_event', function (_currentPage) { $that._listReportFeeDetailOwners(_currentPage, DEFAULT_ROWS); }); }, methods: { _toDetail: function (_fee) { vc.jumpToPage('/#/pages/property/flowchartFeesDetail?feeId=' + _fee.feeId); }, _computeTableDivWidth: function () { let mainWidth = document.getElementsByTagName('body')[0].clientWidth - document.getElementById('menu-nav').offsetWidth; //let treeWidth = document.getElementsByClassName('room-floor-unit-tree')[0].offsetWidth; mainWidth = mainWidth - 20 - 15 - 20; //document.getElementsByClassName('hc-table-div')[0].style.width=mainWidth+'px'; return mainWidth + 'px'; }, _initDate: function () { vc.initDate('startDate', function (_value) { $that.flowchartFee.conditions.startDate = _value; }); vc.initDate('endDate', function (_value) { $that.flowchartFee.conditions.endDate = _value; }); let _data = new Date(); let _month = _data.getMonth() + 1; let _newDate = ""; if (_month < 10) { _newDate = _data.getFullYear() + "-0" + _month + "-01"; } else { _newDate = _data.getFullYear() + "-" + _month + "-01"; } $that.flowchartFee.conditions.startDate = _newDate; _data.setMonth(_data.getMonth() + 1); _month = _data.getMonth() + 1; if (_month < 10) { _newDate = _data.getFullYear() + "-0" + _month + "-01"; } else { _newDate = _data.getFullYear() + "-" + _month + "-01"; } $that.flowchartFee.conditions.endDate = _newDate; }, changeTab: function (_tab) { $that.flowchartFee._currentTab = _tab; vc.emit(_tab, 'switch', $that.flowchartFee.conditions) }, //查询 _queryMethod: function () { $that.changeTab($that.flowchartFee._currentTab); }, //重置 _resetMethod: function () { vc.component.flowchartFee.conditions.startDate = ""; vc.component.flowchartFee.conditions.endDate = ""; vc.component.flowchartFee.conditions.objName = ""; vc.component.flowchartFee.conditions.ownerName = ""; vc.component.flowchartFee.conditions.link = ""; // vc.component.flowchartFee.conditions.communityId = ""; $that._initDate(); $that.changeTab($that.flowchartFee._currentTab); }, _loadStaffCommunitys: function () { let param = { params: { _uid: '123mlkdinkldldijdhuudjdjkkd', page: 1, row: 100, } }; vc.http.apiGet('/community.listMyEnteredCommunitys', param, function (json, res) { if (res.status == 200) { let _data = JSON.parse(json); $that.flowchartFee.communitys = _data.communitys; } }, function () { console.log('请求失败处理'); } ); }, _changCommunity: function () { $that.changeTab($that.flowchartFee._currentTab); }, _moreCondition: function () { if (vc.component.flowchartFee.moreCondition) { vc.component.flowchartFee.moreCondition = false; } else { vc.component.flowchartFee.moreCondition = true; } }, _listReportFeeDetailOwners: function (_page, _rows) { console.log('_listReportFeeDetailOwners11111'); $that.flowchartFee.conditions.page = _page; $that.flowchartFee.conditions.row = _rows; $that.flowchartFee.conditions.floorId = $that.flowchartFee.floorId; let param = { params: $that.flowchartFee.conditions }; //发送get请求 vc.http.apiGet('/reportFeeMonthStatistics.queryReportFeeDetailOwner', param, function (json, res) { let _json = JSON.parse(json); console.log('_listReportFeeDetailOwners2222222', _json); $that.flowchartFee.total = _json.total; $that.flowchartFee.records = _json.records; $that.flowchartFee.fees = _json.data; $that.flowchartFee.fees.history =$that.flowchartFee.history vc.emit('reportFeeDetailOwner', 'paginationPlus', 'init', { total: $that.flowchartFee.records, dataCount: $that.flowchartFee.total, currentPage: _page, }); }, function (errInfo, error) { console.log('请求失败处理'); } ); }, _exportReportFeeDetailOwnerExcel: function () { //$that.flowchartFee.conditions.communityId = vc.getCurrentCommunity().communityId; $that.flowchartFee.conditions.pagePath = 'reportFeeDetailOwner'; let param = { params: $that.flowchartFee.conditions }; //发送get请求 vc.http.apiGet('/export.exportData', param, function (json, res) { let _json = JSON.parse(json); vc.toast(_json.msg); if (_json.code == 0) { vc.jumpToPage('/#/pages/property/downloadTempFile?tab=下载中心') } }, function (errInfo, error) { console.log('请求失败处理'); }); } } }) })(window.vc);
