From d157d0892f1ab5517dbe3a08328ccb9c4e446615 Mon Sep 17 00:00:00 2001
From: jhzh <1628036192@qq.com>
Date: Sun, 20 Apr 2025 15:39:03 +0800
Subject: [PATCH] 1
---
pages/base/contract.vue | 511 ++++++++++++++++++++++++++++----------------------------
1 files changed, 254 insertions(+), 257 deletions(-)
diff --git a/pages/base/contract.vue b/pages/base/contract.vue
index d41efb3..5f92dbd 100644
--- a/pages/base/contract.vue
+++ b/pages/base/contract.vue
@@ -1,7 +1,7 @@
<template>
- <v-page style="background-color: #F1F3F7;">
- <!-- <v-header :left-arrow="false" :title="$t('exchange.a2')"></v-header> -->
- <!-- <van-tabs
+ <v-page style="background-color: #F1F3F7;">
+ <!-- <v-header :left-arrow="false" :title="$t('exchange.a2')"></v-header> -->
+ <!-- <van-tabs
:ellipsis="false"
:border="false"
class="border-b"
@@ -20,262 +20,259 @@
:name="4"
></van-tab>
</van-tabs> -->
- <!-- 开仓 -->
+ <!-- 开仓 -->
- <view class="layout-main">
- <open-position
- :query="query"
- :collect="collect"
- @option="option"
- :isShow="isShow"
- ref="openposition"
- :increase="increase"
- @symbol="symbolListShow = true"
- @getSymbolDetail="symbolDetail = $event"
- :symbolDetail="symbolDetail"
- :tabs="tabs"
- v-if="tab == 0"
- />
- </view>
+ <view class="layout-main">
+ <open-position :query="query" :collect="collect" @option="option" :isShow="isShow" ref="openposition"
+ :increase="increase" @symbol="symbolListShow = true" @getSymbolDetail="symbolDetail = $event"
+ :symbolDetail="symbolDetail" :tabs="tabs" v-if="tab == 0" />
+ </view>
- <!-- 持仓 -->
- <main class="layout-main" v-if="tab == 1">
- <position
- :isShow="isShow"
- :symbolDetail="symbolDetail"
- :symbolLeft="symbolLeft"
- />
- </main>
- <!-- 委托 -->
- <main class="layout-main" v-if="tab == 2">
- <contract-entrustment style="min-height: 100%" />
- </main>
- <!-- 历史 -->
- <main class="layout-main" v-if="tab == 3">
- <contract-history v-if="tab == 3" />
- </main>
- <!-- 流水 -->
- <main class="layout-main" v-if="tab == 4">
- <contract-bill :symbolLeft="symbolLeft" />
- </main>
- <van-popup
- :show="symbolListShow"
- @close="symbolListShow = false"
- close-on-popstate
- position="left"
- custom-style="height:100%;width:70%"
- >
- <symbol-list
- :collect="collect"
- :title="$t('contract.a4')"
- :marketList="marketList"
- :heyue="1"
- :symbols="symbols"
- @check-symbol="checkSymbol"
- />
- </van-popup>
- <van-dialog
- use-slot
- :show="contractStatusShow"
- :title="contractAgreement.title"
- @confirm="openContract"
- show-cancel-button
- @cancel="contractStatusShow = false"
- >
- <view class="p-md overflow-scroll">
- <rich-text class="p-md" :nodes="contractAgreement.body"></rich-text>
- </view>
- </van-dialog>
- </v-page>
+ <!-- 持仓 -->
+ <main class="layout-main" v-if="tab == 1">
+ <position :isShow="isShow" :symbolDetail="symbolDetail" :symbolLeft="symbolLeft" />
+ </main>
+ <!-- 委托 -->
+ <main class="layout-main" v-if="tab == 2">
+ <contract-entrustment style="min-height: 100%" />
+ </main>
+ <!-- 历史 -->
+ <main class="layout-main" v-if="tab == 3">
+ <contract-history v-if="tab == 3" />
+ </main>
+ <!-- 流水 -->
+ <main class="layout-main" v-if="tab == 4">
+ <contract-bill :symbolLeft="symbolLeft" />
+ </main>
+ <van-popup :show="symbolListShow" @close="symbolListShow = false" close-on-popstate position="left"
+ custom-style="height:100%;width:70%">
+ <symbol-list :collect="collect" :title="$t('contract.a4')" :marketList="marketList" :heyue="1"
+ :symbols="symbols" @check-symbol="checkSymbol" />
+ </van-popup>
+ <van-dialog use-slot :show="contractStatusShow" :title="contractAgreement.title" @confirm="openContract"
+ show-cancel-button @cancel="contractStatusShow = false">
+ <view class="p-md overflow-scroll">
+ <rich-text class="p-md" :nodes="contractAgreement.body"></rich-text>
+ </view>
+ </van-dialog>
+ </v-page>
</template>
<script>
-import openPosition from "@/pages/exchange/open-position";
-import position from "@/pages/exchange/position";
-import contractEntrustment from "@/pages/exchange/contract-entrustment";
-import contractHistory from "@/pages/exchange/contract-history";
-import symbolList from "@/pages/exchange/symbol-list";
-import contractBill from "@/pages/exchange/contract-bill";
-import Home from "@/api/home";
-import Contract from "@/api/contract";
-import { mapState } from "vuex";
-export default {
- name: "contract",
- props: {
- isShow: {
- default: '',
- type: Boolean,
- required: false,
- },
- tabs: {
- default: '',
- type: String,
- required: false,
- },
- },
- components: {
- openPosition,
- position,
- contractEntrustment,
- contractHistory,
- symbolList,
- contractBill,
- },
- data() {
- return {
- tab: 0,
- collect: [],
- marketList: [],
- symbolListShow: false,
- contractStatusShow: false,
- contractAgreement: {},
- symbolDetail: {},
- query: {},
- increase:{},
- tabbar:'',
- msg: 'swapMarketList',
- symbols:''
- }
- },
- computed: {
- symbolLeft() {
- if (!this.query.symbol) return "";
- return this.query.symbol.split("/")[0];
- },
- isLogin() {
- return Boolean(uni.getStorageSync("token"));
- },
- ...mapState({
- ws: "ws1",
- }),
- },
- watch:{
- isShow(n) {
- if (n) {
- setTimeout(() => {
- this.ws.send({
- cmd: "sub",
- msg: this.msg,
- });
- }, 200);
- } else {
- this.ws.send({
- cmd: "unsub",
- msg: this.msg,
- });
- }
- },
- },
- methods: {
- // 获取市场行情
- getMarketList() {
- Contract.getMarketList().then((res) => {
- // 整理数据格式
- this.marketList = res.data.map((item) => {
- item.marketInfoList.forEach((el) => {
- el.coin_name = el.symbol;
- });
- return item;
- });
- this.$nextTick(() => {
- this.linkSocket();
- });
- if (!this.query.symbol) {
- let parentItem = this.marketList[0].marketInfoList[0];
- this.checkSymbol(parentItem);
- }
- });
- },
- //
- checkSymbol(obj) {
- this.symbols=obj.coin_name
- this.symbolListShow = false;
- if (obj.pair_name != this.query.symbol)
- this.query = { symbol: obj.pair_name };
- },
- // 获取自选列表
- getCollect() {
- if (!this.isLogin) return;
- Home.getCollect()
- .then((res) => {
- this.collect = res.data || [];
- })
- .catch(() => {});
- },
+ import openPosition from "@/pages/exchange/open-position";
+ import position from "@/pages/exchange/position";
+ import contractEntrustment from "@/pages/exchange/contract-entrustment";
+ import contractHistory from "@/pages/exchange/contract-history";
+ import symbolList from "@/pages/exchange/symbol-list";
+ import contractBill from "@/pages/exchange/contract-bill";
+ import Home from "@/api/home";
+ import Contract from "@/api/contract";
+ import {
+ mapState
+ } from "vuex";
+ export default {
+ name: "contract",
+ props: {
+ isShow: {
+ default: '',
+ type: Boolean,
+ required: false,
+ },
+ tabs: {
+ default: '',
+ type: String,
+ required: false,
+ },
+ },
+ components: {
+ openPosition,
+ position,
+ contractEntrustment,
+ contractHistory,
+ symbolList,
+ contractBill,
+ },
+ data() {
+ return {
+ tab: 0,
+ collect: [],
+ marketList: [],
+ symbolListShow: false,
+ contractStatusShow: false,
+ contractAgreement: {},
+ symbolDetail: {},
+ query: {},
+ increase: {},
+ tabbar: '',
+ msg: 'swapMarketList',
+ symbols: ''
+ }
+ },
+ onShow() {
+ // if (this.$route.query) {
+ // const username = this.$route.query;
+ // console.log(decodeURIComponent(username.symbol), 1); // 输出：JohnDoe
+ // this.query.symbol = decodeURIComponent(username.symbol)
+ // }
- // 链接socket
- linkSocket() {
- let msg = this.msg;
- this.ws.send({
- cmd: "sub",
- msg: msg,
- });
- this.ws.on("message", (res) => {
- if(!this.isShow) return;
- let { data, sub } = res;
- if (sub == msg) {
- this.marketList = data.map((item) => {
- item.marketInfoList.forEach((el) => {
- el.coin_name = el.symbol;
- });
- return item;
- });
- if(this.query.symbol){
- var symbol=this.query.symbol.split('/')
- // console.log(symbol)
- var market=this.marketList.find((item) => item.coin_name == symbol[1])
-
- this.increase=market.marketInfoList.find((item) => item.coin_name == symbol[0])||{}
- // console.log(this.increase)
- }
-
- }
- });
- },
- // 添加自选
- option() {
- let data = {
- pair_name: this.query.symbol,
- };
- Home.option(data)
- .then((res) => {
- this.getCollect();
- if (res.data) {
- this.$toast(this.$t("exchange.a6"));
- } else {
- this.$toast(this.$t("exchange.a7"));
- }
- })
- .catch(() => {});
- },
- // 获取开通永续合约
- openStatus() {
- if (!this.isLogin) return;
- Contract.openStatus({}).then((res) => {
- if (!res.data.open) {
- this.contractAgreement = res.data.contractAgreement;
- this.contractStatusShow = true;
- this.$refs.openposition.getSymbolDetail();
- }
- });
- },
- // 开通永续合约
- openContract() {
- Contract.opening().then(() => {
- this.$toast(this.$t("contract.a5"));
- this.contractStatusShow = false;
- });
- },
- },
- created() {
- this.getMarketList();
- this.getCollect();
- // this.openStatus();
- },
- destroyed() {
- this.ws.send({
- cmd: "unsub",
- msg: "swapMarketList",
- });
- },
-};
-</script>
+ },
+ mounted() {
+ // if (this.$route.query) {
+ // const username = this.$route.query;
+ // console.log(decodeURIComponent(username.symbol), 1); // 输出：JohnDoe
+ // this.query.symbol = decodeURIComponent(username.symbol)
+ // }
+ },
+ computed: {
+ symbolLeft() {
+
+ if (!this.query.symbol) return "";
+ return this.query.symbol.split("/")[0];
+ },
+ isLogin() {
+ return Boolean(uni.getStorageSync("token"));
+ },
+ ...mapState({
+ ws: "ws1",
+ }),
+ },
+ watch: {
+ isShow(n) {
+ if (n) {
+ setTimeout(() => {
+ this.ws.send({
+ cmd: "sub",
+ msg: this.msg,
+ });
+ }, 200);
+ } else {
+ this.ws.send({
+ cmd: "unsub",
+ msg: this.msg,
+ });
+ }
+ },
+ },
+ methods: {
+ // 获取市场行情
+ getMarketList() {
+ Contract.getMarketList().then((res) => {
+ // 整理数据格式
+ this.marketList = res.data.map((item) => {
+ item.marketInfoList.forEach((el) => {
+ el.coin_name = el.symbol;
+ });
+ return item;
+ });
+ this.$nextTick(() => {
+ this.linkSocket();
+ });
+ if (!this.query.symbol) {
+ let parentItem = this.marketList[0].marketInfoList[0];
+ this.checkSymbol(parentItem);
+ }
+ });
+ },
+ //
+ checkSymbol(obj) {
+ this.symbols = obj.coin_name
+ this.symbolListShow = false;
+ if (obj.pair_name != this.query.symbol)
+ this.query = {
+ symbol: obj.pair_name
+ };
+ },
+ // 获取自选列表
+ getCollect() {
+ if (!this.isLogin) return;
+ Home.getCollect()
+ .then((res) => {
+ this.collect = res.data || [];
+ })
+ .catch(() => {});
+ },
+
+ // 链接socket
+ linkSocket() {
+ let msg = this.msg;
+ this.ws.send({
+ cmd: "sub",
+ msg: msg,
+ });
+ this.ws.on("message", (res) => {
+ if (!this.isShow) return;
+ let {
+ data,
+ sub
+ } = res;
+ if (sub == msg) {
+ this.marketList = data.map((item) => {
+ item.marketInfoList.forEach((el) => {
+ el.coin_name = el.symbol;
+ });
+ return item;
+ });
+ if (this.query.symbol) {
+ var symbol = this.query.symbol.split('/')
+ // console.log(symbol)
+ var market = this.marketList.find((item) => item.coin_name == symbol[1])
+
+ this.increase = market.marketInfoList.find((item) => item.coin_name == symbol[0]) || {}
+ // console.log(this.increase)
+ }
+
+ }
+ });
+ },
+ // 添加自选
+ option() {
+ let data = {
+ pair_name: this.query.symbol,
+ };
+ Home.option(data)
+ .then((res) => {
+ this.getCollect();
+ if (res.data) {
+ this.$toast(this.$t("exchange.a6"));
+ } else {
+ this.$toast(this.$t("exchange.a7"));
+ }
+ })
+ .catch(() => {});
+ },
+ // 获取开通永续合约
+ openStatus() {
+ if (!this.isLogin) return;
+ Contract.openStatus({}).then((res) => {
+ if (!res.data.open) {
+ this.contractAgreement = res.data.contractAgreement;
+ this.contractStatusShow = true;
+ this.$refs.openposition.getSymbolDetail();
+ }
+ });
+ },
+ // 开通永续合约
+ openContract() {
+ Contract.opening().then(() => {
+ this.$toast(this.$t("contract.a5"));
+ this.contractStatusShow = false;
+ });
+ },
+ },
+ created() {
+ if (this.$route.query.symbol) {
+ const username = this.$route.query;
+ console.log(decodeURIComponent(username.symbol), 1); // 输出：JohnDoe
+ this.query.symbol = decodeURIComponent(username.symbol)
+ }
+ this.getMarketList();
+ this.getCollect();
+ // this.openStatus();
+ },
+ destroyed() {
+ this.ws.send({
+ cmd: "unsub",
+ msg: "swapMarketList",
+ });
+ },
+ };
+</script>
\ No newline at end of file
--
Gitblit v1.9.3