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.
406 lines
8.0 KiB
406 lines
8.0 KiB
<template> |
|
<view class="maxbox" v-if="list"> |
|
<image :src="list.imagePath"></image> |
|
<view> |
|
<view>{{list.collectionName}}</view> |
|
<view>{{list.collectorNumber}}</view> |
|
<view> |
|
<image :src="list.writerAvatar"></image> |
|
<text>{{list.artistName}}</text> |
|
</view> |
|
</view> |
|
</view> |
|
<view class="price"> |
|
<input placeholder="请输入寄售价格" type="number" v-model="price"/> |
|
</view> |
|
<view @click="jiaoyan" class="butns"> |
|
寄售 |
|
</view> |
|
<view class="suomin"> |
|
<view class="title">说明</view> |
|
<view>1、交易成功后款项会支付到您的余额</view> |
|
<view>2、余额需要您自己手动提现</view> |
|
<view style="margin-top:55upx ;">* 最终解释权在法律允许范围内归平台所有</view> |
|
</view> |
|
<view @click="setzhuangtai(0)" class="shurujymm" v-if="mimatanchuang==2"> |
|
<view @click.stop=""> |
|
<view>请输入交易密码</view> |
|
<view> |
|
<!-- <view></view> --> |
|
<input v-model="pass" placeholder="请输入密码" password="true"/> |
|
</view> |
|
<view @click="jishou">确认</view> |
|
</view> |
|
</view> |
|
<view class="zhezhao" @click="setzhuangtai(0)" v-if="mimatanchuang==1"> |
|
<view @click.stop=""> |
|
<view> |
|
设置支付密码 |
|
</view> |
|
<view> |
|
<view> |
|
<input v-model="password" password="true" placeholder="请输入密码"/> |
|
</view> |
|
<view> |
|
<input v-model="newpassword" password="true" placeholder="再次确认密码"/> |
|
</view> |
|
</view> |
|
<view @click="xiugaimima">确认</view> |
|
</view> |
|
</view> |
|
</template> |
|
|
|
<script> |
|
import { |
|
criticismmydetails, |
|
secondHandAreaallowtrade, |
|
secondHandAreatransactionPassword, |
|
secondHandAreasettingUp, |
|
} from '@/api/user.js' |
|
import {reactive,toRefs} from 'vue' |
|
export default { |
|
props:['id'], |
|
setup(props) { |
|
let details=reactive({ |
|
list:{}, |
|
price:'', |
|
mimatanchuang:0, |
|
password:'', |
|
newpassword:'', |
|
pass:'' |
|
}) |
|
criticismmydetails({ |
|
id: props.id |
|
}).then(res => { |
|
console.log(res); |
|
details.list = res.data |
|
}) |
|
let fangdou=false |
|
function jishou(){ |
|
if(fangdou){ |
|
return |
|
} |
|
fangdou=true |
|
if(details.pass==''){ |
|
uni.showToast({ |
|
title:'密码不能为空', |
|
icon:'none' |
|
}) |
|
return |
|
} |
|
secondHandAreaallowtrade({ |
|
price:details.price, |
|
myCollId:details.list.id, |
|
wjInformationId:details.list.informationTableId, |
|
transactionPassword:details.pass |
|
}).then(res=>{ |
|
console.log(res); |
|
if(res.code==200){ |
|
uni.showToast({ |
|
title:'寄售成功', |
|
icon:'none' |
|
}) |
|
setTimeout(()=>{ |
|
uni.reLaunch({ |
|
url:'../user/user' |
|
}) |
|
},1500) |
|
}else{ |
|
fangdou=false |
|
uni.showToast({ |
|
title:res.msg, |
|
icon:'none' |
|
}) |
|
} |
|
}) |
|
} |
|
function jiaoyan(){ |
|
if(details.price==''){ |
|
uni.showToast({ |
|
title:'价格不能为空', |
|
icon:'none' |
|
}) |
|
return |
|
} |
|
secondHandAreatransactionPassword({}).then(res=>{ |
|
if(res.code==200){ |
|
if(res.data){ |
|
details.mimatanchuang=2 |
|
}else{ |
|
details.mimatanchuang=1 |
|
} |
|
}else{ |
|
uni.showToast({ |
|
title:res.msg, |
|
icon:'none' |
|
}) |
|
} |
|
}) |
|
} |
|
function xiugaimima(){ |
|
if(details.newpassword==''||details.password==''){ |
|
uni.showToast({ |
|
title:'请确认密码框已经填写完成', |
|
icon:'none' |
|
}) |
|
return |
|
} |
|
if(details.newpassword!=details.password){ |
|
uni.showToast({ |
|
title:'两次密码不一致，请重新输入', |
|
icon:'none' |
|
}) |
|
return |
|
} |
|
secondHandAreasettingUp({ |
|
transactionPassword:details.password |
|
}).then(res=>{ |
|
console.log(res); |
|
if(res.code==200){ |
|
uni.showToast({ |
|
title:'设置成功', |
|
icon:'none' |
|
}) |
|
details.mimatanchuang=0 |
|
}else{ |
|
uni.showToast({ |
|
title:res.msg, |
|
}) |
|
} |
|
}) |
|
} |
|
function setzhuangtai(value){ |
|
details.mimatanchuang=value |
|
details.pass='' |
|
details.password='' |
|
details.newpassword='' |
|
} |
|
return { |
|
setzhuangtai, |
|
xiugaimima, |
|
jiaoyan, |
|
jishou, |
|
...toRefs(details) |
|
} |
|
} |
|
} |
|
</script> |
|
|
|
<style lang="scss"> |
|
.shurujymm{ |
|
width: 100%; |
|
height: 100vh; |
|
position: fixed; |
|
left: 0; |
|
top: 0; |
|
display: flex; |
|
align-items: center; |
|
justify-content: center; |
|
background-color: #00000050; |
|
>view{ |
|
width: 600upx; |
|
border-radius: 40upx; |
|
display: flex; |
|
flex-direction: column; |
|
align-items: center; |
|
background-color: #23262F; |
|
color: #ffffff; |
|
padding: 30upx; |
|
box-sizing: border-box; |
|
>view:nth-of-type(1){ |
|
font-size: 40upx; |
|
margin-bottom: 50upx; |
|
} |
|
>view:nth-of-type(2){ |
|
position: relative; |
|
background-color: #353947; |
|
padding: 20upx 30upx; |
|
box-sizing: border-box; |
|
border-radius: 50upx; |
|
width: 500upx; |
|
>input{ |
|
width: 100%; |
|
height: 100%; |
|
flex: 1; |
|
} |
|
} |
|
>view:nth-of-type(3){ |
|
width: 270upx; |
|
height: 70upx; |
|
border-radius: 10upx; |
|
background: linear-gradient(351deg, #9735DC 0%, #570CDC 100%); |
|
display: flex; |
|
align-items: center; |
|
justify-content: center; |
|
margin-top: 40upx; |
|
margin-bottom: 10upx; |
|
font-size: 28upx; |
|
} |
|
} |
|
} |
|
.zhezhao{ |
|
width: 100%; |
|
height: 100vh; |
|
position: fixed; |
|
left: 0; |
|
top: 0; |
|
display: flex; |
|
align-items: center; |
|
justify-content: center; |
|
background-color: #00000050; |
|
>view{ |
|
width: 600upx; |
|
// height: 450upx; |
|
border-radius: 40upx; |
|
display: flex; |
|
flex-direction: column; |
|
align-items: center; |
|
background-color: #23262F; |
|
color: #ffffff; |
|
padding: 30upx; |
|
box-sizing: border-box; |
|
>view:nth-of-type(1){ |
|
font-size: 40upx; |
|
margin-bottom: 50upx; |
|
} |
|
>view:nth-of-type(2){ |
|
display: flex; |
|
flex-direction: column; |
|
>view{ |
|
width: 500upx; |
|
display: flex; |
|
align-items: center; |
|
padding: 20upx 30upx; |
|
border-radius: 80upx; |
|
background-color: #353947; |
|
margin-bottom: 30upx; |
|
box-sizing: border-box; |
|
&:nth-last-child(1){ |
|
margin-bottom: 0; |
|
} |
|
>input{ |
|
|
|
} |
|
} |
|
} |
|
>view:nth-of-type(3){ |
|
width: 270upx; |
|
height: 70upx; |
|
border-radius: 10upx; |
|
background: linear-gradient(351deg, #9735DC 0%, #570CDC 100%); |
|
display: flex; |
|
align-items: center; |
|
justify-content: center; |
|
margin-top: 40upx; |
|
margin-bottom: 10upx; |
|
font-size: 28upx; |
|
} |
|
} |
|
} |
|
.price{ |
|
width: 668upx; |
|
height: 84upx; |
|
border-radius: 80upx; |
|
margin: auto; |
|
display: flex; |
|
align-items: center; |
|
padding-left: 40upx; |
|
padding-right: 40upx; |
|
box-sizing: border-box; |
|
opacity: 1; |
|
border: 1upx solid #8D8C9F; |
|
color: #ffffff; |
|
>input{ |
|
flex: 1; |
|
} |
|
} |
|
.suomin{ |
|
margin-top: 140upx; |
|
margin-left: 32upx; |
|
color: #ffffff; |
|
font-weight: 500; |
|
font-size: 24upx; |
|
line-height: 40upx; |
|
>.title{ |
|
font-size: 32upx; |
|
margin-bottom: 20upx; |
|
} |
|
} |
|
.butns{ |
|
width: 668upx; |
|
height: 84upx; |
|
background: linear-gradient(351deg, #9735DC 0%, #570CDC 100%); |
|
border-radius: 200upx; |
|
font-size: 28upx; |
|
display: flex; |
|
align-items: center; |
|
justify-content: center; |
|
margin: auto; |
|
margin-top: 66upx; |
|
color: #ffffff; |
|
} |
|
.phone{ |
|
margin: auto; |
|
margin-top: 45upx; |
|
width: 668upx; |
|
height: 84upx; |
|
border-radius: 42upx; |
|
opacity: 1; |
|
border: 2upx solid #8D8C9F; |
|
display: flex; |
|
align-items: center; |
|
padding-left: 45upx; |
|
box-sizing: border-box; |
|
color: #ffffff; |
|
} |
|
.phone input{ |
|
width: 550upx; |
|
} |
|
.maxbox{ |
|
width: 686upx; |
|
// height: 258upx; |
|
background: #23262F; |
|
margin: auto; |
|
// margin-top: 40upx; |
|
margin-bottom:106upx; |
|
border-radius: 12upx; |
|
display: flex; |
|
align-items: center; |
|
padding: 32upx 28upx; |
|
box-sizing: border-box; |
|
>image{ |
|
width: 190upx; |
|
height: 190upx; |
|
margin-right: 26upx; |
|
} |
|
>view{ |
|
display: flex; |
|
flex-direction: column; |
|
color: #ffffff; |
|
>view{ |
|
&:nth-of-type(1){ |
|
font-size: 32upx; |
|
} |
|
&:nth-of-type(2){ |
|
font-size: 24upx; |
|
margin-top: 24upx; |
|
margin-bottom: 20upx; |
|
} |
|
&:nth-of-type(3){ |
|
font-size: 28upx; |
|
display: flex; |
|
align-items: center; |
|
} |
|
>image{ |
|
width: 56upx; |
|
height: 56upx; |
|
border-radius: 50%; |
|
margin-right: 26upx; |
|
} |
|
} |
|
} |
|
} |
|
page{ |
|
padding-top: 40upx; |
|
} |
|
</style>
|
|
|