jhzh
2024-03-23 0d29d9a2bf0d893a67f1263bb9525131a50a2128
src/page/home/home.vue
@@ -1,10 +1,10 @@
<template>
  <div class="wrapper">
    <div class="page_content">
      <div class="top_logo">
    <!--  <div class="top_logo">
        <div class="left_logo">
          <div class="img_logo">
            <img :src="Logo" alt />
              Fidelity
          </div>
        </div>
        <div class="right_search">
@@ -12,7 +12,7 @@
            <div class="service_con" @click="goOnline()">
              <img :src="Service" alt />
            </div>
            <van-popover v-model="showPopover" trigger="click" placement="bottom-end" :actions="actions"
            <van-popover v-model="showPopover" trigger="click" placement="bottom-end" :actions="actions"
              @select="onSelect">
              <template #reference>
                <div class="iconfont icon-icon_A">
@@ -21,147 +21,159 @@
              </template>
            </van-popover>
          </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" 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>
       <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>
        <!-- 公告 -->
        <van-skeleton title :row="1" :loading="loading" />
        <div class="announcement" v-if="!loading && close">
        <!-- <van-skeleton title :row="1" :loading="loading" /> -->
        <div class="announcement">
          <div class="an_content" @click="$router.push('/newGg')">
            <div class="an_left_icon">
              <img :src="Announcement" alt />
            </div>
            <div class="an_right_message ">
              <div class="animate">
              <!-- <div class="animate">
                {{ artList.artTitle }}
              </div>
              </div> -->
            </div>
          </div>
        </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">
          <div class="fo_content">
            <div class="top_title">
              {{ $t('hj5') }}
            </div>
            <div class="fo_banner">
              <van-swipe class="fo_my-swipe" :autoplay="0" indicator-color="white" @change="onChange">
                <!-- <van-swipe-item v-for="(item, index)  in proData" :key="index">
                  <div class="item_cont" v-for="(item2, idx) in proData[currentIndex]" :key="idx">
                    <div class="top_fo" style="width: 80%;">
                      <div class="title" style="width: 30%;">
                        <span>{{ item2.f14 }}</span>
                      </div>
                      <div class="percentage"  :class="item2.f3 > 0 ? 'gree' : 'redd'">
<!--        <van-skeleton title :row="6" :loading="loading" class="focus_skeleton" />-->
<!--        <div class="focus_on" v-if="!loading">-->
<!--          <div class="fo_content">-->
<!--            <div class="top_title">-->
<!--              {{ $t('hj5') }}-->
<!--            </div>-->
<!--            <div class="fo_banner">-->
<!--              <van-swipe class="fo_my-swipe" :autoplay="0" indicator-color="white" @change="onChange">-->
<!--                &lt;!&ndash; <van-swipe-item v-for="(item, index)  in proData" :key="index">-->
<!--                  <div class="item_cont" v-for="(item2, idx) in proData[currentIndex]" :key="idx">-->
<!--                    <div class="top_fo" style="width: 80%;">-->
<!--                      <div class="title" style="width: 30%;">-->
<!--                        <span>{{ item2.f14 }}</span>-->
<!--                      </div>-->
<!--                      <div class="percentage"  :class="item2.f3 > 0 ? 'gree' : 'redd'">-->
                        <span>{{ item2.f3 > 0 ? `+${item2.f3}%` : `${item2.f3}%` }}</span>
                      </div>
                      <div class="percentage"></div>
                      <div class="percentage" style="width: 38%;position: absolute;right: 0;top: 5%;height: 80%;" :class="item2.f3 > 0 ? 'gree' : 'redd'">
                         <echart :colorType="item2.f3" :ids="idx+'1'+index"></echart>
                      </div>
                    </div>
                    <div class="bottom_fo" style="width: 80%;">
                      <div class="title"style="width: 30%;">
                        <span style="margin-right: 0.12rem;">{{ item2.f12 }}</span>
                        <img v-for="item in getHuo()" :src="Huo" alt style="width: 0.4rem;height: 0.4rem;" />
                      </div>
                      <div  class="percentage" >
                        <span>{{ item2.f2 }}</span>
                      </div>
                      <div class="percentage">
                        <span></span>
                      </div>
                    </div>
                  </div>
                </van-swipe-item> -->
                <van-swipe-item v-for="(item, index)  in proData" :key="index">
                  <div class="item_cont" :class="idx != 2 ? 'item_conts' : ''"
                    v-for="(item2, idx) in proData[currentIndex]" :key="idx" @click="goDetail(item2)">
                    <div class="top_fo">
                      <div class="title">
                        {{ item2.name }}
                      </div>
                      <div class="numbers">
                        {{ item2.price }}
                      </div>
                      <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.symbol }}</span>
                        <!-- <div v-for="(items, indexs) in Number(item2.pnum.slice(0, 1))"
                          style="width: 0.4rem;height: 0.4rem;display: flex;">
                          <img v-if="indexs < 3" :src="Huo" alt style="width: 0.4rem;height: 0.4rem;" />
                        </div> -->
