1
jhzh
2025-04-21 067883c72b282546402064eb1b78d8618d45b74d
src/page/home/home.vue
@@ -1,10 +1,11 @@
<template>
  <div class="wrapper">
    <div class="page_content">
    <!--  <div class="top_logo">
      <div class="top_logo">
        <div class="left_logo">
          <div class="img_logo">
              Fidelity
            <!-- <img :src="Logo" alt /> -->
              FALCON
          </div>
        </div>
        <div class="right_search">
@@ -24,20 +25,20 @@
          </div>
        </div>
      </div> -->
      </div>
      <div class="center_tabs">
        <!-- 顶部轮播图 -->
       <div class="banner_top">
         <!-- <van-skeleton title :row="3" :loading="loading" /> -->
         <van-swipe class="my-swipe" :autoplay="5000" indicator-color="white" >
           <van-swipe-item v-for="(item, index) in bannerImgsArr" @click="handleBannerClick(index)" :key="index">
             <img style="width: 100%;height: 200px;" :src="item.img" alt />
           </van-swipe-item>
         </van-swipe>
       </div>
<!--        <div class="banner_top">-->
<!--          <van-skeleton title :row="3" :loading="loading" />-->
<!--          <van-swipe class="my-swipe" :autoplay="5000" indicator-color="white" v-if="!loading">-->
<!--            <van-swipe-item v-for="(item, index) in bannerList" @click="handleBannerClick(index)" :key="index">-->
<!--              <img :src="item.bannerUrl" alt />-->
<!--            </van-swipe-item>-->
<!--          </van-swipe>-->
<!--        </div>-->
        <!-- 公告 -->
        <!-- <van-skeleton title :row="1" :loading="loading" /> -->
        <div class="announcement">
        <van-skeleton title :row="1" :loading="loading" />
        <div class="announcement" v-if="!loading && close">
          <div class="an_content" @click="$router.push('/newGg')">
            <div class="an_left_icon">
              <img :src="Announcement" alt />
@@ -52,9 +53,30 @@
        </div>
        <!-- 排行入门 -->
        <!-- <van-skeleton title :row="2" :loading="loading" /> -->
        <van-skeleton title :row="2" :loading="loading" />
        <div class="navs" v-if="!loading && close">
          <div class="navs_content">
<!--            <div class="chacha" @click="close = false">-->
<!--              <div>-->
<!--                <img :src="clear" />-->
<!--              </div>-->
<!--            </div>-->
            <div v-for="(item, index) in navsArr" :key="index" @click="goJy(index)">
              <div>
                <div class="top_img">
                  <div>
                    <img :src="item.img" alt />
                  </div>
                </div>
                <div class="bottom_navs">
                  <span>{{ item.title }}</span>
                </div>
              </div>
            </div>
          </div>
        </div>
        <!-- 最多关注 -->
<!--        <van-skeleton title :row="6" :loading="loading" class="focus_skeleton" />-->
<!--        <div class="focus_on" v-if="!loading">-->
@@ -138,42 +160,8 @@
<!--            </div>-->
<!--          </div>-->
<!--        </div>-->
     <!-- <van-skeleton title :row="18" :loading="loading" /> -->
   <div class="txt_box">
           <div class="txt_box_top">{{$t('hometips')}}</div>
           <div class='txt_box_box'>
              <div class="txt_box_box_left" v-if="userInfo.length==0">$0.00</div>
              <div class="txt_box_box_left" v-else>${{userInfo.totalAssets}}</div>
              <div class="txt_box_box_right" @click='gocz'>{{$t('btn1')}}</div>
           </div>
   </div>
      </div>
     <div class="navs" >
               <div class="navs_content">
                 <div v-for="(item, index) in navsArr" :key="index" @click="goJy(index)">
                   <div style="display: flex;justify-content: center;align-items: center;flex-direction: column;">
                     <div class="top_img">
                       <div>
                         <img :src="item.img" alt />
                       </div>
                     </div>
                     <div class="bottom_navs">
                       <span>{{ item.title }}</span>
                     </div>
                   </div>
                 </div>
               </div>
             </div>
     <!-- <van-skeleton title :row="18" :loading="loading" /> -->
