This commit is contained in:
shijingjing
2022-05-26 14:53:25 +08:00
parent 4870798cda
commit 249fdcf4ff
4 changed files with 71 additions and 15 deletions

View File

@@ -46,7 +46,7 @@
<div class="addBtn" @click="toReport" hover-class="text-hover">添加上报人员</div>
</div>
<u-popup v-model="show" mode="bottom" border-radius="30" height="200px">
<u-popup v-model="show" mode="bottom" border-radius="30">
<div class="shareBox">
<h2>分享到</h2>
<div class="card">
@@ -59,6 +59,7 @@
<div class="names">微信邀请</div>
</div>
</div>
<div class="close" @click="show = false">取消</div>
</div>
</u-popup>
@@ -320,11 +321,15 @@ export default {
}
.shareBox {
padding: 32px;
padding-top: 32px;
box-sizing: border-box;
h2 {
padding: 0 32px;
font-weight: 600;
}
.card {
display: flex;
margin-top: 60px;
padding: 60px 32px 32px 32px;
.itemCard {
flex: 1;
text-align: center;
@@ -335,6 +340,15 @@ export default {
}
}
}
// ::v-deep .u-popup .u-drawer .u-drawer-bottom {
// bottom: 50px;
// }
.close {
height: 112px;
line-height: 112px;
text-align: center;
border-top: 2px solid #EEEEEE;
}
}
.showCode {

View File

@@ -42,7 +42,7 @@
<div class="addbtn" @click="toReport" hover-class="text-hover">添加返乡报备</div>
</div>
<u-popup v-model="show" mode="bottom" border-radius="30" height="200px">
<u-popup v-model="show" mode="bottom" border-radius="30">
<div class="shareBox">
<h2>分享到</h2>
<div class="card">
@@ -55,6 +55,7 @@
<div class="names">微信邀请</div>
</div>
</div>
<div class="close" @click="show = false">取消</div>
</div>
</u-popup>
@@ -110,7 +111,7 @@ export default {
toReport() {
this.$linkTo('./Add')
},
// 扫码登记
registerCode() {
this.show = false;
@@ -289,21 +290,31 @@ export default {
}
.shareBox {
padding: 32px;
padding-top: 32px;
box-sizing: border-box;
h2 {
padding: 0 32px;
font-weight: 600;
}
.card {
display: flex;
margin-top: 60px;
padding: 60px 32px 32px 32px;
.itemCard {
flex: 1;
text-align: center;
// width: 25%;
img {
width: 96px;
height: 96px;
}
}
}
.close {
height: 112px;
line-height: 112px;
text-align: center;
border-top: 2px solid #EEEEEE;
}
}
.showCode {

View File

@@ -28,11 +28,12 @@
<div class="card">
<div class="item-info">
<div class="item-info__item">
<image src="/static/img/from-icon.png"/>
<span class="from"></span>
<div class="lines"></div>
<span>{{ info.startAreaName }}</span>
</div>
<div class="item-info__item">
<image src="/static/img/to-icon.png"/>
<span class="to"></span>
<span>{{ info.arriveAreaName }}</span>
</div>
<div class="item-info__item">
@@ -196,8 +197,8 @@ export default {
padding-bottom: 40px;
.detail-header {
padding: 32px;
height: 680px;
padding: 32px 32px 100px 32px;
// height: 680px;
background: linear-gradient(135deg, #6496FF 0%, #4F75FF 100%);
position: relative;
@@ -270,6 +271,7 @@ export default {
display: flex;
align-items: center;
margin-bottom: 8px;
position: relative;
&:last-child {
margin-bottom: 0;
@@ -281,9 +283,39 @@ export default {
margin-right: 16px;
}
span {
.from,
.to {
display: inline-block;
width: 12px;
height: 12px;
border: 2px solid #FFFFFF;
border-radius: 50%;
}
.from {
background: #FFBB3B;
z-index: 9;
}
.to {
background: #2BD6C0;
z-index: 9;
}
.lines {
position: absolute;
top: 35px;
left: 6px;
width: 4px;
height: 80%;
border-left: 4px dotted #CCCCCC;
}
span:last-child {
color: #fff;
font-size: 28px;
margin-left: 16px;
}
}
}
@@ -293,13 +325,12 @@ export default {
.info {
position: absolute;
top: 657px;
top: 60%;
left: 50%;
width: 100%;
transform: translate(-50%, 1%);
.detail-info {
margin-top: 24px;
padding: 0 32px;
background: #fff;
border-radius: 16px 16px 0 0;

Binary file not shown.

After

Width:  |  Height:  |  Size: 502 B