<!--                        <span>{{ item2.f3 > 0 ? `+${item2.f3}%` : `${item2.f3}%` }}</span>-->
<!--                      </div>-->
<!--                      <div class="percentage"></div>-->
<!--                      <div class="percentage" style="width: 38%;position: absolute;right: 0;top: 5%;height: 80%;" :class="item2.f3 > 0 ? 'gree' : 'redd'">-->
<!--                         <echart :colorType="item2.f3" :ids="idx+'1'+index"></echart>-->
<!--                      </div>-->
<!--                    </div>-->
<!--                    <div class="bottom_fo" style="width: 80%;">-->
<!--                      <div class="title"style="width: 30%;">-->
<!--                        <span style="margin-right: 0.12rem;">{{ item2.f12 }}</span>-->
<!--                        <img v-for="item in getHuo()" :src="Huo" alt style="width: 0.4rem;height: 0.4rem;" />-->
<!--                      </div>-->
<!--                      <div  class="percentage" >-->
                      </div>
                      <div class="numbers" :class="item2.floatPoint > 0 ? 'gree' : 'redd'">
                        <img :src="Huo" alt style="width: 0.4rem;height: 0.4rem;" />
                        <span class="point" style="height: 0.4rem;">{{ item2.pnum
                        }}</span>
                      </div>
                      <div class="percentage">
                        <!-- <span class="aikesi">100X</span> -->
                        <el-tag key="100X"
                          style="width: 80%;text-align: center;height: 0.45rem!important;line-height: 0.45rem!important;">
                          {{ getNum1(Number(item2.pnum.slice(0, 1))) + 'X' }}
                        </el-tag>
                      </div>
                    </div>
                  </div>
                </van-swipe-item>
              </van-swipe>
            </div>
          </div>
        </div>
<!--                        <span>{{ item2.f2 }}</span>-->
<!--                      </div>-->
<!--                      <div class="percentage">-->
<!--                        <span></span>-->
<!--                      </div>-->
<!--                    </div>-->
<!--                  </div>-->
<!--                </van-swipe-item> &ndash;&gt;-->
<!--                <van-swipe-item v-for="(item, index)  in proData" :key="index">-->
<!--                  <div class="item_cont" :class="idx != 2 ? 'item_conts' : ''"-->
<!--                    v-for="(item2, idx) in proData[currentIndex]" :key="idx" @click="goDetail(item2)">-->
<!--                    <div class="top_fo">-->
<!--                      <div class="title">-->
<!--                        {{ item2.name }}-->
<!--                      </div>-->
<!--                      <div class="numbers">-->
<!--                        {{ item2.price }}-->
<!--                      </div>-->
<!--                      <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.symbol }}</span>-->
<!--                        &lt;!&ndash; <div v-for="(items, indexs) in Number(item2.pnum.slice(0, 1))"-->
<!--                          style="width: 0.4rem;height: 0.4rem;display: flex;">-->
<!--                          <img v-if="indexs < 3" :src="Huo" alt style="width: 0.4rem;height: 0.4rem;" />-->
<!--                        </div> &ndash;&gt;-->
<!--                      </div>-->
<!--                      <div class="numbers" :class="item2.floatPoint > 0 ? 'gree' : 'redd'">-->
<!--                        <img :src="Huo" alt style="width: 0.4rem;height: 0.4rem;" />-->
<!--                        <span class="point" style="height: 0.4rem;">{{ item2.pnum-->
<!--                        }}</span>-->
<!--                      </div>-->
<!--                      <div class="percentage">-->
<!--                        &lt;!&ndash; <span class="aikesi">100X</span> &ndash;&gt;-->
<!--                        <el-tag key="100X"-->
<!--                          style="width: 80%;text-align: center;height: 0.45rem!important;line-height: 0.45rem!important;">-->
<!--                          {{ getNum1(Number(item2.pnum.slice(0, 1))) + 'X' }}-->
<!--                        </el-tag>-->
<!--                      </div>-->
<!--                    </div>-->
<!--                  </div>-->
<!--                </van-swipe-item>-->
<!--              </van-swipe>-->
<!--            </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>
      <van-skeleton title :row="18" :loading="loading" />
     <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" /> -->
      <div class="news-tab">
        <mt-navbar v-model="news">
          <mt-tab-item id="tab_0">
@@ -186,9 +198,9 @@
                <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="block-out">
                  <div class="blocks">{{ item.sourceName }}</div>
                </div>
                </div> -->
                <div class="neitu"><img :src="item.imgurl" /></div>
              </div>
            </div>
@@ -219,40 +231,49 @@
          </mt-tab-container-item>
        </mt-tab-container>
      </div>
     <div style="width: 100%;height: 100px;"></div>
    </div>
    <!-- tab -->
    <GoToLogin v-show="isGoTo" />
  </div>
