From 0a0fb2619c8441fe387fe8ab86688a56807887ee Mon Sep 17 00:00:00 2001
From: laixingyu <xingyu.lai@suwell.cn>
Date: Tue, 25 Jul 2023 18:41:15 +0800
Subject: [PATCH] =?UTF-8?q?fix:=20=E9=A6=96=E9=A1=B5=E4=BF=AE=E6=94=B9?=
 =?UTF-8?q?=E4=B8=BA=E5=B1=95=E7=A4=BA=E6=8E=A8=E8=8D=90=E4=BF=A1=E6=81=AF?=
 =?UTF-8?q?=EF=BC=88=E6=A0=B7=E5=BC=8F=E5=BE=85=E8=B0=83=E6=95=B4)?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/views/home/index.vue | 210 ++++++++++++++++++++++++++++++++++++++-
 1 file changed, 207 insertions(+), 3 deletions(-)

diff --git a/src/views/home/index.vue b/src/views/home/index.vue
index 5d19402..2d86397 100644
--- a/src/views/home/index.vue
+++ b/src/views/home/index.vue
@@ -42,8 +42,151 @@
           <span style="color: #6fbb60">下跌{{ marketEqual }}家</span>
         </div>
       </div>
-      <div class="market_bottom">
-        <div class="market_bottom_nav_text">
+      <div class="left_nav">
+          <div class="nav_market_text">推荐信息</div>
+          <div class="nav_market_right" @click="marketDetail">
+          <div>我的收藏</div>
+          <i class="el-icon-arrow-right"></i>
+        </div>
+      </div>
+      <div class="left_bottom_nav">
+        <div class="market_top_nav_text">
+            <div
+              v-for="(item, index) in suggestTopNav"
+              :key="index"
+              :style="{ color: item.is ? '#EC7C00' : '#999999' }"
+              @click="marketTopNavClick(item.name)"
+            >
+              {{ item.name }}
+            </div>
+        </div>
+        <div class="trend_nav_list">
+          <div
+            v-for="(item, index) in tendencyNav"
+            :key="index"
+            :style="{ color: item.is ? '#EC7C00' : '#999999' }"
+            @click="tendencyNavClick(item.name)"
+          >
+            {{ item.name }}
+          </div>
+        </div>
+        <div class="trend_list_head">
+          <div class="trend_head_left">
+            <div class="trend__head_date">交易日期</div>
+            <div class="trend__head_name">东财行业指数2级</div>
+            <div class="head_plate_box">
+              <div class="trend__head_plate" @click="selectPlateRank">
+                板块排名
+              </div>
+              <div class="module_head_icon" v-if="plateRank">
+                <img
+                  src="../../static/shengxu_true.png"
+                  class="head_icon"
+                  mode="scaleToFill"
+                />
+                <img
+                  src="../../static/jiangxu_false.png"
+                  class="head_icon"
+                  mode="scaleToFill"
+                />
+              </div>
+              <div class="module_head_icon" v-else>
+                <img
+                  src="../../static/shengxu_false.png"
+                  class="head_icon"
+                  mode="scaleToFill"
+                />
+                <img
+                  src="../../static/jiangxu_true.png"
+                  class="head_icon"
+                  mode="scaleToFill"
+                />
+              </div>
+            </div>
+          </div>
+          <div class="head_ranking_box" @click="selectRankChange">
+            <div>排名变化</div>
+            <div class="module_head_icon" v-if="rankChange">
+              <img
+                src="../../static/shengxu_true.png"
+                class="head_icon"
+                mode="scaleToFill"
+              />
+              <img
+                src="../../static/jiangxu_false.png"
+                class="head_icon"
+                mode="scaleToFill"
+              />
+            </div>
+            <div class="module_head_icon" v-else>
+              <img
+                src="../../static/shengxu_false.png"
+                class="head_icon"
+                mode="scaleToFill"
+              />
+              <img
+                src="../../static/jiangxu_true.png"
+                class="head_icon"
+                mode="scaleToFill"
+              />
+            </div>
+          </div>
+        </div>
+        <div
+          v-if="tendencyList.length == 0"
+          style="
+            font-weight: bold;
+            color: #999999;
+            text-align: center;
+            margin-top: 50px;
+          "
+        >
+          暂无数据
+        </div>
+        <div v-else>
+          <div
+            class="trend_list"
+            v-for="(item, index) in tendencyList"
+            :key="index"
+          >
+            <div class="trend_list_left">
+              <div class="trend_list_date">
+                {{ item.businessDate }}
+              </div>
+              <div class="trend_list_name">
+                {{ item.securityName }}
+              </div>
+              <div class="list_plate_box">
+                <div>{{ item.sort }}</div>
+                <div>
+                  <div v-if="item.sortChange > 0" class="plate_box_right">
+                    <img
+                      src="../../static/home_paiming_shangsheng.png"
+                      class="liate_box_icon"
+                    />
+                    <div style="color: #d9001b">{{ item.sortChange }}</div>
+                  </div>
+                  <div v-if="item.sortChange == 0" class="plate_box_right">
+                    <div>-</div>
+                  </div>
+                  <div v-if="item.sortChange < 0" class="plate_box_right">
+                    <img
+                      src="../../static/home_paiming_xiajiang.png"
+                      class="liate_box_icon"
+                    />
+                    <div style="color: #8fc320">
+                      {{ Math.abs(item.sortChange) }}
+                    </div>
+                  </div>
+                </div>
+              </div>
+            </div>
+            <div class="trend_list_right">
+              {{ item.sortChange }}
+            </div>
+          </div>
+        </div>
+        <!-- <div class="market_bottom_nav_text">
           <div
             v-for="(item, index) in marketBottomNav"
             :key="index"
