merchant-app/pages/fundDetails.vue

512 lines
111 KiB
Vue
Raw Normal View History

2024-09-12 14:10:05 +08:00
<template>
<!-- pages/index/index.wxml -->
<view class="fund-details">
<scroll-view class="fd-list"
:scroll-top="scrollTop"
scroll-y="true"
:refresher-enabled="isOpenRefresh"
:refresher-triggered="triggered"
@refresherrefresh="refresh"
@scrolltoupper="upper"
@scroll="scroll"
@scrolltolower="loadMore"
@refresherpulling="onPulling">
<!-- <checkbox-group class="check-box-group" @change="checkbox">-->
<view class="fund-card" v-for="(sign, index) in listSign" >
<checkbox v-if="getPayStatus(sign).status == 0" class="checkbox" :value="sign.id" :checked="sign.c"></checkbox>
<view class="fc-line1">
<view class="fc-head">
{{sign.employeeName.charAt(0)}}
</view>
<view class="fc-line1-right">
<view class="fc-line1-right-line1">
<view class="em-name">
{{sign.employeeName}}
</view>
<view :class="'pay-status' + getPayStatus(sign).status" class="pay-status">
{{getPayStatus(sign).text}}
</view>
</view>
<view class="fc-line1-right-line2">
<view>手机号 {{sign.phone}}</view>
<view>身份证 {{sign.idCard}}</view>
</view>
</view>
<view class="fc-line1-right-2">
<view class="amount" :class="'amount-'+getPayStatus(sign).status">{{ sign.stEmployeeFundRecord == null ? 0 : sign.stEmployeeFundRecord.realPrice }}</view>
<view class="label">应发金额</view>
</view>
</view>
<view class="fc-line2">
<view class="fc-line2-1"></view>
<view class="fc-line2-2">
<view class="fc-line2-2-1">
<view class="date">
任务日期{{task.taskDate}}
</view>
</view>
<view class="fc-line2-2-1">
<view>
日结单价¥{{task.dayPrice}}
</view>
<!-- <view>-->
<!-- 应发金额¥{{task.dayPrice}}-->
<!-- </view>-->
</view>
</view>
<view class="fc-line2-3">
<view class="fx-btn" :class="getPayStatus(sign).status == 0 ? 'btn-status1': 'btn-status2'" @click="faxin(sign)"></view>
</view>
</view>
<view class="fc-line3">
{{sign.remark == null ? "无" : sign.remark}}
</view>
</view>
<!-- </checkbox-group>-->
<!-- <view v-if="showLoading" class="load-more">加载中...</view>-->
<view v-if="showNoMore" class="no-more">没有更多数据了</view>
</scroll-view>
<view class="fd-bottom">
<view class="all-select" @click="allSelect">全选</view>
<view class="all-pay" @click="allPay">批量发薪</view>
</view>
</view>
</template>
<script>
import { getFxDetails, fx } from "@/api/task";
// import { getCodeImg } from '@/api/login'
export default {
data() {
return {
queryParams: {
id: null,
},
task: {
},
listSign:[],
signInfo: {},
items: [{"id":1, "checked": false}, {"id":2, "checked": false}, {"id":3, "checked": false}],
checked: false,
// 是否显示加载更多的loading
showLoading: false,
// 是否显示无更多数据提示
showNoMore: true,
triggered: false,
isOpenRefresh: true,
containerScrollTop: 0,
};
},
onLoad: function(options) {
this.queryParams.id = options.id;
this.getInfo();
},
methods: {
2024-09-13 10:06:26 +08:00
2024-09-12 14:10:05 +08:00
getInfo() {
var that = this;
getFxDetails(this.queryParams).then(response => {
that.task = response.data;
that.listSign = that.task.listSign;
// that.listSign = that.listSign.concat(that.task.listSign);
that.triggered = false;
});
},
allSelect() {
let checked = !this.checked
for (let i = 0; i < this.listSign.length; i++) {
if (this.getPayStatus(this.listSign[i]).status == 1) {
continue;
}
this.listSign[i].c = checked;
// this.listSign[i].employeeName = this.listSign[i].employeeName + " ";
}
this.checked = checked;
},
allPay() {
let arr = [];
for (let i = 0; i < this.listSign.length; i++) {
if (this.getPayStatus(this.listSign[i]).status == 1) {
continue;
}
if (this.listSign[i].c){
console.log("掉起支付" + this.listSign[i].employeeName)
}
arr.push(this.listSign[i].employeeId)
}
fx({"taskId": this.task.id, "employeeIds": arr}).then(response => {
console.log(response)
});
},
getPayStatus(sign) {
if (sign.stEmployeeFundRecord == null || sign.stEmployeeFundRecord.payStatus == 0) {
return {"text": "待发放", "status": 0};
}
if (sign.stEmployeeFundRecord.payStatus == 1) {
return {"text": "已发放", "status": 1};
}
if (sign.stEmployeeFundRecord.payStatus == 2) {
return {"text": "发放失败", "status": 2};
}
return {"text": "待发放", "status": 0};
},
checkbox(e) {
console.log(e.detail.value); // 输出选中的值
},
faxin(sign) {
if(this.getPayStatus(sign).status == 1){
return
}
fx({"taskId": this.task.id, "employeeIds":[sign.employeeId]}).then(response => {
console.log(response)
});
//掉起支付
// wx.requestMerchantTransfer({
// mchId: '1684628563',
// appId: 'wx7bc7df6eb945a84f',
// package: 'pages/pay',
// success (res) {
// console.log("suc", res)
// },
// fail (res) {
// console.log("err", res)
// }
// })
console.log("掉起支付" + sign.employeeName)
},
onPageScroll(e){
this.containerScrollTop = e.scrollTop
if (this.containerScrollTop > 0){
this.isOpenRefresh = false
}else{
this.isOpenRefresh = true
}
},
onReachBottom(e){
console.log("onReachBottom", e)
// 显示加载更多的loading
this.showNoMore = true;
// 请求数据
// this.getInfo();
},
// 刷新函数
refresh() {
// 请求数据
this.triggered = true;
this.queryParams.pageNum = 1;
this.getInfo();
},
upper(){
// console.log("upper")
},
scroll(e){
// console.log("scroll", e.detail)
},
onPulling(e) {
// console.log("onpulling", e.detail);
if (e.detail.dy < 8) return // 防止上滑页面也触发下拉
this.triggered = true;
},
// 加载更多函数
loadMore() {
// console.log("loadMore")
// 判断是否正在加载更多或已经没有更多数据
// if (this.showLoading || this.showNoMore) {
// return;
// }
// // 显示加载更多的loading
// this.showLoading = true;
// // 请求数据
// this.getInfo();
},
}
}
</script>
<style lang='scss'>
html, body {
background-color: #ffffff;
height: 100%;
width: 100%;
}
page{
position: fixed;
left: 0;
top: 0;
right: 0;
bottom: 0;
}
.load-more, .no-more {
display: grid;
place-content: center;
padding: 10rpx;
color: #999;
height: 100rpx;
}
.fund-details{
padding: 1rpx 18rpx 0rpx 18rpx;
background-image:url('data:image/png;base64,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
height: 100%;
background-size: 100% 100%;
width: 100%;
}
.fd-list{
width: 100%;
height: calc(100% - 100rpx);
display: flex;
justify-content: center;
.fund-card{
margin-left: auto;
margin-right: auto;
width: 98%;
margin-top: 20rpx;
margin-bottom: 20rpx;
background-color: #ffffff;
padding: 30rpx;
border-radius: 22rpx;
position: relative;
box-shadow: 2px 2px 5px rgba(0,0,0,0.5);
.checkbox{
position: absolute;
top: 20rpx;
right: 20rpx;
transform: scale(0.7);
width: 50rpx;
height: 50rpx;
}
.fc-line1{
display: flex;
align-items: center;
height: 150rpx;
border-bottom: 1rpx solid #dbdbdb;
.fc-head{
display: flex;
align-items: center;
justify-content: center;
width: 100rpx;
height: 100rpx;
font-weight: 650;
font-size: 43rpx;
color: #ffffff;
border-radius: 60rpx;
background-color: #4ac5f6;
}
.fc-line1-right{
width: 50%;
margin-left: 20rpx;
.fc-line1-right-line1{
display: flex;
align-items: center;
.em-name{
font-size: 38rpx;
font-weight: 650;
}
.pay-status{
margin-left: 10rpx;
display: flex;
align-items: center;
justify-content: center;
width: 120rpx;
height: 38rpx;
/*font-weight: 650;*/
font-size: 22rpx;
border-radius: 30rpx;
font-weight: 600;
}
.pay-status0{
color: #1a73ce;
background-color: #e2e9f6;
}
.pay-status1{
color: #212121;
background-color: #d7d7d7;
}
.pay-status2{
color: #d90101;
background-color: #c2a4a4;
}
}
.fc-line1-right-line2{
display: grid;
color: #787878;
font-size: 20rpx;
margin-top: 10rpx;
view{
margin-right: 20rpx;
}
}
}
.fc-line1-right-2{
width: 150rpx;
.amount{
font-size: 50rpx;
text-align: right;
}
.amount-0{
color: #fa6161;
}
.label{
font-size: 20rpx;
color: #787878;
text-align: right;
}
}
}
.fc-line2{
margin-top: 15rpx;
display: flex;
align-items: center;
height: 70rpx;
.fc-line2-1{
width: 10rpx;
height: 100%;
background-image: url("/static/images/faxin/leftLine.png");
background-size: 100% 100%;
}
.fc-line2-2{
width: 60%;
.fc-line2-2-1{
width: 100%;
margin-bottom: 15rpx;
margin-left: 10rpx;
display: flex;
align-items: center;
color: #3e3e3e;
font-size: 22rpx;
view{
width: 50%;
}
.date{
width: 100%;
}
}
.fc-line2-2-1:last-child {
margin-bottom: 0rpx;
}
}
.fc-line2-3{
margin-left: auto; /* 推动元素到右边 */
.fx-btn{
margin-left: 8rpx;
width: 170rpx;
height: 68rpx;
display: flex;
align-items: center;
justify-content: center;
background-size: 100% 100%;
}
.btn-status1{
background-image: url("/static/images/faxin/fxBtn.png");
}
.btn-status2{
background-image: url("/static/images/faxin/fx2.png");
}
}
}
.fc-line3{
color: #908f8f;
background-color: #efefef;
margin: 20rpx 0 20rpx 0;
padding: 20rpx 40rpx 20rpx 40rpx;
font-size: 24rpx;
}
}
}
/*<view class="fd-bottom">*/
/*<view class="all-select">全选</view>*/
/*<view class="all-pay">批量发薪</view>*/
/*</view>*/
.fd-bottom{
background-color: #ffffff;
width: 100%;
height: 100rpx;
position: absolute;
/*bottom: env(safe-area-inset-bottom);*/
bottom: 0;
left: 0;
display: flex;
align-items: center;
justify-items: center;
padding: 0rpx 70rpx 0rpx 70rpx;
.all-select{
width: 50%;
color: #107ff6;
font-weight: 650;
font-size: 30rpx;
margin-left: 8rpx;
border-radius: 10rpx;
width: 200rpx;
height: 65rpx;
display: flex;
align-items: center;
justify-content: center;
border: 1rpx solid #107ff6;
}
.all-pay{
width: 50%;
background-color: #107ff6;
color: #ffffff;
font-weight: 650;
font-size: 30rpx;
margin-left: 8rpx;
border-radius: 10rpx;
width: 200rpx;
height: 65rpx;
display: flex;
align-items: center;
justify-content: center;
margin-left: auto; /* 推动元素到右边 */
}
}
</style>