大屏展示

master
yujialong 2 years ago
parent 28146a03a5
commit 0cf9f42e4a
  1. 1
      README.md
  2. BIN
      src/assets/img/index/customer.jpg
  3. BIN
      src/assets/img/index/customer.png
  4. 4
      src/pages/index/list/index.vue
  5. 37
      src/pages/screen/list/index.vue

@ -0,0 +1 @@
# 数据前瞻平台前端

Binary file not shown.

Before

Width:  |  Height:  |  Size: 129 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 218 KiB

@ -238,7 +238,7 @@
<div class="popup wechat-popup">
<p class="tips">微信扫码添加职站售前咨询</p>
<p class="des">提供付费咨询及解决方案</p>
<img width="150" src="@/assets/img/index/customer.jpg" alt="">
<img width="150" src="@/assets/img/index/customer.png" alt="">
</div>
<div class="item tel"></div>
<div class="popup tel-popup">
@ -249,7 +249,7 @@
</div>
<div class="text">
<p class="title">售前咨询</p>
<p class="tel-num" style="margin-bottom: 5px"></p>
<p class="tel-num" style="margin-bottom: 5px">老师</p>
<p class="tel-num">18019930142</p>
</div>
</div>

@ -129,25 +129,27 @@
</div>
<div class="main_title">
<img src="@/assets/img/screen/t_3.png" alt="">
加密货币行情
中国GDP年率报告
</div>
<div class="main_table">
<table>
<thead>
<tr>
<th width="30%">币种</th>
<th width="25%">最新价</th>
<th width="25%">24H成交量</th>
<th>24H涨跌</th>
<th width="50%">时间</th>
<th width="50%">年率</th>
</tr>
</thead>
</table>
</div>
<div class="main_table" ref="gdpList" style="max-height: 260px;margin-top: 0;overflow: auto;">
<table>
<tbody>
<tr v-for="(item, i) in cryptoList" :key="i">
<td>{{ item.currencyPair }}</td>
<td>${{ item.amount }}</td>
<td>{{ parseInt(item.total) }}M</td>
<td><p :class="['percent', {fall: item.percent < 0}]">{{ (item.percent * 100).toFixed(2) }}%</p></td>
<template v-for="(item, i) in gdps">
<tr v-if="item.value != '0'" :key="i">
<td width="50%">{{ item.date_index }}</td>
<td width="50%">${{ item.value }}</td>
</tr>
</template>
</tbody>
</table>
</div>
@ -281,15 +283,22 @@ export default {
stompClientMarket: null,
stompClient: null,
goodsSell: [],
cryptoList: []
cryptoList: [],
gdps: []
}
},
mounted() {
this.connect()
this.getList()
this.renderChart()
this.renderMap()
},
methods: {
// gdp
getList() {
this.$get(`${this.api.visualPreview}?tableName=hg_zg_gm_zhongguogdpnianlvbaogao&tableId=17`).then(({ comment, data }) => {
this.gdps = data
}).catch(res => {})
},
//
getCrypto() {
this.$get(`${this.api.getTopList}`).then(res => {
@ -1215,9 +1224,13 @@ export default {
//
scrollTable() {
const dom = this.$refs.tableWrap
const dom1 = this.$refs.gdpList
setInterval(() => {
dom.scrollTop += 1
if (dom.clientHeight + dom.scrollTop === dom.scrollHeight) dom.scrollTop = 0
dom1.scrollTop += 1
if (dom1.clientHeight + dom1.scrollTop === dom1.scrollHeight) dom1.scrollTop = 0
}, 30)
}
}

Loading…
Cancel
Save