<!--    <div class='btns_box'>
      <div class="btns_box_left">
         <img src="../../assets/img/out.png" style="width: 20px;height: 20px;"/>
         <div class="btns_box_left_txt"></div>
      </div>
      <div class="btns_box_right"></div>
   </div> -->
      <!-- <van-skeleton title :row="18" :loading="loading" /> -->
      <van-skeleton title :row="18" :loading="loading" />
      <div class="news-tab">
        <mt-navbar v-model="news">
          <mt-tab-item id="tab_0">
@@ -194,14 +182,14 @@
                  listid: item.id
                }
              })">
                <div class="item-times">{{ item.addTime | gettime }}</div>
                <div class="item-times">{{ item.showTime | gettime }}</div>
                <div class="titContent" style="-webkit-box-orient: vertical;font-size: 0.38rem;margin-top: 0.2rem;">
                  {{ item.title }}
                </div>
                <!-- <div class="block-out">
                  <div class="blocks">{{ item.sourceName }}</div>
                </div> -->
                <div class="neitu"><img :src="item.imgurl" /></div>
                <div class="neitu"><img :src="'data:image/png;base64,'+item.imgurl" /></div>
              </div>
            </div>
          </mt-tab-container-item>
@@ -212,7 +200,7 @@
                  listid: item.id
                }
              })">
                <div class="item-times">{{ item.addTime | gettime }}</div>
                <div class="item-times">{{ item.showTime | gettime }}</div>
                <div class="titContent" style="-webkit-box-orient: vertical;">{{ item.title }}</div>
              </div>
            </div>
@@ -224,14 +212,13 @@
                  listid: item.id
                }
              })">
                <div class="item-times">{{ item.addTime | gettime }}</div>
                <div class="item-times">{{ item.showTime | gettime }}</div>
                <div class="titContent" style="-webkit-box-orient: vertical;">{{ item.title }}</div>
              </div>
            </div>
          </mt-tab-container-item>
        </mt-tab-container>
      </div>
     <div style="width: 100%;height: 100px;"></div>
    </div>
    <!-- tab -->
    <GoToLogin v-show="isGoTo" />
