Skip to content

N
newLive
Commit 834c050c authored by mengqr's avatar mengqr
Browse files
Options

修改直播卡片问题

parent 3ffebbdf
Hide whitespace changes
Inline Side-by-side
Showing with 1230 additions and 13921 deletions
package-lock.json
View file @ 834c050c
This source diff could not be displayed because it is too large. You can view the blob instead.
package.json
View file @ 834c050c
......@@ -11,6 +11,7 @@
"@liveqing/liveplayer": "^2.7.0",
"axios": "^1.1.3",
"core-js": "^3.8.3",
"html2canvas": "^1.4.1",
"jquery": "^3.6.1",
"js-md5": "^0.7.3",
"mint-ui": "^2.2.13",
......
src/axios/request.js
View file @ 834c050c
......@@ -9,9 +9,9 @@ const appName = "test5"
const IS_PROD = ["production", "prod"].includes(process.env.NODE_ENV);
// 接口路径
const BASEURL_TEST = 'https://api.douniu8.com'
const BASEURL_TEST = 'https://test6.douniu8.com'
// const BASEURL_TEST = 'http://39.105.193.58:8081'
const BASEURL_PROD = 'https://api.douniu8.com'
const BASEURL_PROD = 'https://test6.douniu8.com'
const CONTRACT_TEST = 'http://47.95.140.89:9090'
const CONTRACT_PROD = 'http://ht.douniu8.com:9090'
const baseURL = IS_PROD ? BASEURL_PROD : BASEURL_TEST;
......
src/components/plugin/shareCard.vue
View file @ 834c050c
<template>
<div class="body">
<img class="share-img" @click="clickShare()" src="../../common/img/share.png" alt="">
<div v-if="ifShow">
<img v-if="ifPhoto" :src="photoImg" class="photo-img" alt="">
<div v-if="ifShow" class="myImagePass" id="myImage">
<div >
<img v-if="checkType==0" class="style-one" src="../../common/img/card-style-One.png" alt="">
<img v-if="checkType==1" class="style-one" src="../../common/img/card-style-Two.png" alt="">
<img v-if="checkType==2" class="style-one" src="../../common/img/card-style-Three.png" alt="">
<img class="pressShare" src="../../common/img/pressShare.png" alt="">
<img class="shareTips" v-if="ifTips" @click="clickTips()" src="../../common/img/shareTips.png" alt="">
<!-- 信息样式 -->
<div v-if="checkType==0">
<img class="headImg" :src="headPro" alt="">
......@@ -46,7 +49,14 @@
:logoScale="0.2">
</vue-qr>
</div>
</div>
</div>
<div v-if="ifShow">
<img class="pressShare" src="../../common/img/pressShare.png" alt="">
<img class="shareTips" v-if="ifTips" @click="clickTips()" src="../../common/img/shareTips.png" alt="">
<div class="bottom-countent">
<div @click="checkImg(0)" :class="{smallOneRed:checkType==0,smallOne:checkType!=0}">
<img class="small-img" src="../../common/img/thumbnail-One.png" alt="">
......@@ -81,6 +91,7 @@
<script>
import VueQr from 'vue-qr'
import html2canvas from "html2canvas";
export default {
name: 'shareCard',
components:{
......@@ -98,8 +109,9 @@ export default {
checkType:0,
copyContent:window.location.href,//需要复制的内容
ifShow:false,
ifPhoto:false,//显示拍照图片
imgUrl: 'https://baidu.com',//二维码地址
photoImg:'',//拍照图片
headPro:'',//头像图片
udName:'',//主播名称
lvrImg:'',//占位图
......@@ -110,7 +122,7 @@ export default {
created() {
this.liveList()
// this.getMessage()
},
......@@ -118,6 +130,11 @@ export default {
methods: {
checkImg(e){
this.checkType=e
this.ifPhoto=false
//延时拍照
setTimeout(() => {
this.saveImage()
}, 1000);
},
onCopy({value}){
// console.log('success',value);
......@@ -126,6 +143,125 @@ export default {
console.log('复制成功')
},
//直播详情
liveList(){
let temp=this.qs.stringify({
pmAppVersion:'884',
pmModel:'iPhone 12/13 (Pro)',
pmSystem:'iOS 10.0.1',
// timestamp:this.timestamp,
lvrId:this.$route.query.lvrId,
pmOperator:'无运营商'
})
this.server.live.liveDetail(temp).then(res=>{
let photo=res.data.data.udPhotoFileid
let boxImg=res.data.data.lvrImgLargeUrl
// this.headPro=res.data.data.udPhotoFileid//头像图片
this.udName=res.data.data.udNickname//主播名称
// this.lvrImg=res.data.data.lvrImgLargeUrl//占位图
this.liveName=res.data.data.lvrName//房间名称
this.imgUrl=window.location.href//二维码地址
this.urlTobase64(photo)
this.urlTobaseTwo64(boxImg)
})
},
//截取图片
saveImage() {
// let aaa=this.urlTobase64(this.coverImg)
// console.log("的撒发生",aaa) // 最终拿到的base64值
let aca=document.querySelector("#myImage")
console.log('萨芬',aca)
html2canvas(document.querySelector("#myImage"),{
useCORS: true, //这个为true代表允许跨域
allowTaint: false,
logging: false,
letterRendering: true,
// width:window.screen.availWidth,
// height:window.screen.availHeight,
// windowWidth:document.body.scrollWidth,
// windowHeight:document.body.scrollHeight,
// x:0,
// y:window.pageYOffset
}).then((canvas) => {
// var image = canvas.toDataURL("image/png").replace("image/png", "image/octet-stream");
console.log("案说法",canvas.toDataURL())
this.photoImg=canvas.toDataURL()
if(this.photoImg){
this.ifPhoto=true
}else{
this.ifPhoto=false
}
// var link = document.getElementById("link");
// link.setAttribute("download", "海报.png");
// link.setAttribute("href", canvas.toDataURL("image/png").replace("image/png", "image/octet-stream"));
// link.click();
})
},
//转换图片
urlTobase64(url) {
var that = this
var img = new Image()
img.src = url + '?time=' + new Date().valueOf() // 加上时间结尾，处理缓存
//支持http跨域图片。需要后端设置图片支持跨域为*(如果后端不处理，加上这行会无法显示图片，导致拿不到base64)
img.setAttribute('crossOrigin', '*')
if (url) {
img.onload = function() {
var base64Url = that.getBase64Image(img)
console.log("的撒发生",base64Url) // 最终拿到的base64值
that.headPro=base64Url
}
}
},
//转换图片
urlTobaseTwo64(url) {
var that = this
var img = new Image()
img.src = url + '?time=' + new Date().valueOf() // 加上时间结尾，处理缓存
//支持http跨域图片。需要后端设置图片支持跨域为*(如果后端不处理，加上这行会无法显示图片，导致拿不到base64)
img.setAttribute('crossOrigin', '*')
if (url) {
img.onload = function() {
var base64Url = that.getBase64ImageTwo(img)
that.lvrImg=base64Url
console.log("的撒发生",base64Url) // 最终拿到的base64值
}
}
},
//转换图片
getBase64Image(img) {
var canvas = document.createElement('canvas')
canvas.width = img.width
canvas.height = img.height
var ctx = canvas.getContext('2d')
ctx.drawImage(img, 0, 0, img.width, img.height)
const dataURL = canvas.toDataURL('image/jpeg') // 可根据图片后缀，动态变换如 image/png
return dataURL
},
//转换图片
getBase64ImageTwo(img) {
var canvas = document.createElement('canvas')
canvas.width = img.width
canvas.height = img.height
var ctx = canvas.getContext('2d')
ctx.drawImage(img, 0, 0, img.width, img.height)
const dataURL = canvas.toDataURL('image/jpeg') // 可根据图片后缀，动态变换如 image/png
return dataURL
},
onError({value}){
// console.log('error',value)
// console.log('复制成功')
......@@ -147,11 +283,21 @@ this.ifTips=false
},
//点击分享按钮
clickShare(){
if(this.ifShow==false){
this.ifShow=true
this.ifShow=true
//延时拍照
setTimeout(() => {
this.saveImage()
}, 1000);
}else{
this.ifShow=false
this.ifPhoto=false
}
console.log("头像信息",this.headPortrait)
console.log("主播名称",this.udNickname)
console.log("直播名称",this.lvrName)
......@@ -160,11 +306,7 @@ clickShare(){
// udName:'',//主播名称
// lvrImg:'',//占位图
// liveName:'',//房间名称
this.headPro=this.headPortrait//头像图片
this.udName=this.udNickname//主播名称
this.lvrImg=this.lvrImgLargeUrl//占位图
this.liveName=this.lvrName//房间名称
this.imgUrl=window.location.href//二维码地址
}
},
};
......@@ -177,9 +319,27 @@ this.imgUrl=window.location.href//二维码地址
.style-one{
height: 145vw;
position: absolute;
top: 10vw;
top: 0;
z-index: 99;
left:0;
width: 85vw;
}
.myImagePass{
position: absolute;
top: 10vw;
left: 7.5vw;
/* background: greenyellow; */
z-index: -1;
height: 145vw;
width: 85vw;
}
.photo-img{
position: absolute;
top: 10vw;
left: 7.5vw;
/* background: greenyellow; */
z-index: 130;
height: 145vw;
width: 85vw;
}
.bottom-countent{
......@@ -306,89 +466,89 @@ font-size: 4vw;
height: 19vw;
width: 19vw;
position: absolute;
top: 20vw;
top: 10vw;
z-index: 100;
left: 22vw;
left: 14vw;
border-radius: 50%;
}
.headImgTwo{
height: 19vw;
height: 19vw;
width: 19vw;
position: absolute;
top: 20vw;
top: 10vw;
z-index: 100;
left: 22vw;
left: 14.5vw;
border-radius: 50%;
}
.headImgThree{
height: 19vw;
width: 19vw;
position: absolute;
top: 20vw;
top: 10vw;
z-index: 100;
left: 40.5vw;
left: 32.5vw;
border-radius: 50%;
}
.udStyle{
font-size: 5vw;
color: white;
position: absolute;
top: 41vw;
top: 31vw;
z-index: 100;
left: 22vw;
left: 14vw;
}
.lvrImg{
height: 39vw;
width: 73vw;
position: absolute;
top: 62vw;
top: 52vw;
border-radius: 1vw;
left: 13.5vw;
left: 6vw;
z-index: 100;
}
.lvrImgTwo{
height: 39vw;
width: 71vw;
position: absolute;
top: 62vw;
top: 52vw;
border-radius: 1vw;
left: 14.5vw;
left: 6.8vw;
z-index: 100;
}
.lvrImgThree{
height: 32vw;
width: 58vw;
position: absolute;
top: 68vw;
top: 58vw;
border-radius: 1vw;
left: 20.5vw;
left: 12.9vw;
z-index: 100;
}
.lvrName{
font-size: 4vw;
width: 68vw;
position: absolute;
top: 102vw;
top: 92vw;
z-index: 100;
left: 15vw;
left: 8vw;
}
.lvrNameTwo{
font-size: 3.8vw;
width: 66vw;
position: absolute;
top: 102vw;
top: 92vw;
color: white;
z-index: 100;
left: 16vw;
left: 9vw;
}
.lvrNameThree{
font-size: 3.8vw;
position: absolute;
top: 100vw;
top: 91vw;
width: 56vw;
color: white;
z-index: 100;
left: 21vw;
left: 15vw;
}
.pressShare{
height: 5vw;
......@@ -399,24 +559,24 @@ font-size: 4vw;
}
.qrCode{
position: absolute;
top: 120vw;
left: 58vw;
top: 110vw;
left: 51vw;
height: 22vw;
width: 22vw;
z-index: 100;
}
.qrCodeTwo{
position: absolute;
top: 124vw;
left: 60.5vw;
top: 114vw;
left: 53.5vw;
height: 22vw;
width: 22vw;
z-index: 100;
}
.qrCodeThree{
position: absolute;
top: 124vw;
left: 17vw;
top: 114vw;
left: 9vw;
height: 22vw;
width: 22vw;
z-index: 100;
......
src/router/index.js
View file @ 834c050c
import Vue from 'vue'
import Router from 'vue-router'
import store from '../store/index'
import test from '../views/test.vue'
import sign from '../views/sign'
import password from '../views/password'
import register from '../views/register'
......@@ -54,7 +55,12 @@ const router = new Router({
component:sign,
// 判断是否需要登录
},
{
path: '/test',
name: 'test',
component:test,
// 判断是否需要登录
},
{
path: '/password',
name: 'password',
......
src/views/fullScreen.vue
View file @ 834c050c
......@@ -651,7 +651,7 @@ this.pten = false
let img=sessionStorage.getItem("isReg")
this.server.live.follow(temp).then(res=>{
if(res.data.data.businessCode==20){
if(res.data.code==200){
this.ifFollow=true
}else{
alert(res.data.data.businessMessage)
......@@ -676,8 +676,8 @@ this.pten = false
let img=sessionStorage.getItem("isReg")
this.server.live.follow(temp).then(res=>{
if(res.data.data.businessCode==20){
this.ifFollow=true
if(res.data.code==200){
this.ifFollow=false
}else{
alert(res.data.data.businessMessage)
}
......@@ -1087,11 +1087,11 @@ let temp=this.qs.stringify({
}
.home-number{
font-size: 1vw;
transform: scale(0.7);
transform: scale(0.75);
position: absolute;
top: 6vw;
left: 18vw;
z-index:99;
left: 18.5vw;
z-index: 99;
color: white;
}
.follow-img{
......
src/views/live.vue
View file @ 834c050c
......@@ -512,7 +512,7 @@ export default {
let img=sessionStorage.getItem("isReg")
this.server.live.follow(temp).then(res=>{
if(res.data.data.businessCode==20){
if(res.data.code==200){
this.ifFollow=true
}else{
alert(res.data.data.businessMessage)
......@@ -538,7 +538,7 @@ export default {
let img=sessionStorage.getItem("isReg")
this.server.live.follow(temp).then(res=>{
if(res.data.data.businessCode==20){
if(res.data.code==200){
this.ifFollow=false
}else{
alert(res.data.data.businessMessage)
......@@ -1149,11 +1149,11 @@ this.pten = false
z-index: 89;
}
.home-number{
font-size: 1vw;
transform: scale(0.7);
font-size: 1vw;
transform: scale(0.75);
position: absolute;
top: 63vw;
left: 60vw;
left: 59.5vw;
z-index: 89;
color: white;
}
......
src/views/liveList.vue
View file @ 834c050c
......@@ -57,6 +57,7 @@ export default {
created(){
this.getState()
},
mounted() {
this.getRecommendList()
this.getList()
......@@ -135,6 +136,7 @@ export default {
})
},
getState(){
let token=sessionStorage.getItem("token")
let img=sessionStorage.getItem("udPhotoFileid")
console.log("就阿婆啊v发",token)
......@@ -144,6 +146,7 @@ export default {
this.userImg=img
}else{
this.ifLog=1
}
}else{
......@@ -196,8 +199,8 @@ export default {
this.server.live.tourist(temp).then(res=>{
let thisToken= res.data.data.token
window.sessionStorage.setItem('token', thisToken);//token
this.$router.go(0)
// this.$router.go(0)
window.location.reload();
})
},
mine(){
......
src/views/sign.vue
View file @ 834c050c
<template>
<div id="body">
<!-- <div class="black-background">
<div id="body">
<!-- <div class="black-background">
</div> -->
<div >
<span class="title">短信验证</span>
<span class="registerOne">短信已发送至：</span>
<span class="registerPhone">+86 {{userPhone}}</span>
<span class="registerTwo">手机验证码</span>
<input type="number" id="firstNumber" @input="changeInput(0)" @blur="searchChangeTwo(0)" @focus="searchChange(0)" v-model="numberOne" oninput="if(value.length>1)value=value.slice(0,6)" :class="{wbk11:!ifRed0,wbkRed:ifRed0}">
<input type="number" id="secondNumber" @input="changeInput(1)" @blur="searchChangeTwo(1)" style="left:20vw" @focus="searchChange(1)" v-model="numberTwo" oninput="if(value.length>1)value=value.slice(0,1)" :class="{wbk11:!ifRed1,wbkRed:ifRed1}">
<input type="number" id="threeNumber" @input="changeInput(2)" @blur="searchChangeTwo(2)" style="left:35vw" @focus="searchChange(2)" v-model="numberThree" oninput="if(value.length>1)value=value.slice(0,1)" :class="{wbk11:!ifRed2,wbkRed:ifRed2}">
<input type="number" id="fourNumber" @input="changeInput(3)" @blur="searchChangeTwo(3)" style="left:50vw" @focus="searchChange(3)" v-model="numberFour" oninput="if(value.length>1)value=value.slice(0,1)" :class="{wbk11:!ifRed3,wbkRed:ifRed3}">
<input type="number" id="fiveNumber" @input="changeInput(4)" @blur="searchChangeTwo(4)" style="left:65vw" @focus="searchChange(4)" v-model="numberFive" oninput="if(value.length>1)value=value.slice(0,1)" :class="{wbk11:!ifRed4,wbkRed:ifRed4}">
<input type="number" id="sixNumber" @input="changeInput(5)" @blur="searchChangeTwo(5)" style="left:80vw" @focus="searchChange(5)" v-model="numberSix" oninput="if(value.length>1)value=value.slice(0,1)" :class="{wbk11:!ifRed5,wbkRed:ifRed5}">
<img class="default-img" v-if="ifClick==false" src="../common/img/default-img.png" alt="">
<img class="default-img" v-if="ifClick==true" @click="goTo()" src="../common/img/new-send.png" alt="">
<span v-show="ifSend" class="send" @click="sendButton()" >重新发送</span>
<span v-show="!ifSend" class="sendTwo" id="sendBtn">{{count}}S重新发送</span>
<!-- <span class="title">验证码登录</span>
<div>
<span class="title">短信验证</span>
<span class="registerOne">短信已发送至：</span>
<span class="registerPhone">+86 {{ userPhone }}</span>
<span class="registerTwo">手机验证码</span>
<input
type="number"
id="firstNumber"
@input="changeInput(0)"
@blur="searchChangeTwo(0)"
@focus="searchChange(0)"
v-model="numberOne"
oninput="if(value.length>1)value=value.slice(0,6)"
:class="{ wbk11: !ifRed0, wbkRed: ifRed0 }"
/>
<input
type="number"
id="secondNumber"
@input="changeInput(1)"
@blur="searchChangeTwo(1)"
style="left: 20vw"
@focus="searchChange(1)"
v-model="numberTwo"
oninput="if(value.length>1)value=value.slice(0,1)"
:class="{ wbk11: !ifRed1, wbkRed: ifRed1 }"
/>
<input
type="number"
id="threeNumber"
@input="changeInput(2)"
@blur="searchChangeTwo(2)"
style="left: 35vw"
@focus="searchChange(2)"
v-model="numberThree"
oninput="if(value.length>1)value=value.slice(0,1)"
:class="{ wbk11: !ifRed2, wbkRed: ifRed2 }"
/>
<input
type="number"
id="fourNumber"
@input="changeInput(3)"
@blur="searchChangeTwo(3)"
style="left: 50vw"
@focus="searchChange(3)"
v-model="numberFour"
oninput="if(value.length>1)value=value.slice(0,1)"
:class="{ wbk11: !ifRed3, wbkRed: ifRed3 }"
/>
<input
type="number"
id="fiveNumber"
@input="changeInput(4)"
@blur="searchChangeTwo(4)"
style="left: 65vw"
@focus="searchChange(4)"
v-model="numberFive"
oninput="if(value.length>1)value=value.slice(0,1)"
:class="{ wbk11: !ifRed4, wbkRed: ifRed4 }"
/>
<input
type="number"
id="sixNumber"
@input="changeInput(5)"
@blur="searchChangeTwo(5)"
style="left: 80vw"
@focus="searchChange(5)"
v-model="numberSix"
oninput="if(value.length>1)value=value.slice(0,1)"
:class="{ wbk11: !ifRed5, wbkRed: ifRed5 }"
/>
<img
class="default-img"
v-if="ifClick == false"
src="../common/img/default-img.png"
alt=""
/>
<img
class="default-img"
v-if="ifClick == true"
@click="goTo()"
src="../common/img/new-send.png"
alt=""
/>
<span v-show="ifSend" class="send" @click="sendButton()">重新发送</span>
<span v-show="!ifSend" class="sendTwo" id="sendBtn"
>{{ count }}S重新发送</span
>
<!-- <span class="title">验证码登录</span>
<input type="number" v-model="userPhone" placeholder="请输入手机号" oninput="if(value.length>11)value=value.slice(0,11)" class="wbk1">
<input type="number" v-model="verification " placeholder="输入验证码" oninput="if(value.length>11)value=value.slice(0,11)" class="wbk2">
<span v-show="ifSend" class="send" @click="sendButton()" >发送验证码</span>
<span v-show="!ifSend" class="sendTwo" id="sendBtn">{{count}}S后获取</span>
<button class="sure" @click="signButton()">登录</button>
<span class="account " @click="password">账号登录</span> -->
<div class="tips" style="display: none;">
<span>发送成功</span>
</div>
</div>
<div class="tips" style="display: none">
<span>发送成功</span>
</div>
</div>
</div>
</template>
<script>
import Vue from 'vue'
import store from '../store/index';
import $ from 'jquery'
import {Toast,Button} from "mint-ui";
import { Header } from 'mint-ui';
import Vue from "vue";
import store from "../store/index";
import $ from "jquery";
import { Toast, Button } from "mint-ui";
import { Header } from "mint-ui";
Vue.component(Button.name, Button);
import '../../node_modules/mint-ui/lib/style.css'
import "../../node_modules/mint-ui/lib/style.css";
Vue.component(Header.name, Header);
export default {
name: 'H5LiveSign',
name: "H5LiveSign",
data() {
return {
ifclick: true,
userPhone: this.$route.query.phone,
verification: "",
count: "",
ifRed0: false,
ifRed1: false,
ifRed2: false,
ifRed3: false,
ifRed4: false,
ifRed5: false,
ifSend: true,
ifClick: false,
device: "",
system: "",
times: null,
timestamp: Date.parse(new Date()) / 1000,
numberOne: "",
numberTwo: "",
numberThree: "",
numberFour: "",
numberFive: "",
numberSix: "",
isweixin: false,
};
},
data() {
return {
ifclick:true,
userPhone:this.$route.query.phone,
verification:'',
count:'',
ifRed0:false,
ifRed1:false,
ifRed2:false,
ifRed3:false,
ifRed4:false,
ifRed5:false,
ifSend:true,
ifClick:false,
device:'',
system:'',
times:null,
timestamp:Date.parse(new Date())/1000,
numberOne:'',
numberTwo:'',
numberThree:'',
numberFour:'',
numberFive:'',
numberSix:'',
};
mounted() {
this.showLog();
this.sendButton();
},
methods: {
password() {
this.$router.push({
path: "/password",
});
},
// 判断是否为微信浏览器
isWeixinBrowser() {
let ua = navigator.userAgent.toLowerCase();
return /micromessenger/.test(ua) ? true : false;
},
changeInput(e) {
console.log("安抚", e);
if (e == 0 && this.numberOne != "") {
console.log("哈哈");
document.getElementById("secondNumber").focus();
this.ifRed1 = true;
} else if (e == 1 && this.numberTwo != "") {
document.getElementById("threeNumber").focus();
this.ifRed2 = true;
} else if (e == 2 && this.numberThree != "") {
document.getElementById("fourNumber").focus();
this.ifRed3 = true;
} else if (e == 3 && this.numberFour != "") {
document.getElementById("fiveNumber").focus();
this.ifRed4 = true;
} else if (e == 4 && this.numberFive != "") {
document.getElementById("sixNumber").focus();
this.ifRed5 = true;
} else if (e == 5 && this.numberSix != "") {
// document.getElementById('threeNumber').focus();
// this.ifRed5=true
this.ifClick = true;
}
mounted() {
this.showLog()
this.sendButton()
if (e == 0 && this.numberOne.length == 6) {
let stmp = this.numberOne;
console.log("啊", stmp.slice(1, 2));
this.numberOne = stmp.slice(0, 1);
this.numberTwo = stmp.slice(1, 2);
this.numberThree = stmp.slice(2, 3);
this.numberFour = stmp.slice(3, 4);
this.numberFive = stmp.slice(4, 5);
this.numberSix = stmp.slice(5, 6);
document.getElementById("sixNumber").focus();
this.ifRed5 = true;
this.ifclick = true;
}
// if(this.numberOne==''){
// document.getElementById('firstNumber').focus();
// this.ifRed0=true
// }else if(this.numberTwo==''){
// document.getElementById('secondNumber').focus();
// this.ifRed1=true
// }else if(this.numberThree==''){
// document.getElementById('threeNumber').focus();
// this.ifRed2=true
// }else if(this.numberFour==''){
// document.getElementById('fourNumber').focus();
// this.ifRed3=true
// }else if(this.numberFive==''){
// document.getElementById('fiveNumber').focus();
// this.ifRed4=true
// }
// else{
// this.ifRed5=true
// }
},
searchChange(e) {
// let verification= this.numberOne +this.numberTwo+this.numberThree+this.numberFour+this.numberFive+this.numberSix
// console.log("岸上观光",verification)
// document.getElementById('firstNumber').focus();//设置用户名的文本框为焦点。
if (e == 0) {
this.ifRed0 = true;
} else if (e == 1) {
if (this.numberOne == "") {
document.getElementById("firstNumber").focus();
this.ifRed0 = true;
} else {
this.ifRed1 = true;
}
} else if (e == 2) {
if (this.numberOne == "") {
document.getElementById("firstNumber").focus();
this.ifRed0 = true;
} else if (this.numberTwo == "") {
document.getElementById("secondNumber").focus();
this.ifRed1 = true;
} else {
this.ifRed2 = true;
}
} else if (e == 3) {
if (this.numberOne == "") {
document.getElementById("firstNumber").focus();
this.ifRed0 = true;
} else if (this.numberTwo == "") {
document.getElementById("secondNumber").focus();
this.ifRed1 = true;
} else if (this.numberThree == "") {
document.getElementById("threeNumber").focus();
this.ifRed2 = true;
} else {
this.ifRed3 = true;
}
} else if (e == 4) {
if (this.numberOne == "") {
document.getElementById("firstNumber").focus();
this.ifRed0 = true;
} else if (this.numberTwo == "") {
document.getElementById("secondNumber").focus();
this.ifRed1 = true;
} else if (this.numberThree == "") {
document.getElementById("threeNumber").focus();
this.ifRed2 = true;
} else if (this.numberFour == "") {
document.getElementById("fourNumber").focus();
this.ifRed3 = true;
} else {
this.ifRed4 = true;
}
} else if (e == 5) {
if (this.numberOne == "") {
document.getElementById("firstNumber").focus();
this.ifRed0 = true;
} else if (this.numberTwo == "") {
document.getElementById("secondNumber").focus();
this.ifRed1 = true;
} else if (this.numberThree == "") {
document.getElementById("threeNumber").focus();
this.ifRed2 = true;
} else if (this.numberFour == "") {
document.getElementById("fourNumber").focus();
this.ifRed3 = true;
} else if (this.numberFive == "") {
document.getElementById("fiveNumber").focus();
this.ifRed4 = true;
} else {
this.ifRed5 = true;
}
}
if (e == 0 && this.numberOne.length == 6) {
let stmp = this.numberOne;
methods: {
password(){
this.$router.push(
{
path:'/password',
});
},
changeInput(e){
console.log("安抚",e)
if(e==0&&this.numberOne!=''){
console.log("哈哈")
document.getElementById('secondNumber').focus();
this.ifRed1=true
}else if(e==1&&this.numberTwo!=''){
document.getElementById('threeNumber').focus();
this.ifRed2=true
}else if(e==2&&this.numberThree!=''){
document.getElementById('fourNumber').focus();
this.ifRed3=true
}else if(e==3&&this.numberFour!=''){
document.getElementById('fiveNumber').focus();
this.ifRed4=true
}else if(e==4&&this.numberFive!=''){
document.getElementById('sixNumber').focus();
this.ifRed5=true
}else if(e==5&&this.numberSix!=''){
// document.getElementById('threeNumber').focus();
// this.ifRed5=true
this.ifClick=true
}
console.log("啊", stmp.slice(1, 2));
this.numberOne = stmp.slice(0, 1);
this.numberTwo = stmp.slice(1, 2);
this.numberThree = stmp.slice(2, 3);
this.numberFour = stmp.slice(3, 4);
this.numberFive = stmp.slice(4, 5);
this.numberSix = stmp.slice(5, 6);
document.getElementById("sixNumber").focus();
this.ifRed5 = true;
this.ifclick = true;
}
// console.log("dss双方都是",this.userPhone)
// if(this.userPhone &&this.ifCheck==true){
// this.ifSend=true
if(e==0&&this.numberOne.length==6){
let stmp=this.numberOne
console.log('啊',stmp.slice(1,2))
this.numberOne=stmp.slice(0,1)
this.numberTwo=stmp.slice(1,2)
this.numberThree=stmp.slice(2,3)
this.numberFour=stmp.slice(3,4)
this.numberFive=stmp.slice(4,5)
this.numberSix=stmp.slice(5,6)
document.getElementById('sixNumber').focus();
this.ifRed5=true
this.ifclick=true
}
// if(this.numberOne==''){
// document.getElementById('firstNumber').focus();
// this.ifRed0=true
// }else if(this.numberTwo==''){
// document.getElementById('secondNumber').focus();
// this.ifRed1=true
// }else if(this.numberThree==''){
// document.getElementById('threeNumber').focus();
// this.ifRed2=true
// }else if(this.numberFour==''){
// document.getElementById('fourNumber').focus();
// this.ifRed3=true
// }else if(this.numberFive==''){
// document.getElementById('fiveNumber').focus();
// this.ifRed4=true
// }
// else{
// this.ifRed5=true
// }
},
searchChange(e){
// let verification= this.numberOne +this.numberTwo+this.numberThree+this.numberFour+this.numberFive+this.numberSix
// console.log("岸上观光",verification)
// document.getElementById('firstNumber').focus();//设置用户名的文本框为焦点。
if(e==0){
this.ifRed0=true
}else if(e==1){
if(this.numberOne==''){
document.getElementById('firstNumber').focus();
this.ifRed0=true
}else{
this.ifRed1=true
}
}else if(e==2){
if(this.numberOne==''){
document.getElementById('firstNumber').focus();
this.ifRed0=true
}else if(this.numberTwo==''){
document.getElementById('secondNumber').focus();
this.ifRed1=true
}
else{
this.ifRed2=true
}
}else if(e==3){
if(this.numberOne==''){
document.getElementById('firstNumber').focus();
this.ifRed0=true
}else if(this.numberTwo==''){
document.getElementById('secondNumber').focus();
this.ifRed1=true
}else if(this.numberThree==''){
document.getElementById('threeNumber').focus();
this.ifRed2=true
}
else{
this.ifRed3=true
}
}else if(e==4){
if(this.numberOne==''){
document.getElementById('firstNumber').focus();
this.ifRed0=true
}else if(this.numberTwo==''){
document.getElementById('secondNumber').focus();
this.ifRed1=true
}else if(this.numberThree==''){
document.getElementById('threeNumber').focus();
this.ifRed2=true
}else if(this.numberFour==''){
document.getElementById('fourNumber').focus();
this.ifRed3=true
}
else{
this.ifRed4=true
}
}else if(e==5){
if(this.numberOne==''){
document.getElementById('firstNumber').focus();
this.ifRed0=true
}else if(this.numberTwo==''){
document.getElementById('secondNumber').focus();
this.ifRed1=true
}else if(this.numberThree==''){
document.getElementById('threeNumber').focus();
this.ifRed2=true
}else if(this.numberFour==''){
document.getElementById('fourNumber').focus();
this.ifRed3=true
}else if(this.numberFive==''){
document.getElementById('fiveNumber').focus();
this.ifRed4=true
}
else{
this.ifRed5=true
}
}
if(e==0&&this.numberOne.length==6){
let stmp=this.numberOne
console.log('啊',stmp.slice(1,2))
this.numberOne=stmp.slice(0,1)
this.numberTwo=stmp.slice(1,2)
this.numberThree=stmp.slice(2,3)
this.numberFour=stmp.slice(3,4)
this.numberFive=stmp.slice(4,5)
this.numberSix=stmp.slice(5,6)
document.getElementById('sixNumber').focus();
this.ifRed5=true
this.ifclick=true
}
// console.log("dss双方都是",this.userPhone)
// if(this.userPhone &&this.ifCheck==true){
// this.ifSend=true
// }else{
// this.ifSend=false
// }
},
searchChangeTwo(e){
if(e==0){
this.ifRed0=false
}else if(e==1){
this.ifRed1=false
}else if(e==2){
this.ifRed2=false
}else if(e==3){
this.ifRed3=false
}else if(e==4){
this.ifRed4=false
}else if(e==5){
let verification= this.numberOne +this.numberTwo+this.numberThree+this.numberFour+this.numberFive+this.numberSix
console.log("岸上观光",verification)
this.ifRed5=false
if(verification.length==6){
this.ifClick=true
}else{
this.ifClick=false
}
}
},
go_get(){
let temp=this.qs.stringify({
urlTag:'nh5'
})
this.server.live.buy_code(temp).then(res=>{
//order成功判断内置浏览器，在微信就授权，内置微信还是浏览器 微信jsapi 浏览器h5
console.log(res.data)
if(res.data.code==200){
let url=res.data.data
window.location.href=url
}
})
// }else{
// this.ifSend=false
// }
},
searchChangeTwo(e) {
if (e == 0) {
this.ifRed0 = false;
} else if (e == 1) {
this.ifRed1 = false;
} else if (e == 2) {
this.ifRed2 = false;
} else if (e == 3) {
this.ifRed3 = false;
} else if (e == 4) {
this.ifRed4 = false;
} else if (e == 5) {
let verification =
this.numberOne +
this.numberTwo +
this.numberThree +
this.numberFour +
this.numberFive +
this.numberSix;
console.log("岸上观光", verification);
this.ifRed5 = false;
if (verification.length == 6) {
this.ifClick = true;
} else {
this.ifClick = false;
}
}
},
go_get() {
let temp = this.qs.stringify({
urlTag: "nh5",
});
this.server.live.buy_code(temp).then((res) => {
//order成功判断内置浏览器，在微信就授权，内置微信还是浏览器 微信jsapi 浏览器h5
console.log(res.data);
if (res.data.code == 200) {
let url = res.data.data;
window.location.href = url;
}
});
},
goTo() {
let verification =
this.numberOne +
this.numberTwo +
this.numberThree +
this.numberFour +
this.numberFive +
this.numberSix;
let temp = this.qs.stringify({
pmAppVersion: 884,
pmModel: "iphone",
pmSystem: "ios",
pmMac: 11,
pmOperator: "无运营商",
pmIp: 1,
phone: this.userPhone,
vcode: verification,
});
this.server.login.loginByPhone(temp).then((res) => {
let thisToken = res.data.data.token;
let udPhotoFileid = res.data.data.udPhotoFileid;
let name = res.data.data.udNickname;
let ubId = res.data.data.ubId;
let isReg = res.data.data.isReg;
let openId = res.data.data.openId;
sessionStorage.setItem("ubId", ubId); //用户id
},
goTo(){
let verification= this.numberOne +this.numberTwo+this.numberThree+this.numberFour+this.numberFive+this.numberSix
let temp=this.qs.stringify({
pmAppVersion:884,
pmModel:'iphone',
pmSystem:'ios',
pmMac:11,
pmOperator:'无运营商',
pmIp:1,
phone:this.userPhone,
vcode:verification,
})
this.server.login.loginByPhone(temp).then(res=>{
let thisToken= res.data.data.token
let udPhotoFileid=res.data.data.udPhotoFileid
let name=res.data.data.udNickname
let ubId=res.data.data.ubId
let isReg=res.data.data.isReg
let openId=res.data.data.openId
sessionStorage.setItem("ubId", ubId);//用户id
sessionStorage.removeItem("token");
window.sessionStorage.setItem("token", thisToken); //token
window.sessionStorage.setItem("udPhotoFileid", udPhotoFileid); //头像
sessionStorage.setItem("name", name); //用户昵称
sessionStorage.setItem("isReg", isReg); //是否注册
sessionStorage.setItem("openId", openId); //opendid
store.commit("SET_TOKEN", thisToken);
// this.getLive()
// this.go_get()
//判断是否是微信浏览器
if (this.isweixin) {
this.go_get();
} else {
this.$router.push({
path: "/",
});
}
});
},
getLive() {
let temp = this.qs.stringify({
pmAppVersion: 884,
pmModel: "iphone",
pmSystem: "ios",
pmMac: 11,
pmOperator: "无运营商",
pmIp: 1,
// ubPhone:this.userPhone,
// vcCode:this.verification,
// udPwd:pwd,
});
this.server.live.getLive(temp).then((res) => {
let arr = res.data.data.appSingleLiveResponseVOList;
arr.forEach((i, index) => {
if (i.lvrId == 115) {
console.log("撒发达", i.lvrLiveType);
if (i.lvrLiveType == 0) {
this.$router.push({
path: "/live",
});
} else {
this.$router.push({
path: "/fullScreen",
// query:{type:i.lvrStatus}
});
}
// lvrStatus 0 未开播、1 直播中
//lvrLiveType 0 横屏、1 竖屏
}
});
});
},
sendButton() {
// console.log("撒旦发生",this.timestamp*1000)
window.sessionStorage.setItem('token', thisToken);//token
window.sessionStorage.setItem('udPhotoFileid', udPhotoFileid);//头像
sessionStorage.setItem("name", name);//用户昵称
sessionStorage.setItem("isReg", isReg);//是否注册
sessionStorage.setItem("openId", openId);//opendid
store.commit("SET_TOKEN", thisToken);
// this.getLive()
this.go_get()
// this.$router.push(
// {
// path:'/',
// });
})
},
getLive(){
let temp=this.qs.stringify({
pmAppVersion:884,
pmModel:'iphone',
pmSystem:'ios',
pmMac:11,
pmOperator:'无运营商',
pmIp:1,
// ubPhone:this.userPhone,
// vcCode:this.verification,
// udPwd:pwd,
})
this.server.live.getLive(temp).then(res=>{
let arr=res.data.data.appSingleLiveResponseVOList
arr.forEach((i,index)=>{
if(i.lvrId==115){
console.log("撒发达",i.lvrLiveType)
if(i.lvrLiveType==0){
this.$router.push(
{
path:'/live',
});
}else{
this.$router.push(
{
path:'/fullScreen',
// query:{type:i.lvrStatus}
});
}
// lvrStatus 0 未开播、1 直播中
//lvrLiveType 0 横屏、1 竖屏
}
})
var stringA =
"app=douniucaijing&body=thisisbody&timestamp=" + this.timestamp;
let userPhone = this.userPhone;
var sign = this.$md5(stringA);
})
},
sendButton(){
// console.log("撒旦发生",this.timestamp*1000)
var stringA="app=douniucaijing&body=thisisbody&timestamp="+this.timestamp;
let userPhone=this.userPhone
var sign = this.$md5(stringA)
var phoneReg = /^(13[0-9]|14[01456879]|15[0-35-9]|16[2567]|17[0-8]|18[0-9]|19[0-35-9])\d{8}$/; //定义邮箱的正则表达式
if (!phoneReg.test(userPhone)) {
alert("您输入的手机号格式不正确");
}else{
let temp=this.qs.stringify({
sign:sign,
timestamp:this.timestamp,
ubPhone:userPhone,
type:2,
pmAppVersion:884,
})
this.server.login.getMessage(temp).then(res=>{
if(res.data.code==200){
$('.tips').show().delay(3000).hide(300)
const TIME_COUNT = 59;
var phoneReg =
/^(13[0-9]|14[01456879]|15[0-35-9]|16[2567]|17[0-8]|18[0-9]|19[0-35-9])\d{8}$/; //定义邮箱的正则表达式
if (!phoneReg.test(userPhone)) {
alert("您输入的手机号格式不正确");
} else {
let temp = this.qs.stringify({
sign: sign,
timestamp: this.timestamp,
ubPhone: userPhone,
type: 2,
pmAppVersion: 884,
});
this.server.login.getMessage(temp).then((res) => {
if (res.data.code == 200) {
$(".tips").show().delay(3000).hide(300);
const TIME_COUNT = 59;
if (!this.times) {
this.count = TIME_COUNT;
this.ifSend = false;
this.times = setInterval(() => {
if (this.count > 0 && this.count <= TIME_COUNT) {
this.count--;
} else {
this.ifSend = true;
clearInterval(this.times);
this.times = null;
}
}, 1000)
}
this.count = TIME_COUNT;
this.ifSend = false;
this.times = setInterval(() => {
if (this.count > 0 && this.count <= TIME_COUNT) {
this.count--;
} else {
this.ifSend = true;
clearInterval(this.times);
this.times = null;
}
}, 1000);
}
}
});
}
},
})
}
},
// signButton(){
// if(!this.verification){
// alert('请输入验证码')
// }else if(!this.userPhone){
// alert('请输入手机号')
// }else{
// // console.log("121")
// let temp=this.qs.stringify({
// pmAppVersion:884,
// pmModel:this.device,
// pmSystem:this.system,
// pmMac:11,
// pmOperator:'无运营商',
// pmIp:1,
// phone:this.userPhone,
// vcode:this.verification,
// })
// this.server.login.loginByPhone(temp).then(res=>{
// let thisToken= res.data.data.token
// let name=res.data.data.udNickname
// let ubId=res.data.data.ubId
// sessionStorage.setItem("ubId", ubId);
// window.sessionStorage.setItem('token', thisToken);
// sessionStorage.setItem("name", name);
// store.commit("SET_TOKEN", thisToken);
// this.getLive()
// signButton(){
// if(!this.verification){
// alert('请输入验证码')
// }else if(!this.userPhone){
// alert('请输入手机号')
// }else{
// // console.log("121")
// let temp=this.qs.stringify({
// pmAppVersion:884,
// pmModel:this.device,
// pmSystem:this.system,
// pmMac:11,
// pmOperator:'无运营商',
// pmIp:1,
// phone:this.userPhone,
// vcode:this.verification,
// })
// this.server.login.loginByPhone(temp).then(res=>{
// let thisToken= res.data.data.token
// let name=res.data.data.udNickname
// let ubId=res.data.data.ubId
// sessionStorage.setItem("ubId", ubId);
// window.sessionStorage.setItem('token', thisToken);
// sessionStorage.setItem("name", name);
// store.commit("SET_TOKEN", thisToken);
// this.getLive()
// })
// }
// },
showLog(){
let webLog = {}
let userAgent = navigator.userAgent
// 获取微信版本
let m1 = userAgent.match(/MicroMessenger.*?(?= )/)
if (m1 && m1.length > 0) {
webLog.wechat = m1[0]
}
// 苹果手机
if (userAgent.includes('iPhone') || userAgent.includes('iPad')) {
// 获取设备名
if (userAgent.includes('iPad')) {
webLog.device = 'iPad'
} else {
webLog.device = 'iPhone'
}
// 获取操作系统版本
m1 = userAgent.match(/iPhone OS .*?(?= )/)
if (m1 && m1.length > 0) {
webLog.system = m1[0]
}
}
// 安卓手机
if (userAgent.includes('Android')) {
// 获取设备名
m1 = userAgent.match(/Android.*; ?(.*(?= Build))/)
if (m1 && m1.length > 1) {
webLog.device = m1[1]
}
// 获取操作系统版本
m1 = userAgent.match(/Android.*?(?=;)/)
if (m1 && m1.length > 0) {
webLog.system = m1[0]
}
}
this.device=webLog.device
this.system=webLog.system
console.log("阿斯蒂芬",webLog.device)
// })
// }
// },
showLog() {
// 如果是微信浏览器
// if (this.isWeixinBrowser()) {
// this.isweixin= true;
// }
let isWeixin = this.isWeixinBrowser();
if (isWeixin) {
this.isweixin = true;
} else {
this.isweixin = false;
}
console.log("是多少故事", isWeixin);
let webLog = {};
let userAgent = navigator.userAgent;
// 获取微信版本
let m1 = userAgent.match(/MicroMessenger.*?(?= )/);
if (m1 && m1.length > 0) {
webLog.wechat = m1[0];
}
// 苹果手机
if (userAgent.includes("iPhone") || userAgent.includes("iPad")) {
// 获取设备名
if (userAgent.includes("iPad")) {
webLog.device = "iPad";
} else {
webLog.device = "iPhone";
}
// 获取操作系统版本
m1 = userAgent.match(/iPhone OS .*?(?= )/);
if (m1 && m1.length > 0) {
webLog.system = m1[0];
}
}
// 安卓手机
if (userAgent.includes("Android")) {
// 获取设备名
m1 = userAgent.match(/Android.*; ?(.*(?= Build))/);
if (m1 && m1.length > 1) {
webLog.device = m1[1];
}
// 获取操作系统版本
m1 = userAgent.match(/Android.*?(?=;)/);
if (m1 && m1.length > 0) {
webLog.system = m1[0];
}
}
this.device = webLog.device;
this.system = webLog.system;
console.log("阿斯蒂芬", webLog.device);
},
},
};
</script>
<style scoped>
.black-background {
height: 100%;
width: 100%;
position: fixed;
top: 0;
background-color: black;
opacity: 0.4;
}
.whit-background{
height: 90vw;
width: 90vw;
background-color: white;
position: relative;
top: 55vw;
left: 5vw;
border-radius:5vw;
}
.tips {
width: 40vw;
text-align: center;
height: 10vw;
background: black;
color: white;
position: fixed;
top: 80vw;
left: 30vw;
border-radius: 4vw;
opacity: 0.6;
line-height: 10vw;
}
.wbk11 {
font-size: 5vw;
text-align: center;
color: #797979;
position: absolute;
top: 81vw;
/* border-radius: 5vw; */
left: 5vw;
width: 10vw;
height: 13vw;
line-height: 10vw;
/* padding: 0 0 0 5vw; */
background: none;
box-shadow: none;
outline: none;
/* background: rgb(243, 243, 243); */
margin-left: 4vw;
/* border-color: rgb(213, 225, 245); */
border-left: 0px;
border-top: 0px;
border-bottom: 0.8vw solid #EFEFEF;
border-right: 0px;
}
.wbkRed{
font-size: 5vw;
text-align: center;
color: red;
position: absolute;
top: 81vw;
/* border-radius: 5vw; */
left: 5vw;
width: 10vw;
height: 13vw;
line-height: 10vw;
/* padding: 0 0 0 5vw; */
background: none;
box-shadow: none;
outline: none;
/* background: rgb(243, 243, 243); */
margin-left: 4vw;
/* border-color: rgb(213, 225, 245); */
border-left: 0px;
border-top: 0px;
border-bottom: 0.8vw solid red;
border-right: 0px;
}
.wbk2 {
font-size: 3.7vw;
color: #797979;
position: absolute;
top: 40vw;
border-radius: 5vw;
left: 3vw;
width: 65vw;
height: 13vw;
line-height: 10vw;
padding: 0 3vw;
background: none;
box-shadow: none;
outline: none;
background: rgb(243, 243, 243);
margin-left: 4vw;
/* border-color: rgb(213, 225, 245); */
border-left: 0px;
border-top: 0px;
border-bottom: 0px;
border-right: 0px;
padding-left: 9vw;
}
.send{
position: absolute;
left: 72vw;
font-size: 3.8vw;
top: 47vw;
color: red;
}
.sendTwo{
position: absolute;
left: 72vw;
font-size: 3.8vw;
top: 47vw;
color: #8F8F8F;
}
.title{
position: absolute;
left: 10vw;
letter-spacing: 0.5vw;
font-weight: bolder;
font-size: 6vw;
top: 23vw;
}
.registerOne{
position: absolute;
display: block;
letter-spacing: 0.5vw;
width: 79vw;
top: 37vw;
left: 10vw;
color: #797979;
font-size: 3vw;
}
.registerPhone{
position: absolute;
left: 10vw;
letter-spacing: 0.5vw;
font-weight: bolder;
font-size: 5vw;
top: 46vw;
}
.registerTwo{
position: absolute;
top: 70vw;
left: 10vw;
color: #C4C4C4;
font-size: 3.8vw;
}
.default-img{
height: 23vw;
width: 23vw;
position: absolute;
top: 112vw;
left: 76vw;
}
.account{
position: absolute;
top: 75vw;
left: 38vw;
color: #797979;
font-size: 3.8vw;
}
.sure{
width: 77vw;
height: 13vw;
border-radius: 5vw;
font-size: 4vw;
border-radius: 5vw;
border: 0px;
color: white;
background: #E11E1E;
position: absolute;
top: 58vw;
left: 7vw;
}
height: 100%;
width: 100%;
position: fixed;
top: 0;
background-color: black;
opacity: 0.4;
}
.whit-background {
height: 90vw;
width: 90vw;
background-color: white;
position: relative;
top: 55vw;
left: 5vw;
border-radius: 5vw;
}
.tips {
width: 40vw;
text-align: center;
height: 10vw;
background: black;
color: white;
position: fixed;
top: 80vw;
left: 30vw;
border-radius: 4vw;
opacity: 0.6;
line-height: 10vw;
}
.wbk11 {
font-size: 5vw;
text-align: center;
color: #797979;
position: absolute;
top: 81vw;
/* border-radius: 5vw; */
left: 5vw;
width: 10vw;
height: 13vw;
line-height: 10vw;
/* padding: 0 0 0 5vw; */
background: none;
box-shadow: none;
outline: none;
/* background: rgb(243, 243, 243); */
margin-left: 4vw;
/* border-color: rgb(213, 225, 245); */
border-left: 0px;
border-top: 0px;
border-bottom: 0.8vw solid #efefef;
border-right: 0px;
}
.wbkRed {
font-size: 5vw;
text-align: center;
color: red;
position: absolute;
top: 81vw;
/* border-radius: 5vw; */
left: 5vw;
width: 10vw;
height: 13vw;
line-height: 10vw;
/* padding: 0 0 0 5vw; */
background: none;
box-shadow: none;
outline: none;
/* background: rgb(243, 243, 243); */
margin-left: 4vw;
/* border-color: rgb(213, 225, 245); */
border-left: 0px;
border-top: 0px;
border-bottom: 0.8vw solid red;
border-right: 0px;
}
.wbk2 {
font-size: 3.7vw;
color: #797979;
position: absolute;
top: 40vw;
border-radius: 5vw;
left: 3vw;
width: 65vw;
height: 13vw;
line-height: 10vw;
padding: 0 3vw;
background: none;
box-shadow: none;
outline: none;
background: rgb(243, 243, 243);
margin-left: 4vw;
/* border-color: rgb(213, 225, 245); */
border-left: 0px;
border-top: 0px;
border-bottom: 0px;
border-right: 0px;
padding-left: 9vw;
}
.send {
position: absolute;
left: 72vw;
font-size: 3.8vw;
top: 47vw;
color: red;
}
.sendTwo {
position: absolute;
left: 72vw;
font-size: 3.8vw;
top: 47vw;
color: #8f8f8f;
}
.title {
position: absolute;
left: 10vw;
letter-spacing: 0.5vw;
font-weight: bolder;
font-size: 6vw;
top: 23vw;
}
.registerOne {
position: absolute;
display: block;
letter-spacing: 0.5vw;
width: 79vw;
top: 37vw;
left: 10vw;
color: #797979;
font-size: 3vw;
}
.registerPhone {
position: absolute;
left: 10vw;
letter-spacing: 0.5vw;
font-weight: bolder;
font-size: 5vw;
top: 46vw;
}
.registerTwo {
position: absolute;
top: 70vw;
left: 10vw;
color: #c4c4c4;
font-size: 3.8vw;
}
.default-img {
height: 23vw;
width: 23vw;
position: absolute;
top: 112vw;
left: 76vw;
}
.account {
position: absolute;
top: 75vw;
left: 38vw;
color: #797979;
font-size: 3.8vw;
}
.sure {
width: 77vw;
height: 13vw;
border-radius: 5vw;
font-size: 4vw;
border-radius: 5vw;
border: 0px;
color: white;
background: #e11e1e;
position: absolute;
top: 58vw;
left: 7vw;
}
</style>
\ No newline at end of file
src/views/test.vue 0 → 100644
View file @ 834c050c
This source diff could not be displayed because it is too large. You can view the blob instead.
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment