all
This commit is contained in:
我是个攻城狮
@@ -0,0 +1,195 @@
|
||||
<template>
|
||||
<view class="swiper-container" v-if="imgs&&!img">
|
||||
<swiper class="banner-swiper3" :current="currentIndex" :autoplay="true" :interval="5000" :duration="2000" >
|
||||
<swiper-item >
|
||||
<view class="banner-swiper-item3">
|
||||
<image class="banner-img3" :src="imgs" mode=""></image>
|
||||
</view>
|
||||
</swiper-item>
|
||||
</swiper>
|
||||
</view>
|
||||
<view class="swiper-container" v-else-if="img">
|
||||
<swiper class="banner-swiper2" :current="currentIndex" :autoplay="true" :interval="5000" :duration="2000" >
|
||||
<swiper-item >
|
||||
<view class="banner-swiper-item2">
|
||||
<image class="banner-img2" :src="img" mode=""></image>
|
||||
</view>
|
||||
</swiper-item>
|
||||
</swiper>
|
||||
</view>
|
||||
<view class="swiper-container" v-else>
|
||||
<swiper class="banner-swiper" :current="currentIndex" :autoplay="true" :circular ="true":interval="5000" :duration="1500" @change="handleSwiperChange">
|
||||
<swiper-item v-for="(item,index) in list" :key="index">
|
||||
<view class="banner-swiper-item">
|
||||
<image class="banner-img" :src="item" mode=""></image>
|
||||
</view>
|
||||
<!-- <view class="banner-title">
|
||||
<view class="game-name">剑与远征</view>
|
||||
<view class="game-intro">剑与远征 剑与远征</view>
|
||||
<view class="game-about">了解详情</view>
|
||||
</view> -->
|
||||
</swiper-item>
|
||||
</swiper>
|
||||
<view class="arrow arrow-left" @tap="prev">
|
||||
<image class="arrow-img" src="../../static/img/index/l_icon.png"></image>
|
||||
</view>
|
||||
<view class="arrow arrow-right" @tap="next">
|
||||
<image class="arrow-img" src="../../static/img/index/r_icon.png"></image>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
props:{
|
||||
banner: {
|
||||
type: Number,
|
||||
default: 0,
|
||||
},
|
||||
img: {
|
||||
|
||||
default: '',
|
||||
},
|
||||
imgs: {
|
||||
|
||||
default: '',
|
||||
},
|
||||
titles: {
|
||||
|
||||
default: '',
|
||||
},
|
||||
title_content: {
|
||||
|
||||
default: '',
|
||||
},
|
||||
},
|
||||
data(){
|
||||
return {
|
||||
list: [
|
||||
'/static/img/index/banner1.jpg',
|
||||
'/static/img/index/banner2.png',
|
||||
'/static/img/index/banner1.jpg',
|
||||
'/static/img/index/banner2.png',
|
||||
],
|
||||
currentIndex: 0,
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.currentIndex = this.banner;
|
||||
},
|
||||
methods:{
|
||||
handleSwiperChange(event) {
|
||||
const current = event.detail.current;
|
||||
this.currentIndex = current;
|
||||
// console.log("当前轮播到第", current, "个索引");
|
||||
},
|
||||
prev() {
|
||||
this.currentIndex = (this.currentIndex - 1 + this.list.length) % this.list.length;
|
||||
},
|
||||
next() {
|
||||
this.currentIndex = (this.currentIndex + 1) % this.list.length;
|
||||
},
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
.swiper-container {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.banner-swiper,.banner-swiper-item,.banner-img{
|
||||
width: 100%;
|
||||
height: 538px;
|
||||
}
|
||||
.banner-swiper2,.banner-swiper-item2,.banner-img2{
|
||||
width: 100%;
|
||||
height: 333px;
|
||||
}
|
||||
.banner-swiper3,.banner-swiper-item3,.banner-img3{
|
||||
width: 100%;
|
||||
height:610px;
|
||||
}
|
||||
|
||||
.banner-title{
|
||||
position: absolute;
|
||||
top: 207px;
|
||||
left: 160px;
|
||||
font-size: 67px;
|
||||
font-weight: bold;
|
||||
color: #FFFFFF;
|
||||
text-shadow: 7px 6px 11px rgba(0,0,0,0.16);
|
||||
.game-about{
|
||||
width: 235px;
|
||||
height: 61px;
|
||||
background: #F48612;
|
||||
box-shadow: 0px 0px 13px 0px rgba(244,134,18,0.73);
|
||||
font-weight: bold;
|
||||
color: #FFFFFF;
|
||||
font-size: 27px;
|
||||
text-align: center;
|
||||
line-height: 61px;
|
||||
margin-top: 57px;
|
||||
cursor: pointer
|
||||
}
|
||||
.game-about:hover{
|
||||
background: #ff9a2f;
|
||||
box-shadow: 0px 0px 13px 0px rgba(255,154,47,0.73);
|
||||
}
|
||||
}
|
||||
.banner-title2{
|
||||
width: 100%;
|
||||
height: 333px;
|
||||
line-height: 333px;
|
||||
font-size: 67px;
|
||||
font-weight: bold;
|
||||
color: #FFFFFF;
|
||||
text-shadow: 7px 6px 11px rgba(0,0,0,0.16);
|
||||
}
|
||||
|
||||
.arrow {
|
||||
position: absolute;
|
||||
top: 129px;
|
||||
width: 68px;
|
||||
height: 102px;
|
||||
background: #000000;
|
||||
opacity: 0.57;
|
||||
line-height: 122px;
|
||||
text-align: center;
|
||||
cursor: pointer
|
||||
}
|
||||
.arrow:hover{
|
||||
opacity: 1;
|
||||
}
|
||||
.arrow-img{
|
||||
width:23px;
|
||||
height: 37px;
|
||||
}
|
||||
.arrow-left {
|
||||
left: 0px;
|
||||
}
|
||||
|
||||
.arrow-right {
|
||||
right: 0px;
|
||||
}
|
||||
|
||||
|
||||
@media screen and (max-width: 600px) {
|
||||
.banner-swiper,.banner-swiper-item,.banner-img{
|
||||
width: 100%;
|
||||
height: 160px;
|
||||
}
|
||||
.banner-swiper2,.banner-swiper-item2,.banner-img2{
|
||||
width: 100%;
|
||||
height: 120px;
|
||||
}
|
||||
.arrow {
|
||||
top: 70px;
|
||||
}
|
||||
|
||||
}
|
||||
// #ifdef H5
|
||||
|
||||
// #endif
|
||||
</style>
|
||||
@@ -0,0 +1,231 @@
|
||||
<template>
|
||||
<view class="bgc-e6 footer_contnet">
|
||||
<view class="footer max-width">
|
||||
<view class="b_img">
|
||||
<image class="b_logo" src="../../static/img/index/blogos.png"></image>
|
||||
<view class="b_code">
|
||||
<view class="btext">扫码关注公众号</view>
|
||||
<image class="c_img" :src="data.mp_image"></image>
|
||||
</view>
|
||||
</view>
|
||||
<view class="footer_nav">
|
||||
<view class="f_navs">
|
||||
<text class="nav" @tap="goPath('/news?index=1')">平台简介</text>
|
||||
<text class="nav">|</text>
|
||||
<text class="nav" @tap="goPath('/game')">资产中心</text>
|
||||
<text class="nav">|</text>
|
||||
<text class="nav" @tap="goPath('/invest')">投融资</text>
|
||||
<text class="nav">|</text>
|
||||
<text class="nav" @tap="goPath('/news?index=2')">新闻中心</text>
|
||||
<text class="nav">|</text>
|
||||
<text class="nav" @tap="goPath('/expert')">专家库</text>
|
||||
<!-- <text class="nav">|</text>
|
||||
<text class="nav" @tap="goPath('/news?index=4')">资方信息</text>
|
||||
|
||||
<text class="nav">|</text>
|
||||
<text class="nav" @tap="goPath('/news?index=3')">帮助中心</text> -->
|
||||
|
||||
</view>
|
||||
<view class="footer_nav_list">
|
||||
<text style="cursor: pointer;" @tap="active({url:'https://cogapi.scszsj.com/convention.html'})">《平台管理公约》</text>
|
||||
<text style="cursor: pointer;" @tap="active({url:'https://cogapi.scszsj.com/service.html'})">《用户服务协议》</text>
|
||||
</view>
|
||||
|
||||
<view class="footer_nav_list">抵制不良游戏, 拒绝盗版游戏. 注意自我保护, 谨防受骗上当. 适度游戏益脑, 沉迷游戏伤身. 合理安排时间, 享受健康生活。</view>
|
||||
<!-- <view class="footer_nav_list">
|
||||
<view class="foot_url">
|
||||
<view class="url1">网络游戏出版服务平台: </view>
|
||||
<a href="https://gisp.scszsj.com/" style="color: #888888;"><view>四川游戏研发出版运营综合服务平台</view></a>
|
||||
</view>
|
||||
<view class="foot_url" style="margin-top: 6px;">
|
||||
<view class="url1">动漫游戏上链: </view>
|
||||
<a href="https://acgbanquan.scszsj.com/" style="color: #888888;"><view>四川游戏动漫版权综合服务平台</view></a>
|
||||
</view>
|
||||
</view> -->
|
||||
<view class="footer_nav_list">网站备案许可证</view>
|
||||
<view class="footer_nav_list">网站备案编号：<a href="https://beian.miit.gov.cn/" style="color: #888888;">{{data.record}}</a></view>
|
||||
<view class="footer_nav_list">网信备案编号：<a href="https://bcbeian.ifcert.cn/index" style="color: #888888;">蜀网信备51010125629049300016号</a></view>
|
||||
<view class="footer_nav_list">{{data.copyright}}</view>
|
||||
<view class="footer_nav_list">商务对接:{{data.wechat}}</view>
|
||||
<view class="footer_nav_list">投诉举报:{{data.report}}</view>
|
||||
|
||||
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
props:{
|
||||
data:{
|
||||
type: Object,
|
||||
default: {},
|
||||
}
|
||||
},
|
||||
data(){
|
||||
return {
|
||||
|
||||
}
|
||||
},
|
||||
created() {
|
||||
},
|
||||
methods:{
|
||||
active(e){
|
||||
const path = this.$route.path;
|
||||
// const query = this.$route.query;
|
||||
if(path=='/'+e.url){
|
||||
return;
|
||||
}
|
||||
if(e.url.includes("http")){
|
||||
window.open(e.url, '_blank');
|
||||
// window.location.href = '';
|
||||
}
|
||||
else{
|
||||
this.$router.replace({
|
||||
path: e.url
|
||||
});
|
||||
}
|
||||
},
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
.nav:hover {
|
||||
text-decoration: underline;
|
||||
}
|
||||
a:hover {
|
||||
text-decoration: underline;
|
||||
}
|
||||
.foot_url{
|
||||
display: flex;
|
||||
}
|
||||
.url1{
|
||||
width: 200px;
|
||||
}
|
||||
.footer_contnet{
|
||||
width: 100%;
|
||||
// height: 341px;
|
||||
// background: #272A2C;
|
||||
background: radial-gradient( 90% 0% at 0% 0%, #111111 0%, #332B25 100%);
|
||||
// position: absolute;
|
||||
// bottom: 0;
|
||||
}
|
||||
.footer{
|
||||
width: 1130px;
|
||||
padding-top: 28px;
|
||||
display: flex;
|
||||
|
||||
.b_img{
|
||||
width: 217px;
|
||||
text-align: center;
|
||||
margin-top: 20px;
|
||||
.b_logo{
|
||||
width: 217px;
|
||||
height: 54px;
|
||||
}
|
||||
}
|
||||
.b_code{
|
||||
margin: 10px auto;
|
||||
width: 217px;
|
||||
height: 158px;
|
||||
background: #3C3C3C;
|
||||
border-radius: 3px;
|
||||
text-align: center;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
.c_img{
|
||||
margin-top: 4px;
|
||||
width: 118px;
|
||||
height: 118px;
|
||||
background: #727272;
|
||||
border-radius: 4px;
|
||||
}
|
||||
.btext{
|
||||
font-size: 14px;
|
||||
font-weight: 400;
|
||||
color: #888888;
|
||||
margin-top: -2px;
|
||||
width: 60px;
|
||||
margin-right: 10px;
|
||||
}
|
||||
}
|
||||
.footer_nav{
|
||||
margin-left: 109px;
|
||||
font-weight: 400;
|
||||
color: #888888;
|
||||
line-height: 24px;
|
||||
font-size: 14px;
|
||||
.f_navs{
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin-bottom: 12px;
|
||||
margin-top: 0px;
|
||||
.nav{
|
||||
margin-right: 12px;
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
.footer_nav_list{
|
||||
margin-bottom: 12px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (max-width: 768px) {
|
||||
.footer_contnet{
|
||||
height: auto !important;
|
||||
}
|
||||
.footer{
|
||||
flex-direction: column;
|
||||
width: 85%;
|
||||
}
|
||||
.b_img{
|
||||
width: 100% !important;
|
||||
}
|
||||
.footer .b_img .b_logo{
|
||||
width: 150px !important;
|
||||
height: 45px !important;
|
||||
}
|
||||
.b_code{
|
||||
width: 100px !important;
|
||||
height: 120px !important;
|
||||
flex-direction: column;
|
||||
margin-top: 10px !important;
|
||||
}
|
||||
.btext{
|
||||
font-size: 12px !important;
|
||||
width: 100% !important;
|
||||
margin-right: 0 !important;
|
||||
}
|
||||
.c_img{
|
||||
width: 90px !important;
|
||||
height: 90px !important;
|
||||
margin: 5px 0 !important;
|
||||
}
|
||||
.footer_nav{
|
||||
width: 100% !important;
|
||||
margin-left:0 !important;
|
||||
}
|
||||
|
||||
.footer_nav{
|
||||
margin-left: 0px !important;
|
||||
line-height: 20px !important;
|
||||
font-size: 12px !important;
|
||||
.f_navs{
|
||||
margin-bottom: 6px !important;
|
||||
margin-top: 18px !important;
|
||||
flex-flow: wrap;
|
||||
.nav{
|
||||
margin-right: 12px !important;
|
||||
}
|
||||
}
|
||||
.footer_nav_list{
|
||||
margin-bottom: 6px !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
</style>
|
||||
@@ -0,0 +1,567 @@
|
||||
<template>
|
||||
<view>
|
||||
<match-media :min-width="900">
|
||||
<view class="header_top">
|
||||
<view style="color: #7e541f;">孵化精品游戏 <text style="margin-left: 10px;">助力企业发展</text></view>
|
||||
<view class="top_r">
|
||||
<p @tap="active({url: 'asset'})">资产确权</p>
|
||||
<p @tap="active({url: 'blockchainquery'})">资产核验</p>
|
||||
<p @tap="active({url:'https://data.scszsj.com/#/'})">数字大屏</p>
|
||||
<p @tap="active({url: 'game'})">资产中心</p>
|
||||
<p @tap="active({url: 'news'})">关于我们</p>
|
||||
<p @tap="active({url: 'login'})" v-if="!token">登录</p>
|
||||
<p v-if="token"><text style="margin-right: 10px;color: #FF8B29;" @tap="active({url: 'member'})">个人中心</text> | <text @tap="loginout()" style="margin-left: 10px;">退出</text></p>
|
||||
</view>
|
||||
|
||||
</view>
|
||||
<view class="header">
|
||||
<view class="header-title">
|
||||
<image class="logo" src="../../static/img/home/dlogo.png" @tap="goPath('/')"></image>
|
||||
</view>
|
||||
<ul>
|
||||
<li v-for="(item,index) in list" class="pointer" :class="{'active-hover':num==index}" :key="index" >
|
||||
<a @tap="active(item)">{{item.text}}</a>
|
||||
</li>
|
||||
</ul>
|
||||
<view class="apply" @tap="active({url: 'apply'})">
|
||||
立即免费申请
|
||||
</view>
|
||||
</view>
|
||||
</match-media>
|
||||
<match-media :max-width="900">
|
||||
<view class="headers">
|
||||
<view class="header-titles">
|
||||
<image class="logos" src="../../static/img/index/blogo.png"></image>
|
||||
</view>
|
||||
<view class="header-right" @tap="open('drawer')">
|
||||
<uni-icons type="bars" size="24" color="#f18b37"></uni-icons>
|
||||
</view>
|
||||
</view>
|
||||
</match-media>
|
||||
<uni-drawer mode="right" ref="drawer">
|
||||
<view class="drawer-box">
|
||||
<ul>
|
||||
<li v-for="(item,index) in list" :class="{'active-hover':num==index}" :key="index"
|
||||
@tap="active(item)">
|
||||
<span href="./">{{item.text}}</span>
|
||||
</li>
|
||||
|
||||
<li @tap="active9({url: 'apply'})" :class="{'active-hover':nums==9}">
|
||||
<span href="./">立即申请</span>
|
||||
</li>
|
||||
|
||||
<!-- <li @tap="active10({url: 'blockchainquery'})" :class="{'active-hover':currentRoute=='/blockchainquery'}">
|
||||
<span href="./">资产核验</span>
|
||||
</li> -->
|
||||
</ul>
|
||||
</view>
|
||||
</uni-drawer>
|
||||
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { err } from '../../js_sdk/hhyang-uni-simple-router/helpers/warn';
|
||||
export default {
|
||||
props: {
|
||||
index: {
|
||||
type: Number,
|
||||
default: 0
|
||||
},
|
||||
name: {
|
||||
type: String,
|
||||
default: 'COG可信资产服务平台'
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
list: [{
|
||||
text: '首页',
|
||||
url: '/',
|
||||
path: '/pages/index',
|
||||
},
|
||||
{
|
||||
text: '我要资金',
|
||||
url: 'invest',
|
||||
path: '/pages/invest',
|
||||
},
|
||||
{
|
||||
text: '我要发行',
|
||||
url: 'publish',
|
||||
path: '/pages/publish',
|
||||
},
|
||||
{
|
||||
text: '我要出海',
|
||||
url: 'oversea',
|
||||
path: '/pages/oversea',
|
||||
},
|
||||
{
|
||||
text: '我要版号',
|
||||
url: 'versionNumber',
|
||||
path: '/pages/versionNumber',
|
||||
},{
|
||||
text: '我要版权',
|
||||
url: 'copyright',
|
||||
path: '/pages/copyright',
|
||||
},
|
||||
{
|
||||
text: '我要技术',
|
||||
url: 'development',
|
||||
path: '/pages/development',
|
||||
},
|
||||
{
|
||||
text: '我要参展',
|
||||
url: 'expo',
|
||||
path: '/pages/expo',
|
||||
},
|
||||
{
|
||||
text: '我要补贴',
|
||||
url: 'subsidy',
|
||||
path: '/pages/subsidy',
|
||||
},
|
||||
//首页
|
||||
|
||||
],
|
||||
num: 0,
|
||||
nums: 0,
|
||||
l_type:1,
|
||||
formData:[],
|
||||
dynacodeData: {
|
||||
seconds: 120,
|
||||
timer: null,
|
||||
codeText: '获取验证码',
|
||||
isSend: false
|
||||
},
|
||||
checkedss:true,
|
||||
token:'',
|
||||
currentRoute:'',
|
||||
captchaUrl:''
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.token = uni.getStorageSync('token');
|
||||
// this.num ='';
|
||||
this.nums ='';
|
||||
this.num = this.index;
|
||||
// console.log(this.num ,222)
|
||||
this.currentRoute = this.$route.path;
|
||||
// console.log(currentRoute,222)
|
||||
// if(this.currentRoute=='/blockchainquery'){
|
||||
// this.nums = 10;
|
||||
// this.num ='';
|
||||
// }
|
||||
if(this.currentRoute=='/apply'){
|
||||
this.nums = 9;
|
||||
this.num =-1;
|
||||
}
|
||||
// if(this.currentRoute=='/subsidy'){
|
||||
// this.num = 8;
|
||||
// }
|
||||
//this.refreshCaptcha();
|
||||
},
|
||||
watch: {
|
||||
'dynacodeData.seconds': {
|
||||
handler(newValue, oldValue) {
|
||||
if (newValue == 0) {
|
||||
clearInterval(this.dynacodeData.timer);
|
||||
this.dynacodeData = {
|
||||
seconds: 120,
|
||||
timer: null,
|
||||
codeText: '获取验证码',
|
||||
isSend: false
|
||||
};
|
||||
}
|
||||
},
|
||||
immediate: true,
|
||||
deep: true
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
refreshCaptcha() {
|
||||
this.captchaUrl ='';
|
||||
this.captchaUrl = `http://gg.com/index.php/api/user.code?${new Date().getTime()}`; // 防止缓存
|
||||
},
|
||||
loginout(){
|
||||
uni.clearStorageSync();
|
||||
this.token = "";
|
||||
uni.showToast({
|
||||
icon:'none',
|
||||
title: '退出成功',
|
||||
duration:1500
|
||||
})
|
||||
setTimeout(() => {
|
||||
uni.reLaunch({
|
||||
url: '/pages/index' // 替换为你实际的首页路径
|
||||
});
|
||||
// this.$router.replace({
|
||||
// path: '/'
|
||||
// });
|
||||
}, 1500);
|
||||
|
||||
},
|
||||
active(e) {
|
||||
const path = this.$route.path;
|
||||
// const query = this.$route.query;
|
||||
if(path=='/'+e.url){
|
||||
return;
|
||||
}
|
||||
if(e.url.includes("http")){
|
||||
window.open(e.url, '_blank');
|
||||
// window.location.href = '';
|
||||
}
|
||||
else{
|
||||
this.$router.replace({
|
||||
path: e.url
|
||||
});
|
||||
}
|
||||
},
|
||||
active9(e) {
|
||||
// this.num =9;
|
||||
// console.log(this.num,222)
|
||||
const path = this.$route.path;
|
||||
// const query = this.$route.query;
|
||||
if(path=='/'+e.url){
|
||||
return;
|
||||
}
|
||||
if(e.url.includes("http")){
|
||||
window.open(e.url, '_blank');
|
||||
// window.location.href = '';
|
||||
}
|
||||
else{
|
||||
this.$router.replace({
|
||||
path: e.url
|
||||
});
|
||||
}
|
||||
},
|
||||
active10(e) {
|
||||
this.nums =10;
|
||||
console.log(this.nums,222)
|
||||
const path = this.$route.path;
|
||||
// const query = this.$route.query;
|
||||
if(path=='/'+e.url){
|
||||
return;
|
||||
}
|
||||
if(e.url.includes("http")){
|
||||
window.open(e.url, '_blank');
|
||||
// window.location.href = '';
|
||||
}
|
||||
else{
|
||||
this.$router.replace({
|
||||
path: e.url
|
||||
});
|
||||
}
|
||||
},
|
||||
open(name){
|
||||
this.$refs[name].open();
|
||||
},
|
||||
close(name){
|
||||
this.$refs[name].close();
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
.login-box{
|
||||
width: 640px;
|
||||
min-height: 768px;
|
||||
background: #282627;
|
||||
box-shadow: 0px 0px 57px 0px rgba(239,131,18,0.15);
|
||||
text-align: center;
|
||||
.logos{
|
||||
width: 380px;
|
||||
height: 56px;
|
||||
margin: 48px auto;
|
||||
}
|
||||
.login_type{
|
||||
width: 541px;
|
||||
border-bottom: 1px solid #383838;
|
||||
padding:15px 0;
|
||||
margin: 0 auto;
|
||||
|
||||
.login_text{
|
||||
width: 45px;
|
||||
height: 21px;
|
||||
font-size: 21px;
|
||||
font-weight: 400;
|
||||
color: #9E9E9E;
|
||||
line-height: 32px;
|
||||
padding:25px 22px;
|
||||
cursor: pointer;
|
||||
}
|
||||
.check{
|
||||
font-size: 24px;
|
||||
color: #FFFFFF;
|
||||
}
|
||||
|
||||
}
|
||||
.login_descs{
|
||||
margin-top: 20px;
|
||||
height: 55px;
|
||||
font-size: 21px;
|
||||
font-weight: 400;
|
||||
color: #9E9E9E;
|
||||
text-align: center;
|
||||
padding: 0 60px;
|
||||
text-align: left;
|
||||
}
|
||||
.login_desc{
|
||||
margin-top: 20px;
|
||||
height: 55px;
|
||||
font-size: 21px;
|
||||
font-weight: 400;
|
||||
color: #9E9E9E;
|
||||
text-align: center;
|
||||
padding: 0 60px;
|
||||
}
|
||||
.login_bt{
|
||||
width: 85%;
|
||||
height: 53px;
|
||||
background: #383838;
|
||||
border-radius: 5px;
|
||||
line-height: 53px;
|
||||
margin: 0 auto;
|
||||
color: #9E9E9E;
|
||||
cursor: pointer;
|
||||
margin-top: 40px;
|
||||
}
|
||||
.login_bt:hover{
|
||||
background: #F48612;
|
||||
color: #ffffff;
|
||||
}
|
||||
.login_check{
|
||||
font-size: 19px;
|
||||
font-weight: 400;
|
||||
color: #9E9E9E;
|
||||
margin-top: 60px;
|
||||
}
|
||||
.login_code{
|
||||
width: 85%;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
margin:0 auto
|
||||
}
|
||||
.login_checks{
|
||||
font-size: 19px;
|
||||
font-weight: 400;
|
||||
color: #9E9E9E;
|
||||
margin-top: 10px;
|
||||
}
|
||||
.uni-checkbox-input{
|
||||
border-radius: 100% !important;
|
||||
}
|
||||
.input{
|
||||
width: 81%;
|
||||
height: 53px;
|
||||
border: 1px solid #383838;
|
||||
border-radius: 5px;
|
||||
margin: 0 auto;
|
||||
color: #ffffff;
|
||||
margin-bottom: 25px;
|
||||
text-align: left;
|
||||
padding: 0 2%;
|
||||
}
|
||||
.input2{
|
||||
width: 60%;
|
||||
height: 53px;
|
||||
border: 1px solid #383838;
|
||||
border-radius: 5px;
|
||||
color: #ffffff;
|
||||
padding: 0 2%;
|
||||
text-align: left;
|
||||
}
|
||||
.dynacode{
|
||||
width: 30%;
|
||||
height: 53px;
|
||||
background: #F48612;
|
||||
border-radius: 5px;
|
||||
color: #ffffff;
|
||||
line-height: 53px;
|
||||
cursor: pointer;
|
||||
}
|
||||
.input:hover{
|
||||
border: 1px solid #F48612;
|
||||
}
|
||||
.input2:hover{
|
||||
border: 1px solid #F48612;
|
||||
}
|
||||
.placeholder-class{
|
||||
font-size: 21px;
|
||||
font-weight: 400;
|
||||
color: #9E9E9E;
|
||||
text-align: left;
|
||||
}
|
||||
}
|
||||
.header_top{
|
||||
padding: 0 300px;
|
||||
height: 36px;
|
||||
margin: 0 auto;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
background-color: #2b2b29;
|
||||
color: #D5C6B2;
|
||||
font-size: 13px;
|
||||
letter-spacing: 1px;
|
||||
.top_r{
|
||||
width: 42%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
letter-spacing: 0px;
|
||||
font-size: 15px;
|
||||
p{
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
}
|
||||
.headers {
|
||||
padding: 0 2%;
|
||||
height: 300px;
|
||||
margin: 0 auto;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
background-color: #140D08;
|
||||
.header-titles {
|
||||
font-size: 36px;
|
||||
font-weight: bold;
|
||||
line-height: 100px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
.logos{
|
||||
width: 1000px;
|
||||
height: 125px;
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
}
|
||||
.header {
|
||||
padding: 0 300px;
|
||||
height: 70px;
|
||||
margin: 0 auto;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
background-color: #140D08;
|
||||
.header-title {
|
||||
font-size: 36px;
|
||||
font-weight: bold;
|
||||
line-height: 100px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
.logo{
|
||||
width: 310px;
|
||||
height: 37px;
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
.apply{
|
||||
width: 113px;
|
||||
height: 34px;
|
||||
background-image: url('../../static/img/home/apply.png');
|
||||
background-size: 100%;
|
||||
font-size: 15px;
|
||||
color: #070707;
|
||||
line-height: 34px;
|
||||
text-align: center;
|
||||
font-weight: bold;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
&>ul {
|
||||
// float: right;
|
||||
// margin-left: 30px;
|
||||
&>li {
|
||||
list-style: none;
|
||||
float: left;
|
||||
position: relative;
|
||||
|
||||
a,
|
||||
span {
|
||||
display: inline-block;
|
||||
padding: 0 14px;
|
||||
font-weight: 400;
|
||||
font-size: 16px;
|
||||
text-decoration: none;
|
||||
color: #ffffff;
|
||||
}
|
||||
}
|
||||
|
||||
.active-hover {
|
||||
a,
|
||||
span {
|
||||
font-weight: bold;
|
||||
color: #F48612;
|
||||
}
|
||||
|
||||
// &::before {
|
||||
// content: '';
|
||||
// width: calc(100% - 40px);
|
||||
// height: 4px;
|
||||
// background-color: #1ab44d;
|
||||
// position: absolute;
|
||||
// left: 20px;
|
||||
// bottom: 20px;
|
||||
// }
|
||||
}
|
||||
}
|
||||
|
||||
.header-right {
|
||||
padding: 0 30px;
|
||||
font-size: 40px;
|
||||
height: 100px;
|
||||
line-height: 100px;
|
||||
float: right;
|
||||
.icon-caidan{
|
||||
color: #ffffff;
|
||||
}
|
||||
}
|
||||
}
|
||||
.drawer-box{
|
||||
width: 30vw;
|
||||
height: 100vh;
|
||||
background-color: #FFFFFF;
|
||||
&>ul {
|
||||
width: 100%;
|
||||
float: right;
|
||||
|
||||
&>li {
|
||||
width: 100%;
|
||||
list-style: none;
|
||||
float: left;
|
||||
position: relative;
|
||||
text-align: center;
|
||||
a,
|
||||
span {
|
||||
display: inline-block;
|
||||
padding: 0 20px;
|
||||
line-height: 150px;
|
||||
font-size: 20px;
|
||||
text-decoration: none;
|
||||
color: #000;
|
||||
}
|
||||
}
|
||||
|
||||
.active-hover {
|
||||
a,
|
||||
span {
|
||||
font-weight: bold;
|
||||
color: #F48612;
|
||||
}
|
||||
&::before {
|
||||
content: '';
|
||||
width: calc(100% - 40px);
|
||||
height: 4px;
|
||||
background-color: #F48612;
|
||||
position: absolute;
|
||||
left: 20px;
|
||||
bottom: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
</style>
|
||||
@@ -0,0 +1,738 @@
|
||||
<template>
|
||||
<view>
|
||||
<match-media :min-width="900">
|
||||
<view class="header_top">
|
||||
<view style="color: #D5C6B2;">孵化精品游戏 <text style="margin-left: 10px;">助力企业发展</text></view>
|
||||
<view class="top_r">
|
||||
<p @tap="active({url: '/'})">回到首页</p>
|
||||
</view>
|
||||
|
||||
</view>
|
||||
</match-media>
|
||||
<match-media :max-width="900">
|
||||
<view class="headers">
|
||||
<view class="header-titles">
|
||||
<image class="logos" src="../../static/img/index/blogo.png"></image>
|
||||
</view>
|
||||
<view class="header-right" @tap="open('drawer')">
|
||||
<uni-icons type="bars" size="24" color="#f18b37"></uni-icons>
|
||||
</view>
|
||||
</view>
|
||||
</match-media>
|
||||
<uni-drawer mode="right" ref="drawer">
|
||||
<view class="drawer-box">
|
||||
<ul>
|
||||
<li v-for="(item,index) in list" :class="{'active-hover':num==index}" :key="index"
|
||||
@tap="active(item)">
|
||||
<span href="./">{{item.text}}</span>
|
||||
</li>
|
||||
|
||||
<li @tap="active9({url: 'apply'})" :class="{'active-hover':nums==9}">
|
||||
<span href="./">立即申请</span>
|
||||
</li>
|
||||
|
||||
<!-- <li @tap="active10({url: 'blockchainquery'})" :class="{'active-hover':currentRoute=='/blockchainquery'}">
|
||||
<span href="./">资产核验</span>
|
||||
</li> -->
|
||||
</ul>
|
||||
</view>
|
||||
</uni-drawer>
|
||||
|
||||
<uni-popup mode="center" ref="login">
|
||||
<view class="login-box">
|
||||
<image class="logos" src="../../static/img/index/blogo.png"></image>
|
||||
<view class="login_type">
|
||||
<text class="login_text" :class="{'check':l_type==1}" @tap="check(1)">登录</text>
|
||||
<text class="login_text">|</text>
|
||||
<text class="login_text" :class="{'check':l_type==2}" @tap="check(2)">注册</text>
|
||||
</view>
|
||||
<view class="login_desc" v-if="l_type==1">
|
||||
欢迎回来～
|
||||
</view>
|
||||
<view class="login_descs" v-else>
|
||||
快速开始尽享COG可信资产服务平台榜单，你可申请游戏评分、申请融资或处理游戏投融资业务
|
||||
</view>
|
||||
<view class="input-wrap" v-if="l_type==1">
|
||||
<input class="input" v-model="formData.mobile" type="text" placeholder="请输入手机号" placeholder-class="placeholder-class" maxlength="20">
|
||||
<input class="input" v-model="formData.password" type="password" placeholder="请输入登录密码" placeholder-class="placeholder-class"/>
|
||||
</view>
|
||||
|
||||
<!-- <img :src="captchaUrl" @tap="refreshCaptcha" alt="Captcha" /> -->
|
||||
<view class="login_bt" v-if="l_type==1" @tap="login()">
|
||||
<text>登录</text>
|
||||
</view>
|
||||
<view class="login_check" v-if="l_type==1">
|
||||
<label class="radio"><radio value="r1" :checked="checkedss" @tap="select()" activeBackgroundColor="#f48612" borderColor="#f48612" color="#f48612" style="transform:scale(0.65);border-radius: 100%;" /></label>
|
||||
登录即代表同意《用户协议》
|
||||
</view>
|
||||
<view class="input-wrap mg-t-30" v-if="l_type==2">
|
||||
<input class="input" v-model="formData.mobile" type="text" placeholder="请输入手机号" maxlength="20" placeholder-class="placeholder-class" >
|
||||
<input class="input" v-model="formData.password" type="password" placeholder="请输入登录密码" placeholder-class="placeholder-class" />
|
||||
<view class="login_code mg-b-30">
|
||||
<input class="input2" v-model="formData.code" type="text" placeholder="请输入短信验证码" placeholder-class="placeholder-class" />
|
||||
<view class="dynacode" @click="sendMobileCode">{{dynacodeData.codeText }}</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="login_bt" v-if="l_type==2" @tap="register()">
|
||||
注册并登录
|
||||
</view>
|
||||
<view class="login_checks" v-if="l_type==2">
|
||||
<label class="radio"><radio value="r1" :checked="checkedss" @tap="select()" activeBackgroundColor="#f48612" borderColor="#f48612" color="#f48612" style="transform:scale(0.65);border-radius: 100%;" /></label>
|
||||
注册即代表同意《用户协议》
|
||||
</view>
|
||||
</view>
|
||||
</uni-popup>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { err } from '../../js_sdk/hhyang-uni-simple-router/helpers/warn';
|
||||
export default {
|
||||
props: {
|
||||
index: {
|
||||
type: Number,
|
||||
default: 0
|
||||
},
|
||||
name: {
|
||||
type: String,
|
||||
default: 'COG可信资产服务平台'
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
list: [{
|
||||
text: '首页',
|
||||
url: '/',
|
||||
path: '/pages/index',
|
||||
},
|
||||
{
|
||||
text: '我要资金',
|
||||
url: 'invest',
|
||||
path: '/pages/invest',
|
||||
},
|
||||
{
|
||||
text: '我要发行',
|
||||
url: 'publish',
|
||||
path: '/pages/publish',
|
||||
},
|
||||
{
|
||||
text: '我要出海',
|
||||
url: 'oversea',
|
||||
path: '/pages/oversea',
|
||||
},
|
||||
{
|
||||
text: '我要版号',
|
||||
url: 'versionNumber',
|
||||
path: '/pages/versionNumber',
|
||||
},{
|
||||
text: '我要版权',
|
||||
url: 'copyright',
|
||||
path: '/pages/copyright',
|
||||
},
|
||||
{
|
||||
text: '我要技术',
|
||||
url: 'development',
|
||||
path: '/pages/development',
|
||||
},
|
||||
{
|
||||
text: '我要参展',
|
||||
url: 'expo',
|
||||
path: '/pages/expo',
|
||||
},
|
||||
{
|
||||
text: '我要补贴',
|
||||
url: 'subsidy',
|
||||
path: '/pages/subsidy',
|
||||
},
|
||||
//首页
|
||||
|
||||
],
|
||||
num: 0,
|
||||
nums: 0,
|
||||
l_type:1,
|
||||
formData:[],
|
||||
dynacodeData: {
|
||||
seconds: 120,
|
||||
timer: null,
|
||||
codeText: '获取验证码',
|
||||
isSend: false
|
||||
},
|
||||
checkedss:true,
|
||||
token:'',
|
||||
currentRoute:'',
|
||||
captchaUrl:''
|
||||
}
|
||||
},
|
||||
created() {
|
||||
// this.num ='';
|
||||
this.nums ='';
|
||||
this.token = uni.getStorageSync('token');
|
||||
this.num = this.index;
|
||||
// console.log(this.num ,222)
|
||||
this.currentRoute = this.$route.path;
|
||||
// console.log(currentRoute,222)
|
||||
// if(this.currentRoute=='/blockchainquery'){
|
||||
// this.nums = 10;
|
||||
// this.num ='';
|
||||
// }
|
||||
if(this.currentRoute=='/apply'){
|
||||
this.nums = 9;
|
||||
this.num =-1;
|
||||
}
|
||||
// if(this.currentRoute=='/subsidy'){
|
||||
// this.num = 8;
|
||||
// }
|
||||
//this.refreshCaptcha();
|
||||
},
|
||||
watch: {
|
||||
'dynacodeData.seconds': {
|
||||
handler(newValue, oldValue) {
|
||||
if (newValue == 0) {
|
||||
clearInterval(this.dynacodeData.timer);
|
||||
this.dynacodeData = {
|
||||
seconds: 120,
|
||||
timer: null,
|
||||
codeText: '获取验证码',
|
||||
isSend: false
|
||||
};
|
||||
}
|
||||
},
|
||||
immediate: true,
|
||||
deep: true
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
refreshCaptcha() {
|
||||
this.captchaUrl ='';
|
||||
this.captchaUrl = `http://gg.com/index.php/api/user.code?${new Date().getTime()}`; // 防止缓存
|
||||
},
|
||||
select(){
|
||||
if(this.checkedss==true){
|
||||
this.checkedss=false;
|
||||
}else{
|
||||
this.checkedss=true;
|
||||
}
|
||||
},
|
||||
check(e){
|
||||
this.l_type=e;
|
||||
},
|
||||
login(){
|
||||
if(this.checked==false){
|
||||
uni.showToast({
|
||||
icon:'none',
|
||||
title: '请同意用户协议',
|
||||
duration:1500
|
||||
})
|
||||
return;
|
||||
}
|
||||
if(this.formData.mobile==''){
|
||||
uni.showToast({
|
||||
icon:'none',
|
||||
title: '请输入手机号',
|
||||
duration:1500
|
||||
})
|
||||
return;
|
||||
}
|
||||
if(this.formData.password==''){
|
||||
uni.showToast({
|
||||
icon:'none',
|
||||
title: '请输入密码',
|
||||
duration:1500
|
||||
})
|
||||
return;
|
||||
}
|
||||
this._post('user.Useropen/phonelogin',{
|
||||
mobile: this.formData.mobile,
|
||||
password: this.formData.password,
|
||||
|
||||
},res=>{
|
||||
uni.setStorageSync('token',res.data.token)
|
||||
uni.showToast({
|
||||
icon:'none',
|
||||
title: '登录成功',
|
||||
duration:1500
|
||||
})
|
||||
this.token =res.data.token;
|
||||
this.close('login');
|
||||
}
|
||||
,err=>{
|
||||
uni.showToast({
|
||||
icon:'none',
|
||||
title: err.data.msg
|
||||
})
|
||||
return;
|
||||
// this.$message(err.data.msg);
|
||||
}
|
||||
);
|
||||
},
|
||||
sendMobileCode(){
|
||||
if(this.checked==false){
|
||||
uni.showToast({
|
||||
icon:'none',
|
||||
title: '请同意用户协议',
|
||||
duration:1500
|
||||
})
|
||||
return;
|
||||
}
|
||||
if(!this.formData.mobile){
|
||||
uni.showToast({
|
||||
icon:'none',
|
||||
title: '请输入手机号',
|
||||
duration:1500
|
||||
})
|
||||
return;
|
||||
}
|
||||
if(!this.formData.password){
|
||||
uni.showToast({
|
||||
icon:'none',
|
||||
title: '请输入密码',
|
||||
duration:1500
|
||||
})
|
||||
return;
|
||||
}
|
||||
this._post('user.Useropen/sendCode',{
|
||||
mobile: this.formData.mobile,
|
||||
type: 'register',
|
||||
},res=>{
|
||||
this.dynacodeData.timer = setInterval(() => {
|
||||
this.dynacodeData.seconds--;
|
||||
this.dynacodeData.codeText = this.dynacodeData.seconds + 's后重发';
|
||||
}, 1000);
|
||||
uni.showToast({
|
||||
icon:'none',
|
||||
title: '发送成功',
|
||||
duration:1500
|
||||
})
|
||||
}
|
||||
,err=>{
|
||||
uni.showToast({
|
||||
icon:'none',
|
||||
title: err.data.msg
|
||||
})
|
||||
return;
|
||||
// this.$message(err.data.msg);
|
||||
}
|
||||
);
|
||||
},
|
||||
register(){
|
||||
if(this.checked==false){
|
||||
uni.showToast({
|
||||
icon:'none',
|
||||
title: '请同意用户协议',
|
||||
duration:1500
|
||||
})
|
||||
return;
|
||||
}
|
||||
if(this.formData.mobile==''){
|
||||
uni.showToast({
|
||||
icon:'none',
|
||||
title: '请输入手机号',
|
||||
duration:1500
|
||||
})
|
||||
return;
|
||||
}
|
||||
if(this.formData.password==''){
|
||||
uni.showToast({
|
||||
icon:'none',
|
||||
title: '请输入密码',
|
||||
duration:1500
|
||||
})
|
||||
return;
|
||||
}
|
||||
this._post('user.Useropen/register',{
|
||||
mobile: this.formData.mobile,
|
||||
password: this.formData.password,
|
||||
code: this.formData.code,
|
||||
corporate_idcard: 'arguments11',
|
||||
company_code: 'arguments11',
|
||||
name: 'arguments11',
|
||||
legal_person: 'arguments11',
|
||||
},res=>{
|
||||
uni.setStorageSync('token',res.data.token)
|
||||
uni.showToast({
|
||||
icon:'none',
|
||||
title: '注册成功',
|
||||
duration:1500
|
||||
})
|
||||
this.token =res.data.token;
|
||||
this.close('login');
|
||||
}
|
||||
,err=>{
|
||||
uni.showToast({
|
||||
icon:'none',
|
||||
title: err.data.msg
|
||||
})
|
||||
return;
|
||||
// this.$message(err.data.msg);
|
||||
}
|
||||
);
|
||||
},
|
||||
|
||||
active(e) {
|
||||
const path = this.$route.path;
|
||||
// const query = this.$route.query;
|
||||
if(path=='/'+e.url){
|
||||
return;
|
||||
}
|
||||
if(e.url.includes("http")){
|
||||
window.open(e.url, '_blank');
|
||||
// window.location.href = '';
|
||||
}
|
||||
else{
|
||||
this.$router.replace({
|
||||
path: e.url
|
||||
});
|
||||
}
|
||||
},
|
||||
active9(e) {
|
||||
// this.num =9;
|
||||
// console.log(this.num,222)
|
||||
const path = this.$route.path;
|
||||
// const query = this.$route.query;
|
||||
if(path=='/'+e.url){
|
||||
return;
|
||||
}
|
||||
if(e.url.includes("http")){
|
||||
window.open(e.url, '_blank');
|
||||
// window.location.href = '';
|
||||
}
|
||||
else{
|
||||
this.$router.replace({
|
||||
path: e.url
|
||||
});
|
||||
}
|
||||
},
|
||||
active10(e) {
|
||||
this.nums =10;
|
||||
console.log(this.nums,222)
|
||||
const path = this.$route.path;
|
||||
// const query = this.$route.query;
|
||||
if(path=='/'+e.url){
|
||||
return;
|
||||
}
|
||||
if(e.url.includes("http")){
|
||||
window.open(e.url, '_blank');
|
||||
// window.location.href = '';
|
||||
}
|
||||
else{
|
||||
this.$router.replace({
|
||||
path: e.url
|
||||
});
|
||||
}
|
||||
},
|
||||
open(name){
|
||||
this.$refs[name].open();
|
||||
},
|
||||
close(name){
|
||||
this.$refs[name].close();
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
.login-box{
|
||||
width: 640px;
|
||||
min-height: 768px;
|
||||
background: #282627;
|
||||
box-shadow: 0px 0px 57px 0px rgba(239,131,18,0.15);
|
||||
text-align: center;
|
||||
.logos{
|
||||
width: 380px;
|
||||
height: 56px;
|
||||
margin: 48px auto;
|
||||
}
|
||||
.login_type{
|
||||
width: 541px;
|
||||
border-bottom: 1px solid #383838;
|
||||
padding:15px 0;
|
||||
margin: 0 auto;
|
||||
|
||||
.login_text{
|
||||
width: 45px;
|
||||
height: 21px;
|
||||
font-size: 21px;
|
||||
font-weight: 400;
|
||||
color: #9E9E9E;
|
||||
line-height: 32px;
|
||||
padding:25px 22px;
|
||||
cursor: pointer;
|
||||
}
|
||||
.check{
|
||||
font-size: 24px;
|
||||
color: #FFFFFF;
|
||||
}
|
||||
|
||||
}
|
||||
.login_descs{
|
||||
margin-top: 20px;
|
||||
height: 55px;
|
||||
font-size: 21px;
|
||||
font-weight: 400;
|
||||
color: #9E9E9E;
|
||||
text-align: center;
|
||||
padding: 0 60px;
|
||||
text-align: left;
|
||||
}
|
||||
.login_desc{
|
||||
margin-top: 20px;
|
||||
height: 55px;
|
||||
font-size: 21px;
|
||||
font-weight: 400;
|
||||
color: #9E9E9E;
|
||||
text-align: center;
|
||||
padding: 0 60px;
|
||||
}
|
||||
.login_bt{
|
||||
width: 85%;
|
||||
height: 53px;
|
||||
background: #383838;
|
||||
border-radius: 5px;
|
||||
line-height: 53px;
|
||||
margin: 0 auto;
|
||||
color: #9E9E9E;
|
||||
cursor: pointer;
|
||||
margin-top: 40px;
|
||||
}
|
||||
.login_bt:hover{
|
||||
background: #F48612;
|
||||
color: #ffffff;
|
||||
}
|
||||
.login_check{
|
||||
font-size: 19px;
|
||||
font-weight: 400;
|
||||
color: #9E9E9E;
|
||||
margin-top: 60px;
|
||||
}
|
||||
.login_code{
|
||||
width: 85%;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
margin:0 auto
|
||||
}
|
||||
.login_checks{
|
||||
font-size: 19px;
|
||||
font-weight: 400;
|
||||
color: #9E9E9E;
|
||||
margin-top: 10px;
|
||||
}
|
||||
.uni-checkbox-input{
|
||||
border-radius: 100% !important;
|
||||
}
|
||||
.input{
|
||||
width: 81%;
|
||||
height: 53px;
|
||||
border: 1px solid #383838;
|
||||
border-radius: 5px;
|
||||
margin: 0 auto;
|
||||
color: #ffffff;
|
||||
margin-bottom: 25px;
|
||||
text-align: left;
|
||||
padding: 0 2%;
|
||||
}
|
||||
.input2{
|
||||
width: 60%;
|
||||
height: 53px;
|
||||
border: 1px solid #383838;
|
||||
border-radius: 5px;
|
||||
color: #ffffff;
|
||||
padding: 0 2%;
|
||||
text-align: left;
|
||||
}
|
||||
.dynacode{
|
||||
width: 30%;
|
||||
height: 53px;
|
||||
background: #F48612;
|
||||
border-radius: 5px;
|
||||
color: #ffffff;
|
||||
line-height: 53px;
|
||||
cursor: pointer;
|
||||
}
|
||||
.input:hover{
|
||||
border: 1px solid #F48612;
|
||||
}
|
||||
.input2:hover{
|
||||
border: 1px solid #F48612;
|
||||
}
|
||||
.placeholder-class{
|
||||
font-size: 21px;
|
||||
font-weight: 400;
|
||||
color: #9E9E9E;
|
||||
text-align: left;
|
||||
}
|
||||
}
|
||||
.header_top{
|
||||
padding: 0 300px;
|
||||
height: 36px;
|
||||
margin: 0 auto;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
background-color: #2b2b29;
|
||||
color: #D5C6B2;
|
||||
font-size: 13px;
|
||||
letter-spacing: 1px;
|
||||
.top_r{
|
||||
width: 320px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
flex-direction: row-reverse; /* 从右到左排列 */
|
||||
letter-spacing: 0px;
|
||||
font-size: 15px;
|
||||
p{
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
}
|
||||
.headers {
|
||||
padding: 0 2%;
|
||||
height: 300px;
|
||||
margin: 0 auto;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
background-color: #140D08;
|
||||
.header-titles {
|
||||
font-size: 36px;
|
||||
font-weight: bold;
|
||||
line-height: 100px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
.logos{
|
||||
width: 1000px;
|
||||
height: 125px;
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
}
|
||||
.header {
|
||||
padding: 0 300px;
|
||||
height: 70px;
|
||||
margin: 0 auto;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
background-color: #140D08;
|
||||
.header-title {
|
||||
font-size: 36px;
|
||||
font-weight: bold;
|
||||
line-height: 100px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
.logo{
|
||||
width: 310px;
|
||||
height: 37px;
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
.apply{
|
||||
width: 113px;
|
||||
height: 34px;
|
||||
background-image: url('../../static/img/home/apply.png');
|
||||
background-size: 100%;
|
||||
font-size: 15px;
|
||||
color: #070707;
|
||||
line-height: 34px;
|
||||
text-align: center;
|
||||
font-weight: bold;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
&>ul {
|
||||
// float: right;
|
||||
// margin-left: 30px;
|
||||
&>li {
|
||||
list-style: none;
|
||||
float: left;
|
||||
position: relative;
|
||||
|
||||
a,
|
||||
span {
|
||||
display: inline-block;
|
||||
padding: 0 14px;
|
||||
font-weight: 400;
|
||||
line-height: 100px;
|
||||
font-size: 16px;
|
||||
text-decoration: none;
|
||||
color: #ffffff;
|
||||
}
|
||||
}
|
||||
|
||||
.active-hover {
|
||||
a,
|
||||
span {
|
||||
font-weight: bold;
|
||||
color: #F48612;
|
||||
}
|
||||
|
||||
// &::before {
|
||||
// content: '';
|
||||
// width: calc(100% - 40px);
|
||||
// height: 4px;
|
||||
// background-color: #1ab44d;
|
||||
// position: absolute;
|
||||
// left: 20px;
|
||||
// bottom: 20px;
|
||||
// }
|
||||
}
|
||||
}
|
||||
|
||||
.header-right {
|
||||
padding: 0 30px;
|
||||
font-size: 40px;
|
||||
height: 100px;
|
||||
line-height: 100px;
|
||||
float: right;
|
||||
.icon-caidan{
|
||||
color: #ffffff;
|
||||
}
|
||||
}
|
||||
}
|
||||
.drawer-box{
|
||||
width: 30vw;
|
||||
height: 100vh;
|
||||
background-color: #FFFFFF;
|
||||
&>ul {
|
||||
width: 100%;
|
||||
float: right;
|
||||
|
||||
&>li {
|
||||
width: 100%;
|
||||
list-style: none;
|
||||
float: left;
|
||||
position: relative;
|
||||
text-align: center;
|
||||
a,
|
||||
span {
|
||||
display: inline-block;
|
||||
padding: 0 20px;
|
||||
line-height: 150px;
|
||||
font-size: 20px;
|
||||
text-decoration: none;
|
||||
color: #000;
|
||||
}
|
||||
}
|
||||
|
||||
.active-hover {
|
||||
a,
|
||||
span {
|
||||
font-weight: bold;
|
||||
color: #F48612;
|
||||
}
|
||||
&::before {
|
||||
content: '';
|
||||
width: calc(100% - 40px);
|
||||
height: 4px;
|
||||
background-color: #F48612;
|
||||
position: absolute;
|
||||
left: 20px;
|
||||
bottom: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
</style>
|
||||
@@ -0,0 +1,218 @@
|
||||
<template>
|
||||
<view class="footer_kefu">
|
||||
<image class="kimg" @tap="toopenkf(1)" src="../../static/img/index/k1.png"></image>
|
||||
<view class="line1"></view>
|
||||
<image class="kimg" @tap="toopenkf(2)" src="../../static/img/index/k2.png"></image>
|
||||
<view class="line1"></view>
|
||||
<image class="kimg" @tap="totop()" src="../../static/img/index/k3.png"></image>
|
||||
|
||||
<view class="kefu_content" v-if="openkf==1">
|
||||
<view class="k_title">
|
||||
<text >客服</text>
|
||||
<image class="delete" @tap="openkf=0" src="../../static/img/index/close.png"></image>
|
||||
</view>
|
||||
<view class="qq">
|
||||
<image class="icon_qq" @tap="openkf=0" src="../../static/img/index/qq.png"></image>
|
||||
<view class="qqs">
|
||||
<view>QQ</view>
|
||||
<view >{{detail.qq}}</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="kine"></view>
|
||||
<view></view>
|
||||
<view class="qqss">
|
||||
<image class="icon_qq" @tap="openkf=0" src="../../static/img/index/phone.png"></image>
|
||||
<view class="qqs">
|
||||
<view>客服热线</view>
|
||||
<view >{{detail.wechat}}</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="fk_content" v-if="openkf==2">
|
||||
<view class="fk_title">
|
||||
<text >问题反馈</text>
|
||||
<image class="delete" @tap="openkf=0" src="../../static/img/index/close.png"></image>
|
||||
</view>
|
||||
|
||||
<input class="input" v-model="formData.mobile" type="text" placeholder="请输入手机号" placeholder-class="placeholder-class" maxlength="20">
|
||||
<input class="input" v-model="formData.rePassword" type="password" placeholder="请输入邮箱" placeholder-class="placeholder-class"/>
|
||||
<textarea class="fks" v-model="formData.fks" id="" cols="30" rows="10" placeholder="问题描述" placeholder-class="placeholder-class"></textarea>
|
||||
<view class="tijiao" @tap="tijao()">提交</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
|
||||
|
||||
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
data(){
|
||||
return {
|
||||
openkf: 0,
|
||||
formData:[],
|
||||
detail:[]
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.getSet();
|
||||
},
|
||||
methods:{
|
||||
tijao(){
|
||||
uni.showToast({
|
||||
icon:'none',
|
||||
title: '提交成功',
|
||||
duration:1500
|
||||
})
|
||||
this.openkf=0;
|
||||
},
|
||||
getSet(){
|
||||
this._get('game.index/setting',{
|
||||
},res=>{
|
||||
this.detail = res.data.set;
|
||||
// console.log(this.set,22)
|
||||
});
|
||||
},
|
||||
toopenkf(e){
|
||||
if(this.openkf!=e){
|
||||
this.openkf=e;
|
||||
}else{
|
||||
this.openkf=0;
|
||||
}
|
||||
},
|
||||
totop(){
|
||||
window.scrollTo({
|
||||
top: 0,
|
||||
behavior: 'smooth'
|
||||
});
|
||||
//document.body.scrollTop = document.documentElement.scrollTop = 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
.kefu_content{
|
||||
width: 249px;
|
||||
height: 249px;
|
||||
background: #FFFFFF;
|
||||
position: fixed;
|
||||
right: 110px;
|
||||
bottom: 166px;
|
||||
.qq{
|
||||
display: flex;
|
||||
padding: 30px 24px 21px 24px;
|
||||
}
|
||||
.qqss{
|
||||
display: flex;
|
||||
padding: 21px 24px 30px 24px;
|
||||
}
|
||||
.icon_qq{
|
||||
width: 17px;
|
||||
height: 17px;
|
||||
margin-right: 10px;
|
||||
margin-top: 8px;
|
||||
}
|
||||
.qqs{
|
||||
font-size: 21px;
|
||||
font-weight: 400;
|
||||
color: #333333;
|
||||
}
|
||||
.k_title{
|
||||
padding: 0 24px;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
height: 43px;
|
||||
background: #F48612;
|
||||
color: #FFFFFF;
|
||||
font-size: 21px;
|
||||
.delete{
|
||||
width: 19px;
|
||||
height: 19px;
|
||||
}
|
||||
}
|
||||
|
||||
.kine{
|
||||
width: 201px;
|
||||
border-bottom: 1px solid #EAEAEA;
|
||||
margin: 0 auto;
|
||||
}
|
||||
}
|
||||
.fk_content{
|
||||
width: 376px;
|
||||
height: 551px;
|
||||
background: #FFFFFF;
|
||||
position: fixed;
|
||||
right: 110px;
|
||||
bottom: 66px;
|
||||
.fk_title{
|
||||
padding: 0 24px;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
height: 43px;
|
||||
background: #F48612;
|
||||
color: #FFFFFF;
|
||||
font-size: 21px;
|
||||
.delete{
|
||||
width: 19px;
|
||||
height: 19px;
|
||||
}
|
||||
}
|
||||
.input{
|
||||
width: 305px;
|
||||
height: 43px;
|
||||
background: #FFFFFF;
|
||||
border: 1px solid #EAEAEA;
|
||||
border-radius: 5px;
|
||||
margin: 31px auto;
|
||||
padding: 0 12px;
|
||||
}
|
||||
.fks{
|
||||
width: 305px;
|
||||
height: 193px;
|
||||
background: #FFFFFF;
|
||||
border: 1px solid #EAEAEA;
|
||||
border-radius: 5px;
|
||||
margin: 0 auto;
|
||||
padding: 12px;
|
||||
}
|
||||
.tijiao{
|
||||
width: 329px;
|
||||
height: 43px;
|
||||
background: #F48612;
|
||||
border-radius: 5px;
|
||||
margin: 0 auto;
|
||||
color: #ffffff;
|
||||
text-align: center;
|
||||
line-height:43px;
|
||||
margin-top: 30px;
|
||||
}
|
||||
}
|
||||
.footer_kefu{
|
||||
display: none !important;
|
||||
width: 96px;
|
||||
height: 307px;
|
||||
background: #000000;
|
||||
position: fixed;
|
||||
right: 0;
|
||||
bottom: 108px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: space-evenly;
|
||||
cursor: pointer;
|
||||
.line1{
|
||||
width: 69px;
|
||||
border-bottom: 1px solid #565656;
|
||||
}
|
||||
.kimg{
|
||||
width: 50px;
|
||||
height: 50px;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
</style>
|
||||
@@ -0,0 +1,74 @@
|
||||
<template>
|
||||
<view>
|
||||
<Header :index="index" :name="detail.name"></Header>
|
||||
<Banner :banner="banner" :img="img" :imgs="imgs" :titles="titles" :title_content="title_content"></Banner>
|
||||
<slot/>
|
||||
<Footer :data="detail"></Footer>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import Header from './header.vue';
|
||||
import Banner from './banner.vue';
|
||||
import Footer from './footer.vue';
|
||||
export default {
|
||||
props:{
|
||||
index:{
|
||||
type: Number,
|
||||
default: 0
|
||||
},
|
||||
banner:{
|
||||
type: Number,
|
||||
default: 0
|
||||
},
|
||||
img: {
|
||||
default: '',
|
||||
},
|
||||
imgs: {
|
||||
default: '',
|
||||
},
|
||||
titles: {
|
||||
default: '',
|
||||
},
|
||||
title_content: {
|
||||
default: '',
|
||||
},
|
||||
},
|
||||
components:{
|
||||
Header,
|
||||
Banner,
|
||||
Footer,
|
||||
},
|
||||
data(){
|
||||
return {
|
||||
detail:{
|
||||
name: '',
|
||||
},
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.getSet();
|
||||
},
|
||||
methods:{
|
||||
// getData(){
|
||||
// this._get('cms.cms/index',{
|
||||
|
||||
// },res=>{
|
||||
// this.detail = res.data.data;
|
||||
// this.$emit('aboutData',this.detail);
|
||||
// })
|
||||
// }
|
||||
getSet(){
|
||||
this._get('game.index/setting',{
|
||||
},res=>{
|
||||
this.detail = res.data.set;
|
||||
// console.log(this.set,22)
|
||||
});
|
||||
},
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
|
||||
</style>
|
||||
@@ -0,0 +1,87 @@
|
||||
<template>
|
||||
<view>
|
||||
<Header :index="index" :name="detail.name" v-if="!isMobile"></Header>
|
||||
<slot/>
|
||||
<Footer :data="detail" v-if="!isMobile"></Footer>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import Header from './header.vue';
|
||||
import Footer from './footer.vue';
|
||||
export default {
|
||||
props:{
|
||||
index:{
|
||||
type: Number,
|
||||
default: 0
|
||||
},
|
||||
banner:{
|
||||
type: Number,
|
||||
default: 0
|
||||
},
|
||||
img: {
|
||||
default: '',
|
||||
},
|
||||
imgs: {
|
||||
default: '',
|
||||
},
|
||||
titles: {
|
||||
default: '',
|
||||
},
|
||||
title_content: {
|
||||
default: '',
|
||||
},
|
||||
|
||||
},
|
||||
components:{
|
||||
Header,
|
||||
Footer,
|
||||
},
|
||||
data(){
|
||||
return {
|
||||
detail:{
|
||||
name: '',
|
||||
},
|
||||
isMobile:false
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.getSet();
|
||||
|
||||
},
|
||||
mounted() {
|
||||
this.checkIsMobile();
|
||||
window.addEventListener("resize", this.checkIsMobile);
|
||||
},
|
||||
beforeDestroy() {
|
||||
window.removeEventListener("resize", this.checkIsMobile);
|
||||
},
|
||||
methods:{
|
||||
checkIsMobile() {
|
||||
const width = window.innerWidth;
|
||||
const height = window.innerHeight;
|
||||
const mobileWidth = 768; // 可以根据需要调整这个值
|
||||
this.isMobile = width <= mobileWidth || height <= mobileWidth;
|
||||
},
|
||||
// getData(){
|
||||
// this._get('cms.cms/index',{
|
||||
|
||||
// },res=>{
|
||||
// this.detail = res.data.data;
|
||||
// this.$emit('aboutData',this.detail);
|
||||
// })
|
||||
// }
|
||||
getSet(){
|
||||
this._get('game.index/setting',{
|
||||
},res=>{
|
||||
this.detail = res.data.set;
|
||||
// console.log(this.set,22)
|
||||
});
|
||||
},
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
|
||||
</style>
|
||||
@@ -0,0 +1,84 @@
|
||||
<template>
|
||||
<view>
|
||||
<Header :index="index" :name="detail.name" v-if="!isMobile"></Header>
|
||||
<slot/>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import Header from './headerNo.vue';
|
||||
export default {
|
||||
props:{
|
||||
index:{
|
||||
type: Number,
|
||||
default: 0
|
||||
},
|
||||
banner:{
|
||||
type: Number,
|
||||
default: 0
|
||||
},
|
||||
img: {
|
||||
default: '',
|
||||
},
|
||||
imgs: {
|
||||
default: '',
|
||||
},
|
||||
titles: {
|
||||
default: '',
|
||||
},
|
||||
title_content: {
|
||||
default: '',
|
||||
},
|
||||
|
||||
},
|
||||
components:{
|
||||
Header,
|
||||
},
|
||||
data(){
|
||||
return {
|
||||
detail:{
|
||||
name: '',
|
||||
},
|
||||
isMobile:false
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.getSet();
|
||||
|
||||
},
|
||||
mounted() {
|
||||
this.checkIsMobile();
|
||||
window.addEventListener("resize", this.checkIsMobile);
|
||||
},
|
||||
beforeDestroy() {
|
||||
window.removeEventListener("resize", this.checkIsMobile);
|
||||
},
|
||||
methods:{
|
||||
checkIsMobile() {
|
||||
const width = window.innerWidth;
|
||||
const height = window.innerHeight;
|
||||
const mobileWidth = 768; // 可以根据需要调整这个值
|
||||
this.isMobile = width <= mobileWidth || height <= mobileWidth;
|
||||
},
|
||||
// getData(){
|
||||
// this._get('cms.cms/index',{
|
||||
|
||||
// },res=>{
|
||||
// this.detail = res.data.data;
|
||||
// this.$emit('aboutData',this.detail);
|
||||
// })
|
||||
// }
|
||||
getSet(){
|
||||
this._get('game.index/setting',{
|
||||
},res=>{
|
||||
this.detail = res.data.set;
|
||||
// console.log(this.set,22)
|
||||
});
|
||||
},
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
|
||||
</style>
|
||||
@@ -0,0 +1,87 @@
|
||||
<template>
|
||||
<view>
|
||||
<Header :index="index" :name="detail.name"></Header>
|
||||
<slot/>
|
||||
<Footer :data="detail" ></Footer>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import Header from './header.vue';
|
||||
import Footer from './footer.vue';
|
||||
export default {
|
||||
props:{
|
||||
index:{
|
||||
type: Number,
|
||||
default: 0
|
||||
},
|
||||
banner:{
|
||||
type: Number,
|
||||
default: 0
|
||||
},
|
||||
img: {
|
||||
default: '',
|
||||
},
|
||||
imgs: {
|
||||
default: '',
|
||||
},
|
||||
titles: {
|
||||
default: '',
|
||||
},
|
||||
title_content: {
|
||||
default: '',
|
||||
},
|
||||
|
||||
},
|
||||
components:{
|
||||
Header,
|
||||
Footer,
|
||||
},
|
||||
data(){
|
||||
return {
|
||||
detail:{
|
||||
name: '',
|
||||
},
|
||||
isMobile:false
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.getSet();
|
||||
|
||||
},
|
||||
mounted() {
|
||||
this.checkIsMobile();
|
||||
window.addEventListener("resize", this.checkIsMobile);
|
||||
},
|
||||
beforeDestroy() {
|
||||
window.removeEventListener("resize", this.checkIsMobile);
|
||||
},
|
||||
methods:{
|
||||
checkIsMobile() {
|
||||
const width = window.innerWidth;
|
||||
const height = window.innerHeight;
|
||||
const mobileWidth = 768; // 可以根据需要调整这个值
|
||||
this.isMobile = width <= mobileWidth || height <= mobileWidth;
|
||||
},
|
||||
// getData(){
|
||||
// this._get('cms.cms/index',{
|
||||
|
||||
// },res=>{
|
||||
// this.detail = res.data.data;
|
||||
// this.$emit('aboutData',this.detail);
|
||||
// })
|
||||
// }
|
||||
getSet(){
|
||||
this._get('game.index/setting',{
|
||||
},res=>{
|
||||
this.detail = res.data.set;
|
||||
// console.log(this.set,22)
|
||||
});
|
||||
},
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
|
||||
</style>
|
||||
@@ -0,0 +1,156 @@
|
||||
<template>
|
||||
<view>
|
||||
<el-row class="tac">
|
||||
<el-col >
|
||||
<el-menu
|
||||
:default-active="index"
|
||||
class="el-menu-vertical-demo"
|
||||
@open="handleOpen"
|
||||
@close="handleClose"
|
||||
background-color="#ffffff"
|
||||
text-color="#3D3D3D"
|
||||
active-text-color="#F6773C">
|
||||
<el-menu-item @tap="goPath({url: 'member'})" >
|
||||
<!-- <i class="el-icon-user" :class="{'active-color':index=='1'}"></i> -->
|
||||
<image class="zsimg" src="../../static/img/member/uiconx.png" v-if="index=='1'"></image>
|
||||
<image class="zsimg" src="../../static/img/member/uicon.png" v-else></image>
|
||||
<span slot="title" class="tt" :class="{'active-color':index=='1'}">用户信息</span>
|
||||
</el-menu-item>
|
||||
<el-menu-item @tap="goPath({url: 'digital_assets'})" >
|
||||
<!-- <i class="el-icon-data-line" :class="{'active-color':index=='2'}"></i> -->
|
||||
<image class="zsimg" src="../../static/img/member/dj.png" v-if="index=='2'"></image>
|
||||
<image class="zsimg" src="../../static/img/member/djx.png" v-else></image>
|
||||
<span slot="title" class="tt" :class="{'active-color':index=='2'}">装备道具资产确权</span>
|
||||
</el-menu-item>
|
||||
<el-menu-item @tap="goPath({url: 'asset_list'})" >
|
||||
<!-- <i class="el-icon-data-analysis" :class="{'active-color':index=='3'}"></i> -->
|
||||
<image class="zsimg" src="../../static/img/member/qq.png" v-if="index=='3'"></image>
|
||||
<image class="zsimg" src="../../static/img/member/qqx.png" v-else></image>
|
||||
<span slot="title" class="tt" :class="{'active-color':index=='3'}">游戏产品评估确权</span>
|
||||
</el-menu-item>
|
||||
<el-menu-item @tap="goPath({url: 'pay_list'})" >
|
||||
<!-- <i class="el-icon-data-analysis" :class="{'active-color':index=='3'}"></i> -->
|
||||
<image class="zsimg" src="../../static/img/member/fkx.png" v-if="index=='4'"></image>
|
||||
<image class="zsimg" src="../../static/img/member/fk.png" v-else></image>
|
||||
<span slot="title" class="tt" :class="{'active-color':index=='4'}">付款记录</span>
|
||||
</el-menu-item>
|
||||
<el-menu-item @tap="goPath({url: 'notice_list'})" >
|
||||
<!-- <i class="el-icon-data-analysis" :class="{'active-color':index=='3'}"></i> -->
|
||||
<image class="zsimg" src="../../static/img/member/tz.png" v-if="index=='5'"></image>
|
||||
<image class="zsimg" src="../../static/img/member/tzx.png" v-else></image>
|
||||
<span slot="title" class="tt" :class="{'active-color':index=='5'}">平台通知</span>
|
||||
</el-menu-item>
|
||||
|
||||
|
||||
|
||||
<!-- <el-submenu index="2">
|
||||
<template slot="title">
|
||||
<i class="el-icon-data-line" :class="{'active-color':index=='2'}" ></i>
|
||||
<span :class="{'active-color':index=='2'}" class="tt">游戏资产评估</span>
|
||||
</template>
|
||||
<el-menu-item-group>
|
||||
<el-menu-item index="2" style="width: 100%;" @tap="goPath({url: 'asset_list'})">
|
||||
<span class="active-colors" :class="{'active-color':index=='2'}" > 资产列表</span>
|
||||
</el-menu-item>
|
||||
</el-menu-item-group>
|
||||
</el-submenu>
|
||||
<el-submenu index="3">
|
||||
<template slot="title">
|
||||
<i class="el-icon-data-analysis" :class="{'active-color':index=='3'}" ></i>
|
||||
<span :class="{'active-color':index=='3'}" class="tt">数字资产确权</span>
|
||||
</template>
|
||||
<el-menu-item-group>
|
||||
<el-menu-item index="3" style="width: 100%;" @tap="goPath({url: 'digital_assets'})">
|
||||
<span class="active-colors" :class="{'active-color':index=='3'}" > 资产列表</span>
|
||||
</el-menu-item>
|
||||
</el-menu-item-group>
|
||||
</el-submenu> -->
|
||||
</el-menu>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
props:{
|
||||
index:{
|
||||
type: String,
|
||||
default: 1
|
||||
},
|
||||
},
|
||||
data(){
|
||||
return {
|
||||
detail:{
|
||||
name: '',
|
||||
},
|
||||
isMobile:false
|
||||
}
|
||||
},
|
||||
created() {
|
||||
},
|
||||
mounted() {
|
||||
this.checkIsMobile();
|
||||
window.addEventListener("resize", this.checkIsMobile);
|
||||
},
|
||||
beforeDestroy() {
|
||||
window.removeEventListener("resize", this.checkIsMobile);
|
||||
},
|
||||
methods:{
|
||||
goPath(e) {
|
||||
const path = this.$route.path;
|
||||
// const query = this.$route.query;
|
||||
if(path=='/'+e.url){
|
||||
return;
|
||||
}
|
||||
if(e.url.includes("http")){
|
||||
window.open(e.url, '_blank');
|
||||
// window.location.href = '';
|
||||
}
|
||||
else{
|
||||
this.$router.replace({
|
||||
path: e.url
|
||||
});
|
||||
}
|
||||
},
|
||||
checkIsMobile() {
|
||||
const width = window.innerWidth;
|
||||
const height = window.innerHeight;
|
||||
const mobileWidth = 768; // 可以根据需要调整这个值
|
||||
this.isMobile = width <= mobileWidth || height <= mobileWidth;
|
||||
},
|
||||
handleOpen(key, keyPath) {
|
||||
console.log(key, keyPath,2222);
|
||||
},
|
||||
handleClose(key, keyPath) {
|
||||
console.log(key, keyPath,3333);
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
.active-color{
|
||||
color: #F6773C !important;
|
||||
}
|
||||
.active-colors{
|
||||
color: #333333;
|
||||
}
|
||||
.tt{
|
||||
font-weight: 500;
|
||||
}
|
||||
.el-submenu .el-menu-item{
|
||||
padding-left:48px !important;
|
||||
min-width: auto !important;
|
||||
}
|
||||
::v-deep.el-submenu__icon-arrow{
|
||||
margin-top:-3px !important
|
||||
}
|
||||
.zsimg{
|
||||
width: 18px;
|
||||
height: 18px;
|
||||
margin-right: 12px;
|
||||
margin-top: 1px;
|
||||
}
|
||||
|
||||
</style>
|
||||
@@ -0,0 +1,335 @@
|
||||
<template>
|
||||
<view class="pay-container">
|
||||
<view class="pay_title">请扫码付款</view>
|
||||
<!-- 支付方式切换 -->
|
||||
<view class="tab-wrap">
|
||||
<view
|
||||
:class="['tab-item', payType === 'alipay' ? 'active' : '']"
|
||||
@tap="handlePayTypeChange('alipay')"
|
||||
>
|
||||
<image src="../../static/img/member/zfbx.png" class="pay-icon" v-if="payType==='alipay'"/>
|
||||
<image src="../../static/img/member/zfb.png" class="pay-icon" v-else/>
|
||||
<text>支付宝</text>
|
||||
</view>
|
||||
<view
|
||||
:class="['tab-item', payType === 'wechat' ? 'active' : '']"
|
||||
@tap="handlePayTypeChange('wechat')"
|
||||
>
|
||||
<image src="../../static/img/member/wxx.png" class="pay-icon" v-if="payType==='wechat'" />
|
||||
<image src="../../static/img/member/wx.png" class="pay-icon" v-else/>
|
||||
<text>微信</text>
|
||||
</view>
|
||||
</view>
|
||||
<!-- 二维码区 -->
|
||||
<view class="qr-section">
|
||||
<image
|
||||
:src="alipayQrcode"
|
||||
class="qr-img"
|
||||
mode="aspectFit"
|
||||
alt="扫码二维码"
|
||||
/>
|
||||
<view class="tip">
|
||||
<span v-if="leftSeconds > 0">
|
||||
剩余支付时间：
|
||||
<span class="countdown">
|
||||
{{ Math.floor(leftSeconds / 60) }}:{{ (leftSeconds % 60).toString().padStart(2, '0') }}
|
||||
</span>
|
||||
</span>
|
||||
<span v-else>
|
||||
二维码已过期，请刷新页面获取新的二维码。
|
||||
</span>
|
||||
<br/>
|
||||
</view>
|
||||
</view>
|
||||
<!-- 售后说明区 -->
|
||||
<view class="after-sale">
|
||||
<view class="as-title">售后说明</view>
|
||||
<view class="as-item">付款后1个工作日内出具评估报告，报告可下载。</view>
|
||||
<view class="as-item">可申请退款售后，每笔订单只可申请一次退款。</view>
|
||||
<view class="as-item">我们将跟踪贷款业务结果，贷款未成功将自动退款。</view>
|
||||
<view class="as-item">客服电话：400-xxxx-xxxx</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
props: {
|
||||
orderId: {
|
||||
type: [String, Number],
|
||||
required: true
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
payType: 'alipay', // 当前选择的支付方式
|
||||
alipayQrcode: require('../../static/img/member/code.png'),
|
||||
qrcodeLoaded: false,
|
||||
endtime: 0, // 服务器返回的结束时刻(时间戳,秒)
|
||||
leftSeconds: 0,
|
||||
order_no: '',
|
||||
payTimer: null, // 定时查询支付状态的timer
|
||||
countdownTimer: null // 倒计时timer
|
||||
};
|
||||
},
|
||||
watch: {
|
||||
orderId: {
|
||||
immediate: true,
|
||||
handler(newVal) {
|
||||
// 当 orderId 变化时重新拉取二维码
|
||||
if (newVal) {
|
||||
this.resetTimers();
|
||||
this.qrcodeLoaded = false;
|
||||
this.alipayQrcode = require('../../static/img/member/code.png');
|
||||
this.leftSeconds = 0;
|
||||
this.endtime = 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
created() {
|
||||
// 组件加载时自动拉取 orderId 的二维码
|
||||
if (this.orderId) {
|
||||
this.getQrcode('alipay');
|
||||
}
|
||||
},
|
||||
beforeDestroy() {
|
||||
// 组件销毁时，清理所有定时器
|
||||
this.resetTimers();
|
||||
},
|
||||
methods: {
|
||||
resetTimers() {
|
||||
if (this.payTimer) {
|
||||
clearInterval(this.payTimer);
|
||||
this.payTimer = null;
|
||||
}
|
||||
if (this.countdownTimer) {
|
||||
clearInterval(this.countdownTimer);
|
||||
this.countdownTimer = null;
|
||||
}
|
||||
},
|
||||
async handlePayTypeChange(type) {
|
||||
if (this.payType === type) return; // 避免重复拉取
|
||||
this.payType = type;
|
||||
this.resetTimers();
|
||||
this.leftSeconds = 0;
|
||||
this.endtime = 0;
|
||||
this.alipayQrcode = require('../../static/img/member/code.png');
|
||||
this.getQrcode(type);
|
||||
},
|
||||
// 切换支付方式时，调用后端接口获取二维码
|
||||
async getQrcode(type) {
|
||||
if (!this.orderId) return;
|
||||
|
||||
this.resetTimers(); // 切换支付方式/刷新二维码前先清理所有定时器
|
||||
|
||||
this._post(
|
||||
'/asset.Asset/pay',
|
||||
{
|
||||
pay_type: type === 'alipay' ? 30 : 20,
|
||||
id: this.orderId
|
||||
},
|
||||
res => {
|
||||
// 正常会有服务端传回支付二维码、截止时间、订单号
|
||||
this.alipayQrcode = res.data.qr_code_url;
|
||||
this.order_no = res.data.order_no;
|
||||
// 假设服务端返回剩余秒数，推荐直接返回leftSeconds，否则自己算
|
||||
// 兼容两种情况：res.data.leftSeconds 或 res.data.pay_end_time
|
||||
if (typeof res.data.leftSeconds !== 'undefined') {
|
||||
this.leftSeconds = res.data.leftSeconds;
|
||||
this.endtime = Math.floor(Date.now() / 1000) + this.leftSeconds;
|
||||
} else if (typeof res.data.pay_end_time !== 'undefined') {
|
||||
this.endtime = res.data.pay_end_time;
|
||||
this.leftSeconds = this.endtime - Math.floor(Date.now() / 1000);
|
||||
} else {
|
||||
// fallback，3分钟过期
|
||||
this.leftSeconds = 180;
|
||||
this.endtime = Math.floor(Date.now() / 1000) + 180;
|
||||
}
|
||||
this.startCountdownAndPayCheck();
|
||||
},
|
||||
err => {
|
||||
this.resetTimers();
|
||||
// 生成失败时隐藏支付弹窗并提示
|
||||
this.$emit('close'); // 通知父组件关闭弹窗
|
||||
const msg = (err && err.data && err.data.msg) ? err.data.msg : '获取二维码失败';
|
||||
this.$message.error(msg);
|
||||
}
|
||||
);
|
||||
},
|
||||
startCountdownAndPayCheck() {
|
||||
// 安全起见再次清理
|
||||
this.resetTimers();
|
||||
|
||||
// 设置倒计时定时器，精确倒计时
|
||||
this.countdownTimer = setInterval(() => {
|
||||
if (this.leftSeconds > 0) {
|
||||
this.leftSeconds -= 1;
|
||||
}
|
||||
if (this.leftSeconds <= 0) {
|
||||
this.leftSeconds = 0;
|
||||
this.resetTimers();
|
||||
// 自动关闭弹窗
|
||||
this.$emit('close');
|
||||
this.$message.error('二维码已过期，请刷新页面获取新的二维码。');
|
||||
}
|
||||
}, 1000);
|
||||
|
||||
// 设置支付状态查询定时器
|
||||
this.payTimer = setInterval(() => {
|
||||
if (this.order_no && this.leftSeconds > 0) {
|
||||
this._post(
|
||||
'/asset.Asset/payStatus',
|
||||
{
|
||||
order_no: this.order_no
|
||||
},
|
||||
res => {
|
||||
// 如果支付成功，根据业务逻辑刷新页面/跳转/弹窗...
|
||||
if (res.data && res.data.pay_status === 20) {
|
||||
this.resetTimers();
|
||||
this.$emit('pay-success', this.order_no);
|
||||
this.$message.success('支付成功');
|
||||
//支付成功后关闭弹窗，强制刷新页面
|
||||
this.$emit('close');
|
||||
this.$nextTick(() => {
|
||||
window.location.reload();
|
||||
});
|
||||
}
|
||||
// 若未支付则轮询，不需要额外处理
|
||||
},
|
||||
err => {
|
||||
// 支付状态查询失败，也需要轮询，不紧急关闭
|
||||
// 但你可以根据实际业务在失败次数过多时终止（此处只做错误提示）
|
||||
// this.$message.error('支付状态查询失败');
|
||||
}
|
||||
);
|
||||
}
|
||||
}, 3000);
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
.pay-container {
|
||||
width: 65vh;
|
||||
margin: 0 auto;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
margin-top: -30px;
|
||||
}
|
||||
.pay_title{
|
||||
font-family: Source Han Sans, Source Han Sans;
|
||||
font-weight: 700;
|
||||
font-size: 18px;
|
||||
color: #3D3D3D;
|
||||
line-height: 22px;
|
||||
text-align: center;
|
||||
font-style: normal;
|
||||
text-transform: none;
|
||||
margin-bottom: 24px;
|
||||
}
|
||||
.tab-wrap {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
margin-bottom: 28px;
|
||||
.tab-item {
|
||||
width: 50%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
font-size: 19px;
|
||||
font-family: Source Han Sans, Source Han Sans;
|
||||
font-weight: 400;
|
||||
font-size: 16px;
|
||||
color: #767676;
|
||||
border-radius: 6px 6px 0 0;
|
||||
padding: 12px 38px;
|
||||
cursor: pointer;
|
||||
border-bottom: 2px solid #e4e4e4;
|
||||
.pay-icon {
|
||||
width: 18px;
|
||||
height: 18px;
|
||||
margin-right: 8px;
|
||||
}
|
||||
}
|
||||
.tab-item:last-child {
|
||||
margin-right: 0;
|
||||
}
|
||||
.tab-item.active {
|
||||
border-bottom: 2px solid #f48612;
|
||||
box-shadow: 0 6px 18px 0 rgba(244, 134, 18, 0.04);
|
||||
font-family: Source Han Sans, Source Han Sans;
|
||||
font-weight: 500;
|
||||
font-size: 16px;
|
||||
color: #F78A30;
|
||||
line-height: 22px;
|
||||
}
|
||||
}
|
||||
|
||||
.qr-section {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
margin-bottom: 24px;
|
||||
.qr-img {
|
||||
width: 160px;
|
||||
height: 160px;
|
||||
border: 1px solid #f2f2f2;
|
||||
border-radius: 8px;
|
||||
background: #fcfcfc;
|
||||
margin-bottom: 14px;
|
||||
}
|
||||
.remark {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
font-size: 16px;
|
||||
color: #666;
|
||||
margin-bottom: 15px;
|
||||
.remark-icon {
|
||||
width: 18px;
|
||||
height: 18px;
|
||||
margin-right: 7px;
|
||||
}
|
||||
text {
|
||||
font-size: 16px;
|
||||
}
|
||||
}
|
||||
.tip {
|
||||
width: 100%;
|
||||
text-align: center;
|
||||
font-family: Source Han Sans, Source Han Sans;
|
||||
font-weight: 400;
|
||||
font-size: 12px;
|
||||
color: #767676;
|
||||
line-height: 22px;
|
||||
margin-top: 2px;
|
||||
}
|
||||
}
|
||||
|
||||
.after-sale {
|
||||
width: 100%;
|
||||
padding: 20px 0 0 0;
|
||||
.as-title {
|
||||
margin-bottom: 7px;
|
||||
font-family: Source Han Sans, Source Han Sans;
|
||||
font-weight: 500;
|
||||
font-size: 14px;
|
||||
color: #3D3D3D;
|
||||
}
|
||||
.as-item {
|
||||
margin-bottom: 4px;
|
||||
font-family: Source Han Sans, Source Han Sans;
|
||||
font-weight: 400;
|
||||
font-size: 12px;
|
||||
color: #767676;
|
||||
line-height: 22px;
|
||||
text-align: left;
|
||||
}
|
||||
}
|
||||
|
||||
/* 可以根据实际图片和页面风格微调样式 */
|
||||
</style>
|
||||
Reference in New Issue
Block a user