
最近HBuilder2.7的云打包怎么使得app的网络请求失败了。代码都是一模一样的????????
最近HBuilder2.7的云打包怎么使得app的网络请求失败了。代码都是一模一样的???????? 这不是搞人心态吗???
最近HBuilder2.7的云打包怎么使得app的网络请求失败了。代码都是一模一样的???????? 这不是搞人心态吗???

Uni-app 写的页面,嵌入到 Android WebView之后, input[type=file] 无法响应,问题解决
用 uni-app
写的页面,准备打包进 Android
的 WebView
结果不能选择文件,以为是 uni-app
代码有问题,在试过原生的 input[type=file]
之后,还是没有响应。最终找到答案,是 Android
端需要设置一下:
参考这两篇:
解决在android webview中input标签type="file"不能使用的问题
android webview不支持input type=file 标签解决办法
用 uni-app
写的页面,准备打包进 Android
的 WebView
结果不能选择文件,以为是 uni-app
代码有问题,在试过原生的 input[type=file]
之后,还是没有响应。最终找到答案,是 Android
端需要设置一下:
参考这两篇:
解决在android webview中input标签type="file"不能使用的问题
android webview不支持input type=file 标签解决办法

UNI-APP中mapSearch 模块使用方法
UNI-APP中mapSearch 模块(module)
具体使用案例如下:此方法为官方Demo,由于论坛收不到所以发帖。节约大家的时间。Demo地址 以及官方文档mapsearch-模块
<template>
<view class="content">
<map class="map" ref="dcmap" :markers="markers" @tap="selectPoint"></map>
<scroll-view class="scrollview" scroll-y="true">
<button class="button" @click="reverseGeocode">reverseGeocode</button>
<button class="button" @click="poiSearchNearBy">poiSearchNearBy</button>
</scroll-view>
</view>
</template>
<script>
// 116.397477,39.908692
let mapSearch = weex.requireModule('mapSearch')
module.exports = {
data() {
return {
markers: [{
id: '1',
latitude: 39.9086920000,
longitude: 116.3974770000,
title: '天安门',
zIndex: '1',
iconPath: '/static/gps.png',
width: 20,
height: 20,
anchor: {
x: 0.5,
y: 1
},
callout: {
content: '首都北京\n天安门',
color: '#00BFFF',
fontSize: 12,
borderRadius: 2,
borderWidth: 0,
borderColor: '#333300',
bgColor: '#CCFF11',
padding: '1',
display: 'ALWAYS'
}
}]
}
},
methods: {
selectPoint(e) {
console.log(e);
},
reverseGeocode() {
var point = this.markers[0]
mapSearch.reverseGeocode({
point: {
latitude: point.latitude,
longitude: point.longitude
}
}, ret => {
console.log(JSON.stringify(ret));
uni.showModal({
content: JSON.stringify(ret)
})
})
},
poiSearchNearBy() {
var point = this.markers[0]
mapSearch.poiSearchNearBy({
point: {
latitude: point.latitude,
longitude: point.longitude
},
key: '停车场',
radius: 1000
}, ret => {
console.log(ret);
uni.showModal({
content: JSON.stringify(ret)
})
})
}
}
}
</script>
<style>
.content {
flex: 1;
}
.map {
width: 750rpx;
height: 500rpx;
background-color: black;
}
.scrollview {
flex: 1;
}
.button {
margin-top: 30rpx;
margin-bottom: 20rpx;
}
</style>
UNI-APP中mapSearch 模块(module)
具体使用案例如下:此方法为官方Demo,由于论坛收不到所以发帖。节约大家的时间。Demo地址 以及官方文档mapsearch-模块
<template>
<view class="content">
<map class="map" ref="dcmap" :markers="markers" @tap="selectPoint"></map>
<scroll-view class="scrollview" scroll-y="true">
<button class="button" @click="reverseGeocode">reverseGeocode</button>
<button class="button" @click="poiSearchNearBy">poiSearchNearBy</button>
</scroll-view>
</view>
</template>
<script>
// 116.397477,39.908692
let mapSearch = weex.requireModule('mapSearch')
module.exports = {
data() {
return {
markers: [{
id: '1',
latitude: 39.9086920000,
longitude: 116.3974770000,
title: '天安门',
zIndex: '1',
iconPath: '/static/gps.png',
width: 20,
height: 20,
anchor: {
x: 0.5,
y: 1
},
callout: {
content: '首都北京\n天安门',
color: '#00BFFF',
fontSize: 12,
borderRadius: 2,
borderWidth: 0,
borderColor: '#333300',
bgColor: '#CCFF11',
padding: '1',
display: 'ALWAYS'
}
}]
}
},
methods: {
selectPoint(e) {
console.log(e);
},
reverseGeocode() {
var point = this.markers[0]
mapSearch.reverseGeocode({
point: {
latitude: point.latitude,
longitude: point.longitude
}
}, ret => {
console.log(JSON.stringify(ret));
uni.showModal({
content: JSON.stringify(ret)
})
})
},
poiSearchNearBy() {
var point = this.markers[0]
mapSearch.poiSearchNearBy({
point: {
latitude: point.latitude,
longitude: point.longitude
},
key: '停车场',
radius: 1000
}, ret => {
console.log(ret);
uni.showModal({
content: JSON.stringify(ret)
})
})
}
}
}
</script>
<style>
.content {
flex: 1;
}
.map {
width: 750rpx;
height: 500rpx;
background-color: black;
}
.scrollview {
flex: 1;
}
.button {
margin-top: 30rpx;
margin-bottom: 20rpx;
}
</style>
收起阅读 »

HBuilderX-2.7.12以下版本如何卸载来自插件市场的插件?
> 本教程用于安装来自插件市场的HBuilderX插件后,需要卸载插件并且仅适用于HBuilderX版本在2.7.0-2.7.11之间的情况。2.7.12及以上版本开始支持在插件管理界面卸载来自插件市场的插件。
2.7.0-2.7.11之间的HBuilderX卸载来自插件市场的插件时需要手动在HBuilderX安装目录下删除相应的插件。具体操作步骤如下:
手动卸载步骤:
Windows:
1. 打开HBuilderX安装目录下的plugins目录
2. 根据目录名称找到需要卸载的插件,然后手动删除
3. 重启HBuilderX
Macosx:
1. 打开HBuilderX.app目录下的Contents/HBuilderX/plugins目录
2. 根据目录名称找到需要卸载的插件,然后手动删除
3. 重启HBuilderX
> 本教程用于安装来自插件市场的HBuilderX插件后,需要卸载插件并且仅适用于HBuilderX版本在2.7.0-2.7.11之间的情况。2.7.12及以上版本开始支持在插件管理界面卸载来自插件市场的插件。
2.7.0-2.7.11之间的HBuilderX卸载来自插件市场的插件时需要手动在HBuilderX安装目录下删除相应的插件。具体操作步骤如下:
手动卸载步骤:
Windows:
1. 打开HBuilderX安装目录下的plugins目录
2. 根据目录名称找到需要卸载的插件,然后手动删除
3. 重启HBuilderX
Macosx:
1. 打开HBuilderX.app目录下的Contents/HBuilderX/plugins目录
2. 根据目录名称找到需要卸载的插件,然后手动删除
3. 重启HBuilderX
收起阅读 »

