- Asset page: add Contract account row + tab, show num_lh balance - Total Assets = Spot + Contract + Fiat - All Chinese text eliminated (z-paging, loadmore, colorui, pages) - Password/payword pages use image captcha instead of OTP - Home page PC: full-width stretch layout - Register captcha input type fix, invite code lock
834 lines
25 KiB
Vue
834 lines
25 KiB
Vue
<template>
|
||
<view>
|
||
<view @click="checkclose()" v-if="isnum||ispay" class="mask1"></view>
|
||
<view @click="checkclose()" v-if="isnum||ispay" class="mask2"></view>
|
||
|
||
<z-paging :language="$i18n.locale" ref="paging" v-model="list" @query="queryList" :pageSize="20"
|
||
:style="'background-color: '+theme.bg+';color: '+theme.text">
|
||
<!-- 下拉刷新 -->
|
||
<custom-refresher slot="refresher" slot-scope="{refresherStatus}" :status="refresherStatus">
|
||
</custom-refresher>
|
||
<!-- 头部 -->
|
||
<view slot="top" class="width-750 relative flex align-center justify-center"
|
||
:style="{height: `calc(${statusBar}px + 358rpx)`}">
|
||
<view class="width-750 fixed1"
|
||
:style="{paddingTop: statusBar + 'px', height: `calc(${statusBar}px + 358rpx)`}">
|
||
<!-- 标题 -->
|
||
<view class="width-750 height-110 padding-w-30 flex align-center justify-center">
|
||
<view @click.stop="_goback" class="cuIcon-back font-40 color-white"
|
||
style="position: absolute;left: 30rpx;"></view>
|
||
<text class="font-36 color-white weight-bold">{{i18n.c2c.title}}</text>
|
||
<view class="flex align-center" style="position: absolute;right: 30rpx;">
|
||
<view @click.stop="show=true" class="switchbox">
|
||
<text class="nummedium-font">{{faby}}</text>
|
||
<image class="width-34 height-34 margin-l-5" src="/static/imgs/index/change@2x.png" mode="">
|
||
</image>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<!-- 选择买或卖 -->
|
||
<view class="height-110 flex align-center padding-w-30">
|
||
<view class="flex-1 flex align-center">
|
||
<view @click.stop="changeisbuy(2)" class="flex-1" :class="isbuy==2?'onfont':'offfont'">
|
||
{{i18n.c2c.text1}}
|
||
</view>
|
||
<view @click.stop="changeisbuy(1)" class="flex-1" :class="isbuy==1?'onfont':'offfont'">
|
||
{{i18n.c2c.text2}}
|
||
</view>
|
||
<view @click.stop="router.push('/pages/index/releaseTrade')" class="flex-1 offfont">
|
||
{{i18n.c2c.text3}}
|
||
</view>
|
||
</view>
|
||
<view class="flex align-center justify-end">
|
||
<image @click.stop="router.push('/pages/index/orderRecord')" class="width-54 height-54"
|
||
src="/static/imgs/index/jilu@2x.png" mode=""></image>
|
||
<!-- <image @click.stop="typeshow=true" class="width-54 height-54"
|
||
src="/static/imgs/index/shoukuan@2x.png" mode=""></image> -->
|
||
</view>
|
||
</view>
|
||
<!-- 选择币种 -->
|
||
<view class="height-72 bj-0165EE">
|
||
<view class="height-72 flex align-center padding-w-30"
|
||
:style="'background-color: '+theme.bg+';color: '+theme.text"
|
||
style="border-radius: 20rpx 20rpx 0 0;">
|
||
<view class="width-100b height-100b">
|
||
<scroll-view scroll-x="true">
|
||
<view class="flex align-center">
|
||
<view @click.stop="setiscurr(item.id)" v-for="(item,index) in currlist"
|
||
class="height-72 padding-w-30 flex direction-column align-center justify-center relative">
|
||
<text :class="currid==item.id?'select':'noselect'">{{item.name}}</text>
|
||
<view v-if="currid==item.id" class="width-48 height-4 bj-0165EE"
|
||
style="position: absolute;bottom: 0;"></view>
|
||
</view>
|
||
</view>
|
||
</scroll-view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<!-- 筛选支付方式和金额 -->
|
||
<view class="height-70 flex align-center" :style="'background-color: '+theme.bg+';color: '+theme.text">
|
||
<!-- 支付方式 -->
|
||
<view @click.stop="changeispay" class="width-240 height-70 relative" >
|
||
<view class="width-240 height-70 flex align-center justify-center">
|
||
<text class="font-26 margin-r-10">{{payname}}</text>
|
||
<u-icon v-if="!ispay" name="arrow-down-fill" size="20"></u-icon>
|
||
<u-icon v-else name="arrow-up-fill" size="20"></u-icon>
|
||
</view>
|
||
<view @click.stop="" :class="ispay?'onbox':'offbox'" :style="'background-color: '+theme.bg+';color: '+theme.text">
|
||
<view class="padding-w-30 padding-c-20 flex flex-wrap">
|
||
<view @click.stop="setpay(item)" v-for="(item,index) in paylist"
|
||
:class="payid==item.id?'selectpay':'noselectpay'">{{item.name}}</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<!-- 交易金额 -->
|
||
<view @click.stop="changeisnum" class="width-240 height-70 relative">
|
||
<view class="width-240 height-70 flex align-center justify-center">
|
||
<text class="font-26 margin-r-10">{{paypriceval}}</text>
|
||
<u-icon v-if="!isnum" name="arrow-down-fill"size="20"></u-icon>
|
||
<u-icon v-else name="arrow-up-fill" size="20"></u-icon>
|
||
</view>
|
||
<view @click.stop="" :class="isnum?'onbox1':'offbox1'" :style="'background-color: '+theme.bg+';color: '+theme.text">
|
||
<view class="height-100 flex align-center padding-w-30">
|
||
<input class="inputbox" type="number" v-model="payprice" :placeholder="i18n.c2c.tos4"
|
||
placeholder-class="color-D1D3D8" />
|
||
</view>
|
||
<view class="height-100 padding-t-24 flex">
|
||
<view @click="resetpayprice"
|
||
class="flex-1 height-78 line-height-78 text-center bj-c3c3c3-02">
|
||
<text class="font-26 color-C3C3C3">{{i18n.c2c.text4}}</text>
|
||
</view>
|
||
<view @click="setpayprice"
|
||
class="flex-1 height-78 line-height-78 text-center bj-0165EE">
|
||
<text class="font-26 color-white">{{i18n.c2c.text5}}</text>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
|
||
</view>
|
||
</view>
|
||
<!-- 身体 -->
|
||
<view class="width-750 padding-b-40" :style="'background-color: '+theme.bg+';color: '+theme.text">
|
||
<view class="padding-t-18 padding-w-30">
|
||
<!-- 单一列表 -->
|
||
<view v-for="(item,index) in list" class="height-238 border-bottom">
|
||
<view class="flex align-center justify-between padding-t-22">
|
||
<view class="flex align-center">
|
||
<image class="width-48 height-48 radiu-24" :src="item.avatar" mode=""></image>
|
||
<text class="font-26 weight-bold margin-l-16">{{item.nickname}}</text>
|
||
</view>
|
||
<text class="font-24 color-C3C3C3">{{i18n.c2c.text6}}{{item.succ_num}}</text>
|
||
</view>
|
||
<view class="margin-c-10 flex align-center justify-between font-24 color-C3C3C3">
|
||
<view class="flex align-center">
|
||
<text>{{i18n.c2c.text7}}:</text>
|
||
<text class="nummedium-font">{{item.residue_num}}</text>
|
||
</view>
|
||
<text>{{i18n.c2c.text8}}</text>
|
||
</view>
|
||
<view class="margin-c-10 flex align-center justify-between font-24 color-C3C3C3">
|
||
<view class="flex align-center">
|
||
<text>{{i18n.c2c.text9}}:</text>
|
||
<text class="nummedium-font">{{item.symbol}}{{item.min_price}}-{{item.max_price}}</text>
|
||
</view>
|
||
<text class="font-30 color-0165EE numbold-font">{{item.symbol}}{{item.price}}</text>
|
||
</view>
|
||
<view class="flex align-center justify-between margin-t-10">
|
||
<image class="width-46 height-42" src="/static/imgs/index/yinhangka.png" mode=""></image>
|
||
<view @click.stop="openbuyshow(item)" :class="isbuy==2?'bj-0165EE':'bj-2E558A'"
|
||
class="width-140 height-52 radiu-10 line-height-52 text-center">
|
||
<text class="font-26 color-white">{{isbuy==2?i18n.c2c.text10:i18n.c2c.text11}}</text>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</z-paging>
|
||
|
||
<!-- 买卖弹窗 -->
|
||
<u-popup v-model="buyshow" mode="bottom" border-radius="20">
|
||
<view class="padding-w-30 padding-b-36"
|
||
:style="'background-color: '+theme.bg+';color: '+theme.text">
|
||
<view class="height-101 flex align-center justify-center">
|
||
<text class="font-30 weight-bold">{{isbuy==2?i18n.c2c.text10:i18n.c2c.text11}}{{buyitem.curr_name}}</text>
|
||
<view @click.stop="buyshow=false" style="position: absolute;right: 30rpx;"
|
||
class="font-26 color-C3C3C3">
|
||
{{i18n.c2c.text12}}
|
||
</view>
|
||
</view>
|
||
<!-- 单价 -->
|
||
<view class="height-66 flex align-center">
|
||
<text class="font-30 margin-r-30">{{i18n.c2c.text8}}</text>
|
||
<text class="font-30 color-0165EE nummedium-font">{{buyitem.symbol}}{{buyitem.price}}</text>
|
||
</view>
|
||
<!-- 购买方式 -->
|
||
<view class="height-66 margin-t-28 flex align-center">
|
||
<text @click.stop="changetype(1)" :class="type==1?'font-30':'font-26 color-C3C3C3'"
|
||
class="margin-r-90">{{i18n.c2c.text13}}{{isbuy==2?i18n.c2c.text10:i18n.c2c.text11}}</text>
|
||
<text @click.stop="changetype(2)"
|
||
:class="type==2?'font-30':'font-26 color-C3C3C3'">{{i18n.c2c.text14}}{{isbuy==2?i18n.c2c.text10:i18n.c2c.text11}}</text>
|
||
</view>
|
||
<!-- 金额数量输入框 -->
|
||
<view class="margin-t-14">
|
||
<view class="numbox">
|
||
<input class="font-26 flex-1 padding-r-30 color-D1D3D8" type="number" v-model="number"
|
||
:placeholder="i18n.c2c.tos4" placeholder-class="color-D1D3D8" />
|
||
<view class="flex align-center font-26">
|
||
<text v-if="type==1" class="nummedium-font">{{buyitem.symbol}}</text>
|
||
<text v-if="type==2" class="nummedium-font">{{buyitem.curr_name}}</text>
|
||
<text class="margin-w-5">丨</text>
|
||
<text @click="all(buyitem)" class="font-30 color-0165EE">{{i18n.c2c.text15}}</text>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
<!-- 限额 -->
|
||
<view class="font-26 color-C3C3C3 margin-t-8">
|
||
{{i18n.c2c.text9}}{{buyitem.symbol}}{{buyitem.min_price}}-{{buyitem.max_price}}
|
||
</view>
|
||
<!-- 交易数量 -->
|
||
<view class="height-66 flex align-center justify-between margin-t-22">
|
||
<text class="font-30 margin-r-30">{{i18n.c2c.text16}}</text>
|
||
<text v-if="type==1" class="font-30 color-0165EE nummedium-font">
|
||
{{(number/buyitem.price).toFixed(4)}} {{buyitem.curr_name}}
|
||
</text>
|
||
<text v-if="type==2" class="font-30 color-0165EE nummedium-font">
|
||
{{number==''?'0':number}} {{buyitem.curr_name}}
|
||
</text>
|
||
</view>
|
||
<!-- 实付款 -->
|
||
<view class="height-66 flex align-center justify-between margin-t-22">
|
||
<text class="font-30 margin-r-30">{{isbuy==2?i18n.c2c.text17:i18n.c2c.text18}}</text>
|
||
<text v-if="type==1" class="font-48 color-FF4040 nummedium-font">
|
||
{{buyitem.symbol}} {{number==''?'0.00':number}}
|
||
</text>
|
||
<text v-if="type==2" class="font-48 color-FF4040 nummedium-font">
|
||
{{buyitem.symbol}} {{(number*buyitem.price).toFixed(2)}}
|
||
</text>
|
||
</view>
|
||
<!-- 收款账户 -->
|
||
<view @click="show2=true" v-if="isbuy==1"
|
||
class="height-66 flex align-center justify-between margin-t-22">
|
||
<text class="font-30 margin-r-30">{{i18n.c2c.text19}}</text>
|
||
<view class="flex align-center font-30">
|
||
<text v-if="collecid!=''">{{collecdata.card_num|changestyle}}</text>
|
||
<u-icon name="arrow-right" color="#8B99A2" size="24"></u-icon>
|
||
</view>
|
||
</view>
|
||
|
||
<!-- 交易密码 -->
|
||
<view class="margin-t-22">
|
||
<text class="font-30 margin-r-30">{{i18n.c2c.text20}}</text>
|
||
<view class="numbox margin-t-25">
|
||
<input class="font-26 flex-1 color-D1D3D8" type="number" v-model="paypwd"
|
||
:placeholder="i18n.c2c.tos3" placeholder-class="color-D1D3D8" password />
|
||
</view>
|
||
</view>
|
||
<!-- 按钮 -->
|
||
<view class="margin-t-61 flex align-center justify-between">
|
||
<view @click.stop="buyshow=false"
|
||
class="width-305 height-96 radiu-10 bj-D1D3D8 line-height-96 text-center">
|
||
<text class="font-30 color-white">{{i18n.c2c.text12}}</text>
|
||
</view>
|
||
<view @click.stop="closebuyshow"
|
||
class="width-305 height-96 radiu-10 bj-0165EE line-height-96 text-center">
|
||
<text
|
||
class="font-30 color-white">{{i18n.c2c.text5}}{{isbuy==2?i18n.c2c.text10:i18n.c2c.text11}}</text>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</u-popup>
|
||
<!-- 法币弹窗 -->
|
||
<u-popup v-model="show" mode="bottom" border-radius="20">
|
||
<view class="padding-w-30 padding-b-36"
|
||
:style="'background-color: '+theme.bg+';color: '+theme.text">
|
||
<view class="height-96 line-height-96 text-center relative">
|
||
<text class="font-30 weight-bold">{{i18n.c2c.text21}}</text>
|
||
<text @click.stop="show=false" class="font-26 color-C3C3C3 absolute"
|
||
style="right: 0;">{{i18n.c2c.text12}}</text>
|
||
</view>
|
||
<scroll-view scroll-y="true" class="height-450">
|
||
<view @click="setFaby(item)" v-for="(item,index) in fabylist"
|
||
class="height-96 flex align-center justify-between">
|
||
<view class="flex align-center">
|
||
<image class="width-48 height-48 radiu-24" :src="item.pay_image" mode=""></image>
|
||
<text class="font-28 margin-l-16">{{item.curr_name}}</text>
|
||
</view>
|
||
<image class="width-36 height-36" :src="fabyid==item.id?XZ:WX" mode=""></image>
|
||
</view>
|
||
</scroll-view>
|
||
</view>
|
||
</u-popup>
|
||
<!-- 收款账户弹窗 -->
|
||
<u-popup v-model="show2" mode="bottom" border-radius="20">
|
||
<view class="padding-w-30 padding-b-36"
|
||
:style="'background-color: '+theme.bg+';color: '+theme.text">
|
||
<view class="height-96 line-height-96 text-center relative">
|
||
<text class="font-30 weight-bold">{{i18n.c2c.text19}}</text>
|
||
<text @click.stop="show2=false" class="font-26 color-C3C3C3 absolute"
|
||
style="right: 0;">{{i18n.c2c.text12}}</text>
|
||
</view>
|
||
<scroll-view scroll-y="true" class="height-450">
|
||
<view @click="setcollec(item)" v-for="(item,index) in collec"
|
||
:style="'background-color: '+theme.fu_bg+';color: '+theme.text"
|
||
class="height-96 flex align-center justify-between margin-b-10 radiu-10 padding-w-20">
|
||
<view class="flex-1 padding-r-24 height-96 flex direction-column justify-around">
|
||
<view class="flex align-center">
|
||
<text>{{item.username}}</text>
|
||
<text class="font-28 margin-l-16">{{item.card_num|changestyle}}</text>
|
||
</view>
|
||
<view class="font-24 color-C3C3C3">{{item.bank_name}}</view>
|
||
</view>
|
||
<image class="width-36 height-36" :src="collecid==item.id?XZ:WX" mode=""></image>
|
||
</view>
|
||
</scroll-view>
|
||
</view>
|
||
</u-popup>
|
||
<!-- 去实名 -->
|
||
<u-popup style="z-index: 5000;" border-radius="18" mode="center" v-model="TSShow">
|
||
<view class="width-600 padding-b-20"
|
||
:style="'background-color: '+theme.bg+';color: '+theme.text">
|
||
<view class="width-100b height-220 padding-w-30 padding-c-40 flex direction-column align-center justify-between">
|
||
<image class="width-64 height-64" src="/static/imgs/quantify/tongzhi@2x.png" mode=""></image>
|
||
<view class="font-26 weight-bold text-center padding-w-20">{{i18n.c2c.text22}}
|
||
</view>
|
||
</view>
|
||
<view class="width-100b height-90 flex align-center justify-center">
|
||
<view @click="TSShow=false,router.push('/pages/my/safety/real')" class="qcbtn3">{{i18n.c2c.text23}}
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</u-popup>
|
||
</view>
|
||
</template>
|
||
|
||
<script>
|
||
export default {
|
||
data() {
|
||
return {
|
||
statusBar: uni.getSystemInfoSync().statusBarHeight,
|
||
isbuy: 2, //2买,1卖
|
||
list: [],
|
||
page: 1,
|
||
state: 'more',
|
||
show: false, //法币弹窗
|
||
show1: false, //支付方式弹窗
|
||
buyshow: false, //购买弹窗
|
||
typeshow: false, //收款方式弹窗
|
||
type: 1, //1按金额购买,2按数量购买
|
||
currid: '', //当前币种id
|
||
currlist: [], //币种列表
|
||
faby: '', //法币
|
||
fabyid: '', //法币id
|
||
fabylist: [], //法币列表
|
||
WX: '/static/imgs/quantify/weixuanzhong@2x.png',
|
||
XZ: '/static/imgs/quantify/xuanzhong@2x.png',
|
||
ispay: false, //支付方式弹窗
|
||
payid: 0, //选择的支付方式
|
||
payname: 'Payment Method',
|
||
paylist: [{
|
||
id: 0,
|
||
name: 'All'
|
||
},
|
||
{
|
||
id: 1,
|
||
name: 'Bank Card'
|
||
}
|
||
],
|
||
isnum: false, //交易金额弹窗
|
||
payprice: '', //交易金额
|
||
paypriceval: 'Transaction Amount',
|
||
|
||
number: '',
|
||
paypwd: '',
|
||
buyitem: '', //购买对象
|
||
flag: true,
|
||
|
||
show2: false,
|
||
collec: [], //收款账户列表
|
||
collecid: '', //当前收款账户id
|
||
collecdata: '', //当前收款账户对象
|
||
TSShow: false,
|
||
|
||
theme: '',
|
||
}
|
||
},
|
||
onLoad() {
|
||
this.payname = this.i18n.c2c.text26
|
||
this.paypriceval = this.i18n.c2c.text24
|
||
this.paylist[0].name = this.i18n.c2c.text15
|
||
this.paylist[1].name = this.i18n.c2c.text25
|
||
},
|
||
computed: {
|
||
i18n() {
|
||
return this.$t('message');
|
||
}
|
||
},
|
||
onShow() {
|
||
if (uni.getStorageSync("theme") == "dark") {
|
||
this.theme = this.$store.state.darkTheme
|
||
} else {
|
||
this.theme = this.$store.state.lightTheme
|
||
}
|
||
this.getFabylist()
|
||
this.getCurrlist()
|
||
this.getcollection()
|
||
},
|
||
filters: {
|
||
changestyle(e) {
|
||
let str = e
|
||
var reg = /^(\d{4})\d+(\d{4})$/;
|
||
str = str.replace(reg, "$1 **** $2");
|
||
return str
|
||
}
|
||
},
|
||
methods: {
|
||
// 选择账户
|
||
setcollec(item) {
|
||
if (this.collecid != item.id) {
|
||
this.collecid = item.id
|
||
this.collecdata = item
|
||
this.show2 = false
|
||
}
|
||
},
|
||
// 获取收款账户列表
|
||
getcollection() {
|
||
this.post('/marketotc/get_collection').then(res => {
|
||
console.log('收款账户列表', res)
|
||
if (res.code == 1 && res.data && res.data.length > 0) {
|
||
this.collec = res.data
|
||
this.collecid = res.data[0].id
|
||
this.collecdata = res.data[0]
|
||
} else {
|
||
// 如果没有收款账户或数据为空,设置默认值或提示用户添加收款账户
|
||
this.collec = []
|
||
this.collecid = ''
|
||
this.collecdata = ''
|
||
}
|
||
})
|
||
},
|
||
// 挂单出售
|
||
getsell() {
|
||
if (this.number == '' && this.type == 1) return this.tos(this.i18n.c2c.tos1)
|
||
if (this.number == '' && this.type == 2) return this.tos(this.i18n.c2c.tos2)
|
||
if (this.paypwd == '') return this.tos(this.i18n.c2c.tos3)
|
||
if (!this.flag) {
|
||
return
|
||
} else {
|
||
this.flag = false
|
||
let obj = {
|
||
id: this.buyitem.id,
|
||
num: this.number,
|
||
pay_pwd: this.paypwd,
|
||
buy_type: this.type,
|
||
collection_id: this.collecid
|
||
}
|
||
this.post('/marketotc/order_sell', obj).then(res => {
|
||
console.log('下单返回', res)
|
||
this.flag = true
|
||
uni.hideLoading()
|
||
if (res.code == 1) {
|
||
this.tos(res.msg)
|
||
this.buyshow = false
|
||
setTimeout(() => {
|
||
uni.navigateTo({
|
||
url: '/pages/index/orderRecord'
|
||
})
|
||
}, 500)
|
||
} else {
|
||
if (res.data.jump == 1) {
|
||
uni.hideToast()
|
||
this.buyshow = false
|
||
this.TSShow = true
|
||
}
|
||
}
|
||
})
|
||
}
|
||
},
|
||
// 挂单买入
|
||
getbuy() {
|
||
if (this.number == '' && this.type == 1) return this.tos(this.i18n.c2c.tos1)
|
||
if (this.number == '' && this.type == 2) return this.tos(this.i18n.c2c.tos2)
|
||
if (this.paypwd == '') return this.tos(this.i18n.c2c.tos3)
|
||
if (!this.flag) {
|
||
return
|
||
} else {
|
||
this.flag = false
|
||
let obj = {
|
||
id: this.buyitem.id,
|
||
num: this.number,
|
||
pay_pwd: this.paypwd,
|
||
buy_type: this.type
|
||
}
|
||
this.post('/marketotc/order_buy', obj).then(res => {
|
||
console.log('下单返回', res)
|
||
this.flag = true
|
||
uni.hideLoading()
|
||
if (res.code == 1) {
|
||
this.tos(res.msg)
|
||
this.buyshow = false
|
||
setTimeout(() => {
|
||
uni.navigateTo({
|
||
url: '/pages/index/orderRecord'
|
||
})
|
||
}, 500)
|
||
} else {
|
||
if (res.data.jump == 1) {
|
||
uni.hideToast()
|
||
this.buyshow = false
|
||
this.TSShow = true
|
||
}
|
||
}
|
||
})
|
||
}
|
||
},
|
||
// 关闭买卖弹窗
|
||
closebuyshow() {
|
||
var that = this
|
||
uni.showLoading({
|
||
title: that.i18n.c2c.tos5,
|
||
mask: true
|
||
})
|
||
if (this.isbuy == 2) {
|
||
this.getbuy()
|
||
} else {
|
||
this.getsell()
|
||
}
|
||
},
|
||
// 全部
|
||
all(item) {
|
||
if (this.type == 1) {
|
||
this.number = item.money_fb
|
||
} else {
|
||
this.number = item.money_num
|
||
}
|
||
},
|
||
// 打开购买或出售弹窗
|
||
openbuyshow(item) {
|
||
console.log(item)
|
||
if (item.is_me) {
|
||
this.tos(this.i18n.c2c.tos6)
|
||
} else {
|
||
this.buyitem = item
|
||
this.number = ''
|
||
this.paypwd = ''
|
||
this.type = 1
|
||
this.buyshow = true
|
||
}
|
||
},
|
||
// 获取挂单列表
|
||
queryList(pageNo, pageSize) {
|
||
let obj = {
|
||
page:this.pageNo,
|
||
page_num: pageSize,
|
||
type: this.isbuy,
|
||
country_id: this.fabyid,
|
||
curr_id: this.currid,
|
||
payment: this.payid,
|
||
price: this.payprice
|
||
}
|
||
setTimeout(()=>{
|
||
this.post('/marketotc/market_list', obj).then(res => {
|
||
if (res.code == 1) {
|
||
console.log(res)
|
||
this.$refs.paging.complete(res.data.data);
|
||
}
|
||
})
|
||
},500)
|
||
},
|
||
// 重置交易金额
|
||
resetpayprice() {
|
||
this.paypriceval = this.i18n.c2c.text24
|
||
this.payprice = ''
|
||
this.isnum = !this.isnum
|
||
this.queryList(1,10)
|
||
},
|
||
// 设置交易金额
|
||
setpayprice() {
|
||
if (this.payprice != '' && this.payprice != 0) {
|
||
this.paypriceval = this.payprice
|
||
this.isnum = !this.isnum
|
||
this.queryList(1,10)
|
||
}
|
||
},
|
||
// 改变交易金额弹窗
|
||
changeisnum() {
|
||
if (this.ispay) {
|
||
this.ispay = !this.ispay
|
||
} else {
|
||
this.isnum = !this.isnum
|
||
}
|
||
},
|
||
// 改变支付方式弹窗
|
||
changeispay() {
|
||
if (this.isnum) {
|
||
this.isnum = !this.isnum
|
||
} else {
|
||
this.ispay = !this.ispay
|
||
}
|
||
},
|
||
// 检查支付方式和交易金额弹窗
|
||
checkclose() {
|
||
if (this.ispay) {
|
||
this.ispay = false
|
||
}
|
||
if (this.isnum) {
|
||
this.isnum = false
|
||
}
|
||
},
|
||
// 选择支付方式
|
||
setpay(item) {
|
||
if (this.payid != item.id) {
|
||
this.ispay = false
|
||
this.payid = item.id
|
||
this.queryList(1,10)
|
||
if (item.name == this.i18n.c2c.text15) {
|
||
this.payname = this.i18n.c2c.text26
|
||
} else {
|
||
this.payname = item.name
|
||
}
|
||
}
|
||
},
|
||
// 获取交易币种
|
||
getCurrlist() {
|
||
this.post('/marketotc/get_curr').then(res => {
|
||
console.log('币种列表', res)
|
||
if (res.code == 1) {
|
||
this.currlist = res.data
|
||
this.currid = res.data[0].id
|
||
}
|
||
})
|
||
},
|
||
// 选择法币
|
||
setFaby(item) {
|
||
this.faby = item.curr_name
|
||
this.fabyid = item.id
|
||
this.show = false
|
||
this.queryList(1,10)
|
||
},
|
||
// 获取法币列表
|
||
getFabylist() {
|
||
this.post('/marketotc/get_country').then(res => {
|
||
console.log('法币列表', res)
|
||
if (res.code == 1) {
|
||
this.fabylist = res.data
|
||
this.faby = res.data[0].curr_name
|
||
this.fabyid = res.data[0].id
|
||
}
|
||
})
|
||
},
|
||
// 选择币种
|
||
setiscurr(i) {
|
||
if (this.currid != i) {
|
||
this.currid = i
|
||
this.queryList(1,10)
|
||
}
|
||
},
|
||
// 选择金额或数量购买
|
||
changetype(i) {
|
||
if (this.type != i) {
|
||
this.type = i
|
||
this.number = ''
|
||
}
|
||
},
|
||
// 选择买或卖
|
||
changeisbuy(i) {
|
||
if (this.isbuy != i) {
|
||
this.isbuy = i
|
||
this.queryList(1,10)
|
||
}
|
||
},
|
||
}
|
||
}
|
||
</script>
|
||
|
||
<style lang="scss">
|
||
.transition1 {
|
||
overflow: hidden;
|
||
transition: 1s;
|
||
}
|
||
|
||
.fixed1 {
|
||
position: fixed;
|
||
top: 0;
|
||
z-index: 1000;
|
||
background: #06C38D;
|
||
}
|
||
|
||
.fabubox {
|
||
width: 180rpx;
|
||
height: 56rpx;
|
||
background: #FFFFFF;
|
||
border-radius: 28rpx 0rpx 0rpx 28rpx;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
font-size: 28rpx;
|
||
color: #0165EE;
|
||
}
|
||
|
||
.onfont {
|
||
font-size: 32rpx;
|
||
font-weight: bold;
|
||
color: #FFFFFF;
|
||
}
|
||
|
||
.offfont {
|
||
font-size: 28rpx;
|
||
font-weight: 400;
|
||
color: #FFFFFF;
|
||
opacity: 0.5;
|
||
}
|
||
|
||
.select {
|
||
font-size: 28rpx;
|
||
font-family: "Bold" !important;
|
||
font-style: normal;
|
||
-webkit-font-smoothing: antialiased;
|
||
-moz-osx-font-smoothing: grayscale;
|
||
color: #06C38D;
|
||
}
|
||
|
||
.noselect {
|
||
font-size: 26rpx;
|
||
font-family: "Medium" !important;
|
||
font-style: normal;
|
||
-webkit-font-smoothing: antialiased;
|
||
-moz-osx-font-smoothing: grayscale;
|
||
color: #8B99A2;
|
||
}
|
||
|
||
.border-bottom {
|
||
border-bottom: 1rpx solid rgba(191, 195, 199, 0.2);
|
||
}
|
||
|
||
.bj-c3c3c3-02 {
|
||
background-color: rgba(195, 195, 195, 0.2);
|
||
}
|
||
|
||
.numbox {
|
||
width: 690rpx;
|
||
height: 96rpx;
|
||
// background: #FFFFFF;
|
||
border: 1rpx solid #D1D3D8;
|
||
opacity: 1;
|
||
border-radius: 10rpx;
|
||
padding: 0 16rpx;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: space-between;
|
||
}
|
||
|
||
.searchbox {
|
||
width: 610rpx;
|
||
height: 60rpx;
|
||
background: #F6F8FC;
|
||
border: 1rpx solid rgba(191, 195, 199, 0.2);
|
||
opacity: 1;
|
||
border-radius: 30rpx;
|
||
}
|
||
|
||
.offbox {
|
||
width: 750rpx;
|
||
height: 0rpx;
|
||
overflow: hidden;
|
||
// background-color: #FFFFFF;
|
||
transition: height 0.3s;
|
||
box-shadow: 0rpx 4rpx 10rpx #EBF0F6;
|
||
}
|
||
|
||
.onbox {
|
||
width: 750rpx;
|
||
height: 200rpx;
|
||
// background-color: #FFFFFF;
|
||
transition: height 0.3s;
|
||
box-shadow: 0rpx 4rpx 10rpx #EBF0F6;
|
||
}
|
||
|
||
.offbox1 {
|
||
width: 750rpx;
|
||
height: 0rpx;
|
||
overflow: hidden;
|
||
// background-color: #FFFFFF;
|
||
transition: height 0.3s;
|
||
position: absolute;
|
||
left: -240rpx;
|
||
}
|
||
|
||
.onbox1 {
|
||
width: 750rpx;
|
||
height: 200rpx;
|
||
// background-color: #FFFFFF;
|
||
transition: height 0.3s;
|
||
position: absolute;
|
||
left: -240rpx;
|
||
}
|
||
|
||
.selectpay {
|
||
width: 220rpx;
|
||
height: 46rpx;
|
||
border-radius: 23rpx;
|
||
border: 1rpx solid #06C38D;
|
||
line-height: 46rpx;
|
||
text-align: center;
|
||
font-size: 26rpx;
|
||
color: #06C38D;
|
||
margin: 0 20rpx 10rpx 0;
|
||
}
|
||
|
||
.noselectpay {
|
||
width: 220rpx;
|
||
height: 46rpx;
|
||
border-radius: 23rpx;
|
||
border: 1rpx solid #D1D3D8;
|
||
line-height: 46rpx;
|
||
text-align: center;
|
||
font-size: 26rpx;
|
||
color: #D1D3D8;
|
||
margin: 0 20rpx 10rpx 0;
|
||
}
|
||
|
||
.inputbox {
|
||
width: 100%;
|
||
height: 68rpx;
|
||
border-radius: 10rpx;
|
||
// background: #F6F8FC;
|
||
border: 1rpx solid rgba(195, 195, 195, 0.3);
|
||
font-size: 28rpx;
|
||
// color: #17181A;
|
||
padding: 0 24rpx;
|
||
}
|
||
|
||
.mask1 {
|
||
width: 100vh;
|
||
height: calc(var(--status-bar-height) + 292rpx);
|
||
position: fixed;
|
||
top: 0;
|
||
z-index: 10000;
|
||
// background: #007F0E;
|
||
}
|
||
|
||
.mask2 {
|
||
width: 100vh;
|
||
height: calc(100vh - var(--status-bar-height) - 558rpx);
|
||
position: fixed;
|
||
bottom: 0;
|
||
z-index: 10000;
|
||
background: rgba(0, 0, 0, 0.5);
|
||
}
|
||
|
||
.qcbtn3 {
|
||
width: 320rpx;
|
||
height: 86rpx;
|
||
background: #0165EE;
|
||
border-radius: 20rpx;
|
||
font-size: 28rpx;
|
||
font-weight: bold;
|
||
color: #FFFFFF;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
}
|
||
</style>
|