From afdca5cb7b8d5c735ab70926e4f5853d904991c6 Mon Sep 17 00:00:00 2001
From: 马宇豪 <978517621@qq.com>
Date: 星期四, 14 十二月 2023 13:54:53 +0800
Subject: [PATCH] 修改样式
---
src/views/components/notice.vue | 11 +--
src/views/homePage.vue | 14 ++--
src/views/components/laws.vue | 23 ++-----
src/views/components/details.vue | 4
src/views/components/home.vue | 51 +++++++----------
src/views/components/publish.vue | 21 ++----
6 files changed, 49 insertions(+), 75 deletions(-)
diff --git a/src/views/components/details.vue b/src/views/components/details.vue
index f38d641..5f3c534 100644
--- a/src/views/components/details.vue
+++ b/src/views/components/details.vue
@@ -229,7 +229,7 @@
display: flex;
flex-direction: column;
align-items: center;
- margin-top: 160px;
+ margin-top: 150px;
.header{
width: 1200px;
@@ -252,7 +252,7 @@
box-shadow: 1px 1px 3px rgba(0,0,0,.04);
padding: 20px 15px 40px;
background: #fff;
- max-height: calc(100vh - 310px);
+ max-height: calc(100vh - 330px);
overflow-y: auto;
.title{
diff --git a/src/views/components/home.vue b/src/views/components/home.vue
index e3cd338..94d2fac 100644
--- a/src/views/components/home.vue
+++ b/src/views/components/home.vue
@@ -19,8 +19,7 @@
</div>
</div>
</div>
-
- <div class="login-container list-container">
+ <div class="login-container">
<login-form ref="loginRef"/>
</div>
@@ -42,7 +41,6 @@
</div>
</div>
</div>
-
<div class="list-container">
<div class="tit">
<div>
@@ -127,7 +125,7 @@
const getPubList = async ()=>{
const res = await getPublish({title: '', content: '', pageNum: 1, pageSize: 5})
if(res.code == 200){
- state.pubList = res.data.list
+ state.pubList = res.data.list.filter(item => item.publication == 0)
}else{
ElMessage.warning(res.message)
}
@@ -147,37 +145,40 @@
display: flex;
flex-direction: column;
align-items: center;
- margin-top: 160px;
+ margin-top: 150px;
.main-content{
width: 1200px;
- height: calc(100vh - 250px);
- margin: 15px 0;
+ margin: 15px 0 50px;
+ display: grid;
+ grid-gap: 15px;
+ grid-template-columns: repeat(2, 1fr);
+ grid-template-rows: repeat(2, 350px);
+ grid-auto-flow: row;
+ justify-content: center;
color: #333;
- display: flex;
- flex-wrap: wrap;
- align-items: center;
+
+ .login-container{
+ border-radius: 4px;
+ box-shadow: 1px 1px 3px rgba(0,0,0,.04);
+ padding: 0 15px;
+ overflow: hidden;
+ background: url("../../assets/images/login-bg.jpg");
+ }
.list-container{
border-radius: 4px;
- width: calc(50% - 7.5px);
- height: calc(50% - 7.5px);
- margin-bottom: 15px;
box-shadow: 1px 1px 3px rgba(0,0,0,.04);
padding: 0 15px;
overflow: hidden;
background: #fff url("../../assets/images/city-bg.png") no-repeat right bottom;
background-size: 40% auto;
- &:nth-of-type(2n+1){
- margin-right: 15px;
- }
-
.tit{
display: flex;
align-items: center;
justify-content: space-between;
- height: 50px;
+ padding: 10px 0;
border-bottom: 1px solid #ebeef5;
&>div{
display: flex;
@@ -189,20 +190,14 @@
}
.list{
width: 100%;
- height: calc(100% - 60px);
- padding: 5px 0;
- margin-top: 5px;
- display: flex;
- flex-direction: column;
- justify-content: space-around;
+ margin-top: 10px;
&>div{
width: 100%;
- padding: 5px;
display: flex;
align-items: center;
cursor: pointer;
-
+ padding: 5px;
border-radius: 4px;
&>div:first-of-type{
@@ -240,10 +235,6 @@
}
}
}
- .login-container{
- background: url("../../assets/images/login-bg.jpg");
- }
-
}
}
</style>
diff --git a/src/views/components/laws.vue b/src/views/components/laws.vue
index e5d7187..6efb88d 100644
--- a/src/views/components/laws.vue
+++ b/src/views/components/laws.vue
@@ -3,8 +3,8 @@
<div class="main-content">
<div class="filters">
<el-form :model="state.querys">
- <el-form-item label="法律法规名称:" class="nameInput" style="font-size: 15px; width: 500px;margin-bottom: 0;margin-right: 20px">
- <el-input v-model="state.querys.title" placeholder="请输入名称" />
+ <el-form-item label="法律法规名称:" style="width: 500px;margin-bottom: 0;margin-right: 20px">
+ <el-input v-model="state.querys.title" />
</el-form-item>
</el-form>
<el-button type="primary" :icon="Search" class="searchBtn" v-model="state.querys.title" @click="search">搜索</el-button>
@@ -13,7 +13,7 @@
<div class="list">
<div v-for="item in state.dataList" @click="openDetails('法律法规',item.id)">
<div>
- <div><img :src="articlePng"></div>
+ <div><img src="src/assets/images/article.png"></div>
<div>{{item.title}}</div>
</div>
<span>
@@ -41,7 +41,6 @@
import useUserStore from '@/store/modules/user'
import { Search, Refresh } from '@element-plus/icons-vue'
import {ElMessage} from "element-plus";
-import articlePng from "@/assets/images/article.png";
const emit = defineEmits(['openDetails'])
const route = useRoute()
const router = useRouter()
@@ -118,17 +117,9 @@
width: 100%;
display: flex;
justify-content: center;
- margin-top: 160px;
+ margin-top: 150px;
:deep(.el-form .el-form-item__label) {
font-size: 16px;
- }
- :deep(.el-form-item){
- align-items: center;
- }
- .nameInput{
- :deep(.el-input__inner){
- --el-input-inner-height: 38px;
- }
}
.main-content{
@@ -170,12 +161,12 @@
.list{
padding: 15px 0;
- height: calc(100vh - 392px);
+ height: calc(100vh - 332px);
overflow-y: auto;
&>div{
display: flex;
- padding: 10px;
+ padding: 8px;
align-items: center;
justify-content: space-between;
border-bottom: 1px dashed #ebeef5;
@@ -223,7 +214,7 @@
.pag-container{
width: 100%;
- height: 80px;
+ height: 60px;
display: flex;
align-items: center;
justify-content: right;
diff --git a/src/views/components/notice.vue b/src/views/components/notice.vue
index e61600e..b4cfede 100644
--- a/src/views/components/notice.vue
+++ b/src/views/components/notice.vue
@@ -4,7 +4,7 @@
<div class="list">
<div v-for="item in state.dataList" @click="openDetails('通知公告',item.id)">
<div>
- <div><img :src="articlePng"></div>
+ <div><img src="src/assets/images/article.png"></div>
<div>{{item.title}}</div>
</div>
<span>
@@ -31,7 +31,6 @@
import { getNotice } from '@/api/home/homePage'
import useUserStore from '@/store/modules/user'
import {ElMessage} from "element-plus";
-import articlePng from "@/assets/images/article.png";
const emit = defineEmits(['openDetails'])
const route = useRoute()
const router = useRouter()
@@ -96,7 +95,7 @@
width: 100%;
display: flex;
justify-content: center;
- margin-top: 160px;
+ margin-top: 150px;
.main-content{
width: 1200px;
@@ -109,12 +108,12 @@
.list{
padding: 15px 0;
- height: calc(100vh - 330px);
+ height: calc(100vh - 280px);
overflow-y: auto;
&>div{
display: flex;
- padding: 10px;
+ padding: 8px;
align-items: center;
justify-content: space-between;
border-bottom: 1px dashed #ebeef5;
@@ -162,7 +161,7 @@
.pag-container{
width: 100%;
- height: 80px;
+ height: 60px;
display: flex;
align-items: center;
justify-content: right;
diff --git a/src/views/components/publish.vue b/src/views/components/publish.vue
index 1dae045..9f8e290 100644
--- a/src/views/components/publish.vue
+++ b/src/views/components/publish.vue
@@ -4,7 +4,7 @@
<div class="filters">
<el-form :model="state.querys" style="display:flex;">
<el-form-item label="机构名称:" class="nameInput" style="width: 300px;margin-bottom: 0;margin-right: 20px;">
- <el-input v-model="state.querys.name" placeholder="请输入机构名称" />
+ <el-input v-model="state.querys.name" />
</el-form-item>
<el-form-item label="所在地市:" style="margin-bottom: 0;margin-right: 20px">
<el-cascader
@@ -14,11 +14,10 @@
:props="props"
@change="handleChange"
style="width: 100%"
- size="large"
/>
</el-form-item>
<el-form-item label="业务范围:" style="margin-bottom: 0;margin-right: 20px">
- <el-select v-model="state.querys.business" placeholder="请选择业务范围" multiple size="large" style="width: 100%">
+ <el-select v-model="state.querys.business" placeholder="请选择业务范围" multiple style="width: 100%">
<el-option
v-for="item in state.busList"
:key="item.id"
@@ -34,7 +33,7 @@
<div class="list">
<div v-for="item in state.dataList" @click="openDetails('机构公示',item.id)">
<div>
- <div><img :src="articlePng"></div>
+ <div><img src="src/assets/images/article.png"></div>
<div>{{item.name}}</div>
</div>
<span>
@@ -64,7 +63,6 @@
import {ElMessage} from "element-plus";
import {getRegionTree} from "@/api/area";
import {getDict} from "@/api/login";
-import articlePng from "@/assets/images/article.png";
const emit = defineEmits(['openDetails'])
const route = useRoute()
const router = useRouter()
@@ -210,17 +208,12 @@
width: 100%;
display: flex;
justify-content: center;
- margin-top: 160px;
+ margin-top: 150px;
:deep(.el-form .el-form-item__label) {
font-size: 16px;
}
:deep(.el-form-item){
align-items: center;
- }
- .nameInput{
- :deep(.el-input__inner){
- --el-input-inner-height: 38px;
- }
}
.main-content{
@@ -262,12 +255,12 @@
.list{
padding: 15px 0;
- height: calc(100vh - 392px);
+ height: calc(100vh - 332px);
overflow-y: auto;
&>div{
display: flex;
- padding: 10px;
+ padding: 8px;
align-items: center;
justify-content: space-between;
border-bottom: 1px dashed #ebeef5;
@@ -315,7 +308,7 @@
.pag-container{
width: 100%;
- height: 80px;
+ height: 60px;
display: flex;
align-items: center;
justify-content: right;
diff --git a/src/views/homePage.vue b/src/views/homePage.vue
index a51e1dc..f62bb49 100644
--- a/src/views/homePage.vue
+++ b/src/views/homePage.vue
@@ -167,7 +167,7 @@
justify-content: center;
.top-cont{
width: 1200px;
- height: 90px;
+ height: 80px;
display: flex;
align-items: center;
justify-content: space-between;
@@ -176,14 +176,14 @@
.logo{
font-size: 2rem;
font-weight: 800;
- height: 90px;
- line-height: 90px;
+ height: 80px;
+ line-height: 80px;
font-family: "PingFang SC";
}
.time{
font-size: 16px;
- height: 90px;
+ height: 80px;
display: flex;
flex-direction: column;
justify-content: center;
@@ -201,7 +201,7 @@
width: 100%;
height: 70px;
position: fixed;
- top: 90px;
+ top: 80px;
left: 0;
.nav-cont{
width: 1200px;
@@ -250,8 +250,8 @@
}
.el-login-footer {
- height: 60px;
- line-height: 60px;
+ height: 40px;
+ line-height: 40px;
position: fixed;
bottom: 0;
width: 100%;
--
Gitblit v1.9.2