Skip to content

visualcloud / Vmatrix-client

Go to a project
Commit 61390aa1 by hank
Options

fix clip bug

parent 01db2ef2
Showing with 70 additions and 25 deletions
src/App.vue
......@@ -75,8 +75,8 @@ export default {
}
.child-view {
transition: all 0.4s cubic-bezier(0.55, 0, 0.1, 1);
-webkit-overflow-scrolling: touch;
position: absolute;
// -webkit-overflow-scrolling: touch;
// position: absolute;
width: 100%;
min-height: 100vh;
}
......
src/views/tempaltes/editMenu.vue
......@@ -113,7 +113,7 @@
@changeSelcetData="changeSelcetData"
v-if="selectData.show"
></selectDataCom>
<div class="cropper-container" v-show="VueCropperOption.img">
<div class="cropper-container" v-if="VueCropperOption.img">
<vueCropper
ref="cropper"
:img="VueCropperOption.img"
......@@ -151,6 +151,10 @@ export default {
type: Object,
default: () => {}
},
isIos: {
type: Boolean,
default: true
},
schemaData: {
type: Object,
default: () => {}
......@@ -248,6 +252,7 @@ export default {
uploadAfter(file) {
// console.log(file);
if (String(file.file.type).indexOf("image") !== -1) {
this.$emit("setClipImg", true)
this.VueCropperOption.img = file.content;
} else {
this.uploadFile(file.file);
......@@ -270,6 +275,7 @@ export default {
this.$emit("setList", this.schemaData);
},
saveCropper() {
this.$emit("setClipImg", false)
this.VueCropperOption.img = "";
this.$refs.cropper.getCropBlob(data => {
console.log(data);
......@@ -304,19 +310,26 @@ export default {
.menu-container {
height: calc(100vh - 570px);
padding: 15px;
position: static;
box-sizing: border-box;
// overflow: scroll;
.cropper-container {
display: flex;
flex-direction: column;
background-color: #666;
overflow: auto;
top: 0;
left: 0;
width: 100%;
position: fixed;
height: 100%;
z-index: 100000;
bottom: 0;
right: 0;
width: 100vw;
position: absolute;
height: 100vh;
// overflow: hidden;
z-index: 10000000;
.vue-cropper {
height: calc(100vh - 84px);
z-index: 100000000;
}
.save-img-btn {
width: 294px;
......@@ -334,6 +347,7 @@ export default {
border-radius: 30px;
text-align: center;
color: white;
z-index: 1000000;
}
}
.image {
......
src/views/tempaltes/editMore.vue
......@@ -131,6 +131,7 @@
<div class="content" v-show="gifloaded">
<div
class="content-left"
v-show="!clipImg"
:class="{'content-left-v': templateData.templateShow === 'VERTICAL' }"
>
<div class="content-left-top">
......@@ -150,10 +151,18 @@
<!-- <van-button size="mini" @click="pageShow">页面排序</van-button> -->
<!-- <van-button size="mini" @click="preview">预览</van-button> -->
</div>
<iframe
style="height: 0px;width: 100%;"
v-if="isIos"
v-show="false"
@load="iframetestLoad"
scrolling="no"
:src="templateData.frameUrl+'?isEdit=1'"
frameborder="0"
></iframe>
<div
class="iframe-container"
:style="!isIos ? 'width: 100vw' : ''"
:class="{'iframe-container2': templateData.templateShow === 'VERTICAL', isIos: isIos }"
>
<iframe
......@@ -168,21 +177,14 @@
frameborder="0"
></iframe>
</div>
<iframe
style="height: 0px;width: 100%;"
v-if="isIos"
v-show="false"
scrolling="no"
:src="templateData.frameUrl+'?isEdit=1'"
frameborder="0"
></iframe>
<!--
:src="templateData.frameUrl+'?isEdit=1&filmId='+templateData.filmId + '&now=' + time"
https://visual-clouds.bdideal.com/html/test2.html
:src="'https://127.0.0.1:9000/template.html' + '?isEdit=1&filmId='+templateData.filmId + '&now=' + date"
:src="templateData.frameUrl+'?isEdit=1&filmId='+templateData.filmId + '&now=' + date"-->
</div>
<div class="content-menu">
<div class="content-menu" v-show="!clipImg">
<slider :list="templateData.listData">
<div
class="menu-item"
......@@ -194,7 +196,7 @@
</div>
</slider>
</div>
<div class="group-menu" v-if="templateData.listData[currentPage]">
<div class="group-menu" v-if="templateData.listData[currentPage]" v-show="!clipImg">
<slider :list="templateData.listData[currentPage].itemList">
<div
class="group-menu-item"
......@@ -206,21 +208,23 @@
</div>
<div class="content-right">
<!-- <div class="title">编辑栏</div> -->
<div class="edit-area">
<div class="edit-area" :class="{'fixed-edit-area': clipimg}">
<div v-if="templateData.listData[currentPage]">
<editMenu
v-if="loaded "
:isIos="this.isIos"
:itemList="templateData.listData[currentPage].itemList"
:item="templateData.listData[currentPage].itemList[itemListIndex]"
:schemaData="templateData.listData[currentPage].schemaData"
:frameUrl="templateData.frameUrl"
@setList="setList"
@setClipImg="setClipImg"
></editMenu>
</div>
</div>
</div>
</div>
<div class="createBtn" v-show="gifloaded">
<div class="createBtn" v-show="gifloaded && !clipImg">
<van-button type="info" @click="enterSubmit" style="width: 100%">发布</van-button>
</div>
<van-action-sheet v-model="showSheet" :round="true" :actions="actions" @select="onSheetSelect" />
......@@ -303,6 +307,7 @@ export default {
defaultData: [],
templateInfo: {}
},
clipImg: false,
editObj: {},
editIndex: "",
editPage: "",
......@@ -337,9 +342,9 @@ export default {
let ua = window.navigator.userAgent;
//$alert('浏览器版本: ' + app + '\n' + '用户代理: ' + ua);
if (ua.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/)) {
this.isIos = true
this.isIos = true;
} else {
this.isIos = false
this.isIos = false;
}
window.onunload = function() {
window.wx.miniProgram.navigateBack({});
......@@ -457,6 +462,9 @@ export default {
pages: this.templateData.listData
});
},
setClipImg(show) {
this.clipImg = show
},
goPage(index) {
this.currentPage = index;
console.log(index);
......@@ -551,6 +559,9 @@ export default {
type: "cancelEdit"
});
},
iframetestLoad() {
this.loaded = true;
},
iframeLoad() {
this.setList();
},
......@@ -598,7 +609,9 @@ export default {
var pagesData = res.data.pageList;
this.templateData.defaultData = pagesData;
});
if (!this.isIos) {
this.loaded = true;
}
this.$toast("数据加载完成");
setTimeout(() => {
window.frames["tiframe"].location.reload();
......@@ -617,10 +630,13 @@ export default {
this.templateData.frameUrl = res.data.frameUrl;
this.templateData.filmDescribe = res.data.templateDescribe;
this.templateData.templateShow = res.data.templateShow;
if (!this.isIos) {
this.loaded = true;
}
this.$toast("数据加载完成");
setTimeout(() => {
window.frames["tiframe"].location.reload();
console.log("reload");
}, 500);
axios
.get(
......@@ -773,6 +789,7 @@ export default {
box-sizing: border-box;
padding-bottom: 80px;
position: relative;
z-index: 1;
.page-content-tips {
text-align: center;
......@@ -1051,6 +1068,8 @@ export default {
}
}
.content-right {
// position: relative;
// z-index: 10;
// width: 300px;
text-align: left;
......@@ -1064,6 +1083,18 @@ export default {
margin-bottom: 10px;
border-bottom: 1px solid #dddddd;
}
// .fixed-edit-area {
// position: fixed;
// top: 0;
// right: 0;
// left: 0;
// bottom: 0;
// z-index: 1000;
// height: 100vh;
// .menu-container {
// height: 100vh !important;
// }
// }
.edit-area {
padding-top: 10px;
padding-bottom: 20px;
......@@ -1307,7 +1338,7 @@ export default {
padding: 10px 40px;
padding-bottom: 10px;
display: flex;
z-index: 1000;
// z-index: 1;
justify-content: space-between;
background: white;
box-sizing: border-box;
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or sign in to comment