开票通知模块css代码优化

This commit is contained in:
2023-09-01 10:12:28 +08:00
parent 2abcfa7d68
commit 1b93cb10fd
4 changed files with 25 additions and 28 deletions

View File

@ -59,6 +59,10 @@
color: $col; color: $col;
opacity: $alpha; opacity: $alpha;
} }
@mixin bgcolorOpa($col,$alpha){
background: $col;
opacity: $alpha;
}
@mixin radiusSizing($rad){ @mixin radiusSizing($rad){
border-radius: $rad; border-radius: $rad;
box-sizing: border-box; box-sizing: border-box;

View File

@ -56,10 +56,7 @@ export default {
pageSize:this.pageSize, pageSize:this.pageSize,
...this.form, ...this.form,
}) })
// if(res.code=== 200){ this.detailList=res.data
this.detailList=res.data
// }
// console.log("resssss",res)
} }
} }
} }
@ -75,22 +72,19 @@ export default {
height: 46px; height: 46px;
} }
.contentWrap{ .contentWrap{
width: 100%; @include wh(100%,400px);
height: 400px; margin-left: 27px;
margin-left: 27px;
.item{ .item{
width: 100%; width: 100%;
@include all-height(47px); @include all-height(47px);
.itemContent{ .itemContent{
margin-left: 5px; margin-left: 5px;
@include fontWeightSize(400,13px);
color: #323643; color: #323643;
@include fontWeightSize(400,13px);
} }
.line{ .line{
width: 100%; @include wh(100%,1px);
height: 1px; @include bgcolorOpa(#E9E9EA,0.6);
background: #E9E9EA;
opacity: 0.6;
} }
} }
} }

View File

@ -1,7 +1,6 @@
<template> <template>
<div v-if="show" <div class="empty" v-if="show">
style="width:100%;height:100%;background-color: #FAFAFA;display: flex;align-items: center;justify-content: center"> <img src="@/assets/empty.png" >
<img src="@/assets/empty.png" style="width:100%;">
</div> </div>
<div class="wrap" v-else> <div class="wrap" v-else>
<ul id="dataList" class="dataList"> <ul id="dataList" class="dataList">
@ -62,7 +61,14 @@ export default {
<style scoped lang="scss"> <style scoped lang="scss">
@import "@/styles/mixin.scss"; @import "@/styles/mixin.scss";
@import "@/styles/common.scss"; @import "@/styles/common.scss";
.empty{
@include wh(100%,100%);
background-color: #FAFAFA;
@include flexTwoCenter;
img{
width: 100%;
}
}
.wrap { .wrap {
@include wh(100%, 100%); @include wh(100%, 100%);
box-sizing: border-box; box-sizing: border-box;

View File

@ -114,15 +114,13 @@ export default {
<style scoped lang="scss"> <style scoped lang="scss">
@import "@/styles/mixin.scss"; @import "@/styles/mixin.scss";
.wrap{ .wrap{
width: 100%; @include wh(100%,100%);
height: 100%;
background-color: #F4F5F7; background-color: #F4F5F7;
overflow-y: auto; overflow-y: auto;
} }
.common{ .common{
background: #FFFFFF; background: #FFFFFF;
border-radius: 6px; @include radiusSizing(6px);
box-sizing: border-box;
padding: 11px 17px 15px 24px; padding: 11px 17px 15px 24px;
} }
.fontColor{ .fontColor{
@ -144,7 +142,6 @@ export default {
.rightContent{ .rightContent{
height: 189px; height: 189px;
width: calc(100% - 60px); width: calc(100% - 60px);
//@include wh(90px,189px);
} }
} }
} }
@ -152,9 +149,7 @@ export default {
@include wh(100%,356px); @include wh(100%,356px);
margin-bottom: 30px; margin-bottom: 30px;
.item{ .item{
display: flex; @include flexCenter;
align-items: center;
//line-height: 27px;
} }
.infoContent{ .infoContent{
.leftTitle{ .leftTitle{
@ -169,8 +164,7 @@ export default {
.vehicleRemark{ .vehicleRemark{
@include fontWeightSize(400,11px); @include fontWeightSize(400,11px);
opacity: 0.55; @include colorOpa(#121212,0.55);
color: #121212;
line-height: 14px; line-height: 14px;
flex: 1; flex: 1;
} }
@ -181,9 +175,8 @@ export default {
} }
.title{ .title{
@include fontWeightSize(bold,14px); @include fontWeightSize(bold,14px);
color: #323643; @include colorOpa(#323643,0.6);
line-height: 20px; line-height: 20px;
opacity: .6;
} }
.line{ .line{
@include wh(100%,2px); @include wh(100%,2px);