Skip to content

X
xzf_uniapp-wechat-web
Commit 6586451d authored by 李智书's avatar 李智书
Browse files
Options

1.日常缴费;

parent 27f59ec4
Expand all Show whitespace changes
Inline Side-by-side
Showing with 1266 additions and 40 deletions
src/pages/StudentPayment/PayProgress/PayProgress.vue
View file @ 6586451d
<template>
<view class="tainer">
<van-dialog v-model="dialogShow" :show-confirm-button="false" :show-cancel-button="false"
:closeOnClickOverlay="true">
<view class="OneExpeditingBox">
<image style="width: 88rpx;height: 88rpx;" mode='widthFix' :src="ImgUrl+'StudentPayment/Tips.png'">
</image>
<view class="title1">
是否发送信息
</view>
<view class="title2">
给未交纳费用的家长发送信息，提醒其
交纳费用？
</view>
<view class="" style="background: #E6E6E6;height: 1rpx; margin-top: 30rpx;">
</view>
<view class="dialogBtnGrou">
<view class="cancelBtn" @click="dialogShow=false">
取消
</view>
<view class="" style="background: #E6E6E6;width: 1rpx;">
</view>
<view class="confirmBtn" @click="OneExpediting(OneExpeditingData)">
确认
</view>
</view>
</view>
</van-dialog>
<van-tabs ref="tabs" title-inactive-color="#999999" title-active-color="#333333" sticky animated
v-model:active="active" swipeable color="#01CB88" background="#FFFFFF" line-width="30px" line-height="4px"
@change="PayProjectTab">
......@@ -7,23 +33,30 @@
<!-- 收费项目 -->
<view class="ListBox">
<view class="" v-if="ChargePaymentPageList.length>0">
<view class="container ProjectList" v-for="(item,index) in ChargePaymentPageList" :key="index"
@tap="PayProgressDetails(item)">
<view class="listitem top">
<view class="container ProjectList" v-for="(item,index) in ChargePaymentPageList" :key="index">
<view class="listitem top" @tap="PayProgressDetails(item)">
<view class="title">
{{item.chargeName}}
</view>
<view class="money">
{{item.amountMust}}
</view>
<view class="hairline"
style="width: 620rpx;height: 1rpx;background-color: #E6E6E6;margin: 0 auto;margin-top: 28rpx;">
</view>
<view class="contentTxt">
<view class="left">
<text>未交纳人数：</text>
<text>{{item.nopayNum}}</text>
</view>
<view class="right">
<text>已交纳人数：</text>
<text>{{item.paiedNum}}</text>
</view>
<view class="listitem center">
<text class="describe">
{{item.descInfo||""}}
</text>
</view>
<view class="listitem botto" style="align-items: baseline;">
<van-icon name="clock-o" /> <text class="Tips">{{item.diffTime}}收费结束</text>
<view class="OneExpediting" @click="OneExpeditingPop(item)">
一键催交
</view>
</view>
</view>
<view class="bottomtxt">已经到底啦~</view>
......@@ -46,17 +79,19 @@
<view class="title">
{{item.chargeName}}
</view>
<view class="money" v-if="false">
{{item.amountMust}}
</view>
<view class="hairline"
style="width: 620rpx;height: 1rpx;background-color: #E6E6E6;margin: 0 auto;margin-top: 28rpx;">
</view>
<view class="listitem center">
<text class="describe">
{{item.descInfo||""}}
</text>
<view class="contentTxt">
<view class="left">
<text>未交纳人数：</text>
<text>{{item.nopayNum}}</text>
</view>
<view class="right">
<text>已交纳人数：</text>
<text>{{item.paiedNum}}</text>
</view>
<view class="listitem botto" style="align-items: baseline;">
<van-icon name="clock-o" /> <text class="Tips">5天后收费结束</text>
</view>
</view>
<view class="bottomtxt">已经到底啦~</view>
......@@ -90,7 +125,11 @@
pageCurrent: 1,
pageSize: 10,
total: 0,
allData: {}
allData: {},
// 弹框
dialogShow: false,
// 一键催缴的数据
OneExpeditingData: {}
}
},
onLoad: function(options) {
......@@ -122,6 +161,50 @@
this.queryChargeEndPage()
},
methods: {
// 一键催缴弹框
async OneExpeditingPop(ItemData) {
try {
this.dialogShow = true;
this.OneExpeditingData = ItemData
} catch (e) {
//TODO handle the exception
console.log(e);
uni.showToast({
icon: "none",
mask: true,
title: e.message
})
}
},
// 一键催缴
async OneExpediting() {
try {
let data = await this.$http.post({
url: orderApi + '/order-charge/teacher/charge/paymentNoticeAll'
}, {
"chargeId": this.OneExpeditingData ? this.OneExpeditingData.id : '',
"schoolId": this.allData.schoolId,
})
if (data.code != 200) {
this.dialogShow = false;
uni.showToast({
icon: "none",
mask: true,
title: data.msg
})
return
}
this.dialogShow = false;
} catch (e) {
//TODO handle the exception
console.log(e);
uni.showToast({
icon: "none",
mask: true,
title: e.message
})
}
},
// 切换tab
async PayProjectTab(index) {
try {
......@@ -160,6 +243,13 @@
let tmp = data.data.records;
let newArr = []
for (let s of tmp) {
let diffTime = dayjs(s.endTime).diff(new Date(), 'hour');
if (diffTime > 24) {
diffTime = dayjs(s.endTime).diff(new Date(), 'day');
s.diffTime = diffTime + ' 天后'
} else {
s.diffTime = 1 + ' 天后'
}
newArr.push(s)
}
if (this.pageCurrent == 1) {
......@@ -220,7 +310,7 @@
return
}
} else {
this.ChargeEndPageList = [1, 2, 3, 4, 5]
this.ChargeEndPageList = []
}
} catch (e) {
......@@ -239,7 +329,7 @@
console.log(data);
uni.setStorageSync("PayProgressDetails", data)
uni.navigateTo({
url: "../PayProgressDetails/PayProgressDetails?chargeId=" + data.id || ''
url: `../PayProgressDetails/PayProgressDetails?active=${this.active}&chargeId=${data.id ||''}`
})
} catch (e) {
//TODO handle the exception
......@@ -267,6 +357,52 @@
}
}
.tainer {
.OneExpeditingBox {
text-align: center;
margin-top: 50rpx;
}
.title1 {
font-size: 36rpx;
font-family: PingFang SC;
font-weight: bold;
color: #666666;
}
.title2 {
width: 440rpx;
font-size: 26rpx;
font-family: PingFang SC;
font-weight: 500;
color: #666666;
margin: 0 auto;
margin-top: 30rpx;
}
.dialogBtnGrou {
height: 88rpx;
line-height: 88rpx;
display: flex;
justify-content: space-around;
font-size: 32rpx;
font-family: PingFang SC;
font-weight: 500;
.cancelBtn {
width: 100%;
color: #999999;
}
.confirmBtn {
width: 100%;
color: #01CB88;
}
}
}
.ListBox {
width: 750rpx;
min-height: 100%;
......@@ -276,7 +412,6 @@
.container {
width: 686rpx;
height: 250rpx;
background: #FFFFFF;
border-radius: 16rpx;
margin: 0 auto;
......@@ -335,16 +470,80 @@
}
.botto {
padding-top: 30rpx;
// padding-top: 30rpx;
padding-left: 32rpx;
font-size: 24rpx;
font-weight: 500;
color: #BABABA;
height: 95rpx;
.Tips {
padding-left: 10rpx;
}
}
.contentTxt {
width: 620rpx;
margin: 0 auto;
display: flex;
flex-direction: row;
height: 100rpx;
line-height: 100rpx;
font-size: 28rpx;
font-family: PingFang SC;
font-weight: 500;
color: #333333;
.left,
.right {
display: flex;
align-items: center;
}
.left text:nth-child(2) {
font-size: 36rpx;
font-family: DIN;
font-weight: 500;
color: #FF3B00;
}
.right {
padding-left: 79rpx;
}
.right text:nth-child(2) {
font-size: 36rpx;
font-family: DIN;
font-weight: 500;
color: #333333;
}
}
.OneExpediting {
width: 176rpx;
height: 60rpx;
background: #01CB88;
border-radius: 30rpx;
text-align: center;
line-height: 60rpx;
font-size: 28rpx;
font-family: PingFang SC;
font-weight: 500;
color: #FFFFFF;
position: relative;
left: 250rpx;
}
}
.ProjectHistory {}
......
src/pages/StudentPayment/PayProgressDetails/PayProgressDetails.vue
View file @ 6586451d
<template>
<view class="contaner">
缴费进度详情
<view class="queryBox">
<view class="search">
<van-search class="inputSearch" v-model="searchValue" show-action placeholder="请输入姓名查询"
@search="onSearch">
<template #action>
<div class="SearchBtn" @click="onSearch">查询</div>
</template>
</van-search>
</view>
<van-dropdown-menu active-color="#01CB88">
<van-dropdown-item v-model="classId" @change="dropItemChange1" :options="option1" />
<van-dropdown-item v-model="payStatus" @change="dropItemChange2" :options="option2" />
</van-dropdown-menu>
</view>
<!-- 数据列表 -->
<view class="ChargeUserPageListBox" v-if="ChargeUserPageList.length>0">
<view class="PageItemList" v-for="(item,index) in ChargeUserPageList" :key="index">
<view class="hrow">
<view class="left ">
<text class="name">{{item.userName||'1111'}}</text>
<text class="payStatus" v-if="item.payStatus==2"
:style="{'background':'#FFECE6','color': '#FF3B00'}">未交纳</text>
<text class="payStatus" v-if="item.payStatus==1"
:style="{'background':'#E4FBF3','color': '#01CB88'}">已交纳</text>
</view>
<view class="right" v-if="item.payStatus==1">
<text>实交纳：</text>
<text class="money">{{item.amount/100||""}}</text>
</view>
</view>
<view class="paymentNotice" @tap="paymentNotice(item)" v-if="item.payStatus==2&&allData.active==0">
催交
</view>
<view class="class_name">
<text>{{item.userClass||'一年级/102班'}}</text>
</view>
</view>
</view>
<!-- -->
<view class="noData" v-else>
<image style="width: 301rpx;height: 258rpx;" :src="ImgUrl+'StudentPayment/NoRecord.png'" mode='widthFix'>
</image>
<view>暂无更多数据</view>
</view>
</view>
</template>
<script>
// 时间处理模块
import dayjs from 'dayjs'
let orderApi = window.location.origin
export default {
name: "PayProgressDetails",
data() {
return {
searchValue: "",
classId: 0,
payStatus: '',
option1: [{
text: '请选择',
value: 0
},
{
text: '当前教职工管理年级',
value: 1
},
{
text: '当前选择年级下的班级',
value: 2
},
],
option2: [{
text: '请选择',
value: ''
},
{
text: '已交费',
value: 1
},
{
text: '未交费',
value: 2
},
],
ImgUrl: this.$ImgUrl,
pageCurrent: 1,
pageSize: 10,
total: 0,
// 交费项目用户分页查询
ChargeUserPageList: [],
}
},
onLoad: function(options) {
let personalInfo = uni.getStorageSync("personalInfo")
this.allData = Object.assign(options, personalInfo)
this.queryChargeUserPage(options.chargeId)
},
onReachBottom: function(e) {
console.log("onReachBottom", e);
this.pageCurrent = this.pageCurrent + 1
},
methods: {
// 一键催缴
async paymentNotice(item) {
try {
let data = await this.$http.post({
url: orderApi + '/order-charge/teacher/charge/paymentNotice'
}, {
"chargeId": item.id,
"schoolId": this.allData.schoolId,
"userId": this.allData.userId || this.allData.userID
})
if (data.code != 200) {
this.dialogShow = false;
uni.showToast({
icon: "none",
mask: true,
title: data.msg
})
return
}
} catch (e) {
//TODO handle the exception
console.log(e);
uni.showToast({
icon: "none",
mask: true,
title: e.message
})
}
},
// 下拉选择
async dropItemChange1(value) {
try {
console.warn(value)
this.queryChargeUserPage(this.allData.chargeId, this.searchValue)
} catch (e) {
//TODO handle the exception
console.log(e);
uni.showToast({
icon: "none",
mask: true,
title: e.message
})
}
},
async dropItemChange2(value) {
try {
console.warn(value)
this.queryChargeUserPage(this.allData.chargeId, this.searchValue)
} catch (e) {
//TODO handle the exception
console.log(e);
uni.showToast({
icon: "none",
mask: true,
title: e.message
})
}
},
// 搜索框
async onSearch(value) {
try {
console.warn(value)
this.queryChargeUserPage(this.allData.chargeId, this.searchValue)
} catch (e) {
//TODO handle the exception
console.log(e);
uni.showToast({
icon: "none",
mask: true,
title: e.message
})
}
},
// 交费项目用户分页查询
async queryChargeUserPage(chargeId, userName) {
try {
let data = await this.$http.post({
url: orderApi + '/order-charge/teacher/charge/queryChargeUserPage'
}, {
userName,
chargeId,
"classId": this.classId,
"pageCurrent": this.pageCurrent,
"pageSize": this.pageSize,
"payStatus": this.payStatus,
"schoolId": this.allData.schoolId,
"userId": this.allData.userId || this.allData.userID
})
if (data.code != 200) {
uni.showToast({
icon: "none",
mask: true,
title: data.msg
})
this.ChargeUserPageList = []
return
}
if (data.data.records && Array.isArray(data.data.records)) {
let tmp = data.data.records;
let newArr = []
// [1, 2, 3, 4, 5, 6].map(v => {
// return {
// payStatus: parseInt(Math.random() * 2) + 1,
// amount: "100",
// id: 1
// }
// })
for (let s of tmp) {
newArr.push(s)
}
if (this.pageCurrent == 1) {
this.ChargeUserPageList = newArr
return
}
if (this.pageCurrent > 1) {
this.ChargeUserPageList.push(...newArr)
return
}
} else {
this.ChargeUserPageList = []
}
} catch (e) {
//TODO handle the exception
console.log(e);
uni.showToast({
icon: "none",
mask: true,
title: e.message
})
}
},
}
}
</script>
<style>
<style lang="scss">
page {
background: #F3F5F6;
}
.noData {
text-align: center;
margin-top: 316rpx;
image {
position: relative;
}
}
.queryBox {
background: #FFFFFF;
padding-top: 12rpx;
.search {
width: 686rpx;
height: 70rpx;
background: #FFFFFF;
border: 2rpx solid #01CB88;
border-radius: 35rpx;
margin: 0 auto;
.SearchBtn {
font-size: 28rpx;
font-family: PingFang SC;
font-weight: 500;
color: #01CB88;
}
.inputSearch {
height: 100%;
width: 92%;
margin: 0 auto;
padding: 0 !important;
}
}
}
.ChargeUserPageListBox {
padding-top: 10rpx;
.PageItemList {
width: 686rpx;
height: 170rpx;
background: #FFFFFF;
border-radius: 24rpx;
margin: 0 auto;
margin-top: 20rpx;
padding-left: 32rpx;
padding-right: 32rpx;
position: relative;
}
.paymentNotice {
width: 118rpx;
height: 60rpx;
background: #01CB88;
border-radius: 30rpx;
font-size: 28rpx;
font-family: PingFang SC;
font-weight: 500;
color: #FFFFFF;
text-align: center;
line-height: 60rpx;
position: absolute;
right: 32rpx;
bottom: 55rpx;
}
.hrow {
display: flex;
justify-content: space-between;
.left {
display: flex;
align-items: center;
height: 100rpx;
.name {
font-size: 42rpx;
font-family: PingFang SC;
font-weight: bold;
color: #333333;
}
}
.payStatus {
width: 94rpx;
height: 34rpx;
border-radius: 8rpx;
line-height: 34rpx;
font-size: 24rpx;
font-family: PingFang SC;
font-weight: 500;
text-align: center;
margin-left: 20rpx;
}
.right {
height: 100rpx;
line-height: 100rpx;
display: flex;
align-items: center;
}
.right text:nth-child(1) {
font-size: 28rpx;
font-family: PingFang SC;
font-weight: 500;
color: #999999;
}
.right text:nth-child(2) {
font-size: 36rpx;
font-family: DIN;
font-weight: 500;
color: #333333;
}
}
.class_name {
font-size: 28rpx;
font-family: PingFang SC;
font-weight: 500;
color: #999999;
}
}
</style>
src/pages/StudentPayment/PayProject/PayProject.vue
View file @ 6586451d
......@@ -50,18 +50,22 @@
{{item.amountMust}}
</view>
</view>
<view class="listitem center">
<text class="describe">
{{item.descInfo||""}}
</text>
<view class="hairline" style="width: 686rpx;height: 1rpx; background-color:#E6E6E6;margin-top: 28rpx;">
</view>
<view class="listitem botto" style="align-items: baseline;">
<view class="History">
<view class="Historyitem">
<span>实交金额:</span>
<view style="margin-left: 26rpx;margin-right: 26rpx;width: 50rpx;text-align: center;">
{{item.realAmount/100||""}}
<span class="money">{{item.realAmount/100||""}}</span>
</view>
<view class="Historyitem">
<span>交费时间:</span>
<view style="margin-left: 26rpx;margin-right: 26rpx;">{{item.payTime||""}}</view>
<span>{{item.payTime||""}}</span>
</view>
</view>
<view class="listitem center">
<text class="describe">
{{item.descInfo||""}}
</text>
</view>
</view>
<view class="bottomtxt">已经到底啦~</view>
......@@ -372,7 +376,42 @@
}
}
.ProjectHistory {}
.ProjectHistory {
height: 330rpx;
background: #FFFFFF;
border-radius: 16rpx;
.money {
font-size: 36rpx;
font-family: DIN;
font-weight: bold;
color: #01CB88;
}
.money::before {
content: "￥";
font-size: 32rpx;
font-family: PingFang SC;
font-weight: bold;
color: #01CB88;
}
.describe {
padding-top: 20rpx !important;
}
.History {
width: 630rpx;
margin: 0 auto;
.Historyitem {
height: 60rpx;
line-height: 60rpx;
display: flex;
justify-content: space-between;
}
}
}
.listitem {
display: flex;
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment