This commit is contained in:
2023-05-23 16:47:13 +08:00
parent b84661015a
commit aa1312f5da
17 changed files with 1280 additions and 139 deletions

View File

@@ -26,7 +26,13 @@
</view>
<view class="time">{{bankData.no}}</view>
</view>
<view class="item">
<view class="item">
<view class="name">
<image src="@/static/icon/takeIcon_03.png" mode="widthFix"></image>支付金额
</view>
<view class="time">{{price}}</view>
</view>
<!-- <view class="item">
<view class="name">
<image src="@/static/icon/takeIcon_03.png" mode="widthFix"></image>打款金额
</view>
@@ -40,16 +46,44 @@
<image src="@/static/icon/takeIcon_04.png" mode="widthFix"></image>转款账户
</view>
<input class="entry" type="text" :value="name" name="name" placeholder-style="color: #000000" placeholder="请输入转款人账户名" />
</view>
</view> -->
<view class="item">
<view class="name">
<image src="@/static/icon/takeIcon_05.png" mode="widthFix"></image>打款凭证
</view>
<view class="issueNew" @click="albumClick">
<image class="issueNew-icon" :src="showpath || '/static/imgs/cover_img.png'" mode="aspectFill"></image>
<view class="issueNew-text">请上传转款电子回单</view>
<image src="@/static/icon/takeIcon_05.png" mode="widthFix"></image>
<view class="name-cont">
<view class="name-cont-top">
<view class="name-cont-title">上传打款凭证</view>
<view class="name-cont-number">{{pathArr.length}}/9</view>
</view>
<view class="name-cont-tips">长按图片可删除已上传图片</view>
</view>
</view>
<view class="cover-flex">
<view class="cover-item" v-for="(item, index) in pathArr" :key="index" @longpress="onRemove(index)">
<image class="cover-item-src" :src="item" mode="aspectFill"></image>
</view>
<view class="cover-item border" @click="albumClick" v-if="pathArr.length < 9">
<image class="cover-item-add" src="@/static/imgs/cover_add.png" mode="aspectFill"></image>
</view>
</view>
</view>
<!-- <view class="cover-header">
<view>
<view class="cover-title">上传打款凭证</view>
<view class="cover-subtitle">长按图片可删除已上传图片</view>
</view>
<view class="cover-num">{{pathArr.length}}/9</view>
</view>
<view class="cover-flex">
<view class="cover-item" v-for="(item, index) in pathArr" :key="index" @longpress="onRemove(index)">
<image class="cover-item-src" :src="item" mode="aspectFill"></image>
</view>
<view class="cover-item border" @click="albumClick" v-if="pathArr.length < 9">
<image class="cover-item-add" src="@/static/imgs/cover_img.png" mode="aspectFill"></image>
</view>
</view> -->
</view>
<view class="idcardBtn">
<button class="idcardBtn-go" form-type="submit" :disabled="disabled">{{disabled ? '数据正在提交中' : '确认提交'}}</button>
@@ -68,7 +102,7 @@
bankData : '', // 账户信息
price : '', // 打款金额
name : '', // 打卡账户
showpath : '', // 凭证图片
pathArr : [], // 上传的图片
type : '', // 是否为编辑
remark : '', // 驳回原因
disabled : false, // 按钮状态
@@ -76,7 +110,8 @@
},
created() {
this.type = this.$Route.query.type
this.type = this.$Route.query.type
this.price = this.$Route.query.price
// 查看打款凭证-查看提交信息
this.yearServe();
@@ -89,7 +124,7 @@
}).then(res => {
this.price = res.price
this.name = res.name
this.showpath = res.cover
this.pathArr = res.cover
this.remark = res.remark
}).catch(err => {
uni.showToast({
@@ -117,14 +152,19 @@
albumClick() {
var _this = this
uni.chooseImage({
count: 1, //默认9
sizeType: ['original', 'compressed'], //可以指定是原图还是压缩图,默认二者都有
sourceType: ['album','camera'], // way是点击时传入的打开方式相机或相册
count : 9 - this.pathArr.length,
sizeType : ['original', 'compressed'],
sourceType : ['album','camera'],
success: path=> {
uploads([{
uri : path.tempFilePaths[0]
}]).then(res => {
this.showpath = res.url[0]
let { tempFilePaths } = path
let paths = tempFilePaths.map((val, index) => {
return {
name: 'file' + index,
uri : val
}
})
uploads(paths).then(res => {
this.pathArr = this.pathArr.concat(res.url)
}).catch(err => {
uni.showToast({
title: err.message,
@@ -135,15 +175,20 @@
});
},
// 删除图片数据
onRemove(index){
uni.vibrateShort()
this.pathArr.splice(index, 1)
},
// 表单提交
issueForm(e) {
let value = e.detail.value;
let data = {
order_type : this.$Route.query.orderType,
order_id : this.$Route.query.orderId,
name : value.name,
price : value.price,
cover : this.showpath
price : this.price,
cover : this.pathArr
}
if(this.$Route.query.type == 'edit') {
bankEdit(this.$Route.query.payId,data).then(res => {
@@ -273,6 +318,26 @@
margin-right: 15rpx;
}
.name-cont {
width: calc(100% - 59rpx);
}
.name-cont-top {
display: flex;
.name-cont-title {
flex: 1;
}
.name-cont-number {
color: #da2b56;
font-size: 28rpx;
}
}
.name-cont-tips {
font-size: 26rpx;
color: #999;
}
.time {
width: 100%;
color: #9d9d99;
@@ -304,15 +369,33 @@
}
}
.issueNew {
background-color: #f4f4f4;
text-align: center;
margin: 30rpx auto 0;
width: 400rpx;
height: 400rpx;
padding-top: 80rpx;
box-sizing: border-box;
border-radius: 15rpx;
.cover-flex{
margin: -20rpx 20rpx 0 40rpx;
display: flex;
flex-wrap: wrap;
.cover-item{
position: relative;
width: calc(33.33% - 40rpx);
margin: 20rpx;
padding-top: calc(33.33% - 40rpx);
background: #f8f8f8;
.cover-item-src{
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
.cover-item-add{
width: 68rpx;
height: 68rpx;
position: absolute;
top: 50%;
left: 50%;
margin-top: -34rpx;
margin-left: -34rpx;
}
}
}
.issueNew-icon {