新增财务账单列表、账单详情

src/assets/css/xpwyfyy.css

@@ -79,7 +79,9 @@ body {
 .margin10 {
 	margin-bottom: 10px
 }
-
+.marginl5{
+	margin-left:5px
+}
 .marginbo,
 .vongi-notice.marginbo {
 	margin-bottom: 0
@@ -480,7 +482,13 @@ body {
 .fyy-footer button {
 	font-size: 16px
 }
-
+.fyy-footer.vongi-footer button{
+	font-size:14px;
+	padding:5px 20px
+}
+.fyy-footer.vongi-footer .mui-right{
+	text-align: right;
+}
 .fyy-footer .bindfyy-btn {
 	width: 100%;
 	margin: 0 auto
@@ -4198,8 +4206,8 @@ h3 {
     overflow: hidden;
     display: flex;
     flex-wrap: wrap;
-	height: 41px;
-	border-top: 1px #eee solid;
+    height: 41px;
+    border-top: 1px #eee solid;
 }
 .vongi-top-bread button{
 	position:absolute;
@@ -4221,7 +4229,7 @@ h3 {
 	flex-wrap: wrap;
 	background:#ffffff;
 	border-top:1px #eee solid;
-    padding: 5px 38px 5px 0;
+	padding: 5px 38px 5px 0;
 	width:100%
 }
 .vongi-top-bread-list .vongi-top-bread button{

src/projects/business/views/Master/Property/Cost/List.vue

@@ -1,6 +1,43 @@
 <template>
 <div>
-
+    <header class="mui-bar mui-bar-nav">
+			<h1 class="mui-title">物业账单</h1>
+			<a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left"></a>
+		</header>
+		<div class="mui-content vongi-hdsq  vongi-admin-kqtj">
+			<div class="fyy-temper-date">
+				<a href="" class="mui-col-xs-6">缴费状态<span class="mui-icon iconfont icon-xiajiantou"></span></a>
+				<a href="" class="mui-col-xs-6">2020-12<span class="mui-icon iconfont icon-xiajiantou"></span></a>
+			</div>
+			<div class="mui-slider-group">
+				<ul class="mui-table-view">
+					<li class="mui-table-view-cell">
+						<a href="">
+							<div class="mui-media-body mui-ellipsis">
+								缴费单位：荆州万乘企业管理咨询有限公司
+							</div>
+							<div class='mui-ellipsis'>账单总额：<b class="colorfe616c">￥121907.50</b></div>
+							<p class='flew-sp flew-items'>
+								推送时间：2020-10-10 10:00
+								<button type="button" class="mui-btn mui-btn-yellow mui-btn-outlined">未支付</button>
+							</p>
+						</a>
+					</li>
+					<li class="mui-table-view-cell">
+						<a href="">
+							<div class="mui-media-body mui-ellipsis">
+								缴费单位：荆州万乘企业管理咨询有限公司
+							</div>
+							<div class='mui-ellipsis'>账单总额：<b class="colorfe616c">￥121907.50</b></div>
+							<p class='flew-sp flew-items'>
+								推送时间：2020-10-10 10:00
+								<button type="button" class="mui-btn mui-btn-green mui-btn-outlined">已支付</button>
+							</p>
+						</a>
+					</li>
+				</ul>
+			</div>
+		</div>		
 </div>
 </template>
 
@@ -8,6 +45,7 @@
 </script>
 
 <style scoped src="$project/assets/css/xpwyfyy.css"></style>
+<style scoped src="$project/assets/css/sczpfyy.css"></style>
 <style src="$project/assets/css/iconfont.css"></style>
 <style>
 </style>

src/projects/business/views/Master/Property/Cost/Pay.vue

@@ -1,6 +1,90 @@
 <template>
 <div>
-
+    <header class="mui-bar mui-bar-nav">
+				<a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left"></a>
+				<h1 class="mui-title">账单详情</h1>
+			</header>
+			<div class="mui-content vongi-pay vongi-qingjiadt">
+				<div class="vongi-center mui-content-padded margin30">
+					<div class="vongi-zd vongi-zdto flew-items">
+						<img src="~$project/assets/img/payli.png" width="24">
+						<h3>11月半年度账单</h3>
+					</div>
+					<h1 class="margin10">121907.50</h1>
+					<h4 class="color55f868">已支付</h4>
+				</div>
+				<form class="mui-input-group">
+					
+					<div class="mui-input-row">
+						<label>缴费单位</label>
+						<span>荆州万乘企业管理咨询有限公司</span>
+					</div>
+                    <div class="mui-input-row">
+						<label>推送用户</label>
+						<span>陈冲</span>
+					</div>
+                    <div class="mui-input-row">
+						<label>付款方式</label>
+						<span class="color55f868">微信支付</span>
+					</div>
+					<div class="mui-input-row">
+						<label>订单号</label>
+						<span>00000000</span>
+					</div>
+					<div class="mui-input-row">
+						<label>创建时间</label>
+						<span>2020-11-28 14:13</span>
+					</div>
+                    <div class="mui-input-row">
+						<label>缴费时间</label>
+						<span>2020-11-28 14:13</span>
+					</div>			
+				</form>
+				<ul class="mui-table-view openfyy-list margin60">
+					<li class="mui-table-view-cell mui-collapse">
+						<a class="mui-navigate-right" href="#">账单明细</a>
+						<div class="mui-collapse-content">
+							<ul class="mui-table-view vongi-pay-list openfyy-list">
+								<li class="mui-table-view-cell">
+									<div class=" mui-card-content-inner flew-sp">
+										<div class="mui-media-body">
+											<div class='mui-ellipsis flew-sp flew-items'><span class="color4fc5f7">电费</span>(22733-22678=55度)</div>
+											<p>生活缴费</p>
+										</div>
+										<span class="mui-h2">56.06元</span>
+									</div>
+									<p class="mui-card-footer">起止日期:2020-11-20至2021-05-19</p>
+								</li>
+								<li class="mui-table-view-cell">
+									<div class=" mui-card-content-inner flew-sp">
+										<div class="mui-media-body">
+											<div class='mui-ellipsis flew-sp flew-items'><span class="color4fc5f7">电费</span>(22733-22678=55度)</div>
+											<p>生活缴费</p>
+										</div>
+										<span class="mui-h2">56.06元</span>
+									</div>
+									<p class="mui-card-footer">起止日期:2020-11-20至2021-05-19</p>
+								</li>
+							</ul>
+						</div>
+					</li>					
+				</ul>
+				
+			</div>
+			<div class="fyy-footer vongi-footer">
+				<div class="vongi-yjbtn mui-right">
+					<button type="submit" class="mui-btn mui-btn-primary mui-btn-outlined marginl5">支付宝</button>
+					<button type="submit" class="mui-btn mui-btn-green mui-btn-outlined marginl5">微信支付</button>
+				</div>
+			</div>
+			<!--弹窗-->
+			<div class="mui-popup mui-popup-in vongi-mui-pop">
+				<div class="mui-popup-inner vongi-pop-inner">
+					<img src="~$project/assets/img/huodoma.png" width="100%"/>
+					<img src="~$project/assets/img/paywx.png" width="100"/>
+				</div>
+			</div>
+			<div class="mui-popup-backdrop mui-active"></div>
 </div>
 </template>