提交 4e0021a5 authored 作者: 宋雄's avatar 宋雄

对接接口

{
"pages": [{
"pages": [ {
"path": "pages/home/index",
"style": {
"navigationBarTitleText": "首页",
......@@ -92,6 +92,12 @@
"navigationBarTitleText": "维修提交审核",
"navigationBarBackgroundColor": "#ffffff"
}
},{
"path": "pages/maintenanceDetails/index",
"style": {
"navigationBarTitleText": "维修评价",
"navigationBarBackgroundColor": "#ffffff"
}
}, {
"path": "pages/complaints/index",
"style": {
......@@ -120,21 +126,64 @@
"style": {
"navigationBarTitleText": "物业费"
}
},{
}, {
"path": "pages/payCostRecord/index",
"style": {
"navigationBarTitleText": "缴费记录"
}
},{
}, {
"path": "pages/payCostDetails/index",
"style": {
"navigationBarTitleText": "缴费详情"
}
},{
}, {
"path": "pages/payCostStatistical/index",
"style": {
"navigationBarTitleText": "历史缴费统计"
}
}, {
"path": "pages/myHouse/index",
"style": {
"navigationBarTitleText": "我的房屋认证",
"navigationBarBackgroundColor": "#ffffff"
}
}, {
"path": "pages/myHouseDetails/index",
"style": {
"navigationBarTitleText": "房屋信息",
"navigationBarBackgroundColor": "#ffffff"
}
}, {
"path": "pages/myRefund/index",
"style": {
"navigationBarTitleText": "我的退款"
}
}, {
"path": "pages/myRefundDetails/index",
"style": {
"navigationBarTitleText": "退款详情"
}
}, {
"path": "pages/myReceipt/index",
"style": {
"navigationBarTitleText": "我的收据"
}
},{
"path": "pages/myPaycost/index",
"style": {
"navigationBarTitleText": "我的缴费记录"
}
}, {
"path": "pages/myPaycostDetails/index",
"style": {
"navigationBarTitleText": "缴费详情"
}
},{
"path": "pages/myInformation/index",
"style": {
"navigationBarTitleText": "个人信息",
"navigationBarBackgroundColor": "#ffffff"
}
}
],
"globalStyle": {
......
......@@ -20,6 +20,36 @@
</view>
</view>
</view>
<view class="information" @click="toDetails()">
<view class="title gray">浴霸不出水了<view class="tag">已评价</view><view class="tag">已完成</view>
</view>
<view class="content">
<view class="item">
<view class="name">报修地址</view>
<view class="detail">汉江之星小区101栋2单元401</view>
</view>
<view class="item">
<view class="name">报修物品</view>
<view class="detail">水暖-浴霸</view>
</view>
<view class="item">
<view class="name">预约上门时间</view>
<view class="detail">2021/09/09 13:00 - 14:00</view>
</view>
<view class="item">
<view class="name">维修员</view>
<view class="detail">张三</view>
</view>
<view class="item">
<view class="name">联系方式</view>
<view class="detail">15415234562</view>
</view>
<view class="item">
<view class="name">评价</view>
<view class="detail"><uni-rate :value="4" :size="20" /></view>
</view>
</view>
</view>
</view>
</view>
<view class="form-submit-fixed">
......@@ -119,12 +149,24 @@ export default {
font-weight: bold;
margin-bottom: 30rpx;
.evaluation{
font-size: 22rpx;
padding: 2rpx 20rpx;
border-radius: 30rpx;
display: inline-block;
float: right;
margin-left: 20rpx;
color: #ffffff;
background-color: #6A59F2;
border: 1px solid #6A59F2;
}
.tag {
font-size: 22rpx;
padding: 2rpx 20rpx;
border-radius: 30rpx;
display: inline-block;
float: right;
margin-left: 20rpx;
}
}
......@@ -184,6 +226,7 @@ export default {
.item {
display: flex;
align-items: center;
height: 70rpx;
line-height: 70rpx;
......
<template>
<view class="container">
<view class="page">
<view class="maintenance">
<view class="information">
<view class="evaluation">
<view class="rate">
<view class="name">评价:</view><uni-rate v-model="rateValue" @change="onChange" :size="20" />
</view>
<view class="textarea"><uni-easyinput type="textarea" v-model="evaluation"
placeholder="请输入您的评价" /></uni-easyinput></view>
</view>
<view class="content">
<view class="item">
<view class="name">报修地址</view>
<view class="detail">汉江之星小区01栋2单元402</view>
</view>
<view class="item">
<view class="name">维修物品</view>
<view class="detail">电梯</view>
</view>
<view class="item">
<view class="name">标题</view>
<view class="detail">电梯坏了</view>
</view>
<view class="item">
<view class="name">手机号码</view>
<view class="detail">16589000078</view>
</view>
<view class="item">
<view class="name">预约上门时间</view>
<view class="detail">2022/09/09 14: 00 -16:00</view>
</view>
<view class="item text">
<view class="name">问题描述</view>
<view class="detail">9月9号上午电梯突然无法运行9月9号上午电梯突然无法运行9月9号上午电梯突然无法运行</view>
</view>
<view class="item text">
<view class="name">附件</view>
<view class="image">
<image src="../../static/images/img02.png" class="icon"></image>
<image src="../../static/images/img03.png" class="icon"></image>
</view>
</view>
</view>
</view>
<view class="form-submit">提交</view>
</view>
</view>
</view>
</template>
<script>
export default {
data() {
return {
rateValue: 3,
evaluation: ''
}
},
methods: {
onChange(e) {
console.log('rate发生改变:' + JSON.stringify(e))
// console.log(this.rateValue);
}
},
onLoad() {
},
onShow() {
}
}
</script>
<style>
page {
background-color: #F8F6F9;
}
</style>
<style lang="scss" scoped>
.page {
padding: 30rpx;
}
.maintenance {
.evaluation {
.rate {
display: flex;
align-items: center;
margin-bottom: 30rpx;
.name {
font-size: 28rpx;
color: #373737;
}
}
.textarea {
background-color: #F8F8F8;
}
}
.information {
background-color: #ffffff;
border-radius: 16rpx;
padding: 30rpx;
margin-bottom: 30rpx;
.content {
margin-top: 20rpx;
.item {
display: flex;
height: 70rpx;
line-height: 70rpx;
.name {
width: 35%;
font-size: 28rpx;
color: #CECED3;
}
.detail {
width: 65%;
font-size: 28rpx;
color: #373737;
}
}
.text {
height: auto;
.detail {
line-height: 52rpx;
}
.image {
display: flex;
.icon {
width: 120rpx;
height: 120rpx;
border-radius: 10rpx;
margin-right: 10rpx;
}
}
}
}
}
}
.form-submit {
height: 80rpx;
line-height: 80rpx;
background-color: #6A59F2;
border-radius: 80rpx;
width: 100%;
text-align: center;
font-size: 28rpx;
color: #FFFFFF;
margin-bottom: 30rpx;
}
</style>
\ No newline at end of file
......@@ -7,56 +7,56 @@
<view class="phone">15245214563</view>
</view>
<view class="service">
<view class="item">
<view class="item" @click="quickEntry(1)">
<view class="left">
<image src="../../static/images/user01.png" class="icon"></image>
<div class="title">个人资料</div>
</view>
<image src="../../static/images/icon_more.png" class="arrow"></image>
</view>
<view class="item">
<view class="item" @click="quickEntry(2)">
<view class="left">
<image src="../../static/images/user02.png" class="icon"></image>
<div class="title">我的房屋</div>
</view>
<image src="../../static/images/icon_more.png" class="arrow"></image>
</view>
<view class="item" @click="onDetail('/pages/maintenance/index')">
<view class="item" @click="quickEntry(3)">
<view class="left">
<image src="../../static/images/user03.png" class="icon"></image>
<div class="title">我的报修</div>
</view>
<image src="../../static/images/icon_more.png" class="arrow"></image>
</view>
<view class="item">
<view class="item" @click="quickEntry(4)">
<view class="left">
<image src="../../static/images/user04.png" class="icon"></image>
<div class="title">我的投诉</div>
</view>
<image src="../../static/images/icon_more.png" class="arrow"></image>
</view>
<view class="item">
<view class="item" @click="quickEntry(5)">
<view class="left">
<image src="../../static/images/user05.png" class="icon"></image>
<div class="title">缴费记录</div>
</view>
<image src="../../static/images/icon_more.png" class="arrow"></image>
</view>
<view class="item">
<view class="item" @click="quickEntry(6)">
<view class="left">
<image src="../../static/images/user06.png" class="icon"></image>
<div class="title">我的收据</div>
</view>
<image src="../../static/images/icon_more.png" class="arrow"></image>
</view>
<view class="item">
<view class="item" @click="quickEntry(7)">
<view class="left">
<image src="../../static/images/user07.png" class="icon"></image>
<div class="title">切换物业公司</div>
</view>
<image src="../../static/images/icon_more.png" class="arrow"></image>
</view>
<view class="item">
<view class="item" @click="quickEntry(8)">
<view class="left">
<image src="../../static/images/user08.png" class="icon"></image>
<div class="title">维修员</div>
......@@ -78,7 +78,38 @@
methods: {
onDetail(url) {
uni.navigateTo({url});
}
},
quickEntry(type) {
if (type == 1) {
uni.navigateTo({
url: '/pages/myInformation/index',
});
} else if (type == 2) {
uni.navigateTo({
url: '/pages/myHouse/index',
});
} else if (type == 3) {
uni.navigateTo({
url: '/pages/maintenance/index',
});
} else if (type == 4) {
uni.navigateTo({
url: '/pages/complaints/index',
});
} else if (type == 5) {
uni.navigateTo({
url: '/pages/myPaycost/index',
});
} else if (type == 6) {
uni.navigateTo({
url: '/pages/myReceipt/index',
});
} else if (type == 7) {
uni.navigateTo({
url: '/pages/community/index',
});
}
},
},
onLoad() {
......
<template>
<view class="container">
<view class="page">
<view class="house">
<view class="information" @click="toDetails()">
<view class="title green">十堰汉江之星小区<view class="tag">认证成功</view>
</view>
<view class="content">
<view class="item">
<view class="name">业主</view>
<view class="detail">张三123</view>
</view>
<view class="item">
<view class="name">房屋状态</view>
<view class="detail">自住</view>
</view>
<view class="item">
<view class="name">房间号</view>
<view class="detail">101栋2单元1401</view>
</view>
<view class="item">
<view class="name">物业公司</view>
<view class="detail">汉江之星物业公司</view>
</view>
</view>
</view>
<view class="information" @click="toDetails()">
<view class="title yellow">十堰阳光花园小区<view class="tag">认证中</view>
</view>
<view class="content">
<view class="item">
<view class="name">业主</view>
<view class="detail">张三123</view>
</view>
<view class="item">
<view class="name">房屋状态</view>
<view class="detail">自住</view>
</view>
<view class="item">
<view class="name">房间号</view>
<view class="detail">101栋2单元1401</view>
</view>
<view class="item">
<view class="name">物业公司</view>
<view class="detail">汉江之星物业公司</view>
</view>
</view>
</view>
<view class="information">
<view class="title red">十堰阳光花园小区<view class="tag">认证失败</view>
</view>
<view class="content">
<view class="item">
<view class="name">业主</view>
<view class="detail">张三123</view>
</view>
<view class="item">
<view class="name">房屋状态</view>
<view class="detail">自住</view>
</view>
<view class="item">
<view class="name">房间号</view>
<view class="detail">101栋2单元1401</view>
</view>
<view class="item">
<view class="name">物业公司</view>
<view class="detail">汉江之星物业公司</view>
</view>
<view class="item">
<view class="name">失败原因</view>
<view class="detail">手机号码错误</view>
</view>
</view>
</view>
</view>
</view>
<view class="form-submit-fixed">
<view class="form-submit" @click="toEditor()">添加房屋</view>
</view>
</view>
</template>
<script>
export default {
data() {
return {}
},
methods: {
toEditor() {
uni.navigateTo({
url: '/pages/housing/index',
});
},
toDetails() {
uni.navigateTo({
url: '/pages/myHouseDetails/index',
});
}
},
onLoad() {
},
onShow() {
}
}
</script>
<style>
page {
background-color: #F8F6F9;
}
</style>
<style lang="scss" scoped>
.page {
padding: 30rpx 30rpx 90rpx;
background-color: #F8F6F9;
}
.house {
.information {
background-color: #ffffff;
border-radius: 16rpx;
padding: 30rpx;
margin-bottom: 30rpx;
.title {
height: 40rpx;
line-height: 40rpx;
padding-left: 20rpx;
font-size: 32rpx;
color: #373737;
font-weight: bold;
margin-bottom: 30rpx;
.tag {
width: 136rpx;
text-align: center;
height: 36rpx;
line-height: 36rpx;
font-size: 22rpx;
border-radius: 30rpx;
float: right;
}
}
.red {
border-left: 2px solid #F42E2E;
.tag {
color: #F42E2E;
border: 1px solid #F42E2E;
background-color: #FFF5F5;
}
}
.green {
border-left: 2px solid #10D680;
.tag {
color: #10D680;
border: 1px solid #10D680;
background-color: #F1FFF9;
}
}
.gray {
border-left: 2px solid #B6B6BA;
.tag {
color: #B6B6BA;
border: 1px solid #B6B6BA;
background-color: #F8F8F8;
}
}
.yellow {
border-left: 2px solid #F1BE51;
.tag {
color: #F1BE51;
border: 1px solid #F1BE51;
background-color: #FFFCF6;
}
}
.content {
border-top: 1px solid #F0F0F2;
padding-top: 20rpx;
.item {
display: flex;
height: 70rpx;
line-height: 70rpx;
.name {
width: 35%;
font-size: 28rpx;
color: #CECED3;
}
.detail {
font-size: 28rpx;
color: #373737;
}
}
}
}
}
.form-submit-fixed {
position: fixed;
width: 100%;
bottom: 10rpx;
}
.form-submit {
margin: 0 30rpx;
box-sizing: border-box;
height: 80rpx;
line-height: 80rpx;
background-color: #6A59F2;
border-radius: 80rpx;
text-align: center;
font-size: 28rpx;
color: #FFFFFF;
}
</style>
\ No newline at end of file
<template>
<view class="container">
<view class="page">
<view class="house">
<view class="details">
<view class="item">
<view class="name">物业公司</view>
<view class="detail">汉江之星物业公司</view>
</view>
<view class="item">
<view class="name">小区</view>
<view class="detail">十堰汉江之星小区</view>
</view>
<view class="item">
<view class="name">房屋ID</view>
<view class="detail">25845628</view>
</view>
<view class="item">
<view class="name">楼栋</view>
<view class="detail">9号楼</view>
</view>
<view class="item">
<view class="name">单元</view>
<view class="detail">1单元</view>
</view>
<view class="item">
<view class="name">房屋编号</view>
<view class="detail">1-1</view>
</view>
<view class="item">
<view class="name">房屋用途</view>
<view class="detail">商用</view>
</view>
<view class="item">
<view class="name">户型</view>
<view class="detail">两室一厅一厨一卫</view>
</view>
<view class="item">
<view class="name">建筑面积</view>
<view class="detail">95平方米</view>
</view>
<view class="item">
<view class="name">房屋状态</view>
<view class="detail green">
<view class="tag">认证成功</view>
</view>
</view>
<view class="item">
<view class="name">房屋状态</view>
<view class="detail red">
<view class="tag">认证失败</view>
</view>
</view>
</view>
</view>
<view class="form-submit" @click="toEditor()">解除绑定/修改</view>
<view class="form-delete" @click="deleteDialog">删除</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: {
deleteDialog() {
this.$refs.popup.open()
},
toEditor() {
// uni.navigateTo({
// url: '/pages/housing/index',
// });
}
},
onLoad() {
},
onShow() {
}
}
</script>
<style>
page {
background-color: #FFFFFF;
}
</style>
<style lang="scss" scoped>
.page {
padding: 30rpx 30rpx 90rpx;
}
.house {
.details {
background-color: #ffffff;
border-radius: 16rpx;
padding: 30rpx;
margin-bottom: 30rpx;
.yellow {
border-left: 2px solid #F1BE51;
.tag {
color: #F1BE51;
border: 1px solid #F1BE51;
background-color: #FFFCF6;
}
}
.item {
display: flex;
height: 84rpx;
line-height: 84rpx;
justify-content: space-between;
border-bottom: 1px solid #F0F0F2;
align-items: center;
.name {
font-size: 28rpx;
color: #CECED3;
}
.detail {
font-size: 28rpx;
color: #373737;
.tag {
width: 130rpx;
text-align: center;
height: 36rpx;
line-height: 36rpx;
font-size: 22rpx;
border-radius: 30rpx;
}
}
}
.red {
.tag {
color: #F42E2E;
border: 1px solid #F42E2E;
background-color: #FFF5F5;
}
}
.green {
.tag {
color: #10D680;
border: 1px solid #10D680;
background-color: #F1FFF9;
}
}
.gray {
.tag {
color: #B6B6BA;
border: 1px solid #B6B6BA;
background-color: #F8F8F8;
}
}
}
}
.form-submit {
height: 80rpx;
line-height: 80rpx;
background-color: #6A59F2;
border-radius: 80rpx;
width: 100%;
text-align: center;
font-size: 28rpx;
color: #FFFFFF;
margin-bottom: 30rpx;
}
.form-delete {
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;
}
</style>
\ No newline at end of file
<template>
<view class="container">
<view class="page">
<view class="information">
<view class="form">
<uni-forms>
<view class="form-item">
<view class="form-item-fl">
头像
</view>
<view class="form-item-fr">
<image src="../../static/images/img01.png" class="icon"></image>
<uni-icons type="forward" color="#E4E4EA"></uni-icons>
</view>
</view>
<view class="form-item">
<view class="form-item-fl">
姓名
</view>
<view class="form-item-fr">
<input class="form-item-tit" v-model="formData.name" focus placeholder="请输入姓名" />
</view>
</view>
<view class="form-item">
<view class="form-item-fl">
性别
</view>
<view class="form-item-fr">
<uni-data-checkbox v-model="formData.sex" :localdata="sexs" class="form-item-tit" />
</view>
</view>
<view class="form-item">
<view class="form-item-fl">
年龄
</view>
<view class="form-item-fr">
<input class="form-item-tit" v-model="formData.name1" focus placeholder="请输入年龄" />
</view>
</view>
<view class="form-item">
<view class="form-item-fl">
<view class="asterisk">*</view>手机号码
</view>
<view class="form-item-fr">
<input class="form-item-tit" v-model="formData.name1" focus placeholder="请输入手机号码" />
</view>
</view>
<view class="form-item">
<view class="form-item-fl">
地址
</view>
<view class="form-item-fr">
<input class="form-item-tit" v-model="formData.name1" focus placeholder="请输入地址" />
</view>
</view><strong></strong>
</uni-forms>
</view>
<view class="form-submit">保存</view>
</view>
</view>
</view>
</template>
<script>
export default {
data() {
return {
formData: {
name: '',
name1: '',
sex: '',
name2: '',
},
sexs: [{
text: '男',
value: 0
}, {
text: '女',
value: 1
}]
}
},
methods: {},
onLoad() {
},
onShow() {
}
}
</script>
<style lang="scss" scoped>
.page {
padding: 30rpx;
}
.information {
.form {
background-color: #ffffff;
border-radius: 16rpx;
padding: 30rpx;
margin-bottom: 30rpx;
.form-item {
display: flex;
align-items: center;
justify-content: space-between;
height: 84rpx;
line-height: 84rpx;
border-bottom: 1px solid #F8F6F9;
overflow: hidden;
}
.form-item-fl {
font-size: 28rpx;
color: #373737;
display: flex;
.asterisk {
color: #F42E2E;
width: 10rpx;
margin-right: 6rpx;
}
}
.form-item-fr {
display: flex;
flex: 2;
align-items: center;
justify-content: flex-end;
margin-left: 20rpx;
.icon {
height: 64rpx;
width: 64rpx;
margin-right: 20rpx;
}
}
.form-item-tit {
font-size: 28rpx;
color: #666;
margin-right: 20rpx;
text-align: right;
}
}
}
.form-submit {
height: 80rpx;
line-height: 80rpx;
background-color: #6A59F2;
border-radius: 80rpx;
width: 100%;
text-align: center;
font-size: 28rpx;
color: #FFFFFF;
}
</style>
\ No newline at end of file
<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
<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
<template>
<view class="container">
<view class="page">
<view class="receipt">
<view class="list">
<view class="item" @click="toDetail()">
<view class="title">
<view class="name">电费:<view class="cost">¥100.00</view>
</view>
<view class="text">2022年3月12日 12:12</view>
</view>
<view class="download">
<image src="../../static/images/download.png" class="icon"></image>
</view>
</view>
<view class="item" @click="toDetail()">
<view class="title">
<view class="name">水费:<view class="cost">¥100.00</view>
</view>
<view class="text">2022年3月12日 12:12</view>
</view>
<view class="download">
<image src="../../static/images/download.png" class="icon"></image>
</view>
</view>
<view class="item" @click="toDetail()">
<view class="title">
<view class="name">物业费:<view class="cost">¥100.00</view>
</view>
<view class="text">2022年3月12日 12:12</view>
</view>
<view class="download">
<image src="../../static/images/download.png" class="icon"></image>
</view>
</view>
</view>
</view>
</view>
</view>
</template>
<script>
export default {
data() {
return {}
},
methods: {
toDetail() {
// uni.navigateTo({
// url: '/pages/payCostDetails/index',
// });
}
},
onLoad() {
},
onShow() {
}
}
</script>
<style>
page {
background-color: #F8F6F9;
}
</style>
<style lang="scss" scoped>
.page {
padding: 30rpx 30rpx 90rpx;
background-color: #F8F6F9;
}
.receipt {
.list {
.item {
background-color: #ffffff;
border-radius: 16rpx;
padding: 30rpx;
margin-bottom: 30rpx;
display: flex;
align-items: center;
justify-content: space-between;
.title {
.name {
font-size: 32rpx;
color: #373737;
display: flex;
font-weight: bold;
.cost {
font-size: 36rpx;
color: #6A59F2;
font-weight: bold;
}
}
.text {
margin-top: 15rpx;
font-size: 28rpx;
color: #9D9CA6;
}
}
.download {
width: 76rpx;
height: 76rpx;
display: flex;
align-items: center;
background-color: #EEECFE;
border-radius: 76rpx;
justify-content: center;
.icon {
width: 40rpx;
height: 40rpx;
}
}
}
}
}
</style>
\ No newline at end of file
<template>
<view class="container">
<view class="page">
<view class="refund">
<view class="list">
<view class="item" @click="toDetail()">
<view class="title gray">
<view class="name">退款金额:<view class="cost">¥100.00</view>
</view>
<view class="tag">退款成功</view>
</view>
<view class="content">
<view class="text">
<view class="name">退款单号</view>
<view class="detail">61312313213</view>
</view>
<view class="text">
<view class="name">退款时间</view>
<view class="detail">2023年3月1日 12:12</view>
</view>
</view>
</view>
<view class="item" @click="toDetail()">
<view class="title yellow">
<view class="name">退款金额:<view class="cost">¥100.00</view>
</view>
<view class="tag">待审核</view>
</view>
<view class="content">
<view class="text">
<view class="name">退款单号</view>
<view class="detail">61312313213</view>
</view>
<view class="text">
<view class="name">退款时间</view>
<view class="detail">2023年3月1日 12:12</view>
</view>
</view>
</view>
</view>
</view>
</view>
</view>
</template>
<script>
export default {
data() {
return {}
},
methods: {
toDetail() {
uni.navigateTo({
url: '/pages/myRefundDetails/index',
});
}
},
onLoad() {
},
onShow() {
}
}
</script>
<style>
page {
background-color: #F8F6F9;
}
</style>
<style lang="scss" scoped>
.page {
padding: 30rpx 30rpx 90rpx;
background-color: #F8F6F9;
}
.refund {
.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: 28rpx;
color: #9D9CA6;
display: flex;
.cost {
font-size: 36rpx;
color: #6A59F2;
font-weight: bold;
}
}
.tag {
width: 136rpx;
text-align: center;
height: 36rpx;
line-height: 36rpx;
font-size: 22rpx;
border-radius: 36rpx;
float: right;
}
}
.gray {
.tag {
color: #B6B6BA;
border: 1px solid #B6B6BA;
background-color: #F8F8F8;
}
}
.yellow {
.tag {
color: #F1BE51;
border: 1px solid #F1BE51;
background-color: #FFFCF6;
}
}
.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
<template>
<view class="container">
<view class="page">
<view class="refund">
<view class="steps-landscape">
<view class="title">退款流程</view>
<uni-steps :options="list2" active-color="#6A59F2" :active="active" direction="column" />
</view>
<view class="information">
<view class="title">退款明细</view>
<view class="content">
<view class="item">
<view class="name">订单编号</view>
<view class="detail">CZ202012261006450001</view>
</view>
<view class="item">
<view class="name">支付方式</view>
<view class="detail">微信支付</view>
</view>
<view class="item">
<view class="name">退款金额</view>
<view class="detail">20</view>
</view>
<view class="item">
<view class="name">退款去向</view>
<view class="detail">原支付账户</view>
</view>
<view class="item">
<view class="name">退款原因</view>
<view class="detail">多退少补</view>
</view>
<view class="item text">
<view class="name">退款时间</view>
<view class="detail"> 2022/4/31 13: 01</view>
</view>
</view>
</view>
</view>
</view>
</view>
</template>
<script>
export default {
data() {
return {
active: 2,
list2: [{
title: '提交退款申请',
desc: '2022/09/09 10:30'
}, {
title: '物业审核中',
desc: '2022/09/09 10:30'
},{
title: '物业同意退款',
desc: '很抱歉给您造成了不好的体验,物业已同意您 的退款申请 2022/09/09 10:30'
},{
title: '退款中',
desc: '平台正在为您退款,将在1-3个工作日退还至您 的支付账户2022/09/09 10:30'
},{
title: '退款成功',
desc: '成功退款,将原路返回您的支付账户2022/09/09 10:30'
}]
}
},
methods: {
},
onLoad() {
},
onShow() {
}
}
</script>
<style>
page {
background-color: #F8F6F9;
}
</style>
<style lang="scss" scoped>
.page {
padding: 30rpx;
}
.refund {
.steps-landscape {
background-color: #ffffff;
border-radius: 16rpx;
padding: 30rpx;
margin-bottom: 30rpx;
.title {
height: 40rpx;
line-height: 40rpx;
padding-left: 20rpx;
border-left: 3px solid #6852F0;
font-size: 32rpx;
color: #373737;
margin-bottom: 20rpx;
}
}
}
.information {
background-color: #ffffff;
border-radius: 16rpx;
padding: 30rpx;
margin-bottom: 30rpx;
.title {
height: 40rpx;
line-height: 40rpx;
padding-left: 20rpx;
border-left: 3px solid #6852F0;
font-size: 32rpx;
color: #373737;
}
.content {
margin-top: 20rpx;
.item {
display: flex;
height: 70rpx;
line-height: 70rpx;
.name {
width: 35%;
font-size: 28rpx;
color: #CECED3;
}
.detail {
width: 65%;
font-size: 28rpx;
color: #373737;
}
}
}
}
.form-submit {
height: 80rpx;
line-height: 80rpx;
background-color: #6A59F2;
border-radius: 80rpx;
width: 100%;
text-align: center;
font-size: 28rpx;
color: #FFFFFF;
margin-bottom: 30rpx;
}
.form-delete {
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;
}
</style>
\ No newline at end of file
......@@ -10,15 +10,14 @@
<view class="title">
<view class="picker on">
<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>
<image src="../../static/images/icon_up.png" class="icon"></image>
</view>
<view class="picker">
<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>
<image src="../../static/images/icon_up.png" class="icon"></image>
</view>
</view>
<view class="content">
......@@ -48,7 +47,7 @@
yearList: ['2023年', '2022年', '2021年'],
month: '',
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: {
categories: ["2023年", "2022年", "2021年"],
series: [{
......
Markdown 格式
0%
您添加了 0 到此讨论。请谨慎行事。
请先完成此评论的编辑!
注册 或者 后发表评论