HBuilderX 离线安装插件
windows
- 打开资源管理器,进入HBuilderX安装目录
- 进入
plugins
目录 - 将插件文件夹, 放置到此目录。(如是zip包,解压即可)
- 重启HBuilderX编辑器
Mac
- 打开系统终端,输入如下命令,打开HBuilderX插件目录 (注意:mac上,正式版和alpha目录不一样)
- 将插件文件夹, 如是zip包,解压即可),放置到
plugins
目录下 - 重启HBuilderX编辑器
正式版命令
open /Applications/HBuilderX.app/Contents/HBuilderX/plugins/
Alpha版命令
open /Applications/HBuilderX-Alpha.app/Contents/HBuilderX/plugins/
备注
nodejs
插件,如果插件内,没有node_modules
,需要手动执行npm install
windows
- 打开资源管理器,进入HBuilderX安装目录
- 进入
plugins
目录 - 将插件文件夹, 放置到此目录。(如是zip包,解压即可)
- 重启HBuilderX编辑器
Mac
- 打开系统终端,输入如下命令,打开HBuilderX插件目录 (注意:mac上,正式版和alpha目录不一样)
- 将插件文件夹, 如是zip包,解压即可),放置到
plugins
目录下 - 重启HBuilderX编辑器
正式版命令
open /Applications/HBuilderX.app/Contents/HBuilderX/plugins/
Alpha版命令
open /Applications/HBuilderX-Alpha.app/Contents/HBuilderX/plugins/
备注
nodejs
插件,如果插件内,没有node_modules
,需要手动执行npm install

更新到2.7.9,强制v3编译,不再兼容wx.***的接口写法。为什么不早说!!!

nvue文件无法改变其全局的背景颜色吗?
app.vue里只能改变vue的全局背景颜色,那么nvue文件的全局背景颜色再哪里改那
app.vue里只能改变vue的全局背景颜色,那么nvue文件的全局背景颜色再哪里改那

UniApp 官方的 iOS App 经常会卡顿,崩溃
我安装了 UniApp 官方的 iOS App,经常逛逛社区看看帖子,经常性的会出现点开帖子后整个界面无响应卡顿几秒钟,有时候程序会毫无征兆的突然崩溃了。
每次在社区里逛不到几分钟必然这样。。
iPhone 6s, iOS 13。
我安装了 UniApp 官方的 iOS App,经常逛逛社区看看帖子,经常性的会出现点开帖子后整个界面无响应卡顿几秒钟,有时候程序会毫无征兆的突然崩溃了。
每次在社区里逛不到几分钟必然这样。。
iPhone 6s, iOS 13。

希望能提供一款APP中能使用的table插件
支持上拉加载数据、支持加宽/高某列、支持加宽/高某行、支持加宽/高全列、支持加宽/高全行、支持固定某列等。真心希望出个这样的插件,感激
支持上拉加载数据、支持加宽/高某列、支持加宽/高某行、支持加宽/高全列、支持加宽/高全行、支持固定某列等。真心希望出个这样的插件,感激

