Commit a6ecae38 authored by liangliang.wang01's avatar liangliang.wang01 🤸🏽

优化账单页面,尝试解决跳转时出现的盒子变形问题。

parent bb7232b4
...@@ -24,10 +24,10 @@ ...@@ -24,10 +24,10 @@
<div class="cont-type" style="color: #5a5959;font-size: 14px">状态:<span style="font-weight: 700; <div class="cont-type" style="color: #5a5959;font-size: 14px">状态:<span style="font-weight: 700;
color: rgba(198, 0, 0, 0.5);">{{ item.status }}</span></div> color: rgba(198, 0, 0, 0.5);">{{ item.status }}</span></div>
</div> </div>
<button @click="download(index)">账单下载</button> <router-link :to="{name:'CmbPolyPayDetail',query:{contractno:item.contractno}}" class="more">
<router-link :to="{name:'CmbPolyPayDetail',query:{contractno:item.contractno}}"> <img src="../../../assets\image\right-arrow@2x.png" alt="">
<img src="../../../assets\image\right-arrow@2x.png" class="more" alt="">
</router-link> </router-link>
<button @click="download(index)">账单下载</button>
</article> </article>
</div> </div>
<div v-else-if="ListNum == 0" class="billList"> <div v-else-if="ListNum == 0" class="billList">
...@@ -167,6 +167,7 @@ export default { ...@@ -167,6 +167,7 @@ export default {
.billList { .billList {
//账单卡片 //账单卡片
width: 100%; width: 100%;
padding-bottom: 30px;
.article { .article {
position: relative; position: relative;
border: 1px solid #d0d0d0; border: 1px solid #d0d0d0;
...@@ -175,18 +176,18 @@ export default { ...@@ -175,18 +176,18 @@ export default {
height: 200px; height: 200px;
width: 98%; width: 98%;
.text { .text {
margin-left: 45px; float: left;
line-height: 16px;
margin-left: 5px;
margin-right: 0px;
position: relative; position: relative;
top:50%; top:50%;
transform: translateY(-50%); transform: translateY(-50%);
.cont-type{ .cont-type{
padding-top: 2px; padding-top: 2px;
width: 100%; width: 97%;
word-wrap:break-word; word-wrap:break-word;
} }
// :nth-child(1){
// width: 200px;
// }
} }
.icon { .icon {
//左侧图标 //左侧图标
...@@ -194,6 +195,7 @@ export default { ...@@ -194,6 +195,7 @@ export default {
float: left; float: left;
width: 40px; width: 40px;
padding-left: 5px; padding-left: 5px;
margin-right: 0;
top: 50%; top: 50%;
transform: translateY(-20px); transform: translateY(-20px);
img { img {
...@@ -201,10 +203,6 @@ export default { ...@@ -201,10 +203,6 @@ export default {
height: 40px; height: 40px;
} }
} }
.left-icon {
width: 40px;
margin-right: 0;
}
button { button {
position: absolute; position: absolute;
bottom: 12px; bottom: 12px;
...@@ -218,17 +216,12 @@ export default { ...@@ -218,17 +216,12 @@ export default {
border-radius: 5px; border-radius: 5px;
}; };
.more { .more {
position: absolute; top:50%;
right: 5px; transform: translateY(-50%);
top: 50%; position: relative;
transform: translateY(-16px); float: left;
}; };
box-shadow: 3px 3px 3px 3px #b6b6b6; box-shadow: 3px 3px 3px 3px #b6b6b6;
}; };
padding-bottom: 30px;
.text {
margin-left: 15px;
line-height: 16px;
}
} }
</style> </style>
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