From 067883c72b282546402064eb1b78d8618d45b74d Mon Sep 17 00:00:00 2001
From: jhzh <1628036192@qq.com>
Date: Mon, 21 Apr 2025 17:23:10 +0800
Subject: [PATCH] 1
---
src/page/home/home.vue | 1558 +++++++++++++++++++++++++++++++++++++----------------------
1 files changed, 977 insertions(+), 581 deletions(-)
diff --git a/src/page/home/home.vue b/src/page/home/home.vue
index 3211ae9..f496959 100644
--- a/src/page/home/home.vue
+++ b/src/page/home/home.vue
@@ -4,46 +4,66 @@
<div class="top_logo">
<div class="left_logo">
<div class="img_logo">
- <img :src="Logo" alt />
+ <!-- <img :src="Logo" alt /> -->
+ FALCON
</div>
</div>
<div class="right_search">
<div>
- <div class="search_con" @click="handleSearchClick()">
- <img :src="Searchs" alt />
- </div>
- <div class="service_con">
+ <div class="service_con" @click="goOnline()">
<img :src="Service" alt />
</div>
+ <van-popover v-model="showPopover" trigger="click" placement="bottom-end" :actions="actions"
+ @select="onSelect">
+ <template #reference>
+ <div class="iconfont icon-icon_A">
+
+ </div>
+ </template>
+ </van-popover>
+
</div>
</div>
+
</div>
<div class="center_tabs">
<!-- 顶部轮播图 -->
- <div class="banner_top">
- <van-skeleton title :row="1" :loading="loading" />
- <van-swipe class="my-swipe" :autoplay="5000" indicator-color="white" v-if="!loading">
- <van-swipe-item v-for="(item, index) in bannerImgsArr" @click="handleBannerClick(index)" :key="index">
- <img :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>-->
<!-- 公告 -->
- <div class="announcement">
- <div class="an_content">
+ <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 />
</div>
- <div class="an_right_message">
- <span>{{ announcementMess }}</span>
+ <div class="an_right_message ">
+ <!-- <div class="animate">
+ {{ artList.artTitle }}
+ </div> -->
+
</div>
</div>
</div>
+
<!-- 排行入门 -->
<van-skeleton title :row="2" :loading="loading" />
- <div class="navs" v-if="!loading">
+
+ <div class="navs" v-if="!loading && close">
+
<div class="navs_content">
- <div v-for="(item, index) in navsArr" :key="index">
+<!-- <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>
@@ -58,89 +78,142 @@
</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">
- <span>{{ '最多关注' }}</span>
- </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" style="margin-top: 20px;">
- <div class="item_cont" v-for="(item2, idx) in proData[currentIndex]" :key="idx">
- <div class="top_fo">
- <div class="title">
- <span>{{ item2.f14 }}</span>
- </div>
- <div class="numbers">
- <span>{{ item2.f2 }}</span>
- </div>
- <div class="percentage" :class="item2.f3 > 0 ? 'gree' : 'redd'">
- <span>{{ item2.f3 > 0 ? `+${item2.f3}%` : `${item2.f3}%` }}</span>
- </div>
- </div>
- <div class="bottom_fo">
- <div class="title">
- <span>{{ item2.f12 }}</span>
- <img :src="Huo" alt style="margin-left: 0.12rem;" />
- </div>
- <div class="numbers">
- <span>{{ '04:59:57' }}</span>
- </div>
- <div class="percentage">
- <span></span>
- </div>
- </div>
- </div>
- </van-swipe-item>
- </van-swipe>
- </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'">-->
+
+<!-- <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> –>-->
+
+<!-- </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>-->
</div>
<van-skeleton title :row="18" :loading="loading" />
<div class="news-tab">
<mt-navbar v-model="news">
<mt-tab-item id="tab_0">
- <span class="tab-name">新闻</span>
+ <span class="tab-name">{{ $t('hj6') }}</span>
</mt-tab-item>
<mt-tab-item id="tab_1">
- <span class="tab-name">7×24</span>
+ <span class="tab-name">{{ $t('hj7') }}</span>
</mt-tab-item>
<mt-tab-item id="tab_2">
- <span class="tab-name">经济</span>
+ <span class="tab-name">7×24</span>
</mt-tab-item>
</mt-navbar>
<mt-tab-container v-model="news" :swipeable="true" style="padding-top: 0.5rem;">
<mt-tab-container-item id="tab_0">
<div class="news-content">
- <div class="" v-for="(item,inde) in newsContent1" :key="inde" @click="$router.push({path:'/newPage',query:{
- listid:item.id
- }})">
- <div class="item-times">{{item.addTime | gettime}}</div>
+ <div class="" v-for="(item, inde) in newsContent1" :key="inde" @click="$router.push({
+ path: '/newPage', query: {
+ listid: item.id
+ }
+ })">
+ <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}}
+ {{ item.title }}
</div>
- <div class="block-out">
- <div class="blocks">{{item.sourceName}}</div>
- </div>
- <div class="neitu"><img :src="item.imgurl" /></div>
+ <!-- <div class="block-out">
+ <div class="blocks">{{ item.sourceName }}</div>
+ </div> -->
+ <div class="neitu"><img :src="'data:image/png;base64,'+item.imgurl" /></div>
</div>
</div>
</mt-tab-container-item>
<mt-tab-container-item id="tab_1">
<div class="news-content">
- <div class="item-out" v-for="(item,inde) in newsContent4" :key="inde" @click="$router.push('/newPage')">
- <div class="item-times">{{item.addTime | gettime}}</div>
- <div class="titContent" style="-webkit-box-orient: vertical;">{{item.title}}</div>
+ <div class="item-out" v-for="(item, inde) in newsContent4" :key="inde" @click="$router.push({
+ path: '/newPage', query: {
+ listid: item.id
+ }
+ })">
+ <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-item id="tab_2">
<div class="news-content">
- <div class="item-out" v-for="(item,inde) in newsContent2" :key="inde">
- <div class="item-times">{{item.addTime | gettime}}</div>
- <div class="titContent" style="-webkit-box-orient: vertical;">{{item.title}}</div>
+ <div class="item-out" v-for="(item, inde) in newsContent2" :key="inde" @click="$router.push({
+ path: '/newPage', query: {
+ listid: item.id
+ }
+ })">
+ <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>
@@ -148,578 +221,901 @@
</div>
</div>
<!-- tab -->
-
- <GoToLogin />
- <!-- <foot></foot> -->
+ <GoToLogin v-show="isGoTo" />
</div>
</template>
-
<script>
- import foot from "@/components/foot/foot";
- import AllList from "@/page/list/list-all";
- import HomeList from "./components/home-list";
- import {
- Toast
- } from "mint-ui";
- import * as api from "@/axios/api";
- import Logo from "@/assets/img/logo.png";
- import Searchs from "@/assets/img/search.png";
- import Service from "@/assets/img/service.png";
- import Announcement from "@/assets/img/announcement.png";
- import Tops from "@/assets/img/tops.png";
- import Rumen from "@/assets/img/rumen.png";
- import Xuexi from "@/assets/img/xuexi.png";
- import Guanyu from "@/assets/img/guanyu.png";
- import Huo from "@/assets/img/huo.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 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/home/6.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 indexData from "./data.json";
+import GoToLogin from '@/page/home/components/GoLogin.vue'
+import { MessageBox } from 'mint-ui'
+export default {
+ components: {
+ HomeList,
+ AllList,
+ GoToLogin,
+ Echart
+ },
+ props: {},
+ data () {
+ return {
+ Logo,
+ Searchs,
+ Service,
+ clear,
+ Announcement,
+ indexData: [],
+ Huo,
+ is_login: false,
+ loading: true,
+ close: true,
+ proData: [], // 分割好的数据
+ currentIndex: 0,
+ bannerImgsArr: [{
+ img: banner1
+ }, {
+ img: banner2
+ }, {
+ img: banner3
+ }],
+ announcementMess: '20202/10 - 交易时间安排',
- export default {
- components: {
- foot,
- HomeList,
- AllList,
- GoToLogin,
- },
- props: {},
- data() {
- return {
- Logo,
- Searchs,
- Service,
- Announcement,
- indexData,
- Huo,
- is_login: false,
- loading: true,
- proData: [], // 分割好的数据
- currentIndex: 0,
- bannerImgsArr: [{
- img: banner1
- }, {
- img: banner2
- }, {
- img: banner3
- }],
- announcementMess: "20202/10 - 交易时间安排",
- navsArr: [{
- img: Tops,
- title: "涨跌排行"
- },
- {
- img: Rumen,
- title: "快速入门"
- },
- {
- img: Xuexi,
- title: "进阶学习"
- },
- {
- img: Guanyu,
- title: "关于 Mitrade"
- }
- ],
- news: "tab_0",
- newsContent1: [],
- newsContent2: [],
- newsContent3: [],
- newsContent4: [],
- };
- },
- methods: {
- async getNewsList(type) {
- let data = await api.queryNewsList(type);
- console.log('xinwen:', data)
- switch (type) {
- case 1:
- this.newsContent1 = data.data.list
- break;
- case 2:
- this.newsContent2 = data.data.list
- break;
- case 3:
- this.newsContent3 = data.data.list
- break;
- case 4:
- this.newsContent4 = data.data.list
- break;
- case 5:
- this.newsContent5 = data.data.list
- break;
- }
- },
- handleBannerClick(ind) {
- console.log(ind);
- },
- 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;
- this.proData[index].forEach(item => {
- console.log(item.f14);
- });
- },
- handleSearchClick() {
- this.loading = !this.loading;
- }
- },
- filters: {
- gettime(time) {
- if (!time) {
- 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();
- if (mm < 10) {
- mm = "0" + mm;
- }
- if (d < 10) {
- d = "0" + d;
- }
- if (h < 10) {
- h = "0" + h;
- }
- if (m < 10) {
- m = "0" + m;
- }
- if (c < 10) {
- c = "0" + c;
- }
- //17:35:2922-06-2022
- return y + "-" + mm + "-" + d + " " + h + ":" + m + ":" + c;
- }
- },
- created() {
- this.ProcessData();
- },
- mounted() {
- this.getNewsList(1);
- this.getNewsList(2);
- this.getNewsList(4);
- setTimeout(() => {
- this.loading = false
- }, 1000)
+ artList: [],
+ news: 'tab_0',
+ newsContent1: [],
+ newsContent2: [],
+ newsContent3: [],
+ newsContent4: [],
+ onlineService: '',
+ isGoTo: false,
+ bannerList: [],
+ userInfo: [],
+ showPopover: false,
+ 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: Rumen,
+ title: this.$t('hj2')
+ },
+ {
+ img: Xuexi,
+ title: this.$t('hj3')
+ },
+ {
+ img: Guanyu,
+ title: this.$t('hj4')
+ },
+ {
+ img: dazong,
+ title: this.$t('hj261')
+ },
+ // {
+ // img: vip,
+ // title: this.$t('subdk')
+ // },
+ {
+ img: Tops,
+ title: this.$t('申購記錄')
+ },
+ // {
+ // img: vip,
+ // title: this.$t('hj279')
+ // }
+ ]
+ }
+ },
+ methods: {
+ 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(() => {
+
+ // });
+ },
+ onSelect (e) {
+ this.$i18n.locale = e.lang
+ window.localStorage.setItem('language', e.lang)
+ },
+ async getUserInfo () {
+ // 获取用户信息
+ let data = await api.getUserInfo()
+ if (data.status === 0) {
+ // 判断是否登录
+ this.$store.state.userInfo = data.data
+ this.userInfo = data.data
+ } else {
+ }
+ },
+ 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
+ } else if (num >= 3) {
+ return 200
+ }
+ },
+ goDetail (item) {
+ if (this.userInfo.length === 0) {
+ this.$store.commit('dialogVisible', true)
+ return
+ }
+ this.$router.push({
+ 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'
+ }
+ })
+ },
+ 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
+ // }
+ switch (index) {
+ case 0:
+ this.$router.push('/warehouse')
+ break
+ case 1:
+ this.$router.push('/favorites')
+ break
+ case 2:
+ 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 4:
+ // this.$router.push('/Subscription?idx=1')
+ this.$router.push( '/favoritesList')
+ break
+ case 5:
+ this.$router.push('/SubDK')
+ break
+ default:
+ break
+ }
+ if (navigator.vibrate) {
+ // 支持
+ navigator.vibrate([55])
+ }
+ },
+ async getBanner () {
+ // 获取显示的banner
+ let result = await api.getBannerByPlat({ platType: 'm' })
+ if (result.status === 0) {
+ this.bannerList = result.data
+ } else {
+ this.$store.commit('elAlertShow', { 'elAlertShow': true, 'elAlertText': result.msg })
+ }
+ },
+ goOnline () {
+ this.$router.push('/service')
+ },
+ async getArtList () {
+ let data = await api.getArtList()
+ if (data.status === 0) {
+ this.artList = data.data.list[0]
+ }
+ },
+ 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 })
+ }
+ },
+ 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))
+ }
+ },
+ async getNewsList (type) {
+ let data = await api.queryNewsList(type)
+
+ switch (type) {
+ case 1:
+ this.newsContent1 = data.data.list
+ break
+ case 2:
+ this.newsContent2 = data.data.list
+ break
+ case 3:
+ this.newsContent3 = data.data.list
+ break
+ case 4:
+ this.newsContent4 = data.data.list
+ break
+ case 5:
+ this.newsContent5 = data.data.list
+ break
+ }
+ },
+ handleBannerClick (ind) {
+ // console.log(ind);
+ },
+ 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
+ this.proData[index].forEach(item => {
+
+ })
+ },
+ handleSearchClick () {
+ // this.loading = !this.loading;
+ this.$router.push({ path: '/trading-list', query: { type: 1 } })
+ }
+ },
+ filters: {
+ gettime (time) {
+ if (!time) {
+ 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()
+ if (mm < 10) {
+ mm = '0' + mm
+ }
+ if (d < 10) {
+ d = '0' + d
+ }
+ if (h < 10) {
+ h = '0' + h
+ }
+ if (m < 10) {
+ m = '0' + m
+ }
+ if (c < 10) {
+ c = '0' + c
+ }
+ // 17:35:2922-06-2022
+ return y + '-' + mm + '-' + d + ' ' + h + ':' + m + ':' + c
+ }
+ },
+ created () {
+ // this.getdialog()
+ this.ProcessData()
+ },
+ 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
+ } else {
+ this.isGoTo = !this.isGoTo
+ }
+ }, 10000)
+
+ setTimeout(() => {
+ this.loading = false
+ }, 2000)
+ }
+}
</script>
<style lang="less" scoped>
- .wrapper {
+.wrapper {
+ width: 100%;
+ height: 100%;
+
+ padding-top: .3128rem;
+
+ .page_content {
width: 100%;
height: 100%;
- background: rgb(33, 33, 43);
- // background: #010101;
- // overflow: hidden;
- padding-top: .3128rem;
+ }
+}
- .page_content {
+.top_logo {
+ width: 100%;
+ height: 0.7949rem;
+ display: flex;
+ padding-right: 0.3rem;
+ >div {
+ width: 50%;
+ height: 100%;
+ display: flex;
+ align-items: center;
+ }
+
+ .img_logo {
+ font-size: 20px;
+ font-family: AlibabaSansVietBold;
+ font-weight: 600;
+ color: #333333;
+ margin-left: 0.3846rem;
+
+ >img {
width: 100%;
height: 100%;
}
}
- .top_logo {
- width: 100%;
- height: 0.7949rem;
- display: flex;
-
+ .right_search {
+ justify-content: flex-end;
+ width: 50%;
>div {
- width: 50%;
- height: 100%;
+ width: 34%;
+ height: 0.4615rem;
display: flex;
- align-items: center;
- }
-
- .img_logo {
- width: 3.3077rem;
- height: 0.6154rem;
- margin-left: 0.3846rem;
-
- >img {
- width: 100%;
- height: 100%;
- }
- }
-
- .right_search {
- justify-content: flex-end;
+ justify-content: space-between;
>div {
- width: 1.2821rem;
- height: 0.4615rem;
+ width: 0.5615rem;
+ height: 0.5615rem;
+
+ >img {
+ width: 100%;
+ height: 100%;
+ }
+ }
+ }
+ }
+}
+
+.center_tabs {
+ width: 100%;
+ height: auto;
+ margin-top: 0.2308rem;
+
+ >.banner_top {
+ width: 100%;
+
+ img {
+ width: 100%;
+ height: 100%;
+ }
+
+ .van-swipe-item {
+ height: 3.0615rem;
+ padding: 0 0.264rem;
+ border-radius: 0.3rem;
+ }
+
+ .van-swipe-item img {
+ border-radius: 0.3rem;
+ }
+ }
+
+ >.announcement {
+ width: 100%;
+ height: auto;
+ display: flex;
+ justify-content: center;
+ align-items: center;
+ padding: 0.2rem 0 0.2rem 0;
+
+ >.an_content {
+ width: 95%;
+ height: 0.559rem;
+ display: flex;
+ justify-content: space-between;
+ align-items: center;
+
+ .an_left_icon {
+ width: 4%;
+ height: 70%;
+ display: flex;
+ align-items: center;
+
+ >img {
+ width: 100%;
+ height: 100%;
+ }
+ }
+
+ .an_right_message {
+ width: 93%;
+ height: 100%;
+ line-height: 0.559rem;
+ align-items: center;
+ align-content: center;
+ font-size: 0.29rem;
+ white-space: nowrap;
+ overflow: hidden;
+ // text-overflow:ellipsis;
+ }
+ }
+ }
+
+ .navs {
+ width: 100%;
+ height: 2.6154rem;
+
+ display: flex;
+ justify-content: center;
+
+ >.navs_content {
+ position: relative;
+ overflow: hidden;
+ width: 95%;
+ height: 100%;
+ margin: 0 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;
- margin-right: 0.4615rem;
+ align-items: center;
+ position: absolute;
+ right: -0.4rem;
+ top: -0.4rem;
>div {
- width: 0.4615rem;
- height: 0.4615rem;
+ width: 0.3554rem;
+ height: 0.3554rem;
+ margin-top: 0.3rem;
+ margin-left: 0.15rem;
>img {
width: 100%;
height: 100%;
}
}
+
}
- }
- }
-
- .center_tabs {
- width: 100%;
- height: 14.2308rem;
- margin-top: 0.2308rem;
-
- >.banner_top {
- width: 100%;
-
- img {
- width: 100%;
- height: 100%;
- }
-
- .van-swipe-item {
- height: 3.4615rem;
- padding: 0 0.264rem;
- }
- }
-
- >.announcement {
- width: 100%;
- height: 0.9487rem;
- display: flex;
- justify-content: center;
- align-items: center;
-
- >.an_content {
- width: 95%;
- height: 0.559rem;
- display: flex;
- justify-content: space-between;
-
- .an_left_icon {
- width: 5%;
- height: 100%;
- display: flex;
- align-items: center;
-
- >img {
- width: 80%;
- height: 80%;
- }
- }
-
- .an_right_message {
- width: 93%;
- height: 100%;
- display: flex;
- align-items: center;
- }
- }
- }
-
- .navs {
- width: 100%;
- height: 2.6154rem;
- display: flex;
- justify-content: center;
-
- >.navs_content {
- width: 95%;
- height: 100%;
- background: #272733;
- border-radius: 0.2564rem;
- display: flex;
-
- >div {
- width: 25%;
- height: 100%;
- display: flex;
- align-items: center;
-
- >div {
- width: 100%;
- height: 60%;
-
- >.top_img {
- width: 100%;
- height: 70%;
- 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;
- }
- }
- }
- }
- }
-
- .focus_on {
- width: 100%;
- height: 6.9231rem;
- margin-top: 0.2564rem;
- display: flex;
- align-items: center;
- justify-content: center;
-
- .fo_content {
- width: 95%;
- height: 100%;
- background: #272733;
- padding: 0 0.2564rem;
- border-radius: 0.2564rem;
-
- .top_title {
- width: 100%;
- height: 1.0821rem;
- display: flex;
- font-size: 0.3846rem;
- align-items: center;
- }
- }
-
- .fo_banner {
- width: 100%;
- height: calc(100% - 1.0821rem - 0.2564rem);
- }
- }
-
- .item_cont {
- width: 100%;
- height: 1.5385rem;
- border-bottom: 1px solid #ccc;
- position: relative;
- border: none;
>div {
- width: 100%;
- height: 50%;
- }
-
- .top_fo,
- .bottom_fo {
+ width: 16%;
+ height: 100%;
display: flex;
- justify-content: space-between;
+ align-items: center;
- span {
- display: inline-block;
+ >div {
+ width: 100%;
+ height: 60%;
+
+ >.top_img {
+ width: 100%;
+ height: 70%;
+ 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;
+ }
}
-
- .title {
- width: 50%;
- height: 100%;
- display: flex;
- align-items: center;
- }
-
- .numbers {
- width: 20%;
- height: 100%;
- display: flex;
- align-items: center;
- }
-
- .percentage {
- width: 20%;
- height: 100%;
- display: flex;
- align-items: center;
- }
- }
-
- .top_fo {
- font-size: 0.3846rem !important;
- }
-
- .bottom_fo {
- font-size: 0.1846rem;
- color: #999898;
- }
-
- .percentage.gree {
- color: green;
- }
-
- .percentage.redd {
- color: red;
}
}
}
- .item_cont::after {
- content: "";
- position: absolute;
- bottom: 0;
- background: rgb(59, 59, 59);
+ .focus_on {
width: 100%;
- height: 1px;
- -webkit-transform: scaleY(0.5);
- transform: scaleY(0.5);
- -webkit-transform-origin: 0 0;
- transform-origin: 0 0;
- }
+ height: 6.4231rem;
+ margin-top: 0.2564rem;
+ display: flex;
+ align-items: center;
+ justify-content: center;
- .my-swipe .van-swipe-item {
- color: #fff;
- font-size: 0.5128rem;
- line-height: 3.8462rem;
- text-align: center;
- overflow: hidden;
- }
+ .fo_content {
+ width: 95%;
+ height: 100%;
+ padding: 0 0.2564rem;
+ border-radius: 0.2564rem;
+ padding-top: 0.2rem;
- .fo_my-swipe .van-swipe-item {
- color: #fff;
- font-size: 0.5128rem;
- line-height: 3.8462rem;
- overflow: hidden;
- }
-
- .fo_my-swipe {
- width: 100%;
- height: 100%;
- }
-
- .focus_skeleton {
- margin-top: 1rem;
- }
-
- .van-skeleton__row,
- .van-skeleton__title {
- height: .7rem;
- }
-
- .news-tab {
- width: 95%;
- position: relative;
- left: 0;
- right: 0;
- margin: auto;
- margin-top: 0.2rem;
- background: #272733;
- border-radius: 0.4rem 0.4rem 0 0;
- padding-top: 0.3rem;
-
- /deep/.mint-navbar {
- background: #272733;
+ .top_title {
+ width: 100%;
+ height: 0.8821rem;
+ display: flex;
+ font-size: 0.4rem;
+ font-weight: 800;
+ align-items: center;
+ }
}
- /deep/.mint-tab-container {}
-
- /deep/.mint-tab-item {
- background: #272733;
+ /deep/.van-swipe__indicators {
+ bottom: 0.1rem;
}
- /deep/.mint-tab-item-label {
- color: #fff;
- font-size: .26rem;
-
+ /deep/.van-swipe__indicator {
+ background-color: #2d8cf0 !important;
+ opacity: 1;
}
- /deep/.is-selected .tab-name {
- position: relative;
+ /deep/.van-swipe__indicator--active {
+ width: 0.35rem !important;
+ border-radius: 0.23rem;
+ background-color: #aec7ec !important;
}
- /deep/.mint-navbar .mint-tab-item.is-selected {
- border-bottom: none;
- }
-
- /deep/.is-selected .tab-name:after {
- position: absolute;
- display: block;
- content: '';
- height: .07rem;
- background-color: #1381A4;
+ .fo_banner {
width: 100%;
- left: 0;
- bottom: -.25rem;
+ height: calc(100% - .8821rem - 0.3rem);
}
}
- .news-content {
+ .item_cont {
+ width: 100%;
+ height: 1.5385rem;
+ border-bottom: 0.5px solid #ececec;
position: relative;
- padding: 0.3rem;
+ border: none;
+ display: flex;
+ flex-wrap: wrap;
+ align-content: center;
+
+ >div {
+ width: 100%;
+ height: 30%;
+ }
+
+ .top_fo,
+ .bottom_fo {
+ display: flex;
+ justify-content: space-between;
+
+ span {
+ display: inline-block;
+ }
+
+ .title {
+ width: 30%;
+ height: 100%;
+ display: flex;
+ align-items: center;
+ font-weight: 500;
+
+ }
+
+ .aikesi {
+ width: auto;
+ height: 0.3rem;
+ background: #dbe3f0;
+ color: #546daf;
+ padding-left: 0.2rem;
+ padding-right: 0.2rem;
+ font-size: 0.15rem;
+ line-height: 0.3rem;
+ margin-right: 0.1rem;
+ }
+
+ .numberid {
+ font-size: 0.28rem;
+ display: flex;
+
+ line-height: 0.5rem;
+ }
+
+ .numbers {
+ width: 20%;
+ height: 100%;
+ display: flex;
+ align-items: center;
+
+ }
+
+ .point {
+ font-size: 0.28rem;
+ height: 0.5rem;
+ line-height: 0.5rem;
+ }
+
+ .percentage {
+ width: 20%;
+ height: 100%;
+ display: flex;
+ align-items: center;
+ text-align: center;
+ justify-content: center;
+ }
+
+ .percentage span {
+ height: 0.5rem;
+ line-height: 0.5rem;
+ }
+ }
+
+ .top_fo {
+ font-size: 0.3846rem !important;
+ }
+
+ .bottom_fo {
+ margin-top: 0.1rem;
+ font-size: 0.1846rem;
+ color: #999898;
+ }
+
+ .percentage.gree {
+ color: green !important;
+ }
+
+ .percentage.redd {
+ color: red !important;
+ }
+ }
+}
+
+.item_conts::after {
+ content: "";
+ position: absolute;
+ bottom: 0;
+ background: #ececec;
+ width: 100%;
+ height: 1px;
+ -webkit-transform: scaleY(0.5);
+ transform: scaleY(0.5);
+ -webkit-transform-origin: 0 0;
+ transform-origin: 0 0;
+}
+
+.my-swipe .van-swipe-item {
+
+ font-size: 0.5128rem;
+ line-height: 3.8462rem;
+ text-align: center;
+ overflow: hidden;
+}
+
+.fo_my-swipe .van-swipe-item {
+
+ font-size: 0.5128rem;
+ line-height: 3.8462rem;
+ overflow: hidden;
+}
+
+.fo_my-swipe {
+ width: 100%;
+ height: 100%;
+}
+
+.focus_skeleton {
+ margin-top: 1rem;
+}
+
+.van-skeleton__row,
+.van-skeleton__title {
+ height: .7rem;
+}
+
+.news-tab {
+ width: 95%;
+ position: relative;
+ left: 0;
+ right: 0;
+ margin: auto;
+ margin-top: 0.2rem;
+ border-radius: 0.4rem 0.4rem 0 0;
+ padding-top: 0.3rem;
+
+ /deep/.is-selected .tab-name {
+ position: relative;
}
- .item-out {
- position: relative;
- border-left: 0.01rem solid rgba(192, 192, 192, 0.1);
- padding: 0 0.25rem 1rem 0.25rem;
+ /deep/.mint-navbar .mint-tab-item.is-selected {
+ border: 0 !important;
+ border-bottom: none;
}
- .item-out::before {
- content: "●";
+ /deep/.is-selected .tab-name:after {
position: absolute;
- top: -0.1rem;
- left: -0.108rem;
- margin: auto;
- }
-
- .item-times {
- color: #999;
- margin-bottom: 0.15rem;
- }
-
- .titContent {
- position: relative;
+ display: block;
+ content: '';
+ height: .07rem;
+ background-color: #1381A4;
width: 100%;
- color: #fff;
- font-size: .35rem;
- line-height: .46rem;
- overflow: hidden;
- text-overflow: ellipsis;
- -webkit-line-clamp: 2;
- display: -webkit-box;
+ left: 0;
+ bottom: -.25rem;
+ }
+}
+
+.news-content {
+ position: relative;
+ padding: 0.3rem;
+}
+
+.item-out {
+ position: relative;
+ border-left: 0.01rem solid rgba(192, 192, 192, 0.8);
+ padding: 0 0.25rem 1rem 0.25rem;
+}
+
+.item-out::before {
+ content: "●";
+ position: absolute;
+ top: -0.1rem;
+ left: -0.128rem;
+ margin: auto;
+}
+
+.item-times {
+ color: #999;
+ margin-bottom: 0.15rem;
+}
+
+.titContent {
+ position: relative;
+ width: 100%;
+ font-size: .35rem;
+ line-height: .46rem;
+ overflow: hidden;
+ text-overflow: ellipsis;
+ -webkit-line-clamp: 2;
+ display: -webkit-box;
+}
+
+.neitu {
+ width: 100%;
+ border-radius: 0.05rem;
+ margin-top: 0.3rem;
+ margin-bottom: 0.8rem;
+}
+
+.neitu img {
+ width: 100%;
+ border-radius: 0.05rem;
+}
+
+.block-out {
+ margin-top: 0.2rem;
+}
+
+.blocks {
+ width: auto;
+ font-size: 0.32rem;
+ padding: 0.08rem 0.15rem 0.08rem 0.15rem;
+ display: inline-block;
+ 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%);
+
}
- .neitu {
- width: 100%;
- border-radius: 0.05rem;
- margin-top: 0.3rem;
- margin-bottom: 0.8rem;
+ 100% {
+
+ transform: translateX(-100%);
+
+ -webkit-transform: translateX(-100%);
+
}
- .neitu img {
- width: 100%;
- border-radius: 0.05rem;
+}
+
+@-webkit-keyframes wordsLoop {
+
+ 0% {
+
+ transform: translateX(100%);
+
+ -webkit-transform: translateX(100%);
+
}
- .block-out {
- margin-top: 0.2rem;
+ 100% {
+
+ transform: translateX(-100%);
+
+ -webkit-transform: translateX(-100%);
+
}
- .blocks {
- width: auto;
- font-size: 0.32rem;
- padding: 0.08rem 0.15rem 0.08rem 0.15rem;
- display: inline-block;
- border: 0.0513rem solid #41AC75;
- color: #41AC75;
- }
+}
+
</style>
--
Gitblit v1.9.3