Skip to content

A
agcs2.0-web
Commit 32048369 authored by miaojiale's avatar miaojiale
Browse files
Options

1.修改首页排名排版布局 

2.增加解决方案路由
parent e3d195a6
Hide whitespace changes
Inline Side-by-side
Showing with 134 additions and 79 deletions
src/components/layout/index.vue
View file @ 32048369
......@@ -108,6 +108,10 @@ export default {
route: "/casesharing",
name: "案例分享",
},
{
route: "/solution",
name: "解决方案",
},
],
loading: false,
rules: {
......@@ -159,7 +163,9 @@ export default {
const routerPath =
!this.redirect || this.redirect === "/404" ? "/" : this.redirect
this.$router.push({ path: routerPath }).catch((e) => {})
this.loading = false
setTimeout(() => {
this.loading = false
}, 800)
})
.catch((e) => {
this.loading = false
......
src/router/index.js
View file @ 32048369
......@@ -29,8 +29,8 @@ export const constantRoutes = [
component: () => import("@/views/Home/ScientificResearch/index"),
},
{
path: "/healthpopularization",
component: () => import("@/views/Home/HealthPopularization/index"),
path: "/solution",
component: () => import("@/views/Home/Solution/index"),
},
],
},
......
src/views/Home/Solution/index.vue 0 → 100644
View file @ 32048369
<template>
<div>解决方案</div>
</template>
<script>
export default {
data() {
return {}
},
methods: {},
mounted() {},
watch: {},
}
</script>
<style lang="scss" scoped></style>
src/views/Home/index.vue
View file @ 32048369
......@@ -35,7 +35,7 @@
<div class="box_title text-center">联盟地图</div>
<img class="map" src="~@/assets/img/Home/map.png" alt="" />
</div>
<div class="right box tabbox">
<div class="right box tabbox" style="height: 458px">
<el-tabs v-model="exTab">
<el-tab-pane
v-for="(e, index) in example"
......@@ -43,7 +43,7 @@
:label="e.title"
:name="e.title"
>
<ul class="tabslist" style="height: 100%">
<ul class="tabslist" style="height: 380px">
<li v-for="(item, index) in exampleList" :key="index">
<div class="left">
<div class="circle"></div>
......@@ -59,19 +59,22 @@
</div>
</div>
</div>
<!-- 健康科普 -->
<!-- 机构排名 -->
<div class="dataAnalysis">
<div class="flex" style="margin-bottom: 0px">
<div class="left box cenbox cenboxs" style="background: transparent">
<div class="range">
<div class="box cenbox cenboxs">
<div class="range left_range">
<div class="box_title text-center">累计上报量机构排名</div>
<div class="rangecontent">
<div class="top10"></div>
<div class="top20"></div>
<ul class="rangeList">
<li
v-for="(item, index) in rangeList"
:key="index"
:style="{ color: index < 3 ? '#4E68FF' : '#333333' }"
:style="{
color: index < 3 ? '#4E68FF' : '#333333',
alignSelf: index > 9 ? 'flex-end' : '',
}"
>
<div>{{ index + 1 }}</div>
<div>{{ item.unionName }}</div>
......@@ -88,7 +91,9 @@
<li
v-for="(item, index) in curQuarterList"
:key="index"
:style="{ color: index < 3 ? '#4E68FF' : '#333333' }"
:style="{
color: index < 3 ? '#4E68FF' : '#333333',
}"
>
<div>{{ index + 1 }}</div>
<div>{{ item.unionName }}</div>
......@@ -98,36 +103,32 @@
</div>
</div>
</div>
<div
class="right box tabbox"
style="background: transparent; padding-top: 0px"
>
<!-- 健康科普 -->
<div class="healthPopularization">
<div class="title_box">
<div class="title">健康科普</div>
<div class="empty"></div>
</div>
<ul class="typeList">
<li
v-for="(item, index) in typeList"
:key="index"
:style="{ backgroundImage: 'url(' + item.src + ')' }"
@click="
$router.push({
path: '/healthpopularization',
query: { tabIndex: index },
})
"
>
{{ item.name }}
</li>
</ul>
</div>
</div>
</div>
</div>
<!-- 健康科普 -->
<div class="healthPopularization">
<div class="title_box">
<div class="title">健康科普</div>
<div class="empty"></div>
</div>
<ul class="typeList">
<li
v-for="(item, index) in typeList"
:key="index"
:style="{ backgroundImage: 'url(' + item.src + ')' }"
@click="
$router.push({
path: '/healthpopularization',
query: { tabIndex: index },
})
"
>
{{ item.name }}
</li>
</ul>
</div>
<!-- 科学研究 -->
<div class="scientificresearch">
<div class="title_box">
......@@ -205,34 +206,6 @@ export default {
title: "典型案例小标题典型案例小标题",
date: "2022-09-26",
},
{
title: "典型案例小标题典型案例小标题",
date: "2022-09-26",
},
{
title: "典型案例小标题典型案例小标题",
date: "2022-09-26",
},
{
title: "典型案例小标题典型案例小标题",
date: "2022-09-26",
},
{
title: "典型案例小标题典型案例小标题",
date: "2022-09-26",
},
{
title: "典型案例小标题典型案例小标题",
date: "2022-09-26",
},
{
title: "典型案例小标题典型案例小标题",
date: "2022-09-26",
},
{
title: "典型案例小标题典型案例小标题",
date: "2022-09-26",
},
],
curTab: "新闻会议",
rangeList: [], // 上报排名
......@@ -297,14 +270,42 @@ export default {
getRankTotal() {
getRankTotal().then((res) => {
if (res.code == 1) {
this.rangeList = res.data
// this.rangeList = res.data
this.rangeList = [
{ unionName: "包头医学院第二附属医院", nums: 12311 },
{ unionName: "包头医学院第二附属医院", nums: 12311 },
{ unionName: "包头医学", nums: 12311 },
{ unionName: "包头医学院第二附属医院", nums: 12311 },
{ unionName: "包头医学院第二附属医院", nums: 12311 },
{ unionName: "包头医学院第二附属医院", nums: 12311 },
{ unionName: "包头医学院第二附属医院", nums: 12311 },
{ unionName: "包头医学院第二附属医院", nums: 12311 },
{ unionName: "包头医学院第二附属医院", nums: 12311 },
{ unionName: "包头医学院第二附属医院", nums: 12311 },
{ unionName: "包头医学院第二附属医院", nums: 12311 },
{ unionName: "包头医学院第二附属医院", nums: 12311 },
{ unionName: "包头医学院第二附属医院", nums: 12311 },
{ unionName: "包头医学院第二附属医院", nums: 12311 },
{ unionName: "包头医学院第二附属医院", nums: 12311 },
{ unionName: "包头医学院第二附属医院", nums: 12311 },
]
}
})
},
getCurrentQuarter() {
getCurrentQuarter().then((res) => {
if (res.code == 1) {
this.curQuarterList = res.data
// this.curQuarterList = res.data
this.curQuarterList = [
{ unionName: "包头医学院第二附属医院", nums: 12311 },
{ unionName: "包头医学院第二附属医院", nums: 12311 },
{ unionName: "包头医学院第二附属医院", nums: 12311 },
{ unionName: "包头医学院第二附属医院", nums: 12311 },
{ unionName: "包头医学院第二附属医院", nums: 12311 },
{ unionName: "包头医学院第二附属医院", nums: 12311 },
{ unionName: "包头医学院第二附属医院", nums: 12311 },
{ unionName: "包头医学院第二附属医院", nums: 12311 },
]
}
})
},
......@@ -319,7 +320,7 @@ export default {
margin-bottom: 38px;
.box {
width: 48%;
// height: 300px;
height: 300px;
// background: blue;
background: #fff;
.video {
......@@ -364,6 +365,9 @@ export default {
}
}
.dataAnalysis {
background: #fff;
margin-bottom: 32px;
padding: 32px;
.box_title {
width: 180px;
height: 36px;
......@@ -377,8 +381,6 @@ export default {
}
.cenbox {
height: 458px;
// background: url("~@/assets/img/Home/map.png") no-repeat center center;
// background-size: cover;
.map {
width: 100%;
height: 422px;
......@@ -386,21 +388,20 @@ export default {
}
}
.cenboxs {
width: 100%;
display: flex;
justify-content: space-between;
.range {
width: 46%;
width: 32%;
background: #ffffff;
border-radius: 4px;
border: 1px solid #d2d7f5;
padding: 0 7px;
.rangecontent {
margin-top: 6px;
margin-top: 24px;
height: 408px;
background: rgba(78, 104, 255, 0.06);
background: rgba(78, 104, 255, 0.04);
border-radius: 4px;
padding: 8px;
padding: 24px 32px;
font-size: 14px;
font-family: AlibabaPuHuiTiM;
// color: #4e68ff;
......@@ -426,7 +427,41 @@ export default {
background: url("~@/assets/img/Home/top10.png") no-repeat center
center;
background-size: contain;
margin-bottom: 8px;
margin-bottom: 18px;
}
.top20 {
height: 32px;
background: url("~@/assets/img/Home/top20.png") no-repeat center
center;
background-size: contain;
margin-bottom: 18px;
}
}
.left_range {
width: 60%;
.rangecontent {
.rangeList {
height: 100%;
display: flex;
flex-direction: column;
flex-wrap: wrap;
li {
width: 40%;
margin-bottom: 14px;
display: flex;
justify-content: space-between;
div:nth-child(1) {
width: 20px;
}
div:nth-child(2) {
flex: 1;
}
div:nth-child(3) {
text-align: right;
}
}
}
}
}
}
......@@ -438,7 +473,7 @@ export default {
justify-content: space-between;
li {
cursor: pointer;
width: 43%;
width: 23%;
margin-bottom: 24px;
height: 188px;
display: flex;
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment