<div class="cost-detail-container">
|
<h2>费用明细表</h2>
|
|
<!-- 搜索栏 -->
|
<div class="search-bar">
|
<div>
|
<label>年份：</label>
|
<input type="date" class="form-control queryDate" placeholder="请输入年份" v-model="costDetailInfo.conditions.year" min="2000" max="2099" />
|
</div>
|
<div>
|
<label>小区：</label>
|
<select class="form-control" v-model="costDetailInfo.conditions.communityName">
|
<option value="">请选择</option>
|
<option v-for="community in costDetailInfo.communityList" :value="community.name">{{community.name}}</option>
|
</select>
|
</div>
|
<div>
|
<label>小区编码：</label>
|
<input type="text" class="form-control" placeholder="请输入" v-model="costDetailInfo.conditions.communityCode" />
|
</div>
|
<button type="button" class="query-btn" v-on:click="_queryCostDetails()" style="line-height: 0px;">查询</button>
|
<button type="button" class="reset-btn" v-on:click="_resetQuery()" style="line-height: 0px;">重置</button>
|
<div class="action-buttons">
|
<button type="button" class="download-btn" v-on:click="_downloadTemplate()" style="line-height: 0px; ">模板下载</button>
|
<button type="button" class="import-btn" v-on:click="_importCostDetail()" style="line-height: 0px;">费用导入</button>
|
<button type="button" class="add-btn" v-on:click="_addCostDetail()" style="line-height: 0px;">添加</button>
|
</div>
|
</div>
|
|
<!-- 费用表格 -->
|
<table>
|
<thead>
|
<tr id="costDetailTableHead">
|
<th style="width: 8px;">序号</th>
|
<th style="width: 15px;">流转编码</th>
|
<th style="width: 6px;">小区编码</th>
|
<th style="width: 8px;">小区名称</th>
|
<th style="width: 35px;">日期</th>
|
<th style="width: 200px;">工程内容</th>
|
<th style="width: 6px;">管理处金额 (元)</th>
|
<th style="width: 6px;">是否盖章</th>
|
<th style="width: 12px;">业委会金额 (元)</th>
|
<th style="width: 20px;">审价金额 (元)</th>
|
<th style="width: 6px;">是否盖章</th>
|
<th style="width: 8px;">签报部门</th>
|
<th style="width: 12px;">基金类型-一级分类</th>
|
<th style="width: 12px;">基金类型-二级分类</th>
|
<th style="width: 6px;">幢/全体</th>
|
<th style="width: 8px;">维修类型</th>
|
<th style="width: 220px;">操作</th>
|
</tr>
|
</thead>
|
<tbody>
|
<tr v-for="(item, index) in costDetailInfo.costDetails">
|
<td>{{(costDetailInfo.paginationInfo.currentPage - 1) * costDetailInfo.paginationInfo.rows + index + 1}}</td>
|
<td>{{item.flowCode || '--'}}</td>
|
<td>{{item.communityCode || '--'}}</td>
|
<td>{{item.communityName || '--'}}</td>
|
<td>{{item.date || '--'}}</td>
|
<td>{{item.projectContent || '--'}}</td>
|
<td>{{item.managementAmount || '--'}}</td>
|
<td>{{item.managementStamped == '1' ? '是' : '否'}}</td>
|
<td>{{item.committeeAmount || '--'}}</td>
|
<td>{{item.appraisalAmount || '--'}}</td>
|
<td>{{item.committeeStamped == '1' ? '是' : '否'}}</td>
|
<td>{{item.approvalDepartment || '--'}}</td>
|
<td>{{item.fundTypeLevel1 || '--'}}</td>
|
<td>{{item.fundTypeLevel2 || '--'}}</td>
|
<td>{{item.buildingType || '--'}}</td>
|
<td>{{item.maintenanceType || '--'}}</td>
|
<td>
|
<a href="javascript:void(0)" v-on:click="_viewCostDetail(item)">详情</a>
|
<a href="javascript:void(0)" v-on:click="_viewMore(item)">更多</a>
|
<a href="javascript:void(0)" v-on:click="_editCostDetail(item)">编辑</a>
|
<a href="javascript:void(0)" v-on:click="_deleteCostDetail(item)">删除</a>
|
</td>
|
</tr>
|
<tr v-if="costDetailInfo.costDetails.length == 0">
|
<td colspan="17" style="text-align: center; color: #999;">暂无数据</td>
|
</tr>
|
</tbody>
|
</table>
|
|
<!-- 分页栏 -->
|
<div class="pagination">
|
<span class="pagination-info">共{{costDetailInfo.paginationInfo.dataCount || 0}}条记录</span>
|
<div class="pagination-controls">
|
<select class="page-size-select" v-model="costDetailInfo.paginationInfo.rows" v-on:change="_changePageSize()">
|
<option value="15">15</option>
|
<option value="30">30</option>
|
<option value="50">50</option>
|
<option value="100">100</option>
|
</select>
|
<span class="page-size-label">/页</span>
|
<button class="page-btn" v-on:click="_goToPage(costDetailInfo.paginationInfo.currentPage - 1)"
|
:disabled="costDetailInfo.paginationInfo.currentPage == 1">‹</button>
|
<button class="page-btn" v-for="page in costDetailInfo.paginationInfo.pageList"
|
:class="{active: page.currentPage}"
|
v-on:click="_goToPage(page.page)"
|
v-if="page.pageView != '...'">
|
{{page.pageView}}
|
</button>
|
<span v-for="page in costDetailInfo.paginationInfo.pageList"
|
v-if="page.pageView == '...'"
|
class="page-ellipsis">...</span>
|
<button class="page-btn" v-on:click="_goToPage(costDetailInfo.paginationInfo.currentPage + 1)"
|
:disabled="costDetailInfo.paginationInfo.currentPage == costDetailInfo.paginationInfo.total">›</button>
|
<span class="jump-label">跳转至</span>
|
<input type="number" class="jump-input" v-model="costDetailInfo.jumpPage" min="1" :max="costDetailInfo.paginationInfo.total" />
|
<span class="page-label">页</span>
|
<button class="page-btn" v-on:click="_jumpToPage()">确定</button>
|
</div>
|
</div>
|
</div>
|
