Browse Source

增加就诊人页面

master
kuaileWu 2 years ago
parent
commit
e92242ef40
  1. 7
      App.vue
  2. 10
      pages.json
  3. 142
      pages/add_visitor/add_visitor.vue
  4. 0
      static/images/frontend/add.svg
  5. 1
      static/images/frontend/visitor_list__bg.svg
  6. 1
      static/images/frontend/visitor_select_active.svg

7
App.vue

@ -191,4 +191,11 @@
.flex{
display: flex;
}
.line36{
line-height: 36rpx !important;
height: 36rpx !important;
}
.line40{
line-height: 40rpx !important;
}
</style>

10
pages.json

@ -1,5 +1,13 @@
{
"pages": [ //pageshttps://uniapp.dcloud.io/collocation/pages
"pages": [
{
"path" : "pages/add_visitor/add_visitor",
"style" :
{
"navigationBarTitleText": "请选择就诊人",
"enablePullDownRefresh": false
}
},
{
"path": "pages/index/index",
"style": {

142
pages/add_visitor/add_visitor.vue

@ -0,0 +1,142 @@
<template>
<view class='add-visitor-page'>
<view class="header block flex line40">
<img :src="cssUrl+'add.svg'" alt="">增加就诊人
</view>
<view class="list-wrapper">
<view class="item block">
<view class="top flex">
<view class="PfScSemibold">张杨明</view>
<view>剩余3次</view>
</view>
<view class="bot line36">
身份证尾号0909备份
</view>
<img class="status" :src="cssUrl+'visitor_select_active.svg'">
<img class="bg" :src="cssUrl+'visitor_list__bg.svg'">
</view>
<view class="item block">
<view class="top flex">
<view class="PfScSemibold">张杨明</view>
<view>剩余3次</view>
</view>
<view class="bot line36">
身份证尾号0909备份
</view>
<img class="status" :src="cssUrl+'visitor_select_active.svg'" v-if="false">
<img class="bg" :src="cssUrl+'visitor_list__bg.svg'">
</view>
</view>
<view class="submit">
<view class="bot primary btn btn2 submitbtn" hover-class="hover">
确认预约已选1位
</view>
<view class="tip height40">请确保预约就诊前在门诊先挂号</view>
</view>
</view>
</template>
<script>
export default {
data() {
return {
cssUrl:this.cssUrl
}
},
methods: {
}
}
</script>
<style lang="scss" scoped>
.add-visitor-page{
overflow: hidden;
.block{
width: 714rpx;
background: #FFFFFF;
box-shadow: 0rpx 2rpx 24rpx 0rpx rgba(0,0,0,0.03);
border-radius: 8rpx;
margin: 20rpx auto 0;
}
.header{
justify-content: center;
height: 96rpx;
align-items: center;
font-size: 28rpx;
color: #666666;
img{
width: 44rpx;
height: 44rpx;
margin-right: 16rpx;
}
}
.list-wrapper{
height: 70vh;
padding-bottom: 20rpx;
overflow-y: auto;
box-sizing: border-box;
.item{
padding: 34rpx 24rpx;
box-sizing: border-box;
height: 196rpx;
position: relative;
.top{
line-height: 50rpx;
height: 50rpx;
align-items: center;
view:first-of-type{
font-size: 38rpx;
color: #333333;
letter-spacing: 3rpx;
}
view:last-of-type{
width: 134rpx;
color: #79624A;
text-align: center;
font-size: 28rpx;
background: rgba(254, 232, 198, 0.66);
border-radius: 6rpx;
height: 44rpx;
line-height: 44rpx;
margin-left: 56rpx;
}
}
.bot{
margin-top: 32rpx;
font-size: 30rpx;
color: #949699;
}
img{
position: absolute;
}
.status{
right: 0;
top: 0;
width: 98rpx;
height: 98rpx;
}
.bg{
bottom: 0;
right: 0;
width: 162rpx;
height: 78rpx;
}
}
}
.submit{
position: fixed;
width: 100%;
top: 82.41%;
.submitbtn{
width: 646rpx;
margin: 0 auto;
}
.tip{
text-align: center;
font-size: 28rpx;
color: #B3B4BC;
margin-top: 33rpx;
}
}
}
</style>

0
static/images/frontend/unuse/编组 31.svg → static/images/frontend/add.svg

Before

Width:  |  Height:  |  Size: 1.7 KiB

After

Width:  |  Height:  |  Size: 1.7 KiB

1
static/images/frontend/visitor_list__bg.svg

@ -0,0 +1 @@
<?xml version="1.0" encoding="UTF-8"?><svg version="1.1" width="162px" height="77px" viewBox="0 0 162.0 77.0" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><defs><clipPath id="i0"><path d="M1474,0 L1474,2382 L0,2382 L0,0 L1474,0 Z"></path></clipPath><clipPath id="i1"><path d="M162,0 L162,77 L0,77 L0,0 L162,0 Z"></path></clipPath><clipPath id="i2"><path d="M74.3048024,0 C96.7801394,-1.12340798e-14 115,18.2198606 115,40.6951976 L115,43.3048024 C115,65.7801394 96.7801394,84 74.3048024,84 L0,84 L0,40.6951976 C-2.75243496e-15,18.2198606 18.2198606,-4.3529924e-15 40.6951976,0 L74.3048024,0 Z"></path></clipPath><linearGradient id="i3" x1="57.5px" y1="0px" x2="57.5px" y2="84px" gradientUnits="userSpaceOnUse"><stop stop-color="rgba(164, 250, 204, 0.541786)" offset="0%"></stop><stop stop-color="#55CF7F" offset="100%"></stop></linearGradient><clipPath id="i4"><path d="M43.5828814,0 C57.0680836,-2.47719146e-15 68,10.9319164 68,24.4171186 L68,25.5828814 C68,39.0680836 57.0680836,50 43.5828814,50 L0,50 L0,24.4171186 C-1.65146097e-15,10.9319164 10.9319164,-5.45396638e-15 24.4171186,0 L43.5828814,0 Z"></path></clipPath><linearGradient id="i5" x1="34px" y1="0px" x2="34px" y2="50px" gradientUnits="userSpaceOnUse"><stop stop-color="rgba(164, 250, 204, 0.541786)" offset="0%"></stop><stop stop-color="#55CF7F" offset="100%"></stop></linearGradient><clipPath id="i6"><path d="M30.908017,0 C40.3476586,-1.73403402e-15 48,7.65234145 48,17.091983 L48,17.908017 C48,27.3476586 40.3476586,35 30.908017,35 L0,35 L0,17.091983 C2.396691e-15,7.65234145 7.65234145,1.15602268e-15 17.091983,0 L30.908017,0 Z"></path></clipPath><linearGradient id="i7" x1="24px" y1="0px" x2="24px" y2="35px" gradientUnits="userSpaceOnUse"><stop stop-color="rgba(164, 250, 204, 0.541786)" offset="0%"></stop><stop stop-color="#55CF7F" offset="100%"></stop></linearGradient></defs><g transform="translate(-24.0 -267.0)"><g clip-path="url(#i0)"><g transform="translate(24.0 267.0)"><g clip-path="url(#i1)"><g opacity="38.7583415%"><g transform="translate(0.0 39.0)"><g clip-path="url(#i2)"><polygon points="0,0 115,0 115,38 0,38 0,0" stroke="none" fill="url(#i3)" opacity="42.0411609%"></polygon></g></g><g transform="translate(75.0 14.0)"><g clip-path="url(#i4)"><polygon points="0,0 68,0 68,50 0,50 0,0" stroke="none" fill="url(#i5)" opacity="42.0411609%"></polygon></g></g><g transform="translate(114.0 0.0)"><g clip-path="url(#i6)"><polygon points="0,0 48,0 48,35 0,35 0,0" stroke="none" fill="url(#i7)" opacity="42.0411609%"></polygon></g></g></g></g></g></g></g></svg>

After

Width:  |  Height:  |  Size: 2.5 KiB

1
static/images/frontend/visitor_select_active.svg

@ -0,0 +1 @@
<?xml version="1.0" encoding="UTF-8"?><svg version="1.1" width="100px" height="100px" viewBox="0 0 100.0 100.0" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><defs><clipPath id="i0"><path d="M1474,0 L1474,2382 L0,2382 L0,0 L1474,0 Z"></path></clipPath><clipPath id="i1"><path d="M92,0 C96.418278,-8.11624501e-16 100,3.581722 100,8 L100,100 L0,100 L0,0 L92,0 Z"></path></clipPath><clipPath id="i2"><path d="M100,0 L100,100 L0,0 L100,0 Z"></path></clipPath><clipPath id="i3"><path d="M22.1529914,0 C22.6522995,0 23.1276494,0.21406046 23.4585914,0.587940188 C24.1785914,1.3679402 24.1785914,2.63394018 23.4585914,3.41394019 L10.5357914,17.4155402 C10.1745914,17.8043402 9.70179138,17.9999402 9.23019138,17.9999402 C8.73231473,17.9967589 8.25863634,17.7847356 7.92459137,17.4155402 L0.539791377,9.41514019 C-0.179930459,8.60923862 -0.179930459,7.39144176 0.539791377,6.58554019 C0.871531099,6.21347564 1.34631042,6.00070264 1.84479138,6.00070264 C2.34327234,6.00070264 2.81805166,6.21347564 3.14979138,6.58554019 L9.23019138,13.1723402 L20.8473914,0.587940188 C21.1783333,0.21406046 21.6536832,0 22.1529914,0 Z"></path></clipPath></defs><g transform="translate(-65.0 -1128.0)"><g clip-path="url(#i0)"><g transform="translate(65.0 1128.0)"><g clip-path="url(#i1)"><g clip-path="url(#i2)"><polygon points="0,0 100,0 100,100 0,100 0,0" stroke="none" fill="#39D067"></polygon></g></g><g transform="translate(54.9978086226256 23.79765982391291)"><g clip-path="url(#i3)"><polygon points="-5.90453355e-16,0 23.9985914,0 23.9985914,17.9999402 -5.90453355e-16,17.9999402 -5.90453355e-16,0" stroke="none" fill="#FFFFFF"></polygon></g></g></g></g></g></svg>

After

Width:  |  Height:  |  Size: 1.6 KiB

Loading…
Cancel
Save