17 files modified
23 files added
1 files deleted
| | |
|---|
| | | '/': { |
|---|
| | | // target: 'https://pc.zsycyy.com', |
|---|
| | | // target: 'http://www.shehua56.com', |
|---|
| | | target:'http://192.168.10.12:8091/', |
|---|
| | | target:'http://156.226.16.4:8091/', |
|---|
| | | secure: false, |
|---|
| | | changeOrigin: true, |
|---|
| | | pathRewrite: { |
|---|
| | |
|---|
| | | <title>首页</title> |
|---|
| | | <link rel="shortcut icon" href=./favicon.ico type=image/x-icon> |
|---|
| | | <link href="static/css/public1.css" rel="stylesheet"> |
|---|
| | | <script type="text/javascript"> |
|---|
| | | // 设置跟元素字体 |
|---|
| | | document.documentElement.style.fontSize = document.documentElement.clientWidth / 7.5 + 'px' |
|---|
| | | // var styleName = window.localStorage.getItem('styleName') |
|---|
| | | // if(styleName == 'black'){ |
|---|
| | | // document.getElementsByTagName('body')[0].className = 'black-bg' |
|---|
| | | // }else{ |
|---|
| | | // document.getElementsByTagName('body')[0].className = 'red-bg' |
|---|
| | | // } |
|---|
| | | //步骤一:创建异步对象 |
|---|
| | | var ajax = new XMLHttpRequest() |
|---|
| | | //步骤二:设置请求的url参数,参数一是请求的类型,参数二是请求的url,可以带参数,动态的传递参数starName到服务端 |
|---|
| | | ajax.open('get', 'http://192.168.10.12:8091/api/site/getInfo.do') |
|---|
| | | //步骤三:发送请求 |
|---|
| | | ajax.send() |
|---|
| | | //步骤四:注册事件 onreadystatechange 状态改变就会调用 |
|---|
| | | ajax.onreadystatechange = function () { |
|---|
| | | if (ajax.readyState == 4 && ajax.status == 200) { |
|---|
| | | //步骤五 如果能够进到这个判断 说明 数据 完美的回来了,并且请求的页面是存在的 |
|---|
| | | // console.log(JSON.parse(ajax.responseText).data);//输入相应的内容 |
|---|
| | | var styleName = JSON.parse(ajax.responseText).data.siteColor |
|---|
| | | // var styleName = window.localStorage.getItem('styleName') |
|---|
| | | if (styleName == 'black') { |
|---|
| | | window.localStorage.setItem('styleName', 'black') |
|---|
| | | document.getElementsByTagName('body')[0].className = 'black-bg' |
|---|
| | | } else if (styleName == 'yellow') { |
|---|
| | | window.localStorage.setItem('styleName', 'red') |
|---|
| | | document.getElementsByTagName('body')[0].className = 'yellow-bg' |
|---|
| | | } else { |
|---|
| | | window.localStorage.setItem('styleName', 'red') |
|---|
| | | document.getElementsByTagName('body')[0].className = 'red-bg' |
|---|
| | | } |
|---|
| | | } |
|---|
| | | } |
|---|
| | | </script> |
|---|
| | | |
|---|
| | | <script> |
|---|
| | | // // 禁用缩放 |
|---|
| | | // function addMeta() { |
|---|
| | | // $('head').append('<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />'); |
|---|
| | | // } |
|---|
| | | // setTimeout(addMeta, 3000); |
|---|
| | | // 禁用缩放 |
|---|
| | | function addMeta() { |
|---|
| | | $('head').append('<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />'); |
|---|
| | | } |
|---|
| | | setTimeout(addMeta, 3000); |
|---|
| | | |
|---|
| | | // // 禁用双指放大 |
|---|
| | | // document.documentElement.addEventListener('touchstart', function (event) { |
|---|
| | | // if (event.touches.length > 1) { |
|---|
| | | // event.preventDefault(); |
|---|
| | | // } |
|---|
| | | // }, { |
|---|
| | | // passive: false |
|---|
| | | // }); |
|---|
| | | // 禁用双指放大 |
|---|
| | | document.documentElement.addEventListener('touchstart', function (event) { |
|---|
| | | if (event.touches.length > 1) { |
|---|
| | | event.preventDefault(); |
|---|
| | | } |
|---|
| | | }, { |
|---|
| | | passive: false |
|---|
| | | }); |
|---|
| | | |
|---|
| | | // // 禁用双击放大 |
|---|
| | | // var lastTouchEnd = 0; |
|---|
| | | // document.documentElement.addEventListener('touchend', function (event) { |
|---|
| | | // var now = Date.now(); |
|---|
| | | // if (now - lastTouchEnd <= 300) { |
|---|
| | | // event.preventDefault(); |
|---|
| | | // } |
|---|
| | | // lastTouchEnd = now; |
|---|
| | | // }, { |
|---|
| | | // passive: false |
|---|
| | | // }); |
|---|
| | | // 禁用双击放大 |
|---|
| | | var lastTouchEnd = 0; |
|---|
| | | document.documentElement.addEventListener('touchend', function (event) { |
|---|
| | | var now = Date.now(); |
|---|
| | | if (now - lastTouchEnd <= 300) { |
|---|
| | | event.preventDefault(); |
|---|
| | | } |
|---|
| | | lastTouchEnd = now; |
|---|
| | | }, { |
|---|
| | | passive: false |
|---|
| | | }); |
|---|
| | | </script> |
|---|
| | | </head> |
|---|
| | | <body style="height: 100%; position: absolute; width: 100%;"> |
|---|
| | |
|---|
| | | <template> |
|---|
| | | <div id="app" :class="`${$state.theme === 'red' ? 'red-theme' : 'black-theme'}`"> |
|---|
| | | <div :class="`header-box`" v-if="hasHeader && title !== '新登录'"> |
|---|
| | | <div :class="`header-box`" v-if="hasHeader && title !== '用户登录'"> |
|---|
| | | <mt-header :title="title"> |
|---|
| | | <mt-button icon="back" slot="left" @click="$router.go(-1)"></mt-button> |
|---|
| | | <template v-if="iconRight == 'search'"> |
|---|
| | | |
|---|
| | | <div v-if="!is_Show"> |
|---|
| | | <template v-if="iconRight == 'search'"> |
|---|
| | | <img slot="right" class="search-right" src="./assets/ico/fangdajing.png" alt /> |
|---|
| | | </template> |
|---|
| | | <template v-else> |
|---|
| | | <mt-button icon="more" slot="right"></mt-button> |
|---|
| | | </template> |
|---|
| | | </div> |
|---|
| | | |
|---|
| | | </mt-header> |
|---|
| | | </div> |
|---|
| | | <div class="body-box"> |
|---|
| | |
|---|
| | | <router-view></router-view> |
|---|
| | | </transition> |
|---|
| | | </div> |
|---|
| | | <foot></foot> |
|---|
| | | <foot v-if="$store.state.select!='/login'&&$store.state.select!='/register'"></foot> |
|---|
| | | </div> |
|---|
| | | </template> |
|---|
| | | |
|---|
| | |
|---|
| | | }, |
|---|
| | | name: "App", |
|---|
| | | created() { |
|---|
| | | this.$state.theme="red"; |
|---|
| | | console.log(this.$state.theme,"asdasdasd") |
|---|
| | | let title = this.$route.meta.title || "首页"; |
|---|
| | | this.title = title; |
|---|
| | | |
|---|
| | | if(this.$route.meta.is_Show){ |
|---|
| | | this.is_Show = this.$route.meta.is_Show; |
|---|
| | | }else{ |
|---|
| | | this.is_Show = true; |
|---|
| | | } |
|---|
| | | if (this.$route.meta.hasHeader) { |
|---|
| | | this.hasHeader = true; |
|---|
| | | } else { |
|---|
| | |
|---|
| | | }, |
|---|
| | | watch: { |
|---|
| | | $route(to, from) { |
|---|
| | | |
|---|
| | | let title = to.meta.title || "首页"; |
|---|
| | | this.title = title; |
|---|
| | | if (to.meta.iconRight) { |
|---|
| | |
|---|
| | | } else { |
|---|
| | | this.hasHeader = false; |
|---|
| | | } |
|---|
| | | |
|---|
| | | if (to.meta.index > from.meta.index) { |
|---|
| | | console.log("slide-left"); |
|---|
| | | //设置动画名称 |
|---|
| | |
|---|
| | | title: "首页", |
|---|
| | | hasHeader: false, |
|---|
| | | iconRight: "default", |
|---|
| | | transitionName: '' |
|---|
| | | transitionName: '', |
|---|
| | | is_Show:true, |
|---|
| | | is_foot:true, |
|---|
| | | }; |
|---|
| | | } |
|---|
| | | }; |
|---|
| | |
|---|
| | | font-family: "rubik"; |
|---|
| | | .header-box { |
|---|
| | | width: 100%; |
|---|
| | | height: 1rem; |
|---|
| | | height: 1.4rem; |
|---|
| | | /deep/.mint-header { |
|---|
| | | height: 100%; |
|---|
| | | background-color: #16171d; |
|---|
| | |
|---|
| | | } |
|---|
| | | .body-box { |
|---|
| | | width: 100%; |
|---|
| | | height: calc(100% - 1rem); |
|---|
| | | height: 100%; |
|---|
| | | // height: calc(100% - 1rem); |
|---|
| | | box-sizing: border-box; |
|---|
| | | overflow-y: auto; |
|---|
| | | } |
|---|
| | | &.red-theme { |
|---|
| | | background: #e9e9e9; |
|---|
| | | background: rgb(241,242,246); |
|---|
| | | color:#000; |
|---|
| | | /deep/.mint-header { |
|---|
| | | background: none; |
|---|
| | | .mint-header-title { |
|---|
| | | font-size: 0.36rem; |
|---|
| | | font-size: 0.42rem; |
|---|
| | | color: #212121; |
|---|
| | | } |
|---|
| | | .mintui { |
|---|
| | | color: #212121; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | /deep/.van-swipe-item { |
|---|
| | | color: #000; |
|---|
| | | } |
|---|
| | | /deep/.navs_content { |
|---|
| | | background: #fff!important; |
|---|
| | | } |
|---|
| | | /deep/.fo_content { |
|---|
| | | background: #fff; |
|---|
| | | } |
|---|
| | | /deep/.news-tab{ |
|---|
| | | background: #fff; |
|---|
| | | } |
|---|
| | | /deep/.mint-tab-item-label { |
|---|
| | | color: #000; |
|---|
| | | font-size: .26rem; |
|---|
| | | |
|---|
| | | } |
|---|
| | | /deep/.top_title{ |
|---|
| | | color: #000; |
|---|
| | | } |
|---|
| | | /deep/.titContent{ |
|---|
| | | color:#000; |
|---|
| | | } |
|---|
| | | /deep/.mint-navbar { |
|---|
| | | background: #fff; |
|---|
| | | } |
|---|
| | | /deep/.mint-tab-item { |
|---|
| | | background: #fff; |
|---|
| | | border: none; |
|---|
| | | } |
|---|
| | | /deep/.footCss{ |
|---|
| | | background: #fff; |
|---|
| | | } |
|---|
| | | /deep/.newDetail-tits{ |
|---|
| | | color: #aaa; |
|---|
| | | } |
|---|
| | | /deep/.van-skeleton__row, .van-skeleton__title{ |
|---|
| | | background-color: #fff!important; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | &.black-theme { |
|---|
| | | // background: #16171d; |
|---|
| | | // background: rgb(14, 14, 15); |
|---|
| | | background: rgb(33, 33, 43); |
|---|
| | | |
|---|
| | | /deep/.navs_content { |
|---|
| | | background: #272733; |
|---|
| | | } |
|---|
| | | /deep/.fo_content { |
|---|
| | | background: #272733; |
|---|
| | | } |
|---|
| | | /deep/.news-tab{ |
|---|
| | | background: #272733; |
|---|
| | | } |
|---|
| | | /deep/.mint-navbar { |
|---|
| | | background: #272733; |
|---|
| | | } |
|---|
| | | /deep/.mint-tab-item-label { |
|---|
| | | color: #fff; |
|---|
| | | font-size: .26rem; |
|---|
| | | |
|---|
| | | } |
|---|
| | | /deep/.titContent{ |
|---|
| | | color:#000; |
|---|
| | | } |
|---|
| | | /deep/.mint-tab-container {} |
|---|
| | | |
|---|
| | | /deep/.mint-tab-item { |
|---|
| | | background: #272733; |
|---|
| | | } |
|---|
| | | /deep/.van-swipe-item { |
|---|
| | | color: #000; |
|---|
| | | } |
|---|
| | | /deep/.footCss{ |
|---|
| | | background: rgb(33, 33, 43); |
|---|
| | | } |
|---|
| | | /deep/.newDetail-tits{ |
|---|
| | | color: #999; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | } |
|---|
| | | .search-right { |
|---|
| | |
|---|
| | | .mint-search-list { |
|---|
| | | position: relative !important; |
|---|
| | | } |
|---|
| | | .topLeft{ |
|---|
| | | |
|---|
| | | } |
|---|
| | | </style> |
|---|
| New file |
| | |
|---|
| | | [LocalizedFileNames] |
|---|
| | | ic_close_float.webp=@ic_close_float.webp,0 |
|---|
| | |
|---|
| | | return get(`/api/news/getNewsList.do?pageNum=1&pageSize=15&type=${type}`, {}) |
|---|
| | | } |
|---|
| | | |
|---|
| | | // 查询新闻详情 |
|---|
| | | export function queryNewsDetail (type) { |
|---|
| | | return get(`/api/news/getDetail.do?id=${type}`, {}) |
|---|
| | | } |
|---|
| | | |
|---|
| | | // 配资申请-用户配资列表 |
|---|
| | | export function getUserApplyList (options) { |
|---|
| | | return post('/user/funds/getUserApplyList.do', options) |
|---|
| | |
|---|
| | | |
|---|
| | | const ENV = process.env.NODE_ENV |
|---|
| | | export default { |
|---|
| | | DOMAIN: 'http://192.168.10.12:8091/', |
|---|
| | | baseURL: ENV == 'development'?'http://192.168.10.12:8091/':'http://192.168.10.12:8091/', |
|---|
| | | DOMAIN: 'http://156.226.16.4:8091/', |
|---|
| | | baseURL: ENV == 'development'?'http://156.226.16.4:8091/':'http://156.226.16.4:8091/', |
|---|
| | | // baseURL: 'http://localhost:8070', |
|---|
| | | /* Util API */ |
|---|
| | | baseURL: 'http://192.168.10.12:8091/', |
|---|
| | | baseURL: 'http://156.226.16.4:8091/', |
|---|
| | | util: { |
|---|
| | | image: '/util/image.html' // 图片上传 |
|---|
| | | } |
|---|
| | |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | <div v-show="$store.state.select != '/home'" class="footImgDeft"> |
|---|
| | | <img src="~@/assets/foot/home_default.png" /> |
|---|
| | | <img src="~@/assets/foot/tab_main_home_default.png" /> |
|---|
| | | </div> |
|---|
| | | <div v-show="$store.state.select != '/home'">首页</div> |
|---|
| | | </div> |
|---|
| | |
|---|
| | | <div class="footImgDeft"> |
|---|
| | | |
|---|
| | | <img v-show="$store.state.select == '/list'" src="~@/assets/foot/trade_selected.png" /> |
|---|
| | | <img v-show="$store.state.select != '/list'" src="~@/assets/foot/trade_default.png" /> |
|---|
| | | <img v-show="$store.state.select != '/list'" src="~@/assets/foot/tab_main_trade_default.png" /> |
|---|
| | | </div> |
|---|
| | | <div :class="$store.state.select == '/list'?'blueFont':''">交易</div> |
|---|
| | | </div> |
|---|
| | | <div :class="touch==3?'footDemos':'footDemo'" @click="goRouter('/orderlist',3)"> |
|---|
| | | <div class="footImgDeft"> |
|---|
| | | <img v-show="$store.state.select == '/orderlist'" src="~@/assets/foot/positions_selected.png" /> |
|---|
| | | <img v-show="$store.state.select != '/orderlist'" src="~@/assets/foot/positions_default.png" /> |
|---|
| | | <img v-show="$store.state.select != '/orderlist'" src="~@/assets/foot/tab_main_positions_default.png" /> |
|---|
| | | </div> |
|---|
| | | <div :class="$store.state.select == '/orderlist'?'blueFont':''">仓位</div> |
|---|
| | | </div> |
|---|
| | | <div :class="touch==4?'footDemos':'footDemo'" @click="goRouter('/user',4)"> |
|---|
| | | <div class="footImgDeft"> |
|---|
| | | <img v-show="$store.state.select == '/user'" src="~@/assets/foot/mine_selected.png" /> |
|---|
| | | <img v-show="$store.state.select != '/user'" src="~@/assets/foot/mine_default.png" /> |
|---|
| | | <img v-show="$store.state.select != '/user'" src="~@/assets/foot/tab_main_mine_default.png" /> |
|---|
| | | </div> |
|---|
| | | <div :class="$store.state.select == '/user'?'blueFont':''">我的</div> |
|---|
| | | </div> |
|---|
| | |
|---|
| | | <style> |
|---|
| | | .footCss { |
|---|
| | | border-top: 0.01rem solid rgba(192, 192, 192, 0.1); |
|---|
| | | background: rgb(33, 33, 43); |
|---|
| | | |
|---|
| | | position: fixed; |
|---|
| | | bottom: 0; |
|---|
| | | width: 100%; |
|---|
| | |
|---|
| | | <template> |
|---|
| | | <div class="go_to_login"> |
|---|
| | | <div class="go_to_login animated bounce"> |
|---|
| | | <div> |
|---|
| | | <div class="left_mess"><span>{{ '登录后即可开启真实/模拟交易' }}</span></div> |
|---|
| | | <div class="right_button"> |
|---|
| | |
|---|
| | | }, |
|---|
| | | methods: { |
|---|
| | | goToLogin() { |
|---|
| | | this.$router.push('/newLogin') |
|---|
| | | this.$router.push('/login') |
|---|
| | | } |
|---|
| | | } |
|---|
| | | } |
|---|
| | |
|---|
| | | display: flex; |
|---|
| | | align-items: center; |
|---|
| | | justify-content: center; |
|---|
| | | |
|---|
| | | |
|---|
| | | > div { |
|---|
| | | width: 90%; |
|---|
| | | height: 100%; |
|---|
| | |
|---|
| | | } |
|---|
| | | } |
|---|
| | | } |
|---|
| | | //淡入动画 |
|---|
| | | @keyframes show { |
|---|
| | | 0% { |
|---|
| | | |
|---|
| | | buttom:0rem; |
|---|
| | | } |
|---|
| | | 100% { |
|---|
| | | |
|---|
| | | buttom:2rem; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | |
|---|
| | | |
|---|
| | | </style> |
|---|
| | |
|---|
| | | // 价钱 * 汇率 转为 人民币 |
|---|
| | | return (this.total * this.exchangeNumber).toFixed(2) |
|---|
| | | }, |
|---|
| | | |
|---|
| | | price () { |
|---|
| | | if (this.autoNumber) { |
|---|
| | | return (this.detail.eachPoint * this.autoNumber * 100).toFixed(2) |
|---|
| | |
|---|
| | | <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> |
|---|
| | | </div> |
|---|
| | |
|---|
| | | <div class="center_tabs"> |
|---|
| | | <!-- 顶部轮播图 --> |
|---|
| | | <div class="banner_top"> |
|---|
| | | <van-skeleton title :row="1" :loading="loading" /> |
|---|
| | | <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 bannerImgsArr" @click="handleBannerClick(index)" :key="index"> |
|---|
| | | <img :src="item.img" alt /> |
|---|
| | | <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> |
|---|
| | | {{ artList.artTitle }} |
|---|
| | | </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> |
|---|
| | |
|---|
| | | <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;"> |
|---|
| | | <!-- <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.f3 > 0 ? `+${item2.f3}%` : `${item2.f3}%` }}</span> |
|---|
| | | </div> |
|---|
| | | <div class="percentage"></div> |
|---|
| | | <div class="percentage" style="width: 38%;position: absolute;right: 0;" :class="item2.f3 > 0 ? 'gree' : 'redd'"> |
|---|
| | | <echart :colorType="item2.f3" :ids="idx+'1'+index"></echart> |
|---|
| | | <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>{{ item2.f12 }}</span> |
|---|
| | | <img :src="Huo" alt style="margin-left: 0.12rem;" /> |
|---|
| | | <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" > |
|---|
| | | <!-- class="numbers" --> |
|---|
| | | <!-- <span>{{ '04:59:57' }}</span> --> |
|---|
| | | |
|---|
| | | <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"> |
|---|
| | | <div class="top_fo"> |
|---|
| | | <div class="title"> |
|---|
| | | {{ item2.indexName }} |
|---|
| | | </div> |
|---|
| | | <div class="numbers"> |
|---|
| | | {{ item2.currentPoint }} |
|---|
| | | </div> |
|---|
| | | <div class="percentage" :class="item2.floatRate > 0 ? 'gree' : 'redd'"> |
|---|
| | | <span style="font-weight: 500;">{{ item2.floatRate > 0 ? `+${item2.floatRate}%` : |
|---|
| | | `${item2.floatRate}%` |
|---|
| | | }}</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;" /> |
|---|
| | | </div> |
|---|
| | | <div class="numbers" :class="item2.floatPoint > 0 ? 'gree' : 'redd'"> |
|---|
| | | <span class="point">{{ item2.floatPoint > 0 ? `+${item2.floatPoint}%` : `${item2.floatPoint}%` |
|---|
| | | }}</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(item2.random) + 'X' }} |
|---|
| | | </el-tag> |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | |
|---|
| | | <span class="tab-name">新闻</span> |
|---|
| | | </mt-tab-item> |
|---|
| | | <mt-tab-item id="tab_1"> |
|---|
| | | <span class="tab-name">7×24</span> |
|---|
| | | <span class="tab-name">经济</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.addTime | 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 class="blocks">{{ item.sourceName }}</div> |
|---|
| | | </div> |
|---|
| | | <div class="neitu"><img :src="item.imgurl" /></div> |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | </mt-tab-container-item> |
|---|
| | | <mt-tab-container-item id="tab_1"> |
|---|
| | | <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.addTime | 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.addTime | gettime }}</div> |
|---|
| | | <div class="titContent" style="-webkit-box-orient: vertical;">{{ item.title }}</div> |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | </mt-tab-container-item> |
|---|
| | |
|---|
| | | </div> |
|---|
| | | <!-- tab --> |
|---|
| | | |
|---|
| | | <GoToLogin /> |
|---|
| | | <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 { |
|---|
| | | 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 { |
|---|
| | | Toast |
|---|
| | | } from "mint-ui"; |
|---|
| | | import * as api from "@/axios/api"; |
|---|
| | | import Logo from "@/assets/img/icon_home_logo.png"; |
|---|
| | | import Searchs from "@/assets/home/search.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 indexData from "./data.json"; |
|---|
| | | import GoToLogin from '@/page/home/components/GoLogin.vue'; |
|---|
| | | |
|---|
| | | export default { |
|---|
| | | components: { |
|---|
| | | HomeList, |
|---|
| | | AllList, |
|---|
| | | GoToLogin, |
|---|
| | | Echart |
|---|
| | | 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 - 交易时间安排", |
|---|
| | | navsArr: [{ |
|---|
| | | img: Tops, |
|---|
| | | title: "行情" |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | img: Rumen, |
|---|
| | | title: "持仓" |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | img: Xuexi, |
|---|
| | | title: "新股" |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | img: Guanyu, |
|---|
| | | title: "我的" |
|---|
| | | } |
|---|
| | | ], |
|---|
| | | artList:[], |
|---|
| | | news: "tab_0", |
|---|
| | | newsContent1: [], |
|---|
| | | newsContent2: [], |
|---|
| | | newsContent3: [], |
|---|
| | | newsContent4: [], |
|---|
| | | onlineService: "", |
|---|
| | | isGoTo: false, |
|---|
| | | bannerList:[] |
|---|
| | | }; |
|---|
| | | }, |
|---|
| | | methods: { |
|---|
| | | |
|---|
| | | getHuo() { |
|---|
| | | //123随机 |
|---|
| | | var num = Math.floor(Math.random() * 3 + 1); |
|---|
| | | return num; |
|---|
| | | |
|---|
| | | |
|---|
| | | }, |
|---|
| | | 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: [], |
|---|
| | | }; |
|---|
| | | //构造随机数列表 50 100 200 |
|---|
| | | getNum1(num) { |
|---|
| | | |
|---|
| | | if (num == 1) { |
|---|
| | | return 50; |
|---|
| | | } else if (num == 2) { |
|---|
| | | return 100; |
|---|
| | | } else if (num == 3) { |
|---|
| | | return 200; |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | methods: { |
|---|
| | | async getNewsList(type) { |
|---|
| | | let data = await api.queryNewsList(type); |
|---|
| | | |
|---|
| | | switch (type) { |
|---|
| | | goJy(index){ |
|---|
| | | switch (index) { |
|---|
| | | case 0: |
|---|
| | | this.$router.push('/list'); |
|---|
| | | break; |
|---|
| | | case 1: |
|---|
| | | this.newsContent1 = data.data.list |
|---|
| | | break; |
|---|
| | | this.$router.push('/orderlist'); |
|---|
| | | break; |
|---|
| | | case 2: |
|---|
| | | this.newsContent2 = data.data.list |
|---|
| | | break; |
|---|
| | | //this.$router.push(); |
|---|
| | | 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; |
|---|
| | | this.$router.push('/user'); |
|---|
| | | break; |
|---|
| | | |
|---|
| | | default: |
|---|
| | | break; |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | 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; |
|---|
| | | async getBanner () { |
|---|
| | | // 获取显示的banner |
|---|
| | | let result = await api.getBannerByPlat({ platType: 'm' }) |
|---|
| | | if (result.status === 0) { |
|---|
| | | this.bannerList = result.data |
|---|
| | | } else { |
|---|
| | | Toast(result.msg) |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | created() { |
|---|
| | | this.ProcessData(); |
|---|
| | | goOnline() { |
|---|
| | | window.location.href = this.onlineService; |
|---|
| | | |
|---|
| | | }, |
|---|
| | | mounted() { |
|---|
| | | this.getNewsList(1); |
|---|
| | | this.getNewsList(2); |
|---|
| | | this.getNewsList(4); |
|---|
| | | 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 { |
|---|
| | | Toast(data.msg) |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | 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)); |
|---|
| | | } |
|---|
| | | |
|---|
| | | }, |
|---|
| | | async getNewsList(type) { |
|---|
| | | let data = await api.queryNewsList(type); |
|---|
| | | |
|---|
| | | setTimeout(() => { |
|---|
| | | this.loading = false |
|---|
| | | }, 1000) |
|---|
| | | 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; |
|---|
| | | } |
|---|
| | | }; |
|---|
| | | }, |
|---|
| | | 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.getInfoSite(); |
|---|
| | | this.getNewsList(1); |
|---|
| | | this.getNewsList(2); |
|---|
| | | this.getNewsList(4); |
|---|
| | | this.getStock(); |
|---|
| | | this.getArtList(); |
|---|
| | | this.getBanner() |
|---|
| | | |
|---|
| | | setInterval(() => { |
|---|
| | | 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; |
|---|
| | | |
|---|
| | | >div { |
|---|
| | | width: 50%; |
|---|
| | | height: 100%; |
|---|
| | | display: flex; |
|---|
| | | align-items: center; |
|---|
| | | } |
|---|
| | | |
|---|
| | | .img_logo { |
|---|
| | | width: 3.3077rem; |
|---|
| | | height: 0.6154rem; |
|---|
| | | margin-left: 0.3846rem; |
|---|
| | | |
|---|
| | | >img { |
|---|
| | | width: 100%; |
|---|
| | | height: 100%; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | |
|---|
| | | .top_logo { |
|---|
| | | width: 100%; |
|---|
| | | height: 0.7949rem; |
|---|
| | | display: flex; |
|---|
| | | .right_search { |
|---|
| | | justify-content: flex-end; |
|---|
| | | |
|---|
| | | >div { |
|---|
| | | width: 50%; |
|---|
| | | height: 100%; |
|---|
| | | width: 1.6221rem; |
|---|
| | | 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; |
|---|
| | | margin-right: 0.4615rem; |
|---|
| | | |
|---|
| | | >div { |
|---|
| | | width: 1.2821rem; |
|---|
| | | width: 0.4615rem; |
|---|
| | | height: 0.4615rem; |
|---|
| | | |
|---|
| | | >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: 5%; |
|---|
| | | height: 70%; |
|---|
| | | display: flex; |
|---|
| | | align-items: center; |
|---|
| | | |
|---|
| | | >img { |
|---|
| | | width: 100%; |
|---|
| | | height: 100%; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | |
|---|
| | | .an_right_message { |
|---|
| | | width: 93%; |
|---|
| | | height: 100%; |
|---|
| | | display: flex; |
|---|
| | | align-items: center; |
|---|
| | | align-content: center; |
|---|
| | | font-size: 0.29rem; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | } |
|---|
| | | |
|---|
| | | .navs { |
|---|
| | | width: 100%; |
|---|
| | | height: 2.6154rem; |
|---|
| | | |
|---|
| | | display: flex; |
|---|
| | | justify-content: center; |
|---|
| | | |
|---|
| | | |
|---|
| | | >.navs_content { |
|---|
| | | position: relative; |
|---|
| | | overflow: hidden; |
|---|
| | | width: 95%; |
|---|
| | | height: 100%; |
|---|
| | | border-radius: 0.2564rem; |
|---|
| | | display: flex; |
|---|
| | | |
|---|
| | | >.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: 25%; |
|---|
| | | 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: 20%; |
|---|
| | | 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: 20%; |
|---|
| | | 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; |
|---|
| | | } |
|---|
| | | |
|---|
| | | .numbers { |
|---|
| | | width: 20%; |
|---|
| | | height: 100%; |
|---|
| | | display: flex; |
|---|
| | | align-items: center; |
|---|
| | | |
|---|
| | | } |
|---|
| | | |
|---|
| | | .point { |
|---|
| | | font-size: 0.28rem; |
|---|
| | | |
|---|
| | | } |
|---|
| | | |
|---|
| | | .percentage { |
|---|
| | | width: 20%; |
|---|
| | | height: 100%; |
|---|
| | | display: flex; |
|---|
| | | align-items: center; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | |
|---|
| | | .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; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | |
|---|
| | | .neitu { |
|---|
| | | width: 100%; |
|---|
| | | border-radius: 0.05rem; |
|---|
| | | margin-top: 0.3rem; |
|---|
| | | margin-bottom: 0.8rem; |
|---|
| | | } |
|---|
| | | .news-content { |
|---|
| | | position: relative; |
|---|
| | | padding: 0.3rem; |
|---|
| | | } |
|---|
| | | |
|---|
| | | .neitu img { |
|---|
| | | width: 100%; |
|---|
| | | border-radius: 0.05rem; |
|---|
| | | } |
|---|
| | | .item-out { |
|---|
| | | position: relative; |
|---|
| | | border-left: 0.01rem solid rgba(192, 192, 192, 0.8); |
|---|
| | | padding: 0 0.25rem 1rem 0.25rem; |
|---|
| | | } |
|---|
| | | |
|---|
| | | .block-out { |
|---|
| | | margin-top: 0.2rem; |
|---|
| | | } |
|---|
| | | .item-out::before { |
|---|
| | | content: "●"; |
|---|
| | | position: absolute; |
|---|
| | | top: -0.1rem; |
|---|
| | | left: -0.128rem; |
|---|
| | | margin: auto; |
|---|
| | | } |
|---|
| | | |
|---|
| | | .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; |
|---|
| | | } |
|---|
| | | .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; |
|---|
| | | } |
|---|
| | | </style> |
|---|
| New file |
| | |
|---|
| | | <template> |
|---|
| | | <div :class="` ${$state.theme === 'red' ? 'red-theme' : 'black-theme'}`" class=""> |
|---|
| | | |
|---|
| | | <div class="newsTop"> |
|---|
| | | <div class="newsTitle">{{list.artTitle}}</div> |
|---|
| | | <div class="newDetail-tits">{{ list.addTime| gettime}}</div> |
|---|
| | | </div> |
|---|
| | | <div class="newsDetail"> |
|---|
| | | <div style="white-space: pre-line;">{{list.artCnt}}</div> |
|---|
| | | <div class="newsImg" v-if="list.artImg"> |
|---|
| | | <img :src="list.artImg"/> |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | </template> |
|---|
| | | |
|---|
| | | <script> |
|---|
| | | import * as api from "@/axios/api"; |
|---|
| | | export default { |
|---|
| | | created() { |
|---|
| | | if (this.$route.query.listid) { |
|---|
| | | this.list_id = this.$route.query.listid; |
|---|
| | | } |
|---|
| | | this.getqueryNewsList(this.$route.query.listid); |
|---|
| | | }, |
|---|
| | | data () { |
|---|
| | | return{ |
|---|
| | | list_id:"", |
|---|
| | | list:[], |
|---|
| | | }}, |
|---|
| | | mounted(){ |
|---|
| | | |
|---|
| | | }, |
|---|
| | | methods:{ |
|---|
| | | async getqueryNewsList(){ |
|---|
| | | let data = await api.getArtList(); |
|---|
| | | this.list = data.data.list[0] |
|---|
| | | } |
|---|
| | | |
|---|
| | | }, |
|---|
| | | 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; |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | |
|---|
| | | } |
|---|
| | | </script> |
|---|
| | | |
|---|
| | | <style scoped lang="less"> |
|---|
| | | .newDetail-tits{ |
|---|
| | | margin-top: 0.4rem; |
|---|
| | | font-size: 0.4rem; |
|---|
| | | margin-bottom: 0.4rem; |
|---|
| | | } |
|---|
| | | .newsTop{ |
|---|
| | | border-bottom: 0.01rem solid #cdcdcd; |
|---|
| | | padding-top: 0.3rem; |
|---|
| | | color: #000; |
|---|
| | | width: 96%; |
|---|
| | | margin-left: 0; |
|---|
| | | margin-right: 0; |
|---|
| | | margin: 0 auto; |
|---|
| | | } |
|---|
| | | .newsTitle{ |
|---|
| | | font-size: 0.55rem; |
|---|
| | | font-weight: 500; |
|---|
| | | } |
|---|
| | | .newsDetail{ |
|---|
| | | width: 96%; |
|---|
| | | margin-left: 0; |
|---|
| | | margin-right: 0; |
|---|
| | | margin: 0 auto; |
|---|
| | | margin-top: 0.4rem; |
|---|
| | | font-size: 0.35rem; |
|---|
| | | line-height: 0.6rem; |
|---|
| | | } |
|---|
| | | .newsImg{ |
|---|
| | | width: 100%; |
|---|
| | | margin-top: 0.4rem; |
|---|
| | | } |
|---|
| | | .newsImg img{ |
|---|
| | | width: 100%; |
|---|
| | | height: 100%; |
|---|
| | | } |
|---|
| | | </style> |
|---|
| | |
|---|
| | | <template> |
|---|
| | | <div class=""> |
|---|
| | | <div class="header"> |
|---|
| | | <mt-header title="新闻"> |
|---|
| | | <router-link to="/user" slot="left"> |
|---|
| | | <mt-button icon="back"></mt-button> |
|---|
| | | </router-link> |
|---|
| | | </mt-header> |
|---|
| | | <div :class="` ${$state.theme === 'red' ? 'red-theme' : 'black-theme'}`" class=""> |
|---|
| | | |
|---|
| | | <div class="newsTop"> |
|---|
| | | <div class="newsTitle">{{list.title}}</div> |
|---|
| | | <div class="newDetail-tits">{{ list.addTime| gettime}}</div> |
|---|
| | | </div> |
|---|
| | | <div class=""> |
|---|
| | | <div>{{list.title}}</div> |
|---|
| | | <div class="item-times">{{ | gettime}}</div> |
|---|
| | | <div class="newsDetail"> |
|---|
| | | <div>{{list.content}}</div> |
|---|
| | | <div class="newsImg" v-if="list.imgurl"> |
|---|
| | | <img :src="list.imgurl"/> |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | </template> |
|---|
| | | |
|---|
| | | <script> |
|---|
| | | import * as api from "@/axios/api"; |
|---|
| | | export default { |
|---|
| | | created() { |
|---|
| | | if (this.$route.query.id) { |
|---|
| | | this.list_id = this.$route.query.id; |
|---|
| | | if (this.$route.query.listid) { |
|---|
| | | this.list_id = this.$route.query.listid; |
|---|
| | | } |
|---|
| | | |
|---|
| | | this.getqueryNewsList(this.$route.query.listid); |
|---|
| | | }, |
|---|
| | | data () { |
|---|
| | | return{ |
|---|
| | | list_id:"" |
|---|
| | | list_id:"", |
|---|
| | | list:[], |
|---|
| | | }}, |
|---|
| | | mounted(){ |
|---|
| | | |
|---|
| | | }, |
|---|
| | | methods:{ |
|---|
| | | |
|---|
| | | async getqueryNewsList(id){ |
|---|
| | | let data = await api.queryNewsDetail(id); |
|---|
| | | this.list = data.data |
|---|
| | | |
|---|
| | | } |
|---|
| | | |
|---|
| | | }, |
|---|
| | | filters:{ |
|---|
| | | gettime(time) { |
|---|
| | |
|---|
| | | </script> |
|---|
| | | |
|---|
| | | <style scoped lang="less"> |
|---|
| | | .item-times{ |
|---|
| | | color: #999; |
|---|
| | | margin-bottom: 0.15rem; |
|---|
| | | .newDetail-tits{ |
|---|
| | | margin-top: 0.4rem; |
|---|
| | | font-size: 0.4rem; |
|---|
| | | margin-bottom: 0.4rem; |
|---|
| | | } |
|---|
| | | .newsTop{ |
|---|
| | | border-bottom: 0.01rem solid #cdcdcd; |
|---|
| | | padding-top: 0.3rem; |
|---|
| | | color: #000; |
|---|
| | | width: 96%; |
|---|
| | | margin-left: 0; |
|---|
| | | margin-right: 0; |
|---|
| | | margin: 0 auto; |
|---|
| | | } |
|---|
| | | .newsTitle{ |
|---|
| | | font-size: 0.55rem; |
|---|
| | | font-weight: 500; |
|---|
| | | } |
|---|
| | | .newsDetail{ |
|---|
| | | width: 96%; |
|---|
| | | margin-left: 0; |
|---|
| | | margin-right: 0; |
|---|
| | | margin: 0 auto; |
|---|
| | | margin-top: 0.4rem; |
|---|
| | | font-size: 0.35rem; |
|---|
| | | line-height: 0.6rem; |
|---|
| | | } |
|---|
| | | .newsImg{ |
|---|
| | | width: 100%; |
|---|
| | | margin-top: 0.4rem; |
|---|
| | | } |
|---|
| | | .newsImg img{ |
|---|
| | | width: 100%; |
|---|
| | | height: 100%; |
|---|
| | | } |
|---|
| | | </style> |
|---|
| | |
|---|
| | | <template> |
|---|
| | | <div class="header_history"> |
|---|
| | | <div class="header_content"> |
|---|
| | | <div class="left_back" @click="$router.go(-1)"><img src="../../../assets/img/backs.png" alt=""></div> |
|---|
| | | <div class="left_back" @click="$router.go(-1)"><img src="../../../assets/img/back.png" alt=""></div> |
|---|
| | | <div class="right_mess"><span>{{ '' }}</span></div> |
|---|
| | | <div class="right_back" @click="goOnline()"> |
|---|
| | | <img :src="Service" alt /> |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | </template> |
|---|
| | | |
|---|
| | | <script> |
|---|
| | | import Service from "@/assets/home/icon_talk.png"; |
|---|
| | | export default { |
|---|
| | | name: 'headers', |
|---|
| | | props: ['mess'] |
|---|
| | | props: ['mess'], |
|---|
| | | data() { |
|---|
| | | return { |
|---|
| | | Service, |
|---|
| | | onlineService: "", |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | methods: { |
|---|
| | | |
|---|
| | | goOnline() { |
|---|
| | | window.location.href = this.onlineService; |
|---|
| | | }, |
|---|
| | | async getInfoSite() { |
|---|
| | | |
|---|
| | | let data = await api.getInfoSite() |
|---|
| | | if (data.status === 0) { |
|---|
| | | this.onlineService = data.data.onlineService |
|---|
| | | } else { |
|---|
| | | Toast(data.msg) |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | }, |
|---|
| | | mounted() { |
|---|
| | | this.getInfoSite() |
|---|
| | | } |
|---|
| | | } |
|---|
| | | </script> |
|---|
| | | |
|---|
| | | <style scope lang="less"> |
|---|
| | | .header_history { |
|---|
| | | width: 100%; |
|---|
| | | height: 1.0256rem; |
|---|
| | | height: 1.6256rem; |
|---|
| | | display: flex; |
|---|
| | | align-items: center; |
|---|
| | | > div { |
|---|
| | | |
|---|
| | | >div { |
|---|
| | | width: 100%; |
|---|
| | | height: 80%; |
|---|
| | | display: flex; |
|---|
| | | align-items: center; |
|---|
| | | justify-content: space-between; |
|---|
| | | padding-left: 0.2rem; |
|---|
| | | padding-right: 0.2rem; |
|---|
| | | } |
|---|
| | | |
|---|
| | | .left_back { |
|---|
| | | width: .6513rem; |
|---|
| | | height: 1.0513rem; |
|---|
| | | display: flex; |
|---|
| | | align-items: center; |
|---|
| | | justify-content: center; |
|---|
| | | |
|---|
| | | } |
|---|
| | | |
|---|
| | | .right_back { |
|---|
| | | width: 1.0513rem; |
|---|
| | | height: 1.0513rem; |
|---|
| | | display: flex; |
|---|
| | | align-items: center; |
|---|
| | | justify-content: center; |
|---|
| | | } |
|---|
| | | |
|---|
| | | .right_mess { |
|---|
| | | width: 60%; |
|---|
| | | height: 100%; |
|---|
| | | display: flex; |
|---|
| | | justify-content: flex-end; |
|---|
| | | align-items: center; |
|---|
| | | |
|---|
| | | >span { |
|---|
| | | margin-right: .5128rem; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | |
|---|
| | | img { |
|---|
| | | width: 50%; |
|---|
| | | height: 50%; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | |
|---|
| | | </style> |
|---|
| | |
|---|
| | | <template> |
|---|
| | | <div class="login_page"> |
|---|
| | | <headers :mess="loginWay" /> |
|---|
| | | <div class="img_mess"> |
|---|
| | | <!-- <div class="img_mess"> |
|---|
| | | <div class="logo_content animated fadeInRight"> |
|---|
| | | <img :src="Logo" alt /> |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | </div> --> |
|---|
| | | <div class="logins_content"> |
|---|
| | | <div class="login_title animated slideInDown"> |
|---|
| | | <span>{{ '邮箱登录' }}</span> |
|---|
| | | <span>{{ '手机号登录' }}</span> |
|---|
| | | </div> |
|---|
| | | <div class="login_forms"> |
|---|
| | | <div class="top_forms"> |
|---|
| | | <div class="user_name"> |
|---|
| | | <!-- <div class="user_name"> |
|---|
| | | <input type="text" :placeholder="placeholder" v-model="userName" /> |
|---|
| | | </div> |
|---|
| | | <div class="password"> |
|---|
| | | <input type="password" placeholder="登录密码" v-model="userPassword" @input="handleInput()" /> |
|---|
| | | </div> |
|---|
| | | </div> --> |
|---|
| | | <el-input placeholder="请输入手机号" :size="medium" v-model="userName" clearable> |
|---|
| | | </el-input> |
|---|
| | | <el-input style="margin-top: 0.46rem;" show-password placeholder="登录密码" :size="medium" v-model="userPassword" @input="handleInput()"> |
|---|
| | | </el-input> |
|---|
| | | </div> |
|---|
| | | <div class="bottom_btns"> |
|---|
| | | <div class="top_btn" @click="loginIN" :class="btnClass ? 'on' : 'off'"> |
|---|
| | | <div class="bottom_btns" :class="btnClass ? 'on' : 'off'" > |
|---|
| | | <div class="top_btn " @click="loginIN" :class="dengl ? 'animated pulse' : ''"> |
|---|
| | | <span>{{ '安全登录' }}</span> |
|---|
| | | </div> |
|---|
| | | <div class="mes"> |
|---|
| | | <span>{{ '没有账户？' }}</span> |
|---|
| | | <span @click="$router.push('/NewRegister')" style="color: rgb(54,124,248);">{{ '注册>' }}</span> |
|---|
| | | <div class="mes" @click="getApp()"> |
|---|
| | | <span>{{ '忘记密码？' }}</span> |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | <div class="login_bom"> |
|---|
| | | |
|---|
| | | <div class="line"> |
|---|
| | | <div class="left_line"></div> |
|---|
| | | <div class="center_line"> |
|---|
| | | <span>{{ '其他登录方式' }}</span> |
|---|
| | | </div> |
|---|
| | | <div class="right_line"></div> |
|---|
| | | </div> |
|---|
| | | <div class="imgDemo"> |
|---|
| | | <div class="appImg" @click="getApp()"><img src="@/assets/img/apple.png"/></div> |
|---|
| | | <div class="appImg" @click="getApp()"><img src="@/assets/img/google.png"/></div> |
|---|
| | | <div class="appImg" @click="getApp()"><img src="@/assets/img/facebook.png"/></div> |
|---|
| | | </div> |
|---|
| | | <div class="myzh"><span class="mes">没有账户?</span><span @click="$router.push('/register')" class="mes" style="color: rgb(54,124,248);">{{ '注册' }}</span> </div> |
|---|
| | | </div> |
|---|
| | | <el-alert |
|---|
| | | v-show="alertShow" |
|---|
| | | :closable="closable" |
|---|
| | | :title="texts" |
|---|
| | | type="warning" center></el-alert> |
|---|
| | | </div> |
|---|
| | | </template> |
|---|
| | | |
|---|
| | | <script> |
|---|
| | | import { Toast } from 'mint-ui' |
|---|
| | | import headers from "./components/header.vue"; |
|---|
| | |
|---|
| | | Logo, |
|---|
| | | userPassword: "", |
|---|
| | | userName: "", |
|---|
| | | btnClass: false |
|---|
| | | btnClass: false, |
|---|
| | | medium: "medium", |
|---|
| | | alertShow:false, |
|---|
| | | closable:false, |
|---|
| | | texts:"", |
|---|
| | | dengl:false, |
|---|
| | | loginBtn:false, |
|---|
| | | }; |
|---|
| | | }, |
|---|
| | | components: { |
|---|
| | | headers |
|---|
| | | }, |
|---|
| | | methods: { |
|---|
| | | getApp(){ |
|---|
| | | // Toast('您所在的地区暂未开通此服务') |
|---|
| | | //Toast 弹窗大小 |
|---|
| | | this.texts="您所在的地区暂未开通此服务" |
|---|
| | | this.alertShow=true |
|---|
| | | setTimeout(()=>{ |
|---|
| | | this.alertShow=false |
|---|
| | | },2000) |
|---|
| | | }, |
|---|
| | | handleInput() { |
|---|
| | | console.log(this.userPassword !== "" && this.userName !== ''); |
|---|
| | | if (this.userPassword !== "" && this.userName !== '') { |
|---|
| | | this.btnClass = true; |
|---|
| | | } else { |
|---|
| | | this.btnClass = false; |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | async loginIN () { |
|---|
| | | async loginIN() { |
|---|
| | | |
|---|
| | | this.dengl=true |
|---|
| | | setTimeout(()=>{ |
|---|
| | | this.dengl=false |
|---|
| | | },1000) |
|---|
| | | if(this.loginBtn){ |
|---|
| | | return; |
|---|
| | | } |
|---|
| | | this.loginBtn = true; |
|---|
| | | let opts = { |
|---|
| | | phone: this.userName, |
|---|
| | | userPwd: this.userPassword |
|---|
| | | } |
|---|
| | | |
|---|
| | | let data = await api.login(opts) |
|---|
| | | if (data.status === 0) { |
|---|
| | | this.$store.state.userInfo.phone = this.userName |
|---|
| | | this.$store.state.userInfo.token = data.data.token |
|---|
| | | |
|---|
| | | window.localStorage.clear() |
|---|
| | | window.localStorage.setItem("USERTOKEN",data.data.token); |
|---|
| | | window.localStorage.setItem("USERTOKEN", data.data.token); |
|---|
| | | this.$router.push('/home') |
|---|
| | | this.loginBtn = false; |
|---|
| | | } else { |
|---|
| | | Toast(data.msg) |
|---|
| | | this.texts=data.msg |
|---|
| | | this.alertShow=true |
|---|
| | | this.loginBtn = false; |
|---|
| | | setTimeout(()=>{ |
|---|
| | | this.alertShow=false |
|---|
| | | },2000) |
|---|
| | | //Toast(data.msg) |
|---|
| | | } |
|---|
| | | |
|---|
| | | }, |
|---|
| | | }, |
|---|
| | | beforeDestroy() {}, |
|---|
| | | created() {} |
|---|
| | | beforeDestroy() { }, |
|---|
| | | created() { } |
|---|
| | | }; |
|---|
| | | </script> |
|---|
| | | |
|---|
| | | <style scoped lang="less"> |
|---|
| | | .login_page { |
|---|
| | | position: relative; |
|---|
| | | background-color: #fff !important; |
|---|
| | | width: 100%; |
|---|
| | | height: 100%; |
|---|
| | | overflow: hidden; |
|---|
| | | overflow-y: auto; |
|---|
| | | } |
|---|
| | | |
|---|
| | | .logins_content { |
|---|
| | | |
|---|
| | | width: 100%; |
|---|
| | | height: 9.7436rem; |
|---|
| | | margin-top: 0.4359rem; |
|---|
| | | padding: 0 0.2564rem; |
|---|
| | | padding: 0 0.4564rem; |
|---|
| | | |
|---|
| | | .login_title { |
|---|
| | | width: 100%; |
|---|
| | | height: 2.0513rem; |
|---|
| | | display: flex; |
|---|
| | | justify-content: center; |
|---|
| | | |
|---|
| | | align-items: center; |
|---|
| | | font-size: 0.6923rem; |
|---|
| | | color: #fff; |
|---|
| | | font-size: 0.7023rem; |
|---|
| | | color: #000; |
|---|
| | | font-weight: 600 !important; |
|---|
| | | |
|---|
| | | >span { |
|---|
| | | font-weight: 600 !important; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | |
|---|
| | | .login_forms { |
|---|
| | | width: 100%; |
|---|
| | | height: 7.9231rem; |
|---|
| | | height: auto; |
|---|
| | | margin-top: 0.35rem; |
|---|
| | | .top_forms { |
|---|
| | | width: 100%; |
|---|
| | | height: 4.5128rem; |
|---|
| | | height: auto; |
|---|
| | | display: flex; |
|---|
| | | align-items: center; |
|---|
| | | flex-wrap: wrap; |
|---|
| | | |
|---|
| | | .user_name, |
|---|
| | | .password { |
|---|
| | | width: 100%; |
|---|
| | | height: 35%; |
|---|
| | | background: #1e1e1e; |
|---|
| | | background: rgb(246, 246, 247); |
|---|
| | | // background: #1e1e1e; |
|---|
| | | border-radius: 0.3564rem; |
|---|
| | | > input { |
|---|
| | | |
|---|
| | | >input { |
|---|
| | | width: 100%; |
|---|
| | | height: 100%; |
|---|
| | | padding-left: 0.3564rem; |
|---|
| | |
|---|
| | | } |
|---|
| | | } |
|---|
| | | } |
|---|
| | | |
|---|
| | | /deep/.el-input__inner { |
|---|
| | | width: 100%; |
|---|
| | | height: 1.45rem !important; |
|---|
| | | background-color: rgb(246, 246, 247) !important; |
|---|
| | | // background: #1e1e1e; |
|---|
| | | border-radius: 0.3564rem; |
|---|
| | | font-size: 0.45rem !important; |
|---|
| | | } |
|---|
| | | |
|---|
| | | .bottom_btns { |
|---|
| | | width: 100%; |
|---|
| | | height: 3.3333rem; |
|---|
| | | display: flex; |
|---|
| | | flex-wrap: wrap; |
|---|
| | | align-items: center; |
|---|
| | | margin-top: 0.5128rem; |
|---|
| | | margin-top: 0.8528rem; |
|---|
| | | |
|---|
| | | .top_btn { |
|---|
| | | width: 100%; |
|---|
| | | height: 40%; |
|---|
| | | height: 1.25rem; |
|---|
| | | border-radius: 0.3564rem; |
|---|
| | | background: rgb(131, 174, 243); |
|---|
| | | background: rgb(154,197,250); |
|---|
| | | color: #fff; |
|---|
| | | display: flex; |
|---|
| | | align-items: center; |
|---|
| | | justify-content: center; |
|---|
| | | font-size: 0.5128rem; |
|---|
| | | margin-top: 0.75rem; |
|---|
| | | >span { |
|---|
| | | font-weight: 530 !important; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | .top_btn.on { |
|---|
| | | background: rgb(0, 71, 187); |
|---|
| | | } |
|---|
| | | |
|---|
| | | |
|---|
| | | |
|---|
| | | .mes { |
|---|
| | | width: 100%; |
|---|
| | | height: 40%; |
|---|
| | | height: 20%; |
|---|
| | | margin-top: 0.4rem; |
|---|
| | | display: flex; |
|---|
| | | justify-content: flex-end; |
|---|
| | | align-items: center; |
|---|
| | |
|---|
| | | } |
|---|
| | | } |
|---|
| | | } |
|---|
| | | .login_bom{ |
|---|
| | | position: absolute; |
|---|
| | | bottom: 2.6rem; |
|---|
| | | width: 100%; |
|---|
| | | height: 4rem; |
|---|
| | | padding: 0 2rem; |
|---|
| | | } |
|---|
| | | .line{ |
|---|
| | | //分割线 |
|---|
| | | width: 100%; |
|---|
| | | height: 0.3846rem; |
|---|
| | | display: flex; |
|---|
| | | align-items: center; |
|---|
| | | justify-content: center; |
|---|
| | | margin-top: 0.3846rem; |
|---|
| | | .left_line{ |
|---|
| | | width: 20%; |
|---|
| | | height: 0.01rem; |
|---|
| | | background: #e5e5e5; |
|---|
| | | } |
|---|
| | | .center_line{ |
|---|
| | | width: 50%; |
|---|
| | | height: 0.01rem; |
|---|
| | | background: #fff; |
|---|
| | | display: flex; |
|---|
| | | align-items: center; |
|---|
| | | justify-content: center; |
|---|
| | | >span{ |
|---|
| | | font-size: 0.3046rem; |
|---|
| | | color: #000; |
|---|
| | | background-color: #fff; |
|---|
| | | |
|---|
| | | } |
|---|
| | | } |
|---|
| | | .right_line{ |
|---|
| | | width: 20%; |
|---|
| | | height: 0.01rem; |
|---|
| | | background: #e5e5e5; |
|---|
| | | } |
|---|
| | | |
|---|
| | | } |
|---|
| | | .myzh{ |
|---|
| | | width: calc(100% - 4rem); |
|---|
| | | position: absolute; |
|---|
| | | bottom: 0.01rem; |
|---|
| | | text-align: center; |
|---|
| | | .mes { |
|---|
| | | width: 100%; |
|---|
| | | height: 40%; |
|---|
| | | |
|---|
| | | font-size: 0.3846rem; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | .imgDemo{ |
|---|
| | | display: flex; |
|---|
| | | justify-content: space-between; |
|---|
| | | position: relative; |
|---|
| | | transform:translateY(50%); |
|---|
| | | } |
|---|
| | | .appImg{ |
|---|
| | | width: 1.4rem; |
|---|
| | | height: 1.4rem; |
|---|
| | | display: flex; |
|---|
| | | justify-content: center; |
|---|
| | | align-items: center; |
|---|
| | | background-color: rgb(246,246,247); |
|---|
| | | border-radius: 100%; |
|---|
| | | } |
|---|
| | | .appImg img{ |
|---|
| | | width: 0.8rem; |
|---|
| | | height: 0.8rem; |
|---|
| | | } |
|---|
| | | |
|---|
| | | .img_mess { |
|---|
| | | width: 100%; |
|---|
| | | height: 4.0513rem; |
|---|
| | | display: flex; |
|---|
| | | justify-content: center; |
|---|
| | | align-items: center; |
|---|
| | | |
|---|
| | | .logo_content { |
|---|
| | | width: 3rem; |
|---|
| | | height: 3.5769rem; |
|---|
| | | > img { |
|---|
| | | |
|---|
| | | >img { |
|---|
| | | width: 100%; |
|---|
| | | height: 100%; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | } |
|---|
| | | /deep/.el-alert{ |
|---|
| | | width: 70%!important; |
|---|
| | | height: 1rem!important; |
|---|
| | | position: absolute!important; |
|---|
| | | top: 0!important; |
|---|
| | | bottom: 0!important; |
|---|
| | | left: 0!important; |
|---|
| | | right: 0!important; |
|---|
| | | margin: auto!important; |
|---|
| | | font-size: 0.3rem!important; |
|---|
| | | } |
|---|
| | | /deep/.el-alert__title{ |
|---|
| | | font-size: 0.3rem!important; |
|---|
| | | } |
|---|
| | | /deep/.el-input__suffix{ |
|---|
| | | width: 1rem!important; |
|---|
| | | display: flex; |
|---|
| | | justify-content: center; |
|---|
| | | align-items: center; |
|---|
| | | } |
|---|
| | | /deep/.el-input__suffix-inner{ |
|---|
| | | |
|---|
| | | display: flex; |
|---|
| | | justify-content: center; |
|---|
| | | align-items: center; |
|---|
| | | |
|---|
| | | } |
|---|
| | | /deep/.el-input__icon{ |
|---|
| | | width: 1rem!important; |
|---|
| | | display: flex; |
|---|
| | | justify-content: center; |
|---|
| | | align-items: center; |
|---|
| | | } |
|---|
| | | .on .top_btn { |
|---|
| | | background: #2d8cf0!important; |
|---|
| | | } |
|---|
| | | /deep/.el-icon-circle-close::before{ |
|---|
| | | font-size: 0.5rem!important; |
|---|
| | | |
|---|
| | | } |
|---|
| | | /deep/.el-input__clear{ |
|---|
| | | font-size: 0.5rem!important; |
|---|
| | | } |
|---|
| | | </style> |
|---|
| | |
|---|
| | | <template> |
|---|
| | | <div class="login_page"> |
|---|
| | | <headers :mess="loginWay" /> |
|---|
| | | <div class="img_mess"> |
|---|
| | | <!-- <div class="img_mess"> |
|---|
| | | <div class="logo_content animated fadeInRight"> |
|---|
| | | <img :src="Logo" alt /> |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | </div> --> |
|---|
| | | <div class="logins_content"> |
|---|
| | | <div class="login_title animated slideInDown"> |
|---|
| | | <span>{{ '邮箱注册' }}</span> |
|---|
| | | <span>{{ '手机注册' }}</span> |
|---|
| | | </div> |
|---|
| | | <div class="login_forms"> |
|---|
| | | <div class="top_forms"> |
|---|
| | | <div class="user_name"> |
|---|
| | | <!-- <div class="user_name"> |
|---|
| | | <input type="text" :placeholder="placeholder" v-model="phone" /> |
|---|
| | | </div> |
|---|
| | | <div class="captcha"> |
|---|
| | |
|---|
| | | </div> |
|---|
| | | <div class="password"> |
|---|
| | | <input type="password" placeholder="密码为6~12位数字、字母或符号" v-model="userPassword" /> |
|---|
| | | <!-- @input="handleInput()" --> |
|---|
| | | @input="handleInput()" |
|---|
| | | </div> |
|---|
| | | <div class="password"> |
|---|
| | | <input type="password" placeholder="请再次确认密码" v-model="rePassword" /> |
|---|
| | | </div> |
|---|
| | | <div class="user_name"> |
|---|
| | | <input type="text" placeholder="机构代码" v-model="userName" /> |
|---|
| | | </div> |
|---|
| | | </div> --> |
|---|
| | | <el-input :placeholder="placeholder" :size="medium" v-model="phone" clearable @input="handleInput()"> |
|---|
| | | </el-input> |
|---|
| | | <!-- <el-input style="margin-top: 0.46rem;" :placeholder="verification" :size="medium" v-model="code" clearable> |
|---|
| | | </el-input> --> |
|---|
| | | <el-input style="margin-top: 0.46rem;" show-password placeholder="密码为6~12位数字、字母或符号" :size="medium" |
|---|
| | | v-model="userPassword" @input="handleInput()"> |
|---|
| | | </el-input> |
|---|
| | | <el-input style="margin-top: 0.46rem;" show-password placeholder="请再次确认密码" :size="medium" v-model="rePassword" |
|---|
| | | @input="handleInput()"> |
|---|
| | | </el-input> |
|---|
| | | <el-input style="margin-top: 0.46rem;" placeholder="邀请码" :size="medium" v-model="userName" clearable |
|---|
| | | @input="handleInput()"> |
|---|
| | | </el-input> |
|---|
| | | </div> |
|---|
| | | <div class="bottom_btns"> |
|---|
| | | <div class="top_btn" @click="gook" :class="btnClass ? 'on' : 'off'"> |
|---|
| | | <div class="bottom_btns" :class="btnClass ? 'on' : 'off'"> |
|---|
| | | <div class="top_btn " @click="gook" :class="dengl ? 'animated pulse' : ''"> |
|---|
| | | <span>{{ '安全注册' }}</span> |
|---|
| | | </div> |
|---|
| | | <div |
|---|
| | | <!-- <div |
|---|
| | | class="register-form-item agree-model" |
|---|
| | | > |
|---|
| | | <i @click="isAgree" |
|---|
| | | :class="agree?'glyphicon glyphicon glyphicon-ok-sign blue':'glyphicon glyphicon-ok-circle'"></i> |
|---|
| | | 我已阅读并同意 |
|---|
| | | <a style="color:#fff">《注册协议》</a> |
|---|
| | | </div> |
|---|
| | | </div> --> |
|---|
| | | <div class="mes"> |
|---|
| | | <span>{{ '已有账户？' }}</span> |
|---|
| | | <span @click="$router.push('/NewLogin')" style="color: rgb(54,124,248);">{{ '登录>' }}</span> |
|---|
| | | <span @click="$router.push('/login')" style="color: rgb(54,124,248);">{{ '登录>' }}</span> |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | </div> |
|---|
| | | <el-alert v-show="alertShow" :closable="closable" :title="texts" :type="elType" center></el-alert> |
|---|
| | | </div> |
|---|
| | | </template> |
|---|
| | | |
|---|
| | | <script> |
|---|
| | | import headers from "./components/header.vue"; |
|---|
| | | import Logo from "@/assets/img/LOGO2.png"; |
|---|
| | | import { isNull, isPhone, pwdReg } from '@/utils/utils' |
|---|
| | | import { Toast } from 'mint-ui' |
|---|
| | | import * as api from '@/axios/api' |
|---|
| | | export default { |
|---|
| | | components: { |
|---|
| | | headers |
|---|
| | | }, |
|---|
| | | name: "newRegister", |
|---|
| | | data () { |
|---|
| | | return{ |
|---|
| | | verification:"验证码", |
|---|
| | | loginWay: "手机号注册", |
|---|
| | | loginWay: "手机号注册", |
|---|
| | | placeholder: "手机号", |
|---|
| | | Logo, |
|---|
| | | phone:"", |
|---|
| | | userName: "", |
|---|
| | | code:"", |
|---|
| | | userPassword: "", |
|---|
| | | btnClass: true, |
|---|
| | | codeshow: true, |
|---|
| | | count: '', // 倒计时 |
|---|
| | | clickFalg: 0, // 点击次数 |
|---|
| | | rePassword:"", |
|---|
| | | agree:false, |
|---|
| | | }}, |
|---|
| | | mounted(){ |
|---|
| | | import headers from "./components/header.vue"; |
|---|
| | | import Logo from "@/assets/img/LOGO2.png"; |
|---|
| | | import { isNull, isPhone, pwdReg } from '@/utils/utils' |
|---|
| | | import { Toast } from 'mint-ui' |
|---|
| | | import * as api from '@/axios/api' |
|---|
| | | export default { |
|---|
| | | components: { |
|---|
| | | headers |
|---|
| | | }, |
|---|
| | | name: "newRegister", |
|---|
| | | data() { |
|---|
| | | return { |
|---|
| | | verification: "验证码", |
|---|
| | | loginWay: "手机号注册", |
|---|
| | | loginWay: "手机号注册", |
|---|
| | | placeholder: "手机号", |
|---|
| | | Logo, |
|---|
| | | phone: "", |
|---|
| | | userName: "", |
|---|
| | | code: "", |
|---|
| | | userPassword: "", |
|---|
| | | btnClass: false, |
|---|
| | | codeshow: true, |
|---|
| | | count: '', // 倒计时 |
|---|
| | | clickFalg: 0, // 点击次数 |
|---|
| | | rePassword: "", |
|---|
| | | agree: false, |
|---|
| | | dengl: false, |
|---|
| | | alertShow: false, |
|---|
| | | closable: false, |
|---|
| | | texts: "", |
|---|
| | | elType: "warning", |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | mounted() { |
|---|
| | | |
|---|
| | | }, |
|---|
| | | methods:{ |
|---|
| | | checkCodeBox () { |
|---|
| | | if (isNull(this.phone) || !isPhone(this.phone)) { |
|---|
| | | Toast('请输入正确的手机号') |
|---|
| | | }, |
|---|
| | | methods: { |
|---|
| | | handleInput() { |
|---|
| | | |
|---|
| | | if (this.userPassword !== "" && this.phone !== '' && this.userPassword == this.rePassword && this.userName != "") { |
|---|
| | | this.btnClass = true; |
|---|
| | | } else { |
|---|
| | | this.btnClass = false; |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | checkCodeBox() { |
|---|
| | | if (isNull(this.phone) || !isPhone(this.phone)) { |
|---|
| | | // Toast('请输入正确的手机号') |
|---|
| | | this.texts = "请输入正确的手机号" |
|---|
| | | this.alertShow = true |
|---|
| | | setTimeout(() => { |
|---|
| | | this.alertShow = false |
|---|
| | | }, 2000) |
|---|
| | | } else { |
|---|
| | | this.checkPhone() |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | async is_login(){ |
|---|
| | | //获取localStorage中的token |
|---|
| | | let token = localStorage.getItem('USERTOEKN') |
|---|
| | | if(token){ |
|---|
| | | this.$router.push('/home') |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | |
|---|
| | | async getcode() { |
|---|
| | | // if(!this.checkCode()){ |
|---|
| | | // // 验证图形码是否正确 |
|---|
| | | // Toast('请输入正确图形验证码') |
|---|
| | | // return |
|---|
| | | // } |
|---|
| | | // 获取验证码 |
|---|
| | | if (this.clickFalg !== 0) { |
|---|
| | | this.clickFalg = 0 |
|---|
| | | return |
|---|
| | | } |
|---|
| | | this.clickFalg++ |
|---|
| | | // var reg = 11 && /^((13|14|15|17|18)[0-9]{1}\d{8})$/ |
|---|
| | | let reg = /^[0-9]{11}$/ // 手机号码验证 |
|---|
| | | if (isNull(this.phone)) { |
|---|
| | | this.texts = "手机号不能为空" |
|---|
| | | this.alertShow = true |
|---|
| | | setTimeout(() => { |
|---|
| | | this.alertShow = false |
|---|
| | | }, 2000) |
|---|
| | | } else { |
|---|
| | | if (!reg.test(this.phone)) { |
|---|
| | | this.texts = "请输入正确的手机号码" |
|---|
| | | this.alertShow = true |
|---|
| | | setTimeout(() => { |
|---|
| | | this.alertShow = false |
|---|
| | | }, 2000) |
|---|
| | | } else { |
|---|
| | | this.checkPhone() |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | async getcode () { |
|---|
| | | // if(!this.checkCode()){ |
|---|
| | | // // 验证图形码是否正确 |
|---|
| | | // Toast('请输入正确图形验证码') |
|---|
| | | // return |
|---|
| | | // } |
|---|
| | | // 获取验证码 |
|---|
| | | if (this.clickFalg !== 0) { |
|---|
| | | this.clickFalg = 0 |
|---|
| | | return |
|---|
| | | } |
|---|
| | | this.clickFalg++ |
|---|
| | | // var reg = 11 && /^((13|14|15|17|18)[0-9]{1}\d{8})$/ |
|---|
| | | let reg = /^[0-9]{11}$/ // 手机号码验证 |
|---|
| | | if (isNull(this.phone)) { |
|---|
| | | Toast('手机号不可为空') |
|---|
| | | } else { |
|---|
| | | if (!reg.test(this.phone)) { |
|---|
| | | Toast('请输入正确的手机号码') |
|---|
| | | } else { |
|---|
| | | // var sign = this.$md5(this.phone+'W&WzL42v').toUpperCase() |
|---|
| | | let result = await api.getCode({ phoneNum: this.phone }) |
|---|
| | | if (result.status === 0) { |
|---|
| | | const TIME_COUNT = 60 |
|---|
| | | if (!this.timer) { |
|---|
| | | this.count = TIME_COUNT |
|---|
| | | this.codeshow = false |
|---|
| | | this.clickFalg = 0 |
|---|
| | | this.timer = setInterval(() => { |
|---|
| | | if (this.count > 0 && this.count <= TIME_COUNT) { |
|---|
| | | this.count-- |
|---|
| | | } else { |
|---|
| | | this.codeshow = true |
|---|
| | | clearInterval(this.timer) |
|---|
| | | this.timer = null |
|---|
| | | } |
|---|
| | | }, 1000) |
|---|
| | | } else { |
|---|
| | | Toast(result.msg) |
|---|
| | | } |
|---|
| | | // var sign = this.$md5(this.phone+'W&WzL42v').toUpperCase() |
|---|
| | | let result = await api.getCode({ phoneNum: this.phone }) |
|---|
| | | if (result.status === 0) { |
|---|
| | | const TIME_COUNT = 60 |
|---|
| | | if (!this.timer) { |
|---|
| | | this.count = TIME_COUNT |
|---|
| | | this.codeshow = false |
|---|
| | | this.clickFalg = 0 |
|---|
| | | this.timer = setInterval(() => { |
|---|
| | | if (this.count > 0 && this.count <= TIME_COUNT) { |
|---|
| | | this.count-- |
|---|
| | | } else { |
|---|
| | | this.codeshow = true |
|---|
| | | clearInterval(this.timer) |
|---|
| | | this.timer = null |
|---|
| | | } |
|---|
| | | }, 1000) |
|---|
| | | } else { |
|---|
| | | Toast(result.msg) |
|---|
| | | // Toast(result.msg) |
|---|
| | | this.texts = result.msg |
|---|
| | | this.elType = "success" |
|---|
| | | this.alertShow = true |
|---|
| | | setTimeout(() => { |
|---|
| | | this.alertShow = false |
|---|
| | | this.elType = "warning" |
|---|
| | | |
|---|
| | | }, 2000) |
|---|
| | | } |
|---|
| | | } else { |
|---|
| | | this.texts = result.msg |
|---|
| | | this.alertShow = true |
|---|
| | | setTimeout(() => { |
|---|
| | | this.alertShow = false |
|---|
| | | }, 2000) |
|---|
| | | } |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | async gook () { |
|---|
| | | // 注册 |
|---|
| | | if (!this.agree) { |
|---|
| | | Toast('需同意注册协议才能注册!') |
|---|
| | | } else if (isNull(this.phone) || !isPhone(this.phone)) { |
|---|
| | | Toast('请输入正确的手机号码') |
|---|
| | | } else if (isNull(this.userPassword)) { |
|---|
| | | Toast('请输入密码') |
|---|
| | | } else if (isNull(this.rePassword)) { |
|---|
| | | Toast('请确认密码') |
|---|
| | | } else if (isNull(this.code)) { |
|---|
| | | Toast('请输入验证码') |
|---|
| | | } else if (this.userPassword !== this.rePassword) { |
|---|
| | | Toast('两次输入的密码不一致') |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | async gook() { |
|---|
| | | this.dengl = true |
|---|
| | | setTimeout(() => { |
|---|
| | | this.dengl = false |
|---|
| | | }, 1000) |
|---|
| | | if (this.loginBtn) { |
|---|
| | | return; |
|---|
| | | } |
|---|
| | | this.loginBtn = true; |
|---|
| | | // 注册 |
|---|
| | | // if (!this.agree) { |
|---|
| | | // Toast('需同意注册协议才能注册!') |
|---|
| | | // this.loginBtn = false; |
|---|
| | | // } else |
|---|
| | | if (isNull(this.phone) || !isPhone(this.phone)) { |
|---|
| | | |
|---|
| | | this.texts = "请输入正确的手机号码" |
|---|
| | | this.alertShow = true |
|---|
| | | setTimeout(() => { |
|---|
| | | this.alertShow = false |
|---|
| | | }, 2000) |
|---|
| | | this.loginBtn = false; |
|---|
| | | } else if (isNull(this.userPassword)) { |
|---|
| | | this.texts = "请输入密码" |
|---|
| | | this.alertShow = true |
|---|
| | | setTimeout(() => { |
|---|
| | | this.alertShow = false |
|---|
| | | }, 2000) |
|---|
| | | this.loginBtn = false; |
|---|
| | | } else if (isNull(this.rePassword)) { |
|---|
| | | this.texts = "请确认密码" |
|---|
| | | this.alertShow = true |
|---|
| | | setTimeout(() => { |
|---|
| | | this.alertShow = false |
|---|
| | | }, 2000) |
|---|
| | | this.loginBtn = false; |
|---|
| | | } else |
|---|
| | | // if (isNull(this.code)) { |
|---|
| | | // this.texts="请输入验证码" |
|---|
| | | // this.alertShow=true |
|---|
| | | // setTimeout(()=>{ |
|---|
| | | // this.alertShow=false |
|---|
| | | // },2000) |
|---|
| | | // this.loginBtn = false; |
|---|
| | | // } else |
|---|
| | | if (this.userPassword !== this.rePassword) { |
|---|
| | | this.texts = "两次输入的密码不一致" |
|---|
| | | this.alertShow = true |
|---|
| | | setTimeout(() => { |
|---|
| | | this.alertShow = false |
|---|
| | | }, 2000) |
|---|
| | | this.password = 0 |
|---|
| | | this.password2 = 0 |
|---|
| | | this.loginBtn = false; |
|---|
| | | } else if (!pwdReg(this.userPassword)) { |
|---|
| | | Toast('密码为6~12位，数字、字母或符号') |
|---|
| | | |
|---|
| | | this.texts = "密码为6~12位，数字、字母或符号" |
|---|
| | | this.alertShow = true |
|---|
| | | setTimeout(() => { |
|---|
| | | this.alertShow = false |
|---|
| | | }, 2000) |
|---|
| | | this.loginBtn = false; |
|---|
| | | } else if (isNull(this.userName)) { |
|---|
| | | Toast('请输入机构代码') |
|---|
| | | this.texts = "请输入邀请码" |
|---|
| | | this.alertShow = true |
|---|
| | | setTimeout(() => { |
|---|
| | | this.alertShow = false |
|---|
| | | }, 2000) |
|---|
| | | this.loginBtn = false; |
|---|
| | | } else { |
|---|
| | | let opts = { |
|---|
| | | // agentCode:'4023', // SR330001 |
|---|
| | | phone: this.phone, |
|---|
| | | yzmCode: this.code, |
|---|
| | | yzmCode: '6666', |
|---|
| | | userPwd: this.userPassword, |
|---|
| | | agentCode: this.userName |
|---|
| | | } |
|---|
| | | let data = await api.register(opts) |
|---|
| | | if (data.status === 0) { |
|---|
| | | Toast('注册成功，请登录') |
|---|
| | | this.$router.push('/NewLogin') |
|---|
| | | |
|---|
| | | this.texts = "注册成功，请登录" |
|---|
| | | this.elType = "success" |
|---|
| | | this.alertShow = true |
|---|
| | | setTimeout(() => { |
|---|
| | | this.alertShow = false |
|---|
| | | this.elType = "warning" |
|---|
| | | }, 2000) |
|---|
| | | this.loginBtn = false; |
|---|
| | | this.$router.push('/login') |
|---|
| | | } else { |
|---|
| | | Toast(data.msg) |
|---|
| | | this.texts = data.msg |
|---|
| | | this.alertShow = true |
|---|
| | | setTimeout(() => { |
|---|
| | | this.alertShow = false |
|---|
| | | }, 2000) |
|---|
| | | this.loginBtn = false; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | isAgree () { |
|---|
| | | this.agree=!this.agree |
|---|
| | | }, |
|---|
| | | async checkPhone () { |
|---|
| | | // 先验证是否已经注册 |
|---|
| | | let data = await api.checkPhone({ phoneNum: this.phone }) |
|---|
| | | if (data.status === 0) { |
|---|
| | | // 如果用户已存在返回 0 |
|---|
| | | Toast('用户已注册,请登录') |
|---|
| | | this.$router.push('/login') |
|---|
| | | } else { |
|---|
| | | // this.dialogShow = false |
|---|
| | | // this.adminUrl = process.env.API_HOST |
|---|
| | | // if (this.adminUrl === undefined) { |
|---|
| | | // this.adminUrl = '' |
|---|
| | | // } |
|---|
| | | // this.gook() |
|---|
| | | this.getcode() |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | }, |
|---|
| | | }, |
|---|
| | | isAgree() { |
|---|
| | | this.agree = !this.agree |
|---|
| | | }, |
|---|
| | | async checkPhone() { |
|---|
| | | // 先验证是否已经注册 |
|---|
| | | let data = await api.checkPhone({ phoneNum: this.phone }) |
|---|
| | | if (data.status === 0) { |
|---|
| | | // 如果用户已存在返回 0 |
|---|
| | | this.texts = "用户已注册,请登录" |
|---|
| | | this.alertShow = true |
|---|
| | | setTimeout(() => { |
|---|
| | | this.alertShow = false |
|---|
| | | }, 2000) |
|---|
| | | this.$router.push('/login') |
|---|
| | | } else { |
|---|
| | | // this.dialogShow = false |
|---|
| | | // this.adminUrl = process.env.API_HOST |
|---|
| | | // if (this.adminUrl === undefined) { |
|---|
| | | // this.adminUrl = '' |
|---|
| | | // } |
|---|
| | | // this.gook() |
|---|
| | | this.getcode() |
|---|
| | | } |
|---|
| | | }, |
|---|
| | | }, |
|---|
| | | |
|---|
| | | } |
|---|
| | | } |
|---|
| | | </script> |
|---|
| | | |
|---|
| | | <style scoped lang="less"> |
|---|
| | | .logins_content { |
|---|
| | | width: 100%; |
|---|
| | | height: 9.7436rem; |
|---|
| | | margin-top: 0.4359rem; |
|---|
| | | padding: 0 0.2564rem; |
|---|
| | | .login_title { |
|---|
| | | width: 100%; |
|---|
| | | height: 2.0513rem; |
|---|
| | | display: flex; |
|---|
| | | justify-content: center; |
|---|
| | | align-items: center; |
|---|
| | | font-size: 0.6923rem; |
|---|
| | | color: #fff; |
|---|
| | | } |
|---|
| | | .login_forms { |
|---|
| | | width: 100%; |
|---|
| | | height: 7.9231rem; |
|---|
| | | .top_forms { |
|---|
| | | width: 100%; |
|---|
| | | height: 4.5128rem; |
|---|
| | | display: flex; |
|---|
| | | align-items: center; |
|---|
| | | flex-wrap: wrap; |
|---|
| | | .user_name,.captcha, |
|---|
| | | .password { |
|---|
| | | width: 100%; |
|---|
| | | height: 35%; |
|---|
| | | background: #1e1e1e; |
|---|
| | | border-radius: 0.3564rem; |
|---|
| | | margin-top: 0.2rem; |
|---|
| | | > input { |
|---|
| | | width: 100%; |
|---|
| | | height: 100%; |
|---|
| | | padding-left: 0.3564rem; |
|---|
| | | font-size: 0.4615rem; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | .captcha{ |
|---|
| | | display: flex; |
|---|
| | | align-items: center; |
|---|
| | | > input { |
|---|
| | | width: 80%!important; |
|---|
| | | .login_page { |
|---|
| | | position: relative; |
|---|
| | | background-color: #fff !important; |
|---|
| | | width: 100%; |
|---|
| | | height: 100%; |
|---|
| | | overflow: hidden; |
|---|
| | | overflow-y: auto; |
|---|
| | | } |
|---|
| | | |
|---|
| | | } |
|---|
| | | } |
|---|
| | | } |
|---|
| | | .bottom_btns { |
|---|
| | | width: 100%; |
|---|
| | | height: 3.3333rem; |
|---|
| | | display: flex; |
|---|
| | | flex-wrap: wrap; |
|---|
| | | align-items: center; |
|---|
| | | margin-top: 4.8128rem; |
|---|
| | | .top_btn { |
|---|
| | | width: 100%; |
|---|
| | | height: 40%; |
|---|
| | | border-radius: 0.3564rem; |
|---|
| | | background: rgb(131, 174, 243); |
|---|
| | | display: flex; |
|---|
| | | align-items: center; |
|---|
| | | justify-content: center; |
|---|
| | | font-size: 0.5128rem; |
|---|
| | | } |
|---|
| | | .top_btn.on { |
|---|
| | | background: rgb(0, 71, 187); |
|---|
| | | } |
|---|
| | | .mes { |
|---|
| | | width: 100%; |
|---|
| | | height: 40%; |
|---|
| | | display: flex; |
|---|
| | | justify-content: flex-end; |
|---|
| | | align-items: center; |
|---|
| | | font-size: 0.3846rem; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | } |
|---|
| | | } |
|---|
| | | .img_mess { |
|---|
| | | .logins_content { |
|---|
| | | |
|---|
| | | width: 100%; |
|---|
| | | height: 9.7436rem; |
|---|
| | | margin-top: 0.4359rem; |
|---|
| | | padding: 0 0.4564rem; |
|---|
| | | |
|---|
| | | .login_title { |
|---|
| | | width: 100%; |
|---|
| | | height: 4.0513rem; |
|---|
| | | height: 2.0513rem; |
|---|
| | | display: flex; |
|---|
| | | justify-content: center; |
|---|
| | | |
|---|
| | | align-items: center; |
|---|
| | | .logo_content { |
|---|
| | | width: 3rem; |
|---|
| | | height: 3.5769rem; |
|---|
| | | > img { |
|---|
| | | font-size: 0.7023rem; |
|---|
| | | color: #000; |
|---|
| | | font-weight: 600 !important; |
|---|
| | | |
|---|
| | | >span { |
|---|
| | | font-weight: 600 !important; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | |
|---|
| | | .login_forms { |
|---|
| | | width: 100%; |
|---|
| | | height: auto; |
|---|
| | | margin-top: 0.35rem; |
|---|
| | | |
|---|
| | | .top_forms { |
|---|
| | | width: 100%; |
|---|
| | | height: auto; |
|---|
| | | display: flex; |
|---|
| | | align-items: center; |
|---|
| | | flex-wrap: wrap; |
|---|
| | | |
|---|
| | | .user_name, |
|---|
| | | .password { |
|---|
| | | width: 100%; |
|---|
| | | height: 100%; |
|---|
| | | height: 35%; |
|---|
| | | background: rgb(246, 246, 247); |
|---|
| | | // background: #1e1e1e; |
|---|
| | | border-radius: 0.3564rem; |
|---|
| | | |
|---|
| | | >input { |
|---|
| | | width: 100%; |
|---|
| | | height: 100%; |
|---|
| | | padding-left: 0.3564rem; |
|---|
| | | font-size: 0.4615rem; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | } |
|---|
| | | |
|---|
| | | /deep/.el-input__inner { |
|---|
| | | width: 100%; |
|---|
| | | height: 1.45rem !important; |
|---|
| | | background-color: rgb(246, 246, 247) !important; |
|---|
| | | // background: #1e1e1e; |
|---|
| | | border-radius: 0.3564rem; |
|---|
| | | font-size: 0.45rem !important; |
|---|
| | | } |
|---|
| | | |
|---|
| | | .bottom_btns { |
|---|
| | | width: 100%; |
|---|
| | | height: 3.3333rem; |
|---|
| | | margin-top: 0.8528rem; |
|---|
| | | |
|---|
| | | .top_btn { |
|---|
| | | width: 100%; |
|---|
| | | height: 1.25rem; |
|---|
| | | border-radius: 0.3564rem; |
|---|
| | | background: rgb(154, 197, 250); |
|---|
| | | color: #fff; |
|---|
| | | display: flex; |
|---|
| | | align-items: center; |
|---|
| | | justify-content: center; |
|---|
| | | font-size: 0.5128rem; |
|---|
| | | margin-top: 0.75rem; |
|---|
| | | |
|---|
| | | >span { |
|---|
| | | font-weight: 530 !important; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | |
|---|
| | | |
|---|
| | | |
|---|
| | | .mes { |
|---|
| | | width: 100%; |
|---|
| | | height: 20%; |
|---|
| | | margin-top: 0.4rem; |
|---|
| | | display: flex; |
|---|
| | | justify-content: flex-end; |
|---|
| | | align-items: center; |
|---|
| | | font-size: 0.3846rem; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | } |
|---|
| | | .agree-model{ |
|---|
| | | margin-top: 0.2rem; |
|---|
| | | } |
|---|
| | | |
|---|
| | | .login_bom { |
|---|
| | | position: absolute; |
|---|
| | | bottom: 2.6rem; |
|---|
| | | width: 100%; |
|---|
| | | height: 4rem; |
|---|
| | | padding: 0 2rem; |
|---|
| | | } |
|---|
| | | |
|---|
| | | .line { |
|---|
| | | //分割线 |
|---|
| | | width: 100%; |
|---|
| | | height: 0.3846rem; |
|---|
| | | display: flex; |
|---|
| | | align-items: center; |
|---|
| | | justify-content: center; |
|---|
| | | margin-top: 0.3846rem; |
|---|
| | | |
|---|
| | | .left_line { |
|---|
| | | width: 20%; |
|---|
| | | height: 0.01rem; |
|---|
| | | background: #e5e5e5; |
|---|
| | | } |
|---|
| | | |
|---|
| | | .center_line { |
|---|
| | | width: 50%; |
|---|
| | | height: 0.01rem; |
|---|
| | | background: #fff; |
|---|
| | | display: flex; |
|---|
| | | align-items: center; |
|---|
| | | justify-content: center; |
|---|
| | | |
|---|
| | | >span { |
|---|
| | | font-size: 0.3046rem; |
|---|
| | | color: #000; |
|---|
| | | background-color: #fff; |
|---|
| | | |
|---|
| | | } |
|---|
| | | } |
|---|
| | | |
|---|
| | | .right_line { |
|---|
| | | width: 20%; |
|---|
| | | height: 0.01rem; |
|---|
| | | background: #e5e5e5; |
|---|
| | | } |
|---|
| | | |
|---|
| | | } |
|---|
| | | |
|---|
| | | .myzh { |
|---|
| | | width: calc(100% - 4rem); |
|---|
| | | position: absolute; |
|---|
| | | bottom: 0.01rem; |
|---|
| | | text-align: center; |
|---|
| | | |
|---|
| | | .mes { |
|---|
| | | width: 100%; |
|---|
| | | height: 40%; |
|---|
| | | |
|---|
| | | font-size: 0.3846rem; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | |
|---|
| | | .imgDemo { |
|---|
| | | display: flex; |
|---|
| | | justify-content: space-between; |
|---|
| | | position: relative; |
|---|
| | | transform: translateY(50%); |
|---|
| | | } |
|---|
| | | |
|---|
| | | .appImg { |
|---|
| | | width: 1.4rem; |
|---|
| | | height: 1.4rem; |
|---|
| | | display: flex; |
|---|
| | | justify-content: center; |
|---|
| | | align-items: center; |
|---|
| | | background-color: rgb(246, 246, 247); |
|---|
| | | border-radius: 100%; |
|---|
| | | } |
|---|
| | | |
|---|
| | | .appImg img { |
|---|
| | | width: 0.8rem; |
|---|
| | | height: 0.8rem; |
|---|
| | | } |
|---|
| | | |
|---|
| | | .img_mess { |
|---|
| | | width: 100%; |
|---|
| | | height: 4.0513rem; |
|---|
| | | display: flex; |
|---|
| | | justify-content: center; |
|---|
| | | align-items: center; |
|---|
| | | |
|---|
| | | .logo_content { |
|---|
| | | width: 3rem; |
|---|
| | | height: 3.5769rem; |
|---|
| | | |
|---|
| | | >img { |
|---|
| | | width: 100%; |
|---|
| | | height: 100%; |
|---|
| | | } |
|---|
| | | } |
|---|
| | | } |
|---|
| | | |
|---|
| | | /deep/.el-alert { |
|---|
| | | width: 70% !important; |
|---|
| | | height: 1rem !important; |
|---|
| | | position: absolute !important; |
|---|
| | | top: 0 !important; |
|---|
| | | bottom: 0 !important; |
|---|
| | | left: 0 !important; |
|---|
| | | right: 0 !important; |
|---|
| | | margin: auto !important; |
|---|
| | | font-size: 0.3rem !important; |
|---|
| | | } |
|---|
| | | |
|---|
| | | /deep/.el-alert__title { |
|---|
| | | font-size: 0.3rem !important; |
|---|
| | | } |
|---|
| | | |
|---|
| | | /deep/el-input__suffix { |
|---|
| | | width: 1rem !important; |
|---|
| | | } |
|---|
| | | |
|---|
| | | /deep/.el-input__suffix-inner { |
|---|
| | | width: 1rem !important; |
|---|
| | | } |
|---|
| | | |
|---|
| | | /deep/.el-input__icon { |
|---|
| | | width: 1rem !important; |
|---|
| | | } |
|---|
| | | |
|---|
| | | /deep/.el-icon-circle-close::before { |
|---|
| | | font-size: 0.5rem !important; |
|---|
| | | |
|---|
| | | } |
|---|
| | | |
|---|
| | | /deep/.el-input__clear { |
|---|
| | | font-size: 0.5rem !important; |
|---|
| | | } |
|---|
| | | |
|---|
| | | .on .top_btn { |
|---|
| | | background: #2d8cf0 !important; |
|---|
| | | } |
|---|
| | | |
|---|
| | | .agree-model { |
|---|
| | | margin-top: 0.2rem; |
|---|
| | | } |
|---|
| | | </style> |
|---|
| | |
|---|
| | | import newLogin from '@/page/login/login.vue' |
|---|
| | | import newRegister from '@/page/login/register.vue' |
|---|
| | | import NewPage from '@/page/home/newPage' |
|---|
| | | import NewGg from '@/page/home/newGg' |
|---|
| | | |
|---|
| | | Vue.use(Router) |
|---|
| | | |
|---|
| | |
|---|
| | | path: '/newPage', |
|---|
| | | name: 'newPage', |
|---|
| | | meta: { |
|---|
| | | title: 'new', |
|---|
| | | requireAuth: false, |
|---|
| | | hasHeader: false, |
|---|
| | | title: '详情', |
|---|
| | | hasHeader: true, |
|---|
| | | is_Show: true, |
|---|
| | | index: 2 |
|---|
| | | }, |
|---|
| | | component: NewPage |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | path: '/register', |
|---|
| | | name: 'register', |
|---|
| | | path: '/newGg', |
|---|
| | | name: 'newGg', |
|---|
| | | meta: { |
|---|
| | | title: '注册', |
|---|
| | | index: 3 |
|---|
| | | title: '公告详情', |
|---|
| | | hasHeader: true, |
|---|
| | | is_Show: true, |
|---|
| | | index: 49 |
|---|
| | | }, |
|---|
| | | component: Register |
|---|
| | | }, { |
|---|
| | | component: NewGg |
|---|
| | | }, |
|---|
| | | // { |
|---|
| | | // path: '/register', |
|---|
| | | // name: 'register', |
|---|
| | | // meta: { |
|---|
| | | // title: '注册', |
|---|
| | | // index: 3 |
|---|
| | | // }, |
|---|
| | | // component: Register |
|---|
| | | // }, |
|---|
| | | { |
|---|
| | | path: '/forget', |
|---|
| | | name: 'forget', |
|---|
| | | meta: { |
|---|
| | |
|---|
| | | index: 4 |
|---|
| | | }, |
|---|
| | | component: Forget |
|---|
| | | }, { |
|---|
| | | path: '/login', |
|---|
| | | name: 'login', |
|---|
| | | meta: { |
|---|
| | | title: '账户登录', |
|---|
| | | hasHeader: true, |
|---|
| | | index: 5 |
|---|
| | | }, |
|---|
| | | component: Login |
|---|
| | | }, { |
|---|
| | | }, |
|---|
| | | // { |
|---|
| | | // path: '/login', |
|---|
| | | // name: 'login', |
|---|
| | | // meta: { |
|---|
| | | // title: '账户登录', |
|---|
| | | // hasHeader: true, |
|---|
| | | // index: 5 |
|---|
| | | // }, |
|---|
| | | // component: Login |
|---|
| | | // }, |
|---|
| | | { |
|---|
| | | path: '/openaccount', |
|---|
| | | name: 'openaccount', |
|---|
| | | meta: { |
|---|
| | |
|---|
| | | component: FundsList |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | path: '/newLogin', |
|---|
| | | path: '/login', |
|---|
| | | name: 'newLogin', |
|---|
| | | meta: { |
|---|
| | | title: '新登录', |
|---|
| | | title: '用户登录', |
|---|
| | | requireAuth: false, |
|---|
| | | hasHeader: true, |
|---|
| | | index: 47 |
|---|
| | |
|---|
| | | component: newLogin |
|---|
| | | }, |
|---|
| | | { |
|---|
| | | path: '/newRegister', |
|---|
| | | path: '/register', |
|---|
| | | name: 'newRegister', |
|---|
| | | meta: { |
|---|
| | | title: '新注册', |
|---|
| | | title: '用户注册', |
|---|
| | | requireAuth: false, |
|---|
| | | hasHeader: false, |
|---|
| | | index: 48 |
|---|
| | |
|---|
| | | |
|---|
| | | const state = { |
|---|
| | | className: 'black', |
|---|
| | | theme:'red', |
|---|
| | | userInfo: { // 用户信息 |
|---|
| | | }, |
|---|
| | | user: {}, |
|---|
