diff --git a/img/close-icon.png b/img/close-icon.png
index 810fab7..f6da4ab 100644
Binary files a/img/close-icon.png and b/img/close-icon.png differ
diff --git a/img/download-icon.png b/img/download-icon.png
index a44c10b..e2b1c70 100644
Binary files a/img/download-icon.png and b/img/download-icon.png differ
diff --git a/img/next-icon.png b/img/next-icon.png
new file mode 100644
index 0000000..398b4ba
Binary files /dev/null and b/img/next-icon.png differ
diff --git a/img/share-icon.png b/img/share-icon.png
index 582c109..303010d 100644
Binary files a/img/share-icon.png and b/img/share-icon.png differ
diff --git a/img/share-lisit-icon.png b/img/share-lisit-icon.png
new file mode 100644
index 0000000..383430b
Binary files /dev/null and b/img/share-lisit-icon.png differ
diff --git a/img/zoom-icon.png b/img/zoom-icon.png
index 9a503f8..f8c2a31 100644
Binary files a/img/zoom-icon.png and b/img/zoom-icon.png differ
diff --git a/pages/canvasposter/canvasposter.js b/pages/canvasposter/canvasposter.js
index 94e5171..6b69ff8 100644
--- a/pages/canvasposter/canvasposter.js
+++ b/pages/canvasposter/canvasposter.js
@@ -33,7 +33,45 @@ Page({
closeTime: null,
titleVal:'',
showTitle:false,
- times:0
+ times:0,
+ haveData:true,
+ worksImg:false,
+ creat_close:true,
+ currentIndex:0,
+ worksBox:false
+ },
+ // 下一个
+ nextEv(){
+ if(this.data.allList.length-5 >= this.data.currentIndex) {
+ this.setData({
+ currentIndex:this.data.currentIndex + 1
+ })
+ }
+ },
+ // 上一个
+ preEv(){
+ if(this.data.currentIndex!=0) {
+ this.setData({
+ currentIndex:this.data.currentIndex - 1
+ })
+ }
+ },
+ changeCurrent(e){
+ this.setData({
+ currentIndex:e.detail.current
+ })
+ },
+ // 创建作品按钮
+ creatWorks(){
+ this.setData({
+ funBox:false,
+ worksBox:true,
+ creat_close:false
+ })
+ },
+ // 收起创作
+ closeWorks(){
+ this.setData({funBox:true,worksBox:false,creat_close:true})
},
chooseTitle(e) {
let that = this;
@@ -44,7 +82,9 @@ Page({
}
this.setData({
titleIndex: e.currentTarget.dataset.index,
- showBtn: true
+ showBtn: true,
+ worksImg:true,
+ currentIndex:0
})
this.getBottleWidgets(that.data.titlelist[that.data.titleIndex].id);
},
@@ -101,6 +141,7 @@ Page({
* 生命周期函数--监听页面加载
*/
onLoad: function(options) {
+ let that = this;
items = this.data.itemList;
wx.getSystemInfo({ // 获取系统信息
success: sysData => {
@@ -115,10 +156,6 @@ Page({
})
}
})
- this.setBackGroundImg({
- url: '../../img/background/1.png'
- });
- this.getBottleCategories();
// 换取token
wx.login({
success: res => {
@@ -127,11 +164,13 @@ Page({
method: 'post',
data: {code: res.code},
success(res) {
- console.log(res);
if (res.data.code == 0) {
wx.setStorageSync('token', res.data.data.token);
wx.setStorageSync('username', res.data.data.user.wx_name);
- console.log(wx.getStorageSync('username'));
+ that.setBackGroundImg({
+ url: '../../img/background/1.png'
+ });
+ that.getBottleCategories();
}
}
});
@@ -223,7 +262,6 @@ Page({
data.rotate = 1; // 旋转角度
data.active = false; // 选中状态
data.angle = 0;
- console.log(data, 123);
items[items.length] = data; // 每增加一张图片数据增加一条信息
this.setData({
itemList: items
@@ -249,10 +287,25 @@ Page({
items[index].lx = e.touches[0].clientX;
items[index].ly = e.touches[0].clientY;
}
- this.setData({
- showBox: false,
- funBox: false
- })
+ if(this.data.funBox){
+ if(!this.data.worksBox) {
+ this.setData({
+ funBox: false,
+ creat_close:true
+ })
+ } else {
+ this.setData({
+ funBox: false,
+ })
+ }
+ } else {
+ if(!this.data.creat_close){
+ this.setData({
+ worksBox:false,
+ creat_close:false
+ })
+ }
+ }
},
// 拖动图片
WraptouchMove(e) {
@@ -267,23 +320,29 @@ Page({
items[index].lx = e.touches[0].clientX;
items[index].ly = e.touches[0].clientY;
-
this.setData({
itemList: items,
showBtn: true,
- funBox: false
+ worksBox:false
})
+ this.showWorksBtn();
}
},
// 放开图片
WraptouchEnd() {
this.synthesis(); // 调用合成图方法
+ this.showWorksBtn();
+ },
+ // 显示创作按钮
+ showWorksBtn(){
clearTimeout(this.data.closeTime);
this.data.closeTime = setTimeout(() => {
- this.setData({
- showBtn: false,
- funBox: true
- })
+ this.setData({showBtn: false})
+ if(this.data.creat_close){
+ this.setData({funBox:true})
+ } else {
+ this.setData({worksBox:true})
+ }
}, 1000)
},
// 点击伸缩图标
@@ -309,27 +368,23 @@ Page({
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].disPtoO = this.getDistancs(items[index].x, items[index].y, items[index]._tx, items[index]._ty - 10)
+ console.log(items[index].disPtoO);
+ if(items[index].disPtoO > 80 && items[index].disPtoO <200 ){//设置贴图最小值和最大值
+ 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].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)
-
+ items[index].anglePre = this.countDeg(items[index].x, items[index].y, items[index].tx, items[index].ty)
//赋值setData渲染
this.setData({
itemList: items
@@ -392,10 +447,8 @@ Page({
openMask() {
if (wx.getStorageSync('username')!='' && wx.getStorageSync('username')!=undefined ) {
this.synthesis();
- this.setData({
- showCanvas: true,
- showTitle:true
- })
+ // this.setData({showCanvas: true,showTitle:true})
+ this.setData({showCanvas: true})
} else {
this.setData({
isLogin: true
@@ -414,7 +467,7 @@ Page({
}
})
},
- synthesis() { // 合成图片
+ synthesis(whereIndex=0) { // 合成图片
maskCanvas.save();
maskCanvas.beginPath();
// 画背景色(白色)
@@ -440,6 +493,40 @@ Page({
this.setData({
canvasTemImg: res.tempFilePath
})
+ if(whereIndex==1){
+ wx.showToast({title:'正在调起分享',duration:5000})
+ console.log(this.data.canvasTemImg);
+ wx.uploadFile({
+ url: urlPath.composeBottle,
+ filePath: this.data.canvasTemImg,
+ name: 'image',
+ formData: {
+ 'name': this.data.titleVal
+ },
+ header: {
+ "Content-Type": "multipart/form-data",
+ 'Content-Type': 'application/json',
+ 'token': wx.getStorageSync('token')
+ },
+ success: (res)=> {
+ let newRes = JSON.parse(res.data);
+ if(newRes.code==0){
+ wx.downloadFile({
+ url: 'https://fenggu.scdxtc.cn' + newRes.data.src,
+ success: (res) => {
+ wx.showShareImageMenu({
+ path: res.tempFilePath,
+ success:(res)=>{}
+ })
+ }
+ })
+ }
+ },
+ fail: function(data) {
+ console.log(data);
+ }
+ })
+ }
}
}, this);
})
@@ -514,16 +601,20 @@ Page({
}
})
},
+ // 首页左下角分享
+ homeShare(){
+ this.synthesis(1);
+ },
// 分享图片
- shareImg() {
+ shareImg(e) {
+ let newIndex = e.currentTarget.dataset.index;
if(this.data.times==0){
- wx.showToast({
- title:'正在调起分享',
- duration:5000
- })
this.setData({
times:this.data.times++
})
+ if(newIndex==0){
+ wx.showToast({title:'正在调起分享',duration:5000})
+ }
wx.uploadFile({
url: urlPath.composeBottle,
filePath: this.data.canvasTemImg,
@@ -539,17 +630,20 @@ Page({
success: (res)=> {
let newRes = JSON.parse(res.data);
if(newRes.code==0){
- wx.downloadFile({
- url: 'https://fenggu.scdxtc.cn' + newRes.data.src,
- success: (res) => {
- wx.showShareImageMenu({
- path: res.tempFilePath,
- success:(res)=>{
- this.shareEv(newRes.data.id);
- }
- })
- }
- })
+ if(newIndex==0){
+ console.log(newIndex);
+ wx.downloadFile({
+ url: 'https://fenggu.scdxtc.cn' + newRes.data.src,
+ success: (res) => {
+ wx.showShareImageMenu({
+ path: res.tempFilePath,
+ success:(res)=>{}
+ })
+ }
+ })
+ } else {
+ this.shareEv(newRes.data.id);
+ }
}
},
fail: function(data) {
@@ -567,7 +661,10 @@ Page({
method: 'post',
success: (res) => {
if (res.data.code == 0) {
- wx.showToast({title: '分享作品成功'})
+ wx.showToast({title: '参加活动成功'});
+ this.setData({
+ showCanvas:false
+ })
}
}
});
@@ -636,6 +733,7 @@ Page({
}
})
},
+ // 获取标题
getBottleCategories() {
wx.request({
url: urlPath.getBottleCategories,
@@ -645,11 +743,13 @@ Page({
this.setData({
titlelist: res.data.data
})
+ this.getBottleWidgets(res.data.data[0].id);
}
}
}
});
},
+ // 获取标题下的图片
getBottleWidgets(id) {
wx.request({
url: urlPath.getBottleWidgets,
@@ -661,6 +761,9 @@ Page({
success: (res) => {
if (res.data.code == 0) {
if (res.data.data.length) {
+ this.setData({
+ haveData: true
+ })
let newArr = [];
res.data.data.forEach(item => {
let url = 'https://fenggu.scdxtc.cn' + item.img;
@@ -668,21 +771,21 @@ Page({
let obj = {
id: item.id,
name: item.name,
- img: 'https://fenggu.scdxtc.cn' + item.img
+ img: 'https://fenggu.scdxtc.cn' + item.img,
+ img_thumb:'https://fenggu.scdxtc.cn' + item.img_thumb,
}
newArr.push(obj)
})
this.setData({
allList: newArr,
- showBox: true
})
} else {
- wx.showToast({
- title:'无内容',
- icon:'none'
- })
+ // wx.showToast({
+ // title:'无内容',
+ // icon:'none'
+ // })
this.setData({
- showBox: false
+ haveData: false
})
}
@@ -690,6 +793,7 @@ Page({
}
});
},
+ // 查看我的作品
checkWorkEv() {
wx.navigateTo({
url: '/pages/works/works'
diff --git a/pages/canvasposter/canvasposter.wxml b/pages/canvasposter/canvasposter.wxml
index 5f36384..2c4b079 100644
--- a/pages/canvasposter/canvasposter.wxml
+++ b/pages/canvasposter/canvasposter.wxml
@@ -20,46 +20,85 @@
-
+
+
-
-
+
+
+
+
-
+
+
+创建作品
-
-
-
+
+ 作品
+ 规则
+
+
+
+
+
+
-我的作品
-
-
-
-
- {{item.name}}
+
+ 收起创作
+
+
+
+
+ {{item.name}}
+
+
+
+
+
+
+
+
+
+
+
+
+
+ 无内容
+
+
+
-
-
-
-
-
-
-
-
+
+
+
+
diff --git a/pages/canvasposter/canvasposter.wxss b/pages/canvasposter/canvasposter.wxss
index 8836d3b..0a88490 100644
--- a/pages/canvasposter/canvasposter.wxss
+++ b/pages/canvasposter/canvasposter.wxss
@@ -77,7 +77,7 @@
.operation-buttons {
position: absolute;
- bottom: 220rpx;
+ bottom: 110rpx;
right: 15rpx;
display: flex;
flex-direction: column;
@@ -85,10 +85,11 @@
transition: all .5s ease-in-out;
}
+.operation-buttons view {
+ width: 51px;height: 51px;background-color: #2a7be9;border-radius: 50%;color: #fff;display: flex;justify-content: center;align-items: center;margin-top: 40rpx;
+}
.operation-buttons image {
- width: 74rpx;
- height: 80rpx;
- margin-top: 20rpx;
+ width: 27px;height: 25px;margin-top: 0px;
}
.closeSave {
transform: scale(0);
@@ -103,7 +104,13 @@
z-index: 999;
text-align: center;
}
-
+.close-effect {
+ width: 50rpx;
+ height: 50rpx;
+ position: absolute;
+ top: 25rpx;
+ left: 50rpx;
+}
.maskCanvas {
position: absolute;
left: -200%;
@@ -147,7 +154,8 @@
/* 点击下载按钮时的图片样式 */
.resImg {
width: 80%;
- margin-top: 20rpx;
+ height: 80%;
+ margin-top: 50rpx;
}
/* 特效样式 */
@@ -187,37 +195,64 @@
padding: 20rpx;
transition: all .5s ease-in-out;
}
-
+scroll-view {
+ position: relative;
+}
.showBox {
bottom: 88rpx;
}
-
.scrollView {
display: flex;
+ align-items: center;
}
-
+.arrowBtn {
+ position: absolute;
+ z-index: 2;
+ width: 70rpx!important;
+ height: 70rpx!important;
+}
+.pre {
+ left: 0;
+ top: 50%;
+ transform: translateY(-50%);
+}
+.next {
+ top: 50%;
+ right: 0;
+}
+swiper {
+ padding-bottom: 20rpx;
+}
+.creat-works-btn {position: fixed;bottom: 110rpx;left: 77px;right: 77px; height: 51px;line-height: 51px;text-align: center;color: #fff;background-color: #287be9;border-radius: 51px;z-index: 101;box-sizing: border-box;font-weight: bold;}
+.works-box {position: fixed;bottom: 110rpx;z-index: 101;}
+.works-boxAc {bottom: 86rpx;}
+.close-works-btn {background-color: #2a7be9;color: #fff;border-radius: 20px 20px 0 0;padding: 50rpx 20rpx 30rpx 20rpx;display: inline-block;}
+.works-content {background-color: #2a7be9;}
.title-box view {
- background-color: rgba(0, 0, 0, 1);
+ background-color: rgba(42, 123, 233, 1);
display: inline-block;
- padding: 15rpx 30rpx;
+ padding: 20rpx 40rpx;
border-radius: 10rpx;
- margin-bottom: 20rpx;
- margin-right: 20rpx;
+ margin-bottom: 10rpx;
+ /* margin-right: 20rpx; */
+ margin-top: 10rpx;
flex-shrink: 0;
color: #fff;
+ margin-left: 10rpx;
}
.title-box .titleActive {
color: #000;
background-color: rgba(255, 255, 255, 1);
- box-shadow: 0rpx 0rpx 20rpx rgba(255, 255, 255, .5);
+ border-radius: 50rpx;
+}
+.img-box {
+ width: 25%!important;
}
-
.img-box view {
- width: 25%;
+ width: 96%;
height: 320rpx;
flex-shrink: 0;
- margin-right: 20rpx;
background-color: rgba(0,0,0,.8);
display: flex;
align-items: center;
@@ -232,7 +267,6 @@
height: 320rpx;
object-fit: contain;
}
-
.img-box .allActive {
transform: scale(.9);
border: 4rpx dashed rgba(255, 255, 255, .4);
@@ -243,7 +277,7 @@
position: fixed;
right: 20rpx;
top: 20rpx;
- z-index: 10000;
+ z-index: 998;
background-color: rgba(0,0,0,.3);
color: #fff;
font-size: 28rpx;
diff --git a/pages/index/index.wxml b/pages/index/index.wxml
index 78b4d37..421b93b 100644
--- a/pages/index/index.wxml
+++ b/pages/index/index.wxml
@@ -57,15 +57,11 @@
{{item.ids}}号
-
- 简介:{{item.text}}
+ 简介:{{item.text}}
+
+ {{item.name}} {{item.number}}
-
- {{item.name}} {{item.number}}
-
-
+
diff --git a/pages/index/index.wxss b/pages/index/index.wxss
index 1a0608b..6a50b8f 100644
--- a/pages/index/index.wxss
+++ b/pages/index/index.wxss
@@ -133,4 +133,6 @@
padding-right: 80rpx;
padding-left: 30rpx;
font-size: 24rpx;
-}
\ No newline at end of file
+}
+
+.clips1{display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp: 1;overflow: hidden;text-overflow: ellipsis;word-wrap: break-word;word-break:break-all;}
\ No newline at end of file
diff --git a/pages/ranking/ranking.js b/pages/ranking/ranking.js
index ea6d2ea..1975650 100644
--- a/pages/ranking/ranking.js
+++ b/pages/ranking/ranking.js
@@ -85,7 +85,6 @@ Page({
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,
diff --git a/pages/rule/rule.wxml b/pages/rule/rule.wxml
index 470d7e3..fe820e7 100644
--- a/pages/rule/rule.wxml
+++ b/pages/rule/rule.wxml
@@ -4,7 +4,7 @@
-
+
diff --git a/pages/works/works.js b/pages/works/works.js
index b72e527..78c8123 100644
--- a/pages/works/works.js
+++ b/pages/works/works.js
@@ -48,6 +48,7 @@ Page({
name: item.name,
id: item.id,
imgSrc: 'https://fenggu.scdxtc.cn' + item.release_img,
+ img_thumb: 'https://fenggu.scdxtc.cn' + item.img_thumb,
userId: item.user_id,
time: item.create_time,
isShare: item.production_id //0未分享
@@ -82,7 +83,9 @@ Page({
wx.showShareImageMenu({
path: res.tempFilePath,
success:(res)=>{
- this.shareImg(e.currentTarget.dataset.id,e.currentTarget.dataset.index);
+ this.setData({
+ times:0
+ })
},
fail:(err)=>{
console.log(err);
@@ -92,11 +95,12 @@ Page({
})
}
},
- shareImg(id,index){
+ // 立即参与活动
+ partEv(e){
wx.request({
url: urlPath.publishMyBottle,
data: {
- id: id
+ id: e.currentTarget.dataset.id
},
header: {
'token': wx.getStorageSync('token')
@@ -104,17 +108,30 @@ Page({
method: 'post',
success: (res) => {
if (res.data.code == 0) {
- this.data.imgArr[index].isShare=1;
+ this.data.imgArr[e.currentTarget.dataset.index].isShare=1;
this.setData({
imgArr:this.data.imgArr
})
wx.showToast({
- title: '分享作品成功'
+ title: '参加活动成功'
})
}
}
});
},
+ // 预览图片
+ preImg(e){
+ let newIndex = e.currentTarget.dataset.index;
+ let newImg = [];
+ this.data.imgArr.forEach(item=>{
+ newImg.push(item.imgSrc);
+ })
+ wx.previewImage({
+ current:this.data.imgArr[newIndex].imgSrc,
+ urls:newImg,
+ success: () => {}
+ })
+ },
/**
* 生命周期函数--监听页面初次渲染完成
*/
diff --git a/pages/works/works.wxml b/pages/works/works.wxml
index a79f67c..6236bae 100644
--- a/pages/works/works.wxml
+++ b/pages/works/works.wxml
@@ -6,11 +6,13 @@
-
- {{item.name}}
+
+
{{item.time}}
-
+
+ 正在参与活动
+ 参与活动
diff --git a/pages/works/works.wxss b/pages/works/works.wxss
index 3246da4..f8359c8 100644
--- a/pages/works/works.wxss
+++ b/pages/works/works.wxss
@@ -64,6 +64,12 @@ page {
font-size: 24rpx;
color: #999;
text-align: left;
- padding: 0 20rpx 10rpx 20rpx;
+ padding: 20rpx;
+}
+.activeIng {
+ width: auto;height: auto;padding: 6rpx 10rpx;color: #2a7be9; font-size: 24rpx;
+}
+.activeBtn {
+ background-color: #2a7be9; width: 100%;height: auto;padding: 20rpx; text-align: center; color: #fff; font-size: 28rpx;
}
.clips2{display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp: 2;overflow: hidden;text-overflow: ellipsis;word-wrap: break-word;word-break:break-all;}
\ No newline at end of file