Commit ff226562 by Lyan

党建文化代码上传

parent 57d66921
......@@ -849,12 +849,6 @@ export const nav = [
],
},
],
},
{
......
......@@ -767,8 +767,20 @@ const routes = [
],
},
],
},
},
{
path: "/djwh",
name: "djwh",
component: () => import("@/views/Djwh/index"),
},
service,
{
path: "/login",
name: "login",
......@@ -793,6 +805,7 @@ const routes = [
path: "*",
redirect: "/404",
},
];
const router = new VueRouter({
......
<template>
<div class="foot">
<div class="container">
<p>Copyright © 2013 gs1cn.org All rights reserved 中国物品编码中心 版权所有 </p>
<p>全国统一咨询服务电话:400-7000-690</p>
<p><span class="col-md-6 col-xs-12" style="font-weight:lighter"><a href="http://beian.miit.gov.cn/" target="_blank" style="color: #008dbd;text-decoration:none;"> 京ICP备11036137号-10</a>
<span class="link-pipe" style="margin-left:8px; margin-right:8px">|</span>
<a target="_blank" href="http://www.beian.gov.cn/portal/registerSystemInfo?recordcode=11010102005499" style="display:inline-block;color: #008dbd;text-decoration:none;height:20px;line-height:20px;">
<img src="../../../assets/image/djwh//beian.png" style="float:left;">京公网安备 11010102005499号</a>
</span>
</p>
</div>
</div>
</template>
<script>
export default {
data() {
return {};
},
computed: {},
methods: {},
mounted() {},
created() {},
};
</script>
<style lang="scss">
</style>
<style lang="scss" scoped>
.foot {
background-color: #eeeeee;
padding: 10px;
text-align: center;
border-top: 1px solid red;
font-size: 12px;
margin-bottom: 20px;
margin-top: 15px;
}
</style>
<template>
<div></div>
</template>
<div class="djwh ">
<div class="row status-container">
<div class="col-lg-2"></div>
<div class="col-lg-8">
<!-- header -->
<div class="header">
<img src="../../assets/image/djwh/top_pho.jpg" />
<p>
<a href="/Home">返回编码中心首页</a>
</p>
</div>
<!-- container -->
<div class="row djwh-container">
<div class="col-lg-9 " >
<div class="row">
<div class="col-lg-5 left-img">
<div class="border-div">
<a href="http://www.samr.gov.cn/zt/sjjwzqh/">
<img src="../../assets/image/djwh/ssjwzqh.jpg" alt="">
</a>
<a href="http://www.samr.gov.cn/zt/bwcx/">
<img src="../../assets/image/djwh/19thpic1.jpg" alt="">
</a>
</div>
</div>
<div class="col-lg-7 middle-header">
<div class="border-div ">
<a href="http://www.samr.gov.cn/zt/bwcx/">
<img src="../../assets/image/djwh/tt_pho.gif" alt="">
</a>
<div id="box">
<div id="con1" ref="con1" :class="{anim:animate==true}" :style="{ marginTop: marginTop + 'px' }" @mouseenter="mEnter" @mouseleave="mLeave">
<p v-for='(item,index) in items' :key="index">{{item.name}}</p>
</div>
</div>
</div>
<div class="border-div list-style">
<div class="middle-title">
<h4>活动报道</h4>
<a href="#">更多>></a>
</div>
<div class="middle-list">
<ul>
<li>
<a href="#">编码中心党委理论学习中心组 举行2021年第六次集体学习(扩</a>
</li>
<li>
<a href="#">总局党史学习教育第2指导小组 马思宇一行来编码中心调研指</a>
</li>
<li>
<a href="#">“学党史、强信念、跟党走”—中国物品编码中心团员青年</a>
</li>
<li>
<a href="#">中国物品编码中心召开警示教育大会</a>
</li>
<li>
<a href="#">中国物品编码中心党委开展党史学习教育暨“清明祭英烈”活动</a>
</li>
<li>
<a href="#">总局党史学习教育指导小组 马思宇一行莅临编码中心指导工作</a>
</li>
<li>
<a href="#">办公室党支部召开全体党员大会 暨党史教育专题党课</a>
</li>
</ul>
</div>
</div>
</div>
<div class="col-lg-12">
<div class="ds">
<div>
<img src="../../assets/image/djwh/dsjy-title.gif" alt="">
</div>
<div>
<div class="list-style">
<ul>
<li>
<a href="#">办公室党支部组织第三季度党课和青年小组学习</a>
</li>
<li>
<a href="#">党委办公室党支部、编码管理部党支部、成员服务部党支部联合开展主题党日活动</a>
</li>
<li>
<a href="#">编码中心党委理论学习中心组举行2021年度第九次集体学习</a>
</li>
<li>
<a href="#">办公室党支部召开党史学习教育专题组织生活会</a>
</li>
<li>
<a href="#">编码中心党委理论学习中心组 举行2021年度第八次集体学习</a>
</li>
<li>
<a href="#">党委办公室党支部 召开党史学习教育专题组织生活会</a>
</li>
<li>
<a href="#">编码中心党委理论学习中心组 举行2021年第七次集体学习会议</a>
</li>
<li>
<a href="#">办公室党支部开展“学党史、改作风、见行动”主题党课活动</a>
</li>
<li>
<a href="#">张成海为编码中心全体干部职工讲授 党史学习教育专题党课</a>
</li>
<li>
<a href="#">编码中心党委理论学习中心组 举行2021年第六次集体学习(扩大)会议</a>
</li>
</ul>
</div>
</div>
</div>
</div>
<div class="col-lg-12">
<div class="ds hdtp">
<div>
<img src="../../assets/image/djwh/pho_bg5.gif" alt="">
</div>
<div>
<div class="list-style">
<a href=""> <img src="../../assets/image/djwh/2020122801.jpg" alt=""></a>
<a href=""> <img src="../../assets/image/djwh/2020122802.jpg" alt=""></a>
<a href=""> <img src="../../assets/image/djwh/2020122803.jpg" alt=""></a>
<a href=""> <img src="../../assets/image/djwh/2020122804.jpg" alt=""></a>
</div>
</div>
</div>
</div>
<div class="col-lg-12 foottp">
<img src="../../assets/image/djwh/19th.gif" alt="">
</div>
</div>
</div>
<div class="col-lg-3 right-con">
<div class="border-div list-style">
<div class="middle-title">
<h4>党的十九大文件</h4>
</div>
<div class="middle-list">
<ul>
<li>
<a href="#">《中国共产党第十九届中央委员会第</a>
</li>
<li>
<a href="#">党的十九大报告全文</a>
</li>
<li>
<a href="#">“质检总局党组关于认真学习宣传贯</a>
</li>
<li>
<a href="#">质检总局党组关于印发质检系统学习</a>
</li>
<li>
<a href="#">中共中央关于认真学习宣传贯彻党的十九大精神的决定</a>
</li>
<li>
<a href="#">中共中央宣传部关于印发《党的十九</a>
</li>
<li>
<a href="#">中国物品编码中心关于印发学习宣传</a>
</li>
</ul>
</div>
</div>
<div class="border-div list-style">
<div class="middle-title">
<h4>中央和总局精神</h4>
</div>
<div class="middle-list">
<ul>
<li>
<a href="#">《中国共产党第十九届中央委员会第</a>
</li>
<li>
<a href="#">党的十九大报告全文</a>
</li>
<li>
<a href="#">“质检总局党组关于认真学习宣传贯</a>
</li>
<li>
<a href="#">质检总局党组关于印发质检系统学习</a>
</li>
<li>
<a href="#">中共中央关于认真学习宣传贯彻党的十九大精神的决定</a>
</li>
<li>
<a href="#">中共中央宣传部关于印发《党的十九</a>
</li>
<li>
<a href="#">中国物品编码中心关于印发学习宣传</a>
</li>
</ul>
</div>
</div>
<div class="border-div list-style">
<div class="middle-title">
<h4>规章制度</h4>
</div>
<div class="middle-list">
<ul>
<li>
<a href="#">《中国共产党第十九届中央委员会第</a>
</li>
<li>
<a href="#">党的十九大报告全文</a>
</li>
<li>
<a href="#">“质检总局党组关于认真学习宣传贯</a>
</li>
<li>
<a href="#">质检总局党组关于印发质检系统学习</a>
</li>
<li>
<a href="#">中共中央关于认真学习宣传贯彻党的十九大精神的决定</a>
</li>
<li>
<a href="#">中共中央宣传部关于印发《党的十九</a>
</li>
<li>
<a href="#">中国物品编码中心关于印发学习宣传</a>
</li>
</ul>
</div>
</div>
<div class="border-div list-style xglj">
<div class="middle-title">
<h4>相关链接</h4>
<a href=""> <img src="../../assets/image/djwh/19th_rmw.jpg" alt=""></a>
<a href=""> <img src="../../assets/image/djwh/dsxx.jpg" alt=""></a>
<a href=""> <img src="../../assets/image/djwh/lxyz_xxjyw.png" alt=""></a>
<a href=""> <img src="../../assets/image/djwh/lxyz_rmw.png" alt=""></a>
</div>
<div class="middle-list">
</div>
</div>
</div>
</div>
<Footer></Footer>
</div>
<div class="col-lg-2"></div>
<!-- footer -->
</div>
</div>
</template>
<script>
import Footer from "./comps/footer.vue";
export default {
components: {
Footer,
},
data() {
return {
animate:false,
items:[ //消息列表对应的数组
{name:"学习贯彻十九届五中全会精神"},
{name:"学习贯彻十九届五中全会精神"},
],
marginTop:0
};
},
computed: {
routes() {
},
},
created() {
},
mounted () {
this.timer1= setInterval(this.scroll,2000)
},
methods: {
scroll(){
this.marginTop='-56';
this.animate=!this.animate;
var that = this; // 在异步函数中会出现this的偏移问题,此处一定要先保存好this的指向
setTimeout(function(){
that.items.push(that.items[0]);
that.items.shift();
this.marginTop='0';
that.animate=!that.animate; // 这个地方如果不把animate 取反会出现消息回滚的现象,此时把ul 元素的过渡属性取消掉就可以完美实现无缝滚动的效果了
},1000)
},
mEnter () {
clearInterval(this.timer1)
},
mLeave () {
this.timer1= setInterval(this.scroll,2000)
},
},
};
</script>
<style lang="scss" scoped>
@media screen and(min-width: 992px) {
}
@media screen and (max-width: 992px) {
.middle-header{
.border-div{
height: auto!important;
overflow: hidden;
img{
height: 60px!important;
}
}
}
.ds{
.list-style{
width: 80%!important;
}
li{
a{
width: 90%!important;
}
}
}
}
</style>
<style lang="scss" scoped>
html{
background: #fff;
}
.djwh {
background: #fff;
.header{
img{
width: 100%;
}
p{
width: 100%;
height: 40px;
text-align: right;
background: linear-gradient(#F51614, #950101);
padding: 10px;
box-sizing: border-box;
a{
color:#fff;
}
}
}
.border-div{
width: 100%;
border:1px solid #BADFF2;
}
.djwh-container{
.left-img{
img{
width: 100%;
}
img:first-child{
margin-bottom: 5px;
}
}
.middle-header{
.border-div:first-child{
padding: 6px;
height: 78px;
a{
display: inline-block;
width:20%;
}
img{
width: 100%;
// height: 60px;
}
}
.middle-title{
background: linear-gradient(#fff, #ccc 30%, #f6f6f6);
border-bottom: 1px solid #ccc;
padding: 0 5px;
h4{
background: url(../../assets/image/djwh/title-bg.png) no-repeat;
margin: 0;
display: inline-block;
width: 138px;
text-align: center;
color: #fff;
font-size: 14px;
font-weight: 800;
line-height: 26px;
}
a{
font-size: 13px;
line-height: 26px;
float:right;
text-align: right;
}
}
}
}
.ds{
background: linear-gradient(#9A0000, #FD0000);
border-radius: 10px;
margin-top: 15px;
padding: 2px 2px 2px 5px;
box-sizing: border-box;
overflow: hidden;
img{
float: left;
}
.list-style{
width: 87%;
float: left;
background-color: #fff;
border-radius: 10px;
padding: 5px;
margin-top: 0%;
}
}
.hdtp{
.list-style{
img{
width: 25%;
float: left;
padding: 4px 3px;
}
}
}
.foottp{
margin-top: 10px;
img{
padding: 5px;
width: 100%;
}
}
<style lang="scss">
#box{
float: right;
width: 78%;
height: 60px;
line-height: 40px;
overflow: hidden;
padding-left: 4px;
border: 1px solid #ccc;
// transition: all 1s linear 0s;
color: #000066;
font-size: 12px;
}
.anim{
transition: all 1s ;
}
.right-con{
h4{
color: #fff;
font-size: 15px;
text-align: center;
line-height: 30px;
letter-spacing: 4px;
background: -moz-linear-gradient(top, #F64108, #B80908);
background: -ms-linear-gradient(top, #F64108, #B80908);
background: -webkit-linear-gradient(top, #F64108, #B80908);
background: linear-gradient(top, #F64108, #B80908);
font-weight: 800;
}
.list-style:first-child{
margin-top: 0;
}
li{
line-height: 22px;
a{
width: 90%;
font-size: 13px;
}
}
}
.xglj{
.middle-title{
}
img{
height: 72px;
width: 100%;
padding: 0 15px 5px 15px;
}
}
}
</style>
<style lang="scss" scoped>
.status-container{
margin: 0!important;
}
.list-style{
padding: 0;
margin-top: 15px;
.middle-list{
padding: 5px;
}
ul{
padding: 0;
overflow: hidden;
margin: 0;
}
li{
font-size: 14px;
margin: 4px;
line-height: 24px;
a{
display: inline-block;
width: 95%;
overflow: hidden;
text-overflow: ellipsis;
white-space:nowrap;
// line-height: 28px;
}
}
li::before{
content: "\25CF";
margin-right: 5px;
float: left;
}
}
</style>
\ No newline at end of file
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