更新大理市民卡app
diff --git a/pages/sub_medical/appointment.vue b/pages/sub_medical/appointment.vue
new file mode 100644
index 0000000..5de78b7
--- /dev/null
+++ b/pages/sub_medical/appointment.vue
@@ -0,0 +1,279 @@
+<template>
+ <view class="appointment">
+ <view class="appointment-header" @click="getLocal">
+ <u-image src="./images/app_bannar.png" width="100%" mode="widthFix"></u-image>
+ <u-icon name="map" color="#52B6E6" size="36" :label="local" class="appointment-header-icon"></u-icon>
+ </view>
+ <view class="appointment-search">
+ <u-search placeholder="搜索医院名称" v-model="hospial" :show-action="false" bg-color="#ffffff" @focus="toPath('/pages/sub_medical/hospital')"></u-search>
+ </view>
+ <view class="appointment-record">
+ <u-cell-group>
+ <u-cell-item title="我的挂号记录" value="查看更多" @click="toPath('/pages/sub_medical/record')"></u-cell-item>
+ </u-cell-group>
+ <view class="appointment-record-msg" v-if="record_list.length != 0">
+ <view class="appointment-record-msg-left">
+ <u-image src="/static/images/active/mrlfl.png" width="100" mode="widthFix"></u-image>
+ </view>
+ <view class="appointment-record-msg-center">
+ <view class="appointment-record-msg-center-item">
+ <text class="appointment-record-msg-center-item-title">就诊人员：</text>
+ <text class="appointment-record-msg-center-item-value">李小萌</text>
+ </view>
+ <view class="appointment-record-msg-center-item">
+ <text class="appointment-record-msg-center-item-title">就诊医院：</text>
+ <text class="appointment-record-msg-center-item-value">大理市第二人民医院</text>
+ </view>
+ <view class="appointment-record-msg-center-item">
+ <text class="appointment-record-msg-center-item-title">就诊科室：</text>
+ <text class="appointment-record-msg-center-item-value">普外科</text>
+ </view>
+ <view class="appointment-record-msg-center-item">
+ <text class="appointment-record-msg-center-item-title">就诊时间：</text>
+ <text class="appointment-record-msg-center-item-value">2020-10-27【上午】</text>
+ </view>
+ </view>
+ <view class="appointment-record-msg-right">
+ <text class="appointment-record-msg-status">挂号成功</text>
+ </view>
+ </view>
+ <view class="appointment-record-nomsg" v-else>
+ <text>暂无挂号记录</text>
+ </view>
+ <!-- <view class="appointment-record-btn">
+ <u-button :plain="true" size="mini" type="primary" shape="circle">取消预约</u-button>
+ </view> -->
+ </view>
+ <view class="appointment-hospital">
+ <u-cell-group>
+ <u-cell-item title="本地医院" value="查看更多" @click="toPath('/pages/sub_medical/hospital')"></u-cell-item>
+ </u-cell-group>
+ <view class="appointment-hospital-msg" v-if="hospital_list.length != 0">
+ <view class="appointment-hospital-msg-box" @click="toPath('/pages/sub_medical/outpatient')" v-for="(v,i) in hospital_list" :key="i">
+ <view class="appointment-hospital-msg-left">
+ <u-image :src="v.src" width="100" mode="widthFix"></u-image>
+ </view>
+ <view class="appointment-hospital-msg-right">
+ <view class="appointment-hospital-msg-right-item">
+ <text class="appointment-hospital-msg-right-item-logo">{{v.level}}</text>
+ <text class="appointment-hospital-msg-right-item-value" style="color: #333333;font-size: 32rpx;">{{v.name}}</text>
+ </view>
+ <view class="appointment-hospital-msg-right-item">
+ <text class="appointment-hospital-msg-right-item-title">地理位置：</text>
+ <text class="appointment-hospital-msg-right-item-value">{{v.address}}</text>
+ </view>
+ <view class="appointment-hospital-msg-right-item">
+ <text class="appointment-hospital-msg-right-item-title">门诊时间：</text>
+ <text class="appointment-hospital-msg-right-item-value">{{v.time}}</text>
+ </view>
+ </view>
+ </view>
+ </view>
+ <view class="appointment-hospital-nomsg" v-else>
+ <text>暂无医院数据</text>
+ </view>
+ </view>
+ </view>
+</template>
+
+<script>
+ export default {
+ data() {
+ return {
+ local: '大理',
+ hospial: '',
+ hospital_list:[],
+ record_list:[]
+ }
+ },
+ onLoad() {
+ this.get_hospital_list()
+ this.getLocal()
+ },
+ methods: {
+ getLocal() {
+ let that = this
+ uni.getLocation({
+ type: 'gcj02',
+ geocode: true,
+ success(res) {
+ console.log(res)
+ // #ifdef APP-PLUS
+ that.local = res.address.city
+ // #endif
+ },
+ fail(ret){
+ that.local = '获取位置失败'
+ console.log(ret)
+ }
+ })
+ },
+ get_hospital_list(){
+ let that = this
+ let params = {
+ pageno:1,
+ pagesize:3,
+ name:''
+ }
+ that.$u.get('/medicineapi/hospital/list',params).then(res=>{
+ that.hospital_list = res.data.list
+ console.log(res.data.list)
+ })
+ }
+ }
+ }
+</script>
+
+<style lang="scss" scoped>
+ /deep/.u-btn--primary--plain {
+ background-color: #FFFFFF !important;
+ }
+
+ .u-cell {
+ padding: 30rpx 20rpx;
+ }
+
+ /deep/.u-cell__right-icon-wrap {
+ height: 54rpx;
+ }
+
+ uni-button {
+ margin-left: 0;
+ margin-right: 0;
+ }
+
+ .appointment {
+ font-family: "PingFang-SC-Medium";
+
+ &-header {
+ position: relative;
+
+ &-icon {
+ position: absolute;
+ top: 20rpx;
+ left: 20rpx;
+ }
+ }
+
+ &-search {
+ padding: 30rpx;
+ }
+
+ &-record {
+ background-color: #FFFFFF;
+ &-nomsg{
+ display: flex;
+ justify-content: center;
+ align-items: center;
+ padding: 50rpx 30rpx;
+ }
+
+ &-msg {
+ padding: 30rpx 10rpx;
+ display: flex;
+ justify-content: space-between;
+
+ // align-items: center;
+ &-left {
+ flex: 1;
+ display: flex;
+ justify-content: center;
+ }
+
+ &-center {
+ flex: 3;
+
+ &-item {
+ padding: 0 0 10rpx;
+
+ &-title {
+ color: #909399;
+ }
+ }
+ }
+
+ &-right {
+ display: flex;
+ justify-content: center;
+ flex: 1;
+ color: #3DC64F;
+
+ &-item {}
+ }
+ }
+
+ &-btn {
+ padding: 0rpx 30rpx 30rpx;
+ display: flex;
+ justify-content: flex-end;
+ }
+ }
+
+ &-hospital {
+ background-color: #FFFFFF;
+ margin: 30rpx 0;
+
+ &-nomsg{
+ display: flex;
+ justify-content: center;
+ align-items: center;
+ padding: 50rpx 30rpx;
+ }
+
+ &-msg {
+ &-box {
+ display: flex;
+ justify-content: space-between;
+ padding: 30rpx 10rpx;
+ }
+
+ &-left {
+ flex: 1;
+ display: flex;
+ justify-content: center;
+ }
+
+ &-right {
+ display: flex;
+ flex: 4;
+ flex-direction: column;
+
+ &-item {
+ padding: 0 0 10rpx;
+ display: flex;
+ align-items: center;
+
+ &-logo {
+ display: inline-block;
+ background-color: #17C46F;
+ padding: 4rpx;
+ color: #FFFFFF;
+ font-size: 20rpx;
+ border-radius: 5rpx;
+ margin-right: 10rpx;
+ }
+
+ &-title {
+ display: inline-block;
+ // flex: 1;
+ width: 140rpx;
+ color: #B5B5B5;
+ font-size: 26rpx;
+ }
+
+ &-value {
+ display: inline-block;
+ // flex: 4;
+ color: #B5B5B5;
+ width: 400rpx;
+ white-space: nowrap;
+ text-overflow: ellipsis;
+ overflow: hidden;
+ font-size: 28rpx;
+ }
+ }
+ }
+ }
+ }
+ }
+</style>