You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
444 lines
14 KiB
444 lines
14 KiB
7 months ago
|
<template>
|
||
|
|
<view>
|
||
|
|
<view class="navTab">
|
||
|
|
<u-search v-model='keyware' placeholder='请输入工具名称' bg-color='#FFFFFF' :actionStyle="customActionStyle"
|
||
|
|
showAction="true" actionText="搜索" :animation="false" @custom='seacrhko'></u-search>
|
||
|
|
</view>
|
||
|
|
<view>
|
||
|
|
<u-tabs-swiper ref="tabs" :list="ornamelist" :is-scroll="false" @change="tabsChange" :current="current"
|
||
|
|
bg-color='transparent' active-color="#1578ED" inactive-color='#666666'>
|
||
|
|
</u-tabs-swiper>
|
||
|
|
<view style="font-weight: 500;font-size: 22rpx;color: #FD8A1A;padding-left: 15px;margin-top: 15px;"
|
||
|
|
@click="goPcDetail">
|
||
|
|
温馨提示：请登录PC端-工作台使用购买的工具 >></view>
|
||
|
|
<div class="navTab">
|
||
|
|
<view>
|
||
|
|
<view class="prdertool" v-for="(item,key) of currentoerderist" :key="key">
|
||
|
|
<view class="oerdeh">
|
||
|
|
<p>订单号：{{item.orderNumber}}</p>
|
||
|
|
<p>{{ dateFormat(new Date(item.payTime)) }}</p>
|
||
|
|
</view>
|
||
|
|
<view style="display: flex;justify-content: space-between;margin-bottom:15px;">
|
||
|
|
<view style="display: flex;align-items: center;align-items: center;">
|
||
|
|
<!-- <img style="width:55px;height: 55px;margin-right: 5px;" src="http://image.keyitest.cn/static/my/25.png" alt=""> -->
|
||
|
|
<img style="width:55px;height: 55px;margin-right: 5px;" :src="item.imgs" alt="">
|
||
|
|
<view style="font-weight: bold;color: #1A1A1A;font-size:30rpx;">
|
||
|
|
{{item.name}}
|
||
|
|
<view v-if="item.priceType == 'month'"
|
||
|
|
style="font-weight: 500;font-size: 22rpx;color: #999999;margin-top: 20rpx;">
|
||
|
|
规格：使用时长(按月计)</view>
|
||
|
|
<view v-if="item.priceType == 'time' || item.priceType == 'times'"
|
||
|
|
style="font-weight: 500;font-size: 22rpx;color: #999999;margin-top: 20rpx;">
|
||
|
|
规格：测试服务(按次计)</view>
|
||
|
|
<view style="font-weight: 500;font-size: 22rpx;color: #999999;">数量：{{item.amount}} |
|
||
|
|
交付方式：{{item.deliverType}}</view>
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
<view style="margin-top: 30px; min-width: 150rpx; text-align: right;">
|
||
|
|
<!-- <p style="font-size: 13px;color: #4D4D4D;">实付金额：</p> -->
|
||
|
|
|
||
|
|
<view v-if="item.status == 0" style="color: #f4a42f;margin-bottom: 10rpx;">
|
||
|
|
待支付
|
||
|
|
</view>
|
||
|
|
<view v-if="item.status == 1" style="color: #54be77;margin-bottom: 10rpx;">
|
||
|
|
支付成功
|
||
|
|
</view>
|
||
|
|
<view v-if="item.status == 2" style="color: #ef6461;margin-bottom: 10rpx;">
|
||
|
|
已取消
|
||
|
|
</view>
|
||
|
|
<view v-if="item.status == 3" style="color: #8593a3;margin-bottom: 10rpx;">
|
||
|
|
已过期
|
||
|
|
</view>
|
||
|
|
<view style="display: flex;align-items: center;justify-content: flex-end;">
|
||
|
|
<p style="font-weight: bold;font-size: 12px;color: #FD461A;margin-right:3px;">¥</p>
|
||
|
|
<p style="font-size:18px;color: #FD461A;">{{item.fee}}</p>
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
<u-line color="rgba(153,153,153,0.2)" />
|
||
|
|
<view class="submitt" v-if="item.status == 1 || item.status == 2 || item.status == 3">
|
||
|
|
<!-- <view class="button-g"
|
||
|
|
style="background:#FFFFFF;border: 1px solid #1578ED;color: #1578ED;margin-left:0"
|
||
|
|
@click="delOrder(item)">删除订单</view> -->
|
||
|
|
<view class="button-g" @click="againBug(item)">再次购买</view>
|
||
|
|
</view>
|
||
|
|
<view class="submitt" v-if="item.status == 0">
|
||
|
|
<view class="button-g"
|
||
|
|
style="background:#FFFFFF;border: 1px solid #1578ED;color: #1578ED;margin-left:0"
|
||
|
|
@click="cancleOrder(item)">取消订单</view>
|
||
|
|
<view class="button-g" @click="goPay(item)">去支付</view>
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
<view v-if="currentoerderist.length==0 &¤t!=0" style="font-size:46rpx;
|
||
|
|
font-weight: bold;
|
||
|
|
color: #9D9D9D; text-align:center;margin-top:100px">暂无订单</view>
|
||
|
|
<view style="height:10px;"></view>
|
||
|
|
</div>
|
||
|
|
</view>
|
||
|
|
<u-toast ref="uToast" />
|
||
|
|
|
||
|
|
<u-popup style="background:#66666;padding: 20px;" v-model="isPopupShow" @close="close" @open="open"
|
||
|
|
mode="bottom" length="80%" height='60%' border-radius="15" :closeable='true' :mask-close-able="false">
|
||
|
|
<view style="background:#66666;padding:15px 20px 80px 20px; ">
|
||
|
|
<view style="background-color: #FFFFFF;">
|
||
|
|
<view class="horizontalline"></view>
|
||
|
|
<view>
|
||
|
|
<view class="commodity">
|
||
|
|
<p>商品名称：</p>
|
||
|
|
<p style="color:#333333;">{{toolInfo.name}}</p>
|
||
|
|
</view>
|
||
|
|
<view class="commodity">
|
||
|
|
<p>商品规格：</p>
|
||
|
|
<u-input border style="width:60%;height: 40rpx;" v-model="typeName" type="select"
|
||
|
|
@click="typeShow = true" />
|
||
|
|
<u-select v-model="typeShow" :list="toolInfo.deliverType=='SaaS' ? typeList : typeList1"
|
||
|
|
@confirm="citychange" mode="mutil-column-auto"></u-select>
|
||
|
|
</view>
|
||
|
|
<view class="commodity">
|
||
|
|
<p>商品价格：</p>
|
||
|
|
<p style="color:#333333;">￥{{toolInfo.price}}</p>
|
||
|
|
</view>
|
||
|
|
|
||
|
|
<view class="commodity">
|
||
|
|
<p>购买数量：</p>
|
||
|
|
<u-number-box v-model="cartnumber" @change="valChange"></u-number-box>
|
||
|
|
<!-- <p style="color:#333333 ;">Kinterface接口测试工具-软件版</p> -->
|
||
|
|
</view>
|
||
|
|
<view class="commodity">
|
||
|
|
<p>支付金额：</p>
|
||
|
|
<p style="color:#FD461A;margin-top: -3px;">
|
||
|
|
<span>¥ </span>
|
||
|
|
<span style="font-size:40rpx;margin-left:10rpx;font-weight: 800;">{{allpirse}}</span>
|
||
|
|
</p>
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
</view>
|
||
|
|
<u-line></u-line>
|
||
|
|
<view class="submitt22"
|
||
|
|
style="display: flex;justify-content: center; ;box-shadow:none;background: transparent;padding:0;">
|
||
|
|
<view class="button-g11"
|
||
|
|
style="width:80vw; background: linear-gradient(90deg, #5EA6FD, #1A81F9);color: #FFFFFF">支付</view>
|
||
|
|
</view>
|
||
|
|
</u-popup>
|
||
|
|
</view>
|
||
|
|
</template>
|
||
|
|
|
||
|
|
<script>
|
||
|
|
import {
|
||
|
|
dateFormat
|
||
|
|
} from '@/utils/util.js'
|
||
|
|
// 订单状态 0未支付 1已支付
|
||
|
|
export default {
|
||
|
|
data() {
|
||
|
|
return {
|
||
|
|
keyware: '',
|
||
|
|
current: '0',
|
||
|
|
ornamelist: [{
|
||
|
|
name: '全部'
|
||
|
|
}, {
|
||
|
|
name: '待支付'
|
||
|
|
},
|
||
|
|
{
|
||
|
|
name: '已取消'
|
||
|
|
}, {
|
||
|
|
name: '已完成'
|
||
|
|
}
|
||
|
|
],
|
||
|
|
customActionStyle: {
|
||
|
|
color: '#808080', // 按钮颜色
|
||
|
|
fontSize: '16px' // 按钮字体大小
|
||
|
|
// 其他样式属性
|
||
|
|
},
|
||
|
|
orderlist: [],
|
||
|
|
currentoerderist: [],
|
||
|
|
// 弹窗
|
||
|
|
isPopupShow: false,
|
||
|
|
cartnumber: 1,
|
||
|
|
typeShow: false,
|
||
|
|
typeName: '使用时长(按月计)',
|
||
|
|
typeList: [{
|
||
|
|
value: '测试服务(按次计)',
|
||
|
|
label: '测试服务(按次计)'
|
||
|
|
}, {
|
||
|
|
value: '使用时长(按月计)',
|
||
|
|
label: '使用时长(按月计)'
|
||
|
|
}],
|
||
|
|
typeList1: [{
|
||
|
|
value: '使用时长(按月计)',
|
||
|
|
label: '使用时长(按月计)'
|
||
|
|
}],
|
||
|
|
allpirse: 0,
|
||
|
|
toolInfo: {}
|
||
|
|
}
|
||
|
|
},
|
||
|
|
onLoad: function(option) {
|
||
|
|
this.current = option.current;
|
||
|
|
this.http.quickGet('/my/order?pageNum=1&pageSize=100', true).then(res => {
|
||
|
|
this.orderlist = res.data.rows
|
||
|
|
this.orderlist.forEach(item => {
|
||
|
|
item.imgs = this.http.baseUrl + item.img
|
||
|
|
})
|
||
|
|
if (this.current == 0) {
|
||
|
|
this.currentoerderist = this.orderlist
|
||
|
|
} else if (this.current == 1) {
|
||
|
|
this.currentoerderist = this.orderlist.filter(it => it.status == 0)
|
||
|
|
} else if (this.current == 3) {
|
||
|
|
this.currentoerderist = this.orderlist.filter(it => it.status == 1)
|
||
|
|
} else if (this.current == 2) {
|
||
|
|
this.currentoerderist = this.orderlist.filter(it => it.status == 2)
|
||
|
|
}
|
||
|
|
})
|
||
|
|
|
||
|
|
|
||
|
|
},
|
||
|
|
methods: {
|
||
|
|
dateFormat,
|
||
|
|
goPcDetail() {
|
||
|
|
uni.navigateTo({
|
||
|
|
url: '/pages/personal/setup/guide'
|
||
|
|
})
|
||
|
|
},
|
||
|
|
tabsChange(index) {
|
||
|
|
if (index == 0) {
|
||
|
|
this.currentoerderist = this.orderlist
|
||
|
|
} else if (index == 1) {
|
||
|
|
this.currentoerderist = this.orderlist.filter(it => it.status == 0)
|
||
|
|
} else if (index == 3) {
|
||
|
|
this.currentoerderist = this.orderlist.filter(it => it.status == 1)
|
||
|
|
} else if (index == 2) {
|
||
|
|
this.currentoerderist = this.orderlist.filter(it => it.status == 2)
|
||
|
|
}
|
||
|
|
// this.currentoerderist = this.orderlist.filter(item => item.status == index - 1);
|
||
|
|
this.current = index
|
||
|
|
},
|
||
|
|
shopping(type) {
|
||
|
|
if (type == 'cart') {
|
||
|
|
this.$refs.uToast.show({
|
||
|
|
title: '功能暂未开通',
|
||
|
|
type: 'info',
|
||
|
|
url: '/pages/user/index'
|
||
|
|
})
|
||
|
|
}
|
||
|
|
},
|
||
|
|
seacrhko() {
|
||
|
|
const str = this.keyware ? `&projectName=${this.keyware}` : ''
|
||
|
|
this.http.quickGet('/my/order?pageNum=1&pageSize=100' + str, true).then(res => {
|
||
|
|
this.orderlist = res.data.rows
|
||
|
|
this.orderlist.forEach(item => {
|
||
|
|
item.imgs = this.http.baseUrl + item.img
|
||
|
|
})
|
||
|
|
if (this.current == 0) {
|
||
|
|
this.currentoerderist = this.orderlist
|
||
|
|
} else if (this.current == 1) {
|
||
|
|
this.currentoerderist = this.orderlist.filter(it => it.status == 0)
|
||
|
|
} else if (this.current == 3) {
|
||
|
|
this.currentoerderist = this.orderlist.filter(it => it.status == 1)
|
||
|
|
} else if (this.current == 2) {
|
||
|
|
this.currentoerderist = this.orderlist.filter(it => it.status == 2)
|
||
|
|
}
|
||
|
|
})
|
||
|
|
},
|
||
|
|
close() {
|
||
|
|
this.isPopupShow = false
|
||
|
|
},
|
||
|
|
open() {},
|
||
|
|
citychange(e) {
|
||
|
|
this.typeName = e[0].label
|
||
|
|
},
|
||
|
|
valChange(e) {
|
||
|
|
this.allpirse = e.value * this.toolInfo.price
|
||
|
|
},
|
||
|
|
// 删除订单
|
||
|
|
delOrder(item) {
|
||
|
|
// const data = {
|
||
|
|
// orderNumber: item.orderNumber,
|
||
|
|
// }
|
||
|
|
// this.http.quickPost(`/play/cancel_play`, data, true).then(res => {
|
||
|
|
// if (res.retcode == 'SUCCESS') {
|
||
|
|
// this.http.quickGet('/my/order?pageNum=1&pageSize=999', true).then(res => {
|
||
|
|
// this.orderlist = res.data.rows
|
||
|
|
// this.orderlist.forEach(item => {
|
||
|
|
// item.imgs = this.http.baseUrl + item.img
|
||
|
|
// })
|
||
|
|
// if (this.current == 0) {
|
||
|
|
// this.currentoerderist = this.orderlist
|
||
|
|
// } else if (this.current == 1) {
|
||
|
|
// this.currentoerderist = this.orderlist.filter(it => it.status == 0)
|
||
|
|
// } else if (this.current == 2) {
|
||
|
|
// this.currentoerderist = this.orderlist.filter(it => it.status == 2)
|
||
|
|
// } else if (this.current == 3) {
|
||
|
|
// this.currentoerderist = this.orderlist.filter(it => it.status == 1)
|
||
|
|
// }
|
||
|
|
// })
|
||
|
|
// }
|
||
|
|
// })
|
||
|
|
},
|
||
|
|
// 再次购买 tioazhuan
|
||
|
|
againBug(item) {
|
||
|
|
uni.navigateTo({
|
||
|
|
url: `/pages/index/toolleasing/tooldetails?id=${item.toolId}`
|
||
|
|
})
|
||
|
|
|
||
|
|
|
||
|
|
},
|
||
|
|
// 取消订单
|
||
|
|
cancleOrder(item) {
|
||
|
|
const data = {
|
||
|
|
orderNumber: item.orderNumber,
|
||
|
|
}
|
||
|
|
this.http.quickPost(`/play/cancel_play`, data, true).then(res => {
|
||
|
|
if (res.retcode == 'SUCCESS') {
|
||
|
|
this.http.quickGet('/my/order?pageNum=1&pageSize=999', true).then(res => {
|
||
|
|
this.orderlist = res.data.rows
|
||
|
|
this.orderlist.forEach(item => {
|
||
|
|
item.imgs = this.http.baseUrl + item.img
|
||
|
|
})
|
||
|
|
if (this.current == 0) {
|
||
|
|
this.currentoerderist = this.orderlist
|
||
|
|
} else if (this.current == 1) {
|
||
|
|
this.currentoerderist = this.orderlist.filter(it => it.status == 0)
|
||
|
|
} else if (this.current == 2) {
|
||
|
|
this.currentoerderist = this.orderlist.filter(it => it.status == 2)
|
||
|
|
} else if (this.current == 3) {
|
||
|
|
this.currentoerderist = this.orderlist.filter(it => it.status == 1)
|
||
|
|
}
|
||
|
|
})
|
||
|
|
}
|
||
|
|
})
|
||
|
|
},
|
||
|
|
// 去支付
|
||
|
|
goPay(item) {
|
||
|
|
const that = this
|
||
|
|
const data = {
|
||
|
|
orderNumber: item.orderNumber,
|
||
|
|
payType: 'W06'
|
||
|
|
}
|
||
|
|
this.http.quickPost(`/play/wait_play`, data, true).then(res => {
|
||
|
|
const info = JSON.parse(res.data.payinfo)
|
||
|
|
uni.requestPayment({
|
||
|
|
timeStamp: info.timeStamp,
|
||
|
|
nonceStr: info.nonceStr,
|
||
|
|
package: info.package,
|
||
|
|
signType: info.signType,
|
||
|
|
paySign: info.paySign,
|
||
|
|
success(r) {
|
||
|
|
uni.showToast({
|
||
|
|
icon: 'none',
|
||
|
|
title: '支付成功，请前往pc端工作台使用'
|
||
|
|
})
|
||
|
|
that.current = 0
|
||
|
|
that.http.quickGet('/my/order?pageNum=1&pageSize=100', true).then(res => {
|
||
|
|
that.orderlist = res.data.rows
|
||
|
|
that.orderlist.forEach(item => {
|
||
|
|
item.imgs = that.http.baseUrl + item.img
|
||
|
|
})
|
||
|
|
if (that.current == 0) {
|
||
|
|
that.currentoerderist = that.orderlist
|
||
|
|
} else if (that.current == 1) {
|
||
|
|
that.currentoerderist = that.orderlist.filter(it => it
|
||
|
|
.status == 0)
|
||
|
|
} else if (that.current == 2) {
|
||
|
|
that.currentoerderist = that.orderlist.filter(it => it
|
||
|
|
.status == 2)
|
||
|
|
} else if (that.current == 3) {
|
||
|
|
that.currentoerderist = that.orderlist.filter(it => it
|
||
|
|
.status == 1)
|
||
|
|
}
|
||
|
|
})
|
||
|
|
},
|
||
|
|
fail(error) {
|
||
|
|
console.log(error);
|
||
|
|
uni.showToast({
|
||
|
|
icon: 'none',
|
||
|
|
title: '支付失败'
|
||
|
|
})
|
||
|
|
}
|
||
|
|
})
|
||
|
|
})
|
||
|
|
|
||
|
|
},
|
||
|
|
}
|
||
|
|
}
|
||
|
|
</script>
|
||
|
|
|
||
|
|
<style>
|
||
|
|
.navTab {
|
||
|
|
padding: 13px 15px;
|
||
|
|
}
|
||
|
|
|
||
|
|
.prdertool {
|
||
|
|
padding: 28rpx;
|
||
|
|
background: #FFFFFF;
|
||
|
|
border-radius: 10rpx;
|
||
|
|
margin-bottom: 13px;
|
||
|
|
}
|
||
|
|
|
||
|
|
.oerdeh {
|
||
|
|
display: flex;
|
||
|
|
justify-content: space-between;
|
||
|
|
color: #808080;
|
||
|
|
font-size: 23rpx;
|
||
|
|
margin-bottom: 13px;
|
||
|
|
}
|
||
|
|
|
||
|
|
.submitt {
|
||
|
|
/* height:70px; */
|
||
|
|
|
||
|
|
font-size: 20px;
|
||
|
|
margin-top: 15px;
|
||
|
|
display: flex;
|
||
|
|
justify-content: flex-end;
|
||
|
|
}
|
||
|
|
|
||
|
|
.button-g {
|
||
|
|
width: 170rpx;
|
||
|
|
height: 58rpx;
|
||
|
|
background: linear-gradient(90deg, #5EA6FD, #1A81F9);
|
||
|
|
border-radius: 88rpx;
|
||
|
|
text-align: center;
|
||
|
|
line-height: 58rpx;
|
||
|
|
color: #FFFFFF;
|
||
|
|
font-size: 28rpx;
|
||
|
|
margin-left: 13px;
|
||
|
|
}
|
||
|
|
|
||
|
|
.button-g11 {
|
||
|
|
width: 540rpx;
|
||
|
|
height: 70rpx;
|
||
|
|
background: linear-gradient(90deg, #FF8600, #FE2B2B);
|
||
|
|
border-radius: 35rpx;
|
||
|
|
text-align: center;
|
||
|
|
line-height: 70rpx;
|
||
|
|
color: #FFFFFF;
|
||
|
|
font-size: 30rpx;
|
||
|
|
margin-left: 13px;
|
||
|
|
}
|
||
|
|
|
||
|
|
.commodity {
|
||
|
|
display: flex;
|
||
|
|
color: #808080;
|
||
|
|
font-size: 30rpx;
|
||
|
|
margin: 20px 0;
|
||
|
|
}
|
||
|
|
|
||
|
|
.commodity>>>input {
|
||
|
|
min-height: 40rpx !important;
|
||
|
|
}
|
||
|
|
|
||
|
|
.submitt22 {
|
||
|
|
height: 60px;
|
||
|
|
/* line-height: 55px; */
|
||
|
|
/* text-align: center; */
|
||
|
|
font-size: 20px;
|
||
|
|
background: #FFFFFF;
|
||
|
|
box-shadow: -4px 7px 18px 0px rgba(248, 164, 54, 0.33);
|
||
|
|
margin-top: 60px;
|
||
|
|
position: fixed;
|
||
|
|
bottom: 0;
|
||
|
|
width: 100vw;
|
||
|
|
padding: 10px 30px;
|
||
|
|
display: flex;
|
||
|
|
}
|
||
|
|
</style>
|