Skip to content

A
applet
提交 baebf98b authored 作者: 何忠建's avatar 何忠建
浏览文件
操作

个人中心缴费记录

上级 6702c2cb
隐藏空白字符变更
内嵌 并排
正在显示 包含 369 行增加 和 6 行删除
pages.json
浏览文件 @ baebf98b
...@@ -162,6 +162,16 @@ ...@@ -162,6 +162,16 @@
"style": { "style": {
"navigationBarTitleText": "我的收据" "navigationBarTitleText": "我的收据"
} }
},{
"path": "pages/myPaycost/index",
"style": {
"navigationBarTitleText": "我的缴费记录"
}
}, {
"path": "pages/myPaycostDetails/index",
"style": {
"navigationBarTitleText": "缴费详情"
}
} }
], ],
"globalStyle": { "globalStyle": {
......
pages/mine/index.vue
浏览文件 @ baebf98b
...@@ -95,7 +95,7 @@ ...@@ -95,7 +95,7 @@
}); });
} else if (type == 5) { } else if (type == 5) {
uni.navigateTo({ uni.navigateTo({
url: '/pages/payCostRecord/index', url: '/pages/myPaycost/index',
}); });
} else if (type == 6) { } else if (type == 6) {
uni.navigateTo({ uni.navigateTo({
......
pages/myPaycost/index.vue 0 → 100644
浏览文件 @ baebf98b
<template>
<view class="container">
<view class="page">
<view class="paycost">
<view class="screening"><uni-datetime-picker v-model="range" type="daterange" />
</view>
<view class="list">
<view class="item" @click="toDetail()">
<view class="title">
<view class="name">电费</view>
<view class="cost">¥100.00</view>
</view>
<view class="content">
<view class="text">
<view class="name">缴费人</view>
<view class="detail">张一</view>
</view>
<view class="text">
<view class="name">缴费人号码</view>
<view class="detail">15214525682</view>
</view>
<view class="text">
<view class="name">缴费时间</view>
<view class="detail">2023年3月1日 12:12</view>
</view>
<view class="text">
<view class="name">缴费地址</view>
<view class="detail">十堰市张湾区汉江之星小区1栋1302</view>
</view>
</view>
</view>
<view class="item" @click="toDetail()">
<view class="title">
<view class="name">水费</view>
<view class="cost">¥100.00</view>
</view>
<view class="content">
<view class="text">
<view class="name">缴费人</view>
<view class="detail">张一</view>
</view>
<view class="text">
<view class="name">缴费人号码</view>
<view class="detail">15214525682</view>
</view>
<view class="text">
<view class="name">缴费时间</view>
<view class="detail">2023年3月1日 12:12</view>
</view>
<view class="text">
<view class="name">缴费地址</view>
<view class="detail">十堰市张湾区汉江之星小区1栋1302</view>
</view>
</view>
</view>
<view class="item" @click="toDetail()">
<view class="title">
<view class="name">物业费</view>
<view class="cost">¥100.00</view>
</view>
<view class="content">
<view class="text">
<view class="name">缴费人</view>
<view class="detail">张一</view>
</view>
<view class="text">
<view class="name">缴费人号码</view>
<view class="detail">15214525682</view>
</view>
<view class="text">
<view class="name">缴费时间</view>
<view class="detail">2023年3月1日 12:12</view>
</view>
<view class="text">
<view class="name">缴费地址</view>
<view class="detail">十堰市张湾区汉江之星小区1栋1302</view>
</view>
</view>
</view>
</view>
</view>
</view>
</view>
</template>
<script>
export default {
data() {
return {
range: ['', ''],
}
},
methods: {
toDetail() {
uni.navigateTo({
url: '/pages/myPaycostDetails/index',
});
}
},
onLoad() {
},
onShow() {
}
}
</script>
<style>
page {
background-color: #F8F6F9;
}
</style>
<style lang="scss" scoped>
.page {
padding: 30rpx 30rpx 90rpx;
background-color: #F8F6F9;
}
.paycost {
.screening {
margin-bottom: 30rpx;
}
.list {
.item {
background-color: #ffffff;
border-radius: 16rpx;
padding: 30rpx;
margin-bottom: 30rpx;
.title {
height: 40rpx;
line-height: 40rpx;
margin-bottom: 30rpx;
display: flex;
justify-content: space-between;
.name {
font-size: 32rpx;
color: #373737;
display: flex;
font-weight: bold;
}
.cost {
font-size: 36rpx;
color: #6A59F2;
font-weight: bold;
}
}
.content {
border-top: 1px solid #F0F0F2;
padding-top: 20rpx;
.text {
display: flex;
height: 60rpx;
line-height: 60rpx;
.name {
width: 180rpx;
font-size: 28rpx;
color: #9D9CA6;
}
.detail {
font-size: 28rpx;
color: #373737;
}
}
}
}
}
}
</style>
\ No newline at end of file
pages/myPaycostDetails/index.vue 0 → 100644
浏览文件 @ baebf98b
<template>
<view class="container">
<view class="page">
<view class="paycost">
<view class="details">
<view class="title">
<view class="name">
<view class="cost">100</view>元
</view>
<view class="text">汉江之星物业公司</view>
</view>
<view class="content">
<view class="text">
<view class="name">费用类型</view>
<view class="detail">电费</view>
</view>
<view class="text">
<view class="name">订单编号</view>
<view class="detail">1278373332321</view>
</view>
<view class="text">
<view class="name">创建时间</view>
<view class="detail">2021/09/09 13：20 </view>
</view>
<view class="text">
<view class="name">缴费周期</view>
<view class="detail">1月</view>
</view>
<view class="text">
<view class="name">支付时间</view>
<view class="detail"> 2021/11/09 13：20</view>
</view>
<view class="text">
<view class="name">上期度数（度）</view>
<view class="detail">5</view>
</view>
<view class="text">
<view class="name">本期度数（度）</view>
<view class="detail">5</view>
</view>
<view class="text">
<view class="name">用量（度）</view>
<view class="detail">10</view>
</view>
<view class="text">
<view class="name">支付方式</view>
<view class="detail">微信支付</view>
</view>
</view>
</view>
<view class="form-bounced" @click="receipt()">开收据</view>
<view class="form-bounced" @click="receipt()">申请退款</view>
</view>
</view>
<uni-popup ref="popup" type="dialog">
<uni-popup-dialog type="error" cancelText="关闭" confirmText="同意" title="开收据" content="确定要开收据吗？!"
@confirm="dialogConfirm" @close="dialogClose"></uni-popup-dialog>
</uni-popup>
</view>
</template>
<script>
export default {
data() {
return {
}
},
methods: {
receipt() {
this.$refs.popup.open()
},
dialogConfirm() {
this.$refs.popup.close()
},
dialogClose() {
this.$refs.popup.close()
}
},
onLoad() {
},
onShow() {
}
}
</script>
<style>
page {
background-color: #F8F6F9;
}
</style>
<style lang="scss" scoped>
.page {
padding: 30rpx 30rpx 90rpx;
}
.paycost {
.details {
background-color: #ffffff;
border-radius: 16rpx;
padding: 60rpx 30rpx;
margin-bottom: 30rpx;
.title {
margin-bottom: 60rpx;
display: flex;
flex-direction: column;
text-align: center;
align-items: center;
.name {
height: 60rpx;
line-height: 60rpx;
font-size: 28rpx;
color: #6A59F2;
display: flex;
margin-bottom: 25rpx;
.cost {
font-size: 60rpx;
color: #6A59F2;
font-weight: bold;
margin-right: 20rpx;
}
}
.text {
font-size: 28rpx;
color: #373737;
}
}
.content {
border-top: 1px solid #F0F0F2;
padding-top: 20rpx;
.text {
display: flex;
height: 60rpx;
line-height: 60rpx;
justify-content: space-between;
.name {
font-size: 28rpx;
color: #9D9CA6;
}
.detail {
font-size: 28rpx;
color: #373737;
}
}
}
}
}
.form-bounced {
height: 80rpx;
line-height: 80rpx;
background-color: #ffffff;
border: 1px solid #6A59F2;
border-radius: 80rpx;
width: 100%;
text-align: center;
font-size: 28rpx;
color: #6A59F2;
margin-bottom: 30rpx;
}
</style>
\ No newline at end of file
pages/payCostStatistical/index.vue
浏览文件 @ baebf98b
...@@ -10,15 +10,14 @@ ...@@ -10,15 +10,14 @@
<view class="title"> <view class="title">
<view class="picker on"> <view class="picker on">
<picker @change="bindPickerChange" :value="year" :range="yearList"> <picker @change="bindPickerChange" :value="year" :range="yearList">
<view class="uni-input">{{yearList[index]}}</view> <view class="uni-input">{{yearList[index]}}<image src="../../static/images/icon_up.png" class="icon"></image></view>
</picker> </picker>
<image src="../../static/images/icon_up.png" class="icon"></image>
</view> </view>
<view class="picker"> <view class="picker">
<picker @change="bindPickerChange1" :value="month" :range="monthList"> <picker @change="bindPickerChange1" :value="month" :range="monthList">
<view class="uni-input">{{monthList[index1]}}</view> <view class="uni-input">{{monthList[index1]}}<image src="../../static/images/icon_up.png" class="icon"></image></view>
</picker> </picker>
<image src="../../static/images/icon_up.png" class="icon"></image>
</view> </view>
</view> </view>
<view class="content"> <view class="content">
...@@ -48,7 +47,7 @@ ...@@ -48,7 +47,7 @@
yearList: ['2023年', '2022年', '2021年'], yearList: ['2023年', '2022年', '2021年'],
month: '', month: '',
index1: 0, index1: 0,
monthList: ['全部', '1月', '2月', '3月', '4月', '5月', '6月', '7月', '8月', '9月', '10月', '11月', '12月'], monthList: ['全部月份', '1月', '2月', '3月', '4月', '5月', '6月', '7月', '8月', '9月', '10月', '11月', '12月'],
chartData: { chartData: {
categories: ["2023年", "2022年", "2021年"], categories: ["2023年", "2022年", "2021年"],
series: [{ series: [{
......
Markdown 格式
0% 或
您添加了 0 人 到此讨论。请谨慎行事。
请先完成此评论的编辑！
请 注册 或者 后发表评论