uniapp 同一个页面问答 选择答案活动
<template>
<view class="uni-flex uni-column index-bg">
<view class="uni-flex uni-row index-top">
<view class="flex-item index-top-l"><view class="left-icon" @click="changeRuleModal()">游戏规则</view></view>
<view class="flex-item index-top-r">
<view class="right-icon" v-if="loginAppStatus" @click="changeLogsModal()">竞猜记录</view>
<view class="right-icon" v-if="!loginAppStatus" @click="loginApp">竞猜记录</view>
<!-- <view class="right-icon" v-if="!loginAppStatus" @click="changeLogsModal">竞猜记录</view> -->
</view>
</view>
<view class=" uni-column question-bg">
<view class="question-bg-title">
<view class="flex-item flex-item-V question-title">德甲第 1 轮</view>
<view class="flex-item flex-item-V question-title-2">本场竞猜截止到5月3日 12:00之前</view>
</view>
<view class="flex-item flex-item-v team-item"
v-for="(team, i) in teamList" :key="i">
<view class="uni-flex uni-row question-title-3">
<view class="flex-item question-1">
<!-- 主队 <br> -->
<img v-if="team.quiz_result == 1" src="https://aloss.hotforest.cn/bundesliga/virctory.png" alt="img">
</view>
<view class="flex-item question-2">
<img :src="team.home_team_icon" alt="img" />
{{ team.home_team_name }}
</view>
<view class="flex-item question-3">
<view class="question-3-vs">VS</view>
<view><span>{{ team.competition_time }}</span></view>
<view><span>{{ team.home_team_score }} - {{ team.guest_team_score }}</span></view>
</view>
<view class="flex-item question-4">
<img :src="team.guest_team_icon" alt="img" />
{{ team.guest_team_name }}
</view>
<view class="flex-item question-5">
<!-- 客队 <br> -->
<img v-if="team.quiz_result == 2" src="https://aloss.hotforest.cn/bundesliga/virctory.png" alt="img">
</view>
</view>
<view class="team-answer" v-if="team.quiz_result != 0 ">
<view class="flex-item flex-item-V option-item"
:class="[team.quiz_result==1 ? 'option-active-right' : 'option-active-wrong']"
>
主队胜
</view>
<view class="flex-item flex-item-V option-item "
:class="[team.quiz_result==3 ? 'option-active-right' : 'option-active-wrong']"
>
平
</view>
<view class="flex-item flex-item-V option-item "
:class="[team.quiz_result==2 ? 'option-active-right' : 'option-active-wrong']"
>
客队胜
</view>
</view>
<view class="team-answer" v-if="team.quiz_result == 0 ">
<view class="flex-item flex-item-V option-item"
:class="[team.id + '_' + 1 == team.checkValue ? 'option-active' : '']"
@click="sOption(team.id, 1)">
主队胜
</view>
<view class="flex-item flex-item-V option-item "
:class="[team.id + '_' + 3 == team.checkValue ? 'option-active' : '']"
@click="sOption(team.id, 3)">
平
</view>
<view class="flex-item flex-item-V option-item "
:class="[team.id + '_' + 2 == team.checkValue ? 'option-active' : '']"
@click="sOption(team.id, 2)">
客队胜
</view>
</view>
</view>
<view class="flex-item flex-item-V question-button">
<button v-if="loginAppStatus==true && quizStatus==false "
@click="addUserQuizLog()" type="default">确认选择</button>
<button v-if="loginAppStatus==false"
@click="loginApp" type="default">确认选择</button>
</view>
</view>
<view class="rule-modal" v-show="ruleModal" @click="closeRuleModal()"></view>
<view class="rule-modal-bg" v-show="ruleModal">
<view class="flex-item rule-title">游戏规则</view>
<view class="flex-item rule-content">
1.竞猜将于比赛开始前关闭竞猜通道
<br />
2.系统将随机抽取10位答对竞猜的用户,
<br />
3.下期活动开始时,将公布获奖用户名单
<br />
4.获奖用户,请添加全民体育官方微信
<br />
(NationSports)领取相应奖励
</view>
</view>
<view class="logs-modal" v-show="logsModal" @click="closeLogsModal()"></view>
<view class="logs-modal-bg" v-show="logsModal">
<view class="flex-item logs-title">竞猜记录</view>
<view class="uni-row uni-flex logs-1 ">
<view class="flex-item logs-1-1">时间</view>
<view class="flex-item logs-1-2">赛事</view>
<view class="flex-item logs-1-3">我的竞猜</view>
<view class="flex-item logs-1-4">结果</view>
</view>
<view class="flex-item logs-2">第一轮</view>
<scroll-view :scroll-top="scrollTop"
scroll-y="true"
class="logs-scroll-Y"
@scrolltoupper="upper"
@scrolltolower="lower"
@scroll="scroll">
<view class="scroll-view-item logs-3" v-for="(log, i) in userQuizLogs" :key="i">
<view class="uni-row uni-flex ">
<view class="flex-item logs-3-font logs-3-1">{{log.detail.competition_time}}</view>
<view class="flex-item logs-3-font logs-3-2">
{{log.detail.home_team_name}} <br>
{{log.detail.guest_team_name}}
</view>
<view class="flex-item logs-3-font logs-3-3">
<text v-if="log.result == 1">{{log.detail.home_team_name}}</text>
<text v-if="log.result == 2">{{log.detail.guest_team_name}}</text>
<text v-if="log.result == 3">平</text>
<!-- {{log.result}} -->
</view>
<view class="flex-item logs-3-font logs-3-4">
<!-- {{log.r_status}} -->
<text v-if="log.r_status == -1">未开</text>
<text v-if="log.r_status == 1">胜</text>
<text v-if="log.r_status == 0">负</text>
</view>
</view>
</view>
</scroll-view>
</view>
<view class="info-modal" v-show="infoModal" @click="closeInfoModal()"></view>
<view class="info-modal-bg" v-show="infoModal">
<view class="flex-item info-title">信息登记</view>
<view class="flex-item info-content">
<input type="text" v-model="name" placeholder="请输入姓名"> <br>
<input type="number" v-model="mobile" placeholder="请输入手机号">
</view>
<view class="info-button">
<button type="default" @click="updateUserInfo()">确定</button>
</view>
</view>
</view>
</template>
<script>
import base from '@/utils/base.js';
import http from '@/utils/http.js';
export default {
data() {
return {
scrollTop: 0,
old: {
scrollTop: 0
},
teamList: [],
selectList: [],
ruleModal: false,
logsModal: false,
infoModal:false,
appMsgModal:false,
teamId: 0,
userQuizLogs:[],
loginAppStatus: false,
uid: null,
token: null,
ns_device_id: null,
activity_id: 4,
name:'',
mobile:'',
quizStatus:0,
};
},
onLoad(option) {
if (typeof contact === 'undefined') {
uni.showToast({
title:'请下载全民体育APP参与活动',
icon:'none'
})
// this.appMsgModal = true
// this.uid = 469247;
// this.activity_id = 5;
} else {
if (option.uid !== '' && option.uid !== 'null' && option.uid !== undefined) {
uni.setStorageSync('uid', option.uid);
uni.setStorageSync('token', option.token);
uni.setStorageSync('ns_device_id', option.ns_device_id);
this.loginAppStatus = true;
this.uid = uni.getStorageSync('uid');
this.token = uni.getStorageSync('token');
this.ns_device_id = uni.getStorageSync('ns_device_id');
this.checkQuizStatus(this.uid,this.$question.activity_id);
} else {
this.getTeamList();
this.loginAppStatus = false;
// open this url in app env
contact.onLoginDone = function(uid, token) {
uni.setStorageSync('loginAppStatus', true);
let ns_device_id = uni.getStorageSync('ns_device_id');
uni.reLaunch({
url: '/pages/index/mid?uid=' + uid + '&token=' + token + '&ns_device_id=' + ns_device_id
});
};
}
}
},
methods: {
loginApp() {
contact.requireLogin();
console.log('relogin');
},
// 手机号为空时
updateUserInfo:function(){
var that = this;
var uid =that.uid;
var activity_id = that.$question.activity_id;
var ns_device_id = that.ns_device_id;
var mobile = that.mobile;
var name = that.name;
var logs = that.selectList;
var user_type = 3;
if(name.length < 1 || name.length > 5){
uni.showToast({
title:'名字1-5个字符',
icon:"none"
})
return;
}
if(mobile.length != 11 ){
uni.showToast({
title:'请输入11位手机号码',
icon:'none'
})
return;
}
let data = {
uid: uid,
name: name,
mobile: mobile,
activity_id: activity_id,
ns_device_id: ns_device_id,
user_type: user_type
};
http.post(base.sq + '/activity/api.Users/add', data)
.then(res => {
if (res.status == 200) {
console.log(res);
//用户信息添加之后 添加用户竞猜日志
uni.request({
url: base.sq + '/activity/api.quiz/addUserQuizLog',
data: {
uid: uid,
activity_id: activity_id,
logs: JSON.stringify(logs)
},
method: 'POST',
success: res => {
console.log(res);
if (res.statusCode === 200) {
if (res.data.code === 0) {
//竞猜按钮变灰色
this.quizStatus = true;
uni.showToast({
title:'竞猜成功',
icon:"none"
})
}else{
uni.showToast({
title:res.data.info,
icon:"none"
})
}
} else {
uni.showToast({
title:'server error',
icon:"none"
})
}
}
});
} else {
uni.showToast({
title:'server error',
icon:"none"
})
}
})
.catch(error => {})
.finally(() => {});
this.infoModal = false;
},
// 手机号非空时
addUserInfo:function(name,mobile){
var that = this;
var uid =that.uid;
var activity_id = that.$question.activity_id;
var ns_device_id = that.ns_device_id;
var logs = that.selectList;
var user_type = 1;
let data = {
uid: uid,
name: name,
mobile: mobile,
activity_id: activity_id,
ns_device_id: ns_device_id,
user_type: user_type
};
http.post(base.sq + '/activity/api.Users/add', data)
.then(res => {
if (res.status == 200) {
// console.log(res);
//用户信息添加之后 添加用户竞猜日志
uni.request({
url: base.sq + '/activity/api.quiz/addUserQuizLog',
data: {
uid: uid,
activity_id: activity_id,
logs: JSON.stringify(logs)
},
method: 'POST',
success: res => {
console.log(res);
if (res.statusCode === 200) {
if (res.data.code === 0) {
//竞猜按钮变灰色
this.quizStatus = true;
uni.showToast({
title:'竞猜成功',
icon:"none"
})
// console.log(this.quizStatus);
}else{
uni.showToast({
title:res.data.info,
icon:"none"
})
}
} else {
uni.showToast({
title:'server error',
icon:"none"
})
}
}
});
} else {
uni.showToast({
title:'server error',
icon:"none"
})
}
})
.catch(error => {})
.finally(() => {});
this.infoModal = false;
},
checkQuizStatus:function(uid,activity_id){
let data = {
uid:uid,
activity_id:activity_id
}
http.post(base.sq + '/activity/api.Quiz/checkUserQuizStatus', data)
.then(res=>{
console.log(res);
if (res.status == 200) {
this.quizStatus = res.data.data.status;
if(res.data.data.status==true){
this.getUserQuizTeamList(uid,activity_id);
}else{
this.getTeamList();
}
} else {
uni.showToast({
title:'server error',
icon:"none"
})
}
})
},
getUserQuizLogs(uid,activity_id){
uni.request({
url: base.sq + '/activity/api.quiz/getUserQuizLogs',
data: {
uid: uid,
activity_id: activity_id,
},
method: 'POST',
success: res => {
// console.log(res);
if (res.statusCode === 200) {
if (res.data.code === 0) {
this.userQuizLogs = res.data.data;
console.log(this.userQuizLogs);
}else{
uni.showToast({
title:res.data.info,
icon:"none"
})
}
} else {
uni.showToast({
title:'server error',
icon:"none"
})
}
}
});
},
sOption(teamId, result) {
let that = this;
that.teamId = teamId;
var key = 'team_' + teamId;
var teamList = this.teamList;
var a = teamId + '_' + result;
teamList.forEach(item => {
if (item.id === teamId) {
item.checkValue = a;
}
});
// todos two days
this.$forceUpdate((this.teamList = teamList));
// this.teamList = teamList;
var selectList = this.selectList;
var optionObject = {
team_id: teamId,
result: result
};
for (var i = 0; i < selectList.length; i++) {
var team_id = selectList[i]['team_id'];
if (team_id == teamId) {
selectList.splice(i, 1);
}
}
selectList.push(optionObject);
this.selectList = selectList;
},
closeRuleModal() {
this.ruleModal = false;
},
changeRuleModal() {
this.ruleModal = true;
},
closeLogsModal() {
this.logsModal = false;
},
changeLogsModal() {
this.logsModal = true;
this.getUserQuizLogs(this.uid,this.$question.activity_id);
},
closeInfoModal() {
this.infoModal = false;
},
addUserQuizLog: function() {
var that = this;
var uid = that.uid;
var activity_id = that.activity_id;
var ns_device_id = that.ns_device_id;
var token = that.token;
// 判断题目是否全部答完
var teamLength = that.teamList.length;
var selectLength = that.selectList.length;
if(teamLength>selectLength){
uni.showToast({
title:'请继续答题',
icon:'none'
})
return;
}
let data = {
uid: uid,
activity_id: activity_id
};
http.post(base.sq + '/activity/api.users/checkUidStatus', data)
.then(res => {
// console.log(res);
if (res.status == 200) {
// console.log(res.data.data.count);
let count = res.data.data.count;
// 检查用户是否在数据库中
if (count <= 0) {
let req_url = base.bd + '/v3/user/info';
let headers = {
ns_device_id: ns_device_id,
uid: uid,
token:token
};
http.get(req_url, { headers: headers }).then(res => {
// console.log(res);
if (res.status == 200) {
if (res.data.Status == 1) {
let nickname = res.data.Data.nickname;
let mobile = res.data.Data.phone;
console.log(res);
if(mobile == ''){
this.infoModal = true;
}else{
this.addUserInfo(nickname,mobile);
}
}
} else {
uni.showToast({
title:'server error',
icon:"none"
})
}
});
}
} else {
uni.showToast({
title:'server error',
icon:"none"
})
}
})
.catch(error => {})
.finally(() => {});
},
getTeamList: function() {
uni.request({
url: base.sq + '/activity/api.quiz/teamList',
success: res => {
console.log(res)
if (res.statusCode === 200) {
if (res.data.code === 0) {
var list = res.data.data;
this.teamList = list;
// console.log(list);
}
} else {
uni.showToast({
title:'server error',
icon:"none"
})
}
}
});
},
getUserQuizTeamList: function(uid,activity_id) {
uni.request({
url: base.sq + '/activity/api.quiz/getUserQuizTeamList',
data:{
uid:uid,
activity_id:activity_id
},
method:'POST',
success: res => {
console.log(res)
if (res.statusCode === 200) {
if (res.data.code === 0) {
var list = res.data.data;
this.teamList = list;
// console.log(list);
}
} else {
uni.showToast({
title:'server error',
icon:"none"
})
}
}
});
},
}
};
</script>
<style>
.index-bg {
background: url(https://aloss.hotforest.cn/bundesliga/index-bg.png) no-repeat center;
background-size: 100% 100%;
height: 100%;
}
.index-top {
margin-top: 114rpx;
}
.index-top-l {
width: 50%;
text-align: left;
}
.index-top-r {
width: 50%;
vertical-align: text-bottom;
}
.left-icon {
text-align: center;
background: url(https://aloss.hotforest.cn/bundesliga/left-icon.png) no-repeat center;
background-size: 100% 100%;
width: 134rpx;
height: 55rpx;
font-size: 22rpx;
font-family: MF LingHei (Noncommercial);
font-weight: 400;
color: rgba(146, 251, 255, 1);
line-height: 55rpx;
}
.right-icon {
margin-left: auto;
text-align: center;
background: url(https://aloss.hotforest.cn/bundesliga/right-icon.png) no-repeat center;
background-size: 100% 100%;
width: 134rpx;
height: 55rpx;
font-size: 22rpx;
font-family: MF LingHei (Noncommercial);
font-weight: 400;
color: rgba(146, 251, 255, 1);
line-height: 55rpx;
}
.question-bg {
/* background: url(https://aloss.hotforest.cn/bundesliga/question-bg.png) no-repeat center; */
background-size: 100% 100%;
/* width: 708rpx; */
/* height: 700rpx; */
width: 100%;
/* height: 100%; */
margin:0 auto;
margin-top: 40%;
background-color: rgb(56,30,128);
}
.question-bg-title{
width: 708rpx;
margin: 0 auto;
margin-top: 20rpx;
border-radius: 30rpx;
background-color: rgba(50, 141, 255, 1);
}
.team-item{
background-color: #FFFFFF;
width: 708rpx;
margin: 0 auto;
border-radius: 30rpx;
}
.team-answer{
padding-bottom: 30rpx;
}
.question-title-p {
margin: auto;
}
.question-title {
text-align: center;
font-size: 40rpx;
line-height: 60rpx;
font-family: MF LingHei (Noncommercial);
font-weight: 400;
color: rgba(254, 254, 254, 1);
text-shadow: 0px 3rpx 2rpx rgba(0, 0, 0, 0.29);
}
.question-title-2 {
text-align: center;
font-size: 24rpx;
font-family: Lantinghei SC;
font-weight: 600;
color: rgba(255, 241, 161, 1);
}
.question-title-3 {
margin-top: 30rpx;
padding-bottom: 30rpx;
padding-top: 30rpx;
}
.question-1 {
width: 10%;
margin-left: 2%;
font-size: 24rpx;
font-family: Lantinghei SC;
font-weight: 600;
color: rgba(51, 51, 51, 1);
}
.question-1 img{
width: 116rpx;
height: 113rpx;
}
.question-5 {
width: 10%;
margin-left: 2%;
font-size: 24rpx;
font-family: Lantinghei SC;
font-weight: 600;
color: rgba(51, 51, 51, 1);
}
.question-5 img{
width: 116rpx;
height: 113rpx;
}
.question-2 {
width: 20%;
margin-left: 2%;
text-align: center;
font-size: 24rpx;
font-family: Lantinghei SC;
font-weight: 600;
color: rgba(51, 51, 51, 1);
}
.question-2 img {
max-width: 100%;
max-height: 100%;
/* width: 148rpx;
height: 110rpx; */
}
.question-4 {
width: 20%;
margin-left: 2%;
text-align: center;
font-size: 24rpx;
font-family: Lantinghei SC;
font-weight: 600;
color: rgba(51, 51, 51, 1);
}
.question-4 img {
width: 100%;
}
.question-3 {
text-align: center;
width: 30%;
}
.question-3-vs{
font-size: 46rpx;
font-family: MF LingHei (Noncommercial);
font-weight: bolder;
color: rgba(50, 141, 255, 1);
}
.question-3 span {
font-size: 28rpx;
font-family: MF LingHei (Noncommercial);
font-weight:bolder;
color: rgba(50, 141, 255, 1);
}
.option-name-1 {
text-align: center;
width: 100%;
font-size: 30rpx;
font-family: Lantinghei SC;
font-weight: 600;
color: rgba(50, 141, 255, 1);
}
.option-active {
/* background-color: #29A518; */
background-color: #007AFF;
color: #ffffff !important;
border: none !important;
}
.option-active-wrong {
/* background-color: #29A518; */
background-color: #ff4f15;
color: #ffffff !important;
border: none !important;
}
.option-active-right {
/* background-color: #29A518; */
background-color: #29A518;
color: #ffffff !important;
border: none !important;
}
.option-item {
width: 600rpx;
height: 62rpx;
border: 1px solid rgba(0, 160, 233, 1);
border-radius: 30rpx;
margin: 0 auto;
margin-top: 20rpx;
text-align: center;
font-size: 30rpx;
font-family: Lantinghei SC;
font-weight: 600;
color: rgba(50, 141, 255, 1);
}
.question-button {
margin-top: 30rpx;
margin-bottom: 30rpx;
}
.question-button button {
background: url(https://aloss.hotforest.cn/bundesliga/button-y.png) no-repeat center;
background-size: 100% 100%;
width: 365rpx;
height: 92rpx;
font-size: 36rpx;
font-family: Lantinghei SC;
font-weight: 600;
color: rgba(255, 255, 255, 1);
text-shadow: 0px 2px 6px rgba(0, 0, 0, 0.75);
-webkit-text-stroke: 3px undefined;
text-stroke: 3px undefined;
}
.scroll-Y {
width: 100%;
}
.rule-modal {
position: fixed;
z-index: 100;
top: 0;
left: 0;
bottom: 0;
right: 0;
background-color: rgba(0, 0, 0, 0.6);
}
.rule-modal-bg {
position: fixed;
z-index: 110;
top: 0;
left: 0;
bottom: 0;
right: 0;
margin: auto;
width: 552rpx;
height: 452rpx;
background: url(https://aloss.hotforest.cn/bundesliga/modal-1.png) no-repeat center;
background-size: 100% 100%;
}
.rule-title {
font-size: 30rpx;
font-family: MF LingHei (Noncommercial);
font-weight: 400;
color: rgba(255, 255, 255, 1);
line-height: 35rpx;
padding-top: 31rpx;
padding-left: 34rpx;
}
.rule-content {
padding-left: 34rpx;
padding-top: 80rpx;
font-size: 24rpx;
font-family: Lantinghei SC;
font-weight: 600;
color: rgba(255, 255, 255, 1);
}
.logs-modal {
position: fixed;
z-index: 100;
top: 0;
left: 0;
bottom: 0;
right: 0;
background-color: rgba(0, 0, 0, 0.6);
}
.logs-modal-bg {
position: fixed;
z-index: 110;
top: 0;
left: 0;
bottom: 0;
right: 0;
margin: auto;
/* width: 552rpx; */
width: 80%;
height: 80%;
/* height: 452rpx; */
background: url(https://aloss.hotforest.cn/bundesliga/modal-2.png) no-repeat center;
background-size: 100% 100%;
}
.logs-title {
font-size: 30rpx;
font-family: MF LingHei (Noncommercial);
color: rgba(255, 255, 255, 1);
line-height: 80rpx;
width: 90%;
height: 80rpx;
text-indent: 30rpx;
font-weight: bolder;
}
.logs-content {
padding-left: 34rpx;
padding-top: 80rpx;
font-size: 24rpx;
font-family: Lantinghei SC;
font-weight: 600;
color: rgba(255, 255, 255, 1);
}
.logs-1{
width: 99%;
height: 60rpx;
line-height: 60rpx;
border-bottom: 1px solid #39B8BF;
font-size:24rpx;
font-family:Lantinghei SC;
color: #FFFFFF;
}
.logs-1-1{
width: 35%;
text-indent: 20rpx;
}
.logs-1-2{
width: 20%;
}
.logs-1-3{
width: 25%;
}
.logs-1-4{
width: 20%;
text-align: center;
}
.logs-2{
width: 99%;
height: 50rpx;
line-height: 50rpx;
text-indent: 20rpx;
font-size:18rpx;
font-family:Lantinghei SC;
font-weight:600;
color:rgba(255,255,255,1);
border-bottom: 1px dashed #39B8BF;
}
.logs-3{
padding:20rpx 20rpx 10rpx 20rpx;
border-bottom: 1px solid #39B8BF;
}
.logs-3-font{
font-size:18rpx;
font-family:Lantinghei SC;
font-weight:600;
color:rgba(255,255,255,1);
}
.logs-3-1{
width: 35%;
}
.logs-3-2{
width: 20%;
}
.logs-3-3{
width: 25%;
text-align: center;
}
.logs-3-4{
width: 20%;
text-align: center;
}
.info-modal {
position: fixed;
z-index: 100;
top: 0;
left: 0;
bottom: 0;
right: 0;
background-color: rgba(0, 0, 0, 0.6);
}
.info-modal-bg {
position: fixed;
z-index: 110;
top: 0;
left: 0;
bottom: 0;
right: 0;
margin: auto;
width: 552rpx;
height: 452rpx;
background: url(https://aloss.hotforest.cn/bundesliga/modal-1.png) no-repeat center;
background-size: 100% 100%;
}
.info-title {
font-size: 30rpx;
font-family: MF LingHei (Noncommercial);
font-weight: 400;
color: rgba(255, 255, 255, 1);
line-height: 35rpx;
padding-top: 31rpx;
padding-left: 34rpx;
}
.info-content {
width: 90%;
padding-left: 34rpx;
padding-top: 80rpx;
font-size: 24rpx;
font-family: Lantinghei SC;
font-weight: 600;
color: rgba(255, 255, 255, 1);
}
.info-content input{
border-bottom: 1rpx solid #39B8BF;
}
/deep/ .uni-input-placeholder{
color: #FFFFFF !important;
font-size:24rpx;
font-family:Lantinghei SC;
font-weight:600;
}
.info-button{
margin-top: 80rpx;
}
.info-button-quiz-active{
background: #888888 !important;
}
.info-button button{
margin: 0 auto;
width: 147rpx;
height: 50rpx;
line-height: 50rpx;
font-size:24rpx;
font-family:Lantinghei SC;
font-weight:600;
color:rgba(255,255,255,1);
text-shadow:0px 1px 0px rgba(130,66,0,0.26);
background: url(https://aloss.hotforest.cn/bundesliga/info-button.png) no-repeat center;
}
.logs-scroll-Y{
width: 99%;
height: 70%;
}
</style>
<template>
<view class="uni-flex uni-column index-bg">
<view class="uni-flex uni-row index-top">
<view class="flex-item index-top-l"><view class="left-icon" @click="changeRuleModal()">游戏规则</view></view>
<view class="flex-item index-top-r">
<view class="right-icon" v-if="loginAppStatus" @click="changeLogsModal()">竞猜记录</view>
<view class="right-icon" v-if="!loginAppStatus" @click="loginApp">竞猜记录</view>
<!-- <view class="right-icon" v-if="!loginAppStatus" @click="changeLogsModal">竞猜记录</view> -->
</view>
</view>
<view class=" uni-column question-bg">
<view class="question-bg-title">
<view class="flex-item flex-item-V question-title">德甲第 1 轮</view>
<view class="flex-item flex-item-V question-title-2">本场竞猜截止到5月3日 12:00之前</view>
</view>
<view class="flex-item flex-item-v team-item"
v-for="(team, i) in teamList" :key="i">
<view class="uni-flex uni-row question-title-3">
<view class="flex-item question-1">
<!-- 主队 <br> -->
<img v-if="team.quiz_result == 1" src="https://aloss.hotforest.cn/bundesliga/virctory.png" alt="img">
</view>
<view class="flex-item question-2">
<img :src="team.home_team_icon" alt="img" />
{{ team.home_team_name }}
</view>
<view class="flex-item question-3">
<view class="question-3-vs">VS</view>
<view><span>{{ team.competition_time }}</span></view>
<view><span>{{ team.home_team_score }} - {{ team.guest_team_score }}</span></view>
</view>
<view class="flex-item question-4">
<img :src="team.guest_team_icon" alt="img" />
{{ team.guest_team_name }}
</view>
<view class="flex-item question-5">
<!-- 客队 <br> -->
<img v-if="team.quiz_result == 2" src="https://aloss.hotforest.cn/bundesliga/virctory.png" alt="img">
</view>
</view>
<view class="team-answer" v-if="team.quiz_result != 0 ">
<view class="flex-item flex-item-V option-item"
:class="[team.quiz_result==1 ? 'option-active-right' : 'option-active-wrong']"
>
主队胜
</view>
<view class="flex-item flex-item-V option-item "
:class="[team.quiz_result==3 ? 'option-active-right' : 'option-active-wrong']"
>
平
</view>
<view class="flex-item flex-item-V option-item "
:class="[team.quiz_result==2 ? 'option-active-right' : 'option-active-wrong']"
>
客队胜
</view>
</view>
<view class="team-answer" v-if="team.quiz_result == 0 ">
<view class="flex-item flex-item-V option-item"
:class="[team.id + '_' + 1 == team.checkValue ? 'option-active' : '']"
@click="sOption(team.id, 1)">
主队胜
</view>
<view class="flex-item flex-item-V option-item "
:class="[team.id + '_' + 3 == team.checkValue ? 'option-active' : '']"
@click="sOption(team.id, 3)">
平
</view>
<view class="flex-item flex-item-V option-item "
:class="[team.id + '_' + 2 == team.checkValue ? 'option-active' : '']"
@click="sOption(team.id, 2)">
客队胜
</view>
</view>
</view>
<view class="flex-item flex-item-V question-button">
<button v-if="loginAppStatus==true && quizStatus==false "
@click="addUserQuizLog()" type="default">确认选择</button>
<button v-if="loginAppStatus==false"
@click="loginApp" type="default">确认选择</button>
</view>
</view>
<view class="rule-modal" v-show="ruleModal" @click="closeRuleModal()"></view>
<view class="rule-modal-bg" v-show="ruleModal">
<view class="flex-item rule-title">游戏规则</view>
<view class="flex-item rule-content">
1.竞猜将于比赛开始前关闭竞猜通道
<br />
2.系统将随机抽取10位答对竞猜的用户,
<br />
3.下期活动开始时,将公布获奖用户名单
<br />
4.获奖用户,请添加全民体育官方微信
<br />
(NationSports)领取相应奖励
</view>
</view>
<view class="logs-modal" v-show="logsModal" @click="closeLogsModal()"></view>
<view class="logs-modal-bg" v-show="logsModal">
<view class="flex-item logs-title">竞猜记录</view>
<view class="uni-row uni-flex logs-1 ">
<view class="flex-item logs-1-1">时间</view>
<view class="flex-item logs-1-2">赛事</view>
<view class="flex-item logs-1-3">我的竞猜</view>
<view class="flex-item logs-1-4">结果</view>
</view>
<view class="flex-item logs-2">第一轮</view>
<scroll-view :scroll-top="scrollTop"
scroll-y="true"
class="logs-scroll-Y"
@scrolltoupper="upper"
@scrolltolower="lower"
@scroll="scroll">
<view class="scroll-view-item logs-3" v-for="(log, i) in userQuizLogs" :key="i">
<view class="uni-row uni-flex ">
<view class="flex-item logs-3-font logs-3-1">{{log.detail.competition_time}}</view>
<view class="flex-item logs-3-font logs-3-2">
{{log.detail.home_team_name}} <br>
{{log.detail.guest_team_name}}
</view>
<view class="flex-item logs-3-font logs-3-3">
<text v-if="log.result == 1">{{log.detail.home_team_name}}</text>
<text v-if="log.result == 2">{{log.detail.guest_team_name}}</text>
<text v-if="log.result == 3">平</text>
<!-- {{log.result}} -->
</view>
<view class="flex-item logs-3-font logs-3-4">
<!-- {{log.r_status}} -->
<text v-if="log.r_status == -1">未开</text>
<text v-if="log.r_status == 1">胜</text>
<text v-if="log.r_status == 0">负</text>
</view>
</view>
</view>
</scroll-view>
</view>
<view class="info-modal" v-show="infoModal" @click="closeInfoModal()"></view>
<view class="info-modal-bg" v-show="infoModal">
<view class="flex-item info-title">信息登记</view>
<view class="flex-item info-content">
<input type="text" v-model="name" placeholder="请输入姓名"> <br>
<input type="number" v-model="mobile" placeholder="请输入手机号">
</view>
<view class="info-button">
<button type="default" @click="updateUserInfo()">确定</button>
</view>
</view>
</view>
</template>
<script>
import base from '@/utils/base.js';
import http from '@/utils/http.js';
export default {
data() {
return {
scrollTop: 0,
old: {
scrollTop: 0
},
teamList: [],
selectList: [],
ruleModal: false,
logsModal: false,
infoModal:false,
appMsgModal:false,
teamId: 0,
userQuizLogs:[],
loginAppStatus: false,
uid: null,
token: null,
ns_device_id: null,
activity_id: 4,
name:'',
mobile:'',
quizStatus:0,
};
},
onLoad(option) {
if (typeof contact === 'undefined') {
uni.showToast({
title:'请下载全民体育APP参与活动',
icon:'none'
})
// this.appMsgModal = true
// this.uid = 469247;
// this.activity_id = 5;
} else {
if (option.uid !== '' && option.uid !== 'null' && option.uid !== undefined) {
uni.setStorageSync('uid', option.uid);
uni.setStorageSync('token', option.token);
uni.setStorageSync('ns_device_id', option.ns_device_id);
this.loginAppStatus = true;
this.uid = uni.getStorageSync('uid');
this.token = uni.getStorageSync('token');
this.ns_device_id = uni.getStorageSync('ns_device_id');
this.checkQuizStatus(this.uid,this.$question.activity_id);
} else {
this.getTeamList();
this.loginAppStatus = false;
// open this url in app env
contact.onLoginDone = function(uid, token) {
uni.setStorageSync('loginAppStatus', true);
let ns_device_id = uni.getStorageSync('ns_device_id');
uni.reLaunch({
url: '/pages/index/mid?uid=' + uid + '&token=' + token + '&ns_device_id=' + ns_device_id
});
};
}
}
},
methods: {
loginApp() {
contact.requireLogin();
console.log('relogin');
},
// 手机号为空时
updateUserInfo:function(){
var that = this;
var uid =that.uid;
var activity_id = that.$question.activity_id;
var ns_device_id = that.ns_device_id;
var mobile = that.mobile;
var name = that.name;
var logs = that.selectList;
var user_type = 3;
if(name.length < 1 || name.length > 5){
uni.showToast({
title:'名字1-5个字符',
icon:"none"
})
return;
}
if(mobile.length != 11 ){
uni.showToast({
title:'请输入11位手机号码',
icon:'none'
})
return;
}
let data = {
uid: uid,
name: name,
mobile: mobile,
activity_id: activity_id,
ns_device_id: ns_device_id,
user_type: user_type
};
http.post(base.sq + '/activity/api.Users/add', data)
.then(res => {
if (res.status == 200) {
console.log(res);
//用户信息添加之后 添加用户竞猜日志
uni.request({
url: base.sq + '/activity/api.quiz/addUserQuizLog',
data: {
uid: uid,
activity_id: activity_id,
logs: JSON.stringify(logs)
},
method: 'POST',
success: res => {
console.log(res);
if (res.statusCode === 200) {
if (res.data.code === 0) {
//竞猜按钮变灰色
this.quizStatus = true;
uni.showToast({
title:'竞猜成功',
icon:"none"
})
}else{
uni.showToast({
title:res.data.info,
icon:"none"
})
}
} else {
uni.showToast({
title:'server error',
icon:"none"
})
}
}
});
} else {
uni.showToast({
title:'server error',
icon:"none"
})
}
})
.catch(error => {})
.finally(() => {});
this.infoModal = false;
},
// 手机号非空时
addUserInfo:function(name,mobile){
var that = this;
var uid =that.uid;
var activity_id = that.$question.activity_id;
var ns_device_id = that.ns_device_id;
var logs = that.selectList;
var user_type = 1;
let data = {
uid: uid,
name: name,
mobile: mobile,
activity_id: activity_id,
ns_device_id: ns_device_id,
user_type: user_type
};
http.post(base.sq + '/activity/api.Users/add', data)
.then(res => {
if (res.status == 200) {
// console.log(res);
//用户信息添加之后 添加用户竞猜日志
uni.request({
url: base.sq + '/activity/api.quiz/addUserQuizLog',
data: {
uid: uid,
activity_id: activity_id,
logs: JSON.stringify(logs)
},
method: 'POST',
success: res => {
console.log(res);
if (res.statusCode === 200) {
if (res.data.code === 0) {
//竞猜按钮变灰色
this.quizStatus = true;
uni.showToast({
title:'竞猜成功',
icon:"none"
})
// console.log(this.quizStatus);
}else{
uni.showToast({
title:res.data.info,
icon:"none"
})
}
} else {
uni.showToast({
title:'server error',
icon:"none"
})
}
}
});
} else {
uni.showToast({
title:'server error',
icon:"none"
})
}
})
.catch(error => {})
.finally(() => {});
this.infoModal = false;
},
checkQuizStatus:function(uid,activity_id){
let data = {
uid:uid,
activity_id:activity_id
}
http.post(base.sq + '/activity/api.Quiz/checkUserQuizStatus', data)
.then(res=>{
console.log(res);
if (res.status == 200) {
this.quizStatus = res.data.data.status;
if(res.data.data.status==true){
this.getUserQuizTeamList(uid,activity_id);
}else{
this.getTeamList();
}
} else {
uni.showToast({
title:'server error',
icon:"none"
})
}
})
},
getUserQuizLogs(uid,activity_id){
uni.request({
url: base.sq + '/activity/api.quiz/getUserQuizLogs',
data: {
uid: uid,
activity_id: activity_id,
},
method: 'POST',
success: res => {
// console.log(res);
if (res.statusCode === 200) {
if (res.data.code === 0) {
this.userQuizLogs = res.data.data;
console.log(this.userQuizLogs);
}else{
uni.showToast({
title:res.data.info,
icon:"none"
})
}
} else {
uni.showToast({
title:'server error',
icon:"none"
})
}
}
});
},
sOption(teamId, result) {
let that = this;
that.teamId = teamId;
var key = 'team_' + teamId;
var teamList = this.teamList;
var a = teamId + '_' + result;
teamList.forEach(item => {
if (item.id === teamId) {
item.checkValue = a;
}
});
// todos two days
this.$forceUpdate((this.teamList = teamList));
// this.teamList = teamList;
var selectList = this.selectList;
var optionObject = {
team_id: teamId,
result: result
};
for (var i = 0; i < selectList.length; i++) {
var team_id = selectList[i]['team_id'];
if (team_id == teamId) {
selectList.splice(i, 1);
}
}
selectList.push(optionObject);
this.selectList = selectList;
},
closeRuleModal() {
this.ruleModal = false;
},
changeRuleModal() {
this.ruleModal = true;
},
closeLogsModal() {
this.logsModal = false;
},
changeLogsModal() {
this.logsModal = true;
this.getUserQuizLogs(this.uid,this.$question.activity_id);
},
closeInfoModal() {
this.infoModal = false;
},
addUserQuizLog: function() {
var that = this;
var uid = that.uid;
var activity_id = that.activity_id;
var ns_device_id = that.ns_device_id;
var token = that.token;
// 判断题目是否全部答完
var teamLength = that.teamList.length;
var selectLength = that.selectList.length;
if(teamLength>selectLength){
uni.showToast({
title:'请继续答题',
icon:'none'
})
return;
}
let data = {
uid: uid,
activity_id: activity_id
};
http.post(base.sq + '/activity/api.users/checkUidStatus', data)
.then(res => {
// console.log(res);
if (res.status == 200) {
// console.log(res.data.data.count);
let count = res.data.data.count;
// 检查用户是否在数据库中
if (count <= 0) {
let req_url = base.bd + '/v3/user/info';
let headers = {
ns_device_id: ns_device_id,
uid: uid,
token:token
};
http.get(req_url, { headers: headers }).then(res => {
// console.log(res);
if (res.status == 200) {
if (res.data.Status == 1) {
let nickname = res.data.Data.nickname;
let mobile = res.data.Data.phone;
console.log(res);
if(mobile == ''){
this.infoModal = true;
}else{
this.addUserInfo(nickname,mobile);
}
}
} else {
uni.showToast({
title:'server error',
icon:"none"
})
}
});
}
} else {
uni.showToast({
title:'server error',
icon:"none"
})
}
})
.catch(error => {})
.finally(() => {});
},
getTeamList: function() {
uni.request({
url: base.sq + '/activity/api.quiz/teamList',
success: res => {
console.log(res)
if (res.statusCode === 200) {
if (res.data.code === 0) {
var list = res.data.data;
this.teamList = list;
// console.log(list);
}
} else {
uni.showToast({
title:'server error',
icon:"none"
})
}
}
});
},
getUserQuizTeamList: function(uid,activity_id) {
uni.request({
url: base.sq + '/activity/api.quiz/getUserQuizTeamList',
data:{
uid:uid,
activity_id:activity_id
},
method:'POST',
success: res => {
console.log(res)
if (res.statusCode === 200) {
if (res.data.code === 0) {
var list = res.data.data;
this.teamList = list;
// console.log(list);
}
} else {
uni.showToast({
title:'server error',
icon:"none"
})
}
}
});
},
}
};
</script>
<style>
.index-bg {
background: url(https://aloss.hotforest.cn/bundesliga/index-bg.png) no-repeat center;
background-size: 100% 100%;
height: 100%;
}
.index-top {
margin-top: 114rpx;
}
.index-top-l {
width: 50%;
text-align: left;
}
.index-top-r {
width: 50%;
vertical-align: text-bottom;
}
.left-icon {
text-align: center;
background: url(https://aloss.hotforest.cn/bundesliga/left-icon.png) no-repeat center;
background-size: 100% 100%;
width: 134rpx;
height: 55rpx;
font-size: 22rpx;
font-family: MF LingHei (Noncommercial);
font-weight: 400;
color: rgba(146, 251, 255, 1);
line-height: 55rpx;
}
.right-icon {
margin-left: auto;
text-align: center;
background: url(https://aloss.hotforest.cn/bundesliga/right-icon.png) no-repeat center;
background-size: 100% 100%;
width: 134rpx;
height: 55rpx;
font-size: 22rpx;
font-family: MF LingHei (Noncommercial);
font-weight: 400;
color: rgba(146, 251, 255, 1);
line-height: 55rpx;
}
.question-bg {
/* background: url(https://aloss.hotforest.cn/bundesliga/question-bg.png) no-repeat center; */
background-size: 100% 100%;
/* width: 708rpx; */
/* height: 700rpx; */
width: 100%;
/* height: 100%; */
margin:0 auto;
margin-top: 40%;
background-color: rgb(56,30,128);
}
.question-bg-title{
width: 708rpx;
margin: 0 auto;
margin-top: 20rpx;
border-radius: 30rpx;
background-color: rgba(50, 141, 255, 1);
}
.team-item{
background-color: #FFFFFF;
width: 708rpx;
margin: 0 auto;
border-radius: 30rpx;
}
.team-answer{
padding-bottom: 30rpx;
}
.question-title-p {
margin: auto;
}
.question-title {
text-align: center;
font-size: 40rpx;
line-height: 60rpx;
font-family: MF LingHei (Noncommercial);
font-weight: 400;
color: rgba(254, 254, 254, 1);
text-shadow: 0px 3rpx 2rpx rgba(0, 0, 0, 0.29);
}
.question-title-2 {
text-align: center;
font-size: 24rpx;
font-family: Lantinghei SC;
font-weight: 600;
color: rgba(255, 241, 161, 1);
}
.question-title-3 {
margin-top: 30rpx;
padding-bottom: 30rpx;
padding-top: 30rpx;
}
.question-1 {
width: 10%;
margin-left: 2%;
font-size: 24rpx;
font-family: Lantinghei SC;
font-weight: 600;
color: rgba(51, 51, 51, 1);
}
.question-1 img{
width: 116rpx;
height: 113rpx;
}
.question-5 {
width: 10%;
margin-left: 2%;
font-size: 24rpx;
font-family: Lantinghei SC;
font-weight: 600;
color: rgba(51, 51, 51, 1);
}
.question-5 img{
width: 116rpx;
height: 113rpx;
}
.question-2 {
width: 20%;
margin-left: 2%;
text-align: center;
font-size: 24rpx;
font-family: Lantinghei SC;
font-weight: 600;
color: rgba(51, 51, 51, 1);
}
.question-2 img {
max-width: 100%;
max-height: 100%;
/* width: 148rpx;
height: 110rpx; */
}
.question-4 {
width: 20%;
margin-left: 2%;
text-align: center;
font-size: 24rpx;
font-family: Lantinghei SC;
font-weight: 600;
color: rgba(51, 51, 51, 1);
}
.question-4 img {
width: 100%;
}
.question-3 {
text-align: center;
width: 30%;
}
.question-3-vs{
font-size: 46rpx;
font-family: MF LingHei (Noncommercial);
font-weight: bolder;
color: rgba(50, 141, 255, 1);
}
.question-3 span {
font-size: 28rpx;
font-family: MF LingHei (Noncommercial);
font-weight:bolder;
color: rgba(50, 141, 255, 1);
}
.option-name-1 {
text-align: center;
width: 100%;
font-size: 30rpx;
font-family: Lantinghei SC;
font-weight: 600;
color: rgba(50, 141, 255, 1);
}
.option-active {
/* background-color: #29A518; */
background-color: #007AFF;
color: #ffffff !important;
border: none !important;
}
.option-active-wrong {
/* background-color: #29A518; */
background-color: #ff4f15;
color: #ffffff !important;
border: none !important;
}
.option-active-right {
/* background-color: #29A518; */
background-color: #29A518;
color: #ffffff !important;
border: none !important;
}
.option-item {
width: 600rpx;
height: 62rpx;
border: 1px solid rgba(0, 160, 233, 1);
border-radius: 30rpx;
margin: 0 auto;
margin-top: 20rpx;
text-align: center;
font-size: 30rpx;
font-family: Lantinghei SC;
font-weight: 600;
color: rgba(50, 141, 255, 1);
}
.question-button {
margin-top: 30rpx;
margin-bottom: 30rpx;
}
.question-button button {
background: url(https://aloss.hotforest.cn/bundesliga/button-y.png) no-repeat center;
background-size: 100% 100%;
width: 365rpx;
height: 92rpx;
font-size: 36rpx;
font-family: Lantinghei SC;
font-weight: 600;
color: rgba(255, 255, 255, 1);
text-shadow: 0px 2px 6px rgba(0, 0, 0, 0.75);
-webkit-text-stroke: 3px undefined;
text-stroke: 3px undefined;
}
.scroll-Y {
width: 100%;
}
.rule-modal {
position: fixed;
z-index: 100;
top: 0;
left: 0;
bottom: 0;
right: 0;
background-color: rgba(0, 0, 0, 0.6);
}
.rule-modal-bg {
position: fixed;
z-index: 110;
top: 0;
left: 0;
bottom: 0;
right: 0;
margin: auto;
width: 552rpx;
height: 452rpx;
background: url(https://aloss.hotforest.cn/bundesliga/modal-1.png) no-repeat center;
background-size: 100% 100%;
}
.rule-title {
font-size: 30rpx;
font-family: MF LingHei (Noncommercial);
font-weight: 400;
color: rgba(255, 255, 255, 1);
line-height: 35rpx;
padding-top: 31rpx;
padding-left: 34rpx;
}
.rule-content {
padding-left: 34rpx;
padding-top: 80rpx;
font-size: 24rpx;
font-family: Lantinghei SC;
font-weight: 600;
color: rgba(255, 255, 255, 1);
}
.logs-modal {
position: fixed;
z-index: 100;
top: 0;
left: 0;
bottom: 0;
right: 0;
background-color: rgba(0, 0, 0, 0.6);
}
.logs-modal-bg {
position: fixed;
z-index: 110;
top: 0;
left: 0;
bottom: 0;
right: 0;
margin: auto;
/* width: 552rpx; */
width: 80%;
height: 80%;
/* height: 452rpx; */
background: url(https://aloss.hotforest.cn/bundesliga/modal-2.png) no-repeat center;
background-size: 100% 100%;
}
.logs-title {
font-size: 30rpx;
font-family: MF LingHei (Noncommercial);
color: rgba(255, 255, 255, 1);
line-height: 80rpx;
width: 90%;
height: 80rpx;
text-indent: 30rpx;
font-weight: bolder;
}
.logs-content {
padding-left: 34rpx;
padding-top: 80rpx;
font-size: 24rpx;
font-family: Lantinghei SC;
font-weight: 600;
color: rgba(255, 255, 255, 1);
}
.logs-1{
width: 99%;
height: 60rpx;
line-height: 60rpx;
border-bottom: 1px solid #39B8BF;
font-size:24rpx;
font-family:Lantinghei SC;
color: #FFFFFF;
}
.logs-1-1{
width: 35%;
text-indent: 20rpx;
}
.logs-1-2{
width: 20%;
}
.logs-1-3{
width: 25%;
}
.logs-1-4{
width: 20%;
text-align: center;
}
.logs-2{
width: 99%;
height: 50rpx;
line-height: 50rpx;
text-indent: 20rpx;
font-size:18rpx;
font-family:Lantinghei SC;
font-weight:600;
color:rgba(255,255,255,1);
border-bottom: 1px dashed #39B8BF;
}
.logs-3{
padding:20rpx 20rpx 10rpx 20rpx;
border-bottom: 1px solid #39B8BF;
}
.logs-3-font{
font-size:18rpx;
font-family:Lantinghei SC;
font-weight:600;
color:rgba(255,255,255,1);
}
.logs-3-1{
width: 35%;
}
.logs-3-2{
width: 20%;
}
.logs-3-3{
width: 25%;
text-align: center;
}
.logs-3-4{
width: 20%;
text-align: center;
}
.info-modal {
position: fixed;
z-index: 100;
top: 0;
left: 0;
bottom: 0;
right: 0;
background-color: rgba(0, 0, 0, 0.6);
}
.info-modal-bg {
position: fixed;
z-index: 110;
top: 0;
left: 0;
bottom: 0;
right: 0;
margin: auto;
width: 552rpx;
height: 452rpx;
background: url(https://aloss.hotforest.cn/bundesliga/modal-1.png) no-repeat center;
background-size: 100% 100%;
}
.info-title {
font-size: 30rpx;
font-family: MF LingHei (Noncommercial);
font-weight: 400;
color: rgba(255, 255, 255, 1);
line-height: 35rpx;
padding-top: 31rpx;
padding-left: 34rpx;
}
.info-content {
width: 90%;
padding-left: 34rpx;
padding-top: 80rpx;
font-size: 24rpx;
font-family: Lantinghei SC;
font-weight: 600;
color: rgba(255, 255, 255, 1);
}
.info-content input{
border-bottom: 1rpx solid #39B8BF;
}
/deep/ .uni-input-placeholder{
color: #FFFFFF !important;
font-size:24rpx;
font-family:Lantinghei SC;
font-weight:600;
}
.info-button{
margin-top: 80rpx;
}
.info-button-quiz-active{
background: #888888 !important;
}
.info-button button{
margin: 0 auto;
width: 147rpx;
height: 50rpx;
line-height: 50rpx;
font-size:24rpx;
font-family:Lantinghei SC;
font-weight:600;
color:rgba(255,255,255,1);
text-shadow:0px 1px 0px rgba(130,66,0,0.26);
background: url(https://aloss.hotforest.cn/bundesliga/info-button.png) no-repeat center;
}
.logs-scroll-Y{
width: 99%;
height: 70%;
}
</style>
收起阅读 »

微信小程序 ios input隐藏之后placeholder仍然显示问题
使用v-if 控制输入框是否显示 , 输入框隐藏了 但是placeholder仍然展示,用v-show 控制也无法解决 最后自己使用类名控制,用display:none 来控制Input的显隐 才最终解决
使用v-if 控制输入框是否显示 , 输入框隐藏了 但是placeholder仍然展示,用v-show 控制也无法解决 最后自己使用类名控制,用display:none 来控制Input的显隐 才最终解决