| | |
| | | <div class="swiper"> |
| | | <div class="swiper-wrapper flex-between"> |
| | | <div class="swiper-slide"> |
| | | <div class="nav_item flex-center" @click="toPage('/aiTrading')"> |
| | | <div class="nav_item flex-start" @click="toPage('/aiTrading')"> |
| | | <img src="../../assets/img/home_1.png" alt="" /> |
| | | <span>AI {{ $t("量化交易") }}</span> |
| | | <span>{{ $t("量化交易") }}</span> |
| | | </div> |
| | | </div> |
| | | <div class="swiper-slide"> |
| | | <div class="nav_item flex-center" @click="toPage('/blockTrading')"> |
| | | <div class="nav_item flex-start" @click="toPage('/blockTrading')"> |
| | | <img src="../../assets/img/home_2.png" alt="" /> |
| | | <span>{{ $t("hj621") }}</span> |
| | | </div> |
| | | </div> |
| | | <div class="swiper-slide"> |
| | | <div class="nav_item flex-center" @click="toPage('/ipo')"> |
| | | <div class="nav_item flex-start" @click="toPage('/ipo')"> |
| | | <img src="../../assets/img/home_3.png" alt="" /> |
| | | <span>IPO</span> |
| | | </div> |
| | | </div> |
| | | <div class="swiper-slide"> |
| | | <div class="nav_item flex-center" @click="toPage('/fund')"> |
| | | <div class="nav_item flex-start" @click="toPage('/fund')"> |
| | | <img src="../../assets/img/home_4.png" alt="" /> |
| | | <span>{{ $t("理财基金") }}</span> |
| | | </div> |
| | | </div> |
| | | <!-- <div class="swiper-slide"> |
| | | <div class="nav_item flex-start" @click="czts"> |
| | | <img src="@/assets/img/充值缴费.png" alt="" /> |
| | | <span>{{ $t("hj172") }}</span> |
| | | </div> |
| | | </div> |
| | | <div class="swiper-slide"> |
| | | <div |
| | | class="nav_item flex-start" |
| | | @click="toPage('/authentications')" |
| | | > |
| | | <img src="@/assets/img/kyc.png" alt="" /> |
| | | <span>KYC</span> |
| | | </div> |
| | | </div> --> |
| | | </div> |
| | | </div> |
| | | </div> |
| | |
| | | :ids="'a' + item.id" |
| | | :dataObj="item" |
| | | ></index-component> |
| | | <!-- <van-skeleton title :row="3" /> --> |
| | | </div> |
| | | </div> |
| | | </div> |
| | |
| | | <div class="subheading bg-white" style="margin-top: 0.25em"> |
| | | <div class="subheading_title"> |
| | | <img src="../../assets/img/iconmonstr-chart-5.png" alt="" /> |
| | | <span>{{ $t("墨西哥指数") }}</span> |
| | | <span>{{ $t("hksi") }}</span> |
| | | </div> |
| | | <div class="flex-between navs"> |
| | | <div class="nav_item" v-for="item in mxDataStockBeans" :key="item.id"> |
| | | <!-- <van-skeleton title :row="3" /> --> |
| | | <div class="nav_item" v-for="item in hkDataStockBeans" :key="item.id"> |
| | | <index-component |
| | | :ids="'b' + item.id" |
| | | :dataObj="item" |
| | | ></index-component> |
| | | </div> |
| | | </div> |
| | | </div> |
| | | |
| | | <div class="subheading bg-white" style="margin-top: 0.25em"> |
| | | <div class="subheading_title"> |
| | | <img src="../../assets/img/iconmonstr-chart-5.png" alt="" /> |
| | | <span>{{ $t("tsi") }}</span> |
| | | </div> |
| | | <div class="flex-between navs"> |
| | | <div class="nav_item" v-for="item in twDataStockBeans" :key="item.id"> |
| | | <index-component |
| | | :ids="'b' + item.id" |
| | | :dataObj="item" |
| | | ></index-component> |
| | | </div> |
| | | </div> |
| | | </div> |
| | | |
| | | <div class="subheading bg-white" style="margin-top: 0.25em"> |
| | | <div class="subheading_title"> |
| | | <img src="../../assets/img/iconmonstr-chart-5.png" alt="" /> |
| | | <span>{{ $t("ni") }}</span> |
| | | </div> |
| | | <div class="flex-between navs"> |
| | | <div class="nav_item" v-for="item in inDataStockBeans" :key="item.id"> |
| | | <index-component |
| | | :ids="'b' + item.id" |
| | | :dataObj="item" |
| | |
| | | </template> |
| | | |
| | | <script> |
| | | import { Toast } from "vant"; |
| | | import tabHead from "../../components/tabHead.vue"; |
| | | import NewsItem from "./components/newsItem.vue"; |
| | | import indexComponent from "../../components/index-component.vue"; |
| | |
| | | lang: "en" |
| | | }, |
| | | { |
| | | text: "简体中文", |
| | | lang: "zh-CN" |
| | | text: "中文(繁体)", |
| | | lang: "zh-Hant" |
| | | }, |
| | | { text: "हिंदी", lang: "hi" } |
| | | // { |
| | | // text: "Deutsch", |
| | | // lang: "de", |
| | | // }, //德语 |
| | | // { |
| | | // text: "Français", |
| | | // lang: "fr", |
| | | // }, //法语 |
| | | // { |
| | | // text: "日本語にほんご", |
| | | // lang: "ja", |
| | | // }, |
| | | { |
| | | text: "हिंदी", |
| | | lang: "hi" |
| | | } |
| | | ], |
| | | newsList: [], |
| | | mxDataStockBeans: [], |
| | | usDataStockBeans: [] |
| | | hkDataStockBeans: [], |
| | | twDataStockBeans: [], |
| | | inDataStockBeans: [], |
| | | usDataStockBeans: [], |
| | | times: null |
| | | }; |
| | | }, |
| | | components: { |
| | |
| | | NewsItem |
| | | }, |
| | | mounted() { |
| | | this.getData(); |
| | | this.init(); |
| | | }, |
| | | beforeDestroy() { |
| | | if (this.times) clearInterval(this.times); |
| | | }, |
| | | methods: { |
| | | // 选择语言 |
| | |
| | | if (typeof type == "string") type = 1; |
| | | // let data = await api.queryNewsList(type); |
| | | }, |
| | | // 初始化 |
| | | init() { |
| | | this.getData(); |
| | | this.times = setInterval(() => { |
| | | this.getData(); |
| | | }, 2000); |
| | | }, |
| | | // 获取首页数据 |
| | | async getData() { |
| | | let data = await api.getHomePageData(); |
| | | this.newsList = data.data.newsList; |
| | | |
| | | this.mxDataStockBeans = data.data.mxDataStockBeans.map(item => { |
| | | item.kData = item.kdata; |
| | | return item; |
| | | }); |
| | | this.usDataStockBeans = data.data.usDataStockBeans.map(item => { |
| | | item.kData = item.kdata; |
| | | return item; |
| | | }); |
| | | if (data.status == 0) { |
| | | this.twDataStockBeans = data.data.twDataStockBeans.map(item => { |
| | | item.kData = item.kdata; |
| | | return item; |
| | | }); |
| | | |
| | | // console.log( |
| | | // "home", |
| | | // this.newsList, |
| | | // this.mxDataStockBeans, |
| | | // this.usDataStockBeans |
| | | // ); |
| | | this.inDataStockBeans = data.data.inDataStockBeans.map(item => { |
| | | item.kData = item.kdata; |
| | | return item; |
| | | }); |
| | | |
| | | this.hkDataStockBeans = data.data.hkDataStockBeans.map(item => { |
| | | item.kData = item.kdata; |
| | | return item; |
| | | }); |
| | | |
| | | this.usDataStockBeans = data.data.usDataStockBeans.map(item => { |
| | | item.kData = item.kdata; |
| | | return item; |
| | | }); |
| | | } |
| | | }, |
| | | // 跳转 |
| | | toPage(url) { |
| | | if (!url) return; |
| | | this.$router.push(url); |
| | | }, |
| | | // 充值提示 |
| | | czts() { |
| | | Toast(this.$t("充值提示")); |
| | | } |
| | | } |
| | | }; |
| | |
| | | span { |
| | | font-size: 0.5em; |
| | | line-height: 0.5em; |
| | | font-weight: 600; |
| | | font-weight: 500; |
| | | } |
| | | } |
| | | |
| | |
| | | padding: 0 0.25em 0 0.25em; |
| | | |
| | | .swiper-slide { |
| | | width: 2.1875em; |
| | | height: 2.1em; |
| | | // padding: 0 0.25em 0 0.25em; |
| | | width: 2.2em; |
| | | height: 2.4em; |
| | | |
| | | .nav_item { |
| | | background-color: #fff; |
| | |
| | | width: 100%; |
| | | height: 100%; |
| | | flex-direction: column; |
| | | padding: 0.45em 0.15em 0; |
| | | |
| | | img { |
| | | width: 0.75em; |
| | | width: 0.6em; |
| | | margin-bottom: 0.25em; |
| | | } |
| | | |
| | | span { |
| | | font-size: 0.25em; |
| | | font-weight: 500; |
| | | font-size: 0.28em; |
| | | font-weight: 700; |
| | | text-align: center; |
| | | } |
| | | } |
| | | } |