|
@@ -8,27 +8,35 @@
|
|
|
<div class="info-left">
|
|
<div class="info-left">
|
|
|
<div class="shangjia">
|
|
<div class="shangjia">
|
|
|
<img src="@/assets/img/index/user/default-head.png" alt="" />
|
|
<img src="@/assets/img/index/user/default-head.png" alt="" />
|
|
|
- <div class="left-name pf500 fs14 fc2C3131">商家昵称</div>
|
|
|
|
|
- <div class="vip-flag pf500 fs10 fcDF384C">V2</div>
|
|
|
|
|
|
|
+ <div class="left-name pf500 fs14 fc2C3131">{{ payList.otc_name }}</div>
|
|
|
|
|
+ <div class="vip-flag pf500 fs10 fcDF384C">{{ payList.otc_level }}</div>
|
|
|
|
|
+ </div>
|
|
|
|
|
+ <div class="chengjiao pf400 fs10 fc999999">
|
|
|
|
|
+ 成交量 {{ orderInfo.total }} · {{ orderInfo.rate }} 成交率
|
|
|
</div>
|
|
</div>
|
|
|
- <div class="chengjiao pf400 fs10 fc999999">成交量 12550 · 98.95% 成交率</div>
|
|
|
|
|
</div>
|
|
</div>
|
|
|
<div class="info-right">
|
|
<div class="info-right">
|
|
|
<div class="text pf400 fs10 fc999999">单价</div>
|
|
<div class="text pf400 fs10 fc999999">单价</div>
|
|
|
<div class="price-number pf400 fs10 fc999999">
|
|
<div class="price-number pf400 fs10 fc999999">
|
|
|
¥
|
|
¥
|
|
|
- <span class="pf500 fs16 fc333333">6.58</span>
|
|
|
|
|
|
|
+ <span class="pf500 fs16 fc333333">{{
|
|
|
|
|
+ Number(payList.price).toFixed(2)
|
|
|
|
|
+ }}</span>
|
|
|
/USDT
|
|
/USDT
|
|
|
</div>
|
|
</div>
|
|
|
</div>
|
|
</div>
|
|
|
</div>
|
|
</div>
|
|
|
<div class="required-quantity pf500 fs14 fc999999">
|
|
<div class="required-quantity pf500 fs14 fc999999">
|
|
|
<div>需求数量</div>
|
|
<div>需求数量</div>
|
|
|
- <div>150200.00 USDT</div>
|
|
|
|
|
|
|
+ <div>{{ Number(payList.left_count).toFixed(2) }} USDT</div>
|
|
|
</div>
|
|
</div>
|
|
|
<div class="required-quantity pf500 fs14 fc999999">
|
|
<div class="required-quantity pf500 fs14 fc999999">
|
|
|
<div>单笔限额</div>
|
|
<div>单笔限额</div>
|
|
|
- <div>100.00 - 252020.00 USDT</div>
|
|
|
|
|
|
|
+ <div>
|
|
|
|
|
+ {{ Number(payList.min_limit).toFixed(2) }} -
|
|
|
|
|
+ {{ Number(payList.max_limit).toFixed(2) }}
|
|
|
|
|
+ USDT
|
|
|
|
|
+ </div>
|
|
|
</div>
|
|
</div>
|
|
|
<div class="number-input">
|
|
<div class="number-input">
|
|
|
<input
|
|
<input
|
|
@@ -38,17 +46,24 @@
|
|
|
v-model="buyCount" />
|
|
v-model="buyCount" />
|
|
|
<div class="all pf400 fs14 fc333333">USDT <span class="fcDF384C">全部</span></div>
|
|
<div class="all pf400 fs14 fc333333">USDT <span class="fcDF384C">全部</span></div>
|
|
|
</div>
|
|
</div>
|
|
|
- <div class="use-number pf400 fs12 fc333333">可卖 215.0508 USDT</div>
|
|
|
|
|
|
|
+ <div class="use-number pf400 fs12 fc333333">可卖 {{ usdtBalance }} USDT</div>
|
|
|
<div class="account pf500 fs14 fc999999">
|
|
<div class="account pf500 fs14 fc999999">
|
|
|
<div>收款方式</div>
|
|
<div>收款方式</div>
|
|
|
- <div class="account-right">
|
|
|
|
|
|
|
+ <div
|
|
|
|
|
+ class="account-right fcDF384C"
|
|
|
|
|
+ v-if="paymentWayFlag == 0"
|
|
|
|
|
+ @click="paymentAccountFlag = true">
|
|
|
|
|
+ 请选择
|
|
|
|
|
+ <img src="@/assets/icon/asset/right-arrow-black.svg" alt="" />
|
|
|
|
|
+ </div>
|
|
|
|
|
+ <div v-if="paymentWayFlag == 1">
|
|
|
<div class="color"></div>
|
|
<div class="color"></div>
|
|
|
- 银行卡
|
|
|
|
|
|
|
+ {{ paymentWay }}
|
|
|
</div>
|
|
</div>
|
|
|
</div>
|
|
</div>
|
|
|
<div class="account pf500 fs14 fc999999">
|
|
<div class="account pf500 fs14 fc999999">
|
|
|
<div>收款账号</div>
|
|
<div>收款账号</div>
|
|
|
- <div class="account-right fcDF384C">
|
|
|
|
|
|
|
+ <div class="account-right fcDF384C" @click="moneyAccount(1)">
|
|
|
请选择
|
|
请选择
|
|
|
<img src="@/assets/icon/asset/right-arrow-black.svg" alt="" />
|
|
<img src="@/assets/icon/asset/right-arrow-black.svg" alt="" />
|
|
|
</div>
|
|
</div>
|
|
@@ -58,29 +73,41 @@
|
|
|
<InputPassword
|
|
<InputPassword
|
|
|
v-show="inputPasswordFlag"
|
|
v-show="inputPasswordFlag"
|
|
|
@inputPasswordClose="inputPasswordClose"></InputPassword>
|
|
@inputPasswordClose="inputPasswordClose"></InputPassword>
|
|
|
|
|
+ <PaymentAccount
|
|
|
|
|
+ v-show="paymentAccountFlag"
|
|
|
|
|
+ :paymentAccountTab="paymentAccountTab"
|
|
|
|
|
+ @paymentAccountClose="paymentAccountClose"></PaymentAccount>
|
|
|
</div>
|
|
</div>
|
|
|
</template>
|
|
</template>
|
|
|
<script setup>
|
|
<script setup>
|
|
|
import { useRoute, useRouter } from "vue-router";
|
|
import { useRoute, useRouter } from "vue-router";
|
|
|
- import { watch, ref } from "vue";
|
|
|
|
|
- import { BuyCoin } from "@/api/otc";
|
|
|
|
|
|
|
+ import { watch, ref, toRef, onMounted } from "vue";
|
|
|
|
|
+ import { BuyCoin, GetBankManager } from "@/api/otc";
|
|
|
|
|
+ import { GetBalance } from "@/api/index";
|
|
|
import { showToast, showFailToast } from "vant";
|
|
import { showToast, showFailToast } from "vant";
|
|
|
import InputPassword from "@/views/user/InputPassword.vue";
|
|
import InputPassword from "@/views/user/InputPassword.vue";
|
|
|
|
|
+ import PaymentAccount from "./PaymentAccount.vue";
|
|
|
|
|
|
|
|
const router = useRouter();
|
|
const router = useRouter();
|
|
|
|
|
|
|
|
- const props = defineProps(["otcId", "orderId"]);
|
|
|
|
|
|
|
+ const props = defineProps(["otcId", "orderId", "currentOrderData"]);
|
|
|
const emits = defineEmits(["sellClose"]);
|
|
const emits = defineEmits(["sellClose"]);
|
|
|
|
|
+ const currentOrderDataRef = toRef(props, "currentOrderData");
|
|
|
|
|
|
|
|
|
|
+ const payList = ref({});
|
|
|
|
|
+ const orderInfo = ref({});
|
|
|
const otcId = ref();
|
|
const otcId = ref();
|
|
|
const orderId = ref();
|
|
const orderId = ref();
|
|
|
const buyCount = ref();
|
|
const buyCount = ref();
|
|
|
|
|
+ const usdtBalance = ref();
|
|
|
|
|
+ const paymentWayFlag = ref();
|
|
|
|
|
+ const paymentWay = ref();
|
|
|
|
|
+ const paymentId = ref();
|
|
|
|
|
|
|
|
watch(
|
|
watch(
|
|
|
() => props.otcId,
|
|
() => props.otcId,
|
|
|
async (newVal, oldVal) => {
|
|
async (newVal, oldVal) => {
|
|
|
otcId.value = newVal;
|
|
otcId.value = newVal;
|
|
|
- console.log(otcId.value);
|
|
|
|
|
}
|
|
}
|
|
|
);
|
|
);
|
|
|
|
|
|
|
@@ -91,31 +118,88 @@
|
|
|
}
|
|
}
|
|
|
);
|
|
);
|
|
|
|
|
|
|
|
- const inputPasswordFlag = ref(false);
|
|
|
|
|
- const inputPasswordClose = async (password) => {
|
|
|
|
|
- if (buyCount.value > 0) {
|
|
|
|
|
- const params = {
|
|
|
|
|
- pid: orderId.value,
|
|
|
|
|
- count: buyCount.value,
|
|
|
|
|
- password: password,
|
|
|
|
|
- };
|
|
|
|
|
- const data = await BuyCoin(params);
|
|
|
|
|
- if (data.msg == "password error") {
|
|
|
|
|
- showFailToast("支付密码错误");
|
|
|
|
|
- } else if (data.msg == "please set your password") {
|
|
|
|
|
- showFailToast("请前往个人中心设置您的密码");
|
|
|
|
|
- } else if (data.data == "success") {
|
|
|
|
|
- showToast("出售成功");
|
|
|
|
|
- emits("sellClose");
|
|
|
|
|
|
|
+ watch(
|
|
|
|
|
+ currentOrderDataRef,
|
|
|
|
|
+ async (val) => {
|
|
|
|
|
+ if (val) {
|
|
|
|
|
+ payList.value = val;
|
|
|
|
|
+ orderInfo.value = payList.value.order_info;
|
|
|
|
|
+ await getBankManagerData();
|
|
|
}
|
|
}
|
|
|
|
|
+ },
|
|
|
|
|
+ { deep: true }
|
|
|
|
|
+ );
|
|
|
|
|
+
|
|
|
|
|
+ const paymentAccountTab = ref();
|
|
|
|
|
+ const paymentAccountFlag = ref(false);
|
|
|
|
|
+ const paymentAccountClose = (id) => {
|
|
|
|
|
+ paymentAccountFlag.value = false;
|
|
|
|
|
+ paymentId.value = id;
|
|
|
|
|
+ };
|
|
|
|
|
+
|
|
|
|
|
+ const moneyAccount = (index) => {
|
|
|
|
|
+ paymentAccountTab.value = index;
|
|
|
|
|
+ paymentAccountFlag.value = true;
|
|
|
|
|
+ };
|
|
|
|
|
+
|
|
|
|
|
+ const getBankManagerData = async () => {
|
|
|
|
|
+ const data = await GetBankManager();
|
|
|
|
|
+ if (data.data.data.length == 0) {
|
|
|
|
|
+ paymentWayFlag.value = 0;
|
|
|
} else {
|
|
} else {
|
|
|
- showFailToast("请输入您要卖出的数量");
|
|
|
|
|
|
|
+ paymentWayFlag.value = 1;
|
|
|
|
|
+ if (data.data.data[0].status == 1) {
|
|
|
|
|
+ paymentWay.value = "银行卡";
|
|
|
|
|
+ } else if (data.data.data[0].status == 2) {
|
|
|
|
|
+ paymentWay.value = "支付宝";
|
|
|
|
|
+ } else if (data.data.data[0].status == 3) {
|
|
|
|
|
+ paymentWay.value = "微信";
|
|
|
|
|
+ }
|
|
|
|
|
+ }
|
|
|
|
|
+ };
|
|
|
|
|
+
|
|
|
|
|
+ const GetUsdtBalanceData = async () => {
|
|
|
|
|
+ const params = {
|
|
|
|
|
+ coin_id: "",
|
|
|
|
|
+ };
|
|
|
|
|
+ const data = await GetBalance(params);
|
|
|
|
|
+ if (data) {
|
|
|
|
|
+ usdtBalance.value = data;
|
|
|
|
|
+ }
|
|
|
|
|
+ };
|
|
|
|
|
+
|
|
|
|
|
+ const inputPasswordFlag = ref(false);
|
|
|
|
|
+ const inputPasswordClose = async (password) => {
|
|
|
|
|
+ const params = {
|
|
|
|
|
+ pid: orderId.value,
|
|
|
|
|
+ count: buyCount.value,
|
|
|
|
|
+ password: password,
|
|
|
|
|
+ card_id: paymentId.value,
|
|
|
|
|
+ };
|
|
|
|
|
+ const data = await BuyCoin(params);
|
|
|
|
|
+ if (data.msg == "password error") {
|
|
|
|
|
+ showFailToast("支付密码错误");
|
|
|
|
|
+ } else if (data.msg == "please set your password") {
|
|
|
|
|
+ showFailToast("请前往个人中心设置您的密码");
|
|
|
|
|
+ } else if (data.data == "success") {
|
|
|
|
|
+ showToast("出售成功");
|
|
|
|
|
+ emits("sellClose");
|
|
|
}
|
|
}
|
|
|
};
|
|
};
|
|
|
|
|
|
|
|
const sureSell = async () => {
|
|
const sureSell = async () => {
|
|
|
- inputPasswordFlag.value = true;
|
|
|
|
|
|
|
+ if (buyCount.value <= 0 || !buyCount.value) {
|
|
|
|
|
+ showFailToast("请输入您要卖出的数量");
|
|
|
|
|
+ } else if (!paymentId.value) {
|
|
|
|
|
+ showFailToast("请选择收款账号");
|
|
|
|
|
+ } else {
|
|
|
|
|
+ inputPasswordFlag.value = true;
|
|
|
|
|
+ }
|
|
|
};
|
|
};
|
|
|
|
|
+
|
|
|
|
|
+ onMounted(async () => {
|
|
|
|
|
+ await GetUsdtBalanceData();
|
|
|
|
|
+ });
|
|
|
</script>
|
|
</script>
|
|
|
<style lang="less" scoped>
|
|
<style lang="less" scoped>
|
|
|
.sell-and-buy {
|
|
.sell-and-buy {
|