aidlab/FiDA_Front
7
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

preview的peport页面

Browse Source
This commit is contained in:
X1627315083@163.com
2026-02-23 13:28:43 +08:00
parent d1e70c166c
commit 5c00b54f27
20 changed files with 112 additions and 16 deletions
Download Patch File Download Diff File Expand all files Collapse all files

102
src/views/home/agent/components/Preview.vue
View File

@@ -13,6 +13,30 @@
<img :src="LoadingImg" alt="" />
</div>
</template>
<div v-else class="reportBorder">
<div class="report">
<div v-if="false" class="report-content-null">
<img :src="reportNull" alt="" />
</div>
<div v-else class="report-content">
<div class="">
</div>
<div class="downBtnBox">
<div class="downBtn">
<div class="icon">
<SvgIcon name="reportDown" size="16"></SvgIcon>
</div>
<span>{{ $t('agent.Download') }}</span>
</div>
</div>
<div class="content">
# 一级标题
</div>
</div>
</div>
</div>
</div>
</template>
@@ -20,6 +44,7 @@
import { ref } from 'vue'
import Menu from './Menu.vue'
import LoadingImg from '@/assets/images/sketch-loading.gif'
import reportNull from '@/assets/images/reportNull.png'
const props = withDefaults(
defineProps<{
@@ -45,6 +70,8 @@
<style lang="less" scoped>
.preview-container {
width: 100%;
height: 100%;
gap: 1.2rem;
flex-wrap: wrap;
.sketch-item {
@@ -71,12 +98,75 @@
border: 0.2rem solid #e5e5e5;
font-family: 'GeneralMedium';
font-size: 1.4rem;
padding: 0 0.9rem 0 1.4rem;
cursor: pointer;
img{
width: 1.8rem;
height: 1.8rem;
}
padding: 0 0.9rem 0 1.4rem;
cursor: pointer;
img{
width: 1.8rem;
height: 1.8rem;
}
}
}
.reportBorder{
position: relative;
display: flex;
align-items: center;
justify-content: center;
--border-width: 3px;
flex: 1;
&::before {
content: '';
position: absolute;
background: linear-gradient(119.03deg, rgba(233, 121, 60, 0.3) 1.61%, rgba(255, 207, 144, 0.3) 101.01%);
border-radius: 2.3rem;
z-index: -1;
width: 100%;
height: 100%;
left: -50%;
top: -50%;
transform: translate(50%, 50%);
}
.report {
background-color: #fff;
width: calc(100% - var(--border-width) * 2);
height: calc(100% - var(--border-width) * 2);
border-radius: 2rem;
display: flex;
.report-content-null{
flex: 1;
display: flex;
align-items: center;
justify-content: center;
}
.report-content{
flex: 1;
display: flex;
flex-direction: column;
.downBtnBox{
padding: 2.2rem 5.2rem 0;
.downBtn{
display: flex;
width: 11.2rem;
justify-content: center;
margin-left: auto;
line-height: 3.2rem;
border-radius: 5px;
background-color: #ff7a51;
color: #fff;
cursor: pointer;
.icon{
margin-right: .02rem;
}
span{
font-weight: 500;
font-size: 1.2rem;
}
}
}
.content{
word-break: break-word;
white-space: pre-wrap;
}
}
}
}
}