admin/zhgdlarge
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Merge branch 'yjl_dev' into 'shenzhen-dev'

Browse Source 
标题封装

See merge request !11
This commit is contained in:
袁晶琳 2023-09-05 14:40:07 +08:00
commit cebadc084e
15 changed files with 205 additions and 67 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

BIN
src/assets/images/titleIcon.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 52 KiB

BIN
src/assets/images/titleImg.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 436 KiB

BIN
src/assets/images/titleImg.webp
View File

Binary file not shown.
Side by Side

Before

Width:  |  Height:  |  Size: 519 KiB

43
src/components/card.vue
View File

@ -1,7 +1,10 @@
<template>
<div class="h-card">
<div class="title">
<i>{{ title }}</i>
<div><img src="@/assets/images/titleIcon.png" alt="" /></div>
<div class="titltText">
<i>{{ title }}</i>
</div>
</div>
<div class="content">
<slot></slot>
@ -10,12 +13,11 @@
</template>
<script>
import { ref } from "vue";
export default {
props: ["title"],
setup(props) {
return {};
}
props: ["title"],
setup(props) {
return {};
}
};
</script>
@ -24,22 +26,27 @@ export default {
width: 100%;
height: 100%;
.title {
height: 15%;
line-height: 4vh;
text-align: left;
font-size: calc(100vw * 18 / 1920);
color: #ffffff;
background: url("@/assets/images/titleImg.webp") no-repeat;
background: url("@/assets/images/titleImg.png") no-repeat;
background-size: 100% 100%;
i {
margin-left: 45px;
font-family: OPPOSansH;
display: flex;
div {
font-size: calc(100vw * 18 / 1920);
color: #ffffff;
img {
width: 110%;
margin-left: 30%;
}
i {
font-family: OPPOSansH;
}
}
.titltText {
margin: 1% 0 0 2%;
}
}
.content {
margin-top: 10px;
height: calc(100% - 34px);
margin-top: 2%;
height: 88%;
background: url("@/assets/images/cardImg.png") no-repeat;
background-size: 100% 100%;
}

7
src/routers/modules/staticRouter.ts
View File

@ -76,13 +76,8 @@ export const staticRouter: RouteRecordRaw[] = [
{
path: "/safetyManagement/securityManagement",
name: "安全管理",
component: () => import("@/views/sevenLargeScreen/safetyManagement/securityManagement.vue")
component: () => import("@/views/sevenLargeScreen/safetyManagement/securityManagement/index.vue")
},
{
path: "/safetyManagement/foundationPitMonitoring",
name: "基坑监测",
component: () => import("@/views/sevenLargeScreen/safetyManagement/foundationPitMonitoring.vue")
}
],
meta: {
title: "七参数大屏"

6
src/views/login/index.vue
View File

@ -1,4 +1,6 @@
<template>
<ScaleBox :width="1920" :height="1080" bgc="transparent" :delay="100" :isFlat="false">
<div class="loginBigImg">
<div class="loginTitle">
<div>数字化项目监管平台</div>
@ -38,9 +40,13 @@
</div>
</div>
</div>
</ScaleBox>
</template>
<script setup lang="ts" name="logonPage">
import ScaleBox from "vue3-scale-box";
import { ref, reactive, onMounted, onBeforeUnmount } from "vue";
import { useRouter } from "vue-router";
import { Login } from "@/api/interface";

23
src/views/sevenLargeScreen/indexL.vue
View File

@ -63,6 +63,9 @@
</div>
</div>
</div>
<div class="contentDate">
<span>自2022.02.28起开始计算，至今日2023.04.16为<span class="numColor">412</span>个日历天</span>
</div>
<div class="dataBoardContent">
<router-view></router-view>
</div>
@ -87,11 +90,7 @@ let menuList = ref([
{
menuName: "安全管理",
companyPath: "/safetyManagement/securityManagement"
},
{
companyPath: "/safetyManagement/foundationPitMonitoring",
menuName: "基坑监测"
},
}
]
},
{
@ -314,6 +313,19 @@ function jumpBgd() {
}
}
}
.contentDate {
color: #fff;
float: right;
margin-right: 2%;
font-size: 14px;
.numColor{
color: #82fbea;
font-family: sadigitalNumber;
font-size: 24px;
font-weight: bold;
}
}
.dataBoardContent {
height: 81%;
// height: calc(100% - 15px - 50px - 60px - 20px);
@ -327,7 +339,6 @@ function jumpBgd() {
display: inline-block;
height: 100%;
width: 90%;
// background: pink;
background: url("@/assets/images/dustNoise/menuImg.png") no-repeat;
background-size: 100% 100%;
color: #fff;

19
src/views/sevenLargeScreen/safetyManagement/foundationPitMonitoring.vue
View File

@ -1,19 +0,0 @@
<template>
<div class="box">
基坑监测
<div style="color: #fff;">456</div>
</div>
</template>
<script setup lang="ts">
</script>
<style scoped>
.box{
width: 100%;
height: 100%;
background-color: skyblue;
}
</style>

18
src/views/sevenLargeScreen/safetyManagement/securityManagement.vue
View File

@ -1,18 +0,0 @@
<template>
<div class="box">
安全管理
<div style="color: #fff;">123</div>
</div>
</template>
<script setup lang="ts">
</script>
<style scoped>
.box{
width: 100%;
height: 100%;
/* background-color: pink; */
}
</style>

19
src/views/sevenLargeScreen/safetyManagement/securityManagement/centerBottom.vue Normal file
View File

@ -0,0 +1,19 @@
<template>
<Card title="责任区域分析">
<div class="centerBottom">
111
</div>
</Card>
</template>
<script setup lang="ts">
import Card from "@/components/card.vue";
</script>
<style scoped lang="scss">
.centerBottom{
width: 100%;
height: 100%;
}
</style>

19
src/views/sevenLargeScreen/safetyManagement/securityManagement/centerTop.vue Normal file
View File

@ -0,0 +1,19 @@
<template>
<Card title="安全隐患统计">
<div class="centerTopBox">
111
</div>
</Card>
</template>
<script setup lang="ts">
import Card from "@/components/card.vue";
</script>
<style scoped lang="scss">
.centerTopBox{
width: 100%;
height: 100%;
}
</style>

60
src/views/sevenLargeScreen/safetyManagement/securityManagement/index.vue Normal file
View File

@ -0,0 +1,60 @@
<template>
<div class="safeContent">
<div class="left">
<leftTop class="leftTop"></leftTop>
<leftBottom class="leftBottom"></leftBottom>
</div>
<div class="center">
<centerTop class="centerTop"></centerTop>
<centerBottom class="centerBottom"></centerBottom>
</div>
<div class="right">
<rightBox class="rightBox"></rightBox>
</div>
</div>
</template>
<script setup lang="ts">
import leftTop from '@/views/sevenLargeScreen/safetyManagement/securityManagement/leftTop.vue'
import leftBottom from '@/views/sevenLargeScreen/safetyManagement/securityManagement/leftBottom.vue'
import centerTop from '@/views/sevenLargeScreen/safetyManagement/securityManagement/centerTop.vue'
import centerBottom from '@/views/sevenLargeScreen/safetyManagement/securityManagement/centerBottom.vue'
import rightBox from '@/views/sevenLargeScreen/safetyManagement/securityManagement/rightBox.vue'
</script>
<style lang="scss" scoped>
.safeContent{
width: 100%;
height: 100%;
display:flex;
.left{
width: 32%;
.leftTop{
height: 49%;
margin-bottom: 1.5%;
}
.leftBottom{
height: 49%;
margin-top: 3%;
}
}
.center{
width: 34%;
margin: 0 1%;
.centerTop{
height: 49%;
margin-bottom: 1.5%;
}
.centerBottom{
height: 49%;
margin-top: 3%;
}
}
.right{
width: 32%;
.rightBox{
height: 100%;
}
}
}
</style>

19
src/views/sevenLargeScreen/safetyManagement/securityManagement/leftBottom.vue Normal file
View File

@ -0,0 +1,19 @@
<template>
<Card title="隐患等级分析">
<div class="leftBottomBox">
111
</div>
</Card>
</template>
<script setup lang="ts">
import Card from "@/components/card.vue";
</script>
<style scoped lang="scss">
.leftBottomBox{
width: 100%;
height: 100%;
}
</style>

19
src/views/sevenLargeScreen/safetyManagement/securityManagement/leftTop.vue Normal file
View File

@ -0,0 +1,19 @@
<template>
<Card title="责任单位分析">
<div class="leftBox">
111
</div>
</Card>
</template>
<script setup lang="ts">
import Card from "@/components/card.vue";
</script>
<style scoped lang="scss">
.leftBox{
width: 100%;
height: 100%;
}
</style>

20
src/views/sevenLargeScreen/safetyManagement/securityManagement/rightBox.vue Normal file
View File

@ -0,0 +1,20 @@
<template>
<div class="rightBigBox">
<Card title="安全管理记录"> 111 </Card>
</div>
</template>
<script setup lang="ts">
import Card from "@/components/card.vue";
</script>
<style scoped lang="scss">
.rightBigBox {
width: 100%;
height: 100%;
}
::v-deep .h-card .content {
height: 94.2% !important;
}
</style>