|
@@ -6,16 +6,18 @@
|
|
|
</div>
|
|
</div>
|
|
|
<div class="wrap" ref="wrap">
|
|
<div class="wrap" ref="wrap">
|
|
|
<div class="start-page">
|
|
<div class="start-page">
|
|
|
- <div class="headers" >
|
|
|
|
|
|
|
+ <div class="headers">
|
|
|
<img src="../../../assets/images/ningdongyunying/puzzle/抬头1.png" />
|
|
<img src="../../../assets/images/ningdongyunying/puzzle/抬头1.png" />
|
|
|
- <div class="headers-left">{{complete_num}}</div>
|
|
|
|
|
- <div class="headers-right">{{no_complete_num}}</div>
|
|
|
|
|
|
|
+ <div class="headers-left">{{ complete_num }}</div>
|
|
|
|
|
+ <div class="headers-right">{{ no_complete_num }}</div>
|
|
|
<div class="header-content">
|
|
<div class="header-content">
|
|
|
<div
|
|
<div
|
|
|
style="width: 100px; height: 100px"
|
|
style="width: 100px; height: 100px"
|
|
|
ref="hygrometer"
|
|
ref="hygrometer"
|
|
|
id="hygrometer"
|
|
id="hygrometer"
|
|
|
- >{{jindu}}</div>
|
|
|
|
|
|
|
+ >
|
|
|
|
|
+ {{ jindu }}
|
|
|
|
|
+ </div>
|
|
|
</div>
|
|
</div>
|
|
|
</div>
|
|
</div>
|
|
|
<div class="album-list">
|
|
<div class="album-list">
|
|
@@ -27,20 +29,27 @@
|
|
|
@click="getItem(index, item.id)"
|
|
@click="getItem(index, item.id)"
|
|
|
>
|
|
>
|
|
|
<div class="img-wrap-imgs">
|
|
<div class="img-wrap-imgs">
|
|
|
- <img src="../../../assets/images/ningdongyunying/puzzle/未按.png" v-if="imgshow==item.complete_status" />
|
|
|
|
|
- <img :src="item.picture" alt="" v-else />
|
|
|
|
|
- <p v-if="pshow==item.complete_status">用时:{{item.completion_time}}s</p>
|
|
|
|
|
|
|
+ <img
|
|
|
|
|
+ src="../../../assets/images/ningdongyunying/puzzle/未按.png"
|
|
|
|
|
+ v-if="imgshow == item.complete_status"
|
|
|
|
|
+ />
|
|
|
|
|
+ <img :src="item.picture" alt="" v-else />
|
|
|
|
|
+ <p v-if="pshow == item.complete_status">
|
|
|
|
|
+ 用时:{{ item.completion_time }}s
|
|
|
|
|
+ </p>
|
|
|
</div>
|
|
</div>
|
|
|
<!-- <button @click="startGame(index)">开始</button> -->
|
|
<!-- <button @click="startGame(index)">开始</button> -->
|
|
|
<div class="contents-list-item-button" @click="startGame(index)">
|
|
<div class="contents-list-item-button" @click="startGame(index)">
|
|
|
<img
|
|
<img
|
|
|
- src="../../../assets/images/ningdongyunying/puzzle/灰按钮.png" v-if="imgshow==item.complete_status"
|
|
|
|
|
|
|
+ src="../../../assets/images/ningdongyunying/puzzle/灰按钮.png"
|
|
|
|
|
+ v-if="imgshow == item.complete_status"
|
|
|
/>
|
|
/>
|
|
|
<img
|
|
<img
|
|
|
- src="../../../assets/images/ningdongyunying/puzzle/黄按钮.png" v-else
|
|
|
|
|
|
|
+ src="../../../assets/images/ningdongyunying/puzzle/黄按钮.png"
|
|
|
|
|
+ v-else
|
|
|
/>
|
|
/>
|
|
|
- <p v-if="imgshow==item.complete_status">未解锁</p>
|
|
|
|
|
- <p v-else>{{item.name}}</p>
|
|
|
|
|
|
|
+ <p v-if="imgshow == item.complete_status">未解锁</p>
|
|
|
|
|
+ <p v-else>{{ item.name }}</p>
|
|
|
</div>
|
|
</div>
|
|
|
</div>
|
|
</div>
|
|
|
<!-- <div class="img-wrap" v-if="!uploadimg">
|
|
<!-- <div class="img-wrap" v-if="!uploadimg">
|
|
@@ -91,7 +100,8 @@
|
|
|
>s
|
|
>s
|
|
|
</div>
|
|
</div>
|
|
|
<!-- <div class="btn" @click="generateImg">生成战绩海报</div> -->
|
|
<!-- <div class="btn" @click="generateImg">生成战绩海报</div> -->
|
|
|
- <div class="btn" @click="onceAgain()">再来一次</div>
|
|
|
|
|
|
|
+ <!-- <div class="btn" @click="onceAgain()">再来一次</div> -->
|
|
|
|
|
+ <div class="btn" @click="onceAgain()">前往项目详情</div>
|
|
|
<div class="btn" @click="upresult(infos_id)">上传成绩</div>
|
|
<div class="btn" @click="upresult(infos_id)">上传成绩</div>
|
|
|
</div>
|
|
</div>
|
|
|
|
|
|
|
@@ -116,7 +126,7 @@ export default {
|
|
|
},
|
|
},
|
|
|
data() {
|
|
data() {
|
|
|
return {
|
|
return {
|
|
|
- token:"",
|
|
|
|
|
|
|
+ token: "",
|
|
|
// token: sessionStorage.getItem("mytoken")
|
|
// token: sessionStorage.getItem("mytoken")
|
|
|
// ? sessionStorage.getItem("mytoken")
|
|
// ? sessionStorage.getItem("mytoken")
|
|
|
// : "", //token值保存在本地，有的话取值，没有为空
|
|
// : "", //token值保存在本地，有的话取值，没有为空
|
|
@@ -145,15 +155,15 @@ export default {
|
|
|
canvasUrl: "",
|
|
canvasUrl: "",
|
|
|
isVisible: false,
|
|
isVisible: false,
|
|
|
shows: false,
|
|
shows: false,
|
|
|
- infos_id: 0,//图片id
|
|
|
|
|
- pshow:1,//是否显示p标签
|
|
|
|
|
- imgshow:null,//是否显示img
|
|
|
|
|
|
|
+ infos_id: 0, //图片id
|
|
|
|
|
+ pshow: 1, //是否显示p标签
|
|
|
|
|
+ imgshow: null, //是否显示img
|
|
|
jindu: sessionStorage.getItem("mjindu")
|
|
jindu: sessionStorage.getItem("mjindu")
|
|
|
? sessionStorage.getItem("myjindu")
|
|
? sessionStorage.getItem("myjindu")
|
|
|
: 0, //token值保存在本地，有的话取值，没有为空
|
|
: 0, //token值保存在本地，有的话取值，没有为空
|
|
|
- complete_num:0,//已完成
|
|
|
|
|
- no_complete_num:0,//未完成
|
|
|
|
|
- jindus:0
|
|
|
|
|
|
|
+ complete_num: 0, //已完成
|
|
|
|
|
+ no_complete_num: 0, //未完成
|
|
|
|
|
+ jindus: 0,
|
|
|
};
|
|
};
|
|
|
},
|
|
},
|
|
|
methods: {
|
|
methods: {
|
|
@@ -284,13 +294,26 @@ export default {
|
|
|
this.resetTime();
|
|
this.resetTime();
|
|
|
},
|
|
},
|
|
|
onceAgain() {
|
|
onceAgain() {
|
|
|
- this.shuffle(document.querySelectorAll(".piece"), this.pool);
|
|
|
|
|
- this.startDx = -100;
|
|
|
|
|
- this.transformX(this.$refs.wrap, this.startDx + "vw");
|
|
|
|
|
- this.resetTime();
|
|
|
|
|
- this.dealtime = 180;
|
|
|
|
|
- this.timer = setInterval(this.timeStart, 1000);
|
|
|
|
|
- // this.$refs.child.initTime();
|
|
|
|
|
|
|
+ // this.shuffle(document.querySelectorAll(".piece"), this.pool);
|
|
|
|
|
+ // this.startDx = -100;
|
|
|
|
|
+ // this.transformX(this.$refs.wrap, this.startDx + "vw");
|
|
|
|
|
+ // this.resetTime();
|
|
|
|
|
+ // this.dealtime = 180;
|
|
|
|
|
+ // this.timer = setInterval(this.timeStart, 1000);
|
|
|
|
|
+
|
|
|
|
|
+ // this.$refs.child.initTime();
|
|
|
|
|
+
|
|
|
|
|
+ // 待触发 `UniAppJSBridgeReady` 事件后，即可调用 uni 的 API。
|
|
|
|
|
+ // 待触发 `UniAppJSBridgeReady` 事件后，即可调用 uni 的 API。
|
|
|
|
|
+ document.addEventListener("UniAppJSBridgeReady", function () {
|
|
|
|
|
+ uni.getEnv(function (res) {
|
|
|
|
|
+ console.log("当前环境：" + JSON.stringify(res));
|
|
|
|
|
+ });
|
|
|
|
|
+
|
|
|
|
|
+ uni.navigateTo({
|
|
|
|
|
+ url: "../../../../index/record/record?mine_code=ningdongyunying&pageId=156c601a10be43bc8f32e83f0664821b",
|
|
|
|
|
+ });
|
|
|
|
|
+ });
|
|
|
},
|
|
},
|
|
|
reStart() {
|
|
reStart() {
|
|
|
this.startDx = this.startDx + 300;
|
|
this.startDx = this.startDx + 300;
|
|
@@ -516,26 +539,31 @@ export default {
|
|
|
//上传成绩
|
|
//上传成绩
|
|
|
upresult(id) {
|
|
upresult(id) {
|
|
|
// console.log(180 - this.dealtime);
|
|
// console.log(180 - this.dealtime);
|
|
|
- let timeup=String(180 - this.dealtime)
|
|
|
|
|
- let picid=String(id)
|
|
|
|
|
|
|
+ let timeup = String(180 - this.dealtime);
|
|
|
|
|
+ let picid = String(id);
|
|
|
// console.log(typeof(timeup));
|
|
// console.log(typeof(timeup));
|
|
|
// console.log(typeof(picid));
|
|
// console.log(typeof(picid));
|
|
|
// console.log(timeup);
|
|
// console.log(timeup);
|
|
|
// console.log(id);
|
|
// console.log(id);
|
|
|
- this.$http.post("http://ningdongyunying.nxjiewei.com:8011/api/jigsawPuzzle/completeJigsawPuzzle",{
|
|
|
|
|
- completion_time:timeup,
|
|
|
|
|
- picture_id:picid
|
|
|
|
|
- }).then(res=>{
|
|
|
|
|
- console.log(res);
|
|
|
|
|
- })
|
|
|
|
|
- this.getxinxi(this.$route.query.id)
|
|
|
|
|
|
|
+ this.$http
|
|
|
|
|
+ .post(
|
|
|
|
|
+ "http://ningdongyunying.nxjiewei.com:8011/api/jigsawPuzzle/completeJigsawPuzzle",
|
|
|
|
|
+ {
|
|
|
|
|
+ completion_time: timeup,
|
|
|
|
|
+ picture_id: picid,
|
|
|
|
|
+ }
|
|
|
|
|
+ )
|
|
|
|
|
+ .then((res) => {
|
|
|
|
|
+ console.log(res);
|
|
|
|
|
+ });
|
|
|
|
|
+ this.getxinxi(this.$route.query.id);
|
|
|
this.reload(); //使用无痕刷新重新渲染页面
|
|
this.reload(); //使用无痕刷新重新渲染页面
|
|
|
},
|
|
},
|
|
|
//tabber返回按钮
|
|
//tabber返回按钮
|
|
|
onClickLeft() {
|
|
onClickLeft() {
|
|
|
window.history.back();
|
|
window.history.back();
|
|
|
},
|
|
},
|
|
|
-
|
|
|
|
|
|
|
+
|
|
|
//获取图片信息
|
|
//获取图片信息
|
|
|
getpuzzle(id) {
|
|
getpuzzle(id) {
|
|
|
// console.log(id);
|
|
// console.log(id);
|
|
@@ -548,40 +576,45 @@ export default {
|
|
|
)
|
|
)
|
|
|
.then((res) => {
|
|
.then((res) => {
|
|
|
console.log(res);
|
|
console.log(res);
|
|
|
- this.imgArr=res.data.data.data
|
|
|
|
|
|
|
+ this.imgArr = res.data.data.data;
|
|
|
});
|
|
});
|
|
|
},
|
|
},
|
|
|
//进度信息
|
|
//进度信息
|
|
|
- getxinxi(id){
|
|
|
|
|
|
|
+ getxinxi(id) {
|
|
|
// console.log(id);
|
|
// console.log(id);
|
|
|
- this.$http.post("http://ningdongyunying.nxjiewei.com:8011/api/jigsawPuzzle/getPercentCompleteData",{
|
|
|
|
|
- special_id:id
|
|
|
|
|
- }).then(res=>{
|
|
|
|
|
- // console.log(res.data.data);
|
|
|
|
|
- // console.log(res.data.data.complete_num);
|
|
|
|
|
- var jindus=res.data.data.percent_complete/100;
|
|
|
|
|
- this.no_complete_num=res.data.data.no_complete_num;
|
|
|
|
|
- this.complete_num=res.data.data.complete_num;
|
|
|
|
|
- this.jindu=jindus;
|
|
|
|
|
- sessionStorage.setItem("myjindu", this.jindu); //存入token值
|
|
|
|
|
- // console.log(this.jindu);
|
|
|
|
|
- this.drawLiquidfill(this.jiudu)
|
|
|
|
|
- // this.PercentCompleteData=res.data.data
|
|
|
|
|
- })
|
|
|
|
|
|
|
+ this.$http
|
|
|
|
|
+ .post(
|
|
|
|
|
+ "http://ningdongyunying.nxjiewei.com:8011/api/jigsawPuzzle/getPercentCompleteData",
|
|
|
|
|
+ {
|
|
|
|
|
+ special_id: id,
|
|
|
|
|
+ }
|
|
|
|
|
+ )
|
|
|
|
|
+ .then((res) => {
|
|
|
|
|
+ // console.log(res.data.data);
|
|
|
|
|
+ // console.log(res.data.data.complete_num);
|
|
|
|
|
+ var jindus = res.data.data.percent_complete / 100;
|
|
|
|
|
+ this.no_complete_num = res.data.data.no_complete_num;
|
|
|
|
|
+ this.complete_num = res.data.data.complete_num;
|
|
|
|
|
+ this.jindu = jindus;
|
|
|
|
|
+ sessionStorage.setItem("myjindu", this.jindu); //存入token值
|
|
|
|
|
+ // console.log(this.jindu);
|
|
|
|
|
+ this.drawLiquidfill(this.jiudu);
|
|
|
|
|
+ // this.PercentCompleteData=res.data.data
|
|
|
|
|
+ });
|
|
|
// this.reload(); //使用无痕刷新重新渲染页面
|
|
// this.reload(); //使用无痕刷新重新渲染页面
|
|
|
},
|
|
},
|
|
|
},
|
|
},
|
|
|
- created(){
|
|
|
|
|
- this.getxinxi(this.$route.query.id)
|
|
|
|
|
|
|
+ created() {
|
|
|
|
|
+ this.getxinxi(this.$route.query.id);
|
|
|
},
|
|
},
|
|
|
|
|
|
|
|
mounted() {
|
|
mounted() {
|
|
|
document.body.style.backgroundColor = "#39f"; //背景色
|
|
document.body.style.backgroundColor = "#39f"; //背景色
|
|
|
- // this.gettoken = getAllUrlParams(window.location.href).token;
|
|
|
|
|
- // this.token = `Bearer ${this.gettoken}`; //获取token值
|
|
|
|
|
- this.token=getAllUrlParams(window.location.href).token;
|
|
|
|
|
|
|
+ this.gettoken = getAllUrlParams(window.location.href).token;
|
|
|
|
|
+ this.token = `Bearer ${this.gettoken}`; //获取token值
|
|
|
|
|
+ // this.token=getAllUrlParams(window.location.href).token;
|
|
|
// console.log(this.token);
|
|
// console.log(this.token);
|
|
|
- // sessionStorage.setItem("mytoken", this.token); //存入token值
|
|
|
|
|
|
|
+ sessionStorage.setItem("mytoken", this.token); //存入token值
|
|
|
this.drawLiquidfill();
|
|
this.drawLiquidfill();
|
|
|
this.getpuzzle(this.$route.query.id);
|
|
this.getpuzzle(this.$route.query.id);
|
|
|
// this.shows = Boolean(getAllUrlParams(window.location.href).tabbar); //获取tabber
|
|
// this.shows = Boolean(getAllUrlParams(window.location.href).tabbar); //获取tabber
|
