Skip to content

visualcloud / Vmatrix-client

Go to a project
Commit 5ca77b73 by hank
Options

fix bug

parent c32f9bc9
Showing with 703 additions and 229 deletions
src/views/tempaltes/editMenu.vue
<template>
<div class="menu-container">
<van-collapse v-model="activeName" accordion>
<van-collapse-item
v-for="(item, index) in itemList"
:key="index"
:title="item.name"
:name="index"
>
<!-- <edit-menu v-if="item.type === 'group'" :itemList="item.itemList" :schemaData="schemaData">
<div>
<!-- <div>{{schemaData[item.dataKey]}} {{item.dataKey}}</div> -->
<video
v-if="item.type === 'video'"
class="image"
:src="getHostUrl(schemaData[item.dataKey].value)"
alt
/>
<img
v-if="item.type === 'image'"
class="image"
:src="getHostUrl(schemaData[item.dataKey].value)"
alt
/>
<div class="checkbox" v-if="item.enableDisplay">
<label>
<input
type="checkbox"
style="display: inline;"
v-model="schemaData[item.dataKey].visbility"
@change="checkboxChange"
/>是否隐藏
</label>
</div>
<div>
<input
v-if="item.type === 'text'"
class="edit-input"
type="text"
v-model="schemaData[item.dataKey].value"
@keyup="valueChange2()"
/>
</div>
</edit-menu>-->
<div>
<!-- <div>{{schemaData[item.dataKey]}} {{item.dataKey}}</div> -->
<video
v-if="item.type === 'video'"
class="image"
:src="getHostUrl(schemaData[item.dataKey].value)"
alt
/>
<img
v-if="item.type === 'image'"
class="image"
:src="getHostUrl(schemaData[item.dataKey].value)"
alt
/>
<div class="checkbox" v-if="item.enableDisplay">
<label>
<input
type="checkbox"
style="display: inline;"
v-model="schemaData[item.dataKey].visbility"
@change="checkboxChange"
/>是否隐藏
</label>
</div>
<div>
<input
v-if="item.type === 'text'"
class="edit-input"
type="text"
v-model="schemaData[item.dataKey].value"
@keyup="valueChange2()"
/>
<div class="list-container" v-if="item.type === 'list'">
<div
class="create-btn-container"
v-if="!item.listLimit || (item.listLimit && schemaData[item.dataKey].length < !item.listLimit)"
>
<van-button class="create-btn" type="info" @click="addItem(item)">新增1</van-button>
</div>
<div class="list-item" v-for="(item2, index2) in schemaData[item.dataKey]" :key="index2">
<div class="btn-con">
<span class="index">序号{{index2}}</span>
</div>
<div class="list-container" v-if="item.type === 'list'">
<div
class="create-btn-container"
v-if="!item.listLimit || (item.listLimit && schemaData[item.dataKey].length < !item.listLimit)"
>
<van-button class="create-btn" type="info" @click="addItem(item)">新增</van-button>
</div>
<div
class="list-item"
v-for="(item2, index2) in schemaData[item.dataKey]"
:key="index2"
>
<div class="btn-con">
<span class="index">序号{{index2}}</span>
</div>
<div class="list-item-list" v-for="(item3, index3) in item2" :key="index3">
<div v-if="(index3 != 'schemaIndex' && index3 != 'index')">
<input
v-if="item.modelSchema[isSchemaIndex(item2)][index3].type === 'text'"
:placeholder="item.modelSchema[isSchemaIndex(item2)][index3].description"
class="edit-input edit-input-list-item"
type="text"
v-model="item2[index3]"
@keyup="valueChange2()"
<div class="list-item-list" v-for="(item3, index3) in item2" :key="index3">
<div v-if="(index3 != 'schemaIndex' && index3 != 'index')">
<input
v-if="item.modelSchema[isSchemaIndex(item2)][index3].type === 'text'"
:placeholder="item.modelSchema[isSchemaIndex(item2)][index3].description"
class="edit-input edit-input-list-item"
type="text"
v-model="item2[index3]"
@keyup="valueChange2()"
/>
<div>
<van-uploader
result-type="dataUrl"
v-if="item.modelSchema[isSchemaIndex(item2)][index3].type == 'image' || item.modelSchema[isSchemaIndex(item2)][index3].type == 'video'"
:accept="item.modelSchema[isSchemaIndex(item2)][index3].type == 'image' ? 'image/*' : 'video/*'"
@click.native="uploadListItem(item.dataKey,index2, index3)"
:after-read="uploadAfter"
>
<!-- <van-button type="info">上传</van-button> -->
<img
v-if="item.modelSchema[isSchemaIndex(item2)][index3].type === 'image'"
:src="getHostUrl(item2[index3])"
class="edit-input edit-input-image"
/>
<div>
<van-uploader
result-type="dataUrl"
v-if="item.modelSchema[isSchemaIndex(item2)][index3].type == 'image' || item.modelSchema[isSchemaIndex(item2)][index3].type == 'video'"
:accept="item.modelSchema[isSchemaIndex(item2)][index3].type == 'image' ? 'image/*' : 'video/*'"
@click.native="uploadListItem(item.dataKey,index2, index3)"
:after-read="uploadAfter"
>
<!-- <van-button type="info">上传</van-button> -->
<img
v-if="item.modelSchema[isSchemaIndex(item2)][index3].type === 'image'"
:src="getHostUrl(item2[index3])"
class="edit-input edit-input-image"
/>
<video
class="edit-input-video"
:src="getHostUrl(item2[index3])"
v-if="item.modelSchema[isSchemaIndex(item2)][index3].type === 'video'"
></video>
</van-uploader>
</div>
</div>
</div>
<div class="list-item-delete">
<span @click="deleteItem(index2, schemaData[item.dataKey])">
<img src="../../assets/img/delete-icon.png" class="list-item-delete-icon" alt />
<span class="del-btn">删除</span>
</span>
<video
class="edit-input-video"
:src="getHostUrl(item2[index3])"
v-if="item.modelSchema[isSchemaIndex(item2)][index3].type === 'video'"
></video>
</van-uploader>
</div>
</div>
<div class="list-item-delete">
<span @click="deleteItem(index2, schemaData[item.dataKey])">
<img src="../../assets/img/delete-icon.png" class="list-item-delete-icon" alt />
<span class="del-btn">删除</span>
</span>
</div>
</div>
<van-uploader
result-type="dataUrl"
v-if="item.type == 'image' || item.type == 'video'"
:accept="item.type == 'image' ? 'image/*' : 'video/*'"
@click.native="uploadItem(item.dataKey)"
:after-read="uploadAfter"
>
<van-button type="info">上传</van-button>
<br />
</van-uploader>
<van-button
type="info"
v-if="item.selectList && item.type !== 'list'"
@click="setSelectData(item, index)"
>选择默认数据</van-button>
</div>
</van-collapse-item>
</van-collapse>
</div>
<van-uploader
result-type="dataUrl"
v-if="item.type == 'image' || item.type == 'video'"
:accept="item.type == 'image' ? 'image/*' : 'video/*'"
@click.native="uploadItem(item.dataKey)"
:after-read="uploadAfter"
>
<van-button type="info">上传</van-button>
<br />
</van-uploader>
<van-button
type="info"
v-if="item.selectList && item.type !== 'list'"
@click="setSelectData(item, index)"
>选择默认数据</van-button>
</div>
<selectDataCom
:selectList="selectData"
@changeSelcetData="changeSelcetData"
......@@ -141,6 +125,10 @@ export default {
type: String,
default: ""
},
item: {
type: Object,
default: () => {}
},
schemaData: {
type: Object,
default: () => {}
......@@ -194,6 +182,7 @@ export default {
obj[item] = "";
});
this.schemaData[item.dataKey].push(obj);
console.log(obj)
} else {
alert("选择类型添加，敬请期待！");
}
......@@ -264,128 +253,134 @@ export default {
};
</script>
<style lang="scss" scoped>
.image {
height: 50px;
}
.van-uploader {
.van-button {
height: 0.8rem;
line-height: 0.8rem;
.menu-container {
height: calc(100vh - 570px);
padding: 15px;
.image {
height: 50px;
}
}
.list-container {
.list-item {
// padding:
position: relative;
.index {
font-size: 18px;
font-family: PingFangSC-Semibold, PingFang SC;
font-weight: 600;
color: rgba(0, 0, 0, 1);
// line-height: 18px;
}
.btn-con {
display: flex;
justify-content: space-between;
.van-uploader {
.van-button {
height: 0.8rem;
line-height: 0.8rem;
}
}
.list-container {
.list-item {
// padding:
position: relative;
.index {
font-size: 18px;
font-family: PingFangSC-Semibold, PingFang SC;
font-weight: 600;
color: rgba(0, 0, 0, 1);
// line-height: 18px;
}
.btn-con {
display: flex;
justify-content: space-between;
margin-bottom: 15px;
}
.edit-input-list-item {
margin: 10px 0;
}
.edit-input-image {
width: auto;
height: 100px;
max-height: 100px;
max-width: 100%;
// display: block;
}
.list-item-delete {
text-align: right;
&-icon {
height: 16px;
width: 16px;
vertical-align: middle;
margin-right: 5px;
.edit-input-list-item {
margin: 10px 0;
}
.edit-input-image {
width: auto;
height: 100px;
max-height: 100px;
max-width: 100%;
// display: block;
}
.del-btn {
font-size: 14px;
color: rgba(250, 61, 34, 1);
.list-item-delete {
text-align: right;
&-icon {
height: 14px;
width: 14px;
vertical-align: middle;
margin-right: 5px;
}
.del-btn {
font-size: 14px;
color: rgba(250, 61, 34, 1);
vertical-align: middle;
vertical-align: middle;
}
}
.list-item-list {
padding: 10px;
border: 1px solid #dddddd;
box-sizing: border-box;
border-radius: 8px;
margin-bottom: 20px;
}
}
padding: 10px;
margin-right: 10px;
border: 1px solid #dddddd;
box-sizing: border-box;
border-radius: 8px;
margin-bottom: 20px;
}
}
.btn-container {
padding-left: 20px;
// line-height: 38px;
word-break: break-all;
.editbtn {
display: inline-block;
background: white;
padding: 2px 5px;
border: 1px solid #333333;
margin-right: 10px;
margin-bottom: 10px;
border-radius: 3px;
.btn-container {
padding-left: 20px;
// line-height: 38px;
word-break: break-all;
.editbtn {
display: inline-block;
background: white;
padding: 2px 5px;
border: 1px solid #333333;
margin-right: 10px;
margin-bottom: 10px;
border-radius: 3px;
}
}
}
input {
margin-top: 15px;
display: block;
width: 50vw;
height: 42px;
padding-left: 10px;
border: none;
}
.checkbox {
display: flex;
align-items: center;
height: 30px;
label {
input {
margin-top: 15px;
display: block;
width: 50vw;
height: 42px;
padding-left: 10px;
border: none;
}
.checkbox {
display: flex;
align-items: center;
height: 30px;
input {
margin: 0;
height: 20px;
width: 20px;
label {
display: flex;
align-items: center;
height: 30px;
input {
margin: 0;
height: 20px;
width: 20px;
}
}
}
}
.create-btn-container {
margin-bottom: 25px;
.create-btn {
padding-left: 17px;
padding-right: 17px;
// width: 197px;
line-height: 34px;
box-sizing: border-box;
border: none;
font-size: 16px;
height: 34px;
background: linear-gradient(
266deg,
rgba(255, 171, 32, 1) 0%,
rgba(255, 114, 14, 1) 100%
);
box-shadow: 0px 2px 8px 0px rgba(255, 167, 31, 0.31);
border-radius: 22px;
.create-btn-container {
margin-bottom: 25px;
.create-btn {
padding-left: 17px;
padding-right: 17px;
// width: 197px;
line-height: 34px;
box-sizing: border-box;
border: none;
font-size: 16px;
height: 34px;
background: linear-gradient(
266deg,
rgba(255, 171, 32, 1) 0%,
rgba(255, 114, 14, 1) 100%
);
box-shadow: 0px 2px 8px 0px rgba(255, 167, 31, 0.31);
border-radius: 22px;
}
}
.edit-input {
width: 97%;
background: #f5f5f5;
border-radius: 6px;
font-size: 14px;
color: rgba(51, 51, 51, 1);
margin-top: 0;
}
}
.edit-input {
width: 97%;
background: #f5f5f5;
border-radius: 6px;
font-size: 14px;
color: rgba(51, 51, 51, 1);
margin-top: 0;
}
</style>
src/views/tempaltes/editMenu_back.vue 0 → 100644
<template>
<div class="menu-container">
<van-collapse v-model="activeName" accordion>
<van-collapse-item
v-for="(item, index) in itemList"
:key="index"
:title="item.name"
:name="index"
>
<!-- <edit-menu v-if="item.type === 'group'" :itemList="item.itemList" :schemaData="schemaData">
</edit-menu>-->
<div>
<!-- <div>{{schemaData[item.dataKey]}} {{item.dataKey}}</div> -->
<video
v-if="item.type === 'video'"
class="image"
:src="getHostUrl(schemaData[item.dataKey].value)"
alt
/>
<img
v-if="item.type === 'image'"
class="image"
:src="getHostUrl(schemaData[item.dataKey].value)"
alt
/>
<div class="checkbox" v-if="item.enableDisplay">
<label>
<input
type="checkbox"
style="display: inline;"
v-model="schemaData[item.dataKey].visbility"
@change="checkboxChange"
/>是否隐藏
</label>
</div>
<div>
<input
v-if="item.type === 'text'"
class="edit-input"
type="text"
v-model="schemaData[item.dataKey].value"
@keyup="valueChange2()"
/>
</div>
<div class="list-container" v-if="item.type === 'list'">
<div
class="create-btn-container"
v-if="!item.listLimit || (item.listLimit && schemaData[item.dataKey].length < !item.listLimit)"
>
<van-button class="create-btn" type="info" @click="addItem(item)">新增</van-button>
</div>
<div
class="list-item"
v-for="(item2, index2) in schemaData[item.dataKey]"
:key="index2"
>
<div class="btn-con">
<span class="index">序号{{index2}}</span>
</div>
<div class="list-item-list" v-for="(item3, index3) in item2" :key="index3">
<div v-if="(index3 != 'schemaIndex' && index3 != 'index')">
<input
v-if="item.modelSchema[isSchemaIndex(item2)][index3].type === 'text'"
:placeholder="item.modelSchema[isSchemaIndex(item2)][index3].description"
class="edit-input edit-input-list-item"
type="text"
v-model="item2[index3]"
@keyup="valueChange2()"
/>
<div>
<van-uploader
result-type="dataUrl"
v-if="item.modelSchema[isSchemaIndex(item2)][index3].type == 'image' || item.modelSchema[isSchemaIndex(item2)][index3].type == 'video'"
:accept="item.modelSchema[isSchemaIndex(item2)][index3].type == 'image' ? 'image/*' : 'video/*'"
@click.native="uploadListItem(item.dataKey,index2, index3)"
:after-read="uploadAfter"
>
<!-- <van-button type="info">上传</van-button> -->
<img
v-if="item.modelSchema[isSchemaIndex(item2)][index3].type === 'image'"
:src="getHostUrl(item2[index3])"
class="edit-input edit-input-image"
/>
<video
class="edit-input-video"
:src="getHostUrl(item2[index3])"
v-if="item.modelSchema[isSchemaIndex(item2)][index3].type === 'video'"
></video>
</van-uploader>
</div>
</div>
</div>
<div class="list-item-delete">
<span @click="deleteItem(index2, schemaData[item.dataKey])">
<img src="../../assets/img/delete-icon.png" class="list-item-delete-icon" alt />
<span class="del-btn">删除</span>
</span>
</div>
</div>
</div>
<van-uploader
result-type="dataUrl"
v-if="item.type == 'image' || item.type == 'video'"
:accept="item.type == 'image' ? 'image/*' : 'video/*'"
@click.native="uploadItem(item.dataKey)"
:after-read="uploadAfter"
>
<van-button type="info">上传</van-button>
<br />
</van-uploader>
<van-button
type="info"
v-if="item.selectList && item.type !== 'list'"
@click="setSelectData(item, index)"
>选择默认数据</van-button>
</div>
</van-collapse-item>
</van-collapse>
<selectDataCom
:selectList="selectData"
@changeSelcetData="changeSelcetData"
v-if="selectData.show"
></selectDataCom>
</div>
</template>
<script>
import { upload } from "@/api/api";
import { getHostUrl } from "@/utils/index";
import selectDataCom from "./selectData";
export default {
name: "editMenu",
props: {
itemList: {
type: Array,
default: () => []
},
frameUrl: {
type: String,
default: ""
},
schemaData: {
type: Object,
default: () => {}
}
},
components: {
selectDataCom
},
created() {
console.log(this.schemaData);
},
data() {
return {
activeName: "",
dataKey: "",
listIndex: "",
itemKey: "",
selectData: {
show: false
}
};
},
methods: {
valueChange2() {
console.log(this.schemaData);
this.$emit("setList", this.schemaData);
},
uploadItem(key) {
// alert(key);
(this.itemKey = ""), (this.dataKey = key);
},
uploadListItem(key, index, itemKey) {
this.dataKey = key;
this.listIndex = index;
this.itemKey = itemKey;
console.log(key, index, itemKey, "dsadadsa");
},
isSchemaIndex(item) {
// console.log(item);
return item["schemaIndex"] ? item["schemaIndex"] : 0;
},
toObj(obj) {
console.log(obj);
return JSON.parse(JSON.stringify(obj));
},
addItem(item) {
if (item.modelSchema && item.modelSchema.length === 1) {
var keys = Object.keys(item.modelSchema[0]);
var obj = {};
keys.map(function(item) {
obj[item] = "";
});
this.schemaData[item.dataKey].push(obj);
} else {
alert("选择类型添加，敬请期待！");
}
console.log(item);
},
getHostUrl(dataUrl) {
return getHostUrl(this.frameUrl, dataUrl);
},
uploadAfter(file) {
this.$toast.loading({
mask: true,
duration: 0,
message: "上传中..."
});
upload(file.file)
.then(res => {
// this.schemaData[this.dataKey].value = res.data.data;
if (this.itemKey) {
this.setSchemaListData(res.data.data);
} else {
this.setSchemaData(res.data.data);
}
this.$toast.clear();
})
.catch(e => {
console.log(e);
this.$toast.clear();
this.$toast("上传失败");
});
},
checkboxChange(value) {
console.log(this.schemaData, value);
},
setSchemaData(value) {
this.schemaData[this.dataKey].value = value;
this.valueChange2();
},
setSchemaListData(value) {
this.schemaData[this.dataKey][this.listIndex][this.itemKey] = value;
this.valueChange2();
this.itemKey = "";
},
deleteItem(index, arr) {
arr.splice(index, 1);
this.$emit("setList", this.schemaData);
},
setSelectData(item, index) {
const myItem = JSON.parse(JSON.stringify(item));
this.selectData.show = true;
this.selectData.item = myItem;
this.selectData.index = index;
this.selectData.item.selectList = [
"http://pic27.nipic.com/20130313/9252150_092049419327_2.jpg",
"http://pic27.nipic.com/20130313/9252150_092049419327_2.jpg",
"http://pic27.nipic.com/20130313/9252150_092049419327_2.jpg",
"http://pic27.nipic.com/20130313/9252150_092049419327_2.jpg"
];
console.log(this.selectData);
},
changeSelcetData(data) {
console.log(data);
this.dataKey = data.item.dataKey;
this.setSchemaData(data.val);
this.selectData.show = false;
}
}
};
</script>
<style lang="scss" scoped>
.image {
height: 50px;
}
.van-uploader {
.van-button {
height: 0.8rem;
line-height: 0.8rem;
}
}
.list-container {
.list-item {
// padding:
position: relative;
.index {
font-size: 18px;
font-family: PingFangSC-Semibold, PingFang SC;
font-weight: 600;
color: rgba(0, 0, 0, 1);
// line-height: 18px;
}
.btn-con {
display: flex;
justify-content: space-between;
}
.edit-input-list-item {
margin: 10px 0;
}
.edit-input-image {
width: auto;
height: 100px;
max-height: 100px;
max-width: 100%;
// display: block;
}
.list-item-delete {
text-align: right;
&-icon {
height: 16px;
width: 16px;
vertical-align: middle;
margin-right: 5px;
}
.del-btn {
font-size: 14px;
color: rgba(250, 61, 34, 1);
vertical-align: middle;
}
}
padding: 10px;
margin-right: 10px;
border: 1px solid #dddddd;
box-sizing: border-box;
border-radius: 8px;
margin-bottom: 20px;
}
}
.btn-container {
padding-left: 20px;
// line-height: 38px;
word-break: break-all;
.editbtn {
display: inline-block;
background: white;
padding: 2px 5px;
border: 1px solid #333333;
margin-right: 10px;
margin-bottom: 10px;
border-radius: 3px;
}
}
input {
margin-top: 15px;
display: block;
width: 50vw;
height: 42px;
padding-left: 10px;
border: none;
}
.checkbox {
display: flex;
align-items: center;
height: 30px;
label {
display: flex;
align-items: center;
height: 30px;
input {
margin: 0;
height: 20px;
width: 20px;
}
}
}
.create-btn-container {
margin-bottom: 25px;
.create-btn {
padding-left: 17px;
padding-right: 17px;
// width: 197px;
line-height: 34px;
box-sizing: border-box;
border: none;
font-size: 16px;
height: 34px;
background: linear-gradient(
266deg,
rgba(255, 171, 32, 1) 0%,
rgba(255, 114, 14, 1) 100%
);
box-shadow: 0px 2px 8px 0px rgba(255, 167, 31, 0.31);
border-radius: 22px;
}
}
.edit-input {
width: 97%;
background: #f5f5f5;
border-radius: 6px;
font-size: 14px;
color: rgba(51, 51, 51, 1);
margin-top: 0;
}
</style>
src/views/tempaltes/editMore.vue
......@@ -191,13 +191,24 @@
</div>
</slider>
</div>
<div class="group-menu" v-if="templateData.listData[currentPage]">
<slider :list="templateData.listData[currentPage].itemList">
<div
class="group-menu-item"
:class="itemListIndex===scope.index? 'group-menu-item-active': ''"
@click="setItemListIndex(scope.index)"
slot-scope="scope"
>{{scope.slider.name}}</div>
</slider>
</div>
<div class="content-right">
<div class="title">编辑栏</div>
<!-- <div class="title">编辑栏</div> -->
<div class="edit-area">
<div v-if="templateData.listData[currentPage]">
<editMenu
v-if="loaded "
:itemList="templateData.listData[currentPage].itemList"
:item="templateData.listData[currentPage].itemList[itemListIndex]"
:schemaData="templateData.listData[currentPage].schemaData"
:frameUrl="templateData.frameUrl"
@setList="setList"
......@@ -298,6 +309,7 @@ export default {
pageViews: false,
isPreview: false,
currentPage: 0,
itemListIndex: 0,
deviceList: [
{
clientId: "maxrocky",
......@@ -403,6 +415,9 @@ export default {
document.body.appendChild(newImg);
});
},
setItemListIndex(index) {
this.itemListIndex = index;
},
onSheetSelect(item) {
this.showSheet = false;
if (item.action === "createPage") {
......@@ -656,6 +671,7 @@ export default {
window.wx.miniProgram.navigateTo({
url: `/pages/home/film/schedule_add/components/device/index?fId=${filmId}`
});
this.$toast.clear()
},
getFilmId() {
const filmId =
......@@ -663,6 +679,11 @@ export default {
return filmId;
},
enterSubmit() {
this.$toast.loading({
overlay: true,
message: "加载中...",
forbidClick: true
});
this.message({
type: "getList"
});
......@@ -802,6 +823,66 @@ export default {
background: lightblue;
}
}
.group-menu {
// box-shadow:0px -1px 0px 0px rgba(0,0,0,0.1);
border-bottom: 0.5px solid rgba(0, 0, 0, 0.2);
display: flex;
// height: calc(100vh - 96px);
background: #fff;
padding: 0px 10px;
padding-right: 10px;
width: 100%;
box-sizing: border-box;
overflow: auto;
.swiper-slide {
width: auto;
}
.group-menu-item {
position: relative;
// width: 80px;
height: 40px;
line-height: 40px;
img {
border: 1px dashed #666;
width: 100%;
box-sizing: border-box;
}
// line-height: 65px;
margin: 0 20px;
font-size: 15px;
color: rgba(153, 153, 153, 1);
.close {
position: absolute;
top: 0;
right: 0;
}
}
.group-menu-item-active {
color: rgba(255, 145, 16, 1);
font-size: 16px;
position: relative;
&::after {
content: "";
position: absolute;
width: 19px;
height: 4px;
background: rgba(255, 145, 16, 1);
box-shadow: 0px 1px 4px 1px rgba(233, 145, 42, 0.43);
border-radius: 2px;
left: calc(50% - 9.5px);
bottom: 0;
}
}
.activePage {
img {
border: 2px solid red;
}
}
.sortable-chosen {
background: lightblue;
}
}
.content-left {
// padding-top: 10px;
flex: 1;
......@@ -907,29 +988,36 @@ export default {
box-sizing: border-box;
// display: flex;
// justify-content: center;
padding: 0 calc((100vw - 343px) / 2);
position: relative;
width: 344px;
margin: 0 auto;
}
.iframe-container2 {
box-sizing: border-box;
// display: flex;
// justify-content: center;
padding: 0 calc((100vw - 193px) / 2);
width: 194px !important;
margin: 0 auto;
}
.iframe {
width: 343px;
width: 100%;
margin: 0 auto;
// margin-left: 16px;
height: 193px;
height: 194px;
display: block;
box-shadow: 0px 14px 27px 0px rgba(0, 0, 0, 0.16);
position: relative;
// position: absolute;
overflow: hidden;
transform: translate3d(0, 0, 0) scale(1);
}
.viframe {
position: relative;
width: 193px !important;
overflow: hidden;
// position: absolute;
width: 100% !important;
margin: 0 auto;
// margin-left: 91px;
height: 343px;
height: 344px;
}
}
.content-left-v {
......@@ -1192,8 +1280,8 @@ export default {
bottom: 0;
left: 0;
right: 0;
padding: 20px 40px;
padding-bottom: 20px;
padding: 10px 40px;
padding-bottom: 10px;
display: flex;
z-index: 1000;
justify-content: space-between;
......
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