@@ -53,7 +196,7 @@
             {{ item.name }}
           </div>
         </div>
-        <div id="myChart" :style="{ width: '100%', height: '600px' }"></div>
+        <div id="myChart" :style="{ width: '100%', height: '600px' }"></div> -->
       </div>
     </div>
     <div class="main_right">
@@ -282,30 +425,85 @@ export default {
           name: "全部",
           is: true,
           current: "",
+          // 是否已缓存
+          hasMarkedData: false,
+          // 大盘上涨
+          marketRose: "",
+          // 大盘下跌
+          marketFall: "",
+          // 大盘平
+          marketEqual: "",
         },
         {
           name: "上证指数",
           is: false,
           current: "SH",
           code: "000001",
+          // 是否已缓存
+          hasMarkedData: false,
+          // 大盘上涨
+          marketRose: "",
+          // 大盘下跌
+          marketFall: "",
+          // 大盘平
+          marketEqual: "",
         },
         {
           name: "深证指数",
           is: false,
           current: "SZ",
           code: "399001",
+          // 是否已缓存
+          hasMarkedData: false,
+          // 大盘上涨
+          marketRose: "",
+          // 大盘下跌
+          marketFall: "",
+          // 大盘平
+          marketEqual: "",
         },
         {
           name: "创业板",
           is: false,
           current: "30",
           code: "399006",
+          // 是否已缓存
+          hasMarkedData: false,
+          // 大盘上涨
+          marketRose: "",
+          // 大盘下跌
+          marketFall: "",
+          // 大盘平
+          marketEqual: "",
         },
         {
           name: "科创板",
           is: false,
           current: "688",
           code: "000688",
+          // 是否已缓存
+          hasMarkedData: false,
+          // 大盘上涨
+          marketRose: "",
+          // 大盘下跌
+          marketFall: "",
+          // 大盘平
+          marketEqual: "",
+        },
+      ],
+      //推荐信息导航
+      suggestTopNav:[
+      {
+          name: "版块",
+          is: true,
+          // 是否已缓存
+          hasMarkedData: false
+        },
+        {
+          name: "个股",
+          is: false,
+          // 是否已缓存
+          hasMarkedData: false
         },
       ],
       // 大盘信息K线图导航
@@ -473,6 +671,7 @@ export default {
     };
   },
   created() {
+    //获取数据redis中最晚的
     this.marketTopDate = this.getTime(Date.parse(new Date()));
     this.rending();
     document.title = "首页";
@@ -580,12 +779,17 @@ export default {
     marketTopNavClick(name) {
       this.marketTopNav.forEach((item) => {
         if (item.name == name) {
+          console.log("marketRose: ",item.marketRose);
           item.is = true;
           riseLossesStatistics({
             businessDate: this.marketTopDate,
             securityType: item.current,
           })
             .then((res) => {
+              item.marketRose = res.data.riseNum;
+              item.marketFall = res.data.lossesNum;
+              item.marketEqual = res.data.equalNum;
+
               this.marketRose = res.data.riseNum;
               this.marketFall = res.data.lossesNum;
               this.marketEqual = res.data.equalNum;