From 3ed2cb78a690b64c3b2646d35e1500081186dfa3 Mon Sep 17 00:00:00 2001
From: huzheng12 <52150713+huzheng12@users.noreply.github.com>
Date: Mon, 06 May 2024 00:21:32 +0800
Subject: [PATCH] first commit
---
src/page/DeliveryContractHistory/index.vue | 217 ++++++++++++++++++++++++++++++++---------------------
1 files changed, 131 insertions(+), 86 deletions(-)
diff --git a/src/page/DeliveryContractHistory/index.vue b/src/page/DeliveryContractHistory/index.vue
index 612c28e..a0a23f8 100644
--- a/src/page/DeliveryContractHistory/index.vue
+++ b/src/page/DeliveryContractHistory/index.vue
@@ -1,55 +1,101 @@
<template>
<div class="DeliveryContractHistory">
- <assets-head :title="$t('交割合约历史')" :backFunc="() => {
- if ($route.query.goback) {
- $router.push({
- path: '/funds',
- query: {
- tab: 2,
- index: 1// 0: 查看理财订单 1: 矿机
+ <assets-head
+ :title="$t('交割合约历史')"
+ :backFunc="
+ () => {
+ if ($route.query.goback) {
+ $router.push({
+ path: '/funds',
+ query: {
+ tab: 2,
+ index: 1, // 0: 查看理财订单 1: 矿机
+ },
+ });
+ } else {
+ $router.go(-1);
}
- })
- } else {
- $router.go(-1)
- }
-
- }" />
+ }
+ "
+ />
<div class="px-32">
<van-tabs ref="tabs" v-model="type" swipeable @change="onChange" sticky>
- <van-tab :title="item.title" v-for="item in selectData" :key="item.title" :name="item.type">
+ <van-tab
+ :title="item.title"
+ v-for="item in selectData"
+ :key="item.title"
+ :name="item.type"
+ >
<div class="all-select flex justify-end" v-if="symbol">
<div class="select-box flex" @click.stop="isAll = !isAll">
- <div class="flex-1">
- {{ symbol.toUpperCase() }}/USDT
- </div>
+ <div class="flex-1">{{ symbol.toUpperCase() }}/USDT</div>
<van-icon name="arrow-down" />
<div class="select-data" v-if="isAll">
- <div class="select-item" @click.stop="selectItem(item2)" v-for="(item2, index) in currencyList"
- :key="index">{{ item2.symbol.toUpperCase() || item2.symbol }}/USDT</div>
+ <div
+ class="select-item"
+ @click.stop="selectItem(item2)"
+ v-for="(item2, index) in currencyList"
+ :key="index"
+ >
+ {{ item2.symbol.toUpperCase() || item2.symbol }}/USDT
+ </div>
</div>
</div>
</div>
<template v-if="type === 'orders'">
- <van-list v-model="loading" :loading-text="$t('加载中...')" :finished="finished"
- :finished-text="dataList.orders.length ? $t('已经全部加载完毕') : ''" @load="onLoad" :offset="30">
- <futrue-hold-list v-if="type === 'orders'" :list-data="dataList.orders">
+ <van-list
+ v-model="loading"
+ :loading-text="$t('加载中...')"
+ :finished="finished"
+ :finished-text="
+ dataList.orders.length ? $t('已经全部加载完毕') : ''
+ "
+ @load="onLoad"
+ :offset="30"
+ >
+ <futrue-hold-list
+ v-if="type === 'orders'"
+ :list-data="dataList.orders"
+ >
</futrue-hold-list>
- <div class="flex flex-col justify-center pt-50 pb-20 items-center"
- v-if="!dataList.orders.length && !loading">
- <img src="@/assets/image/assets-center/no-data.png" alt="" class="w-180 h-180" />
- <p class="text-grey mt-10">{{ $t('暂无记录') }}</p>
+ <div
+ class="flex flex-col justify-center pt-50 pb-20 items-center"
+ v-if="!dataList.orders.length && !loading"
+ >
+ <img
+ src="@/assets/image/assets-center/no-data.png"
+ alt=""
+ class="w-180 h-180"
+ />
+ <p class="text-grey mt-10">{{ $t("暂无记录") }}</p>
</div>
</van-list>
</template>
<template v-if="type === 'hisorders'">
- <van-list v-model="loading" :loading-text="$t('加载中...')" :finished="finished"
- :finished-text="dataList.hisorders.length ? $t('已经全部加载完毕') : ''" @load="onLoad" :offset="30">
- <futrue-histroy-position :list-data="dataList.hisorders"></futrue-histroy-position>
- <div class="flex flex-col justify-center pt-50 pb-20 items-center"
- v-if="!dataList.hisorders.length && !loading">
- <img src="@/assets/image/assets-center/no-data.png" alt="" class="w-180 h-180" />
- <p class="text-grey mt-10">{{ $t('暂无记录') }}</p>
+ <van-list
+ v-model="loading"
+ :loading-text="$t('加载中...')"
+ :finished="finished"
+ :finished-text="
+ dataList.hisorders.length ? $t('已经全部加载完毕') : ''
+ "
+ @load="onLoad"
+ :offset="30"
+ >
+ <futrue-histroy-position
+ :list-data="dataList.hisorders"
+ ></futrue-histroy-position>
+ <div
+ class="flex flex-col justify-center pt-50 pb-20 items-center"
+ v-if="!dataList.hisorders.length && !loading"
+ >
+ <img
+ src="@/assets/image/assets-center/no-data.png"
+ alt=""
+ class="w-180 h-180"
+ />
+ <p class="text-grey mt-10">{{ $t("暂无记录") }}</p>
</div>
</van-list>
</template>
@@ -59,10 +105,10 @@
</div>
</template>
<script>
-import { List, Tab, Tabs, DropdownMenu, DropdownItem } from 'vant';
-import futrueHoldList from '@/page/deliveryContract/hold.vue'
-import futrueHistroyPosition from '@/page/deliveryContract/position.vue'
-import { _futrueOrderList } from '@/API/trade.api'
+import { List, Tab, Tabs, DropdownMenu, DropdownItem } from "vant";
+import futrueHoldList from "@/page/deliveryContract/hold.vue";
+import futrueHistroyPosition from "@/page/deliveryContract/position.vue";
+import { _futrueOrderList } from "@/API/trade.api";
import assetsHead from "@/components/assets-head";
import { _getCoins } from "@/API/home.api";
export default {
@@ -71,18 +117,18 @@
type: "orders",
dataList: {
orders: [],
- hisorders: []
+ hisorders: [],
},
isAll: false,
- symbol: '',
+ symbol: "",
selectData: [
- { title: this.$t('当前委托'), type: 'orders' },
- { title: this.$t('历史仓位'), type: 'hisorders' },
+ { title: this.$t("当前委托"), type: "orders" },
+ { title: this.$t("历史仓位"), type: "hisorders" },
],
loading: false,
finished: false,
page: 1,
- }
+ };
},
components: {
[Tab.name]: Tab,
@@ -90,62 +136,64 @@
[List.name]: List,
futrueHoldList,
futrueHistroyPosition,
- assetsHead
+ assetsHead,
},
mounted() {
- this.getCoins()
- this.symbol = this.$route.query.symbol
+ this.getCoins();
+ this.symbol = this.$route.query.symbol;
},
methods: {
getCoins() {
_getCoins().then((res) => {
- console.log(res)
- this.currencyList = res
- })
+ console.log(res);
+ this.currencyList = res;
+ });
},
onChange(e) {
- this.dataList[e] = []
- this.finished = false
- this.page = 1
- this.type = e
+ this.dataList[e] = [];
+ this.finished = false;
+ this.page = 1;
+ this.type = e;
this.loading = true;
if (this.loading) {
- this.fetchData(this.symbol, this.type)
+ this.fetchData(this.symbol, this.type);
}
},
onClickLeft() {
- this.$router.go(-1)
+ this.$router.go(-1);
},
fetchData(symbol) {
// TODO: 分页
- _futrueOrderList(symbol, this.type, this.page).then(data => {
- this.dataList[this.type] = this.dataList[this.type].concat(data)
- this.loading = false
+ _futrueOrderList(symbol, this.type, this.page).then((data) => {
+ this.dataList[this.type] = this.dataList[this.type].concat(data);
+ this.loading = false;
if (data.length < 10) {
- this.finished = true
+ this.finished = true;
}
- this.page++
- })
+ this.page++;
+ });
},
onLoad() {
- this.fetchData(this.symbol, this.type)
+ this.fetchData(this.symbol, this.type);
},
//选择币种
selectItem(item) {
- this.page = 1
- this.symbol = item.symbol
- this.dataList[this.type] = []
- this.fetchData(this.symbol, this.type)
- this.isAll = false
- }
+ this.page = 1;
+ this.symbol = item.symbol;
+ this.dataList[this.type] = [];
+ this.fetchData(this.symbol, this.type);
+ this.isAll = false;
+ },
},
beforeRouteEnter(to, from, next) {
- const { query: { symbol } } = to
- next(vm => {
- vm.symbol = symbol
- })
- }
-}
+ const {
+ query: { symbol },
+ } = to;
+ next((vm) => {
+ vm.symbol = symbol;
+ });
+ },
+};
</script>
<style lang="scss" scoped>
.DeliveryContractHistory {
@@ -170,7 +218,7 @@
}
::v-deep .van-tab--active {
- background: #1194F7;
+ background: #1194f7;
border-radius: 5px;
color: #fff !important;
}
@@ -195,7 +243,6 @@
::v-deep .van-tabs__line {
background-color: transparent !important;
-
}
.position-padding {
@@ -215,7 +262,7 @@
font-style: normal;
font-weight: 400;
font-size: 26.4981px;
- color: #FFFFFF;
+ color: #ffffff;
}
.position-tag-title {
@@ -229,7 +276,7 @@
font-style: normal;
font-weight: 400;
font-size: 30.9145px;
- color: #848E9C;
+ color: #848e9c;
}
.position-tag-img {
@@ -240,12 +287,12 @@
}
.red {
- background: #F6465D;
+ background: #f6465d;
border-radius: 6.6266px;
}
.green {
- background: #5EBA89;
+ background: #5eba89;
border-radius: 6.62453px;
}
@@ -259,7 +306,7 @@
font-style: normal;
font-weight: 400;
font-size: 30px;
- color: #848E9C;
+ color: #848e9c;
}
.position-text2 {
@@ -278,15 +325,15 @@
}
.color-red {
- color: #F6465D !important;
+ color: #f6465d !important;
}
.color-green {
- color: #5EBA89 !important;
+ color: #5eba89 !important;
}
.color-blue {
- color: #1D91FF !important;
+ color: #1d91ff !important;
}
.van-tabs__nav {
@@ -300,7 +347,6 @@
color: themed("text_color");
}
}
-
}
::v-deep .van-nav-bar {
@@ -326,7 +372,7 @@
}
.border-b-color {
- border-bottom: 1px solid #2F3244 !important;
+ border-bottom: 1px solid #2f3244 !important;
}
.all-select {
@@ -362,7 +408,6 @@
@include themify() {
background: themed("input_background");
}
-
.select-item {
padding: 20px 20px;
--
Gitblit v1.9.3