|
@@ -1,11 +1,66 @@
|
|
|
<template>
|
|
|
-<div>
|
|
|
-
|
|
|
- <common @asynCallBack="asynCallBack"></common>
|
|
|
- <top-header :pageTitle="pageTitle" ></top-header>
|
|
|
-
|
|
|
-
|
|
|
- <div class="mui-content vongi-qingjiadt">
|
|
|
+ <div>
|
|
|
+ <common @asynCallBack="asynCallBack"></common>
|
|
|
+ <top-header :pageTitle="pageTitle"></top-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>物业服务费</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>00000000</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">
|
|
|
+ <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="mui-content vongi-qingjiadt">
|
|
|
<form class="mui-input-group vongi-cd-payli">
|
|
|
<div class="mui-input-row flew-sp">
|
|
|
<h3>{{detail.body}}</h3>
|
|
@@ -29,83 +84,72 @@
|
|
|
<span>{{detail.payTime}}</span>
|
|
|
</div>
|
|
|
</form>
|
|
|
- </div>
|
|
|
- <loading :visible="isLoading"></loading>
|
|
|
-
|
|
|
-</div>
|
|
|
+ </div> -->
|
|
|
+ <loading :visible="isLoading"></loading>
|
|
|
+ </div>
|
|
|
</template>
|
|
|
|
|
|
|
|
|
|
|
|
<script>
|
|
|
- import * as API_Pay from '$project/apis/payment'
|
|
|
- import Common from '$project/components/Common.vue'
|
|
|
- import Loading from '$project/components/Loading.vue'
|
|
|
- import TopHeader from '$project/components/TopHeader.vue'
|
|
|
-
|
|
|
- import {
|
|
|
- mapGetters,
|
|
|
- mapMutations
|
|
|
- } from 'vuex'
|
|
|
-
|
|
|
- import {
|
|
|
-
|
|
|
-
|
|
|
- } from '$project/utils'
|
|
|
- export default {
|
|
|
- name: 'MasterMineBillInfo',
|
|
|
- components: {
|
|
|
- Common,
|
|
|
- Loading,
|
|
|
- TopHeader
|
|
|
- },
|
|
|
- data() {
|
|
|
- return {
|
|
|
- pageTitle: '账单详情',
|
|
|
-
|
|
|
- qrCodeImg:"",
|
|
|
- isLoading: false,
|
|
|
- detail:{},
|
|
|
- list:[],
|
|
|
- goodsTpey:{},
|
|
|
- id:''
|
|
|
-
|
|
|
- }
|
|
|
- },
|
|
|
- created() {
|
|
|
- this.id=this.$route.query.id;
|
|
|
-
|
|
|
- },
|
|
|
- methods: {
|
|
|
- getDetail(){
|
|
|
- API_Pay.orderDetail({id:this.id}).then(res=>{
|
|
|
- this.detail=res.orderInfo;
|
|
|
- this.info=res.goodsTpey;
|
|
|
- this.goodsTpey=res.goodsTpey;
|
|
|
-
|
|
|
- this.list=JSON.parse(res.orderInfo.detail);
|
|
|
- }).catch(error => {
|
|
|
-
|
|
|
- })
|
|
|
- }
|
|
|
-
|
|
|
- ,asynCallBack(){},
|
|
|
- },
|
|
|
- mounted() {
|
|
|
- this.getDetail();
|
|
|
- },
|
|
|
- destroyed() {
|
|
|
-
|
|
|
- },
|
|
|
- computed: {
|
|
|
- ...mapGetters({
|
|
|
- openId: 'wx_openid',
|
|
|
- token: 'token',
|
|
|
- person_data: 'person_data',
|
|
|
- person_popedom: 'person_popedom',
|
|
|
- })
|
|
|
- }
|
|
|
- }
|
|
|
+import * as API_Pay from "$project/apis/payment";
|
|
|
+import Common from "$project/components/Common.vue";
|
|
|
+import Loading from "$project/components/Loading.vue";
|
|
|
+import TopHeader from "$project/components/TopHeader.vue";
|
|
|
+
|
|
|
+import { mapGetters, mapMutations } from "vuex";
|
|
|
+
|
|
|
+import {} from "$project/utils";
|
|
|
+export default {
|
|
|
+ name: "MasterMineBillInfo",
|
|
|
+ components: {
|
|
|
+ Common,
|
|
|
+ Loading,
|
|
|
+ TopHeader,
|
|
|
+ },
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ pageTitle: "账单详情",
|
|
|
+
|
|
|
+ qrCodeImg: "",
|
|
|
+ isLoading: false,
|
|
|
+ detail: {},
|
|
|
+ list: [],
|
|
|
+ goodsTpey: {},
|
|
|
+ id: "",
|
|
|
+ };
|
|
|
+ },
|
|
|
+ created() {
|
|
|
+ this.id = this.$route.query.id;
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ getDetail() {
|
|
|
+ API_Pay.orderDetail({ id: this.id })
|
|
|
+ .then((res) => {
|
|
|
+ this.detail = res.orderInfo;
|
|
|
+ this.info = res.goodsTpey;
|
|
|
+ this.goodsTpey = res.goodsTpey;
|
|
|
+
|
|
|
+ this.list = JSON.parse(res.orderInfo.detail);
|
|
|
+ })
|
|
|
+ .catch((error) => {});
|
|
|
+ },
|
|
|
+
|
|
|
+ asynCallBack() {},
|
|
|
+ },
|
|
|
+ mounted() {
|
|
|
+ this.getDetail();
|
|
|
+ },
|
|
|
+ destroyed() {},
|
|
|
+ computed: {
|
|
|
+ ...mapGetters({
|
|
|
+ openId: "wx_openid",
|
|
|
+ token: "token",
|
|
|
+ person_data: "person_data",
|
|
|
+ person_popedom: "person_popedom",
|
|
|
+ }),
|
|
|
+ },
|
|
|
+};
|
|
|
</script>
|
|
|
|
|
|
<style scoped src="$project/assets/css/xpwyfyy.css"></style>
|