</template>
<script>
import AllList from "@/page/list/list-all";
import HomeList from "./components/home-list";
import Echart from "./components/echart.vue";
import * as api from "@/axios/api";
import Logo from "@/assets/img/icon_home_logo.png";
import Searchs from "@/assets/ico/leng.png";
import Service from "@/assets/home/icon_talk.png";
import clear from "@/assets/home/close.png";
import Announcement from "@/assets/img/black_laba.png";
import Tops from "@/assets/home/1.png";
import Rumen from "@/assets/home/2.png";
import Xuexi from "@/assets/home/3.png";
import Guanyu from "@/assets/home/4.png";
import Huo from "@/assets/home/huo.png";
import banner1 from "@/assets/img/b1.png";
import banner2 from "@/assets/img/b2.png";
import banner3 from "@/assets/img/b3.png";
import AllList from '@/page/list/list-all'
import HomeList from './components/home-list'
import Echart from './components/echart.vue'
import * as api from '@/axios/api'
import Logo from '@/assets/img/img_log_home.png'
import Searchs from '@/assets/ico/leng.png'
import Service from '@/assets/home/icon_talk.png'
import clear from '@/assets/home/close.png'
import Announcement from '@/assets/img/black_laba.png'
import Tops from '@/assets/home/1.png'
import Rumen from '@/assets/home/2.png'
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 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 indexData from "./data.json";
import GoToLogin from '@/page/home/components/GoLogin.vue';
import GoToLogin from '@/page/home/components/GoLogin.vue'
import { MessageBox } from 'mint-ui'
export default {
  components: {
    HomeList,
    AllList,
    GoToLogin,
    Echart,
    Echart
  },
  props: {},
  data() {
  data () {
    return {
      Logo,
      Searchs,
@@ -273,266 +294,460 @@
      }, {
        img: banner3
      }],
      announcementMess: "20202/10 - 交易时间安排",
      announcementMess: '20202/10 - 交易时间安排',
      artList: [],
      news: "tab_0",
      news: 'tab_0',
      newsContent1: [],
      newsContent2: [],
      newsContent3: [],
      newsContent4: [],
      onlineService: "",
      onlineService: '',
      isGoTo: false,
      bannerList: [],
      userInfo: [],
      showPopover: false,
      actions: [{ text: 'English', icon: require('@/assets/ico/english.png'), lang: 'en' },
      { text: '简体中文', icon: require('@/assets/ico/Chinese.png') , lang: 'zh-CN'}],
    };
      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' }
      ]
    }
  },
  computed:{
    navsArr(){
      return [{
        img: Tops,
        title: this.$t('hj1'),
      },
      {
        img: Rumen,
        title: this.$t('hj2'),
      },
      {
        img: Xuexi,
        title: this.$t('hj3'),
      },
      {
        img: Guanyu,
        title: this.$t('hj4'),
      }]
  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: vipa,
      //   title: this.$t('hj172')
      // }
      ]
    }
  },
  methods: {
    onSelect(e){
      this.$i18n.locale = e.lang;
      window.localStorage.setItem('language', e.lang);
    getdialog () {
      MessageBox.confirm(this.$t('hj252'), this.$t('hj165'), {
        confirmButtonText: this.$t('hj161'),
        cancelButtonText: this.$t('hj106')
      }).then(async () => {
      }).catch(() => {
      })
      // MessageBox.confirm('老号被盗请勿转账,请认准新tg:@BEINL2', this.$t('hj165'), {
      //   confirmButtonText: this.$t('hj161'),
      //   cancelButtonText: this.$t('hj106'),
      // }).then(async () => {
      // }).catch(() => {
      // });
    },
    async getUserInfo() {
    onSelect (e) {
      this.$i18n.locale = e.lang
      window.localStorage.setItem('language', e.lang)
    },
    async getUserInfo () {
      // 获取用户信息
      let data = await api.getUserInfo();
      let data = await api.getUserInfo()
      if (data.status === 0) {
        // 判断是否登录
        this.$store.state.userInfo = data.data;
        this.userInfo = data.data;
        this.$store.state.userInfo = data.data
        this.userInfo = data.data
      } else {
      }
    },
    getHuo() {
      //123随机
      var num = Math.floor(Math.random() * 3 + 1);
      return num;
    getHuo () {
      // 123随机
      var num = Math.floor(Math.random() * 3 + 1)
      return num
    },
    //构造随机数列表  50 100 200
    getNum1(num) {
      if (num == 1) {
        return 50;
      } else if (num == 2) {
        return 100;
    // 构造随机数列表  50 100 200
    getNum1 (num) {
      if (num === 1) {
        return 50
      } else if (num === 2) {
        return 100
      } else if (num >= 3) {
        return 200;
        return 200
      }
    },
    goDetail(item) {
      if (this.userInfo.length == 0) {
        this.$store.commit('dialogVisible', true);
        return;
    goDetail (item) {
      if (this.userInfo.length === 0) {
        this.$store.commit('dialogVisible', true)
        return
      }
      this.$router.push({
        path: "/kline",
        path: '/kline',
        query: {
          name: item.name,
          stockplate: item.stock_plate,
          code: item.symbol.substring(2, item.symbol.length),
          type: item.market,
          sok: this.filterSH(item.market),
          if_zhishu: '0',
          if_zhishu: '0'
        }
      });
      })
    },
    filterSH(val) {
      if (val === "sh") {
        return 1;
      } else if (val === "bj" || val === "sz") {
        return 0;
    filterSH (val) {
      if (val === 'sh') {
        return 1
      } else if (val === 'bj' || val === 'sz') {
        return 0
      }
    },
    goJy(index) {
      if (this.userInfo.length == 0) {
        this.$store.commit('dialogVisible', true);
        return;
   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
      }
      switch (index) {
        // case 0:
        //   this.$router.push('/yeb')
        //   break
        case 0:
          this.$router.push('/trading-list');
          break;
      this.$router.push('/download')
          // this.$router.push('/warehouse')
          break
        case 1:
          this.$router.push('/warehouse');
          break;
          // this.$router.push({ path: '/trading-list', query: { listid: 5 } })
        this.$router.push('/new_service')
        // window.location.href = this.onlineService
          break
        case 2:
          this.$router.push({ path: '/trading-list', query: { listid: 3 } });
          break;
          this.$router.push('/help')
          break
        // case 3:
        //   this.$router.push('/Subscription?idx=1')
        //   break
        case 3:
          this.$router.push('/user');
          break;
          // this.$router.push('/Subscription?idx=1')
          this.$router.push({ path: '/trading-list', query: { indexid: 3 } })
          break
        case 4:
          // this.$router.push('/SubDK')
          break
        case 5:
          // this.$router.push('/SubDK')
          this.$router.push('/wallet')
          break
        default:
          break;
          break
      }
      if (navigator.vibrate) {
        // 支持
        navigator.vibrate([55]);
        navigator.vibrate([55])
      }
    },
    async getBanner() {
    async getBanner () {
      // 获取显示的banner
      let result = await api.getBannerByPlat({ platType: 'm' })
      if (result.status === 0) {
        this.bannerList = result.data
        // this.bannerList = result.data
      var ajson = {'bannerUrl':this.banner1}
      this.bannerList.push(ajson)
      console.log(this.banner1);
      // console.log(this.bannerList);
      } else {
        this.$store.commit('elAlertShow', { 'elAlertShow': true, 'elAlertText': result.msg });
        this.$store.commit('elAlertShow', { 'elAlertShow': true, 'elAlertText': result.msg })
      }
    },
    goOnline() {
      this.$router.push('/service');
    goOnline () {
      this.$router.push('/service')
    },
    async getArtList() {
      let data = await api.getArtList();
      if (data.status == 0) {
        this.artList = data.data.list[0];
    async getArtList () {
      let data = await api.getArtList()
      if (data.status === 0) {
        this.artList = data.data.list[0]
      }
    },
    async getInfoSite() {
    async getInfoSite () {
      let data = await api.getInfoSite()
      if (data.status === 0) {
        this.onlineService = data.data.onlineService
      } else {
        this.$store.commit('elAlertShow', { 'elAlertShow': true, 'elAlertText': data.msg });
        this.$store.commit('elAlertShow', { 'elAlertShow': true, 'elAlertText': data.msg })
      }
    },
    async getStock() {
      let data = await api.getIndexMarket();
    async getStock () {
      let data = await api.getIndexMarket()
      for (var i = 0; i < data.data.result.data.length; i += 3) {
        this.proData.push(data.data.result.data.slice(i, i + 3));
        this.proData.push(data.data.result.data.slice(i, i + 3))
      }
    },
    async getNewsList(type) {
      let data = await api.queryNewsList(type);
    async getNewsList (type) {
      let data = await api.queryNewsList(type)
      switch (type) {
        case 1:
          this.newsContent1 = data.data.list
          break;
          break
        case 2:
          this.newsContent2 = data.data.list
          break;
          break
        case 3:
          this.newsContent3 = data.data.list
          break;
          break
        case 4:
          this.newsContent4 = data.data.list
          break;
          break
        case 5:
          this.newsContent5 = data.data.list
          break;
          break
      }
    },
    handleBannerClick(ind) {
    handleBannerClick (ind) {
      // console.log(ind);
    },
    ProcessData() {
    ProcessData () {
      // 把数据分割成三等份
      // for (var i = 0; i < this.indexData.data.diff.length; i += 3) {
      //   this.proData.push(this.indexData.data.diff.slice(i, i + 3));
      // }
    },
    onChange(index) {
      this.currentIndex = index;
    onChange (index) {
      this.currentIndex = index
      this.proData[index].forEach(item => {
      });
      })
    },
    handleSearchClick() {
      //this.loading = !this.loading;
      this.$router.push({ path: "/trading-list", query: { type: 1 } });
    handleSearchClick () {
      // this.loading = !this.loading;
      this.$router.push({ path: '/trading-list', query: { type: 1 } })
    }
  },
  filters: {
    gettime(time) {
    gettime (time) {
      if (!time) {
        return "";
        return ''
      }
      var nd = new Date(time);
      var y = nd.getFullYear();
      var mm = nd.getMonth() + 1;
      var d = nd.getDate();
      var h = nd.getHours();
      var m = nd.getMinutes();
      var c = nd.getSeconds();
      var nd = new Date(time)
      var y = nd.getFullYear()
      var mm = nd.getMonth() + 1
      var d = nd.getDate()
      var h = nd.getHours()
      var m = nd.getMinutes()
      var c = nd.getSeconds()
      if (mm < 10) {
        mm = "0" + mm;
        mm = '0' + mm
      }
      if (d < 10) {
        d = "0" + d;
        d = '0' + d
      }
      if (h < 10) {
        h = "0" + h;
        h = '0' + h
      }
      if (m < 10) {
        m = "0" + m;
        m = '0' + m
      }
      if (c < 10) {
        c = "0" + c;
        c = '0' + c
      }
      //17:35:2922-06-2022
      return y + "-" + mm + "-" + d + " " + h + ":" + m + ":" + c;
      // 17:35:2922-06-2022
      return y + '-' + mm + '-' + d + ' ' + h + ':' + m + ':' + c
    }
  },
  created() {
    this.ProcessData();
  created () {
    // this.getdialog()
    this.ProcessData()
  },
  mounted() {
    this.getUserInfo();
    this.getInfoSite();
    this.getNewsList(1);
    this.getNewsList(2);
    this.getNewsList(4);
    this.getStock();
    this.getArtList();
  mounted () {
    this.getUserInfo()
    this.getInfoSite()
    this.getNewsList(1)
    this.getNewsList(2)
    this.getNewsList(4)
    this.getStock()
    this.getArtList()
    this.getBanner()
    setInterval(() => {
      if (window.localStorage.getItem('USERTOKEN')) {
        this.isGoTo = false;
        this.isGoTo = false
      } else {
        this.isGoTo = !this.isGoTo
      }
    }, 10000);
    }, 10000)
    setTimeout(() => {
      this.loading = false
    }, 2000)
  }
};
}
</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 {
@@ -554,8 +769,10 @@
  }
  .img_logo {
    width: 3.3077rem;
    height: 0.6154rem;
    font-size: 20px;
    font-family: AlibabaSansVietBold;
    font-weight: 600;
    color: #333333;
    margin-left: 0.3846rem;
    >img {
@@ -572,7 +789,6 @@
      height: 0.4615rem;
      display: flex;
      justify-content: space-between;
      >div {
        width: 0.5615rem;
@@ -601,7 +817,7 @@
    }
    .van-swipe-item {
      height: 3.0615rem;
      // height: 3.0615rem;
      padding: 0 0.264rem;
      border-radius: 0.3rem;
    }
@@ -659,14 +875,15 @@
    display: flex;
    justify-content: center;
    >.navs_content {
      position: relative;
      overflow: hidden;
      width: 95%;
      width: 87%;
      height: 100%;
      border-radius: 0.2564rem;
      margin: 20px auto;
      // border-radius: 0.2564rem;
      display: flex;
      justify-content: space-between;
      >.chacha {
        width: 1rem;
@@ -695,7 +912,7 @@
      }
      >div {
        width: 25%;
        width: 20%;
        height: 100%;
        display: flex;
        align-items: center;
@@ -705,8 +922,8 @@
          height: 60%;
          >.top_img {
            width: 100%;
            height: 70%;
         width: 0.903704rem;
         height: 0.803704rem;
            display: flex;
            align-items: center;
            justify-content: center;
@@ -899,15 +1116,14 @@
.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;
}
@@ -934,10 +1150,6 @@
  margin-top: 0.2rem;
  border-radius: 0.4rem 0.4rem 0 0;
  padding-top: 0.3rem;
  /deep/.is-selected .tab-name {
    position: relative;
@@ -1036,8 +1248,6 @@
}
@keyframes wordsLoop {
  0% {
@@ -1057,8 +1267,6 @@
  }
}
@-webkit-keyframes wordsLoop {