xrilang/xiaoju-survey
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix: 优化预览展示

Browse Source
This commit is contained in:
sudoooooo 2024-06-11 19:30:29 +08:00 committed by dayou
parent 304c813b17
commit 6ae9886cac
2 changed files with 38 additions and 41 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
web/components.d.ts vendored
View File

@ -46,8 +46,10 @@ declare module 'vue' {
IEpClose: typeof import('~icons/ep/close')['default']
IEpCopyDocument: typeof import('~icons/ep/copy-document')['default']
IEpDelete: typeof import('~icons/ep/delete')['default']
IEpIphone: typeof import('~icons/ep/iphone')['default']
IEpLoading: typeof import('~icons/ep/loading')['default']
IEpMinus: typeof import('~icons/ep/minus')['default']
IEpMonitor: typeof import('~icons/ep/monitor')['default']
IEpMore: typeof import('~icons/ep/more')['default']
IEpPlus: typeof import('~icons/ep/plus')['default']
IEpQuestionFilled: typeof import('~icons/ep/question-filled')['default']
@ -58,6 +60,8 @@ declare module 'vue' {
IEpSortDown: typeof import('~icons/ep/sort-down')['default']
IEpSortUp: typeof import('~icons/ep/sort-up')['default']
IEpTop: typeof import('~icons/ep/top')['default']
IEpView: typeof import('~icons/ep/view')['default']
IEpWarningFilled: typeof import('~icons/ep/warning-filled')['default']
RouterLink: typeof import('vue-router')['RouterLink']
RouterView: typeof import('vue-router')['RouterView']
}

75
web/src/management/pages/edit/modules/contentModule/PreviewPanel.vue
View File

@ -1,6 +1,6 @@
<template>
<div class="preview-panel">
<div class="preview-btn" @click="dialogTableVisible = true">
<div class="btn preview-btn" @click="dialogTableVisible = true">
<i-ep-view class="view-icon" :size="20" />
<span class="btn-txt">预览</span>
</div>
@ -17,30 +17,36 @@
>
<div class="ml75">
<div class="preview-tab">
<div :class="`preview-tab-item ${previewTab == 1 ? 'active' : ''}`" @click="previewTab = 1">
<i-ep-iphone />
</div>
<div :class="`preview-tab-item ${previewTab == 2 ? 'active' : ''}`" @click="previewTab = 2">
<i-ep-monitor />
</div>
</div>
<div :class="`preview-panel ${previewTab == 1 ? 'phone' : 'pc'}`">
<div class="wrapper">
<div class="tips-wrapper">
<i-ep-WarningFilled /> <span>用户预览模式，数据不保存！</span>
<div
:class="`preview-tab-item ${previewTab == 1 ? 'active' : ''}`"
@click="previewTab = 1"
>
<i-ep-iphone />
</div>
<div v-loading="loading" element-loading-text="加载中..." style="height: 100%">
<iframe
v-loading="loading"
id="iframe-preview"
:src="`/management/preview/${surveyId}`"
frameborder="0"
width="100%"
height="100%"
></iframe>
<div
:class="`preview-tab-item ${previewTab == 2 ? 'active' : ''}`"
@click="previewTab = 2"
>
<i-ep-monitor />
</div>
</div>
<div :class="`preview-panel ${previewTab == 1 ? 'phone' : 'pc'}`">
<div class="wrapper">
<div class="tips-wrapper">
<i-ep-WarningFilled /> <span>用户预览模式，数据不保存！</span>
</div>
<div v-loading="loading" element-loading-text="加载中..." style="height: 100%">
<iframe
v-loading="loading"
id="iframe-preview"
:src="`/management/preview/${surveyId}`"
frameborder="0"
width="100%"
height="100%"
></iframe>
</div>
</div>
</div>
</div>
</div>
</el-dialog>
</div>
@ -69,35 +75,22 @@ const closedDialog = () => {
}
</script>
<style lang="scss" scoped>
@import url('@/management/styles/edit-btn.scss');
.preview-panel {
:deep(.preview-config-wrapper) {
background-color: transparent;
box-shadow: none;
padding: 0;
}
.ml75{
.ml75 {
margin-left: 75px;
}
.preview-btn {
width: 50px;
display: flex;
flex-direction: column;
align-items: center;
color: #4a4c5b;
cursor: pointer;
i {
font-size: 20px;
}
.btn-txt {
font-size: 12px;
}
}
.view-icon {
font-size: 18px;
margin-bottom: 4px;
font-size: 20px;
height: 29px;
line-height: 29px;
}
.preview-tab {