Commit e45fc667 by 林家欣

咨询中心详情页切图完成

parent 47dfa941
......@@ -489,6 +489,14 @@ const routes = [
]
},
{
path: "/News/msg",
name: "msg",
meta: {
name: "资讯中心详情",
},
component: () => import("@/views/News/msg.vue"),
},
{
path: "/News/Health",
name: "Health",
meta: {
......
<template>
<div class="center">
<div class="Center">
<div class="picNews-top">
<cate :father="zxhdCate"></cate>
<div class="container">
......@@ -61,7 +61,7 @@ export default {
};
</script>
<style lang="scss">
.center {
.Center {
@media screen and (min-width: 992px) {
.picNews-ul {
justify-content: space-between;
......@@ -75,7 +75,7 @@ export default {
}
</style>
<style lang="scss" scoped>
.center {
.Center {
ul {
padding: 0;
margin: 0;
......
......@@ -4,7 +4,7 @@
<cate :father="tpzxCate"></cate>
<div class="container">
<ul class="picNews-ul">
<li v-for="(tmp, i) in 4" :key="i">
<li v-for="(tmp, i) in 4" :key="i" @click="jump">
<div class="picNews-li-tp">
<img src="../../assets/image/news/tpzx-tp1.jpg" alt="" />
</div>
......@@ -33,6 +33,8 @@
</div>
</template>
<script>
import { mapMutations } from "vuex";
import cate from "../comps/cate.vue";
import pages from "../comps/pages.vue";
export default {
......@@ -48,7 +50,23 @@ export default {
},
};
},
methods: {},
methods: {
...mapMutations({
setMatche: "setMatche",
}),
jump() {
const matche = [
{
name: "图片资讯",
path: "/News/PicNews",
},
];
this.setMatche(matche);
this.$router.push({
path: "/News/msg",
});
},
},
};
</script>
<style lang="scss">
......@@ -72,31 +90,30 @@ export default {
margin: 0;
}
.picNews-ul {
display: flex;
flex-wrap: wrap;
margin-top: 30px;
li {
width: 216px;
background: #ffffff;
box-shadow: 0px 4px 15px 2px rgba(4, 64, 141, 0.08);
border-radius: 4px;
margin-bottom: 30px;
img {
width: 100%;
}
.picNews-li-bt {
width: 90%;
margin: 0 auto;
text-align: center;
color: #414345;
font-size: 14px;
padding: 14px 0;
}
display: flex;
flex-wrap: wrap;
margin-top: 30px;
li {
width: 216px;
background: #ffffff;
box-shadow: 0px 4px 15px 2px rgba(4, 64, 141, 0.08);
border-radius: 4px;
margin-bottom: 30px;
img {
width: 100%;
}
.picNews-li-bt {
width: 90%;
margin: 0 auto;
text-align: center;
color: #414345;
font-size: 14px;
padding: 14px 0;
}
}
}
.picNews-top {
@include module-box;
}
.picNews-bottom {
@include module-box;
......
<template>
<div class="list">
<div v-for="(tmp, i) in list" :key="i" class="list-li">
<div>
<span></span>
<span>{{tmp.name}}</span>
</div>
</div>
</div>
</template>
<script>
export default {
props: ['list'],
}
</script>
<style lang="scss" scoped>
.list {
margin: 0;
padding: 0;
.list-li {
display: flex;
justify-content: space-between;
padding: 10px 0;
margin: 0;
>div {
flex: 1;
display: flex;
align-items: center;
@include ellipsis;
font-size: 13px;
span {
display: inline-block;
&:nth-child(1) {
width: 4px;
height: 4px;
background: #f26335;
border-radius: 50%;
margin-right: 10px;
}
&:nth-child(2) {
flex: 1;
@include ellipsis;
cursor: pointer;
}
}
}
}
}
</style>
\ No newline at end of file
export const SET_MATCHE = 'setMatche';
......@@ -6,7 +6,24 @@ import system from "./system/index.js"
Vue.use(Vuex)
import {
SET_MATCHE,
} from './mutation-types';
const state = {
matche: localStorage.getItem('matche') ? JSON.parse(localStorage.getItem('matche')) : [],
};
const mutations = {
[SET_MATCHE](state, data) {
localStorage.setItem('matche', JSON.stringify(data));
state.matche = data;
},
};
export default new Vuex.Store({
state,
mutations,
modules: {
user,
system
......
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