|
|
@@ -30,7 +30,9 @@
|
|
|
<div class="noticeDiv">
|
|
|
<div class="noticeTitle">
|
|
|
通知公告
|
|
|
- <span class="more">more>></span>
|
|
|
+ <span class="more"
|
|
|
+ >more<i class="el-icon-d-arrow-right"></i
|
|
|
+ ></span>
|
|
|
</div>
|
|
|
<div class="notice" v-for="item in 5" :key="item">
|
|
|
通知公告通知公告通知公告
|
|
|
@@ -86,22 +88,30 @@
|
|
|
</div>
|
|
|
</div>
|
|
|
<!-- 广告位 -->
|
|
|
- <div class="ggzw bg-84">办公系列广告占位</div>
|
|
|
- <div class="partTitle"><span class="orangeLine"></span>热门商品</div>
|
|
|
+ <div class="ggzw bg-84 mt2rem">办公系列广告占位</div>
|
|
|
+ <div class="partTitle">
|
|
|
+ <span class="orangeLine"></span>热门商品<span class="more"
|
|
|
+ >more<i class="el-icon-d-arrow-right"></i
|
|
|
+ ></span>
|
|
|
+ </div>
|
|
|
<div class="rmsp">
|
|
|
<div class="rmspItem" v-for="item in 5" :key="item">
|
|
|
<div class="imgDiv">
|
|
|
<img src="@assets/shangpin.png" alt />
|
|
|
</div>
|
|
|
- <div class="name">文件柜B20-J</div>
|
|
|
+ <div class="name">钢制家具柜文件柜B20-J</div>
|
|
|
<div class="money">
|
|
|
¥
|
|
|
<span>1833</span>
|
|
|
</div>
|
|
|
- <div class="company">洛阳花都家具集团有限公司</div>
|
|
|
+ <div class="company mt15px">洛阳花都家具集团有限公司</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
- <div class="partTitle"><span class="orangeLine"></span>品牌商家</div>
|
|
|
+ <div class="partTitle">
|
|
|
+ <span class="orangeLine"></span>品牌商家<span class="more"
|
|
|
+ >more<i class="el-icon-d-arrow-right"></i
|
|
|
+ ></span>
|
|
|
+ </div>
|
|
|
<div class="rmsp">
|
|
|
<div class="ppsjItem" v-for="item in 5" :key="item">
|
|
|
<div class="imgDiv2">
|
|
|
@@ -120,7 +130,9 @@
|
|
|
<div class="xqDiv">
|
|
|
<div class="xqTitle">
|
|
|
<img src="@assets/xuqiu.png" alt />需求
|
|
|
- <span class="more">more>></span>
|
|
|
+ <span class="more"
|
|
|
+ >more<i class="el-icon-d-arrow-right"></i
|
|
|
+ ></span>
|
|
|
</div>
|
|
|
<div class="xq" v-for="item in 10" :key="item">
|
|
|
<div class="con">【求购】通知公告通知公告通知公告</div>
|
|
|
@@ -132,7 +144,9 @@
|
|
|
<div class="xqDiv">
|
|
|
<div class="xqTitle">
|
|
|
<img src="@assets/gongyingshang.png" alt />供应商
|
|
|
- <span class="more">more>></span>
|
|
|
+ <span class="more"
|
|
|
+ >more<i class="el-icon-d-arrow-right"></i
|
|
|
+ ></span>
|
|
|
</div>
|
|
|
<div class="xq" v-for="item in 10" :key="item">
|
|
|
<div class="con">【供应】通知公告通知公告通知公告</div>
|
|
|
@@ -145,7 +159,11 @@
|
|
|
<div class="ggzw bg-88 mt2rem">智能家具保险柜广告占位</div>
|
|
|
<el-row :gutter="20">
|
|
|
<el-col :span="12">
|
|
|
- <div class="partTitle"><span class="orangeLine"></span>行业资讯</div>
|
|
|
+ <div class="partTitle">
|
|
|
+ <span class="orangeLine"></span>行业资讯<i
|
|
|
+ class="el-icon-d-arrow-right"
|
|
|
+ ></i>
|
|
|
+ </div>
|
|
|
<div class="hyzxDiv">
|
|
|
<div class="topDiv">
|
|
|
<div class="leftDiv">
|
|
|
@@ -170,7 +188,11 @@
|
|
|
</div>
|
|
|
</el-col>
|
|
|
<el-col :span="12">
|
|
|
- <div class="partTitle"><span class="orangeLine"></span>家具保养</div>
|
|
|
+ <div class="partTitle">
|
|
|
+ <span class="orangeLine"></span>家具保养<i
|
|
|
+ class="el-icon-d-arrow-right"
|
|
|
+ ></i>
|
|
|
+ </div>
|
|
|
<div class="hyzxDiv">
|
|
|
<div class="topDiv">
|
|
|
<div class="leftDiv">
|
|
|
@@ -326,6 +348,12 @@ export default {
|
|
|
border-radius: 0.15rem;
|
|
|
margin-right: 1rem;
|
|
|
}
|
|
|
+ .more {
|
|
|
+ line-height: 3rem;
|
|
|
+ font-size: 1.4rem;
|
|
|
+ color: #999;
|
|
|
+ float: right;
|
|
|
+ }
|
|
|
}
|
|
|
.fwnl {
|
|
|
width: 100%;
|
|
|
@@ -341,13 +369,15 @@ export default {
|
|
|
.numDiv {
|
|
|
margin-bottom: 1rem;
|
|
|
img {
|
|
|
- height: 3rem;
|
|
|
+ height: 3.6rem;
|
|
|
vertical-align: bottom;
|
|
|
}
|
|
|
span {
|
|
|
font-size: 1.8rem;
|
|
|
color: #fd5522;
|
|
|
+ font-weight: bold;
|
|
|
vertical-align: bottom;
|
|
|
+ margin-left: 1rem;
|
|
|
}
|
|
|
}
|
|
|
.titleDiv {
|
|
|
@@ -392,11 +422,12 @@ export default {
|
|
|
line-height: 2rem;
|
|
|
font-size: 1.4rem;
|
|
|
color: #333;
|
|
|
- margin-top: 1rem;
|
|
|
+ font-weight: bold;
|
|
|
+ margin-top: 2rem;
|
|
|
overflow: hidden;
|
|
|
}
|
|
|
.company {
|
|
|
- height: 4rem;
|
|
|
+ height: 2rem;
|
|
|
line-height: 2rem;
|
|
|
font-size: 1.2rem;
|
|
|
color: #666;
|
|
|
@@ -404,10 +435,11 @@ export default {
|
|
|
}
|
|
|
}
|
|
|
.rmspItem {
|
|
|
- padding: 1.6rem;
|
|
|
+ padding: 2rem;
|
|
|
.imgDiv {
|
|
|
border: 0.1rem solid #e5e5e5;
|
|
|
text-align: center;
|
|
|
+ line-height: 0;
|
|
|
img {
|
|
|
width: 100%;
|
|
|
}
|
|
|
@@ -415,8 +447,9 @@ export default {
|
|
|
.money {
|
|
|
height: 2rem;
|
|
|
line-height: 2rem;
|
|
|
- font-size: 1.2rem;
|
|
|
+ font-size: 1.8rem;
|
|
|
color: #fd5522;
|
|
|
+ margin-top: 1.5rem;
|
|
|
}
|
|
|
}
|
|
|
.ppsjItem {
|
|
|
@@ -427,11 +460,11 @@ export default {
|
|
|
}
|
|
|
}
|
|
|
.name {
|
|
|
- padding: 0 1.6rem;
|
|
|
+ padding: 0 2rem;
|
|
|
box-sizing: border-box;
|
|
|
}
|
|
|
.company {
|
|
|
- padding: 0 1.6rem;
|
|
|
+ padding: 0 2rem;
|
|
|
box-sizing: border-box;
|
|
|
}
|
|
|
}
|
|
|
@@ -449,7 +482,7 @@ export default {
|
|
|
img {
|
|
|
height: 1.6rem;
|
|
|
vertical-align: middle;
|
|
|
- margin-right: 0.4rem;
|
|
|
+ margin-right: 1rem;
|
|
|
}
|
|
|
.more {
|
|
|
line-height: 3rem;
|
|
|
@@ -459,8 +492,8 @@ export default {
|
|
|
}
|
|
|
}
|
|
|
.xq {
|
|
|
- height: 3rem;
|
|
|
- line-height: 3rem;
|
|
|
+ height: 3.6rem;
|
|
|
+ line-height: 3.6rem;
|
|
|
overflow: hidden;
|
|
|
.con {
|
|
|
width: 80%;
|
|
|
@@ -488,6 +521,7 @@ export default {
|
|
|
border-radius: 0.4rem;
|
|
|
padding: 1.6rem;
|
|
|
box-sizing: border-box;
|
|
|
+ margin-bottom: 4rem;
|
|
|
.topDiv {
|
|
|
width: 100%;
|
|
|
display: table;
|
|
|
@@ -501,6 +535,7 @@ export default {
|
|
|
width: 80%;
|
|
|
display: inline-block;
|
|
|
border: 0.1rem solid #e5e5e5;
|
|
|
+ line-height: 0;
|
|
|
img {
|
|
|
width: 100%;
|
|
|
}
|
|
|
@@ -551,6 +586,9 @@ export default {
|
|
|
.bg-84 {
|
|
|
background: #84ccc9;
|
|
|
}
|
|
|
+.mt15px {
|
|
|
+ margin-top: 1.5rem;
|
|
|
+}
|
|
|
.mt2rem {
|
|
|
margin-top: 2rem;
|
|
|
}
|