feat: 优化首页布局和样式,提升用户界面体验
This commit is contained in:
parent
3f3486de07
commit
7d91c52204
|
|
@ -1,7 +1,7 @@
|
|||
<template>
|
||||
<div class="container">
|
||||
<div class="all" :class="{ 'scale-down': isScaleDown }">
|
||||
<img src="../../../assets/homenew/web_bg.png" class="web_bg scale-1" />
|
||||
|
||||
<!-- <img src="../../../assets/homenew/web_bg.png" class="web_bg scale-1" /> -->
|
||||
<div class="left">
|
||||
<div class="content_nol">
|
||||
<Title title="企业舆情" />
|
||||
|
|
@ -14,13 +14,15 @@
|
|||
</div>
|
||||
|
||||
<div class="yuqing_right">
|
||||
<div v-if="yqList && yqList.length > 0" class="yqright_item" v-for="(item, index) in yqList" :key="index">
|
||||
<template v-if="yqList && yqList.length > 0">
|
||||
<div class="yqright_item" v-for="(item, index) in yqList" :key="index">
|
||||
<div @click="clickYuqing(item)" style="display: flex; align-items: center">
|
||||
<img src="../../../assets/homenew/tag_blue.png" />
|
||||
<text class="yqright_title">{{ item.subject }}</text>
|
||||
</div>
|
||||
<text class="yqright_time">{{ item.postTime }}</text>
|
||||
</div>
|
||||
</template>
|
||||
<div v-else class="empty" style="margin-top: 40px">
|
||||
<img src="../../../assets/homenew/nonews_icon.png" class="icon_empty" />
|
||||
<text class="empty_text">暂无最新信息</text>
|
||||
|
|
@ -45,12 +47,12 @@
|
|||
|
||||
<div class="menus">
|
||||
<div style="display: flex; align-items: center; margin-top: 20px">
|
||||
<div v-for="(item, index) in menuStepList">
|
||||
<div v-for="(item, index) in menuStepList" :key="index">
|
||||
<TopWithArrow :title="item.title" :index="index" :size="menuStepList.length" />
|
||||
</div>
|
||||
</div>
|
||||
<div style="display: flex; gap: 10px; margin-top: 15px">
|
||||
<div v-for="(item, index) in menuItem" class="menu_items">
|
||||
<div v-for="(item, index) in menuItem" class="menu_items" :key="index">
|
||||
<MenuItem :title="item.title" :name="item.name" :index="index" :supported="item.supported" :item="item" />
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -180,6 +182,7 @@
|
|||
</div> -->
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts" name="dashboard">
|
||||
|
|
@ -573,26 +576,32 @@ onUnmounted(() => {
|
|||
/* 计算缩放后的偏移量,使内容居中 */
|
||||
transform-origin: top center;
|
||||
/* 调整容器宽度,避免边缘被截断 */
|
||||
width: calc(1 / var(--scale-ratio, 0.8) * 100%);
|
||||
// width: calc(1 / var(--scale-ratio, 0.8) * 100%);
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
.scale-1 {
|
||||
/* 缩放内容 */
|
||||
transform: scale(1.5);
|
||||
transform: scale(1);
|
||||
/* 计算缩放后的偏移量,使内容居中 */
|
||||
/* 调整容器宽度,避免边缘被截断 */
|
||||
margin: 0 auto;
|
||||
width: 100vw;
|
||||
}
|
||||
|
||||
.container {
|
||||
width: 100%;
|
||||
background: url('/@/assets/homenew/web_bg.png') #f9fbff no-repeat center 0;
|
||||
background-size: 100% auto;
|
||||
}
|
||||
|
||||
.all {
|
||||
display: flex;
|
||||
position: relative;
|
||||
text-align: center;
|
||||
justify-content: center;
|
||||
padding-bottom: 20px;
|
||||
// background: url('/@/assets/images/bk_charts1.png') #f9fbff no-repeat center 0;
|
||||
// background: url('/@/assets/homenew/web_bg.png') #f9fbff no-repeat center 0;
|
||||
// background-size: 100% auto;
|
||||
|
||||
.left {
|
||||
|
|
|
|||
Loading…
Reference in New Issue