更新大理市民卡app
diff --git a/pages/sub_medical/outpatient.vue b/pages/sub_medical/outpatient.vue
new file mode 100644
index 0000000..6eac58a
--- /dev/null
+++ b/pages/sub_medical/outpatient.vue
@@ -0,0 +1,178 @@
+<template>
+ <view class="outpatient">
+ <view class="outpatient-headerbox">
+ <view class="outpatient-header">
+ <view class="outpatient-header-img">
+ <u-image src="/static/images/active/mrlfl.png" width="120" mode="widthFix"></u-image>
+ </view>
+ <view class="outpatient-header-msg">
+ <text class="outpatient-header-msg-title">大理市第一人民医院</text>
+ <text class="outpatient-header-msg-logo">三甲</text>
+ <text class="outpatient-header-msg-to">热门科室：皮肤科、普外科</text>
+ </view>
+ </view>
+ <u-icon name="map" color="#52B6E6" size="36" :label="local" class="outpatient-headerbox-icon" label-color="#A1A1A1"></u-icon>
+ <u-icon name="clock" color="#52B6E6" size="36" :label="time" class="outpatient-headerbox-icon" label-color="#A1A1A1"></u-icon>
+ <u-icon name="phone" color="#52B6E6" size="36" :label="tel" class="outpatient-headerbox-icon" label-color="#A1A1A1"></u-icon>
+ </view>
+ <view class="outpatient-search">
+ <u-search placeholder="搜索科室名称" v-model="part" :show-action="false" bg-color="#ffffff"></u-search>
+ </view>
+ <view class="outpatient-kinds">
+ <view class="outpatient-kinds-left">
+ <scroll-view scroll-y="true" class="scrollView" :style="{height:height+'px'}">
+ <view class="outpatient-kinds-left-item">
+ <view class="outpatient-kinds-left-item-line"> </view>
+ <u-cell-item title="全部" :arrow="false" bg-color="#ffffff" :title-style="style"></u-cell-item>
+ </view>
+ </scroll-view>
+ </view>
+ <view class="outpatient-kinds-right">
+ <scroll-view scroll-y="true" class="scrollView" :style="{height:height+'px'}">
+ <view class="outpatient-kinds-right-item" @click="toPath('/pages/sub_medical/queryDate')">
+ <u-cell-item title="心内科" :arrow="false"></u-cell-item>
+ </view>
+ <view class="outpatient-kinds-right-item">
+ <u-cell-item title="心内科" :arrow="false"></u-cell-item>
+ </view>
+ <view class="outpatient-kinds-right-item">
+ <u-cell-item title="心内科" :arrow="false"></u-cell-item>
+ </view>
+ <view class="outpatient-kinds-right-item">
+ <u-cell-item title="心内科" :arrow="false"></u-cell-item>
+ </view>
+ <view class="outpatient-kinds-right-item">
+ <u-cell-item title="心内科" :arrow="false"></u-cell-item>
+ </view>
+ </scroll-view>
+ </view>
+ </view>
+ </view>
+</template>
+
+<script>
+ export default {
+ data() {
+ return {
+ local: '云南省大理市下关泰安路36号',
+ time: '上午8:00-11:30;下午14:00-17:30 周六、日照常。',
+ tel: '021-3123320',
+ part: '',
+ height: '',
+ style: {
+ color: '#40AFE3',
+ fontWeight: 'bold'
+ }
+ }
+ },
+ onLoad() {
+ this.getSrcollViewHeight()
+ },
+ methods: {
+ getSrcollViewHeight() {
+ let winHeight
+ let that = this
+ uni.getSystemInfo({
+ success: function(res) {
+ winHeight = res.windowHeight
+ }
+ });
+ //console.log(winHeight)
+ const query = uni.createSelectorQuery().in(that);
+ query.select('.outpatient-search').boundingClientRect(data => {
+ console.log(data)
+ if (!data) {
+ setTimeout(() => {
+ that.getSrcollViewHeight()
+ }, 10)
+ return
+ }
+ that.height = winHeight - data.top - data.height
+ // that.height = (data.bottom - data.height)*2
+ }).exec();
+ },
+ }
+ }
+</script>
+
+<style lang="scss" scoped>
+ .u-cell{
+ padding: 20rpx 32rpx;
+ }
+ .outpatient {
+ font-family: "PingFang-SC-Medium";
+
+ &-headerbox {
+ background-color: #FFFFFF;
+ padding: 30rpx 20rpx;
+
+ &-icon {
+ margin-bottom: 10rpx;
+ font-size: 28rpx;
+ }
+ }
+
+ &-header {
+ display: flex;
+ align-items: center;
+ margin-bottom: 30rpx;
+
+ &-img {
+ justify-content: center;
+
+ }
+
+ &-msg {
+ margin-left: 20rpx;
+ display: flex;
+ flex-direction: column;
+
+ &-title {
+ font-size: 32rpx;
+ }
+
+ &-logo {
+ display: inline-block;
+ background-color: #17C46F;
+ padding: 4rpx;
+ width: 80rpx;
+ color: #FFFFFF;
+ text-align: center;
+ font-size: 20rpx;
+ border-radius: 5rpx;
+ margin: 10rpx 0;
+ }
+
+ &-to {
+ color: #A1A1A1;
+ }
+ }
+
+ }
+
+ &-search {
+ padding: 30rpx;
+ }
+ &-kinds {
+ display: flex;
+ &-left {
+ flex: 1;
+ &-item {
+ display: flex;
+ background-color: #FFFFFF;
+ &-line {
+ width: 10rpx;
+ height: 110rpx;
+ background-color: #40AFE3;
+ }
+ }
+ }
+
+ &-right {
+ flex: 3;
+ background-color: #FFFFFF;
+ }
+ }
+
+ }
+</style>