From 90d901daf17ba0644eb5c3096450262cfd76ef58 Mon Sep 17 00:00:00 2001
From: dcc <dcc@163.com>
Date: Thu, 27 Jun 2024 18:28:50 +0800
Subject: [PATCH] 123
---
src/locales/zh.json | 3
src/page/list/tradingList/tabs.vue | 2
src/page/home/home.vue | 7
src/page/list/trading-list.vue | 1
src/page/list/tradingList/data.list.vue | 170 +++++++++++++++++++--------------
src/utils/WhrWebSocket.js | 55 +++++++++++
src/App.vue | 62 +++++++++---
7 files changed, 205 insertions(+), 95 deletions(-)
diff --git a/src/App.vue b/src/App.vue
index d67e27a..59ed5fe 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -1,20 +1,12 @@
<template>
- <div
- id="app"
- :class="`${$state.theme === 'red' ? 'red-theme' : 'black-theme'}`"
- >
+ <div id="app" :class="`${$state.theme === 'red' ? 'red-theme' : 'black-theme'}`">
<div :class="`header-box`" v-if="hasHeader && title !== $t('hj248')">
<mt-header :title="title">
<mt-button icon="back" slot="left" @click="$router.go(-1)"></mt-button>
<div v-if="!is_Show">
<template v-if="iconRight == 'search'">
- <img
- slot="right"
- class="search-right"
- src="./assets/ico/fangdajing.png"
- alt
- />
+ <img slot="right" class="search-right" src="./assets/ico/fangdajing.png" alt />
</template>
<template v-else>
<mt-button icon="more" slot="right"></mt-button>
@@ -24,7 +16,9 @@
</div>
<div class="body-box">
<transition :name="transitionName">
- <router-view></router-view>
+ <!-- <keep-alive include="TradingList"> -->
+ <router-view></router-view>
+ <!-- </keep-alive> -->
</transition>
</div>
<foot v-if="$route.meta.show !== true" @close="footColse"></foot>
@@ -124,35 +118,43 @@
/deep/ .van-list__finished-text {
line-height: 1.925926rem !important;
}
+
/deep/ .van-list__error-text {
line-height: 1.925926rem !important;
}
+
#app {
width: 100vw;
height: 100vh;
overflow: hidden;
font-family: "rubik";
+
.header-box {
width: 100%;
height: 1.4rem;
+
/deep/.mint-header {
height: 100%;
background-color: #16171d;
+
// background-color: rgba(20, 45, 55, 0.3);
.is-left {
.mintui {
font-size: 20px;
}
}
+
.mint-header-title {
font-size: 0.36rem;
color: rgba(255, 255, 255, 1);
}
}
+
button {
outline: none;
}
}
+
.body-box {
width: 100%;
height: 100%;
@@ -160,59 +162,76 @@
box-sizing: border-box;
overflow-y: auto;
}
+
&.red-theme {
background: rgb(241, 242, 246);
color: #000;
+
/deep/.mint-header {
background: none;
+
.mint-header-title {
font-size: 0.42rem;
color: #212121;
}
+
.mintui {
color: #212121;
}
}
+
/deep/.van-swipe-item {
color: #000;
}
+
/deep/.navs_content {
background: #fff !important;
}
+
/deep/.fo_content {
background: #fff;
}
+
/deep/.news-tab {
background: #fff;
}
+
/deep/.mint-tab-item-label {
color: #000;
font-size: 0.26rem;
}
+
/deep/.top_title {
color: #000;
}
+
/deep/.titContent {
color: #000;
}
+
/deep/.mint-navbar {
background: #fff;
}
+
/deep/.mint-tab-item {
background: #fff;
border: none;
}
+
/deep/.footCss {
background: #fff;
}
+
/deep/.newDetail-tits {
color: #aaa;
}
+
/deep/.van-skeleton__row,
.van-skeleton__title {
background-color: #fff !important;
}
}
+
&.black-theme {
// background: #16171d;
// background: rgb(14, 14, 15);
@@ -221,48 +240,58 @@
/deep/.navs_content {
background: #272733;
}
+
/deep/.fo_content {
background: #272733;
}
+
/deep/.news-tab {
background: #272733;
}
+
/deep/.mint-navbar {
background: #272733;
}
+
/deep/.mint-tab-item-label {
color: #fff;
font-size: 0.26rem;
}
+
/deep/.titContent {
color: #000;
}
- /deep/.mint-tab-container {
- }
+
+ /deep/.mint-tab-container {}
/deep/.mint-tab-item {
background: #272733;
}
+
/deep/.van-swipe-item {
color: #000;
}
+
/deep/.footCss {
background: rgb(33, 33, 43);
}
+
/deep/.newDetail-tits {
color: #999;
}
}
}
+
.search-right {
width: 0.3rem;
height: 0.3rem;
}
+
.mint-search-list {
position: relative !important;
}
-.topLeft {
-}
+
+.topLeft {}
/deep/.el-alert {
width: 75% !important;
@@ -275,12 +304,15 @@
margin: auto !important;
font-size: 0.36rem !important;
}
+
/deep/.el-alert__title {
font-size: 0.36rem !important;
}
+
/deep/.el-icon-close::before {
display: none;
}
+
/deep/.icon-icon_A::before {
font-size: 0.6rem !important;
}
diff --git a/src/locales/zh.json b/src/locales/zh.json
index 7fb794b..534e77e 100644
--- a/src/locales/zh.json
+++ b/src/locales/zh.json
@@ -566,5 +566,6 @@
"配售结束时间": "配售结束时间",
"请选择提现金额": "请选择提现金额",
"关于我们": "关于我们",
- "贷款": "贷款"
+ "贷款": "贷款",
+ "hj621": "大宗交易"
}
diff --git a/src/page/home/home.vue b/src/page/home/home.vue
index 7150f56..e69fe98 100644
--- a/src/page/home/home.vue
+++ b/src/page/home/home.vue
@@ -34,20 +34,19 @@
src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADwAAAA8CAYAAAA6/NlyAAAACXBIWXMAABYlAAAWJQFJUiTwAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAQvSURBVHgB7Zq/TxRBFMe/gyZCI4cmICSa5R8wWGiiIeEoTEwkETWxsOFsSKyAQAxWd9qY2ICVCQ00lgZN7MHEWNgcsdLqzl+cMcE7rM5Cxvf2bvHY25mdvds9DtxP8nLL7OzsfufN25l5CxATExMTExPzP2GRrZEtV48PLQmyDJl02QIOofBpsiLqxTqWI5vAISCJyvCVhsbCh3AAschWoReW05w/MPHtxKlq+HJ5uloP1WOdxzNoY8bRmNes6rkDE99J6OOUz40YtMOxq+uwLPZ5mPOwXIT6AXn4TiE4KbRhfGegn2bS+BenjWBBH9/cIdNoAUnoe38N4fa+hX2Ob92NRxAdKeg7OjIaj9PJrYzudK4oE4WiTBW25fJmSWYLJVkkk1UrctnDRwvy9BmrKcECwXA33kNW8r2qIjaNpZN19yORluzAlJC2F33j/svnPC6cHXQXG+s4iuYwF+uCPXqMX37CFmsMeRhebQ32CP9nIToQJQqx7NVOgawQDU1bdXBb3KZJ3egEK8T+KMoh8mr4b3Nq8yu37UOzMex9vUJsUAqPT3iW9yf23pZeas5hnp5wtL9H5KEgfA+HJLZBbE9zTKsqhCt4f8U6WF0d6mcIT3B7iLWREtOql1g0MeyCFxOozLOhoInhXaTA4kC3mHGXRy64SPFUFvaKLDSMBNMa4bfEoHt+jnYeJsqVxEDLoS5JdB7BNY/yQPh7eHIr1MX83OUuzJLVYuJhG4GV/m5xp7Yocg83g5fYINCStW4h0raCmxXL7His5tpScBhiGeGx+2p2t1SPawvI+1ld9f57P/f8HZZYFa3wsNG2jQlbrPS4d7OCLb8Kghf0BpiK/bVt3H8sLu9R1hS8zdNmD2nFswEfTMUuPV3E+fpsR6B7h+Fh/tzJCbYJzxo7eK1rwETs2zfrdlonfX8mkIdpeK27i4IK5kk871Fuka3AI0neCbyAJo51Yjl/dWMsiZtjo/axG073PH+1pry+/AcvERI8jHVp0wxqhH/flgs1GUhf+/ipKGfn06q25fHuhJybz+jb4Q1LyFgwTJLzVs1U7ANKxbIgVbuTd6ftDvFtyzDH1ajwrI/wIT8v09CUF4dHlEIvDSftOiadtkn3QgtIQTPMe3v7Vt+9z9U9HJfduj2hFMqJ9+Vnq8bhQJbTpXiiIA21t+3YrI1T1fB14tRo+NaI9RvKQbeHplioCE95nXSS6V5vXubK1XHQZxXPpLuG/BGJ6709QjvvRyXYgbdn/L8elkllilOQ1+3fgOT90rMOUa+lubd5aaSav21o+JJHF+05NahYzl2VJc6ZiGWi9nAtFipfGt1L0czGh29W36mBFMwpkdAVsYMnpkIdWinYwUIlvvl31/P8Zu3k/FcHRjhTISvnnbdtiTch9tqYlou8gjL9eBYTExMTExPTPvwFuTt0PD0I6k4AAAAASUVORK5CYII="
alt="" />
</div>
- <div class="name">{{ $t("hj261") }}</div>
+ <div class="name">{{ $t("hj621") }}</div>
</div>
</li>
- <li @click="$router.push('/subDK')">
+ <!-- <li @click="$router.push('/subDK')">
<div class="link">
<div class="icon">
<img
src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADwAAAA8CAYAAAA6/NlyAAAACXBIWXMAABYlAAAWJQFJUiTwAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAUzSURBVHgB7ZrPbxtFFMe/47VV51DHIQk4pSTTChA0ipoeQIgLTlUhRBEEJCSEIDGRQClCariA6KEN3DiRSAjKqeGKQGn/grq3QpHiAwJxyqakjQUBGyKklMb7eLOuYXe9ib3eHwZpPxd7x+Od/e578+a92QViYmJiYmJiuoWATwZy8hwEzYGQRRgQSiSoBIMu/frzTxfhE1+C+3P3FQQSFxARBOg1iIlqWdfRIQn4QEBIRAhbRyaJVvpzchod4lMw6YgagSyPuzQ4KMfRAUn4wBCoCrI1Xdksr+URIBwj8gJGgSBsVjU0Ws5m5bFqVa/CA74snCKtZD1m7SNu/QaG5NxgbmR1IDdyOZuTEh7YLOvFX8rXCxDibWu76d77jAI84kvwdhpV50U4+5gCiT6i+m/5JBkL6IDNDX2Bo/WirVGI5+ARX4KrOruTsIt2WjDt+A8JcRQdUtuXmHc05dmtPS2HvgTfQbcepGr29djNC7xeZAPzBgNrtvFSzV61F74FE8h2AYZWs0XPIC7SwaptfG2nuxYWJJouwMyULDhvSpT4FsyZlm49Jrhaz9aH70DXBPtahxWCalWy3DfhEpQSRCWyZrECvc4+qxXKpoBJLYEniDDOZ5R887L17qgafNOEQOnkk3l5fU1Hp3gWrKJwUhiTIKO0WV4vatCKO7BlH/n+3PAFYZm3fLHSnrSLfOPbRoVkDZhLCkybAqme4FvPqNq5bZy/jN99Tw6RCa6LpRWY81TjLOjgRJkTA04oivxzvtGPc+yC9X/OCkVFamXRngTOsTXnNNgFemH+gw+nT774culQn2gr4/I0h1Oo5a1lILuyme4lIV4Tznnagr+2fl9VYuGTYXm4kBZYUZ7STv8gojTYyrrGZVu7ol+ZnkEm0xtk/SzZbS6vV6hlMPQdtBqU6zXqIZXs86zNu/U5Mjomn3n2helXWXAISE1gmS09MdQn9N06BSa4gUr2+aPobFdzVrkewsW0NI91bLc5HYhLt4MKUICvDKtd5J2xXIlEsAooQQSodlFj7RbEIhHM6/A8Ikat7W7toQuu8NxNcFKBiFFjqrjR1I6Q2eZ0EV2Al0gzVXW2hy7YsGRgUaPycmdb6IJ5bex4h8MvvMHYlIhEEbQkuoThMnboghslXjcQLmNHlnj8VwhdsCre0SXIZewoLKyjSyRcxg68ePiH2Q2pPr67ubOW6UnsWrb19ghk0r6f2rpCvCXkbAtH8Ou/LfPzXHPRP7HwR8vuX81m8Pjh4C+lZuCKsy14l56tcIlGnrKrL769hTC4DTQ9QA9e8Pk+nbcui+12V+781GgKgSOw5FYTh+PSn9010ZjDismxdPbM0xnX4r+XBWd6QpjDBt53aw4vaJ0f0htflV99UqFF3lc+DZ/8+MP3tuOHHj7S1Ifr4cUDu2zzRLfjUa+Jdfjg0vKX2Nr6NwgeuPcg9u/POLvpt/aovyMT3KfmE2ECHYq+eWMdn35sf7T8yKOPObvpaoy99qj9vePh8RmR2k3UCM/Do+hr31zFzNRLuMGirZx6y7apYZ57rx1LhadokZUym9ymirWNzIunIjzwwP0PytGxo/lW/ZT7Xvv6qs2NG7zJYi2CTcu2EqvwHB4Hc8NLzhdMokZt5L/73lnzuwpQas62+6jFs2Bl5dQ2rVCX6tx3zpzF1NRMdYfwOT+TWmjHqlY6WgDroo2FyCwtUD1+/MTaG6dOl0ZHx4q8T3axXYs2n8oH6l2NZBrjAjWJsNC00u0/oXt9HysmJiYmJuZ/wN/6Zaai9yOqrAAAAABJRU5ErkJggg=="
alt="" />
</div>
- <!-- $t("马股") -->
<div class="name">{{ $t("贷款") }}</div>
</div>
- </li>
+ </li> -->
<li @click="$router.push('/yeb')">
<div class="link">
<div class="icon">
diff --git a/src/page/list/trading-list.vue b/src/page/list/trading-list.vue
index e5383e4..9b62ffe 100644
--- a/src/page/list/trading-list.vue
+++ b/src/page/list/trading-list.vue
@@ -29,6 +29,7 @@
<script>
import tabsList from "./tradingList/tabs";
export default {
+ name: "TradingList",
components: { tabsList },
data() {
return {
diff --git a/src/page/list/tradingList/data.list.vue b/src/page/list/tradingList/data.list.vue
index da4ef60..cb6df2d 100644
--- a/src/page/list/tradingList/data.list.vue
+++ b/src/page/list/tradingList/data.list.vue
@@ -24,81 +24,62 @@
</van-col>
</van-row>
</div>
-
- <van-list
- style="margin-bottom: 50px"
- v-model="loadings"
- :finished="finished"
- :finished-text="$t('hj43')"
- :loading-text="$t('hj430')"
- @load="onLoads"
- :immediate-check="false"
- >
- <div
- class="item"
- @click="handleGoToKlineDetail1(item, index)"
- v-for="(item, index) in listArr"
- :key="item.indexCode"
- >
- <van-row type="flex" align="center" gutter="20">
- <van-col span="8">
- <div>
- <div class="tp">
- <div class="collection" @click="optionszx(item)">
- <div
- class="shu"
- :class="item.isOption == '1' ? 'shublue' : ''"
- ></div>
- </div>
- <div
- class="title_color"
- style="
+ <van-pull-refresh v-model="refreshing" @refresh="onRefresh">
+ <van-list style="margin-bottom: 50px" v-model="loadings" :finished="finished" :finished-text="$t('hj43')"
+ :loading-text="$t('hj430')" @load="onLoads" :immediate-check="false">
+ <div class="item" @click="handleGoToKlineDetail1(item, index)" v-for="(item, index) in listArr"
+ :key="item.indexCode">
+ <van-row type="flex" align="center" gutter="20">
+ <van-col span="8">
+ <div>
+ <div class="tp">
+ <div class="collection" @click="optionszx(item)">
+ <div class="shu" :class="item.isOption == '1' ? 'shublue' : ''"></div>
+ </div>
+ <div class="title_color" style="
width: 100%;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
- "
- >
- {{ item.name }}
+ ">
+ {{ item.name }}
+ </div>
+ </div>
+ <div class="bt">
+ <span>{{ item.spell }}</span>
</div>
</div>
- <div class="bt">
- <span>{{ item.spell }}</span>
- </div>
- </div>
- </van-col>
+ </van-col>
- <van-col span="3">
- <div style="text-align: right">
- {{ item.gid }}
- </div>
- </van-col>
+ <van-col span="3">
+ <div style="text-align: right">
+ {{ item.gid }}
+ </div>
+ </van-col>
- <van-col span="7">
- <div style="text-align: right">
- <div class="tp">
- <span class="price_color">
- {{ item.nowPrice | _toLocaleString(false) }}
- </span>
+ <van-col span="7">
+ <div style="text-align: right">
+ <div class="tp">
+ <span class="price_color">
+ {{ item.nowPrice | _toLocaleString(false) }}
+ </span>
+ </div>
+ <div class="bt">
+ <span>{{ item.addTime }}</span>
+ </div>
</div>
- <div class="bt">
- <span>{{ item.addTime }}</span>
+ </van-col>
+ <van-col span="6">
+ <div style="text-align: right">
+ <div class="tp right_bs" :class="`${item.color > 0 ? 'green' : 'red'}`">
+ <span class="price_color">{{ item.hcrateP }}</span>
+ </div>
</div>
- </div>
- </van-col>
- <van-col span="6">
- <div style="text-align: right">
- <div
- class="tp right_bs"
- :class="`${item.color > 0 ? 'green' : 'red'}`"
- >
- <span class="price_color">{{ item.hcrateP }}</span>
- </div>
- </div>
- </van-col>
- </van-row>
- </div>
- </van-list>
+ </van-col>
+ </van-row>
+ </div>
+ </van-list>
+ </van-pull-refresh>
<dazy ref="dazy" />
</div>
@@ -108,6 +89,7 @@
import * as api from "@/axios/api";
import handleDt from "@/utils/deTh";
import dazy from "./dazy.vue";
+import { WhrWebSocket } from "@/utils/WhrWebSocket";
export default {
components: { dazy },
@@ -163,7 +145,8 @@
listArr: [],
pageNumVal: 1,
getInterval: null,
- num: 1
+ num: 1,
+ refreshing: false
};
},
@@ -171,9 +154,10 @@
this.listArr = [];
this.pageNumVal = 1;
this.getStock(this.active, this.zxactive, 1);
- this.getInterval = setInterval(() => {
- this.getStock(this.active, this.zxactive, 1);
- }, 5000);
+ this.initWebSocket()
+ // this.getInterval = setInterval(() => {
+ // this.getStock(this.active, this.zxactive, 1);
+ // }, 5000);
},
methods: {
filterSH(val) {
@@ -232,7 +216,7 @@
let pageNumVal = c || this.pageNumVal;
let opt = {
pageNum: pageNumVal,
- pageSize: 20*this.num,
+ pageSize: 20 * this.num,
stockPlate: "",
keyWords: this.sousuo,
stockType: stockType,
@@ -258,7 +242,7 @@
this.listArr = data.data.list;
this.loadings = false;
// this.finished = true;
- if(this.listArr.length % 20 ){
+ if (this.listArr.length % 20) {
this.finished = true;
}
}
@@ -267,7 +251,7 @@
this.listArr = data.data.list;
this.loadings = false;
// this.finished = true;
- if(this.listArr.length % 20 ){
+ if (this.listArr.length % 20) {
this.finished = true;
}
}
@@ -277,14 +261,48 @@
this.finished = true;
}
}, 500),
+
+ onRefresh() {
+ // 清空列表数据
+ this.finished = false;
+
+ // 重新加载数据
+ // 将 loading 设置为 true，表示处于加载状态
+ this.loading = true;
+ if (this.refreshing) {
+ // this.listArr = [];
+ this.refreshing = false;
+ }
+ this.getStock();
+ },
+
+ initWebSocket() {
+ this.Trade = new WhrWebSocket({
+ path: `ws://ws.is4vc.com:8001/websocket-server`,
+ onmessage: this.getTradeMessage,
+ });
+
+ this.Trade.init();
+ },
+ getTradeMessage({ data }) {
+ let result = JSON.parse(data)
+ let pid = result.pid
+ let userToUpdate = this.listArr.find(item => item.code == pid)
+ if (userToUpdate) {
+ // 更新对象数据
+ userToUpdate.nowPrice = result.last;
+ userToUpdate.hcrateP = result.pcp;
+ }
+ },
+
onLoads() {
console.log('onLoads');
// this.pageNumVal++;
this.loadings = true;
- this.num+=1
+ this.num += 1
this.getStock();
},
- optionszx() {},
+ optionszx() { },
},
destroyed() {
clearInterval(this.getInterval);
@@ -312,6 +330,7 @@
// display: flex;
// justify-content: space-between;
border-bottom: 1px solid #f0f2f3;
+
.right_bs {
text-align: center;
border-radius: 0.05333rem;
@@ -331,10 +350,12 @@
.green {
background-color: rgb(3, 173, 143);
}
+
.red {
background-color: rgb(208, 75, 100);
}
}
+
.center_price {
font-style: normal;
font-weight: 500;
@@ -346,6 +367,7 @@
flex: 1;
margin-right: 20px;
}
+
.title_color {
font-style: normal;
font-weight: 500;
diff --git a/src/page/list/tradingList/tabs.vue b/src/page/list/tradingList/tabs.vue
index 400c97f..b4a6c7b 100644
--- a/src/page/list/tradingList/tabs.vue
+++ b/src/page/list/tradingList/tabs.vue
@@ -51,7 +51,7 @@
tabsList: [
{ title: this.$t("hj61"), key: "" },
{ title: this.$t("印股"), key: "IN", name: "IN" },
- { title: this.$t("hj261"), key: "DZ", name: "DZ" },
+ { title: this.$t("hj621"), key: "DZ", name: "DZ" },
],
zxtabsList: [{ title: this.$t("印股"), key: "IN", name: "IN" }],
active: "",
diff --git a/src/utils/WhrWebSocket.js b/src/utils/WhrWebSocket.js
new file mode 100644
index 0000000..8bd61bb
--- /dev/null
+++ b/src/utils/WhrWebSocket.js
@@ -0,0 +1,55 @@
+export function strFirstBit(val) {
+ let arr = val.map((val, index, arr) => {
+ return val.currency;
+ });
+ return arr;
+}
+export function filterArrayEmpty(val) {
+ let isEmpty = val.every((val) => {
+ return val != "";
+ });
+ return isEmpty;
+}
+export class WhrWebSocket {
+ constructor(params) {
+ //只有params这个参数必须卸载constructor方法里，其他的实例属性可以写在外面
+ // 比如 socket = null
+ this.socket = null;
+ this.params = params;
+ this.j = 0; //websocket重连次数
+ this.i = 0; //发送信息次数
+ }
+
+ init(params) {
+ if (this.params.path) {
+ this.path = this.params.path;
+ } else {
+ throw new Error("参数socket服务器地址path必须存在");
+ }
+ this.socket = new WebSocket(this.path);
+ // this.socket.send('key:eVKtHt7aG4m6ozwWL9qG')
+ console.log('已连接到服务器');
+ this.socket.onopen = () => {
+ // console.log("连接开启");
+ };
+ // this.socket.onclose = () => {
+
+ // console.log("连接关闭")
+ // this.reconnect()
+ // }
+ // this.socket.onerror = () => {
+ // console.log("连接错误")
+ // }
+ this.socket.onmessage = this.params.onmessage;
+ }
+
+ // getMessage(msg) {
+ // console.log("收到的消息", msg)
+ // return msg
+ // }
+
+ close() {
+ clearTimeout(this.time);
+ this.socket.close(1000, "手动关闭");
+ }
+}
--
Gitblit v1.9.3