新增canvas绘制图片、保存、分享
commit
245d0886b1
|
|
@ -0,0 +1,11 @@
|
|||
//app.js
|
||||
var urlPath = require('./config.js');
|
||||
App({
|
||||
globalData: {
|
||||
isLogin : false
|
||||
},
|
||||
onLaunch: function () {
|
||||
var that = this;
|
||||
wx.setStorageSync('urlPath', urlPath);
|
||||
},
|
||||
})
|
||||
|
|
@ -0,0 +1,53 @@
|
|||
{
|
||||
"pages": [
|
||||
"pages/canvasposter/canvasposter",
|
||||
"pages/index/index",
|
||||
"pages/again/again",
|
||||
"pages/sign/sign",
|
||||
"pages/user/user",
|
||||
"pages/rule/rule",
|
||||
"pages/ranking/ranking",
|
||||
"pages/picture/picture",
|
||||
"pages/personal/personal",
|
||||
"pages/auth/auth"
|
||||
],
|
||||
"tabBar": {
|
||||
"custom": true,
|
||||
"color": "#7A7E83",
|
||||
"selectedColor": "#3cc51f",
|
||||
"borderStyle": "black",
|
||||
"backgroundColor": "#ffffff",
|
||||
"list": [{
|
||||
"pagePath": "pages/canvasposter/canvasposter",
|
||||
"iconPath": "img/bg_w.png",
|
||||
"selectedIconPath": "img/bg_b.png",
|
||||
"text": "首页"
|
||||
},{
|
||||
"pagePath": "pages/index/index",
|
||||
"iconPath": "img/bg_w.png",
|
||||
"selectedIconPath": "img/bg_b.png",
|
||||
"text": "产品"
|
||||
},
|
||||
{
|
||||
"pagePath": "pages/ranking/ranking",
|
||||
"iconPath": "img/bg_w.png",
|
||||
"selectedIconPath": "img/bg_b.png",
|
||||
"text": "排行榜"
|
||||
},
|
||||
{
|
||||
"pagePath": "pages/user/user",
|
||||
"iconPath": "img/bg_w.png",
|
||||
"selectedIconPath": "img/bg_b.png",
|
||||
"text": "个人中心"
|
||||
}
|
||||
]
|
||||
},
|
||||
"window": {
|
||||
"backgroundTextStyle": "light",
|
||||
"navigationBarBackgroundColor": "#fff",
|
||||
"navigationBarTitleText": "丰谷酒业",
|
||||
"navigationBarTextStyle": "black"
|
||||
},
|
||||
"style": "v2",
|
||||
"sitemapLocation": "sitemap.json"
|
||||
}
|
||||
|
|
@ -0,0 +1,120 @@
|
|||
.container{
|
||||
background: #eeeeee;
|
||||
min-height: 100vh;
|
||||
padding-bottom: 40rpx;
|
||||
}
|
||||
view,text,input,button,scroll-view,textarea{
|
||||
box-sizing: border-box;
|
||||
}
|
||||
.container button[disabled],.container button[disabled]:not([type]) {
|
||||
background-color: #ccc;
|
||||
color: #fff;
|
||||
}
|
||||
.top10{
|
||||
margin-top: 10rpx;
|
||||
}
|
||||
.top20{
|
||||
margin-top: 20rpx;
|
||||
}
|
||||
.top30{
|
||||
margin-top: 30rpx;
|
||||
}
|
||||
.top40{
|
||||
margin-top: 40rpx;
|
||||
}
|
||||
/**通用css**/
|
||||
view{
|
||||
box-sizing: border-box;
|
||||
}
|
||||
.view-bg{
|
||||
width: 690rpx;
|
||||
position: relative;
|
||||
background: #fff;
|
||||
margin-left:auto;
|
||||
margin-right: auto;
|
||||
border-radius: 10rpx;
|
||||
overflow: hidden;
|
||||
padding-bottom: 40rpx;
|
||||
}
|
||||
/**/
|
||||
.countdown{
|
||||
width: 100%;
|
||||
text-align: center;
|
||||
padding: 40rpx 0;
|
||||
}
|
||||
.countdown .names{
|
||||
font-size: 30rpx;
|
||||
}
|
||||
.countdown .names text{
|
||||
background: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAfMAAAAJCAYAAAAmccWAAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyVpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDYuMC1jMDAyIDc5LjE2NDQ2MCwgMjAyMC8wNS8xMi0xNjowNDoxNyAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIDIxLjIgKE1hY2ludG9zaCkiIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6Mzk0M0RGRkRGNEJDMTFFQUExNzhEOURGMjAwQUZGODIiIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6Mzk0M0RGRkVGNEJDMTFFQUExNzhEOURGMjAwQUZGODIiPiA8eG1wTU06RGVyaXZlZEZyb20gc3RSZWY6aW5zdGFuY2VJRD0ieG1wLmlpZDozOTQzREZGQkY0QkMxMUVBQTE3OEQ5REYyMDBBRkY4MiIgc3RSZWY6ZG9jdW1lbnRJRD0ieG1wLmRpZDozOTQzREZGQ0Y0QkMxMUVBQTE3OEQ5REYyMDBBRkY4MiIvPiA8L3JkZjpEZXNjcmlwdGlvbj4gPC9yZGY6UkRGPiA8L3g6eG1wbWV0YT4gPD94cGFja2V0IGVuZD0iciI/PhtKAecAAAElSURBVHja7Nu9asJQGMbxk+AN6FAoOHRTlGZz7A0InVoHR6eWDg6dewvq6N6OgmDpRXToVOiqOCjYoR8XUNInTQIOJe2Q4Q35/+AB5WR6Ai+exOOFYehgS3v8mn70laFyoTSUd2Wh3Cjb9KKX6wNKA8DcKTGfCszylFtlojST7zVloDwpR1QEgLmDnxvXGu1owaZzZZax/qCcUhMA5g7YmdvV/2O9q1SpCQBzBxXlWTmmikL+EDt08fssAMhD/R9z542azAnYmRfXl7KhBgA5WlNBcXfmATWYFL2Xus9Yj/5d+klNAHJ0p/Qy1ufKGTXZ43E0zZ69IyJT5fKXS1bKSboz54gIAOZOufGY3bYrFx8JeVQ+lKWLj4x0HI/YATB3kPgWYABV0EFs4jF8rAAAAABJRU5ErkJggg==") no-repeat center;
|
||||
background-size:499rpx 10rpx;
|
||||
display: inline-block;
|
||||
width: 100%;
|
||||
}
|
||||
.countdown .time{
|
||||
color: #666666;
|
||||
font-size: 32rpx;
|
||||
height: 50rpx;
|
||||
line-height: 50rpx;
|
||||
margin-top: 30rpx;
|
||||
}
|
||||
.countdown .time text{
|
||||
height: 50rpx;
|
||||
width: 50rpx;
|
||||
display: inline-block;
|
||||
background:#2a8de9;
|
||||
border-radius: 4rpx;
|
||||
color: #fff;
|
||||
margin:0 6rpx;
|
||||
}
|
||||
.countdown .tab{
|
||||
display: inline-block;
|
||||
width: 100%;
|
||||
margin-top: 40rpx;
|
||||
}
|
||||
.countdown .tab .list{
|
||||
width: 33.33%;
|
||||
float: left;
|
||||
display: inline-block;
|
||||
font-size: 50rpx;
|
||||
border-right: 1rpx solid #ebebeb;
|
||||
font-weight: bold;
|
||||
}
|
||||
.countdown .tab .list text{
|
||||
font-size: 24rpx;
|
||||
color: #333333;
|
||||
font-weight: 400;
|
||||
}
|
||||
.countdown .tab .list text:nth-child(2){
|
||||
display: block;
|
||||
margin-top: 10rpx;
|
||||
}
|
||||
/**/
|
||||
.signup{
|
||||
width: 130rpx;
|
||||
height: 50rpx;
|
||||
line-height: 50rpx;
|
||||
background: #ffc103;
|
||||
color: #fff;
|
||||
font-size: 26rpx;
|
||||
border-radius: 15rpx 0 0 15rpx;
|
||||
text-align: center;
|
||||
position: fixed;
|
||||
top: 460rpx;
|
||||
right: 0;
|
||||
box-shadow: 0 6rpx 6rpx rgba(0,0,0,.2);
|
||||
}
|
||||
.sign-rule{
|
||||
width: 130rpx;
|
||||
height: 50rpx;
|
||||
line-height: 50rpx;
|
||||
background: #2A8DEB;
|
||||
color: #fff;
|
||||
font-size: 26rpx;
|
||||
border-radius: 15rpx 0 0 15rpx;
|
||||
text-align: center;
|
||||
position: fixed;
|
||||
top: 540rpx;
|
||||
right: 0;
|
||||
box-shadow: 0 6rpx 6rpx rgba(0,0,0,.2);
|
||||
}
|
||||
|
|
@ -0,0 +1,23 @@
|
|||
var host = "https://vote.daiguanyun.com";
|
||||
var host = "http://192.168.2.15:8810";
|
||||
var config = {
|
||||
host:host,
|
||||
getopenid: host + "/index/getOpenId",
|
||||
getVoteList: host + '/index/rankList',
|
||||
getSlideList: host + '/index/getSlideList',
|
||||
getDetail: host + '/index/getOneById',
|
||||
getImgs: host + '/index/getImgs',
|
||||
getBaseInfo: host + '/index/getBaseInfo',
|
||||
upload: host + '/index/upload',
|
||||
saveProduction: host + '/index/saveProduction',
|
||||
getUser: host + '/index/getUser',
|
||||
vote : host + '/index/vote',
|
||||
getUserById:host + '/index/getUserById',
|
||||
getUserProduction: host + '/index/getUserProduction',
|
||||
saveVisit: host + '/index/saveVisit',
|
||||
search: host + '/index/search',
|
||||
getBottleCategories: host + '/index/getBottleCategories',//酒瓶标题
|
||||
composeBottle: host + '/index/composeBottle',//保存图片
|
||||
getBottleWidgets: host + '/index/getBottleWidgets',//查询作品
|
||||
}
|
||||
module.exports = config;
|
||||
|
|
@ -0,0 +1,38 @@
|
|||
Component({
|
||||
data: {
|
||||
selected: '-1',
|
||||
color: "#7A7E83",
|
||||
selectedColor: "#fff",
|
||||
list: [{
|
||||
pagePath: "/pages/canvasposter/canvasposter",
|
||||
iconPath: "/img/bg_w.png",
|
||||
selectedIconPath: "/img/bg_b.png",
|
||||
text: "首页"
|
||||
},{
|
||||
pagePath: "/pages/index/index",
|
||||
iconPath: "/img/bg_w.png",
|
||||
selectedIconPath: "/img/bg_b.png",
|
||||
text: "产品"
|
||||
}, {
|
||||
pagePath: "/pages/ranking/ranking",
|
||||
iconPath: "/img/bg_w.png",
|
||||
selectedIconPath: "/img/bg_b.png",
|
||||
text: "排行榜"
|
||||
}, {
|
||||
pagePath: "/pages/user/user",
|
||||
iconPath: "/img/bg_w.png",
|
||||
selectedIconPath: "/img/bg_b.png",
|
||||
text: "个人中心"
|
||||
}]
|
||||
},
|
||||
attached() {},
|
||||
methods: {
|
||||
switchTab(e) {
|
||||
const data = e.currentTarget.dataset
|
||||
const url = data.path
|
||||
wx.switchTab({
|
||||
url
|
||||
}) //可能是改变样式的原因
|
||||
}
|
||||
}
|
||||
})
|
||||
|
|
@ -0,0 +1,3 @@
|
|||
{
|
||||
"component": true
|
||||
}
|
||||
|
|
@ -0,0 +1,8 @@
|
|||
<!--miniprogram/custom-tab-bar/index.wxml-->
|
||||
<cover-view class="tab-bar">
|
||||
<cover-view wx:for="{{list}}" wx:key="index" class="tab-bar-item" data-path="{{item.pagePath}}"
|
||||
data-index="{{index}}" bindtap="switchTab">
|
||||
<cover-image src="{{selected === index ? item.selectedIconPath : item.iconPath}}"></cover-image>
|
||||
<cover-view style="color: {{selected === index ? selectedColor : color}}">{{item.text}}</cover-view>
|
||||
</cover-view>
|
||||
</cover-view>
|
||||
|
|
@ -0,0 +1,37 @@
|
|||
.tab-bar {
|
||||
position: fixed;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
height: 89rpx;
|
||||
background: white;
|
||||
display: flex;
|
||||
box-shadow: 0 -10rpx 10rpx rgba(0,0,0,.1);
|
||||
}
|
||||
|
||||
|
||||
.tab-bar-item {
|
||||
flex: 1;
|
||||
text-align: center;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.tab-bar-item cover-image {
|
||||
width: 100%;
|
||||
height: 91rpx;
|
||||
}
|
||||
|
||||
.tab-bar-item cover-view {
|
||||
position: relative;
|
||||
top: 0;
|
||||
width: 100%;
|
||||
left: 0;
|
||||
height: 90rpx;
|
||||
line-height: 90rpx;
|
||||
font-size: 30rpx;
|
||||
z-index: 99;
|
||||
margin-top: -90rpx;
|
||||
}
|
||||
Binary file not shown.
Binary file not shown.
|
After Width: | Height: | Size: 914 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 891 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 2.0 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 1.1 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 1.8 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 42 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 36 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 3.5 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 70 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 20 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 90 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 2.2 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 319 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 304 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 1.2 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 37 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 2.3 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 2.2 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 2.1 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 1.1 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 1.2 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 141 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 392 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 319 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 304 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 245 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 58 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 179 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 135 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 2.8 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 2.3 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 24 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 46 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 77 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 2.2 KiB |
|
|
@ -0,0 +1,154 @@
|
|||
// pages/sign/sign.js
|
||||
Page({
|
||||
|
||||
/**
|
||||
* 页面的初始数据
|
||||
*/
|
||||
data: {
|
||||
img_url:wx.getStorageSync('img_url'),
|
||||
swiperCurrent:0,
|
||||
autoplay: false,
|
||||
interval: 3000,
|
||||
duration: 800,
|
||||
//倒计时数据
|
||||
endTime: '2020/11/22 10:40:30',
|
||||
//
|
||||
tab_number:31,//参与者
|
||||
tab_vote:2375,//投票数
|
||||
tab_visit:55,//访问次数
|
||||
//上传图
|
||||
source:'',
|
||||
is_upload:'0',
|
||||
},
|
||||
/**
|
||||
* 上传图片
|
||||
*/
|
||||
uploadimg:function(){
|
||||
var that = this;
|
||||
wx.chooseImage({ //从本地相册选择图片或使用相机拍照
|
||||
count: 1, // 默认9
|
||||
sizeType: ['original', 'compressed'], // 可以指定是原图还是压缩图，默认二者都有
|
||||
sourceType: ['album', 'camera'], // 可以指定来源是相册还是相机，默认二者都有
|
||||
success:function(res){
|
||||
//前台显示
|
||||
that.setData({
|
||||
source: res.tempFilePaths,
|
||||
is_upload:'1'
|
||||
})
|
||||
// 返回选定照片的本地文件路径列表，tempFilePath可以作为img标签的src属性显示图片
|
||||
var tempFilePaths = res.tempFilePaths
|
||||
wx.uploadFile({
|
||||
url: '#',
|
||||
filePath: tempFilePaths[0],
|
||||
name: 'file',
|
||||
success:function(res){
|
||||
//打印
|
||||
}
|
||||
})
|
||||
}
|
||||
})
|
||||
//https://www.jb51.net/article/132557.htm 后端源码
|
||||
},
|
||||
//上传图片
|
||||
swiperChange: function (e) {
|
||||
this.setData({
|
||||
swiperCurrent: e.detail.current
|
||||
})
|
||||
},
|
||||
/**
|
||||
* 生命周期函数--监听页面加载
|
||||
*/
|
||||
onLoad: function (options) {
|
||||
var that = this;
|
||||
that.countDown()
|
||||
},
|
||||
// 倒计时
|
||||
countDown:function(){
|
||||
var that=this;
|
||||
var nowTime = new Date().getTime();//现在时间（时间戳）
|
||||
var endTime = new Date(that.data.endTime).getTime();//结束时间（时间戳）
|
||||
var time = (endTime-nowTime)/1000;//距离结束的毫秒数
|
||||
// 获取天、时、分、秒
|
||||
let day = parseInt(time / (60 * 60 * 24));
|
||||
let hou = parseInt(time % (60 * 60 * 24) / 3600);
|
||||
let min = parseInt(time % (60 * 60 * 24) % 3600 / 60);
|
||||
let sec = parseInt(time % (60 * 60 * 24) % 3600 % 60);
|
||||
day = that.timeFormin(day),
|
||||
hou = that.timeFormin(hou),
|
||||
min = that.timeFormin(min),
|
||||
sec = that.timeFormin(sec)
|
||||
that.setData({
|
||||
day: that.timeFormat(day),
|
||||
hou: that.timeFormat(hou),
|
||||
min: that.timeFormat(min),
|
||||
sec: that.timeFormat(sec)
|
||||
})
|
||||
// 每1000ms刷新一次
|
||||
if (time>0){
|
||||
that.setData({
|
||||
countDown: true
|
||||
})
|
||||
setTimeout(this.countDown, 1000);
|
||||
}else{
|
||||
that.setData({
|
||||
countDown:false
|
||||
})
|
||||
}
|
||||
},
|
||||
//小于10的格式化函数（2变成02）
|
||||
timeFormat(param) {
|
||||
return param < 10 ? '0' + param : param;
|
||||
},
|
||||
//小于0的格式化函数（不会出现负数）
|
||||
timeFormin(param) {
|
||||
return param < 0 ? 0: param;
|
||||
},
|
||||
/**
|
||||
* 生命周期函数--监听页面初次渲染完成
|
||||
*/
|
||||
onReady: function () {
|
||||
|
||||
},
|
||||
|
||||
/**
|
||||
* 生命周期函数--监听页面显示
|
||||
*/
|
||||
onShow: function () {
|
||||
|
||||
},
|
||||
|
||||
/**
|
||||
* 生命周期函数--监听页面隐藏
|
||||
*/
|
||||
onHide: function () {
|
||||
|
||||
},
|
||||
|
||||
/**
|
||||
* 生命周期函数--监听页面卸载
|
||||
*/
|
||||
onUnload: function () {
|
||||
|
||||
},
|
||||
|
||||
/**
|
||||
* 页面相关事件处理函数--监听用户下拉动作
|
||||
*/
|
||||
onPullDownRefresh: function () {
|
||||
|
||||
},
|
||||
|
||||
/**
|
||||
* 页面上拉触底事件的处理函数
|
||||
*/
|
||||
onReachBottom: function () {
|
||||
|
||||
},
|
||||
|
||||
/**
|
||||
* 用户点击右上角分享
|
||||
*/
|
||||
onShareAppMessage: function () {
|
||||
|
||||
}
|
||||
})
|
||||
|
|
@ -0,0 +1,3 @@
|
|||
{
|
||||
"usingComponents": {}
|
||||
}
|
||||
|
|
@ -0,0 +1,66 @@
|
|||
<!--pages/sign.wxml-->
|
||||
<view class="container">
|
||||
<view class="page-body">
|
||||
<view class="page-section page-section-spacing swiper">
|
||||
<swiper autoplay="true" interval="{{interval}}" duration="{{duration}}"
|
||||
circular="true" current="{{swiperCurrent}}" bindchange="swiperChange">
|
||||
<block wx:for="{{img_url}}" >
|
||||
<swiper-item>
|
||||
<view class="swiper-item">
|
||||
<image src="{{item}}" ></image>
|
||||
</view>
|
||||
</swiper-item>
|
||||
</block>
|
||||
</swiper>
|
||||
</view>
|
||||
<view class="dots">
|
||||
<block wx:for="{{img_url}}" wx:key="unique">
|
||||
<view class="dot{{index == swiperCurrent ? ' active' : ''}}"></view>
|
||||
</block>
|
||||
</view>
|
||||
</view>
|
||||
<!--内容-->
|
||||
<view class="view-bg top40">
|
||||
<view class="countdown">
|
||||
<view class="names">
|
||||
<text>距离投票结束还有</text>
|
||||
</view>
|
||||
<view class="time" >
|
||||
<text>{{day}}</text>天 <text>{{hou}}</text>时<text>{{min}}</text>分<text>{{sec}}</text>秒
|
||||
</view>
|
||||
<view class="tab">
|
||||
<view class="list">
|
||||
{{tab_number}}<text>人</text>
|
||||
<text>参与者</text>
|
||||
</view>
|
||||
<view class="list">
|
||||
{{tab_vote}}<text>票</text>
|
||||
<text>投票数</text>
|
||||
</view>
|
||||
<view class="list">
|
||||
{{tab_visit}}<text>次</text>
|
||||
<text>访问量</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<!--表单-->
|
||||
<view class="sign">
|
||||
<form>
|
||||
<view class="list">
|
||||
<text>描述</text>
|
||||
<textarea placeholder="请介绍一下自己" maxlength="100" adjust-position="true" />
|
||||
</view>
|
||||
<view class="list">
|
||||
<text>上传作品</text>
|
||||
<view class="img">
|
||||
<image src='{{source}}'/>
|
||||
<view class="{{is_upload=='1'?'uploadopacity':''}} uploadimg" bindtap="uploadimg"></view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="list">
|
||||
<button>提交报名</button>
|
||||
</view>
|
||||
</form>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
|
@ -0,0 +1,102 @@
|
|||
/* pages/sign/sign.wxss */
|
||||
.page-body{
|
||||
height: 300rpx;
|
||||
position: relative;
|
||||
}
|
||||
.swiper-item image{
|
||||
width: 100%;
|
||||
height: 300rpx;
|
||||
}
|
||||
.dots{
|
||||
display: inline-block;
|
||||
position: absolute;
|
||||
bottom: 20rpx;
|
||||
right: 0;
|
||||
padding: 0 20rpx;
|
||||
}
|
||||
.dots .dot{
|
||||
width: 8rpx;
|
||||
height: 8rpx;
|
||||
background: #fff;
|
||||
float: left;
|
||||
margin:0 4rpx;
|
||||
border-radius: 50%;
|
||||
}
|
||||
.dots .dot.active{
|
||||
background: #2a8de9;
|
||||
}
|
||||
.sign{
|
||||
padding: 0 40rpx;
|
||||
width: 100%;
|
||||
}
|
||||
.sign .list{
|
||||
margin-top: 40rpx;
|
||||
width: 100%;
|
||||
}
|
||||
.sign .list text{
|
||||
font-size: 30rpx;
|
||||
}
|
||||
.sign .list input,.sign .list textarea{
|
||||
width: 610rpx;
|
||||
height: 70rpx;
|
||||
border: none;
|
||||
background-color: #eeeeee;
|
||||
border-radius: 5rpx;
|
||||
margin-top: 10rpx;
|
||||
padding: 0 20rpx;
|
||||
font-size: 26rpx;
|
||||
}
|
||||
.sign .list textarea{
|
||||
height: 173rpx;
|
||||
padding-top: 20rpx;
|
||||
}
|
||||
.sign .list button:not([size='mini']){
|
||||
width: 570rpx;
|
||||
border-radius: 8rpx;
|
||||
background-color: #2a8de9;
|
||||
color: #fff;
|
||||
font-size: 30rpx;
|
||||
height: 74rpx;
|
||||
}
|
||||
.sign .list .img{
|
||||
margin-top:20rpx;
|
||||
display: inline-block;
|
||||
width: 100%;
|
||||
position: relative;
|
||||
}
|
||||
.sign .list image{
|
||||
width: 160rpx;
|
||||
height: 160rpx;
|
||||
float: left;
|
||||
}
|
||||
.sign .list .uploadimg{
|
||||
width: 160rpx;
|
||||
height: 160rpx;
|
||||
border: 2rpx solid #cacaca;
|
||||
position: relative;
|
||||
}
|
||||
.uploadopacity{
|
||||
opacity:0
|
||||
}
|
||||
.sign .list .uploadimg::after{
|
||||
width: 112rpx;
|
||||
height: 6rpx;
|
||||
background: #cacaca;
|
||||
content: "";
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
margin-left: -56rpx;
|
||||
top: 50%;
|
||||
margin-top: -3rpx;
|
||||
}
|
||||
.sign .list .uploadimg::before{
|
||||
width: 6rpx;
|
||||
height: 112rpx;
|
||||
background: #cacaca;
|
||||
content: "";
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
margin-left: -3rpx;
|
||||
top: 50%;
|
||||
margin-top: -56rpx;
|
||||
}
|
||||
|
|
@ -0,0 +1,17 @@
|
|||
var app = getApp();
|
||||
Page({
|
||||
data: {
|
||||
canIUse: wx.canIUse('button.open-type.getUserInfo')
|
||||
},
|
||||
onAuth() {
|
||||
wx.getSetting({
|
||||
success: (res) => {
|
||||
if (res.authSetting['scope.userInfo']) {
|
||||
wx.reLaunch({
|
||||
url: '../index/index',
|
||||
})
|
||||
}
|
||||
}
|
||||
})
|
||||
}
|
||||
})
|
||||
|
|
@ -0,0 +1,3 @@
|
|||
{
|
||||
"usingComponents": {}
|
||||
}
|
||||
|
|
@ -0,0 +1,7 @@
|
|||
<view class="auth">
|
||||
<image src="https://res.wx.qq.com/wxopenres/htmledition/images/favicon32f740.ico" class="img" mode="aspectFill"></image>
|
||||
<view class="title">微信授权页面</view>
|
||||
<view class="describe">此页面是微信授权页面，点击下方按钮弹出授权或跳转页面</view>
|
||||
<button class="btn" open-type='getUserInfo' wx:if="{{canIUse}}" bindgetuserinfo='onAuth'>点击微信授权</button>
|
||||
<navigator wx:if="{{!canIUse}}" class="btn" url="/pages/auth/auth" open-type="reLaunch" hover-class="other-navigator-hover">已经授权点击调转</navigator>
|
||||
</view>
|
||||
|
|
@ -0,0 +1,68 @@
|
|||
/* 开始 */
|
||||
page {
|
||||
height: 100%;
|
||||
display: table;
|
||||
}
|
||||
|
||||
.auth {
|
||||
margin-top: 0;
|
||||
text-align: center;
|
||||
display: table-cell;
|
||||
flex-direction: column;
|
||||
flex-wrap: wrap;
|
||||
justify-content: center;
|
||||
align-items: flex-start;
|
||||
padding: 100rpx;
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
.img {
|
||||
border-radius: 50%;
|
||||
border: 1px solid #fff;
|
||||
background-color: #fff;
|
||||
margin: 0 0 60rpx;
|
||||
display: inline-block;
|
||||
width: 200rpx;
|
||||
height: 200rpx;
|
||||
line-height: 0;
|
||||
}
|
||||
|
||||
.title {
|
||||
display: inline-block;
|
||||
width: 100%;
|
||||
margin: 0 0 60rpx;
|
||||
}
|
||||
|
||||
.describe {
|
||||
color: #a7aaa9;
|
||||
font-size: 26rpx;
|
||||
margin: 0 0 60rpx;
|
||||
border-radius: 50%;
|
||||
text-align: center;
|
||||
display: inline-block;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.btn {
|
||||
padding: 0 60rpx;
|
||||
background-color: #19be6b;
|
||||
margin: 20rpx 0 200rpx;
|
||||
text-align: center;
|
||||
vertical-align: middle;
|
||||
touch-action: manipulation;
|
||||
cursor: pointer;
|
||||
background-image: none;
|
||||
white-space: nowrap;
|
||||
user-select: none;
|
||||
font-size: 14px;
|
||||
border: 0 !important;
|
||||
position: relative;
|
||||
text-decoration: none;
|
||||
height: 44px;
|
||||
line-height: 44px;
|
||||
box-shadow: inset 0 0 0 1px #19be6b;
|
||||
background: #fff !important;
|
||||
color: #19be6b !important;
|
||||
display: inline-block;
|
||||
border-radius: 10rpx;
|
||||
}
|
||||
|
|
@ -0,0 +1,570 @@
|
|||
// index.js
|
||||
// 获取应用实例
|
||||
let index = 0, // 当前点击图片的index
|
||||
items = [], // 图片数组信息
|
||||
itemId = 1, // 图片id，用于识别点击图片
|
||||
fliter = 'init', // 默认过滤类型（原图）
|
||||
shape = 'init'; // 默认形状（原图）
|
||||
const hCw = 1.62; // 图片宽高比
|
||||
const canvasPre = 1; // 展示的canvas占mask的百分比
|
||||
const maskCanvas = wx.createCanvasContext('maskCanvas', this); // 创建 canvas 的绘图上下文 CanvasContext 对象
|
||||
|
||||
const util = require('../../utils/util.js');
|
||||
var urlPath = require('../../config.js');
|
||||
Page({
|
||||
/**
|
||||
* 页面的初始数据
|
||||
*/
|
||||
data: {
|
||||
isLogin: false, //是否授权
|
||||
funBox:true,//功能框
|
||||
itemList: [],
|
||||
showBtn: false, //按钮
|
||||
showBox: false, //弹框
|
||||
titlelist: ['脸谱', '背景', '按钮', '川剧', '人物', '文字', '装饰'],
|
||||
titleIndex: '-1',
|
||||
allList: [
|
||||
'../../img/background/3.png',
|
||||
'../../img/background/3.png',
|
||||
'../../img/background/3.png',
|
||||
'../../img/background/3.png',
|
||||
'../../img/background/3.png',
|
||||
'../../img/background/3.png',
|
||||
'../../img/background/3.png',
|
||||
'../../img/background/3.png',
|
||||
],
|
||||
allIndex: '-1',
|
||||
faceImg: [
|
||||
'../../img/face/3.png',
|
||||
'../../img/face/4.png',
|
||||
'../../img/face/3.png',
|
||||
'../../img/face/3.png',
|
||||
],
|
||||
operaImg: [
|
||||
'../../img/opera/3.png',
|
||||
'../../img/opera/4.png',
|
||||
'../../img/opera/5.png',
|
||||
'../../img/opera/5.png',
|
||||
'../../img/opera/4.png',
|
||||
'../../img/opera/3.png',
|
||||
],
|
||||
backgroundImg: [
|
||||
'../../img/background/2.png',
|
||||
'../../img/background/3.png',
|
||||
'../../img/background/2.png',
|
||||
'../../img/background/3.png',
|
||||
],
|
||||
buttonImg: [
|
||||
'../../img/button/2.png',
|
||||
'../../img/button/1.png',
|
||||
'../../img/button/2.png',
|
||||
'../../img/button/1.png',
|
||||
],
|
||||
personageImg: [
|
||||
'../../img/personage/1.png',
|
||||
'../../img/personage/2.png',
|
||||
'../../img/personage/3.png',
|
||||
],
|
||||
wordImg: [
|
||||
'../../img/word/1.png',
|
||||
'../../img/word/2.png',
|
||||
'../../img/word/3.png',
|
||||
],
|
||||
decorateImg: [
|
||||
'../../img/decorate/1.png',
|
||||
'../../img/decorate/2.png',
|
||||
'../../img/decorate/3.png',
|
||||
],
|
||||
isOk:false,
|
||||
isNo:false
|
||||
},
|
||||
chooseTitle(e) {
|
||||
let that = this;
|
||||
if (that.data.titleIndex != e.currentTarget.dataset.index) {
|
||||
that.setData({
|
||||
allIndex: '-1'
|
||||
})
|
||||
}
|
||||
that.setData({
|
||||
titleIndex: e.currentTarget.dataset.index,
|
||||
showBox: true,
|
||||
showBtn: true
|
||||
})
|
||||
if (that.data.titlelist[that.data.titleIndex] == "脸谱") {
|
||||
that.setData({
|
||||
allList: that.data.faceImg
|
||||
})
|
||||
}
|
||||
if (that.data.titlelist[that.data.titleIndex] == "川剧") {
|
||||
that.setData({
|
||||
allList: that.data.operaImg
|
||||
})
|
||||
}
|
||||
if (that.data.titlelist[that.data.titleIndex] == "背景") {
|
||||
that.setData({
|
||||
allList: that.data.backgroundImg
|
||||
})
|
||||
}
|
||||
if (that.data.titlelist[that.data.titleIndex] == "按钮") {
|
||||
that.setData({
|
||||
allList: that.data.buttonImg
|
||||
})
|
||||
}
|
||||
if (that.data.titlelist[that.data.titleIndex] == "人物") {
|
||||
that.setData({
|
||||
allList: that.data.personageImg
|
||||
})
|
||||
}
|
||||
if (that.data.titlelist[that.data.titleIndex] == "文字") {
|
||||
that.setData({
|
||||
allList: that.data.wordImg
|
||||
})
|
||||
}
|
||||
if (that.data.titlelist[that.data.titleIndex] == "装饰") {
|
||||
that.setData({
|
||||
allList: that.data.decorateImg
|
||||
})
|
||||
}
|
||||
},
|
||||
chooseImg(e) {
|
||||
let that = this;
|
||||
that.setData({
|
||||
allIndex: e.currentTarget.dataset.index,
|
||||
showBox: false,
|
||||
showBtn: false
|
||||
})
|
||||
if (that.data.titleIndex == 1) {
|
||||
this.setBackGroundImg({
|
||||
url: that.data.backgroundImg[that.data.allIndex]
|
||||
});
|
||||
} else {
|
||||
that.setDropItem({
|
||||
url: that.data.allList[that.data.allIndex]
|
||||
});
|
||||
}
|
||||
},
|
||||
onShow: function() {
|
||||
if (typeof this.getTabBar === 'function' &&
|
||||
this.getTabBar()) {
|
||||
this.getTabBar().setData({
|
||||
selected: 0
|
||||
})
|
||||
}
|
||||
},
|
||||
/**
|
||||
* 生命周期函数--监听页面加载
|
||||
*/
|
||||
onLoad: function(options) {
|
||||
items = this.data.itemList;
|
||||
wx.getSystemInfo({ // 获取系统信息
|
||||
success: sysData => {
|
||||
this.sysData = sysData;
|
||||
// 设置画布宽高，this.sysData.windowWidth为屏幕的宽度
|
||||
this.setData({
|
||||
canvasWidth: this.sysData.windowWidth *canvasPre, // 如果觉得不清晰的话，可以把所有组件、宽高放大一倍
|
||||
canvasHeight: this.sysData.windowWidth * canvasPre * hCw,
|
||||
backGroundWidth: this.sysData.windowWidth,
|
||||
backGroundHeight: this.sysData.screenHeight
|
||||
})
|
||||
|
||||
}
|
||||
})
|
||||
this.setBackGroundImg({
|
||||
url: this.data.backgroundImg[0]
|
||||
});
|
||||
this.getBottleCategories();
|
||||
},
|
||||
// 上传图片
|
||||
uploadImg() {
|
||||
let that = this;
|
||||
wx.chooseImage({
|
||||
count: 1,
|
||||
sizeType: ['original', 'compressed'],
|
||||
sourceType: ['album', 'camera'],
|
||||
success(res) {
|
||||
// tempFilePath可以作为img标签的src属性显示图片
|
||||
that.setDropItem({
|
||||
url: res.tempFilePaths[0]
|
||||
});
|
||||
}
|
||||
})
|
||||
},
|
||||
// 设置背景图片
|
||||
setBackGroundImg(imgData) {
|
||||
console.log(imgData);
|
||||
let data = {}; // 存储图片信息
|
||||
// 获取图片信息，网络图片需先配置download域名才能生效
|
||||
wx.getImageInfo({
|
||||
src: imgData.url,
|
||||
success: res => {
|
||||
// 初始化数据
|
||||
let maxWidth = this.data.backGroundWidth,
|
||||
maxHeight = this.data.backGroundHeight; // 设置最大宽高
|
||||
console.log(maxWidth, maxHeight);
|
||||
if (res.width > maxWidth || res.height > maxHeight) { // 原图宽或高大于最大值就执行
|
||||
if (res.width / res.height > maxWidth / maxHeight) { // 判断比例使用最大值的宽或高作为基数计算
|
||||
data.width = maxWidth;
|
||||
data.height = Math.round(maxWidth * (res.height / res.width));
|
||||
} else {
|
||||
data.height = maxHeight;
|
||||
data.width = Math.round(maxHeight * (res.width / res.height));
|
||||
}
|
||||
}
|
||||
data.image = imgData.url; // 显示地址
|
||||
data.initImage = imgData.url; // 原始地址
|
||||
// data.id = ++itemId; // id
|
||||
data.id = 2; // id
|
||||
data.top = 0; // top定位
|
||||
data.left = 0; // left定位
|
||||
// 圆心坐标
|
||||
data.x = data.left + data.width / 2;
|
||||
data.y = data.top + data.height / 2;
|
||||
data.scale = 1; // scale缩放
|
||||
data.rotate = 1; // 旋转角度
|
||||
data.active = false; // 选中状态
|
||||
items[0] = data; // 每增加一张图片数据增加一条信息
|
||||
this.setData({
|
||||
itemList: items
|
||||
})
|
||||
}
|
||||
})
|
||||
},
|
||||
// 设置图片的信息
|
||||
setDropItem(imgData) {
|
||||
let data = {}; // 存储图片信息
|
||||
// 获取图片信息，网络图片需先配置download域名才能生效
|
||||
wx.getImageInfo({
|
||||
src: imgData.url,
|
||||
success: res => {
|
||||
// 初始化数据
|
||||
let maxWidth = 150,
|
||||
maxHeight = 150; // 设置最大宽高
|
||||
if (res.width > maxWidth || res.height > maxHeight) { // 原图宽或高大于最大值就执行
|
||||
if (res.width / res.height > maxWidth / maxHeight) { // 判断比例使用最大值的宽或高作为基数计算
|
||||
data.width = maxWidth;
|
||||
data.height = Math.round(maxWidth * (res.height / res.width));
|
||||
} else {
|
||||
data.height = maxHeight;
|
||||
data.width = Math.round(maxHeight * (res.width / res.height));
|
||||
}
|
||||
}
|
||||
data.image = imgData.url; // 显示地址
|
||||
data.initImage = imgData.url; // 原始地址
|
||||
data.id = ++itemId + 1; // id
|
||||
data.top = 10; // top定位
|
||||
data.left = 10; // left定位
|
||||
// 圆心坐标
|
||||
data.x = data.left + data.width / 2;
|
||||
data.y = data.top + data.height / 2;
|
||||
data.scale = 1; // scale缩放
|
||||
data.rotate = 1; // 旋转角度
|
||||
data.active = false; // 选中状态
|
||||
console.log(data);
|
||||
items[items.length] = data; // 每增加一张图片数据增加一条信息
|
||||
this.setData({
|
||||
itemList: items
|
||||
})
|
||||
}
|
||||
})
|
||||
},
|
||||
// 点击图片
|
||||
WraptouchStart: function(e) {
|
||||
if (e.currentTarget.dataset.id != 2) {
|
||||
// 循环图片数组获取点击的图片信息
|
||||
for (let i = 0; i < items.length; i++) {
|
||||
items[i].active = false;
|
||||
if (e.currentTarget.dataset.id == items[i].id) {
|
||||
index = i;
|
||||
items[index].active = true;
|
||||
}
|
||||
}
|
||||
this.setData({
|
||||
itemList: items
|
||||
})
|
||||
// 获取点击的坐标值
|
||||
items[index].lx = e.touches[0].clientX;
|
||||
items[index].ly = e.touches[0].clientY;
|
||||
}
|
||||
this.setData({
|
||||
showBox: false,
|
||||
funBox:false
|
||||
})
|
||||
},
|
||||
// 拖动图片
|
||||
WraptouchMove(e) {
|
||||
if (e.currentTarget.dataset.id != 2) {
|
||||
items[index]._lx = e.touches[0].clientX;
|
||||
items[index]._ly = e.touches[0].clientY;
|
||||
|
||||
items[index].left += items[index]._lx - items[index].lx;
|
||||
items[index].top += items[index]._ly - items[index].ly;
|
||||
items[index].x += items[index]._lx - items[index].lx;
|
||||
items[index].y += items[index]._ly - items[index].ly;
|
||||
|
||||
items[index].lx = e.touches[0].clientX;
|
||||
items[index].ly = e.touches[0].clientY;
|
||||
|
||||
this.setData({
|
||||
itemList: items,
|
||||
showBtn: true,
|
||||
funBox:false
|
||||
})
|
||||
}
|
||||
},
|
||||
// 放开图片
|
||||
WraptouchEnd() {
|
||||
this.synthesis(); // 调用合成图方法
|
||||
this.setData({
|
||||
showBtn: false,
|
||||
funBox:true
|
||||
})
|
||||
},
|
||||
// 点击伸缩图标
|
||||
oTouchStart(e) {
|
||||
//找到点击的那个图片对象，并记录
|
||||
for (let i = 0; i < items.length; i++) {
|
||||
items[i].active = false;
|
||||
if (e.currentTarget.dataset.id == items[i].id) {
|
||||
index = i;
|
||||
items[index].active = true;
|
||||
}
|
||||
}
|
||||
//获取作为移动前角度的坐标
|
||||
items[index].tx = e.touches[0].clientX;
|
||||
items[index].ty = e.touches[0].clientY;
|
||||
//移动前的角度
|
||||
items[index].anglePre = this.countDeg(items[index].x, items[index].y, items[index].tx, items[index].ty);
|
||||
//获取图片半径
|
||||
items[index].r = this.getDistancs(items[index].x, items[index].y, items[index].left, items[index].top);
|
||||
},
|
||||
oTouchMove: function(e) {
|
||||
//记录移动后的位置
|
||||
items[index]._tx = e.touches[0].clientX;
|
||||
items[index]._ty = e.touches[0].clientY;
|
||||
//移动的点到圆心的距离
|
||||
items[index].disPtoO = this.getDistancs(items[index].x, items[index].y, items[index]._tx, items[index]._ty - 10)
|
||||
|
||||
items[index].scale = items[index].disPtoO / items[index].r;
|
||||
|
||||
//移动后位置的角度
|
||||
items[index].angleNext = this.countDeg(items[index].x, items[index].y, items[index]._tx, items[index]._ty)
|
||||
//角度差
|
||||
items[index].new_rotate = items[index].angleNext - items[index].anglePre;
|
||||
|
||||
//叠加的角度差
|
||||
items[index].rotate += items[index].new_rotate;
|
||||
items[index].angle = items[index].rotate; //赋值
|
||||
|
||||
//用过移动后的坐标赋值为移动前坐标
|
||||
items[index].tx = e.touches[0].clientX;
|
||||
items[index].ty = e.touches[0].clientY;
|
||||
items[index].anglePre = this.countDeg(items[index].x, items[index].y, items[index].tx, items[index].ty)
|
||||
|
||||
//赋值setData渲染
|
||||
this.setData({
|
||||
itemList: items
|
||||
})
|
||||
},
|
||||
// 计算坐标点到圆心的距离
|
||||
getDistancs(cx, cy, pointer_x, pointer_y) {
|
||||
this.setData({
|
||||
showBtn: true,
|
||||
funBox:false
|
||||
})
|
||||
var ox = pointer_x - cx;
|
||||
var oy = pointer_y - cy;
|
||||
return Math.sqrt(
|
||||
ox * ox + oy * oy
|
||||
);
|
||||
},
|
||||
/*
|
||||
*参数cx和cy为图片圆心坐标
|
||||
*参数pointer_x和pointer_y为手点击的坐标
|
||||
*返回值为手点击的坐标到圆心的角度
|
||||
*/
|
||||
countDeg: function(cx, cy, pointer_x, pointer_y) {
|
||||
var ox = pointer_x - cx;
|
||||
var oy = pointer_y - cy;
|
||||
var to = Math.abs(ox / oy);
|
||||
var angle = Math.atan(to) / (2 * Math.PI) * 360;
|
||||
if (ox < 0 && oy < 0) //相对在左上角，第四象限，js中坐标系是从左上角开始的，这里的象限是正常坐标系
|
||||
{
|
||||
angle = -angle;
|
||||
} else if (ox <= 0 && oy >= 0) //左下角,3象限
|
||||
{
|
||||
angle = -(180 - angle)
|
||||
} else if (ox > 0 && oy < 0) //右上角，1象限
|
||||
{
|
||||
angle = angle;
|
||||
} else if (ox > 0 && oy > 0) //右下角，2象限
|
||||
{
|
||||
angle = 180 - angle;
|
||||
}
|
||||
return angle;
|
||||
},
|
||||
// 删除
|
||||
deleteItem: function(e) {
|
||||
let newList = [];
|
||||
for (let i = 0; i < items.length; i++) {
|
||||
if (e.currentTarget.dataset.id != items[i].id) {
|
||||
newList.push(items[i])
|
||||
}
|
||||
}
|
||||
if (newList.length > 1) { //大于0背景图可被删除，大于1背景图不能被删除
|
||||
newList[newList.length - 1].active = true; // 剩下图片组最后一个选中
|
||||
}
|
||||
items = newList;
|
||||
this.setData({
|
||||
itemList: items
|
||||
})
|
||||
},
|
||||
// 打开遮罩层
|
||||
openMask() {
|
||||
this.synthesis();
|
||||
this.setData({
|
||||
showCanvas: true
|
||||
})
|
||||
},
|
||||
synthesis() { // 合成图片
|
||||
maskCanvas.save();
|
||||
maskCanvas.beginPath();
|
||||
// 画背景色（白色）
|
||||
maskCanvas.setFillStyle('#fff');
|
||||
maskCanvas.fillRect(0, 0, this.data.canvasWidth, this.data.backGroundHeight);
|
||||
console.log(this.data.canvasWidth, this.data.backGroundHeight);
|
||||
items.forEach((currentValue, index) => {
|
||||
maskCanvas.save();
|
||||
maskCanvas.translate(0, 0);
|
||||
maskCanvas.beginPath();
|
||||
maskCanvas.translate(currentValue.x, currentValue.y); // 圆心坐标
|
||||
maskCanvas.rotate(currentValue.angle * Math.PI / 180);
|
||||
maskCanvas.translate(-(currentValue.width * currentValue.scale / 2), -(currentValue.height *currentValue.scale / 2))
|
||||
maskCanvas.drawImage(currentValue.image, 0, 0, currentValue.width * currentValue.scale,currentValue.height * currentValue.scale);
|
||||
maskCanvas.restore();
|
||||
})
|
||||
// reserve 参数为 false，则在本次调用绘制之前 native 层会先清空画布再继续绘制
|
||||
maskCanvas.draw(false, (e) => {
|
||||
wx.canvasToTempFilePath({
|
||||
canvasId: 'maskCanvas',
|
||||
success: res => {
|
||||
this.setData({
|
||||
canvasTemImg: res.tempFilePath
|
||||
})
|
||||
}
|
||||
}, this);
|
||||
})
|
||||
},
|
||||
// 关闭遮罩层
|
||||
disappearCanvas() {
|
||||
this.setData({
|
||||
showCanvas: false
|
||||
})
|
||||
},
|
||||
// 保存图片到系统相册
|
||||
saveImg: function() {
|
||||
if (wx.getStorageSync('token')) {
|
||||
wx.saveImageToPhotosAlbum({
|
||||
filePath: this.data.canvasTemImg,
|
||||
success: res => {
|
||||
wx.showToast({
|
||||
title: '保存成功',
|
||||
icon: "success"
|
||||
})
|
||||
},
|
||||
fail: res => {
|
||||
wx.openSetting({
|
||||
success: settingdata => {
|
||||
if (settingdata.authSetting['scope.writePhotosAlbum']) {
|
||||
console.log('获取权限成功，给出再次点击图片保存到相册的提示。')
|
||||
} else {
|
||||
console.log('获取权限失败，给出不给权限就无法正常使用的提示')
|
||||
}
|
||||
},
|
||||
fail: error => {
|
||||
console.log(error)
|
||||
}
|
||||
})
|
||||
wx.showModal({
|
||||
title: '提示',
|
||||
content: '保存失败，请确保相册权限已打开',
|
||||
})
|
||||
}
|
||||
})
|
||||
} else {
|
||||
this.setData({
|
||||
isLogin: true
|
||||
})
|
||||
}
|
||||
},
|
||||
shareImg() {
|
||||
if (wx.getStorageSync('token')) {
|
||||
wx.downloadFile({
|
||||
url: this.data.canvasTemImg,
|
||||
success: (res) => {
|
||||
wx.showShareImageMenu({
|
||||
path: res.tempFilePath
|
||||
})
|
||||
}
|
||||
})
|
||||
} else {
|
||||
this.setData({
|
||||
isLogin: true
|
||||
})
|
||||
}
|
||||
},
|
||||
chooseBtn(e) {
|
||||
let loginIndex = e.currentTarget.dataset.index;
|
||||
this.setData({
|
||||
isOk:false,
|
||||
isNo:false
|
||||
})
|
||||
loginIndex==1 ? this.setData({isOk:true}) : this.setData({isNo:true})
|
||||
},
|
||||
shouq(e) {
|
||||
wx.getUserProfile({ //获取用户昵称
|
||||
desc: '用于完善会员资料',
|
||||
success: (res) => {
|
||||
this.setData({
|
||||
userInfo: res.userInfo,
|
||||
isLogin: false
|
||||
})
|
||||
wx.showToast({title:'授权成功',icon:'none'})
|
||||
this.setData({isOk:false})
|
||||
wx.login({//调用授权登录
|
||||
success: res => {
|
||||
wx.request({
|
||||
url: urlPath.getopenid,
|
||||
method:'post',
|
||||
data: {
|
||||
code: res.code,
|
||||
wx_ame:this.data.userInfo.nickName,
|
||||
avater:this.data.userInfo.avatarUrl,
|
||||
},
|
||||
success(res) {
|
||||
console.log(res,1234);
|
||||
if (res.data.code == 0) {
|
||||
wx.setStorageSync('token', res.data.data.token);
|
||||
wx.setStorageSync('openid', res.data.data.openid);
|
||||
wx.setStorageSync('user', res.data.data.user);
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
})
|
||||
},
|
||||
fail:(res)=>{
|
||||
wx.showToast({title:'授权失败',icon:'none'})
|
||||
this.setData({isOk:false})
|
||||
}
|
||||
})
|
||||
},
|
||||
getBottleCategories(){
|
||||
wx.request({
|
||||
url: urlPath.getBottleCategories,
|
||||
data: {},
|
||||
success(res) {
|
||||
console.log(res);
|
||||
}
|
||||
});
|
||||
}
|
||||
})
|
||||
|
|
@ -0,0 +1,3 @@
|
|||
{
|
||||
"usingComponents": {}
|
||||
}
|
||||
|
|
@ -0,0 +1,75 @@
|
|||
<!--index.wxml-->
|
||||
<view class='contentWarp'>
|
||||
<block wx:for="{{itemList}}" wx:key="id">
|
||||
<view class='touchWrap'
|
||||
style='transform: scale({{item.scale}});top:{{item.top}}px;left:{{item.left}}px; z-index:{{item.active?100:1}}'>
|
||||
<view class='imgWrap {{item.active? "touchActive":""}}'
|
||||
style="transform: rotate({{item.angle}}deg); border: {{item.active?4*item.oScale:0}}rpx #fff dashed;">
|
||||
<image src='{{item.image}}' data-id='{{item.id}}'
|
||||
style='width:{{item.width}}px;height:{{item.height}}px;' bindtouchstart='WraptouchStart'
|
||||
bindtouchmove='WraptouchMove' bindtouchend='WraptouchEnd' mode="widthFix"></image>
|
||||
<image class='x' src='../../img/close-icon.png'
|
||||
style='transform: scale({{item.oScale}});transform-origin:center;' data-id='{{item.id}}'
|
||||
bindtap='deleteItem'></image>
|
||||
<image class='o' src='../../img/zoom-icon.png'
|
||||
style='transform: scale({{item.oScale}});transform-origin:center;' data-id='{{item.id}}'
|
||||
bindtouchstart='oTouchStart' bindtouchmove='oTouchMove' bindtouchend='WraptouchEnd'></image>
|
||||
</view>
|
||||
</view>
|
||||
</block>
|
||||
</view>
|
||||
<!-- 保存显示效果图 -->
|
||||
<view class='canvasWrap' hidden="{{!showCanvas}}">
|
||||
<image class="resImg" bindlongtap="saveImg" src="{{canvasTemImg}}" mode="widthFix"></image>
|
||||
<view class='btn_view'>
|
||||
<button bindtap='saveImg'>保存到手机</button>
|
||||
<button bindtap='shareImg'>分享</button>
|
||||
<button bindtap='disappearCanvas'>关闭</button>
|
||||
</view>
|
||||
</view>
|
||||
<!-- 画布 -->
|
||||
<canvas class='maskCanvas' canvas-id="maskCanvas" style='width:{{canvasWidth}}px; height:{{canvasHeight}}px;'></canvas>
|
||||
<!-- 右下角操作按钮 -->
|
||||
<view class="operation-buttons {{showBtn?'closeSave':''}}">
|
||||
<!-- <image src="../../img/share-icon.png" bindtap="shareEv"></image> -->
|
||||
<image src="../../img/download-icon.png" bindtap="openMask"></image>
|
||||
</view>
|
||||
<!-- 我的作品 -->
|
||||
|
||||
<view wx:if="{{funBox}}" class="choose-box {{showBox?'showBox':''}}">
|
||||
<view>
|
||||
<scroll-view scroll-x="true">
|
||||
<view class="scrollView title-box">
|
||||
<view wx:for="{{titlelist}}" class="{{titleIndex==index?'titleActive':''}}" data-index="{{index}}" bindtap="chooseTitle" wx:key="index">{{item}}</view>
|
||||
</view>
|
||||
</scroll-view>
|
||||
</view>
|
||||
<view>
|
||||
<scroll-view scroll-x="true">
|
||||
<view class="scrollView img-box">
|
||||
<view wx:for="{{allList}}" data-index="{{index}}" bindtap="chooseImg" wx:key="index"><image class="{{allIndex==index?'allActive':''}}" mode="widthFix" src="{{item}}" lazy-load></image></view>
|
||||
</view>
|
||||
</scroll-view>
|
||||
</view>
|
||||
</view>
|
||||
<!-- 登录授权弹框 -->
|
||||
<view wx:if="{{isLogin}}" class="{{isAnimation==2?'card-box-userinfo':''}} auth-box">
|
||||
<view class="{{isAnimation==1?'card-box-userinfo':''}}">
|
||||
<view class="auth-top">
|
||||
<image src="../../img/robot.png" mode=""></image>
|
||||
<view class="auth-top-content">
|
||||
<view>提示：</view>
|
||||
<view>您当前是游客身份</view>
|
||||
<view>请授权登录后再进行保存、分享操作</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="auth-center">申请 获取你的昵称、头像、地区及性别</view>
|
||||
<view class="auth-bottom">
|
||||
<view bindtap="chooseBtn" data-index="0" class="{{isNo?'isNyin':'noyin'}} btn btn-no">暂不授权</view>
|
||||
<view bindtap="chooseBtn" data-index="1" class="{{isOk?'isOyin':'noyin'}} btn btn-yes">
|
||||
<text>立即授权</text>
|
||||
<button open-type="getUserInfo" bindtap="shouq" class="auth-btn">立即授权</button>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
|
@ -0,0 +1,256 @@
|
|||
/**index.wxss**/
|
||||
.contentWarp {
|
||||
position: absolute;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
top: 0;
|
||||
left: 0;
|
||||
bottom: 0;
|
||||
right: 0;
|
||||
margin: auto;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.touchWrap {
|
||||
transform-origin: center;
|
||||
position: absolute;
|
||||
z-index: 100;
|
||||
}
|
||||
|
||||
.imgWrap {
|
||||
box-sizing: border-box;
|
||||
width: 100%;
|
||||
transform-origin: center;
|
||||
float: left;
|
||||
border: 5rpx transparent dashed;
|
||||
}
|
||||
|
||||
.imgWrap image {
|
||||
float: left;
|
||||
}
|
||||
|
||||
.touchActive .x {
|
||||
display: block;
|
||||
}
|
||||
|
||||
.touchActive .o {
|
||||
display: block;
|
||||
}
|
||||
|
||||
.x {
|
||||
position: absolute;
|
||||
top: -25rpx;
|
||||
left: -25rpx;
|
||||
z-index: 500;
|
||||
display: none;
|
||||
width: 50rpx;
|
||||
height: 50rpx;
|
||||
overflow: hidden;
|
||||
font-weight: bold;
|
||||
color: #d1e3f1;
|
||||
}
|
||||
|
||||
.o {
|
||||
position: absolute;
|
||||
bottom: -25rpx;
|
||||
right: -25rpx;
|
||||
width: 50rpx;
|
||||
height: 50rpx;
|
||||
text-align: center;
|
||||
display: none;
|
||||
overflow: hidden;
|
||||
font-weight: bold;
|
||||
color: #d1e3f1;
|
||||
}
|
||||
|
||||
.active {
|
||||
background-color: rgb(78, 114, 151);
|
||||
}
|
||||
|
||||
.active view {
|
||||
border: none;
|
||||
}
|
||||
|
||||
.touchActive {
|
||||
z-index: 400;
|
||||
}
|
||||
|
||||
.operation-buttons {
|
||||
position: absolute;
|
||||
bottom: 220rpx;
|
||||
right: 15rpx;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
z-index: 101;
|
||||
transition: all .5s ease-in-out;
|
||||
}
|
||||
|
||||
.operation-buttons image {
|
||||
width: 74rpx;
|
||||
height: 80rpx;
|
||||
margin-top: 20rpx;
|
||||
}
|
||||
.closeSave {
|
||||
transform: scale(0);
|
||||
}
|
||||
.canvasWrap {
|
||||
position: absolute;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
top: 0;
|
||||
left: 0;
|
||||
background-color: rgba(0, 0, 0, 0.6);
|
||||
z-index: 999;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.maskCanvas {
|
||||
position: absolute;
|
||||
left: -200%;
|
||||
top: 0;
|
||||
}
|
||||
|
||||
.btnView view {
|
||||
padding-bottom: 20rpx;
|
||||
}
|
||||
|
||||
.hand {
|
||||
position: absolute;
|
||||
left: 100rpx;
|
||||
right: 0;
|
||||
margin: auto;
|
||||
z-index: 100;
|
||||
}
|
||||
|
||||
.getUserInfoBtn {
|
||||
position: initial;
|
||||
border: none;
|
||||
background-color: none;
|
||||
}
|
||||
|
||||
.getUserInfoBtn::after {
|
||||
border: none;
|
||||
}
|
||||
|
||||
.btn_view {
|
||||
display: flex;
|
||||
padding: 20rpx;
|
||||
}
|
||||
|
||||
.btn_view button {
|
||||
width: 30%!important;
|
||||
padding: 16rpx 20rpx;
|
||||
font-size: 26rpx;
|
||||
background-color: #2a7be9;
|
||||
color: #fff;
|
||||
}
|
||||
/* 点击下载按钮时的图片样式 */
|
||||
.resImg {
|
||||
width: 80%;
|
||||
margin-top: 20rpx;
|
||||
}
|
||||
|
||||
/* 特效样式 */
|
||||
.fliters {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
position: absolute;
|
||||
bottom: 382rpx;
|
||||
right: 120rpx;
|
||||
z-index: 201;
|
||||
}
|
||||
|
||||
.shapes {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
position: absolute;
|
||||
bottom: 242rpx;
|
||||
right: 120rpx;
|
||||
z-index: 201;
|
||||
}
|
||||
|
||||
.fliters image,
|
||||
.shapes image {
|
||||
width: 60rpx;
|
||||
height: 60rpx;
|
||||
border: 2rpx solid #eb4985;
|
||||
}
|
||||
|
||||
|
||||
.choose-box {
|
||||
position: fixed;
|
||||
bottom: -250rpx;
|
||||
left: 0;
|
||||
right: 0;
|
||||
z-index: 998;
|
||||
background-color: rgba(0, 0, 0, .8);
|
||||
padding: 20rpx;
|
||||
transition: all .5s ease-in-out;
|
||||
}
|
||||
|
||||
.showBox {
|
||||
bottom: 88rpx;
|
||||
}
|
||||
|
||||
.scrollView {
|
||||
display: flex;
|
||||
}
|
||||
|
||||
.title-box view {
|
||||
background-color: rgba(0, 0, 0, 1);
|
||||
display: inline-block;
|
||||
padding: 15rpx 30rpx;
|
||||
border-radius: 10rpx;
|
||||
margin-bottom: 20rpx;
|
||||
margin-right: 20rpx;
|
||||
flex-shrink: 0;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.title-box .titleActive {
|
||||
color: #000;
|
||||
background-color: rgba(255, 255, 255, 1);
|
||||
box-shadow: 0rpx 0rpx 20rpx rgba(255, 255, 255, .5);
|
||||
}
|
||||
|
||||
.img-box view {
|
||||
width: 25%;
|
||||
height: 320rpx;
|
||||
flex-shrink: 0;
|
||||
margin-right: 20rpx;
|
||||
background-color: rgba(0,0,0,.8);
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.img-box view:last-child {
|
||||
margin-right: 0rpx;
|
||||
}
|
||||
|
||||
.img-box image {
|
||||
width: 100%;
|
||||
height: 320rpx;
|
||||
object-fit: contain;
|
||||
}
|
||||
|
||||
.img-box .allActive {
|
||||
transform: scale(.9);
|
||||
border: 4rpx dashed rgba(255, 255, 255, .4);
|
||||
box-shadow: 0rpx 0rpx 20rpx rgba(0, 0, 0, .8);
|
||||
}
|
||||
.auth-box {position: fixed;top: 0;right: 0;left: 0;bottom: 0;display: flex;justify-content: center;align-items: center;z-index: 1000;}
|
||||
.auth-box > view {background-color: #FFFFFF;border-radius: 10rpx;padding: 30rpx;box-shadow: 0rpx 0rpx 20rpx rgba(0,0,0,.5);margin: 0 100rpx;}
|
||||
.auth-top {display: flex;}
|
||||
.auth-top image {width: 96rpx;height: 96rpx;flex-shrink: 0;}
|
||||
.auth-top-content {margin-left: 20rpx;}
|
||||
.auth-top-content view {font-size: 28rpx;margin-top: 20rpx;color: #999999;}
|
||||
.auth-top-content view:nth-child(1) {font-size: 30rpx;font-weight: bold;margin-top: 0;}
|
||||
.auth-center {font-size: 28rpx;margin: 30rpx 0;border-bottom: 1rpx solid #F5F5F5;border-top: 1rpx solid #F5F5F5;padding: 20rpx 0;}
|
||||
.auth-bottom {display: flex;justify-content: center;align-items: center;font-size: 24rpx;}
|
||||
.btn {padding: 12rpx 40rpx;border-radius: 4rpx;}
|
||||
.btn-no {color: #2a7be9;background-color: #FFFFFF;border: 1rpx solid #2a7be9;}
|
||||
.btn-yes {color: #FFFFFF;background-color: #2a7be9;border: 1rpx solid #2a7be9;position: relative;margin-left: 20rpx;}
|
||||
.auth-btn {position: absolute;top: 0;left: 0;right: 0;bottom: 0;opacity: 0;}
|
||||
.isNyin{box-shadow: 0rpx 3rpx 6rpx rgba(0,0,0,.5);}
|
||||
.isOyin{box-shadow: 0rpx 3rpx 6rpx rgba(0,0,0,1);}
|
||||
.card-box-userinfo {transform: rotate(360deg) scale(0);transition: all 1s ease-in-out;}
|
||||
|
|
@ -0,0 +1,438 @@
|
|||
// pages/index.js
|
||||
var urlPath = require('../../config.js');
|
||||
const app = getApp();
|
||||
Page({
|
||||
// 前往下一页
|
||||
picture(e) {
|
||||
wx.navigateTo({
|
||||
url: '../picture/picture?id=' + e.currentTarget.dataset.id
|
||||
});
|
||||
},
|
||||
rule() {
|
||||
wx.navigateTo({
|
||||
url: '../rule/rule'
|
||||
});
|
||||
},
|
||||
vote(e){
|
||||
var that = this;
|
||||
var id = e.currentTarget.dataset.id;
|
||||
if(id > 0){
|
||||
wx.request({
|
||||
url: urlPath.vote,
|
||||
header:{
|
||||
'token' : wx.getStorageSync('token')
|
||||
},
|
||||
data:{
|
||||
id : id
|
||||
},
|
||||
success(res){
|
||||
if(res.data.code == 0){
|
||||
wx.showToast({
|
||||
title: '投票成功'
|
||||
});
|
||||
that.onLoad();
|
||||
}else{
|
||||
wx.showToast({
|
||||
title:res.data.msg,
|
||||
icon:'none'
|
||||
});
|
||||
}
|
||||
}
|
||||
})
|
||||
}
|
||||
},
|
||||
personal(e) {
|
||||
wx.navigateTo({
|
||||
url: '../personal/personal?id=' + e.currentTarget.dataset.uid
|
||||
});
|
||||
},
|
||||
sign() {
|
||||
wx.navigateTo({ url: '../sign/sign' });
|
||||
},
|
||||
/**
|
||||
* 页面的初始数据
|
||||
*/
|
||||
data: {
|
||||
loadHidden : true, //
|
||||
img_url: wx.getStorageSync('img_url'),
|
||||
swiperCurrent:0,
|
||||
autoplay: false,
|
||||
interval: 3000,
|
||||
duration: 800,
|
||||
//倒计时数据
|
||||
endTime: '',
|
||||
tab_number: 0 ,//参与者
|
||||
tab_vote: 0,//投票数
|
||||
tab_visit: 0,//访问次数
|
||||
rule_text:['1、本次活动不收任何费用，不退稿。2、参赛作品需附有作品介绍，字数限100字以内。3、每位参赛者仅限提交不超过5幅3、每位参赛者仅限提交不超过5幅'],//活动规则
|
||||
//列表
|
||||
works_list: [],
|
||||
page : 1,
|
||||
pageSize : 6,
|
||||
rule:'',
|
||||
search_page:1,
|
||||
for_search:false,
|
||||
keyword:'',
|
||||
forMore:true,
|
||||
},
|
||||
swiperChange: function (e) {
|
||||
this.setData({
|
||||
swiperCurrent: e.detail.current
|
||||
})
|
||||
},
|
||||
/**
|
||||
* 生命周期函数--监听页面加载
|
||||
*/
|
||||
onLoad: function (options) {
|
||||
var that = this;
|
||||
that.setData({
|
||||
//倒计时数据
|
||||
endTime: '',
|
||||
tab_number: 0 ,//参与者
|
||||
tab_vote: 0,//投票数
|
||||
tab_visit: 0,//访问次数
|
||||
rule_text:['1、本次活动不收任何费用，不退稿。2、参赛作品需附有作品介绍，字数限100字以内。3、每位参赛者仅限提交不超过5幅3、每位参赛者仅限提交不超过5幅'],//活动规则
|
||||
//列表
|
||||
works_list: [],
|
||||
page : 1,
|
||||
pageSize : 20,
|
||||
});
|
||||
//登录状态
|
||||
wx.checkSession({
|
||||
success: function (res) {
|
||||
console.log("DDDDDDD");
|
||||
that.getVoteList();
|
||||
that.getSlideList();
|
||||
that.saveVisit();
|
||||
that.getBaseInfo();
|
||||
//var user = wx.getStorageSync('user') || [];
|
||||
},
|
||||
fail: function(){
|
||||
wx.login({
|
||||
success: res => {
|
||||
console.log(res);
|
||||
wx.request({
|
||||
url: urlPath.getopenid,
|
||||
data: {
|
||||
code: res.code
|
||||
},
|
||||
success(res) {
|
||||
console.log(res);
|
||||
if(res.data.code == 0){
|
||||
wx.setStorageSync('token', res.data.data.token);
|
||||
wx.setStorageSync('openid', res.data.data.openid);
|
||||
wx.setStorageSync('user', res.data.data.user);
|
||||
that.onLoad();
|
||||
}else{
|
||||
console.log(res.data.msg);
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
})
|
||||
}
|
||||
});
|
||||
|
||||
|
||||
//that.countDown()//倒计时监听
|
||||
},
|
||||
saveVisit:function(){
|
||||
wx.request({
|
||||
url: urlPath.saveVisit,
|
||||
header:{
|
||||
'token': wx.getStorageSync('token')
|
||||
},
|
||||
method:'post',
|
||||
success(res){
|
||||
console.log(res);
|
||||
}
|
||||
});
|
||||
},
|
||||
// 倒计时
|
||||
countDown:function(){
|
||||
var that=this;
|
||||
var nowTime = new Date().getTime();//现在时间（时间戳）
|
||||
var endTime = new Date(that.data.endTime).getTime();//结束时间（时间戳）
|
||||
var time = (endTime-nowTime)/1000;//距离结束的毫秒数
|
||||
// 获取天、时、分、秒
|
||||
let day = parseInt(time / (60 * 60 * 24));
|
||||
let hou = parseInt(time % (60 * 60 * 24) / 3600);
|
||||
let min = parseInt(time % (60 * 60 * 24) % 3600 / 60);
|
||||
let sec = parseInt(time % (60 * 60 * 24) % 3600 % 60);
|
||||
day = that.timeFormin(day),
|
||||
hou = that.timeFormin(hou),
|
||||
min = that.timeFormin(min),
|
||||
sec = that.timeFormin(sec)
|
||||
that.setData({
|
||||
day: that.timeFormat(day),
|
||||
hou: that.timeFormat(hou),
|
||||
min: that.timeFormat(min),
|
||||
sec: that.timeFormat(sec)
|
||||
})
|
||||
// 每1000ms刷新一次
|
||||
if (time>0){
|
||||
that.setData({
|
||||
countDown: true
|
||||
})
|
||||
setTimeout(this.countDown, 1000);
|
||||
}else{
|
||||
that.setData({
|
||||
countDown:false
|
||||
})
|
||||
}
|
||||
},
|
||||
getSlideList:function(){
|
||||
var that = this;
|
||||
var slide_list = [];
|
||||
wx.request({
|
||||
url: urlPath.getSlideList,
|
||||
header:{
|
||||
'token': wx.getStorageSync('token')
|
||||
},
|
||||
success(res){
|
||||
if(res.data.code == 0){
|
||||
if(res.data.data.length > 0){
|
||||
res.data.data.forEach(function(item){
|
||||
slide_list.push(urlPath.host + item.src);
|
||||
});
|
||||
that.setData({
|
||||
img_url:slide_list
|
||||
});
|
||||
wx.setStorageSync('img_url', that.data.img_url);
|
||||
}
|
||||
}else{
|
||||
console.log(res.data.msg); //失败
|
||||
}
|
||||
}
|
||||
});
|
||||
},
|
||||
getVoteList:function(){
|
||||
var that = this;
|
||||
if(!that.data.forMore){
|
||||
return;
|
||||
}
|
||||
var vote_list = [];
|
||||
wx.request({
|
||||
url: urlPath.getVoteList,
|
||||
header:{
|
||||
'token' : wx.getStorageSync('token')
|
||||
},
|
||||
data:{
|
||||
page:that.data.page,
|
||||
page_size:that.data.pageSize
|
||||
},
|
||||
success(res){
|
||||
if(res.data.code == 0){
|
||||
if(res.data.data.length > 0){
|
||||
res.data.data.forEach(function(item){
|
||||
vote_list.push({
|
||||
ids: item.id,
|
||||
img: urlPath.host + item.pic,
|
||||
text: item.explain,
|
||||
name: item.user_name,
|
||||
number: item.votes,
|
||||
uid:item.uid
|
||||
});
|
||||
});
|
||||
that.setData({
|
||||
works_list:that.data.works_list.concat(vote_list)
|
||||
});
|
||||
that.setData({
|
||||
page : that.data.page + 1
|
||||
})
|
||||
}else{
|
||||
that.setData({
|
||||
forMore:false
|
||||
});
|
||||
}
|
||||
}else{
|
||||
console.log(res.data.msg); //失败
|
||||
}
|
||||
}
|
||||
})
|
||||
},
|
||||
loadChange:function(){
|
||||
var that = this;
|
||||
if(that.data.for_search){
|
||||
that.search();
|
||||
}else{
|
||||
that.getVoteList();
|
||||
}
|
||||
},
|
||||
//小于10的格式化函数（2变成02）
|
||||
timeFormat(param) {
|
||||
return param < 10 ? '0' + param : param;
|
||||
},
|
||||
//小于0的格式化函数（不会出现负数）
|
||||
timeFormin(param) {
|
||||
return param < 0 ? 0: param;
|
||||
},
|
||||
/**
|
||||
* 生命周期函数--监听页面初次渲染完成
|
||||
*/
|
||||
onReady: function () {
|
||||
},
|
||||
|
||||
/**
|
||||
* 生命周期函数--监听页面显示
|
||||
*/
|
||||
onShow: function () {
|
||||
|
||||
},
|
||||
|
||||
/**
|
||||
* 生命周期函数--监听页面隐藏
|
||||
*/
|
||||
onHide: function () {
|
||||
|
||||
},
|
||||
|
||||
/**
|
||||
* 生命周期函数--监听页面卸载
|
||||
*/
|
||||
onUnload: function () {
|
||||
|
||||
},
|
||||
|
||||
/**
|
||||
* 页面相关事件处理函数--监听用户下拉动作
|
||||
*/
|
||||
onPullDownRefresh: function () {
|
||||
|
||||
},
|
||||
|
||||
/**
|
||||
* 页面上拉触底事件的处理函数
|
||||
*/
|
||||
onReachBottom: function () {
|
||||
|
||||
},
|
||||
|
||||
/**
|
||||
* 用户点击右上角分享
|
||||
*/
|
||||
onShareAppMessage: function () {
|
||||
|
||||
},
|
||||
onShow:function(){
|
||||
if (typeof this.getTabBar === 'function' &&
|
||||
this.getTabBar()) {
|
||||
this.getTabBar().setData({
|
||||
selected: 1
|
||||
})
|
||||
}
|
||||
},
|
||||
getBaseInfo:function(){
|
||||
var that = this;
|
||||
wx.request({
|
||||
url: urlPath.getBaseInfo,
|
||||
header:{
|
||||
'token' : wx.getStorageSync('token')
|
||||
},
|
||||
success(res){
|
||||
if(res.data.code == 0){
|
||||
var voteNumber = res.data.data.voteNumber;
|
||||
var numberOfPeople = res.data.data.numberOfPeople;
|
||||
var vote = res.data.data.vote;
|
||||
that.setData({
|
||||
tab_number: numberOfPeople,
|
||||
tab_vote: voteNumber,
|
||||
endTime: vote.time,
|
||||
rule_text: vote.rule_text,
|
||||
tab_visit:vote.visits,
|
||||
rule: vote.rule
|
||||
});
|
||||
wx.setStorageSync('baseInfo', res.data.data);
|
||||
that.countDown()
|
||||
}else{
|
||||
console.log(res.data.msg); //失败
|
||||
}
|
||||
}
|
||||
})
|
||||
},
|
||||
search:function(){
|
||||
var that = this;
|
||||
if(that.data.keyword == ''){
|
||||
return;
|
||||
}
|
||||
if(!that.data.forMore){
|
||||
return;
|
||||
}
|
||||
wx.request({
|
||||
url: urlPath.search,
|
||||
data: {
|
||||
keyword: that.data.keyword,
|
||||
page:that.data.search_page,
|
||||
page_size:that.data.pageSize
|
||||
},
|
||||
header:{
|
||||
'token' : wx.getStorageSync('token')
|
||||
},
|
||||
success: function(res) {
|
||||
if(res.data.code == 0){
|
||||
var type = res.data.data.type;
|
||||
var items = res.data.data.items;
|
||||
if(type== 'int'){
|
||||
wx.navigateTo({
|
||||
url: '../picture/picture?id=' + items.id
|
||||
});
|
||||
}else if(type == 'string'){
|
||||
var vote_list = [];
|
||||
items.forEach(function(item){
|
||||
vote_list.push({
|
||||
ids: item.id,
|
||||
img: urlPath.host + item.pic,
|
||||
text: item.explain,
|
||||
name: item.user_name,
|
||||
number: item.votes,
|
||||
uid:item.uid
|
||||
});
|
||||
});
|
||||
if(that.data.search_page == 1){
|
||||
that.setData({
|
||||
works_list:vote_list,
|
||||
forMore:true
|
||||
});
|
||||
}else{
|
||||
that.setData({
|
||||
works_list:that.data.works_list.concat(vote_list)
|
||||
});
|
||||
}
|
||||
if(items.length < that.data.pageSize){
|
||||
that.setData({
|
||||
forMore: false
|
||||
});
|
||||
}
|
||||
that.setData({
|
||||
search_page : that.data.search_page + 1,
|
||||
for_search:true
|
||||
})
|
||||
}
|
||||
}else{
|
||||
wx.showToast({
|
||||
title: res.data.msg,
|
||||
icon: 'none',
|
||||
duration: 1500
|
||||
});
|
||||
}
|
||||
}
|
||||
});
|
||||
},
|
||||
goSearch:function(e){
|
||||
var that = this;
|
||||
var formData = e.detail.value;
|
||||
if (formData) {
|
||||
that.setData({
|
||||
keyword:formData,
|
||||
forMore: true
|
||||
});
|
||||
that.search();
|
||||
} else {
|
||||
wx.showToast({
|
||||
title: '输入不能为空',
|
||||
icon: 'none',
|
||||
duration: 1500
|
||||
});
|
||||
}
|
||||
}
|
||||
})
|
||||
|
|
@ -0,0 +1,3 @@
|
|||
{
|
||||
"usingComponents": {}
|
||||
}
|
||||
|
|
@ -0,0 +1,84 @@
|
|||
<!--pages/index.wxml-->
|
||||
<view class="container">
|
||||
<scroll-view class="scroll-height" scroll-y='true' bindscrolltolower='loadChange' lower-threshold="1">
|
||||
<view class="page-body">
|
||||
<view class="page-section page-section-spacing swiper">
|
||||
<swiper autoplay="true" interval="{{interval}}" duration="{{duration}}" circular="true"
|
||||
current="{{swiperCurrent}}" bindchange="swiperChange">
|
||||
<block wx:for="{{img_url}}" wx:key="index">
|
||||
<swiper-item>
|
||||
<view class="swiper-item">
|
||||
<image src="{{item}}"></image>
|
||||
</view>
|
||||
</swiper-item>
|
||||
</block>
|
||||
</swiper>
|
||||
</view>
|
||||
<view class="dots">
|
||||
<block wx:for="{{img_url}}" wx:key="unique">
|
||||
<view class="dot{{index == swiperCurrent ? ' active' : ''}}"></view>
|
||||
</block>
|
||||
</view>
|
||||
</view>
|
||||
<!--内容-->
|
||||
<view class="view-bg top40">
|
||||
<view class="countdown">
|
||||
<view class="names">
|
||||
<text>距离投票结束还有</text>
|
||||
</view>
|
||||
<view class="time">
|
||||
<text>{{day}}</text>天 <text>{{hou}}</text>时<text>{{min}}</text>分<text>{{sec}}</text>秒
|
||||
</view>
|
||||
<view class="tab">
|
||||
<view class="list">
|
||||
{{tab_number}}<text>人</text>
|
||||
<text>参与者</text>
|
||||
</view>
|
||||
<view class="list">
|
||||
{{tab_vote}}<text>票</text>
|
||||
<text>投票数</text>
|
||||
</view>
|
||||
<view class="list">
|
||||
{{tab_visit}}<text>次</text>
|
||||
<text>访问量</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<!--规则-->
|
||||
<view class="search">
|
||||
<input type="text" class="search-int" bindconfirm='goSearch' placeholder="请输入选手姓名或作品编号" />
|
||||
</view>
|
||||
|
||||
<!--作品列表-->
|
||||
<view class="works">
|
||||
<block wx:for="{{works_list}}" wx:key="index">
|
||||
<view class="list">
|
||||
<view class="img" bindtap='picture' data-id="{{item.ids}}">
|
||||
<view class="id">{{item.ids}}<text>号</text></view>
|
||||
<image mode="aspectFill" src="{{item.img}}"></image>
|
||||
</view>
|
||||
<view class="text">
|
||||
简介：{{item.text}}
|
||||
</view>
|
||||
<view class="name" bindtap="personal" data-uid="{{item.uid}}">
|
||||
{{item.name}} <text>{{item.number}}</text>
|
||||
</view>
|
||||
<button class="add" bindtap='vote' data-id="{{item.ids}}">
|
||||
投票
|
||||
</button>
|
||||
</view>
|
||||
</block>
|
||||
</view>
|
||||
</view>
|
||||
<view style="padding:40rpx;text-align:center;font-size:24rpx;" wx:if="{{!forMore}}">没有更多内容</view>
|
||||
<!--报名-->
|
||||
|
||||
<!--view class="signup" bindtap="sign">
|
||||
我要报名
|
||||
</view-->
|
||||
<view class=" sign-rule" bindtap="rule">
|
||||
活动规则
|
||||
</view>
|
||||
<!---->
|
||||
</scroll-view>
|
||||
</view>
|
||||
|
|
@ -0,0 +1,136 @@
|
|||
/* pages/index.wxss */
|
||||
.container{
|
||||
padding-bottom: 120rpx;
|
||||
}
|
||||
.page-body{
|
||||
height: 300rpx;
|
||||
position: relative;
|
||||
}
|
||||
.swiper-item image{
|
||||
width: 100%;
|
||||
height: 300rpx;
|
||||
}
|
||||
.dots{
|
||||
display: inline-block;
|
||||
position: absolute;
|
||||
bottom: 20rpx;
|
||||
right: 0;
|
||||
padding: 0 20rpx;
|
||||
}
|
||||
.dots .dot{
|
||||
width: 8rpx;
|
||||
height: 8rpx;
|
||||
background: #fff;
|
||||
float: left;
|
||||
margin:0 4rpx;
|
||||
border-radius: 50%;
|
||||
}
|
||||
.dots .dot.active{
|
||||
background: #2a8de9;
|
||||
}
|
||||
.rule{
|
||||
padding: 40rpx 90rpx 0;
|
||||
font-size: 23rpx;
|
||||
text-align: left;
|
||||
color: #8c8c8c;
|
||||
line-height: 32rpx;
|
||||
}
|
||||
.rule text:first-child{
|
||||
display: -webkit-box;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
word-wrap: break-word;
|
||||
white-space: normal !important;
|
||||
-webkit-line-clamp: 3;
|
||||
-webkit-box-orient: vertical;
|
||||
}
|
||||
.rule .rule-more{
|
||||
color: #2a8de9;
|
||||
}
|
||||
/**/
|
||||
.scroll-height{
|
||||
height: 100vh;
|
||||
}
|
||||
.works{
|
||||
padding: 0 24rpx;
|
||||
}
|
||||
.works .list{
|
||||
width:calc((100% - 20rpx) / 2);
|
||||
float: left;
|
||||
margin-top: 30rpx;
|
||||
}
|
||||
.works .list:nth-child(2n){
|
||||
float: right;
|
||||
}
|
||||
.works .list .img{
|
||||
padding: 16rpx;
|
||||
width: 100%;
|
||||
position: relative;
|
||||
}
|
||||
.works .list .img .id{
|
||||
width: 61rpx;
|
||||
height: 72rpx;
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 0;
|
||||
font-size: 24rpx;
|
||||
color: #fff;
|
||||
text-align: center;
|
||||
background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAD4AAABICAYAAACuukaYAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyVpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDYuMC1jMDAyIDc5LjE2NDQ2MCwgMjAyMC8wNS8xMi0xNjowNDoxNyAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIDIxLjIgKE1hY2ludG9zaCkiIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6NDU4RTM1RUFGNEJDMTFFQUExNzhEOURGMjAwQUZGODIiIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6NDU4RTM1RUJGNEJDMTFFQUExNzhEOURGMjAwQUZGODIiPiA8eG1wTU06RGVyaXZlZEZyb20gc3RSZWY6aW5zdGFuY2VJRD0ieG1wLmlpZDozOTQzREZGRkY0QkMxMUVBQTE3OEQ5REYyMDBBRkY4MiIgc3RSZWY6ZG9jdW1lbnRJRD0ieG1wLmRpZDozOTQzRTAwMEY0QkMxMUVBQTE3OEQ5REYyMDBBRkY4MiIvPiA8L3JkZjpEZXNjcmlwdGlvbj4gPC9yZGY6UkRGPiA8L3g6eG1wbWV0YT4gPD94cGFja2V0IGVuZD0iciI/Pk9y1JQAAAE+SURBVHja7NbPSgJRGIbxo3gRs9Ab6AoKu4y6Bvd5HUI3kraIoFZFaiC0kTZBq2iRC3ERYpD/3gNfMIvAZpo5jvgceHChjPP7zjAzpYPW6Ng59+D2a3XLbk8XcODAgQMHDhw4cODAgQMHDhw4cODAgQMHDhw4cODAgQMHDhw4cODAgQMHDhw4cODAgQMHDhw4cODAgQMHDhw4cOB5rm91qxoqUnV1rt5DnkQl0P/M1I1qqys1iX03Un11po7UqTpR1V2Ff6prdWGf0w2/X9kAfoZwGBtCrejwse1o2y7nr5TH8UN4tJp5DCEL+Ie6tJ29U/OMh5nLENLC32xXfT21DHSvyGwISeAvMeyTncQ217+GsAk+tEvYY58L/FhOPITKLwcYqI6BX3fw3eRPQ/Dwhbo3aCf0i8SWhhCtBRgA0ghNoQEzJioAAAAASUVORK5CYII=) no-repeat top center;
|
||||
background-size:61rpx 72rpx ;
|
||||
}
|
||||
.works .list .img .id text{
|
||||
display: block;
|
||||
margin-top: -5rpx;
|
||||
}
|
||||
.works .list .img image{
|
||||
width: 277rpx;
|
||||
height: 256rpx;
|
||||
}
|
||||
.works .list .text{
|
||||
display: -webkit-box;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
word-wrap: break-word;
|
||||
white-space: normal !important;
|
||||
-webkit-line-clamp: 1;
|
||||
-webkit-box-orient: vertical;
|
||||
font-size: 22rpx;
|
||||
color: #8c8c8c;
|
||||
padding:0 16rpx;
|
||||
}
|
||||
.works .list .name{
|
||||
font-size: 30rpx;
|
||||
color: #333333;
|
||||
display: inline-block;
|
||||
width: 100%;
|
||||
padding: 16rpx;
|
||||
vertical-align: top;
|
||||
}
|
||||
.works .list .name text{
|
||||
float: right;
|
||||
color: #ff1a1a;
|
||||
}
|
||||
.works .list .add{
|
||||
width: 100%;
|
||||
height: 58rpx;
|
||||
line-height: 58rpx;
|
||||
background:#ffc103;
|
||||
padding: 0;
|
||||
border-radius: 0;
|
||||
color: #fff;
|
||||
font-size: 30rpx;
|
||||
}
|
||||
.search{
|
||||
padding: 20rpx 24rpx;
|
||||
}
|
||||
.search .search-int{
|
||||
background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACIAAAAkCAYAAADsHujfAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyVpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDYuMC1jMDAyIDc5LjE2NDQ2MCwgMjAyMC8wNS8xMi0xNjowNDoxNyAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIDIxLjIgKE1hY2ludG9zaCkiIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6RTBEODM3RjkwMTc1MTFFQkE1MDdGQURENzRCMjVCREYiIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6RTBEODM3RkEwMTc1MTFFQkE1MDdGQURENzRCMjVCREYiPiA8eG1wTU06RGVyaXZlZEZyb20gc3RSZWY6aW5zdGFuY2VJRD0ieG1wLmlpZDpFMEQ4MzdGNzAxNzUxMUVCQTUwN0ZBREQ3NEIyNUJERiIgc3RSZWY6ZG9jdW1lbnRJRD0ieG1wLmRpZDpFMEQ4MzdGODAxNzUxMUVCQTUwN0ZBREQ3NEIyNUJERiIvPiA8L3JkZjpEZXNjcmlwdGlvbj4gPC9yZGY6UkRGPiA8L3g6eG1wbWV0YT4gPD94cGFja2V0IGVuZD0iciI/PkovENQAAAMaSURBVHjaxJhZSFRhFMev0x3DtjFMKiyKFs0o6qVSaSGiDVoe6qGCHnppe5DSghbooSgrKaFoGVpoeQjqoYQghNLAwiayxSArIhWxIhIKkWBapv8HZ+DM4bub99488MN7vrv95zvnu+d8ZsXjcaMPNgDkgqGgB3wHfwwfZnq4bjFYDeaCQhBl53+Bd+AxuA3uexXmJCQbbAe7QIHNdUrUNGIL6ATV4DyJdLSIzblS0AJqHETobCw4BV6BWX5mZCs4rTn/AdSCp+AjSNKsTQAlYBWYyK4vpnBtA5e8CtkNjouxJ2A/qLd4zjNwE1SCJeAgmM3CdhHEwEm3odkoRKj4loMyGxHcUqCOwloh8uMEWOdGSBE4x/yfYDmFKOUxR/5Sbq2k56TtggidVogSMZg9aA14YPgzNTvrmT8EnLETor4RC9m4Cs89IxirFbmxVLwrQ8hONtZJyRakHQBfmF+pE5JPKtNWI+IahPXSc/ms5Ekhi9jMqNy4boRj11jSmzI8SsAc5jeDbyEJUaF5zfwSKaSQ+S1GuPaSHU+SQmLM7wpZyGd2nCuFRMWXMUxLioqdIaSH+bGQhYwQKylDSAfzp4QspIgdd0ghPEHL5JQFaAOpGKbthRTSwPxhYFlIQlaAHOY36Gbkrd3nNyCrYMdvQKuu1vDyv4Ca5CBtLYU9bWetip7qEz6xcbXHGBWQiALxYlVUL1sJUUVuBxsfSW3AcJ8i8ug5+WysXFdUeWN0C1xl/kzwCEz2sVQbwXQ2pmbijpuedTN4yPyp4DklWrZLATm0D2qmLp5bm9vmOUnLrE60d6rxbQeHqTs3NbsBVU2P0DajmrWd3A6BPW43WL0k5pioPaPBPpCgGLdRNW0nvwnsFUmu7r8icqJKJ8Zqp/ebLi6lF+j2Q+PBDDDOYn/URPdvoh9mKybiEO8Erf/59MucmqZuSvh5dF+CxuudxLj9b0AjkUWFsZhCFaVdfxd9Ld9Tu6mztJi77FNfRX+Pmh6XZIo+za19XNJWYrojxv83XZg29IcQLuYHzfIN0+g/U2LGgEHg6z8BBgCauqqxmMlUBwAAAABJRU5ErkJggg==) #ebebeb no-repeat;
|
||||
background-size: 34rpx 36rpx;
|
||||
background-position: 580rpx center;
|
||||
height: 60rpx;
|
||||
border-radius: 30rpx;
|
||||
padding-right: 80rpx;
|
||||
padding-left: 30rpx;
|
||||
font-size: 24rpx;
|
||||
}
|
||||
|
|
@ -0,0 +1,217 @@
|
|||
// pages/picture/picture.js
|
||||
Page({
|
||||
|
||||
// 前往下一页
|
||||
picture() {
|
||||
wx.navigateTo({ url: '../picture/picture' });
|
||||
},
|
||||
/**
|
||||
* 页面的初始数据
|
||||
*/
|
||||
data: {
|
||||
img_url:wx.getStorageSync('img_url'),
|
||||
swiperCurrent:0,
|
||||
autoplay: false,
|
||||
interval: 3000,
|
||||
duration: 800,
|
||||
//数据
|
||||
name:"王凯杰",
|
||||
nm_number:"237",
|
||||
//列表
|
||||
works_list:[],
|
||||
user_id:''
|
||||
},
|
||||
swiperChange: function (e) {
|
||||
// console.log(e);
|
||||
this.setData({
|
||||
swiperCurrent: e.detail.current
|
||||
})
|
||||
},
|
||||
|
||||
/**
|
||||
* 生命周期函数--监听页面加载
|
||||
*/
|
||||
onLoad: function (options) {
|
||||
var that = this;
|
||||
that.countDown()
|
||||
var userId = options.id;
|
||||
that.setData({
|
||||
user_id: userId,
|
||||
img_url:wx.getStorageSync('img_url'),
|
||||
});
|
||||
that.getUserInfo(userId);
|
||||
that.getUserProduction(userId);
|
||||
},
|
||||
getUserProduction:function(userId){
|
||||
var that = this;
|
||||
wx.request({
|
||||
url: wx.getStorageSync('urlPath').getUserProduction,
|
||||
header:{
|
||||
'token' : wx.getStorageSync('token')
|
||||
},
|
||||
data:{
|
||||
user_id: userId
|
||||
},
|
||||
success(res){
|
||||
if(res.data.code == 0){
|
||||
if(res.data.data.length > 0){
|
||||
var vote_list = [];
|
||||
var urlPath = wx.getStorageSync('urlPath');
|
||||
res.data.data.forEach(function(item){
|
||||
vote_list.push({
|
||||
ids: item.id,
|
||||
img: urlPath.host + item.pic,
|
||||
text: item.explain,
|
||||
name: item.user_name,
|
||||
number: item.votes,
|
||||
uid:item.uid
|
||||
});
|
||||
});
|
||||
that.setData({
|
||||
works_list:vote_list
|
||||
});
|
||||
}
|
||||
}
|
||||
}
|
||||
})
|
||||
},
|
||||
getUserInfo:function(userId){
|
||||
var that = this;
|
||||
wx.request({
|
||||
url: wx.getStorageSync('urlPath').getUserById,
|
||||
header:{
|
||||
'token' : wx.getStorageSync('token')
|
||||
},
|
||||
data:{
|
||||
user_id: userId
|
||||
},
|
||||
success(res){
|
||||
if(res.data.code == 0){
|
||||
console.log(res.data.data);
|
||||
that.setData({
|
||||
name:res.data.data.name,
|
||||
nm_number:res.data.data.allVoteNumber
|
||||
});
|
||||
}
|
||||
}
|
||||
})
|
||||
},
|
||||
// 倒计时
|
||||
countDown:function(){
|
||||
var that=this;
|
||||
var nowTime = new Date().getTime();//现在时间（时间戳）
|
||||
var endTime = new Date(that.data.endTime).getTime();//结束时间（时间戳）
|
||||
var time = (endTime-nowTime)/1000;//距离结束的毫秒数
|
||||
// 获取天、时、分、秒
|
||||
let day = parseInt(time / (60 * 60 * 24));
|
||||
let hou = parseInt(time % (60 * 60 * 24) / 3600);
|
||||
let min = parseInt(time % (60 * 60 * 24) % 3600 / 60);
|
||||
let sec = parseInt(time % (60 * 60 * 24) % 3600 % 60);
|
||||
// console.log(day + "," + hou + "," + min + "," + sec)
|
||||
day = that.timeFormin(day),
|
||||
hou = that.timeFormin(hou),
|
||||
min = that.timeFormin(min),
|
||||
sec = that.timeFormin(sec)
|
||||
that.setData({
|
||||
day: that.timeFormat(day),
|
||||
hou: that.timeFormat(hou),
|
||||
min: that.timeFormat(min),
|
||||
sec: that.timeFormat(sec)
|
||||
})
|
||||
// 每1000ms刷新一次
|
||||
if (time>0){
|
||||
that.setData({
|
||||
countDown: true
|
||||
})
|
||||
setTimeout(this.countDown, 1000);
|
||||
}else{
|
||||
that.setData({
|
||||
countDown:false
|
||||
})
|
||||
}
|
||||
},
|
||||
//小于10的格式化函数（2变成02）
|
||||
timeFormat(param) {
|
||||
return param < 10 ? '0' + param : param;
|
||||
},
|
||||
//小于0的格式化函数（不会出现负数）
|
||||
timeFormin(param) {
|
||||
return param < 0 ? 0: param;
|
||||
},
|
||||
/**
|
||||
* 生命周期函数--监听页面初次渲染完成
|
||||
*/
|
||||
onReady: function () {
|
||||
|
||||
},
|
||||
|
||||
/**
|
||||
* 生命周期函数--监听页面显示
|
||||
*/
|
||||
onShow: function () {
|
||||
|
||||
},
|
||||
|
||||
/**
|
||||
* 生命周期函数--监听页面隐藏
|
||||
*/
|
||||
onHide: function () {
|
||||
|
||||
},
|
||||
|
||||
/**
|
||||
* 生命周期函数--监听页面卸载
|
||||
*/
|
||||
onUnload: function () {
|
||||
|
||||
},
|
||||
|
||||
/**
|
||||
* 页面相关事件处理函数--监听用户下拉动作
|
||||
*/
|
||||
onPullDownRefresh: function () {
|
||||
|
||||
},
|
||||
|
||||
/**
|
||||
* 页面上拉触底事件的处理函数
|
||||
*/
|
||||
onReachBottom: function () {
|
||||
|
||||
},
|
||||
|
||||
/**
|
||||
* 用户点击右上角分享
|
||||
*/
|
||||
onShareAppMessage: function () {
|
||||
|
||||
},
|
||||
vote(e){
|
||||
var that = this;
|
||||
var id = e.currentTarget.dataset.id;
|
||||
if(id > 0){
|
||||
wx.request({
|
||||
url: wx.getStorageSync('urlPath').vote,
|
||||
header:{
|
||||
'token' : wx.getStorageSync('token')
|
||||
},
|
||||
data:{
|
||||
id : id
|
||||
},
|
||||
success(res){
|
||||
if(res.data.code == 0){
|
||||
wx.showToast({
|
||||
title: '投票成功'
|
||||
});
|
||||
that.onLoad({id:that.data.user_id});
|
||||
}else{
|
||||
wx.showToast({
|
||||
title:res.data.msg,
|
||||
icon:'none'
|
||||
});
|
||||
}
|
||||
}
|
||||
})
|
||||
}
|
||||
},
|
||||
})
|
||||
|
|
@ -0,0 +1,3 @@
|
|||
{
|
||||
"usingComponents": {}
|
||||
}
|
||||
|
|
@ -0,0 +1,52 @@
|
|||
<!--pages/personal/personal.wxml-->
|
||||
<view class="container">
|
||||
<view class="page-body">
|
||||
<view class="page-section page-section-spacing swiper">
|
||||
<swiper autoplay="true" interval="{{interval}}" duration="{{duration}}"
|
||||
circular="true" current="{{swiperCurrent}}" bindchange="swiperChange">
|
||||
<block wx:for="{{img_url}}" >
|
||||
<swiper-item>
|
||||
<view class="swiper-item">
|
||||
<image src="{{item}}"></image>
|
||||
</view>
|
||||
</swiper-item>
|
||||
</block>
|
||||
</swiper>
|
||||
</view>
|
||||
<view class="dots">
|
||||
<block wx:for="{{img_url}}" wx:key="unique">
|
||||
<view class="dot{{index == swiperCurrent ? ' active' : ''}}"></view>
|
||||
</block>
|
||||
</view>
|
||||
</view>
|
||||
<!--内容-->
|
||||
|
||||
<view class="view-bg top40">
|
||||
<view class="personal-name">
|
||||
{{name}} <text>{{nm_number}}票</text>
|
||||
</view>
|
||||
<!--作品列表-->
|
||||
<view class="works">
|
||||
<block wx:for="{{works_list}}" >
|
||||
<view class="list">
|
||||
<view class="img" bindtap='picture'>
|
||||
<view class="id">{{item.ids}}<text>号</text></view>
|
||||
<image mode="aspectFill" src="{{item.img}}"></image>
|
||||
</view>
|
||||
<view class="personal-right">
|
||||
<view class="text">
|
||||
简介：{{item.text}}
|
||||
</view>
|
||||
<view class="name">
|
||||
<text>{{item.number}}</text>
|
||||
</view>
|
||||
<button class="add" bindtap="vote" data-id="{{item.ids}}">
|
||||
投票
|
||||
</button>
|
||||
</view>
|
||||
</view>
|
||||
</block>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
</view>
|
||||
|
|
@ -0,0 +1,117 @@
|
|||
/* pages/personal/personal.wxss */
|
||||
.page-body{
|
||||
height: 300rpx;
|
||||
position: relative;
|
||||
}
|
||||
.swiper-item image{
|
||||
width: 100%;
|
||||
height: 300rpx;
|
||||
}
|
||||
.dots{
|
||||
display: inline-block;
|
||||
position: absolute;
|
||||
bottom: 20rpx;
|
||||
right: 0;
|
||||
padding: 0 20rpx;
|
||||
}
|
||||
.dots .dot{
|
||||
width: 8rpx;
|
||||
height: 8rpx;
|
||||
background: #fff;
|
||||
float: left;
|
||||
margin:0 4rpx;
|
||||
border-radius: 50%;
|
||||
}
|
||||
.dots .dot.active{
|
||||
background: #2a8de9;
|
||||
}
|
||||
/**/
|
||||
.personal-name{
|
||||
font-size: 40rpx;
|
||||
width: 100%;
|
||||
text-align: center;
|
||||
background-color: #2a8de9;
|
||||
color: #fff;
|
||||
padding: 30rpx 0;
|
||||
}
|
||||
.personal-name text{
|
||||
position: relative;
|
||||
margin-left: 10px;
|
||||
padding-left: 10px;
|
||||
font-size: 28rpx;
|
||||
}
|
||||
.personal-name text::after{
|
||||
position: absolute;
|
||||
width: 1px;
|
||||
height: 33rpx;
|
||||
content: '';
|
||||
left: 0;
|
||||
top: 50%;
|
||||
margin-top: -15rpx;
|
||||
background-color: #fff;
|
||||
}
|
||||
/**/
|
||||
.works{
|
||||
padding: 0 24rpx;
|
||||
}
|
||||
.works .list{
|
||||
width:100% ;
|
||||
float: left;
|
||||
display: inline-block;
|
||||
margin-top: 30rpx;
|
||||
padding: 0 30rpx;
|
||||
}
|
||||
.works .list .img{
|
||||
padding: 16rpx;
|
||||
width: 50%;
|
||||
position: relative;
|
||||
float: left;
|
||||
}
|
||||
.works .list .img image{
|
||||
width: 277rpx;
|
||||
height: 256rpx;
|
||||
}
|
||||
.works .list .img .id{
|
||||
width: 61rpx;
|
||||
height: 72rpx;
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 0;
|
||||
font-size: 24rpx;
|
||||
color: #fff;
|
||||
text-align: center;
|
||||
background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAD4AAABICAYAAACuukaYAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyVpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDYuMC1jMDAyIDc5LjE2NDQ2MCwgMjAyMC8wNS8xMi0xNjowNDoxNyAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIDIxLjIgKE1hY2ludG9zaCkiIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6NDU4RTM1RUFGNEJDMTFFQUExNzhEOURGMjAwQUZGODIiIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6NDU4RTM1RUJGNEJDMTFFQUExNzhEOURGMjAwQUZGODIiPiA8eG1wTU06RGVyaXZlZEZyb20gc3RSZWY6aW5zdGFuY2VJRD0ieG1wLmlpZDozOTQzREZGRkY0QkMxMUVBQTE3OEQ5REYyMDBBRkY4MiIgc3RSZWY6ZG9jdW1lbnRJRD0ieG1wLmRpZDozOTQzRTAwMEY0QkMxMUVBQTE3OEQ5REYyMDBBRkY4MiIvPiA8L3JkZjpEZXNjcmlwdGlvbj4gPC9yZGY6UkRGPiA8L3g6eG1wbWV0YT4gPD94cGFja2V0IGVuZD0iciI/Pk9y1JQAAAE+SURBVHja7NbPSgJRGIbxo3gRs9Ab6AoKu4y6Bvd5HUI3kraIoFZFaiC0kTZBq2iRC3ERYpD/3gNfMIvAZpo5jvgceHChjPP7zjAzpYPW6Ng59+D2a3XLbk8XcODAgQMHDhw4cODAgQMHDhw4cODAgQMHDhw4cODAgQMHDhw4cODAgQMHDhw4cODAgQMHDhw4cODAgQMHDhw4cOB5rm91qxoqUnV1rt5DnkQl0P/M1I1qqys1iX03Un11po7UqTpR1V2Ff6prdWGf0w2/X9kAfoZwGBtCrejwse1o2y7nr5TH8UN4tJp5DCEL+Ie6tJ29U/OMh5nLENLC32xXfT21DHSvyGwISeAvMeyTncQ217+GsAk+tEvYY58L/FhOPITKLwcYqI6BX3fw3eRPQ/Dwhbo3aCf0i8SWhhCtBRgA0ghNoQEzJioAAAAASUVORK5CYII=) no-repeat top center;
|
||||
background-size:61rpx 72rpx ;
|
||||
}
|
||||
.personal-right{
|
||||
float: left;
|
||||
width: 50%;
|
||||
padding: 16rpx 0 0 20rpx;
|
||||
}
|
||||
.personal-right .text{
|
||||
font-size: 28rpx;
|
||||
display: -webkit-box;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
word-wrap: break-word;
|
||||
white-space: normal !important;
|
||||
-webkit-line-clamp: 2;
|
||||
-webkit-box-orient: vertical;
|
||||
color: #8c8c8c;
|
||||
}
|
||||
.personal-right .name{
|
||||
padding: 20rpx 0;
|
||||
font-size: 30rpx;
|
||||
color: #ff1a1a;
|
||||
margin-bottom: 30rpx;
|
||||
}
|
||||
.personal-right .add{
|
||||
width: 100%;
|
||||
height: 58rpx;
|
||||
line-height: 58rpx;
|
||||
background:#ffc103;
|
||||
padding: 0;
|
||||
border-radius: 0;
|
||||
color: #fff;
|
||||
font-size: 30rpx;
|
||||
}
|
||||
|
|
@ -0,0 +1,202 @@
|
|||
// pages/picture/picture.js
|
||||
var urlPath = require('../../config.js');
|
||||
Page({
|
||||
// 前往下一页
|
||||
personal() {
|
||||
wx.navigateTo({ url: '../personal/personal' });
|
||||
},
|
||||
sign() {
|
||||
wx.navigateTo({ url: '../sign/sign' });
|
||||
},
|
||||
/**
|
||||
* 页面的初始数据
|
||||
*/
|
||||
data: {
|
||||
img_url:wx.getStorageSync('img_url'),
|
||||
swiperCurrent:0,
|
||||
autoplay: false,
|
||||
interval: 3000,
|
||||
duration: 800,
|
||||
//倒计时数据
|
||||
endTime: '2020/11/22 10:40:30',
|
||||
//
|
||||
tab_number:31,//参与者
|
||||
tab_vote:2375,//投票数
|
||||
tab_visit:55,//访问次数
|
||||
//
|
||||
ids:'22',
|
||||
img:'../../img/img_03.png',
|
||||
text:'擅长记录身边的人与事！',
|
||||
name:'王凯杰',
|
||||
number:'78',
|
||||
},
|
||||
swiperChange: function (e) {
|
||||
// console.log(e);
|
||||
this.setData({
|
||||
swiperCurrent: e.detail.current
|
||||
})
|
||||
},
|
||||
|
||||
/**
|
||||
* 生命周期函数--监听页面加载
|
||||
*/
|
||||
onLoad: function (options) {
|
||||
var that = this;
|
||||
var baseInfo = wx.getStorageSync('baseInfo');
|
||||
that.setData({
|
||||
tab_number: baseInfo.numberOfPeople,
|
||||
tab_vote: baseInfo.voteNumber,
|
||||
endTime: baseInfo.vote.time,
|
||||
rule_text: baseInfo.vote.rule_text,
|
||||
tab_visit:baseInfo.vote.visits,
|
||||
img_url:wx.getStorageSync('img_url'),
|
||||
});
|
||||
that.countDown();
|
||||
console.log(options);
|
||||
that.getDetail(options.id);
|
||||
},
|
||||
// 倒计时
|
||||
countDown:function(){
|
||||
var that=this;
|
||||
var nowTime = new Date().getTime();//现在时间（时间戳）
|
||||
var endTime = new Date(that.data.endTime).getTime();//结束时间（时间戳）
|
||||
var time = (endTime-nowTime)/1000;//距离结束的毫秒数
|
||||
// 获取天、时、分、秒
|
||||
let day = parseInt(time / (60 * 60 * 24));
|
||||
let hou = parseInt(time % (60 * 60 * 24) / 3600);
|
||||
let min = parseInt(time % (60 * 60 * 24) % 3600 / 60);
|
||||
let sec = parseInt(time % (60 * 60 * 24) % 3600 % 60);
|
||||
// console.log(day + "," + hou + "," + min + "," + sec)
|
||||
day = that.timeFormin(day),
|
||||
hou = that.timeFormin(hou),
|
||||
min = that.timeFormin(min),
|
||||
sec = that.timeFormin(sec)
|
||||
that.setData({
|
||||
day: that.timeFormat(day),
|
||||
hou: that.timeFormat(hou),
|
||||
min: that.timeFormat(min),
|
||||
sec: that.timeFormat(sec)
|
||||
})
|
||||
// 每1000ms刷新一次
|
||||
if (time>0){
|
||||
that.setData({
|
||||
countDown: true
|
||||
})
|
||||
setTimeout(this.countDown, 1000);
|
||||
}else{
|
||||
that.setData({
|
||||
countDown:false
|
||||
})
|
||||
}
|
||||
},
|
||||
getDetail:function(id){
|
||||
var that = this;
|
||||
wx.request({
|
||||
url: urlPath.getDetail,
|
||||
header:{
|
||||
'token': wx.getStorageSync('token')
|
||||
},
|
||||
data:{
|
||||
'id' : id
|
||||
},
|
||||
success(res){
|
||||
if(res.data.code == 0){
|
||||
var item = res.data.data;
|
||||
that.setData({
|
||||
ids:item.id,
|
||||
img:urlPath.host + item.pic,
|
||||
text:item.explain,
|
||||
name:item.user_name,
|
||||
number:item.votes
|
||||
});
|
||||
}else{
|
||||
console.log(res.data.msg); //失败
|
||||
}
|
||||
}
|
||||
});
|
||||
},
|
||||
//小于10的格式化函数（2变成02）
|
||||
timeFormat(param) {
|
||||
return param < 10 ? '0' + param : param;
|
||||
},
|
||||
//小于0的格式化函数（不会出现负数）
|
||||
timeFormin(param) {
|
||||
return param < 0 ? 0: param;
|
||||
},
|
||||
/**
|
||||
* 生命周期函数--监听页面初次渲染完成
|
||||
*/
|
||||
onReady: function () {
|
||||
|
||||
},
|
||||
|
||||
/**
|
||||
* 生命周期函数--监听页面显示
|
||||
*/
|
||||
onShow: function () {
|
||||
|
||||
},
|
||||
|
||||
/**
|
||||
* 生命周期函数--监听页面隐藏
|
||||
*/
|
||||
onHide: function () {
|
||||
|
||||
},
|
||||
|
||||
/**
|
||||
* 生命周期函数--监听页面卸载
|
||||
*/
|
||||
onUnload: function () {
|
||||
|
||||
},
|
||||
|
||||
/**
|
||||
* 页面相关事件处理函数--监听用户下拉动作
|
||||
*/
|
||||
onPullDownRefresh: function () {
|
||||
|
||||
},
|
||||
|
||||
/**
|
||||
* 页面上拉触底事件的处理函数
|
||||
*/
|
||||
onReachBottom: function () {
|
||||
|
||||
},
|
||||
|
||||
/**
|
||||
* 用户点击右上角分享
|
||||
*/
|
||||
onShareAppMessage: function () {
|
||||
|
||||
},
|
||||
vote(e){
|
||||
var that = this;
|
||||
var id = e.currentTarget.dataset.id;
|
||||
if(id > 0){
|
||||
wx.request({
|
||||
url: urlPath.vote,
|
||||
header:{
|
||||
'token' : wx.getStorageSync('token')
|
||||
},
|
||||
data:{
|
||||
id : id
|
||||
},
|
||||
success(res){
|
||||
if(res.data.code == 0){
|
||||
wx.showToast({
|
||||
title: '投票成功'
|
||||
});
|
||||
that.onLoad({id:that.data.ids});
|
||||
}else{
|
||||
wx.showToast({
|
||||
title:res.data.msg,
|
||||
icon:'none'
|
||||
});
|
||||
}
|
||||
}
|
||||
})
|
||||
}
|
||||
}
|
||||
})
|
||||
|
|
@ -0,0 +1,5 @@
|
|||
{
|
||||
"usingComponents": {
|
||||
"mp-tabbar": "../../custom-tab-bar/index"
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1,72 @@
|
|||
<!--pages/picture/picture.wxml-->
|
||||
<view class="container">
|
||||
<view class="page-body">
|
||||
<view class="page-section page-section-spacing swiper">
|
||||
<swiper autoplay="true" interval="{{interval}}" duration="{{duration}}"
|
||||
circular="true" current="{{swiperCurrent}}" bindchange="swiperChange">
|
||||
<block wx:for="{{img_url}}" >
|
||||
<swiper-item>
|
||||
<view class="swiper-item">
|
||||
<image src="{{item}}"></image>
|
||||
</view>
|
||||
</swiper-item>
|
||||
</block>
|
||||
</swiper>
|
||||
</view>
|
||||
<view class="dots">
|
||||
<block wx:for="{{img_url}}" wx:key="unique">
|
||||
<view class="dot{{index == swiperCurrent ? ' active' : ''}}"></view>
|
||||
</block>
|
||||
</view>
|
||||
</view>
|
||||
<!--内容-->
|
||||
<view class="view-bg top40">
|
||||
<view class="countdown">
|
||||
<view class="names">
|
||||
<text>距离投票结束还有</text>
|
||||
</view>
|
||||
<view class="time" >
|
||||
<text>{{day}}</text>天 <text>{{hou}}</text>时<text>{{min}}</text>分<text>{{sec}}</text>秒
|
||||
</view>
|
||||
<view class="tab">
|
||||
<view class="list">
|
||||
{{tab_number}}<text>人</text>
|
||||
<text>参与者</text>
|
||||
</view>
|
||||
<view class="list">
|
||||
{{tab_vote}}<text>票</text>
|
||||
<text>投票数</text>
|
||||
</view>
|
||||
<view class="list">
|
||||
{{tab_visit}}<text>次</text>
|
||||
<text>访问量</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<!--投票内容-->
|
||||
<view class="picture_conter">
|
||||
<view class="img">
|
||||
<view class="id">{{ids}}<text>号</text></view>
|
||||
<image mode="aspectFill" src="{{img}}"></image>
|
||||
</view>
|
||||
<rich-text class="rule-center" nodes="{{text}}"></rich-text>
|
||||
<!--view class="text">
|
||||
简介：{{text}}
|
||||
</view-->
|
||||
<view class="name" bindtap="personal">
|
||||
{{name}} <text>{{number}}</text>
|
||||
</view>
|
||||
<button class="add" bindtap="vote" data-id="{{ids}}">
|
||||
投票
|
||||
</button>
|
||||
</view>
|
||||
</view>
|
||||
<!--报名-->
|
||||
<!--view class="signup" bindtap="sign">
|
||||
我要报名
|
||||
</view-->
|
||||
<view class=" sign-rule" bindtap="rule">
|
||||
活动规则
|
||||
</view>
|
||||
<!---->
|
||||
</view>
|
||||
|
|
@ -0,0 +1,91 @@
|
|||
/* pages/picture/picture.wxss */
|
||||
.page-body{
|
||||
height: 300rpx;
|
||||
position: relative;
|
||||
}
|
||||
.swiper-item image{
|
||||
width: 100%;
|
||||
height: 300rpx;
|
||||
}
|
||||
.dots{
|
||||
display: inline-block;
|
||||
position: absolute;
|
||||
bottom: 20rpx;
|
||||
right: 0;
|
||||
padding: 0 20rpx;
|
||||
}
|
||||
.dots .dot{
|
||||
width: 8rpx;
|
||||
height: 8rpx;
|
||||
background: #fff;
|
||||
float: left;
|
||||
margin:0 4rpx;
|
||||
border-radius: 50%;
|
||||
}
|
||||
.dots .dot.active{
|
||||
background: #2a8de9;
|
||||
}
|
||||
/**/
|
||||
.picture_conter {
|
||||
padding:0 24rpx;
|
||||
}
|
||||
.picture_conter .img{
|
||||
padding: 16rpx;
|
||||
width: 100%;
|
||||
position: relative;
|
||||
}
|
||||
.picture_conter .img .id{
|
||||
width: 61rpx;
|
||||
height: 72rpx;
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 0;
|
||||
font-size: 24rpx;
|
||||
color: #fff;
|
||||
text-align: center;
|
||||
background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAD4AAABICAYAAACuukaYAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyVpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDYuMC1jMDAyIDc5LjE2NDQ2MCwgMjAyMC8wNS8xMi0xNjowNDoxNyAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIDIxLjIgKE1hY2ludG9zaCkiIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6NDU4RTM1RUFGNEJDMTFFQUExNzhEOURGMjAwQUZGODIiIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6NDU4RTM1RUJGNEJDMTFFQUExNzhEOURGMjAwQUZGODIiPiA8eG1wTU06RGVyaXZlZEZyb20gc3RSZWY6aW5zdGFuY2VJRD0ieG1wLmlpZDozOTQzREZGRkY0QkMxMUVBQTE3OEQ5REYyMDBBRkY4MiIgc3RSZWY6ZG9jdW1lbnRJRD0ieG1wLmRpZDozOTQzRTAwMEY0QkMxMUVBQTE3OEQ5REYyMDBBRkY4MiIvPiA8L3JkZjpEZXNjcmlwdGlvbj4gPC9yZGY6UkRGPiA8L3g6eG1wbWV0YT4gPD94cGFja2V0IGVuZD0iciI/Pk9y1JQAAAE+SURBVHja7NbPSgJRGIbxo3gRs9Ab6AoKu4y6Bvd5HUI3kraIoFZFaiC0kTZBq2iRC3ERYpD/3gNfMIvAZpo5jvgceHChjPP7zjAzpYPW6Ng59+D2a3XLbk8XcODAgQMHDhw4cODAgQMHDhw4cODAgQMHDhw4cODAgQMHDhw4cODAgQMHDhw4cODAgQMHDhw4cODAgQMHDhw4cOB5rm91qxoqUnV1rt5DnkQl0P/M1I1qqys1iX03Un11po7UqTpR1V2Ff6prdWGf0w2/X9kAfoZwGBtCrejwse1o2y7nr5TH8UN4tJp5DCEL+Ie6tJ29U/OMh5nLENLC32xXfT21DHSvyGwISeAvMeyTncQ217+GsAk+tEvYY58L/FhOPITKLwcYqI6BX3fw3eRPQ/Dwhbo3aCf0i8SWhhCtBRgA0ghNoQEzJioAAAAASUVORK5CYII=) no-repeat top center;
|
||||
background-size:61rpx 72rpx ;
|
||||
}
|
||||
.picture_conter .img .id text{
|
||||
display: block;
|
||||
margin-bottom: -3rpx;
|
||||
}
|
||||
.picture_conter .img image{
|
||||
width: 629rpx;
|
||||
height: 394rpx;
|
||||
border-radius: 5rpx;
|
||||
}
|
||||
.picture_conter .text{
|
||||
display: -webkit-box;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
word-wrap: break-word;
|
||||
white-space: normal !important;
|
||||
-webkit-line-clamp: 1;
|
||||
-webkit-box-orient: vertical;
|
||||
font-size: 28rpx;
|
||||
color: #8c8c8c;
|
||||
padding:0 16rpx;
|
||||
}
|
||||
.picture_conter .name{
|
||||
font-size: 30rpx;
|
||||
color: #333333;
|
||||
width: 100%;
|
||||
padding: 40rpx 0;
|
||||
max-width: 240rpx;
|
||||
margin: 0 auto;
|
||||
}
|
||||
.picture_conter .name text{
|
||||
float: right;
|
||||
color: #ff1a1a;
|
||||
}
|
||||
.picture_conter .add{
|
||||
width: 310rpx;
|
||||
height: 58rpx;
|
||||
line-height: 58rpx;
|
||||
background:#ffc103;
|
||||
padding: 0;
|
||||
border-radius: 0;
|
||||
color: #fff;
|
||||
font-size: 30rpx;
|
||||
}
|
||||
|
|
@ -0,0 +1,107 @@
|
|||
// pages/ranking/ranking.js
|
||||
var urlPath = require('../../config.js');
|
||||
Page({
|
||||
/**
|
||||
* 页面的初始数据
|
||||
*/
|
||||
data: {
|
||||
//列表
|
||||
ranking_list:[]
|
||||
},
|
||||
|
||||
/**
|
||||
* 生命周期函数--监听页面加载
|
||||
*/
|
||||
onLoad: function (options) {
|
||||
var that = this;
|
||||
that.getList();
|
||||
},
|
||||
|
||||
/**
|
||||
* 生命周期函数--监听页面初次渲染完成
|
||||
*/
|
||||
onReady: function () {
|
||||
|
||||
},
|
||||
|
||||
/**
|
||||
* 生命周期函数--监听页面显示
|
||||
*/
|
||||
onShow: function () {
|
||||
|
||||
},
|
||||
|
||||
/**
|
||||
* 生命周期函数--监听页面隐藏
|
||||
*/
|
||||
onHide: function () {
|
||||
|
||||
},
|
||||
|
||||
/**
|
||||
* 生命周期函数--监听页面卸载
|
||||
*/
|
||||
onUnload: function () {
|
||||
|
||||
},
|
||||
|
||||
/**
|
||||
* 页面相关事件处理函数--监听用户下拉动作
|
||||
*/
|
||||
onPullDownRefresh: function () {
|
||||
|
||||
},
|
||||
|
||||
/**
|
||||
* 页面上拉触底事件的处理函数
|
||||
*/
|
||||
onReachBottom: function () {
|
||||
|
||||
},
|
||||
|
||||
/**
|
||||
* 用户点击右上角分享
|
||||
*/
|
||||
onShareAppMessage: function () {
|
||||
|
||||
},
|
||||
onShow:function(){
|
||||
if (typeof this.getTabBar === 'function' &&
|
||||
this.getTabBar()) {
|
||||
this.getTabBar().setData({
|
||||
selected: 2
|
||||
})
|
||||
}
|
||||
},
|
||||
getList:function(){
|
||||
var that = this;
|
||||
wx.request({
|
||||
url: urlPath.getVoteList,
|
||||
header:{
|
||||
'token': wx.getStorageSync('token')
|
||||
},
|
||||
success(res){
|
||||
if(res.data.code == 0){
|
||||
if(res.data.data.length > 0){
|
||||
var ranking_list = [];
|
||||
res.data.data.forEach(function(item, index){
|
||||
console.log(index);
|
||||
ranking_list.push({
|
||||
ranks: index + 1,
|
||||
name: item.user_name,
|
||||
ids: item.id,
|
||||
img: urlPath.host + item.pic,
|
||||
number: item.votes,
|
||||
});
|
||||
});
|
||||
that.setData({
|
||||
ranking_list:ranking_list
|
||||
});
|
||||
}
|
||||
}else{
|
||||
console.log(res.data.msg); //失败
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
})
|
||||
|
|
@ -0,0 +1,3 @@
|
|||
{
|
||||
"usingComponents": {}
|
||||
}
|
||||
|
|
@ -0,0 +1,33 @@
|
|||
<!--pages/ranking/ranking.wxml-->
|
||||
<view class="container">
|
||||
<view class="banner">
|
||||
<view class="banner-conter">
|
||||
<view class="text">投票排行榜</view>
|
||||
<view class="img">
|
||||
<image src="../../img/icon_02.png"></image>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<!--排行榜列表-->
|
||||
<view class="ranking top40">
|
||||
<view class="ranking-th">
|
||||
<view>排名</view>
|
||||
<view>姓名</view>
|
||||
<view>作品序号</view>
|
||||
<view>票数</view>
|
||||
</view>
|
||||
<view class="list">
|
||||
<block wx:for="{{ranking_list}}" wx:key="index">
|
||||
<view class="ranking-list">
|
||||
<view class="ranks"><text>{{item.ranks}}</text></view>
|
||||
<view class="name">{{item.name}}</view>
|
||||
<view class="img">
|
||||
<view class="id">{{item.ids}}<text>号</text></view>
|
||||
<image mode="aspectFill" src="{{item.img}}"></image>
|
||||
</view>
|
||||
<view class="number">{{item.number}}</view>
|
||||
</view>
|
||||
</block>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
|
@ -0,0 +1,151 @@
|
|||
/* pages/ranking/ranking.wxss */
|
||||
.container{
|
||||
background: #fff;
|
||||
padding-bottom: 120rpx;
|
||||
}
|
||||
.banner{
|
||||
width: 100%;
|
||||
position: relative;
|
||||
min-height: 390rpx;
|
||||
padding: 30rpx 30rpx 0;
|
||||
}
|
||||
.banner::after{
|
||||
background: #2a7be9;
|
||||
height: 300rpx;
|
||||
width: 100%;
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 0;
|
||||
content: "";
|
||||
}
|
||||
.banner-conter{
|
||||
background: #fff;
|
||||
width: 100%;
|
||||
z-index: 1;
|
||||
position: relative;
|
||||
padding: 50rpx 30rpx;
|
||||
display: inline-block;
|
||||
box-shadow: 10rpx 10rpx 10rpx rgba(0,0,0,.1);
|
||||
}
|
||||
.banner-conter .text{
|
||||
height: 262rpx;
|
||||
line-height: 262rpx;
|
||||
font-size: 63rpx;
|
||||
color: #2a7be9;
|
||||
font-weight: bold;
|
||||
float: left;
|
||||
width: 50%;
|
||||
}
|
||||
.banner-conter .img{
|
||||
float: left;
|
||||
width: 50%;
|
||||
}
|
||||
.banner-conter .img image{
|
||||
width:289rpx;
|
||||
height: 262rpx;
|
||||
}
|
||||
.ranking{
|
||||
width: 100%;
|
||||
}
|
||||
.ranking .ranking-th{
|
||||
background: #f7f7f7;
|
||||
width: 100%;
|
||||
display: inline-block;
|
||||
vertical-align:top;
|
||||
}
|
||||
.ranking .ranking-th view{
|
||||
float: left;
|
||||
display: inline-block;
|
||||
font-size: 28rpx;
|
||||
padding: 20rpx 0 20rpx 20rpx ;
|
||||
color: #a8a8a8;
|
||||
}
|
||||
.ranking .ranking-list {
|
||||
display: inline-block;
|
||||
vertical-align:top;
|
||||
width: 100%;
|
||||
border-bottom: 1rpx solid #dddddd;
|
||||
}
|
||||
.ranking .ranking-th view:nth-child(1),.ranking .ranking-list view:nth-child(1){
|
||||
width: 200rpx;
|
||||
}
|
||||
.ranking .ranking-th view:nth-child(2),.ranking .ranking-list view:nth-child(2){
|
||||
width: 180rpx;
|
||||
}
|
||||
.ranking .ranking-th view:nth-child(3),.ranking .ranking-list view:nth-child(3){
|
||||
width: 270rpx;
|
||||
}
|
||||
.ranking .ranking-th view:nth-child(4),.ranking .ranking-list view:nth-child(4){
|
||||
width: 100rpx;
|
||||
text-align: center;
|
||||
padding-left: 0rpx;
|
||||
}
|
||||
.ranking .ranking-list .ranks text{
|
||||
font-size: 40rpx;
|
||||
color: #fc7e21;
|
||||
width: 40rpx;
|
||||
height: 94rpx;
|
||||
text-align: center;
|
||||
display: block;
|
||||
margin-left: 20rpx;
|
||||
}
|
||||
.ranking .ranking-list:nth-child(1) .ranks text{
|
||||
background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACgAAAAyCAYAAAAus5mQAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyVpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDYuMC1jMDAyIDc5LjE2NDQ2MCwgMjAyMC8wNS8xMi0xNjowNDoxNyAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIDIxLjIgKE1hY2ludG9zaCkiIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6RENCRDE0REFGNTg0MTFFQTlGQUJCMUNBNzVBQjE4NTQiIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6RENCRDE0REJGNTg0MTFFQTlGQUJCMUNBNzVBQjE4NTQiPiA8eG1wTU06RGVyaXZlZEZyb20gc3RSZWY6aW5zdGFuY2VJRD0ieG1wLmlpZDpEQ0JEMTREOEY1ODQxMUVBOUZBQkIxQ0E3NUFCMTg1NCIgc3RSZWY6ZG9jdW1lbnRJRD0ieG1wLmRpZDpEQ0JEMTREOUY1ODQxMUVBOUZBQkIxQ0E3NUFCMTg1NCIvPiA8L3JkZjpEZXNjcmlwdGlvbj4gPC9yZGY6UkRGPiA8L3g6eG1wbWV0YT4gPD94cGFja2V0IGVuZD0iciI/PsTSRPIAAAW6SURBVHjaxFlbbBRVGP53dmcvLdsL0lppa0VaLSI1NSgPXmgxBhQejNiaiPLkgxBrDBpJiERfNDEaE6JREp6M+KAQNNEEgreKL3hJi6Sm2kakNy7Fttvbdq+zfv/saTtzOnttd/dPvmw7c+Z83/znP/855x/beFcHZWEKcC/wCLAZuAOoAYrF/VlgGOgDfge+B7oALVMiR4btbwH2A3uBW5O0cwGrgSbgKXFtEPgE+Bi4mokn0rEy4AhwCXg9hbhExs8cFn0cEX2m78Hyfz6wbDCxvuMJ8dZVtDLmBl4C2oF94P3KgjP1EKORHT/vAAcA25IGsSipc0Ok+gfJHhojJTxJNi0Uv6U4SVNLKeq8icKeWgoXwXk2u9wDv/Ap8LyP34MQGk07BvGQEz+fGeJnMSYiM+T2dZNzuheCgpYvx9eVyDQ55obJNfkHBLso5N1AgbJm0hyrTE2BV4A6cO6ByFDKGBSeO75EXEwj98RvVDL4KUgvJBSXSDA/w89yH9yXZMx1XHCn9CAPa5vsteLrp8kRuLas4LPFIuQZP4+wuEyzNz8me7NNzPRXE3oQb7BTxNxiA8SWd+TkssWZvIK+uE/uW7ID0LDL9FKGRO0FeoFqo+e8Iyf031wYe3C6uk32JHtiA+CTPXjYKI7jpPj6mZyJWwydM3JMVolcaxpiXiFeNCUrXxeG4irl2piDuSTbLzQtCHwe8JhSCc+2PBlzSSPlEZoWBO41LaST3fqMy5cxF3NK9ty8wHuAeuMK4ZrqpXybzhkzLSYNrI0Fthqv8tKVSRJeMS+Ck7kla2GB95sEYn0tlFlwb2GBjcYr9uCNggm04G5UTLlPXzl8BRNowV2jiBXEEAuhggm04PayQNW8/9EKJ3Apt8oCTRkyZlMLJtCCe5oFjpoXcG/BBFpwj7LAfuMV3qYXyiy4+1hgj/FKxLO2YAItuP9kgeeMV8JFt1mekfIxReLcJjvHAn8EpoybSP0UlmdjTmnjypp+YIFzwEnjnUD55rwLtOBkTYH57dYxUyy411K4+Pb8eQ9czCnZMeN+8Dxw1njXv2Yrxezu3Oc+cDCXZGeFJtOZhA/QYWMszlY+muMJY9M5pNjjTeHBJcdOnOo53bwnz2h/RWuORNrIX7nNaua+C1xIVFl4c9618xYs2YhD9g4sQ46VG1b0xX0GvXfJt5j7jYQHd1Eb4RP+sPF6aFU9Tde0U9RVsfzVAn1wX9ynZMzZJtdnltRm0IAbbgNG5GVoqrpdH/Js1mt+hp/lPiyWNOZqFdypq1to2D+xvuMB/HlanPJF2CgY8rv1oVH9A+Sc6dMrWErUby3KXoTlqwbeaojHms2yXsontMfBeTnt8psQOQCRfF45Cuwxx7eC3LVOh/5vdI7sXB+MhRe2TVG1FCnEk8qxXOJ7AVwJyxdJI58f1D7fdCjcsOaZwPZ6m1biTpDLPBRJLWYxrqYC5O78t8+18btnU1YeDJUtywal1Llb7f/Ppl4ap1BTFQW31JK22pPVBFHG58j1yxA5L15DUGsNWs+m2slDLUNpCUxiO+OzRCNn9xUd0eoSCjdWUKSujKKVSLJKgjypxcg+OkOOAR+pf90g+8iUORHG+z6atcDStzs5xT+45HgIogUyu0JamZu0EhfF1HiB1BaOYhiDpPgC+oslse3LEiiqDq7kiU0jZcyvIwtrhRNUDHM4cd0mFlsckbYm+f5HwL4c7xceBn5eiNMTFylporYYglzbjqQTK8m9OiDTTWGPvJanYQ9lK/C+DIn4o+Eu4fUvM3iumadaNgKb0yTgL5tcU+alcUCcJZ4Enqb4Z4VUxpliXTYCU52c+CzDHwX5U+xbvOmR7n8B3Al0pCG0JhuBpQmu80H/NaAWeBm4kuwsBHwoYnk38I3Fi5BcH0o3D34LtHB9BPgb+An4muIfpjPeBgKnBMrFdm6rED4G/Jrowf8FGABQFe50buzSYwAAAABJRU5ErkJggg==) no-repeat center;
|
||||
background-size: 40rpx 50rpx;
|
||||
font-size: 26rpx;
|
||||
color: #fff;
|
||||
line-height: 88rpx;
|
||||
}
|
||||
.ranking .ranking-list:nth-child(2) .ranks text{
|
||||
background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACYAAAAwCAYAAAB9sggoAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyVpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDYuMC1jMDAyIDc5LjE2NDQ2MCwgMjAyMC8wNS8xMi0xNjowNDoxNyAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIDIxLjIgKE1hY2ludG9zaCkiIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6RENCRDE0RDZGNTg0MTFFQTlGQUJCMUNBNzVBQjE4NTQiIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6RENCRDE0RDdGNTg0MTFFQTlGQUJCMUNBNzVBQjE4NTQiPiA8eG1wTU06RGVyaXZlZEZyb20gc3RSZWY6aW5zdGFuY2VJRD0ieG1wLmlpZDo5RTYzMDg3NUY1ODQxMUVBOUZBQkIxQ0E3NUFCMTg1NCIgc3RSZWY6ZG9jdW1lbnRJRD0ieG1wLmRpZDo5RTYzMDg3NkY1ODQxMUVBOUZBQkIxQ0E3NUFCMTg1NCIvPiA8L3JkZjpEZXNjcmlwdGlvbj4gPC9yZGY6UkRGPiA8L3g6eG1wbWV0YT4gPD94cGFja2V0IGVuZD0iciI/PvLUyVgAAAUwSURBVHjaxFlpTB1VGP2gj1JWW0hZAtr60hJqlNqStHGjpIttUi1WRf1pokH7i5i4JfrPmJgYG2NIXOLyxx9GQktsYqw1FKOWqq0LWm3ZVYgsAqW8ttA+wHOYO/S+++YNzKNvOMlhmDv3fue8u829d5JqTs1IHCgF7wXvBEvAm8BM9SwE/g22gSfAL8GzXgUCHvKuAJ8AnwRvd8mXCuaCm8BHVdov4PvgB+CEJ2PvnXbOUFMuSbg8Dr4KFkp84A+pA18CXwY/gt5MDL1ZJLtFQ6YiXJrAD91MhadFLl21yP9dUKhqrUnF9t6UKMj+0wiuNp9dDot0jYr0jokMXbIM6UhPQaF0keJskWCOSFq0SiX4MzQeQM2dWLAxFNiNyyFq6OnjkyI//SvSPiIy7TJmaPSvMYstvSLrYW4z6iorNSIbf/AxaD0Ic0fNGMkOprY6mWodEKn/Q+TcsLspE8zLMizLGAaocUhpxjaGDHm4HNZNsc8c7RA52Ttv/3EFyzIGYxlxqNWotGPWWEQnZ4DP260muV5gLMY0zBUo7WhjcPwILnv1h03dIv0hue5gTMY2sBceHjONBdQ8NYffBkV6zkvCwNjUMPCKPSBtYw+D6+ynoSsiP/ZJwkENamlYp7zMGavRn3JKWExH9zIgqGXgKdsYZ+BtduoEJs+2YfEN1KKmhgp6orEd+iDoHPU2Ty0W1KKmMSB38M89euo/Y+I7HDQraGyDnjJ40X9jDpqlNBa07ybDUe3tCyaidYM0lqWvGpYKhrHsZG1J7GundxoEGjJobK7rLUteOmOG9hhvR/UF3lLB0B6hsXb7LgV3mcv9N5W13NLW0MHbMxGL8kz/jRVEa56hsWY9Zc1K/405aDbT2HEu0+cy3YANZMA/U9Sipr7XoScauwAe0UfHrXn+GaOWMSI/oyc7qU5/UpbvzyCgxm35Ucl1+nrsW72vBZBasSbxxqhhjMZm5SViM/IMOGXfcLO6pShxphibGhqmlIfIzQg2nTz4OBhx4FDgWNWLBmMytoGDyoPj9o0HHi16wh3FIlvB5KTFG2IMxmJMAy1K23lfCcfcGlRx5tXTN+IX3lcisiotflMse3+JFcsAtaqUduwjAmQYwmWX/qqyZ+eHsKSsXCuS48Eg87IMy+ZHz/DU2KU05z9UQcYebD655K7Xl95sipJciyOYBnsxAw5h9Tl+5dp6ihMm332rM6zO7fIjvgGroTXg6RiKBWBue2nPyYaOG8v3hZelRNVEThxNG5i6KismQ2+G0lc9B43wvOdj9kmeufWr/aQm0J8blMbKWmldXykzEt8oSELJsvZmqfr6LSn8r/PsgRdbwzE03WuMePu1Mr7FdhYMd8nTDbXSl1ci35Xtl9Mb9siFjNwFGcq+OCzlf34hd7UelqLBNjt5H/iu6w9xO7WGsWpcPjXTWWs02VW0Ufpzb5bzWflyOdXq2WmTIVk5PiAFw90S7Pt11kxS9HErFw05qLXJuGrMPP3Rm6V48Nws412wqkH1Vcwam5m59mumq8vM573qCCEReB18PmLuqm+NPY9puCWBpojdrm8Jl2fbPApxtzXo5ZUp1ocKz8a2eBDhEd9+VQvdC55BRMrjMVa+QAEehW9WS3SuDvip5h122QWU3RSPsbXzBD2l5qM9Ri2xSQ/w3Q82zGOwyKuxFP1MQwO/gfBryU7V1EdcRH8X69iSX+feAPudtpRe5zEa+F41J09jfwCPifVhwut5Yyf4LPgCeDe4ndsKnk+AH8cq9L8AAwCPdINDPHa2WwAAAABJRU5ErkJggg==) no-repeat center;
|
||||
background-size: 40rpx 50rpx;
|
||||
font-size: 26rpx;
|
||||
color: #fff;
|
||||
line-height: 88rpx;
|
||||
}
|
||||
.ranking .ranking-list:nth-child(3) .ranks text{
|
||||
background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACgAAAAxCAYAAACoJ+s+AAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyVpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDYuMC1jMDAyIDc5LjE2NDQ2MCwgMjAyMC8wNS8xMi0xNjowNDoxNyAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIDIxLjIgKE1hY2ludG9zaCkiIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6OUU2MzA4NzNGNTg0MTFFQTlGQUJCMUNBNzVBQjE4NTQiIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6OUU2MzA4NzRGNTg0MTFFQTlGQUJCMUNBNzVBQjE4NTQiPiA8eG1wTU06RGVyaXZlZEZyb20gc3RSZWY6aW5zdGFuY2VJRD0ieG1wLmlpZDo5RTYzMDg3MUY1ODQxMUVBOUZBQkIxQ0E3NUFCMTg1NCIgc3RSZWY6ZG9jdW1lbnRJRD0ieG1wLmRpZDo5RTYzMDg3MkY1ODQxMUVBOUZBQkIxQ0E3NUFCMTg1NCIvPiA8L3JkZjpEZXNjcmlwdGlvbj4gPC9yZGY6UkRGPiA8L3g6eG1wbWV0YT4gPD94cGFja2V0IGVuZD0iciI/PshhoNUAAAT3SURBVHjaxFlLaFxVGP7PnaSZNA3RSWtFUpoiXSgqVYuISlMfKHWhINqKWiy2bqw73SmCCFJFd+KmVkHrA3RjcWdxoVBUQhEXfYFtlDbpIyQzbSadR+4cv+/OSTLnPmbmzuTO/PBxhnvP+b/v/uf1nzPKPXBAWrAUcB/wMHAvsBkYAQbM+zxwATgDHAd+Af4E3LhEPTHrbwReB14AbqlTbxVwI3AH8Ix5Ngl8A3wC/NssoVqMoDMxEVmpMjp6M4r3gJeBXmnPysCXwNvgvBjBt/TbaeQNlV9BcRLY11Cc1lXUN/rYS5/wvbflLkbjNIqDwEuhFVxX1Py8SKEgqlQSWVhYFqcUPPeIXoWeTqdFr16NUZvye7gB+Aw821G+imgWmhaIRkMofgTGAi8hRuVyVXFR0eLzclkUIPm8qJkZT6QegluKto0B2ADOpyEy53/phIjD58qRgLhKRdT0tDiTk6JA2kRXWoLZxmsLH/TlM3IdMdz1BcK+ALbZw7osztSUqLk5adfog77o02fbDHe0QHzBayh2WjUwxiIctjGPqx9M3z7bCQ37QwXixQYUH1jVi0VxLl8O65L2DT493+DwGTVsCovgh8Aay8GVK8mIq88xUBuoRYG3A7ussYKZ5y0dSRs4PC7bnjWalgRy+1LWUrICEyLOxPF1NbXsXxTYF4heNiudNq6tPnue2ijwISBj7RDXr3deIDldK9mhpgcdkzItV6y3QyRpXMzJbdsjFLjFv+51zYLcWxyTbC5HcCUX5LjdHOTeTIE3+ad91yzIvZ4CB/2LZ9csyD1IgfZeo1T3BAa5ixR4zU4fnO4JDHJf4xPrMKJ7e7umL4T7HAWesh719XUvgkHuUxR4zHrU3989gUHuYxR41AozDjk88HTceMgit21HKfAs8IclcnCw8+MvyPk7tS1Om0OBysFjYnIGrhCBn9fmg4eBqdrproeHOxc9ctlLzEWjaUkg86t3rEY8x3agq8nhHexte9doss4kh/wzWmcyYY1XThyDkMmEjb2DgUMTTvXanPKztVuPXrcukUh6kYNv3/aWNTdnbui5GCLPodht3eNRJMaI1my7EomsFt1f9ekTR87dRkP0zQIq/IRijyXSLYuePS2V2b9El2Zbl1bKVn3MBa4HybXHcDe+PELFwzjIM739CkhL7gJSIeZqC6KvnhDds0ZUer2ovrWIQoNFXaNNcVp04RKam5Niruh9tKS8vbdgIvdDrOs3NoBIJhLfycx/t9qJ5RyiQPwDDwOiUjhrp7ALKNMhGnmdWxDt5lE3H5L3IWBZfPTwKDeJXeAaj30/aESOV3pzY5I7zz4JX7khQIeJaGSXTp6FwLvBcbXuDlhzNyMy/nVYnUcjxbVj8zMj4HMCOfTWFxtev/ntqYSWQd5k7miYwzZ4z1H8WIIbyRPtCuStw1CCAndYd0JhxxRdc4tQee4u//uPgDcS3o75R9DxpYh9/3esCD7egWTmyVa7mH/e3BmT7LxU//6KY9tbFXh/TKIzZtDzMuq3GO221huH9QTe0yRBCfjYjKUTUv1PjlHhBeR0E+05CTe1InBjE8KYQ94GvAnUXsly/f0U4Bb5FveNBr5GWhGYiXg+YbJvfvU+c+iKMm5j75uPZZ73s5dxBC3dyl5MZ2MmMqeBXwGmQ+MtJIa8//nWYK3ZPh8wH5n1nypr7X8BBgDcWcDfyBNcLQAAAABJRU5ErkJggg==) no-repeat center;
|
||||
background-size: 40rpx 50rpx;
|
||||
font-size: 26rpx;
|
||||
color: #fff;
|
||||
line-height: 88rpx;
|
||||
}
|
||||
.ranking .ranking-list view{
|
||||
float: left;
|
||||
display: inline-block;
|
||||
padding: 0;
|
||||
height: 94rpx;
|
||||
line-height: 94rpx;
|
||||
}
|
||||
.ranking .ranking-list .name{
|
||||
font-size: 28rpx;
|
||||
}
|
||||
.ranking .ranking-list .img{
|
||||
position: relative;
|
||||
padding: 10rpx 10rpx;
|
||||
}
|
||||
.ranking .ranking-list .img .id{
|
||||
line-height: initial;
|
||||
width:35rpx;
|
||||
height: 41rpx;
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 0;
|
||||
font-size: 13rpx;
|
||||
color: #fff;
|
||||
text-align: center;
|
||||
background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAD4AAABICAYAAACuukaYAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyVpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDYuMC1jMDAyIDc5LjE2NDQ2MCwgMjAyMC8wNS8xMi0xNjowNDoxNyAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIDIxLjIgKE1hY2ludG9zaCkiIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6NDU4RTM1RUFGNEJDMTFFQUExNzhEOURGMjAwQUZGODIiIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6NDU4RTM1RUJGNEJDMTFFQUExNzhEOURGMjAwQUZGODIiPiA8eG1wTU06RGVyaXZlZEZyb20gc3RSZWY6aW5zdGFuY2VJRD0ieG1wLmlpZDozOTQzREZGRkY0QkMxMUVBQTE3OEQ5REYyMDBBRkY4MiIgc3RSZWY6ZG9jdW1lbnRJRD0ieG1wLmRpZDozOTQzRTAwMEY0QkMxMUVBQTE3OEQ5REYyMDBBRkY4MiIvPiA8L3JkZjpEZXNjcmlwdGlvbj4gPC9yZGY6UkRGPiA8L3g6eG1wbWV0YT4gPD94cGFja2V0IGVuZD0iciI/Pk9y1JQAAAE+SURBVHja7NbPSgJRGIbxo3gRs9Ab6AoKu4y6Bvd5HUI3kraIoFZFaiC0kTZBq2iRC3ERYpD/3gNfMIvAZpo5jvgceHChjPP7zjAzpYPW6Ng59+D2a3XLbk8XcODAgQMHDhw4cODAgQMHDhw4cODAgQMHDhw4cODAgQMHDhw4cODAgQMHDhw4cODAgQMHDhw4cODAgQMHDhw4cOB5rm91qxoqUnV1rt5DnkQl0P/M1I1qqys1iX03Un11po7UqTpR1V2Ff6prdWGf0w2/X9kAfoZwGBtCrejwse1o2y7nr5TH8UN4tJp5DCEL+Ie6tJ29U/OMh5nLENLC32xXfT21DHSvyGwISeAvMeyTncQ217+GsAk+tEvYY58L/FhOPITKLwcYqI6BX3fw3eRPQ/Dwhbo3aCf0i8SWhhCtBRgA0ghNoQEzJioAAAAASUVORK5CYII=) no-repeat top center;
|
||||
background-size:35rpx 41rpx ;
|
||||
}
|
||||
.ranking .ranking-list .img text{
|
||||
display: block;
|
||||
}
|
||||
.ranking .ranking-list .img image{
|
||||
width: 124rpx;
|
||||
height: 75rpx;
|
||||
}
|
||||
.ranking .ranking-list .number{
|
||||
font-size: 28rpx;
|
||||
color: #f83f3c;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
|
@ -0,0 +1,138 @@
|
|||
// pages/index.js
|
||||
Page({
|
||||
|
||||
sign() {
|
||||
wx.navigateTo({ url: '../sign/sign' });
|
||||
},
|
||||
/**
|
||||
* 页面的初始数据
|
||||
*/
|
||||
data: {
|
||||
img_url:wx.getStorageSync('img_url'),
|
||||
swiperCurrent:0,
|
||||
autoplay: false,
|
||||
interval: 3000,
|
||||
duration: 800,
|
||||
//倒计时数据
|
||||
endTime: '2020/11/22 10:40:30',
|
||||
//
|
||||
tab_number:31,//参与者
|
||||
tab_vote:2375,//投票数
|
||||
tab_visit:55,//访问次数
|
||||
//活动规则
|
||||
rule:'我是活动规则'
|
||||
},
|
||||
swiperChange: function (e) {
|
||||
// console.log(e);
|
||||
this.setData({
|
||||
swiperCurrent: e.detail.current
|
||||
})
|
||||
},
|
||||
/**
|
||||
* 生命周期函数--监听页面加载
|
||||
*/
|
||||
onLoad: function (options) {
|
||||
var that = this;
|
||||
var baseInfo = wx.getStorageSync('baseInfo');
|
||||
that.setData({
|
||||
tab_number: baseInfo.numberOfPeople,
|
||||
tab_vote: baseInfo.voteNumber,
|
||||
endTime: baseInfo.vote.time,
|
||||
rule_text: baseInfo.vote.rule_text,
|
||||
tab_visit:baseInfo.vote.visits,
|
||||
rule:baseInfo.vote.rule,
|
||||
img_url:wx.getStorageSync('img_url'),
|
||||
});
|
||||
that.countDown()
|
||||
},
|
||||
// 倒计时
|
||||
countDown:function(){
|
||||
var that=this;
|
||||
var nowTime = new Date().getTime();//现在时间（时间戳）
|
||||
var endTime = new Date(that.data.endTime).getTime();//结束时间（时间戳）
|
||||
var time = (endTime-nowTime)/1000;//距离结束的毫秒数
|
||||
// 获取天、时、分、秒
|
||||
let day = parseInt(time / (60 * 60 * 24));
|
||||
let hou = parseInt(time % (60 * 60 * 24) / 3600);
|
||||
let min = parseInt(time % (60 * 60 * 24) % 3600 / 60);
|
||||
let sec = parseInt(time % (60 * 60 * 24) % 3600 % 60);
|
||||
// console.log(day + "," + hou + "," + min + "," + sec)
|
||||
day = that.timeFormin(day),
|
||||
hou = that.timeFormin(hou),
|
||||
min = that.timeFormin(min),
|
||||
sec = that.timeFormin(sec)
|
||||
that.setData({
|
||||
day: that.timeFormat(day),
|
||||
hou: that.timeFormat(hou),
|
||||
min: that.timeFormat(min),
|
||||
sec: that.timeFormat(sec)
|
||||
})
|
||||
// 每1000ms刷新一次
|
||||
if (time>0){
|
||||
that.setData({
|
||||
countDown: true
|
||||
})
|
||||
setTimeout(this.countDown, 1000);
|
||||
}else{
|
||||
that.setData({
|
||||
countDown:false
|
||||
})
|
||||
}
|
||||
},
|
||||
//小于10的格式化函数（2变成02）
|
||||
timeFormat(param) {
|
||||
return param < 10 ? '0' + param : param;
|
||||
},
|
||||
//小于0的格式化函数（不会出现负数）
|
||||
timeFormin(param) {
|
||||
return param < 0 ? 0: param;
|
||||
},
|
||||
/**
|
||||
* 生命周期函数--监听页面初次渲染完成
|
||||
*/
|
||||
onReady: function () {
|
||||
|
||||
},
|
||||
|
||||
/**
|
||||
* 生命周期函数--监听页面显示
|
||||
*/
|
||||
onShow: function () {
|
||||
|
||||
},
|
||||
|
||||
/**
|
||||
* 生命周期函数--监听页面隐藏
|
||||
*/
|
||||
onHide: function () {
|
||||
|
||||
},
|
||||
|
||||
/**
|
||||
* 生命周期函数--监听页面卸载
|
||||
*/
|
||||
onUnload: function () {
|
||||
|
||||
},
|
||||
|
||||
/**
|
||||
* 页面相关事件处理函数--监听用户下拉动作
|
||||
*/
|
||||
onPullDownRefresh: function () {
|
||||
|
||||
},
|
||||
|
||||
/**
|
||||
* 页面上拉触底事件的处理函数
|
||||
*/
|
||||
onReachBottom: function () {
|
||||
|
||||
},
|
||||
|
||||
/**
|
||||
* 用户点击右上角分享
|
||||
*/
|
||||
onShareAppMessage: function () {
|
||||
|
||||
}
|
||||
})
|
||||
|
|
@ -0,0 +1,3 @@
|
|||
{
|
||||
"usingComponents": {}
|
||||
}
|
||||
|
|
@ -0,0 +1,59 @@
|
|||
<!--pages/index.wxml-->
|
||||
<view class="container">
|
||||
<view class="page-body">
|
||||
<view class="page-section page-section-spacing swiper">
|
||||
<swiper autoplay="true" interval="{{interval}}" duration="{{duration}}"
|
||||
circular="true" current="{{swiperCurrent}}" bindchange="swiperChange">
|
||||
<block wx:for="{{img_url}}" >
|
||||
<swiper-item>
|
||||
<view class="swiper-item">
|
||||
<image src="{{item}}" ></image>
|
||||
</view>
|
||||
</swiper-item>
|
||||
</block>
|
||||
</swiper>
|
||||
</view>
|
||||
<view class="dots">
|
||||
<block wx:for="{{img_url}}" wx:key="unique">
|
||||
<view class="dot{{index == swiperCurrent ? ' active' : ''}}"></view>
|
||||
</block>
|
||||
</view>
|
||||
</view>
|
||||
<!--内容-->
|
||||
<view class="view-bg top40">
|
||||
<view class="countdown">
|
||||
<view class="names">
|
||||
<text>距离投票结束还有</text>
|
||||
</view>
|
||||
<view class="time" >
|
||||
<text>{{day}}</text>天 <text>{{hou}}</text>时<text>{{min}}</text>分<text>{{sec}}</text>秒
|
||||
</view>
|
||||
<view class="tab">
|
||||
<view class="list">
|
||||
{{tab_number}}<text>人</text>
|
||||
<text>参与者</text>
|
||||
</view>
|
||||
<view class="list">
|
||||
{{tab_vote}}<text>票</text>
|
||||
<text>投票数</text>
|
||||
</view>
|
||||
<view class="list">
|
||||
{{tab_visit}}<text>次</text>
|
||||
<text>访问量</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<!--活动规则-->
|
||||
<view class="view-bg top40">
|
||||
<view class="rule-name">
|
||||
<text>活动规则</text>
|
||||
</view>
|
||||
<rich-text class="rule-center" nodes="{{rule}}"></rich-text>
|
||||
</view>
|
||||
<!--报名-->
|
||||
<!--view class="signup" bindtap="sign">
|
||||
我要报名
|
||||
</view-->
|
||||
<!---->
|
||||
</view>
|
||||
|
|
@ -0,0 +1,56 @@
|
|||
/* pages/rule/rule.wxss */
|
||||
.page-body{
|
||||
height: 300rpx;
|
||||
position: relative;
|
||||
}
|
||||
.swiper-item image{
|
||||
width: 100%;
|
||||
height: 300rpx;
|
||||
}
|
||||
.dots{
|
||||
display: inline-block;
|
||||
position: absolute;
|
||||
bottom: 20rpx;
|
||||
right: 0;
|
||||
padding: 0 20rpx;
|
||||
}
|
||||
.dots .dot{
|
||||
width: 8rpx;
|
||||
height: 8rpx;
|
||||
background: #fff;
|
||||
float: left;
|
||||
margin:0 4rpx;
|
||||
border-radius: 50%;
|
||||
}
|
||||
.dots .dot.active{
|
||||
background: #2a8de9;
|
||||
}
|
||||
.view-bg{
|
||||
overflow: inherit;
|
||||
}
|
||||
.rule-name{
|
||||
position: relative;
|
||||
padding-top: 50rpx;
|
||||
height: 104rpx;
|
||||
width: 100%;
|
||||
}
|
||||
.rule-name text{
|
||||
background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAJ4AAAA2CAYAAAA2yiD4AAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyVpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDYuMC1jMDAyIDc5LjE2NDQ2MCwgMjAyMC8wNS8xMi0xNjowNDoxNyAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIDIxLjIgKE1hY2ludG9zaCkiIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6RENCRDE0REVGNTg0MTFFQTlGQUJCMUNBNzVBQjE4NTQiIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6RENCRDE0REZGNTg0MTFFQTlGQUJCMUNBNzVBQjE4NTQiPiA8eG1wTU06RGVyaXZlZEZyb20gc3RSZWY6aW5zdGFuY2VJRD0ieG1wLmlpZDpEQ0JEMTREQ0Y1ODQxMUVBOUZBQkIxQ0E3NUFCMTg1NCIgc3RSZWY6ZG9jdW1lbnRJRD0ieG1wLmRpZDpEQ0JEMTREREY1ODQxMUVBOUZBQkIxQ0E3NUFCMTg1NCIvPiA8L3JkZjpEZXNjcmlwdGlvbj4gPC9yZGY6UkRGPiA8L3g6eG1wbWV0YT4gPD94cGFja2V0IGVuZD0iciI/PkrcqxMAAADqSURBVHja7NehDcJQEIBhHkEhmACLaVAkwApMgO8czIHHdgK2QIHCYpCYWriXMEATmlfB9yWXqprLH46m6vB8j6CwsRUgPIQHwkN4IDyEB8JDeCA8hIfwQHgID4SH8EB4CA+Eh/BAeAgP4YHwEB4ID+GB8BAeCA/hgfAQHsID4SE8EB7CA+EhPBAewgPhITz+0uRxv9TxPMZMu7wwX6yStfGrNNuf83MZ08RUXd55NTubo5dTe41Zx5yshNL/8dqY+jut1VD64yL/6m1jbtZD6a/afHo3Ti+lw3N6GSw8p5dBw3N66d1HgAEAR0gYqe9caJYAAAAASUVORK5CYII=) no-repeat center left;
|
||||
background-size: 158rpx 54rpx;
|
||||
width: 158rpx;
|
||||
height: 54rpx;
|
||||
padding-left: 20rpx;
|
||||
font-size: 30rpx;
|
||||
color: #fff;
|
||||
display: block;
|
||||
position: absolute;
|
||||
left: -10rpx;
|
||||
top:50rpx;
|
||||
}
|
||||
.rule-center{
|
||||
margin-top: 30rpx;
|
||||
font-size: 24rpx;
|
||||
padding: 20rpx;
|
||||
display: block;
|
||||
width: 100%;
|
||||
}
|
||||
|
|
@ -0,0 +1,277 @@
|
|||
// pages/sign/sign.js
|
||||
Page({
|
||||
|
||||
/**
|
||||
* 页面的初始数据
|
||||
*/
|
||||
data: {
|
||||
img_url:wx.getStorageSync('img_url'),
|
||||
swiperCurrent:0,
|
||||
autoplay: false,
|
||||
interval: 3000,
|
||||
duration: 800,
|
||||
//倒计时数据
|
||||
endTime: '2020/11/22 10:40:30',
|
||||
//
|
||||
tab_number:31,//参与者
|
||||
tab_vote:2375,//投票数
|
||||
tab_visit:55,//访问次数
|
||||
//上传图
|
||||
source:'',
|
||||
is_upload:'0',
|
||||
tel : '',
|
||||
name : '',
|
||||
img : '',
|
||||
desc : '',
|
||||
user : wx.getStorageSync('user')
|
||||
},
|
||||
/**
|
||||
* 上传图片
|
||||
*/
|
||||
uploadimg:function(){
|
||||
var that = this;
|
||||
wx.chooseImage({ //从本地相册选择图片或使用相机拍照
|
||||
count: 1, // 默认9
|
||||
sizeType: ['original', 'compressed'], // 可以指定是原图还是压缩图，默认二者都有
|
||||
sourceType: ['album', 'camera'], // 可以指定来源是相册还是相机，默认二者都有
|
||||
success:function(res){
|
||||
//前台显示
|
||||
that.setData({
|
||||
source: res.tempFilePaths,
|
||||
is_upload:'1'
|
||||
})
|
||||
// 返回选定照片的本地文件路径列表，tempFilePath可以作为img标签的src属性显示图片
|
||||
var tempFilePaths = res.tempFilePaths
|
||||
wx.uploadFile({
|
||||
url: wx.getStorageSync('urlPath').upload,
|
||||
header:{
|
||||
token: wx.getStorageSync('token')
|
||||
},
|
||||
filePath: tempFilePaths[0],
|
||||
name: 'image',
|
||||
success:function(res){
|
||||
var result = JSON.parse(res.data);
|
||||
console.log(result);
|
||||
if(result.code == 0){
|
||||
that.setData({
|
||||
img: result.data.src
|
||||
});
|
||||
}else{
|
||||
console.log(result.msg);
|
||||
}
|
||||
}
|
||||
})
|
||||
}
|
||||
})
|
||||
//https://www.jb51.net/article/132557.htm 后端源码
|
||||
},
|
||||
//上传图片
|
||||
swiperChange: function (e) {
|
||||
// console.log(e);
|
||||
this.setData({
|
||||
swiperCurrent: e.detail.current
|
||||
})
|
||||
},
|
||||
/**
|
||||
* 生命周期函数--监听页面加载
|
||||
*/
|
||||
onLoad: function (options) {
|
||||
var that = this;
|
||||
var baseInfo = wx.getStorageSync('baseInfo');
|
||||
that.setData({
|
||||
tab_number: baseInfo.numberOfPeople,
|
||||
tab_vote: baseInfo.voteNumber,
|
||||
endTime: baseInfo.vote.time,
|
||||
rule_text: baseInfo.vote.rule_text,
|
||||
tab_visit:baseInfo.vote.visits,
|
||||
img_url:wx.getStorageSync('img_url'),
|
||||
});
|
||||
that.setData({
|
||||
user:wx.getStorageSync('user')
|
||||
});
|
||||
that.countDown();
|
||||
},
|
||||
// 倒计时
|
||||
countDown:function(){
|
||||
var that=this;
|
||||
var nowTime = new Date().getTime();//现在时间（时间戳）
|
||||
var endTime = new Date(that.data.endTime).getTime();//结束时间（时间戳）
|
||||
var time = (endTime-nowTime)/1000;//距离结束的毫秒数
|
||||
// 获取天、时、分、秒
|
||||
let day = parseInt(time / (60 * 60 * 24));
|
||||
let hou = parseInt(time % (60 * 60 * 24) / 3600);
|
||||
let min = parseInt(time % (60 * 60 * 24) % 3600 / 60);
|
||||
let sec = parseInt(time % (60 * 60 * 24) % 3600 % 60);
|
||||
// console.log(day + "," + hou + "," + min + "," + sec)
|
||||
day = that.timeFormin(day),
|
||||
hou = that.timeFormin(hou),
|
||||
min = that.timeFormin(min),
|
||||
sec = that.timeFormin(sec)
|
||||
that.setData({
|
||||
day: that.timeFormat(day),
|
||||
hou: that.timeFormat(hou),
|
||||
min: that.timeFormat(min),
|
||||
sec: that.timeFormat(sec)
|
||||
})
|
||||
// 每1000ms刷新一次
|
||||
if (time>0){
|
||||
that.setData({
|
||||
countDown: true
|
||||
})
|
||||
setTimeout(this.countDown, 1000);
|
||||
}else{
|
||||
that.setData({
|
||||
countDown:false
|
||||
})
|
||||
}
|
||||
},
|
||||
//小于10的格式化函数（2变成02）
|
||||
timeFormat(param) {
|
||||
return param < 10 ? '0' + param : param;
|
||||
},
|
||||
//小于0的格式化函数（不会出现负数）
|
||||
timeFormin(param) {
|
||||
return param < 0 ? 0: param;
|
||||
},
|
||||
/**
|
||||
* 生命周期函数--监听页面初次渲染完成
|
||||
*/
|
||||
onReady: function () {
|
||||
|
||||
},
|
||||
|
||||
/**
|
||||
* 生命周期函数--监听页面显示
|
||||
*/
|
||||
onShow: function () {
|
||||
|
||||
},
|
||||
|
||||
/**
|
||||
* 生命周期函数--监听页面隐藏
|
||||
*/
|
||||
onHide: function () {
|
||||
|
||||
},
|
||||
|
||||
/**
|
||||
* 生命周期函数--监听页面卸载
|
||||
*/
|
||||
onUnload: function () {
|
||||
|
||||
},
|
||||
|
||||
/**
|
||||
* 页面相关事件处理函数--监听用户下拉动作
|
||||
*/
|
||||
onPullDownRefresh: function () {
|
||||
|
||||
},
|
||||
|
||||
/**
|
||||
* 页面上拉触底事件的处理函数
|
||||
*/
|
||||
onReachBottom: function () {
|
||||
|
||||
},
|
||||
|
||||
/**
|
||||
* 用户点击右上角分享
|
||||
*/
|
||||
onShareAppMessage: function () {
|
||||
|
||||
},
|
||||
setname:function(e){
|
||||
this.setData({
|
||||
name:e.detail.value
|
||||
});
|
||||
},
|
||||
settel:function(e){
|
||||
this.setData({
|
||||
tel:e.detail.value
|
||||
});
|
||||
},
|
||||
setdesc:function(e){
|
||||
this.setData({
|
||||
desc:e.detail.value
|
||||
});
|
||||
},
|
||||
save:function(){
|
||||
var that = this;
|
||||
var user = wx.getStorageSync('user');
|
||||
var name = that.data.name;
|
||||
var tel = that.data.tel;
|
||||
if(user.tel == '' || user.name == ''){
|
||||
if(name == ''){
|
||||
wx.showToast({
|
||||
title: '姓名不可为空',
|
||||
icon: 'none'
|
||||
});
|
||||
}
|
||||
if(tel == ''){
|
||||
wx.showToast({
|
||||
title: '电话不可为空',
|
||||
icon: 'none'
|
||||
});
|
||||
}
|
||||
}
|
||||
var desc = that.data.desc;
|
||||
var img = that.data.img;
|
||||
console.log(img);
|
||||
if(desc == ''){
|
||||
wx.showToast({
|
||||
title: '描述不可为空',
|
||||
icon: 'none'
|
||||
});
|
||||
}
|
||||
if(img == ''){
|
||||
wx.showToast({
|
||||
title: '请上传图片',
|
||||
icon: 'none'
|
||||
});
|
||||
}
|
||||
wx.request({
|
||||
url: wx.getStorageSync('urlPath').saveProduction,
|
||||
header:{
|
||||
token: wx.getStorageSync('token')
|
||||
},
|
||||
method: 'post',
|
||||
data:{
|
||||
name: name,
|
||||
tel: tel,
|
||||
desc: desc,
|
||||
img:img
|
||||
},
|
||||
success(res){
|
||||
if(res.data.code == 0){
|
||||
if(user.tel == '' || user.name == ''){
|
||||
wx.request({
|
||||
url: wx.getStorageSync('urlPath').getUser,
|
||||
header:{
|
||||
token: wx.getStorageSync('token')
|
||||
},
|
||||
success(resForUser){
|
||||
if(resForUser.data.code == 0){
|
||||
console.log(resForUser.data.data);
|
||||
wx.setStorageSync('user', resForUser.data.data);
|
||||
that.onLoad();
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
wx.showToast({
|
||||
title: '上传成功'
|
||||
});
|
||||
wx.switchTab({
|
||||
url: '/pages/index/index',
|
||||
})
|
||||
}else{
|
||||
wx.showToast({
|
||||
title: res.data.msg,
|
||||
icon: 'none'
|
||||
});
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
})
|
||||
|
|
@ -0,0 +1,3 @@
|
|||
{
|
||||
"usingComponents": {}
|
||||
}
|
||||
|
|
@ -0,0 +1,76 @@
|
|||
<!--pages/sign.wxml-->
|
||||
<view class="container">
|
||||
<view class="page-body">
|
||||
<view class="page-section page-section-spacing swiper">
|
||||
<swiper autoplay="true" interval="{{interval}}" duration="{{duration}}"
|
||||
circular="true" current="{{swiperCurrent}}" bindchange="swiperChange">
|
||||
<block wx:for="{{img_url}}" >
|
||||
<swiper-item>
|
||||
<view class="swiper-item">
|
||||
<image src="{{item}}" ></image>
|
||||
</view>
|
||||
</swiper-item>
|
||||
</block>
|
||||
</swiper>
|
||||
</view>
|
||||
<view class="dots">
|
||||
<block wx:for="{{img_url}}" wx:key="unique">
|
||||
<view class="dot{{index == swiperCurrent ? ' active' : ''}}"></view>
|
||||
</block>
|
||||
</view>
|
||||
</view>
|
||||
<!--内容-->
|
||||
<view class="view-bg top40">
|
||||
<view class="countdown">
|
||||
<view class="names">
|
||||
<text>距离投票结束还有</text>
|
||||
</view>
|
||||
<view class="time" >
|
||||
<text>{{day}}</text>天 <text>{{hou}}</text>时<text>{{min}}</text>分<text>{{sec}}</text>秒
|
||||
</view>
|
||||
<view class="tab">
|
||||
<view class="list">
|
||||
{{tab_number}}<text>人</text>
|
||||
<text>参与者</text>
|
||||
</view>
|
||||
<view class="list">
|
||||
{{tab_vote}}<text>票</text>
|
||||
<text>投票数</text>
|
||||
</view>
|
||||
<view class="list">
|
||||
{{tab_visit}}<text>次</text>
|
||||
<text>访问量</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<!--表单-->
|
||||
<view class="sign">
|
||||
<form>
|
||||
<view wx-if='{{user.tel == "" || user.tel == undefined || user.name == "" || user.name == undefined}}'>
|
||||
<view class="list" >
|
||||
<text>姓名</text>
|
||||
<input placeholder="请输入您的姓名" adjust-position="true" bindinput="setname" />
|
||||
</view>
|
||||
<view class="list">
|
||||
<text>手机号</text>
|
||||
<input placeholder="请输入您的联系电话" adjust-position="true" bindinput="settel" />
|
||||
</view>
|
||||
</view>
|
||||
<view class="list">
|
||||
<text>描述</text>
|
||||
<textarea placeholder="请介绍一下作品" maxlength="100" adjust-position="true" bindinput="setdesc" />
|
||||
</view>
|
||||
<view class="list">
|
||||
<text>上传作品</text>
|
||||
<view class="img">
|
||||
<image src='{{source}}'/>
|
||||
<view class="{{is_upload=='1'?'uploadopacity':''}} uploadimg" bindtap="uploadimg"></view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="list">
|
||||
<button bindtap="save">提交报名</button>
|
||||
</view>
|
||||
</form>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
|
@ -0,0 +1,102 @@
|
|||
/* pages/sign/sign.wxss */
|
||||
.page-body{
|
||||
height: 300rpx;
|
||||
position: relative;
|
||||
}
|
||||
.swiper-item image{
|
||||
width: 100%;
|
||||
height: 300rpx;
|
||||
}
|
||||
.dots{
|
||||
display: inline-block;
|
||||
position: absolute;
|
||||
bottom: 20rpx;
|
||||
right: 0;
|
||||
padding: 0 20rpx;
|
||||
}
|
||||
.dots .dot{
|
||||
width: 8rpx;
|
||||
height: 8rpx;
|
||||
background: #fff;
|
||||
float: left;
|
||||
margin:0 4rpx;
|
||||
border-radius: 50%;
|
||||
}
|
||||
.dots .dot.active{
|
||||
background: #2a8de9;
|
||||
}
|
||||
.sign{
|
||||
padding: 0 40rpx;
|
||||
width: 100%;
|
||||
}
|
||||
.sign .list{
|
||||
margin-top: 40rpx;
|
||||
width: 100%;
|
||||
}
|
||||
.sign .list text{
|
||||
font-size: 30rpx;
|
||||
}
|
||||
.sign .list input,.sign .list textarea{
|
||||
width: 610rpx;
|
||||
height: 70rpx;
|
||||
border: none;
|
||||
background-color: #eeeeee;
|
||||
border-radius: 5rpx;
|
||||
margin-top: 10rpx;
|
||||
padding: 0 20rpx;
|
||||
font-size: 26rpx;
|
||||
}
|
||||
.sign .list textarea{
|
||||
height: 173rpx;
|
||||
padding-top: 20rpx;
|
||||
}
|
||||
.sign .list button:not([size='mini']){
|
||||
width: 570rpx;
|
||||
border-radius: 8rpx;
|
||||
background-color: #2a8de9;
|
||||
color: #fff;
|
||||
font-size: 30rpx;
|
||||
height: 74rpx;
|
||||
}
|
||||
.sign .list .img{
|
||||
margin-top:20rpx;
|
||||
display: inline-block;
|
||||
width: 100%;
|
||||
position: relative;
|
||||
}
|
||||
.sign .list image{
|
||||
width: 160rpx;
|
||||
height: 160rpx;
|
||||
float: left;
|
||||
}
|
||||
.sign .list .uploadimg{
|
||||
width: 160rpx;
|
||||
height: 160rpx;
|
||||
border: 2rpx solid #cacaca;
|
||||
position: relative;
|
||||
}
|
||||
.uploadopacity{
|
||||
opacity:0
|
||||
}
|
||||
.sign .list .uploadimg::after{
|
||||
width: 112rpx;
|
||||
height: 6rpx;
|
||||
background: #cacaca;
|
||||
content: "";
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
margin-left: -56rpx;
|
||||
top: 50%;
|
||||
margin-top: -3rpx;
|
||||
}
|
||||
.sign .list .uploadimg::before{
|
||||
width: 6rpx;
|
||||
height: 112rpx;
|
||||
background: #cacaca;
|
||||
content: "";
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
margin-left: -3rpx;
|
||||
top: 50%;
|
||||
margin-top: -56rpx;
|
||||
}
|
||||
|
|
@ -0,0 +1,137 @@
|
|||
// pages/picture/picture.js
|
||||
var urlPath = require('../../config.js');
|
||||
Page({
|
||||
// 前往下一页
|
||||
picture() {
|
||||
wx.navigateTo({ url: '../picture/picture' });
|
||||
},
|
||||
again() {
|
||||
wx.navigateTo({ url: '../sign/sign' });
|
||||
},
|
||||
/**
|
||||
* 页面的初始数据
|
||||
*/
|
||||
data: {
|
||||
img_url:wx.getStorageSync('img_url'),
|
||||
swiperCurrent:0,
|
||||
autoplay: false,
|
||||
interval: 3000,
|
||||
duration: 800,
|
||||
//数据
|
||||
name: wx.getStorageSync('user').name,
|
||||
nm_number:"0",
|
||||
//列表
|
||||
works_list:[],
|
||||
},
|
||||
swiperChange: function (e) {
|
||||
// console.log(e);
|
||||
this.setData({
|
||||
swiperCurrent: e.detail.current
|
||||
})
|
||||
},
|
||||
|
||||
/**
|
||||
* 生命周期函数--监听页面加载
|
||||
*/
|
||||
onLoad: function (options) {
|
||||
var that = this;
|
||||
var user = wx.getStorageSync('user');
|
||||
console.log(user);
|
||||
that.getImgs();
|
||||
},
|
||||
//小于10的格式化函数（2变成02）
|
||||
timeFormat(param) {
|
||||
return param < 10 ? '0' + param : param;
|
||||
},
|
||||
//小于0的格式化函数（不会出现负数）
|
||||
timeFormin(param) {
|
||||
return param < 0 ? 0: param;
|
||||
},
|
||||
/**
|
||||
* 生命周期函数--监听页面初次渲染完成
|
||||
*/
|
||||
onReady: function () {
|
||||
|
||||
},
|
||||
|
||||
/**
|
||||
* 生命周期函数--监听页面显示
|
||||
*/
|
||||
onShow: function () {
|
||||
|
||||
},
|
||||
|
||||
/**
|
||||
* 生命周期函数--监听页面隐藏
|
||||
*/
|
||||
onHide: function () {
|
||||
|
||||
},
|
||||
|
||||
/**
|
||||
* 生命周期函数--监听页面卸载
|
||||
*/
|
||||
onUnload: function () {
|
||||
|
||||
},
|
||||
|
||||
/**
|
||||
* 页面相关事件处理函数--监听用户下拉动作
|
||||
*/
|
||||
onPullDownRefresh: function () {
|
||||
|
||||
},
|
||||
|
||||
/**
|
||||
* 页面上拉触底事件的处理函数
|
||||
*/
|
||||
onReachBottom: function () {
|
||||
|
||||
},
|
||||
|
||||
/**
|
||||
* 用户点击右上角分享
|
||||
*/
|
||||
onShareAppMessage: function () {
|
||||
|
||||
},
|
||||
onShow:function(){
|
||||
if (typeof this.getTabBar === 'function' && this.getTabBar()) {
|
||||
this.getTabBar().setData({
|
||||
selected: 3
|
||||
})
|
||||
}
|
||||
},
|
||||
getImgs:function(){
|
||||
var that = this;
|
||||
wx.request({
|
||||
url: urlPath.getImgs,
|
||||
header:{
|
||||
'token': wx.getStorageSync('token')
|
||||
},
|
||||
success(res){
|
||||
if(res.data.code == 0){
|
||||
if(res.data.data.length > 0){
|
||||
var works_list = [];
|
||||
var num = 0;
|
||||
res.data.data.forEach(function(item, index){
|
||||
works_list.push({
|
||||
ids: item.id,
|
||||
img: urlPath.host + item.pic,
|
||||
text: item.explain,
|
||||
number: item.votes,
|
||||
});
|
||||
num = num + item.votes;
|
||||
});
|
||||
that.setData({
|
||||
works_list: works_list,
|
||||
nm_number: num
|
||||
});
|
||||
}
|
||||
}else{
|
||||
console.log(res); //失败
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
})
|
||||
|
|
@ -0,0 +1,3 @@
|
|||
{
|
||||
"usingComponents": {}
|
||||
}
|
||||
|
|
@ -0,0 +1,51 @@
|
|||
<!--pages/personal/personal.wxml-->
|
||||
<view class="container">
|
||||
<view class="page-body">
|
||||
<view class="page-section page-section-spacing swiper">
|
||||
<swiper autoplay="true" interval="{{interval}}" duration="{{duration}}" circular="true"
|
||||
current="{{swiperCurrent}}" bindchange="swiperChange">
|
||||
<block wx:for="{{img_url}}" wx:key="index">
|
||||
<swiper-item>
|
||||
<view class="swiper-item">
|
||||
<image src="{{item}}"></image>
|
||||
</view>
|
||||
</swiper-item>
|
||||
</block>
|
||||
</swiper>
|
||||
</view>
|
||||
<view class="dots">
|
||||
<block wx:for="{{img_url}}" wx:key="unique">
|
||||
<view class="dot{{index == swiperCurrent ? ' active' : ''}}"></view>
|
||||
</block>
|
||||
</view>
|
||||
</view>
|
||||
<!--内容-->
|
||||
|
||||
<view class="view-bg top40">
|
||||
<view class="personal-name">
|
||||
{{name}} <text>{{nm_number}}票</text>
|
||||
</view>
|
||||
<!--作品列表-->
|
||||
<view class="works">
|
||||
<block wx:for="{{works_list}}" wx:key="index">
|
||||
<view class="list">
|
||||
<view class="img" bindtap='picture'>
|
||||
<view class="id">{{item.ids}}<text>号</text></view>
|
||||
<image mode="aspectFill" src="{{item.img}}"></image>
|
||||
</view>
|
||||
<view class="personal-right">
|
||||
<view class="text">
|
||||
简介：{{item.text}}
|
||||
</view>
|
||||
<view class="name">
|
||||
<text>{{item.number}}</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</block>
|
||||
<!--view class="upload">
|
||||
<button bindtap="again">继续上传</button>
|
||||
</view-->
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
|
@ -0,0 +1,137 @@
|
|||
/* pages/personal/personal.wxss */
|
||||
.container{
|
||||
padding-bottom: 120rpx;
|
||||
}
|
||||
.page-body{
|
||||
height: 300rpx;
|
||||
position: relative;
|
||||
}
|
||||
.swiper-item image{
|
||||
width: 100%;
|
||||
height: 300rpx;
|
||||
}
|
||||
.dots{
|
||||
display: inline-block;
|
||||
position: absolute;
|
||||
bottom: 20rpx;
|
||||
right: 0;
|
||||
padding: 0 20rpx;
|
||||
}
|
||||
.dots .dot{
|
||||
width: 8rpx;
|
||||
height: 8rpx;
|
||||
background: #fff;
|
||||
float: left;
|
||||
margin:0 4rpx;
|
||||
border-radius: 50%;
|
||||
}
|
||||
.dots .dot.active{
|
||||
background: #2a8de9;
|
||||
}
|
||||
/**/
|
||||
.personal-name{
|
||||
font-size: 40rpx;
|
||||
width: 100%;
|
||||
text-align: center;
|
||||
background-color: #2a8de9;
|
||||
color: #fff;
|
||||
padding: 30rpx 0;
|
||||
}
|
||||
.personal-name text{
|
||||
position: relative;
|
||||
margin-left: 10px;
|
||||
padding-left: 10px;
|
||||
font-size: 28rpx;
|
||||
}
|
||||
.personal-name text::after{
|
||||
position: absolute;
|
||||
width: 1px;
|
||||
height: 33rpx;
|
||||
content: '';
|
||||
left: 0;
|
||||
top: 50%;
|
||||
margin-top: -15rpx;
|
||||
background-color: #fff;
|
||||
}
|
||||
/**/
|
||||
.works{
|
||||
padding: 0 24rpx;
|
||||
}
|
||||
.works .list{
|
||||
width:100% ;
|
||||
float: left;
|
||||
display: inline-block;
|
||||
margin-top: 30rpx;
|
||||
padding: 0 30rpx;
|
||||
}
|
||||
.works .list .img{
|
||||
padding: 16rpx;
|
||||
width: 50%;
|
||||
position: relative;
|
||||
float: left;
|
||||
}
|
||||
.works .list .img image{
|
||||
width: 277rpx;
|
||||
height: 256rpx;
|
||||
}
|
||||
.works .list .img .id{
|
||||
width: 61rpx;
|
||||
height: 72rpx;
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 0;
|
||||
font-size: 24rpx;
|
||||
color: #fff;
|
||||
text-align: center;
|
||||
background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAD4AAABICAYAAACuukaYAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyVpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDYuMC1jMDAyIDc5LjE2NDQ2MCwgMjAyMC8wNS8xMi0xNjowNDoxNyAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIDIxLjIgKE1hY2ludG9zaCkiIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6NDU4RTM1RUFGNEJDMTFFQUExNzhEOURGMjAwQUZGODIiIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6NDU4RTM1RUJGNEJDMTFFQUExNzhEOURGMjAwQUZGODIiPiA8eG1wTU06RGVyaXZlZEZyb20gc3RSZWY6aW5zdGFuY2VJRD0ieG1wLmlpZDozOTQzREZGRkY0QkMxMUVBQTE3OEQ5REYyMDBBRkY4MiIgc3RSZWY6ZG9jdW1lbnRJRD0ieG1wLmRpZDozOTQzRTAwMEY0QkMxMUVBQTE3OEQ5REYyMDBBRkY4MiIvPiA8L3JkZjpEZXNjcmlwdGlvbj4gPC9yZGY6UkRGPiA8L3g6eG1wbWV0YT4gPD94cGFja2V0IGVuZD0iciI/Pk9y1JQAAAE+SURBVHja7NbPSgJRGIbxo3gRs9Ab6AoKu4y6Bvd5HUI3kraIoFZFaiC0kTZBq2iRC3ERYpD/3gNfMIvAZpo5jvgceHChjPP7zjAzpYPW6Ng59+D2a3XLbk8XcODAgQMHDhw4cODAgQMHDhw4cODAgQMHDhw4cODAgQMHDhw4cODAgQMHDhw4cODAgQMHDhw4cODAgQMHDhw4cOB5rm91qxoqUnV1rt5DnkQl0P/M1I1qqys1iX03Un11po7UqTpR1V2Ff6prdWGf0w2/X9kAfoZwGBtCrejwse1o2y7nr5TH8UN4tJp5DCEL+Ie6tJ29U/OMh5nLENLC32xXfT21DHSvyGwISeAvMeyTncQ217+GsAk+tEvYY58L/FhOPITKLwcYqI6BX3fw3eRPQ/Dwhbo3aCf0i8SWhhCtBRgA0ghNoQEzJioAAAAASUVORK5CYII=) no-repeat top center;
|
||||
background-size:61rpx 72rpx ;
|
||||
}
|
||||
.works .list .img .id text{
|
||||
display: block;
|
||||
margin-top: -5rpx;
|
||||
}
|
||||
.personal-right{
|
||||
float: left;
|
||||
width: 50%;
|
||||
padding: 16rpx 0 0 20rpx;
|
||||
}
|
||||
.personal-right .text{
|
||||
font-size: 28rpx;
|
||||
display: -webkit-box;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
word-wrap: break-word;
|
||||
white-space: normal !important;
|
||||
-webkit-line-clamp: 2;
|
||||
-webkit-box-orient: vertical;
|
||||
color: #8c8c8c;
|
||||
}
|
||||
.personal-right .name{
|
||||
padding: 20rpx 0;
|
||||
font-size: 30rpx;
|
||||
color: #ff1a1a;
|
||||
margin-bottom: 30rpx;
|
||||
}
|
||||
.personal-right .add{
|
||||
width: 100%;
|
||||
height: 58rpx;
|
||||
line-height: 58rpx;
|
||||
background:#ffc103;
|
||||
padding: 0;
|
||||
border-radius: 0;
|
||||
color: #fff;
|
||||
font-size: 30rpx;
|
||||
}
|
||||
.upload{
|
||||
width: 100%;
|
||||
margin-top: 60rpx;
|
||||
display: inline-block;
|
||||
}
|
||||
.upload button:not([size='mini']){
|
||||
width: 570rpx;
|
||||
border-radius: 8rpx;
|
||||
background-color: #2a8de9;
|
||||
color: #fff;
|
||||
font-size: 30rpx;
|
||||
height: 74rpx;
|
||||
}
|
||||
|
|
@ -0,0 +1,68 @@
|
|||
{
|
||||
"description": "项目配置文件",
|
||||
"packOptions": {
|
||||
"ignore": []
|
||||
},
|
||||
"setting": {
|
||||
"urlCheck": true,
|
||||
"es6": false,
|
||||
"enhance": true,
|
||||
"postcss": true,
|
||||
"preloadBackgroundData": false,
|
||||
"minified": true,
|
||||
"newFeature": false,
|
||||
"coverView": true,
|
||||
"nodeModules": false,
|
||||
"autoAudits": false,
|
||||
"showShadowRootInWxmlPanel": true,
|
||||
"scopeDataCheck": false,
|
||||
"uglifyFileName": false,
|
||||
"checkInvalidKey": true,
|
||||
"checkSiteMap": true,
|
||||
"uploadWithSourceMap": true,
|
||||
"compileHotReLoad": false,
|
||||
"lazyloadPlaceholderEnable": false,
|
||||
"useMultiFrameRuntime": true,
|
||||
"useApiHook": true,
|
||||
"useApiHostProcess": true,
|
||||
"babelSetting": {
|
||||
"ignore": [],
|
||||
"disablePlugins": [],
|
||||
"outputPath": ""
|
||||
},
|
||||
"useIsolateContext": true,
|
||||
"userConfirmedBundleSwitch": false,
|
||||
"packNpmManually": false,
|
||||
"packNpmRelationList": [],
|
||||
"minifyWXSS": true,
|
||||
"disableUseStrict": false,
|
||||
"minifyWXML": true,
|
||||
"showES6CompileOption": false,
|
||||
"useCompilerPlugins": false
|
||||
},
|
||||
"compileType": "miniprogram",
|
||||
"libVersion": "2.13.0",
|
||||
"appid": "wx11006256adcf321f",
|
||||
"projectname": "DG-vote",
|
||||
"debugOptions": {
|
||||
"hidedInDevtools": []
|
||||
},
|
||||
"isGameTourist": false,
|
||||
"simulatorType": "wechat",
|
||||
"simulatorPluginLibVersion": {},
|
||||
"condition": {
|
||||
"search": {
|
||||
"list": []
|
||||
},
|
||||
"conversation": {
|
||||
"list": []
|
||||
},
|
||||
"game": {
|
||||
"currentL": -1,
|
||||
"list": []
|
||||
},
|
||||
"miniprogram": {
|
||||
"list": []
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1,7 @@
|
|||
{
|
||||
"desc": "关于本文件的更多信息，请参考文档 https://developers.weixin.qq.com/miniprogram/dev/framework/sitemap.html",
|
||||
"rules": [{
|
||||
"action": "allow",
|
||||
"page": "*"
|
||||
}]
|
||||
}
|
||||
|
|
@ -0,0 +1,19 @@
|
|||
const formatTime = date => {
|
||||
const year = date.getFullYear()
|
||||
const month = date.getMonth() + 1
|
||||
const day = date.getDate()
|
||||
const hour = date.getHours()
|
||||
const minute = date.getMinutes()
|
||||
const second = date.getSeconds()
|
||||
|
||||
return [year, month, day].map(formatNumber).join('/') + ' ' + [hour, minute, second].map(formatNumber).join(':')
|
||||
}
|
||||
|
||||
const formatNumber = n => {
|
||||
n = n.toString()
|
||||
return n[1] ? n : '0' + n
|
||||
}
|
||||
|
||||
module.exports = {
|
||||
formatTime: formatTime
|
||||
}
|
||||
Loading…
Reference in New Issue