0017
/
iot-ui-vue
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

style(home): 调整首页样式、屏蔽文档按钮

This commit is contained in:
fhysy 2025-04-14 13:47:27 +08:00
parent fd55550e53
commit e177a17182
7 changed files with 27 additions and 22 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
src/components/Layout/BasicLayoutPage.vue
View File

@ -20,7 +20,7 @@
</template> </template>
<template #rightContentRender> <template #rightContentRender>
<div class="right-content"> <div class="right-content">
<AIcon type="QuestionCircleOutlined" @click="toDoc" /> <!-- <AIcon type="QuestionCircleOutlined" @click="toDoc" />-->
<Notice style="margin: 0 24px" /> <Notice style="margin: 0 24px" />
<UserInfo /> <UserInfo />
</div> </div>

5
src/views/home/components/BootCard.vue
View File

@ -8,7 +8,7 @@
v-for="(item, index) in cardData" v-for="(item, index) in cardData"
@click="jumpPage(item)" @click="jumpPage(item)"
> >
<div class="item-english">{{ item.english }}</div> <!-- <div class="item-english">{{ item.english }}</div>-->
<div class="item-title">{{ item.label }}</div> <div class="item-title">{{ item.label }}</div>
<img <img
class="item-image" class="item-image"
@ -94,10 +94,11 @@ const jumpPage = (item: bootConfig) => {
color: @text-color; color: @text-color;
font-weight: 700; font-weight: 700;
font-size: 20px; font-size: 20px;
line-height: 53.22px;
} }
.item-image { .item-image {
position: absolute; position: absolute;
right: 10%; right: 0;
bottom: 0; bottom: 0;
} }
&::after { &::after {

14
src/views/home/components/BootCardSmall.vue
View File

@ -12,7 +12,7 @@
<img :src="item.image" alt="" /> <img :src="item.image" alt="" />
</div> </div>
<div class="intro"> <div class="intro">
<div class="item-english">{{ item.english }}</div> <!-- <div class="item-english">{{ item.english }}</div>-->
<div class="item-label">{{ item.label }}</div> <div class="item-label">{{ item.label }}</div>
</div> </div>
</div> </div>
@ -83,7 +83,7 @@ const jumpPage = (item: bootConfig) => {
//border-color: rgb(238, 238, 238) rgb(238, 238, 238) //border-color: rgb(238, 238, 238) rgb(238, 238, 238)
// rgb(238, 238, 238) rgb(133, 165, 255); // rgb(238, 238, 238) rgb(133, 165, 255);
//border: 1px solid #e6e6e6; //border: 1px solid #e6e6e6;
padding: 11px; padding: 11px 8.6%;
//background: linear-gradient(0deg, #FFFFFF, #FFFFFF), linear-gradient(135.62deg, rgba(47, 84, 235, 0.07) 22.27%, rgba(47, 84, 235, 0.01) 91.82%); //background: linear-gradient(0deg, #FFFFFF, #FFFFFF), linear-gradient(135.62deg, rgba(47, 84, 235, 0.07) 22.27%, rgba(47, 84, 235, 0.01) 91.82%);
//border-radius: 2px; //border-radius: 2px;
//box-shadow: -2px 0 #85A5FF; //box-shadow: -2px 0 #85A5FF;
@ -103,18 +103,18 @@ const jumpPage = (item: bootConfig) => {
.item-label { .item-label {
//color: #252526; //color: #252526;
font-size: 18px; font-size: 18px;
//font-weight: 700; font-weight: 600;
font-weight: 400;
color: #333333; color: #333333;
//line-height: 44px; line-height: 50.28px;
margin-left: 10px;
} }
} }
.right-bj { .right-bj {
position: absolute; position: absolute;
right: 10%; right: 0;
bottom: 0; bottom: 0;
width: 37px; //width: 20%;
} }
&:hover { &:hover {
background: linear-gradient(90deg, #E9F8FF 0%, #D9EDFF 46%, #E9F8FF 100%); background: linear-gradient(90deg, #E9F8FF 0%, #D9EDFF 46%, #E9F8FF 100%);

10
src/views/home/components/ComprehensiveHome/index.vue
View File

@ -113,7 +113,7 @@ const deviceStepDetails: recommendList[] = [
title: $t('ComprehensiveHome.index.926510-6'), title: $t('ComprehensiveHome.index.926510-6'),
details: details:
$t('ComprehensiveHome.index.926510-9'), $t('ComprehensiveHome.index.926510-9'),
iconUrl: '/images/home/bottom-4.png', iconUrl: '/images/home/bottom-1.png',
linkUrl: 'device/Product', linkUrl: 'device/Product',
auth: productPermission('add'), auth: productPermission('add'),
params: { params: {
@ -124,7 +124,7 @@ const deviceStepDetails: recommendList[] = [
title: $t('ComprehensiveHome.index.926510-10'), title: $t('ComprehensiveHome.index.926510-10'),
details: details:
$t('ComprehensiveHome.index.926510-11'), $t('ComprehensiveHome.index.926510-11'),
iconUrl: '/images/home/bottom-1.png', iconUrl: '/images/home/bottom-2.png',
linkUrl: 'device/Product/Detail', linkUrl: 'device/Product/Detail',
auth: productPermission('update'), auth: productPermission('update'),
onClick: () => { onClick: () => {
@ -134,7 +134,7 @@ const deviceStepDetails: recommendList[] = [
{ {
title: $t('ComprehensiveHome.index.926510-12'), title: $t('ComprehensiveHome.index.926510-12'),
details: $t('ComprehensiveHome.index.926510-13'), details: $t('ComprehensiveHome.index.926510-13'),
iconUrl: '/images/home/bottom-5.png', iconUrl: '/images/home/bottom-3.png',
linkUrl: 'device/Instance', linkUrl: 'device/Instance',
auth: devicePermission('add'), auth: devicePermission('add'),
params: { params: {
@ -145,7 +145,7 @@ const deviceStepDetails: recommendList[] = [
title: $t('ComprehensiveHome.index.926510-14'), title: $t('ComprehensiveHome.index.926510-14'),
details: details:
$t('ComprehensiveHome.index.926510-15'), $t('ComprehensiveHome.index.926510-15'),
iconUrl: '/images/home/bottom-2.png', iconUrl: '/images/home/bottom-4.png',
linkUrl: 'device/Instance/Detail', linkUrl: 'device/Instance/Detail',
auth: devicePermission('update'), auth: devicePermission('update'),
onClick: () => { onClick: () => {
@ -155,7 +155,7 @@ const deviceStepDetails: recommendList[] = [
{ {
title: $t('ComprehensiveHome.index.926510-16'), title: $t('ComprehensiveHome.index.926510-16'),
details: $t('ComprehensiveHome.index.926510-17'), details: $t('ComprehensiveHome.index.926510-17'),
iconUrl: '/images/home/bottom-3.png', iconUrl: '/images/home/bottom-5.png',
linkUrl: 'device/Instance', linkUrl: 'device/Instance',
auth: devicePermission('import'), auth: devicePermission('import'),
params: { params: {

4
src/views/home/components/PlatformPicCard.vue
View File

@ -2,7 +2,7 @@
<div class="platform-pic-container"> <div class="platform-pic-container">
<div class="title"> <div class="title">
<span>{{ $t('components.PlatformPicCard.926510-0') }}</span> <span>{{ $t('components.PlatformPicCard.926510-0') }}</span>
<p>PLATFORM ARCHITECTURE DIAGRAM</p> <!-- <p>PLATFORM ARCHITECTURE DIAGRAM</p>-->
</div> </div>
<div class='plaid'></div> <div class='plaid'></div>
<div <div
@ -48,7 +48,7 @@ const props = defineProps({
width: 100%; width: 100%;
height: calc(100% - 50px); height: calc(100% - 50px);
margin-top: 40px; margin-top: 40px;
background-size: 85%; background-size: auto 90%;
background-position: center; background-position: center;
background-repeat: no-repeat; background-repeat: no-repeat;
} }

11
src/views/home/components/StepCard.vue
View File

@ -12,8 +12,8 @@
<div class="box-list"> <div class="box-list">
<div class="list-item" v-for="item in props.dataList"> <div class="list-item" v-for="item in props.dataList">
<div class="item-content"> <div class="item-content" @click="jumpPage(item)">
<div class="box-top" @click="jumpPage(item)"> <div class="box-top">
<img :src="item.iconUrl" alt="" /> <img :src="item.iconUrl" alt="" />
<span class="top-title">{{ item.title }}</span> <span class="top-title">{{ item.title }}</span>
</div> </div>
@ -86,6 +86,7 @@ const jumpPage = (row: recommendList) => {
.list-item { .list-item {
flex: 1; flex: 1;
position: relative; position: relative;
cursor: pointer;
.item-content { .item-content {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
@ -101,17 +102,19 @@ const jumpPage = (row: recommendList) => {
color: #333; color: #333;
font-weight: 700; font-weight: 700;
font-size: 14px; font-size: 14px;
cursor: pointer;
img { img {
position: absolute; position: absolute;
top: 0; top: 0;
right: 0; left: 0;
z-index: 1; z-index: 1;
height: 100%; height: 100%;
transform: scale(0.7);
} }
span { span {
position: relative; position: relative;
padding-left: 30px;
z-index: 2; z-index: 2;
} }
} }

3
src/views/home/index.vue
View File

@ -136,7 +136,8 @@ if (isNoCommunity) {
left: 0; left: 0;
background-color: rgba(0, 0, 0, 0); background-color: rgba(0, 0, 0, 0);
border: 1px solid rgba(0, 0, 0, 0); border: 1px solid rgba(0, 0, 0, 0);
transform: translateY(-50%); transform: translateY(-50%) scale(0.65);
//content: ' '; //content: ' ';
width: 20px; width: 20px;
height: 20px; height: 20px;