Commit 7039e358 by 林家欣

咨询中下综合报道-标准科研动态列表切图

parent 34eacf9c
...@@ -504,6 +504,56 @@ export const nav = [ ...@@ -504,6 +504,56 @@ export const nav = [
{ name: "资讯中心", path: "/News/index" }, { name: "资讯中心", path: "/News/index" },
{ name: "图片资讯" }, { name: "图片资讯" },
], ],
},
{
id: uuid("gs_nav"),
name: "综合报道",
index: 5,
link: "/News/Composite",
breadcrumb: [
{ name: "资讯中心", path: "/News/index" },
{ name: "综合报道" },
],
},
{
id: uuid("gs_nav"),
name: "中心活动",
index: 5,
link: "/News/Center",
breadcrumb: [
{ name: "资讯中心", path: "/News/index" },
{ name: "中心活动" },
],
},
{
id: uuid("gs_nav"),
name: "地方动态",
index: 5,
link: "/News/Local",
breadcrumb: [
{ name: "资讯中心", path: "/News/index" },
{ name: "地方动态" },
],
},
{
id: uuid("gs_nav"),
name: "国际追踪",
index: 5,
link: "/News/International",
breadcrumb: [
{ name: "资讯中心", path: "/News/index" },
{ name: "国际追踪" },
],
},
{
id: uuid("gs_nav"),
name: "标准科研动态",
index: 5,
link: "/News/Research",
breadcrumb: [
{ name: "资讯中心", path: "/News/index" },
{ name: "标准科研动态" },
],
} }
], ],
}, },
......
...@@ -445,6 +445,46 @@ const routes = [ ...@@ -445,6 +445,46 @@ const routes = [
}, },
component: () => import("@/views/News/PicNews.vue"), component: () => import("@/views/News/PicNews.vue"),
}, },
{
path: "/News/Composite",
name: "Composite",
meta: {
name: "综合报道",
},
component: () => import("@/views/News/Composite.vue"),
},
{
path: "/News/Center",
name: "Center",
meta: {
name: "中心活动",
},
component: () => import("@/views/News/Center.vue"),
},
{
path: "/News/Local",
name: "Local",
meta: {
name: "地方动态",
},
component: () => import("@/views/News/Local.vue"),
},
{
path: "/News/International",
name: "International",
meta: {
name: "国际追踪",
},
component: () => import("@/views/News/International.vue"),
},
{
path: "/News/Research",
name: "Research",
meta: {
name: "标准科研动态",
},
component: () => import("@/views/News/Research.vue"),
},
] ]
}, },
{ {
......
<template>
<div class="center">
<div class="picNews-top">
<cate :father="zxhdCate"></cate>
<div class="container">
<ul class="picNews-ul">
<li v-for="(tmp, i) in 4" :key="i">
<div class="picNews-li-tp">
<img src="../../assets/image/news/tpzx-tp1.jpg" alt="" />
</div>
<div class="picNews-li-bt">
中国物品编码中心应邀出席食品安全智慧监管研讨会
</div>
</li>
</ul>
<div class="more"><span @click="lookMore">更多></span></div>
</div>
</div>
<div class="picNews-bottom">
<div class="container">
<list :list="list" />
<pages />
</div>
</div>
</div>
</template>
<script>
import cate from "../comps/cate.vue";
import list from "./comps/list.vue";
import pages from "../comps/pages.vue";
export default {
components: {
cate,
list,
pages,
},
data() {
return {
zxhdCate: {
name: "中心活动 ",
ico: "",
},
list: [
{
name: "【精彩推荐】企业可通过国家食品(产品)安全追溯平台自动生成物流标签 提升供应链效率",
time: "2020-10-20",
},
{
name: "全国质量监督检验检疫工作会议在京召开 提高供给质量 严守安全底线 以优异成绩迎接党的十九大胜利召开",
time: "2020-10-20",
},
],
};
},
methods: {
// 查看更多
lookMore() {
window.open('/News/PicNews', '_target');
},
},
};
</script>
<style lang="scss">
.center {
@media screen and (min-width: 992px) {
.picNews-ul {
justify-content: space-between;
}
}
@media screen and (max-width: 992px) {
.picNews-ul {
justify-content: space-around;
}
}
}
</style>
<style lang="scss" scoped>
.center {
ul {
padding: 0;
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;
}
}
}
.picNews-top {
@include module-box;
.more {
text-align: right;
margin-bottom: 20px;
span {
color: #008dbd;
font-size: 14px;
cursor: pointer;
}
}
}
.picNews-bottom {
@include module-box;
margin-top: 30px;
}
}
</style>
\ No newline at end of file
<template>
<div class="composite">
<cate :father="zhbdCate"></cate>
<div class="container">
<list :list="list" />
<pages />
</div>
</div>
</template>
<script>
import cate from "../comps/cate.vue";
import list from "./comps/list.vue";
import pages from "../comps/pages.vue";
export default {
components: {
cate,
list,
pages,
},
data() {
return {
zhbdCate: {
name: "综合报道",
ico: "",
},
list: [
{
name: "【精彩推荐】企业可通过国家食品(产品)安全追溯平台自动生成物流标签 提升供应链效率",
time: "2020-10-20",
},
{
name: "全国质量监督检验检疫工作会议在京召开 提高供给质量 严守安全底线 以优异成绩迎接党的十九大胜利召开",
time: "2020-10-20",
},
],
};
},
methods: {},
};
</script>
<style lang="scss" scoped>
.composite {
@include module-box;
ul {
padding: 0;
margin: 0;
}
}
</style>
\ No newline at end of file
<template>
<div class="composite">
<cate :father="gjzzCate"></cate>
<div class="container">
<list :list="list" />
<pages />
</div>
</div>
</template>
<script>
import cate from "../comps/cate.vue";
import list from "./comps/list.vue";
import pages from "../comps/pages.vue";
export default {
components: {
cate,
list,
pages,
},
data() {
return {
gjzzCate: {
name: "国际追踪",
ico: "",
},
list: [
{
name: "阿里巴巴(法国)与GS1法国签署合作备忘录 鼓励企业使用GS1标准并提供优质产品数据",
time: "2017-07-10",
},
{
name: "意大利物品编码协会与阿里巴巴集团意大利办事处开展合作",
time: "2017-03-29",
},
{
name: "GS1澳大利亚与阿里巴巴集团签约 天猫澳大利亚进口商品今起可追溯",
time: "2017-01-06",
},
],
};
},
methods: {},
};
</script>
<style lang="scss" scoped>
.composite {
@include module-box;
ul {
padding: 0;
margin: 0;
}
}
</style>
\ No newline at end of file
<template>
<div class="composite">
<cate :father="dfdtCate"></cate>
<div class="container">
<list :list="list" />
<pages />
</div>
</div>
</template>
<script>
import cate from "../comps/cate.vue";
import list from "./comps/list.vue";
import pages from "../comps/pages.vue";
export default {
components: {
cate,
list,
pages,
},
data() {
return {
dfdtCate: {
name: "地方动态",
ico: "",
},
list: [
{
name: "中国物品编码中心北京分中心组织召开医疗器械唯一标识 (UDI)主题座谈会",
time: "2020-10-15",
},
{
name: "中国物品编码中心陕西分中心2021年“世界标准日”宣传活动",
time: "2020-10-15",
},
{
name: "中国物品编码中心深圳分中心协办第二届“医疗器械唯一标识(UDI)实施与合规论坛”",
time: "2020-10-15",
},
],
};
},
methods: {},
};
</script>
<style lang="scss" scoped>
.composite {
@include module-box;
ul {
padding: 0;
margin: 0;
}
}
</style>
\ No newline at end of file
<template>
<div class="composite">
<cate :father="bzkydtCate"></cate>
<div class="container">
<list :list="list" />
<pages />
</div>
</div>
</template>
<script>
import cate from "../comps/cate.vue";
import list from "./comps/list.vue";
import pages from "../comps/pages.vue";
export default {
components: {
cate,
list,
pages,
},
data() {
return {
bzkydtCate: {
name: "标准科研动态",
ico: "",
},
list: [
{
name: "取得多项专利和技术创新成果 获得多项技术产品和科技成果奖",
time: "2008-12-30",
},
{
name: "汉字编码技术有了自主国标——解读汉信码及《汉信码》国家标准",
time: "2007-11-05",
},
{
name: "我国自主知识产权二维码国家标准《汉信码》正式发布",
time: "2007-09-13",
},
],
};
},
methods: {},
};
</script>
<style lang="scss" scoped>
.composite {
@include module-box;
ul {
padding: 0;
margin: 0;
}
}
</style>
\ No newline at end of file
<template>
<div class="list">
<div v-for="(tmp, i) in list" :key="i" class="row">
<div class="col-lg-6 list-left">
<span></span>
<span>{{tmp.name}}</span>
</div>
<div class="col-lg-2 list-right">{{tmp.time}}</div>
</div>
</div>
</template>
<script>
export default {
props: ['list'],
}
</script>
<style lang="scss" scoped>
.list {
margin: 0;
padding: 0;
.row {
display: flex;
justify-content: space-between;
border-bottom: 1px dashed #c5d8ee;
padding: 20px 0;
margin: 0;
.list-left {
flex: 1;
display: flex;
align-items: center;
@include ellipsis;
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;
}
}
}
.list-right{
text-align: right;
}
}
}
</style>
\ No newline at end of file
...@@ -35,29 +35,29 @@ export default { ...@@ -35,29 +35,29 @@ export default {
}, },
{ {
name: "综合报道", name: "综合报道",
path: "", path: "/News/Composite",
active: "", active: "Composite",
}, },
{ {
name: "中心活动", name: "中心活动",
path: "", path: "/News/Center",
active: "", active: "Center",
}, },
{ {
name: "地方动态", name: "地方动态",
path: "", path: "/News/Local",
active: "", active: "Local",
}, },
{ {
name: "国际追踪", name: "国际追踪",
path: "", path: "/News/International",
active: "", active: "International",
}, },
{ {
name: "标准科研动态", name: "标准科研动态",
path: "", path: "/News/Research",
active: "", active: "Research",
}, },
{ {
name: "行业应用", name: "行业应用",
......
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