@@ -252,16 +239,11 @@
import Xuexi from '@/assets/home/3.png'
import Guanyu from '@/assets/home/4.png'
import dazong from '@/assets/home/5.png'
import vip from '../../assets/img/app.png'
import vipa from '../../assets/img/huazhuan2.png'
import vip from '@/assets/home/6.png'
import Huo from '@/assets/home/huo.png'
import banner1 from '@/assets/img/b1.jpg'
import banner2 from '@/assets/img/b2.jpg'
import banner3 from '@/assets/img/b3.jpg'
import caidana from '@/assets/img/caidana.png'
import bangzhu from '@/assets/img/bangzhu.png'
import kefua from '@/assets/img/kefua.png'
import xiazai from '@/assets/img/xiazai.png'
import banner1 from '@/assets/img/b1.png'
import banner2 from '@/assets/img/b2.png'
import banner3 from '@/assets/img/b3.png'
// import indexData from "./data.json";
import GoToLogin from '@/page/home/components/GoLogin.vue'
import { MessageBox } from 'mint-ui'
@@ -310,52 +292,41 @@
      actions: [
        { text: 'English', icon: require('@/assets/ico/english.png'), lang: 'zh-CN' },
        { text: 'हिंदी', icon: require('@/assets/ico/india.png'), lang: 'en' },
        { text: '繁体中文', icon: require('@/assets/ico/tw.png'), lang: 'tw' }
        // { text: '繁体中文', icon: require('@/assets/ico/tw.png'), lang: 'tw' }
      ]
    }
  },
  computed: {
    navsArr () {
      return [
        // {
    //     img: Tops,
    //     title: this.$t('yeb')
    //   },
      {
        img: xiazai,
        title: this.$t('hj1461')
      },
      {
        img: kefua,
        title: this.$t('kf')
      },
      {
        img: bangzhu,
        title: this.$t('bz')
      },
      {
        img: caidana,
        title: this.$t('caidan')
      },
      {
        img: Rumen,
        title: this.$t('hj2')
      },
      {
        img: Xuexi,
        title: this.$t('hj3')
      },
      {
        img: Guanyu,
        title: this.$t('hj4')
      },
      {
        img: dazong,
        title: this.$t('hj261')
      },
      // {
      //   img: Rumen,
      //   title: this.$t('hj2')
      //   img: vip,
      //   title: this.$t('subdk')
      // },
      {
        img: Tops,
        title: this.$t('申購記錄')
      },
      // {
      //   img: Xuexi,
      //   title: this.$t('hj3')
      // },
      // {
      //   img: Guanyu,
      //   title: this.$t('hj4')
      // },
      // {
      //   img: dazong,
      //   title: this.$t('hj261')
      // },
      // {
      //   img: vipa,
      //   title: this.$t('hj172')
      //   img: vip,
      //   title: this.$t('hj279')
      // }
      ]
    }
@@ -432,50 +403,35 @@
        return 0
      }
    },
   gocz(){
      if (this.userInfo.length === 0) {
         this.$store.commit('dialogVisible', true)
        return
      }else{
         this.$router.push('/wallet')
      }
   },
    goJy (index) {
      if (this.userInfo.length === 0) {
        this.$store.commit('dialogVisible', true)
        return
      }
      // if (this.userInfo.length === 0) {
      //   this.$store.commit('dialogVisible', true)
      //   return
      // }
      switch (index) {
        // case 0:
        //   this.$router.push('/yeb')
        //   break
        case 0:
      this.$router.push('/download')
          // this.$router.push('/warehouse')
          this.$router.push('/warehouse')
          break
        case 1:
          // this.$router.push({ path: '/trading-list', query: { listid: 5 } })
        this.$router.push('/new_service')
        // window.location.href = this.onlineService
          this.$router.push('/favorites')
          break
        case 2:
          this.$router.push('/help')
        this.$router.push('/user')
          // this.$router.push({ path: '/trading-list', query: { listid: 5 } })
          break
        case 3:
          this.$router.push('/trading-list?type=DZ')
          break
        // case 3:
        //   this.$router.push('/Subscription?idx=1')
        //   break
        case 3:
          // this.$router.push('/Subscription?idx=1')
          this.$router.push({ path: '/trading-list', query: { indexid: 3 } })
          break
        case 4:
          // this.$router.push('/SubDK')
          // this.$router.push('/Subscription?idx=1')
          this.$router.push( '/favoritesList')
          break
        case 5:
          // this.$router.push('/SubDK')
          this.$router.push('/wallet')
          break
        case 5:
          this.$router.push('/SubDK')
          break
        default:
          break
      }
@@ -488,11 +444,7 @@
      // 获取显示的banner
      let result = await api.getBannerByPlat({ platType: 'm' })
      if (result.status === 0) {
        // this.bannerList = result.data
      var ajson = {'bannerUrl':this.banner1}
      this.bannerList.push(ajson)
      console.log(this.banner1);
      // console.log(this.bannerList);
        this.bannerList = result.data
      } else {
        this.$store.commit('elAlertShow', { 'elAlertShow': true, 'elAlertText': result.msg })
      }
@@ -621,133 +573,10 @@
}
</script>
<style lang="less" scoped>
   .navs {
     width: 100%;
     height: 2.6154rem;
     display: flex;
     justify-content: center;
     >.navs_content {
       position: relative;
       overflow: hidden;
       width: 87%;
       height: 100%;
       margin: 20px auto;
       // border-radius: 0.2564rem;
       display: flex;
       justify-content: space-between;
       >.chacha {
         width: 1rem;
         height: 1rem;
         border-radius: 100%;
         background-color: rgb(210, 210, 212);
         display: flex;
         justify-content: space-between;
         align-items: center;
         position: absolute;
         right: -0.4rem;
         top: -0.4rem;
         >div {
           width: 0.3554rem;
           height: 0.3554rem;
           margin-top: 0.3rem;
           margin-left: 0.15rem;
           >img {
             width: 100%;
             height: 100%;
           }
         }
       }
       >div {
         width: 20%;
         height: 100%;
         display: flex;
         align-items: center;
         >div {
           width: 100%;
           height: 60%;
           >.top_img {
            width: 0.903704rem;
            height: 0.803704rem;
             display: flex;
             align-items: center;
             justify-content: center;
             >div {
               width: 0.9718rem;
               height: 0.9718rem;
               >img {
                 width: 100%;
                 height: 100%;
               }
             }
           }
           >.bottom_navs {
             width: 100%;
             height: 30%;
             display: flex;
             justify-content: center;
             align-items: center;
             font-size: 0.33rem;
             margin-top: 0.15rem;
           }
         }
       }
     }
   }
   .txt_box_box_right{
      color: #fff;
      background: #409eff;
      text-align: center;
      padding: 10px 15px;
      border-radius: 6px;
   }
   .txt_box_box_left{
      margin: 10px 0;
      font-size: 30px;
      font-weight: 600;
      white-space: nowrap;
      overflow: hidden;
      text-overflow: ellipsis /* 显示省略符号 (...) */;
   }
   .txt_box_box{
      display: flex;
      justify-content: space-between;
      align-items: center;
      margin-bottom: 20px;
   }
   .txt_box_top{
      font-size: 12px;
      margin-top: 10px;
      margin-bottom: 20px;
   }
   .txt_box{
      width: 95%;
      margin-left: 2.5%;
      display: flex;
      flex-direction: column;
      background: linear-gradient(270deg,#fff,#f2ecfd);
      border: 1px solid #dcdfe9;
      border-radius: 6px;
      padding: 10px 20px;
      font-size: 12px;
      margin-top: 10px;
      box-shadow: 0 2px 12px 0 rgba(0,0,0,.3);
   }
.wrapper {
  width: 100%;
  height: 100%;
   background-color: #fff;
  padding-top: .3128rem;
  .page_content {
@@ -817,7 +646,7 @@
    }
    .van-swipe-item {
      // height: 3.0615rem;
      height: 3.0615rem;
      padding: 0 0.264rem;
      border-radius: 0.3rem;
    }
@@ -878,10 +707,10 @@
    >.navs_content {
      position: relative;
      overflow: hidden;
      width: 87%;
      width: 95%;
      height: 100%;
      margin: 20px auto;
      // border-radius: 0.2564rem;
      margin: 0 auto;
      border-radius: 0.2564rem;
      display: flex;
      justify-content: space-between;
@@ -912,7 +741,7 @@
      }
      >div {
        width: 20%;
        width: 16%;
        height: 100%;
        display: flex;
        align-items: center;
@@ -922,8 +751,8 @@
          height: 60%;
          >.top_img {
         width: 0.903704rem;
         height: 0.803704rem;
            width: 100%;
            height: 70%;
            display: flex;
            align-items: center;
            justify-content: center;
@@ -1116,14 +945,15 @@
.my-swipe .van-swipe-item {
  font-size: 0.5128rem;
  // line-height: 3.8462rem;
  line-height: 3.8462rem;
  text-align: center;
  overflow: hidden;
}
.fo_my-swipe .van-swipe-item {
  font-size: 0.5128rem;
  // line-height: 3.8462rem;
  line-height: 3.8462rem;
  overflow: hidden;
}