大屏展示

README.md

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

src/pages/index/list/index.vue

@@ -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>

src/pages/screen/list/index.vue

@@ -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="50%">时间</th>
-                      <th width="25%">最新价</th>
+                      <th width="50%">年率</th>
-                      <th width="25%">24H成交量</th>
-                      <th>24H涨跌</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">
+                    <template v-for="(item, i) in gdps">
-                      <td>{{ item.currencyPair }}</td>
+                      <tr v-if="item.value != '0'" :key="i">
-                      <td>${{ item.amount }}</td>
+                        <td width="50%">{{ item.date_index }}</td>
-                      <td>{{ parseInt(item.total) }}M</td>
+                        <td width="50%">${{ item.value }}</td>
-                      <td><p :class="['percent', {fall: item.percent < 0}]">{{ (item.percent * 100).toFixed(2) }}%</p></td>
+                      </tr>
-                    </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)
       }
     }