sileya-ai
/
vr-uniapp
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

1.解决清空后双向绑定失效的问题

v1.0.0
sws 2024-09-06 18:42:00 +08:00
parent 03faa015e4
commit 1c28ed6347
3 changed files with 27 additions and 9 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
src/components/common/preview/index.vue
View File

@ -1,11 +1,11 @@
<template> <template>
<el-dialog v-model="dialog_visible" class="radius-lg" width="1168" draggable :close-on-click-modal="false" append-to-body> <el-dialog v-model="dialog_visible" class="radius-lg diy-preview" width="1168" :close-on-click-modal="false" append-to-body>
<template #header> <template #header>
<div class="title re"> <div class="title re">
<div class="middle size-16 fw">预览</div> <div class="middle size-16 fw">预览</div>
</div> </div>
</template> </template>
<div class="flex-row pt-16 iframe-content"> <div class="flex-row iframe-content">
<iframe :src="new_link" width="100%" height="100%" frameborder="0"></iframe> <iframe :src="new_link" width="100%" height="100%" frameborder="0"></iframe>
</div> </div>
</el-dialog> </el-dialog>
@ -47,6 +47,8 @@ watch(
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
.iframe-content { .iframe-content {
height: 60rem; height: 80rem;
width: calc(100% + 3.2rem);
margin: 0 -1.6rem -1.6rem -1.6rem;
} }
</style> </style>

14
src/styles/index.scss
View File

@ -212,3 +212,17 @@ p {
font-size: 1.2rem; font-size: 1.2rem;
} }
} }
// 弹窗样式调整
.diy-preview.el-dialog {
--el-dialog-margin-top: 0;
display: flex;
flex-direction: column;
margin: 0 !important;
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
max-height: calc(100% - 30px);
max-width: calc(100% - 30px);
}

14
src/views/layout/components/main/index.vue
View File

@ -4,13 +4,15 @@
<el-collapse v-model="activeNames"> <el-collapse v-model="activeNames">
<el-collapse-item v-for="(com, i) in components" :key="i" :title="com.name" :name="com.key"> <el-collapse-item v-for="(com, i) in components" :key="i" :title="com.name" :name="com.key">
<VueDraggable v-model="com.data" :animation="500" ghost-class="ghost" :group="{ name: 'people', pull: 'clone', put: false }" class="component flex-row flex-wrap" :clone="clone_item_com_data" :on-start="onStart" :sort="false" :force-fallback="true"> <VueDraggable v-model="com.data" :animation="500" ghost-class="ghost" :group="{ name: 'people', pull: 'clone', put: false }" class="component flex-row flex-wrap" :clone="clone_item_com_data" :on-start="onStart" :sort="false" :force-fallback="true">
<div v-for="item in com.data" :key="item.key" class="item"> <template v-if="com.data.length > 0">
<div class="main-border siderbar-hidden main-show tc">释放鼠标将组件添加到此处</div> <div v-for="item in com.data" :key="item.key" class="item">
<div class="siderbar-show main-hidden flex-col jc-c align-c gap-4"> <div class="main-border siderbar-hidden main-show tc">释放鼠标将组件添加到此处</div>
<img class="img radius-xs" :src="url_computer(item.key)" /> <div class="siderbar-show main-hidden flex-col jc-c align-c gap-4">
<div>{{ item.name }}</div> <img class="img radius-xs" :src="url_computer(item.key)" />
<div>{{ item.name }}</div>
</div>
</div> </div>
</div> </template>
</VueDraggable> </VueDraggable>
</el-collapse-item> </el-collapse-item>
</el-collapse> </el-collapse>