kylin
/
zdxtDrillProgram
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
Browse Source

型号适配

h5_css
蟑螂恶霸 3 years ago
parent
d1cd66dd20
commit
3c5a2eea4d
2 changed files with 347 additions and 316 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 6
      static/base_css.css
  2. 133
      subpkg/complete/complete.vue

6
static/base_css.css
View File

@ -422,12 +422,18 @@ h3.contit span {
font-weight: 600;
}
.myitem {
display: flex;
justify-content: center;
}
.myitem span {
position: relative;
margin: 1% 10% 0 0;
padding-right: 0.6rem;
font-size: 0.9rem;
color: #666;
white-space: nowrap;
}
.myitem span b {

133
subpkg/complete/complete.vue
View File

@ -12,7 +12,8 @@
<view class="mainwrap2">
<view class="question-wrap">
<view class="question-list">
<view :class="item.correct === 0 ? 'question-item erritem':'question-item'" v-for="(item, i) in questionList" :key="i" @click="itemClickHandler(item)">
<view :class="item.correct === 0 ? 'question-item erritem':'question-item'"
v-for="(item, i) in questionList" :key="i" @click="itemClickHandler(item)">
<span class="question-num">{{i+1}}</span>
</view>
<!-- <view class="question-item erritem" v-for="(item, i) in questionList" :key="i" @click="itemClickHandler(item)">
@ -45,26 +46,38 @@
<view class="perinfo">
<view class="myitem">
<!-- <label><button open-type="share"></button>炫耀一下</label> -->
<view @click="shareUser()"><label><image src="/static/images/btn-xy.png"></image></label>炫耀一下</view>
<view @click="shareUser()"><label>
<image src="/static/images/btn-xy.png"></image>
</label>炫耀一下</view>
</view>
<view class="myitem">
<view @click="review()"><label><image src="/static/images/btn-hg.png"></image></label>演练回顾</view>
<view @click="review()"><label>
<image src="/static/images/btn-hg.png"></image>
</label>演练回顾</view>
</view>
<view class="myitem">
<view @click="reChallenge()"><label><image src="/static/images/btn-cx.png"></image></label>重新挑战</view>
<view @click="reChallenge()"><label>
<image src="/static/images/btn-cx.png"></image>
</label>重新挑战</view>
</view>
</view>
</view>
<view class="popup-share" v-if="showShare">
<label @click="closeShare()" class="close-button"></label>
<label class="medimg"><image src="/static/images/medal_1.png"></image></label>
<label class="medimg">
<image src="/static/images/medal_1.png"></image>
</label>
<view class="congrat">恭喜你获得1枚成就勋章！</view>
<view class="perinfo">
<view class="myitem">
<view @click=""><label><button open-type="share"></button><image src="/static/images/btn-wx.png"></image></label>分享给微信好友</view>
<view @click=""><label><button open-type="share"></button>
<image src="/static/images/btn-wx.png"></image>
</label>分享给微信好友</view>
</view>
<view class="myitem">
<view @click="formSubmit()"><label><image src="/static/images/btn-ma.png"></image></label>二维码邀请</view>
<view @click="formSubmit()"><label>
<image src="/static/images/btn-ma.png"></image>
</label>二维码邀请</view>
</view>
</view>
</view>
@ -85,33 +98,37 @@
</template>
<script>
import { mapState, mapMutations, mapGetters } from 'vuex'
import {
mapState,
mapMutations,
mapGetters
} from 'vuex'
export default {
data() {
return {
"questionFreId":"8eefa1161f4643ccaed9404949911a39",
"roleId":"8ad2af376ec64f519147030497086a96",
"questionFreId": "8eefa1161f4643ccaed9404949911a39",
"roleId": "8ad2af376ec64f519147030497086a96",
"sceneId": "d6b424abc2d44f2888a4d9a3d52f9f09",
achieveMedalImg:"",
achieveMedalImg: "",
questionList: [],
recordList: [],
"ask":"",
"answer":"",
"correctAnswer":"",
"analysis":"",
"showLayer":true,
"showAnlysisc":false,
"showMedal":true,
"showShare":false,
"showLoad":false,
"ask": "",
"answer": "",
"correctAnswer": "",
"analysis": "",
"showLayer": true,
"showAnlysisc": false,
"showMedal": true,
"showShare": false,
"showLoad": false,
canvas: null, //canvas 对象
tempFilePath: "",
"imageQR":''
"imageQR": ''
};
},
//分享到好友
onShareAppMessage(res) {
if (res.from === 'button') {// 来自页面内分享按钮
if (res.from === 'button') { // 来自页面内分享按钮
console.log(res.target)
}
return {
@ -133,9 +150,9 @@
this.showLayer = false
clearTimeout(this.timer)
}, 2000)
this.roleId = options.roleId !=null ? options.roleId : this.roleId
this.questionFreId = options.questionFreId!=null ? options.questionFreId : this.questionFreId
this.sceneId = options.sceneId!=null ? options.sceneId : this.sceneId;
this.roleId = options.roleId != null ? options.roleId : this.roleId
this.questionFreId = options.questionFreId != null ? options.questionFreId : this.questionFreId
this.sceneId = options.sceneId != null ? options.sceneId : this.sceneId;
this.getQuestionList()
this.getRecordList()
this.editUserMedal();
@ -185,7 +202,10 @@
async getRecordList() {
const {
data: res
} = await uni.$http.post('/small/questionFre/listAll',{roleId:this.roleId,userId:this.userId})
} = await uni.$http.post('/small/questionFre/listAll', {
roleId: this.roleId,
userId: this.userId
})
if (!res.success) return uni.$showMsg()
this.recordList = res.data
@ -200,7 +220,7 @@
})
if (!res.success) return uni.$showMsg()
this.achieveMedalImg = uni.$http.baseUrl + res.data
if (res.data == null || res.data =="") {
if (res.data == null || res.data == "") {
this.showMedal = false
this.showLayer = false
}
@ -226,19 +246,20 @@
reChallenge() {
uni.navigateTo({
// url: '/subpkg/rechallenge/rechallenge?questionFreId=' + this.questionFreId
url: '/subpkg/practice/practice?roleId='+this.roleId+'&sceneId='+this.sceneId
url: '/subpkg/practice/practice?roleId=' + this.roleId + '&sceneId=' + this.sceneId
})
},
review() {
uni.navigateTo({
url: '/subpkg/review/review?questionFreId=' + this.questionFreId +'&sceneId=' + this.sceneId +"&roleId=" + this.roleId
url: '/subpkg/review/review?questionFreId=' + this.questionFreId + '&sceneId=' + this.sceneId +
"&roleId=" + this.roleId
})
},
closeShare() {
this.showShare = false
this.showLayer = false
},
formSubmit(){
formSubmit() {
wx.createSelectorQuery()
.select('#photo') // 在 canvas的 id
.fields({
@ -263,12 +284,12 @@
context.clearRect(0, 0, width, height)
//canvas背景色
context.fillStyle = '#3c9cff';
context.fillStyle ="#FFF" // 背景颜色
context.fillStyle = "#FFF" // 背景颜色
context.fillRect(0, 0, 500, 800) // 667 绘制一个矩形作为背景矩形x坐标、y坐标、图片宽、高
//绘制左下角文字
context.fontSize = 12;
context.fillStyle = '#333';
context.textAlign ='left';
context.textAlign = 'left';
context.fillText("长按识别小程序～", 10, 520);
context.stroke();
// 图片对象
@ -287,7 +308,7 @@
this.showShare = false
this.showLayer = false
},
cancel(){
cancel() {
const canvas = this.canvas;
const ctx = canvas.getContext("2d");
ctx.clearRect(0, 0, 500, 800)
@ -303,7 +324,7 @@
this.tempFilePath = res.tempFilePath
uni.saveImageToPhotosAlbum({
filePath: res.tempFilePath,
success: (res)=> {
success: (res) => {
wx.showToast({
title: '保存成功',
})
@ -316,7 +337,7 @@
}
});
},
formSubmit(){
formSubmit() {
wx.createSelectorQuery()
.select('#photo') // 在 canvas的 id
.fields({
@ -341,12 +362,12 @@
context.clearRect(0, 0, width, height)
//canvas背景色
context.fillStyle = '#3c9cff';
context.fillStyle ="#FFF" // 背景颜色
context.fillStyle = "#FFF" // 背景颜色
context.fillRect(0, 0, 500, 800) // 667 绘制一个矩形作为背景矩形x坐标、y坐标、图片宽、高
//绘制左下角文字
context.fontSize = 16;
context.fillStyle = '#333';
context.textAlign ='left';
context.textAlign = 'left';
context.fillText("长按识别小程序～", 16, 520);
context.stroke();
// 图片对象
@ -375,7 +396,7 @@
this.tempFilePath = res.tempFilePath
uni.saveImageToPhotosAlbum({
filePath: res.tempFilePath,
success: (res)=> {
success: (res) => {
wx.showToast({
title: '保存成功',
})
@ -468,6 +489,7 @@
.secbar {
height: 4vh;
text-align: center;
.title {
display: inline-block;
margin-top: 1.75vh;
@ -575,6 +597,7 @@
.item {
margin: 2% 0;
border-bottom: 1px dotted #ddd;
label {
color: #666;
font-size: 1.0rem;
@ -635,7 +658,8 @@
transform: rotate(45deg);
}
.close-button:before, .close-button:after {
.close-button:before,
.close-button:after {
content: '';
position: absolute;
top: 50%;
@ -655,10 +679,10 @@
width: 24rpx;
}
.imagePathBox{
.imagePathBox {
width: 100%;
height: 100%;
background: rgba(0,0,0,0.6);
background: rgba(0, 0, 0, 0.6);
position: absolute;
top: 0;
left: 0;
@ -666,7 +690,8 @@
bottom: 0;
z-index: 100;
}
.shengcheng{
.shengcheng {
width: 350px;
height: 580px;
position: absolute;
@ -676,18 +701,21 @@
transform: translate(-50%, -50%);
z-index: 999;
}
.btnbox {
display: flex;
width: 70%;
height: 90rpx;
justify-content: center;
position: absolute;
bottom: 10%;
left: 15%;
}
.baocun ,.cancel{
display: block;
width: 45%;
left: 10%;
width: 80%;
height: 90rpx;
}
.baocun,
.cancel {
display: inline-block;
width: 60%;
padding: 0;
line-height: 90rpx;
text-align: center;
@ -699,12 +727,9 @@
}
.cancel {
display: inline-block;
width: 35%;
background-color: #fff;
color: #1367fe;
}
button[class="baocun"]::after{
border: 0;
}
</style>
Write Preview
Loading…
Cancel
Save