Commit 6311bc4a authored by 姜启航's avatar 姜启航

修改页面尺寸,完成新闻详情页,关于我们的二级菜单有个bug

parent d34cecae
...@@ -33,6 +33,8 @@ ...@@ -33,6 +33,8 @@
.container { .container {
width: 1200px; width: 1200px;
margin: 0 auto; margin: 0 auto;
padding-left: 0;
padding-right: 0;
} }
</style> </style>
...@@ -4,12 +4,18 @@ ...@@ -4,12 +4,18 @@
<span><img src="../assets/images/logo.png" alt=""> <span><img src="../assets/images/logo.png" alt="">
</span> </span>
<nav> <nav>
<ul> <ul class="nav-ul">
<router-link v-for="(item, index) in pageMenuList" @click.native="setActive($event,index)" tag='li' :to="{ path: item.listLink }"> <!-- <router-link v-for="(item, index) in pageMenuList" @click.native="setActive($event,index)" tag='li' :to="{ path: item.listLink }"> -->
<div class="list">{{item.text}}</div> <!-- <div class="list">{{item.text}}</div> -->
</router-link> <!-- </router-link> -->
<router-link to="/xmsig/index" tag="li">首页</router-link>
<router-link to="/xmsig/about" tag="li">关于我们</router-link>
<router-link to="/xmsig/investment" tag="li">投资业务</router-link>
<router-link to="/xmsig/news" tag="li" class="news">新闻资讯</router-link>
<router-link to="/xmsig/talents" tag="li">人才招聘</router-link>
<router-link to="/xmsig/contact" tag="li">联系我们</router-link>
</ul> </ul>
</nav> </nav>
</div> </div>
...@@ -22,22 +28,10 @@ ...@@ -22,22 +28,10 @@
data() { data() {
return { return {
msg: 'header', msg: 'header',
pageMenuList:[
{listLink:'/xmsig/index',text:'首页',},
{listLink:'/xmsig/about',text:'关于我们',},
{listLink:'/xmsig/investment',text:'投资业务',},
{listLink:'/xmsig/news',text:'新闻资讯',},
{listLink:'/xmsig/talents',text:'人才招聘',},
{listLink:'/xmsig/contact',text:'联系我们',},
]
} }
}, },
methods: { methods: {
setActive: function (event,index) {
// $('.list').eq(index).addClass('active')
$('span').eq(index+1).css({'display':"block","color":'#B59F4C'})
$('span').eq(1).css('display','none')
}
} }
} }
...@@ -56,6 +50,8 @@ ...@@ -56,6 +50,8 @@
.container { .container {
width: 1200px; width: 1200px;
margin: 0 auto; margin: 0 auto;
padding-left: 0;
padding-right: 0;
} }
img { img {
......
...@@ -8,8 +8,9 @@ ...@@ -8,8 +8,9 @@
<img src="../assets/images/aus07.jpg" alt=""> <img src="../assets/images/aus07.jpg" alt="">
</div> </div>
<div class="content"> <div class="content">
<div class="left"> <div class="shiji">
<div class="date dates"> <span class="left">
<div class="date">
<h1 class="h-date">2017</h1> <h1 class="h-date">2017</h1>
<div> <div>
<p class="p-date"></p> <p class="p-date"></p>
...@@ -17,126 +18,15 @@ ...@@ -17,126 +18,15 @@
</div> </div>
<h1 class="shuzi">10</h1> <h1 class="shuzi">10</h1>
</div> </div>
<div class="dic dics"> </span>
<h1>集微半导体峰会</h1> <span class="right">
<p>由公司及集微网联合举办的“集微半导体峰会”在厦门海沧希尔顿酒店隆重召开。</p>
</div>
<div class="date dates">
<h1 class="h-date">2017</h1>
<div>
<p class="p-date"></p>
<i></i>
</div>
<h1 class="shuzi">08</h1>
</div>
<div class="dic dics">
<h1>户外拓展训练</h1>
<p>公司团队所有成员在福建长泰进行了为期2天的户外拓展培训活动。</p>
</div>
<div class="date dates">
<h1 class="h-date">2017</h1>
<div>
<p class="p-date"></p>
<i></i>
</div>
<h1 class="shuzi">07</h1>
</div>
<div class="dic dics">
<h1>建立党支部</h1>
<p>公司成立党支部,可独立开展党支部党员活动。</p>
</div>
<div class="date dates">
<h1 class="h-date">2017</h1>
<div>
<p class="p-date"></p>
<i></i>
</div>
<h1 class="shuzi">06</h1>
</div>
<div class="dic dics">
<h1>第一季技术委员会</h1>
<p>公司第一届技术委员会暨集成电路产业发展研讨会在温德姆酒店顺利召开,会议探讨了集成电路产业发汗趋势和面临的产业机遇。</p>
</div>
<div class="date dates">
<h1 class="h-date">2016</h1>
<div>
<p class="p-date"></p>
<i></i>
</div>
<h1 class="shuzi">12</h1>
</div>
<div class="dic dics">
<h1>厦门半导体投资集团成立</h1>
<p>厦门半导体投资集团有限公司创立,注册资本5个亿,股东为海投集团与海旅集团,分别占股80%与20%</p>
</div>
</div>
<div class="right">
<div class="dic"> <div class="dic">
<h1>学习中国共产党发展</h1> <h1>学习中国共产党发展</h1>
<p>2017年10月 公司党支部组织全体员工进行为期3天的井冈山红色之旅,学习中国共产党发展历史,缅怀革命先烈。</p> <p>2017年10月 公司党支部组织全体员工进行为期3天的井冈山红色之旅,学习中国共产党发展历史,缅怀革命先烈。</p>
</div> </div>
</span>
<div class="date dates">
<h1 class="h-date">2017</h1>
<div>
<i></i>
<p class="p-date"></p>
</div>
<h1 class="shuzi">09</h1>
</div>
<div class="dic dics">
<h1>厦门通富微电子</h1>
<p>由公司投资的厦门通富微电公司举行开工奠基仪式活动。</p>
</div> </div>
<div class="date dates">
<h1 class="h-date">2017</h1>
<div>
<i></i>
<p class="p-date"></p>
</div>
<h1 class="shuzi">08</h1>
</div>
<div class="dic dics">
<h1>团队建设</h1>
<p>公司以“专注、高效、合作、奋斗者为本”为人才吸引理念,基本完成团队建设,公司设置产业投资部、综合部、法务(风控)部、法务融资部。</p>
</div>
<div class="date dates">
<h1 class="h-date">2017</h1>
<div>
<i></i>
<p class="p-date"></p>
</div>
<h1 class="shuzi">07</h1>
</div>
<div class="dic dics">
<h1>首个投资项目</h1>
<p>公司投资的通富项目,在厦门悦华酒店成功完成签约仪式,并逐步开展落地厦门具体事宜,也是公司首个完成落户签约仪式的重要投资项目。</p>
</div>
<div class="date dates">
<h1 class="h-date">2017</h1>
<div>
<i></i>
<p class="p-date"></p>
</div>
<h1 class="shuzi">01</h1>
</div>
<div class="dic dics">
<h1>第一次股东会、董事会</h1>
<p>公司顺利召开第一次股东会、董事会,同时成立了公司专家委技术委员会。</p>
</div>
<div class="date dates">
<h1 class="h-date">2016</h1>
<div>
<i></i>
<p class="p-date"></p>
</div>
<h1 class="shuzi">12</h1>
</div>
</div>
</div> </div>
<div class="start"> <div class="start">
<span>START</span> <span>START</span>
...@@ -156,6 +46,21 @@ ...@@ -156,6 +46,21 @@
return { return {
msg: "Memorabilia", msg: "Memorabilia",
}; };
},
methods: {
getLiveList() {
this.$http.get('/api/postlist?category_id=3')
.then((res) => {
console.log(res.body)
})
.catch((err) => {
console.log(err)
})
},
},
created () {
this.getLiveList()
} }
}; };
...@@ -177,7 +82,7 @@ ...@@ -177,7 +82,7 @@
width: 100%; width: 100%;
text-align: center; text-align: center;
} }
.content{ .shiji{
width: 100%; width: 100%;
display: flex; display: flex;
} }
...@@ -186,9 +91,6 @@ ...@@ -186,9 +91,6 @@
border-right: 1px solid #B5A14E; border-right: 1px solid #B5A14E;
text-align: right; text-align: right;
} }
.date h1:nth-child(1){
font-size: 30px;
}
.shuzi{ .shuzi{
font-size: 18px; font-size: 18px;
margin-left: 0; margin-left: 0;
...@@ -206,7 +108,7 @@ ...@@ -206,7 +108,7 @@
} }
.date{ .date{
height: 150px; height: 150px;
margin-top:50px; /* margin-top:50px; */
color: #aaa; color: #aaa;
} }
.p-date{ .p-date{
...@@ -228,27 +130,21 @@ ...@@ -228,27 +130,21 @@
} }
.left .dic{ .left .dic{
margin-right: 38px; margin-right: 38px;
margin-top: 109px; margin-top: 110px;
}
.left .dics{
margin-top: 109px;
} }
/*右 */ /*右 */
.right{ .right{
width: 50%; width: 50%;
} }
.dics{
margin-top: 109px;
}
.dic{ .dic{
height: 150px; height: 150px;
margin-left: 38px; margin-left: 38px;
margin-bottom: 111px; margin-bottom: 90px;
} }
.dic h1{ .dic h1{
font-size: 16px; font-size: 16px;
font-weight: bold; font-weight: bold;
margin-top:48px; margin-top:20px;
} }
.dic p{ .dic p{
color: #aaa; color: #aaa;
...@@ -286,4 +182,6 @@ ...@@ -286,4 +182,6 @@
line-height: 80px; line-height: 80px;
margin-bottom: 300px; margin-bottom: 300px;
} }
</style> </style>
\ No newline at end of file
...@@ -93,6 +93,8 @@ ...@@ -93,6 +93,8 @@
.container { .container {
width: 1200px; width: 1200px;
margin: 0 auto; margin: 0 auto;
padding-left: 0;
padding-right: 0;
} }
.com { .com {
......
...@@ -26,6 +26,7 @@ ...@@ -26,6 +26,7 @@
.container{ .container{
width: 1200px; width: 1200px;
margin: 0 auto; margin: 0 auto;
padding: 0;
margin-top: 150px; margin-top: 150px;
} }
img{ img{
......
...@@ -127,12 +127,6 @@ ...@@ -127,12 +127,6 @@
data() { data() {
return { return {
msg: "index", msg: "index",
// divs: [
// { src: '../../static/images/01.jpg', h2: '公司文化', p1: '从集成电路产业战略布局层面,践行国际化、', p2: '市场化、创新化管理概念' },
// { src: '../../static/images/02.jpg', h2: '投资业务', p1: '公司坚持走科技兴业之路,积极开展科研攻关', p2: '努力提高综合实力和市场竞争力' },
// { src: '../../static/images/03.jpg', h2: '人才招聘', p1: '推动集成电路产业投资发展,成为符合创新价值链', p2: '建设的核心中坚力量' },
// ],
time: null, time: null,
banner1:{}, banner1:{},
banner2:{}, banner2:{},
...@@ -158,15 +152,6 @@ ...@@ -158,15 +152,6 @@
gomore(){ gomore(){
this.$router.push('/xmsig/about') this.$router.push('/xmsig/about')
}, },
gomore1(){
this.$router.push('/xmsig/about')
},
gomore2(){
this.$router.push('/xmsig/about')
},
gomore2(){
this.$router.push('/xmsig/about')
}
}, },
...@@ -179,6 +164,7 @@ ...@@ -179,6 +164,7 @@
<style scoped> <style scoped>
.container{ .container{
width: 1200px; width: 1200px;
padding: 0;
} }
/* 轮播图 */ /* 轮播图 */
...@@ -361,6 +347,7 @@ ...@@ -361,6 +347,7 @@
.comtact .container { .comtact .container {
display: flex; display: flex;
width: 1200px; width: 1200px;
padding: 0;
/* justify-content: space-between; */ /* justify-content: space-between; */
} }
......
...@@ -12,10 +12,30 @@ ...@@ -12,10 +12,30 @@
<p class="t2">中共中央政治局常委、国务院总理李克强日前对“华龙一号”福清核电5号机组建设工作作出重要批示。批示指出:我国自</p> <p class="t2">中共中央政治局常委、国务院总理李克强日前对“华龙一号”福清核电5号机组建设工作作出重要批示。批示指出:我国自</p>
</div> </div>
</div> </div>
<div class="content">123</div>
<div class="con">123</div>
<div class="bom">
<div class="bom-left" @click='goinfo(id)'><span class="bom-left-arrow"></span><span class="bom-left-title">李克强对“华龙一号”福清核电5号机组嘟嘟嘟</span></div>
<div class="bom-right" @click='goinfo(id)'><span><img src="../assets/images/new-img.jpg" alt=""></span><span class="bom-right-title">李克强对核电5号机组嘟嘟嘟</span><span class="bom-right-arrow"></span></div>
</div>
</div>
<div class="right">
<p class="hangye">行业资讯</p>
<div class="right-new">
<div class="new-con">
<div class="new-con-top">
<div class="time">07-03</div>
<div class="kong"></div>
<div>
<p class="t1">李克强对“华龙一号”福清核电5号机组建设工作 作出重要批示</p>
</div>
</div>
<p class="new-content">中共中央政治局常委、国务院总理李克强日前对“华龙一号”福清核电5号机组建设工作作出重要批示。批示指出:我国自</p>
</div>
</div> </div>
<div class="right"></div>
</div> </div>
<!-- <page-footer></page-footer> --> </div>
<page-footer></page-footer>
</div> </div>
</template> </template>
<script> <script>
...@@ -36,28 +56,38 @@ ...@@ -36,28 +56,38 @@
// } // }
methods: { methods: {
getLiveList() { // getLiveList() {
this.$http.post('/api/postlist?category_id=1') // this.$http.post('/api/postlist?category_id=1')
.then((res) => { // .then((res) => {
this.news=res.body.data // this.news=res.body.data
console.log() // console.log()
this.news.forEach(e => { // this.news.forEach(e => {
this.day=e.published_time // this.day=e.published_time
this.title=e.post_title.replace(/&quot;/g,'"') // this.title=e.post_title.replace(/&quot;/g,'"')
this.day.substring(this.day.length,this.day.length-5) // this.day.substring(this.day.length,this.day.length-5)
this.time=this.day.substring(this.day.length-9,this.day.length-14) // this.time=this.day.substring(this.day.length-9,this.day.length-14)
}); // });
}) // })
.catch((err) => { // .catch((err) => {
console.log(err) // console.log(err)
}) // })
// },
add(){
console.log(123)
$('.news').css('border-bottom' ,'3px solid #B59F4C')
},
goinfo(id){
this.$router.push('/xmsig/newinfo?id=' + id)
} }
}, },
created () { created () {
this.getLiveList() // this.getLiveList()
},
mounted () {
this.add()
} }
} }
...@@ -65,10 +95,15 @@ ...@@ -65,10 +95,15 @@
<style scoped> <style scoped>
.container{ .container{
width: 1200px; width: 1200px;
padding: 0;
display: flex;
padding-bottom: 172px;
/* justify-content: space-between; */
} }
.left{ .left{
width: 800px; width: 800px;
margin-right: 50px;
} }
.top{ .top{
display: flex; display: flex;
...@@ -100,4 +135,150 @@ ...@@ -100,4 +135,150 @@
text-overflow:ellipsis; text-overflow:ellipsis;
white-space: nowrap; white-space: nowrap;
} }
.content{
border-top: 1px solid #aaa;
border-bottom: 1px solid #aaa;
margin-top: 33px;
padding-top: 41px;
padding-bottom: 41px;
}
.con{
margin-top: 42px;
padding-bottom: 88px;
}
.bom{
height: 120px;
width: 800px;
display: flex;
}
.bom div{
width: 50%;
height: 100%;
background-color: #F6F6F6;
/* border: 1px solid red; */
}
.bom-left{
border-right: 1px solid #aaa;
}
.bom-left-arrow{
display: inline-block;
width: 30px;
height: 32px;
background:url('../assets/images/lefthui.png');
margin-top: 53px;
margin-left: 27px;
margin-right: 40px;
}
.bom-left-title{
display: inline-block;
width: 256px;
overflow: hidden;
text-overflow:ellipsis;
white-space: nowrap;
margin-bottom: 5px;
}
.bom-right-title{
display: inline-block;
width: 145px;
overflow: hidden;
text-overflow:ellipsis;
white-space: nowrap;
margin-bottom: 5px;
}
.bom-left:hover{
background-color: #243876;
color: #fff;
}
.bom-left:hover .bom-left-arrow{
background:url('../assets/images/leftbai.png');
}
.bom-right img{
margin-left: 17px;
margin-top: -30px;
margin-right: 17px;
}
.bom-right-arrow{
display: inline-block;
width: 30px;
height: 32px;
background:url('../assets/images/righthui.png');
margin-top: 53px;
margin-left: 27px;
margin-right: 40px;
}
.bom-right:hover{
background-color: #243876;
color: #fff;
}
.bom-right:hover .bom-right-arrow{
background:url('../assets/images/rightbai.png');
}
.hangye{
margin-left: 30px;
margin-bottom: 10px;
}
.right{
width: 350px;
margin-top: 120px;
/* height: 1000px; */
/* border: 1px solid red; */
}
.right-new{
width: 100%;
height: 131px;
border-bottom: 1px solid #aaa;
}
.right-new:hover {
-webkit-box-shadow:0 0 15px rgba(0, 0, 0, 0.5);
-moz-box-shadow:0 0 15px rgba(0, 0, 0, 0.5);
box-shadow:0 0 15px rgba(0, 0, 0, 0.5);
border-bottom: 2px solid #243876;
transform: translate(0, 0px);
transition: all 0.5s;
}
.new-con{
padding: 30px;
padding-left: 0;
padding-right: 60px;
}
.right-new:hover .new-con{
transform: translate(30px, 0px);
transition: all 0.5s;
}
.new-con .time{
color: #aaa;
font-size: 14px;
margin-top: 0;
margin-right: 0;
}
.new-con .kong{
width: 25px;
height: 1px;
border-top: 1px solid #aaa;
margin-top: 12px;
margin-right: 9px;
}
.new-con .t1{
width: 220px;
overflow: hidden;
text-overflow:ellipsis;
white-space: nowrap;
font-size: 14px;
color: #101010;
margin-top: 0;
}
.new-con-top{
display: flex;
}
.new-content{
color: #aaa;
width: 290px;
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
overflow: hidden;
}
</style> </style>
\ No newline at end of file
...@@ -25,7 +25,6 @@ ...@@ -25,7 +25,6 @@
<div class="bom"> <div class="bom">
</div> </div>
<!-- <div class="boms"></div> -->
</div> </div>
</div> </div>
......
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