|
|
@@ -6,72 +6,71 @@
|
|
|
<image class="picker-item-logo-left" src="../../static/room.png"></image>
|
|
|
</view>
|
|
|
<view class="picker-item-label">已选房间</view>
|
|
|
- <view class="picker-item-content">{{roomSelect}}</view>
|
|
|
+ <view class="picker-item-content" v-if="roomSelect=='请选择宿舍'">{{roomSelect}}</view>
|
|
|
+ <view class="picker-item-content2" v-else>{{roomSelect}}</view>
|
|
|
<view class="picker-item-logor">
|
|
|
<image class="picker-item-logo-right" src="../../static/right.png"></image>
|
|
|
</view>
|
|
|
</view>
|
|
|
<!-- 账单显示区域 -->
|
|
|
<view class="bill">
|
|
|
+ <!-- 筛选框区域 -->
|
|
|
+ <view class="choose">
|
|
|
+ <view class="time">
|
|
|
+ <uni-data-select :clear="false" placeholder="请选择时间" :localdata="time_range" @change="changeTime">
|
|
|
+ </uni-data-select>
|
|
|
+ </view>
|
|
|
+ <view class="type">
|
|
|
+ <uni-data-select :clear="false" placeholder="请选择支付状态" :localdata="type_range" @change="changeType">
|
|
|
+ </uni-data-select>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+
|
|
|
<!-- 没有账单时展示的内容 -->
|
|
|
<view class="null" v-if="!list.length">
|
|
|
<img src="../../static/null.png">
|
|
|
- <span>暂无账单,请选择宿舍查询</span>
|
|
|
+ <span>暂无账单,请选择条件查询</span>
|
|
|
</view>
|
|
|
|
|
|
<!-- 有账单时展示的内容 -->
|
|
|
<view class="has" v-else>
|
|
|
- <!-- 筛选框区域 -->
|
|
|
- <view class="choose">
|
|
|
- <view class="time">
|
|
|
- <uni-data-select placeholder="请选择时间" v-model="time_value" :localdata="time_range"
|
|
|
- @change="changeTime">
|
|
|
- </uni-data-select>
|
|
|
- </view>
|
|
|
- <view class="type">
|
|
|
- <uni-data-select placeholder="请选择支付状态" v-model="type_value" :localdata="type_range"
|
|
|
- @change="changeType">
|
|
|
- </uni-data-select>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
-
|
|
|
<!-- 账单列表区域 -->
|
|
|
<view class="has_bill">
|
|
|
<view class="item" v-for="item in list" :key="item.id">
|
|
|
<view class="item_header">
|
|
|
- {{item.title}}
|
|
|
+ {{item.payMonth+item.paymentItem}}
|
|
|
</view>
|
|
|
<view class="item_box">
|
|
|
<view class="item_box_1">
|
|
|
- 上月表数:{{item.last}}
|
|
|
+ 上月表数:{{item.lastElectry}}
|
|
|
</view>
|
|
|
<view class="item_box_2">
|
|
|
- 本月表数:{{item.current}}
|
|
|
+ 本月表数:{{item.nowElectry}}
|
|
|
</view>
|
|
|
</view>
|
|
|
<view class="item_box">
|
|
|
<view class="item_box_1">
|
|
|
- 用量:{{item.use}}吨
|
|
|
+ 用量:{{item.nowTonnage}}吨
|
|
|
</view>
|
|
|
<view class="item_box_2">
|
|
|
- 补助吨数:{{item.sub}}吨
|
|
|
+ 补助吨数:{{item.subsidiesTonnage}}吨
|
|
|
</view>
|
|
|
</view>
|
|
|
- <view class="item_box" v-if="item.payPeople">
|
|
|
+ <view class="item_box" v-if="item.payItemType=='2'">
|
|
|
<view class="item_box_1">
|
|
|
- 支付人:{{item.payPeople}}
|
|
|
+ 支付人:{{item.cardNumber}}
|
|
|
</view>
|
|
|
</view>
|
|
|
<view class="item_notes">
|
|
|
- 备注:{{item.notes}}
|
|
|
+ 备注:{{item.orderNotice}}
|
|
|
</view>
|
|
|
|
|
|
<view class="item_box">
|
|
|
<view class="item_box_1 font">
|
|
|
- {{item.time}}
|
|
|
+ {{item.payCreateTime}}
|
|
|
</view>
|
|
|
<view class="item_box_2">
|
|
|
- 实付款:{{item.money}}
|
|
|
+ 实付款:{{item.realPayAmount}}
|
|
|
</view>
|
|
|
</view>
|
|
|
|
|
|
@@ -82,7 +81,7 @@
|
|
|
订单反馈
|
|
|
</button>
|
|
|
|
|
|
- <button class="feedback" type="warn" size="mini" disabled v-if="item.payPeople">
|
|
|
+ <button class="feedback" type="warn" size="mini" disabled v-if="item.payItemType=='2'">
|
|
|
已支付
|
|
|
</button>
|
|
|
|
|
|
@@ -93,7 +92,14 @@
|
|
|
</view>
|
|
|
</view>
|
|
|
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
|
|
|
+ <!-- 电话区域按钮 -->
|
|
|
+ <view class="phone">
|
|
|
+ <view class="phone_box">
|
|
|
+ 咨询电话:
|
|
|
+ <span @click="handlePhone">82293462</span>
|
|
|
</view>
|
|
|
</view>
|
|
|
|
|
|
@@ -181,69 +187,25 @@
|
|
|
nx: 0,
|
|
|
ny: 0,
|
|
|
// 账单数据
|
|
|
- list: [{
|
|
|
- id: 1,
|
|
|
- title: "2022年9月水费账单",
|
|
|
- last: 0,
|
|
|
- current: 22,
|
|
|
- use: 22,
|
|
|
- sub: 15,
|
|
|
- notes: "水费为3.2元/吨",
|
|
|
- time: "2022-09-20 15:25:28",
|
|
|
- money: 14.66,
|
|
|
- payPeople: ""
|
|
|
- },
|
|
|
- {
|
|
|
- id: 2,
|
|
|
- title: "2022年6月水费账单",
|
|
|
- last: 66,
|
|
|
- current: 100,
|
|
|
- use: 34,
|
|
|
- sub: 14,
|
|
|
- notes: "水费为3.2元/吨",
|
|
|
- time: "2022-06-20 15:25:28",
|
|
|
- money: 64,
|
|
|
- payPeople: ""
|
|
|
- },
|
|
|
- {
|
|
|
- id: 3,
|
|
|
- title: "2022年5月水费账单",
|
|
|
- last: 100,
|
|
|
- current: 120,
|
|
|
- use: 20,
|
|
|
- sub: 10,
|
|
|
- notes: "水费为3.2元/吨",
|
|
|
- time: "2022-05-20 15:25:28",
|
|
|
- money: 32,
|
|
|
- payPeople: "测试"
|
|
|
- },
|
|
|
- ],
|
|
|
+ list: [],
|
|
|
// 时间筛选框选中值绑定数据
|
|
|
time_value: "",
|
|
|
// 时间筛选框列表绑定数据
|
|
|
- time_range: [{
|
|
|
- value: 0,
|
|
|
- text: "2022"
|
|
|
- },
|
|
|
- {
|
|
|
+ time_range: [],
|
|
|
+ // 支付状态 0是全部 1是未支付 2是已支付
|
|
|
+ pay_type: 0,
|
|
|
+ // 支付状态筛选框列表绑定数据
|
|
|
+ type_range: [{
|
|
|
value: 1,
|
|
|
- text: "2023"
|
|
|
+ text: "全部"
|
|
|
},
|
|
|
{
|
|
|
value: 2,
|
|
|
- text: "2024"
|
|
|
- },
|
|
|
- ],
|
|
|
- // 支付状态筛选框选中值绑定数据
|
|
|
- type_value: "",
|
|
|
- // 支付状态筛选框列表绑定数据
|
|
|
- type_range: [{
|
|
|
- value: 0,
|
|
|
- text: "已支付"
|
|
|
+ text: "未支付"
|
|
|
},
|
|
|
{
|
|
|
- value: 1,
|
|
|
- text: "未支付"
|
|
|
+ value: 3,
|
|
|
+ text: "已支付"
|
|
|
},
|
|
|
],
|
|
|
// 订单反馈弹窗 表格的验证规则
|
|
|
@@ -304,22 +266,46 @@
|
|
|
onLoad() {
|
|
|
// 如果之前已经选择过宿舍,则从缓存中读取
|
|
|
if (localStorage.room) {
|
|
|
- this.roomSelect = localStorage.room
|
|
|
+ this.roomSelect = "黄家湖" + localStorage.room
|
|
|
this.getData()
|
|
|
+ this.getTimeList()
|
|
|
}
|
|
|
},
|
|
|
methods: {
|
|
|
// 获取账单列表数据
|
|
|
- // async
|
|
|
- getData() {
|
|
|
- console.log("获取数据");
|
|
|
- // let res = await this.$myRequest({
|
|
|
- // url: "/payableinfo/payableInfo",
|
|
|
- // data: {
|
|
|
- // pageSize: "999",
|
|
|
- // },
|
|
|
- // });
|
|
|
+ async getData() {
|
|
|
+ if (!this.time_value) {
|
|
|
+ let date = new Date();
|
|
|
+ this.time_value = date.getFullYear()
|
|
|
+ }
|
|
|
+
|
|
|
+ let res = await this.$myRequest({
|
|
|
+ url: "/payableinfowater/queryWaterInfo",
|
|
|
+ data: {
|
|
|
+ dorm: localStorage.room,
|
|
|
+ // dorm: "12栋202",
|
|
|
+ year: this.time_value,
|
|
|
+ payStatu: this.pay_type,
|
|
|
+ },
|
|
|
+ });
|
|
|
+ // console.log(res);
|
|
|
+ if (res.success) {
|
|
|
+ this.list = res.data
|
|
|
+ }
|
|
|
+ },
|
|
|
+ // 获取时间筛选框时间数组
|
|
|
+ async getTimeList() {
|
|
|
+ let res = await this.$myRequest({
|
|
|
+ url: "/payableinfowater/queryAllYear",
|
|
|
+ data: {
|
|
|
+ dorm: localStorage.room,
|
|
|
+ // dorm: "12栋202",
|
|
|
+ },
|
|
|
+ });
|
|
|
// console.log(res);
|
|
|
+ if (res.success) {
|
|
|
+ this.time_range = res.data
|
|
|
+ }
|
|
|
},
|
|
|
// 选择图片回调
|
|
|
select(e) {
|
|
|
@@ -369,7 +355,8 @@
|
|
|
console.log(this.valiFormData.feedbackImg);
|
|
|
},
|
|
|
// 订单反馈按钮弹窗
|
|
|
- handleFeedback(item) {
|
|
|
+ async handleFeedback(item) {
|
|
|
+ console.log(item);
|
|
|
this.popTitle = item.title
|
|
|
this.valiFormData.feedbackPersonName = "";
|
|
|
this.valiFormData.feedbackPersonPhone = "";
|
|
|
@@ -377,6 +364,18 @@
|
|
|
this.valiFormData.feedbackInfo = "";
|
|
|
this.valiFormData.feedbackImg = [];
|
|
|
|
|
|
+ let res = await this.$myRequest({
|
|
|
+ url: "/wechat/getUserNameTele",
|
|
|
+ data: {
|
|
|
+ cardNumber: item.cardNumber,
|
|
|
+ },
|
|
|
+ });
|
|
|
+ // console.log(res);
|
|
|
+ if (res.success) {
|
|
|
+ this.valiFormData.feedbackPersonName = res.data.name
|
|
|
+ this.valiFormData.feedbackPersonPhone = res.data.telephone
|
|
|
+ }
|
|
|
+
|
|
|
this.$refs.popup_feedback.open();
|
|
|
},
|
|
|
// 订单反馈弹窗提交按钮回调
|
|
|
@@ -400,11 +399,27 @@
|
|
|
},
|
|
|
// 时间筛选框数据改变回调
|
|
|
changeTime(e) {
|
|
|
- console.log(e);
|
|
|
+ if (e != "") {
|
|
|
+ this.time_range.forEach((element) => {
|
|
|
+ if (element.value == e) {
|
|
|
+ this.time_value = element.text
|
|
|
+ }
|
|
|
+ })
|
|
|
+ this.getData()
|
|
|
+ }
|
|
|
},
|
|
|
// 支付状态筛选框数据改变回调
|
|
|
changeType(e) {
|
|
|
- console.log(e);
|
|
|
+ if (e == 1 || e == 2 || e == 3) {
|
|
|
+ if (e == 1) {
|
|
|
+ this.pay_type = 0
|
|
|
+ } else if (e == 2) {
|
|
|
+ this.pay_type = 1
|
|
|
+ } else if (e == 3) {
|
|
|
+ this.pay_type = 2
|
|
|
+ }
|
|
|
+ this.getData()
|
|
|
+ }
|
|
|
},
|
|
|
// 跳转到选择宿舍页面
|
|
|
navigateToSelect() {
|
|
|
@@ -476,6 +491,13 @@
|
|
|
this.flags = false;
|
|
|
},
|
|
|
|
|
|
+ // 拨打电话回调
|
|
|
+ handlePhone() {
|
|
|
+ uni.makePhoneCall({
|
|
|
+ phoneNumber: '82293462'
|
|
|
+ });
|
|
|
+ },
|
|
|
+
|
|
|
// 下拉刷新回调
|
|
|
onPullDownRefresh() {
|
|
|
console.log('刷新');
|
|
|
@@ -530,6 +552,15 @@
|
|
|
color: #999999;
|
|
|
}
|
|
|
|
|
|
+ .picker-item-content2 {
|
|
|
+ width: 360rpx;
|
|
|
+ height: 139rpx;
|
|
|
+ line-height: 139rpx;
|
|
|
+ font-size: 36rpx;
|
|
|
+ text-align: center;
|
|
|
+ color: black;
|
|
|
+ }
|
|
|
+
|
|
|
.picker-item-logor {
|
|
|
width: 91rpx;
|
|
|
display: flex;
|
|
|
@@ -545,7 +576,21 @@
|
|
|
|
|
|
.bill {
|
|
|
margin: 20rpx 0;
|
|
|
- min-height: 982rpx;
|
|
|
+ min-height: 920rpx;
|
|
|
+
|
|
|
+ .choose {
|
|
|
+ display: flex;
|
|
|
+ margin: 0 20rpx;
|
|
|
+
|
|
|
+ .time {
|
|
|
+ flex: 1;
|
|
|
+ padding-right: 40rpx;
|
|
|
+ }
|
|
|
+
|
|
|
+ .type {
|
|
|
+ flex: 1;
|
|
|
+ }
|
|
|
+ }
|
|
|
|
|
|
.null {
|
|
|
display: flex;
|
|
|
@@ -568,19 +613,7 @@
|
|
|
.has {
|
|
|
margin: 0 20rpx;
|
|
|
|
|
|
- .choose {
|
|
|
- display: flex;
|
|
|
|
|
|
- .time {
|
|
|
- flex: 1;
|
|
|
- padding-right: 40rpx;
|
|
|
- }
|
|
|
-
|
|
|
- .type {
|
|
|
- flex: 1;
|
|
|
- padding-right: 40rpx;
|
|
|
- }
|
|
|
- }
|
|
|
|
|
|
.has_bill {
|
|
|
margin-top: 20rpx;
|
|
|
@@ -653,6 +686,22 @@
|
|
|
}
|
|
|
}
|
|
|
|
|
|
+ .phone {
|
|
|
+ display: flex;
|
|
|
+ justify-content: center;
|
|
|
+ align-items: center;
|
|
|
+ margin: 20rpx 0;
|
|
|
+ height: 70rpx;
|
|
|
+
|
|
|
+ .phone_box {
|
|
|
+ margin-bottom: 20rpx;
|
|
|
+
|
|
|
+ span {
|
|
|
+ color: #4993EA;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
.suspend_button {
|
|
|
position: fixed;
|
|
|
left: 80rpx;
|
|
|
@@ -698,6 +747,10 @@
|
|
|
color: #fff;
|
|
|
}
|
|
|
|
|
|
+ ::v-deep .uniui-bottom::before {
|
|
|
+ color: #fff;
|
|
|
+ }
|
|
|
+
|
|
|
::v-deep .uni-forms-item__label {
|
|
|
width: 160rpx !important;
|
|
|
}
|