DESKTOP-CVS3R96\我恁爹
2022-11-09 47f441e34648c595380072497c8c415d830c9f6e
src/page/home/home.vue
@@ -35,8 +35,11 @@
            <div class="an_left_icon">
              <img :src="Announcement" alt />
            </div>
            <div class="an_right_message">
              {{ artList.artTitle }}
            <div class="an_right_message " >
              <div class="animate">
                {{ artList.artTitle }}
              </div>
            </div>
          </div>
        </div>
@@ -109,25 +112,27 @@
                  <div class="item_cont" :class="idx!=2?'item_conts':''" v-for="(item2, idx) in proData[currentIndex]" :key="idx">
                    <div class="top_fo">
                      <div class="title">
                        {{ item2.indexName }}
                        {{ item2.name }}
                      </div>
                      <div class="numbers">
                        {{ item2.currentPoint }}
                        {{ item2.price }}
                      </div>
                      <div class="percentage" :class="item2.floatRate > 0 ? 'gree' : 'redd'">
                        <span style="font-weight: 500;">{{ item2.floatRate > 0 ? `+${item2.floatRate}%` :
                            `${item2.floatRate}%`
                      <div class="percentage" :class="item2.range > 0 ? 'gree' : 'redd'">
                        <span style="font-weight: 500;">{{ item2.range > 0 ? `${item2.range}` :
                            `${item2.range}`
                        }}</span>
                      </div>
                    </div>
                    <div class="bottom_fo">
                      <div class="title">
                        <span class="numberid" style="margin-right: 0.12rem;">{{ item2.indexCode }}</span>
                        <img v-for="items in item2.random" :src="Huo" alt style="width: 0.4rem;height: 0.4rem;" />
                        <span class="numberid" style="margin-right: 0.12rem;">{{ item2.symbol }}</span>
                        <div v-for="(items,index) in item2.pnum.slice(1, 2)">
                          <img v-if="index<3" :src="Huo" alt style="width: 0.4rem;height: 0.4rem;" />
                        </div>
                      </div>
                      <div class="numbers" :class="item2.floatPoint > 0 ? 'gree' : 'redd'">
                        <span class="point">{{ item2.floatPoint > 0 ? `+${item2.floatPoint}%` : `${item2.floatPoint}%`
                        <span class="point">{{ item2.pnum
                        }}</span>
                      </div>
                      <div class="percentage">
@@ -362,8 +367,8 @@
    },
    async getStock() {
      let data = await api.getIndexMarket();
      for (var i = 0; i < data.data.length; i += 3) {
        this.proData.push(data.data.slice(i, i + 3));
      for (var i = 0; i < data.data.result.data.length; i += 3) {
        this.proData.push(data.data.result.data.slice(i, i + 3));
      }
    },
@@ -405,7 +410,8 @@
    },
    handleSearchClick() {
      this.loading = !this.loading;
      //this.loading = !this.loading;
      this.$router.push({path:"/trading-list",query:{type:1}});
    }
  },
  filters: {
@@ -451,8 +457,13 @@
    this.getArtList();
    this.getBanner()
    setInterval(() => {
      this.isGoTo = !this.isGoTo
      if(window.localStorage.getItem('USERTOKEN')){
        this.isGoTo = false;
      }else{
        this.isGoTo = !this.isGoTo
      }
    }, 10000);
    setTimeout(() => {
@@ -562,7 +573,7 @@
      align-items: center;
      .an_left_icon {
        width: 5%;
        width: 4%;
        height: 70%;
        display: flex;
        align-items: center;
@@ -576,10 +587,13 @@
      .an_right_message {
        width: 93%;
        height: 100%;
        display: flex;
        line-height: 0.559rem;
        align-items: center;
        align-content: center;
        font-size: 0.29rem;
        white-space: nowrap;
         overflow: hidden;
        // text-overflow:ellipsis;
      }
    }
  }
@@ -940,4 +954,63 @@
  border: 0.0513rem solid #41AC75;
  color: #41AC75;
}
.animate {
padding-left: 20px;
font-size: 0.29rem;
color: #000;
display: inline-block;
white-space: nowrap;
animation: 10s wordsLoop linear infinite normal;
}
@keyframes wordsLoop {
0% {
    transform: translateX(100%);
    -webkit-transform: translateX(100%);
}
100% {
    transform: translateX(-100%);
    -webkit-transform: translateX(-100%);
}
}
@-webkit-keyframes wordsLoop {
0% {
    transform: translateX(100%);
    -webkit-transform: translateX(100%);
}
100% {
    transform: translateX(-100%);
    -webkit-transform: translateX(-100%);
}
}
</style>