【小程序】明德E医

Osinghong11小时前成果展示25
复制(Copy)按钮在代码块右上角(如果代码块底部没有出现复制按钮)
复制前请确认logo图片是否全部导入到项目中,会报错的

app.json

{
  "pages": [
    "pages/index/index",
    "pages/logs/logs",
    "pages/departList/departList",
    "pages/toPay/toPay",
    "pages/patientDetail/patientDetail",
    "pages/medicalReport/medicalReport"
  ],
  "window": {
    "navigationBarTextStyle": "white",
    "navigationBarTitleText": "明德E医",
    "navigationBarBackgroundColor": "#3399ff",
    "backgroundColor": "#99ccff",
    "enablePullDownRefresh": true
  },
  "style": "v2",
  "componentFramework": "glass-easel",
  "sitemapLocation": "sitemap.json",
  "lazyCodeLoading": "requiredComponents"
}

app.js

App({
  onLaunch() {
  },
  globalData: {
    userInfo: null,
  }
})

index.js

var app = getApp()
Page({

  /**
   * 页面的初始数据
   */
  data: {
    patientInfo:null,                   //就诊病人信息
  },
  
   /** 用户登录函数  */
  async userLogin(){
    var that = this     //复制当前页面对象
    await this.login().then((res)=>{
        console.log(res.data)
        if(res.data!='10000'){
            app.globalData.userInfo = res.data.data.patient 
            that.setData({
                patientInfo:res.data.data.patient
            })
        }else{
            wx.showToast({
              title: '登录失败',
              duration:2000
            })
        }       
    })
  },

  /** 登录函数 */
  login(){
    return new Promise((resolve,reject)=>{
        wx.showLoading({
          title: '登录中...',
        })
        wx.login({
            success (res) {
            if (res.code) {
                    wx.hideLoading()
                    //发起网络请求
                    wx.request({
                        url: 'https://lsx.gz.yxbug.cn/mdeh_api/userLogin.php',
                        data: {
                            code : res.code,
                            appid : "请修改成自己的",       //appid值
                            secret: "请修改成自己的"     //appsecret值
                        },
                        success(res){
                            console.log(res.data.data)
                            resolve(res)                            
                        }
                    })      
            } else {
                wx.showToast({
                    title: '登录失败',
                    duration:2000,
                    icon:"error"
                })
            }
            }
        })
    })
  },
  toPatientDetail(){
    if(this.data.patientInfo==null){
      return;
    }
    var pid=this.data.patientInfo.p_id
    wx.navigateTo({url:'../patientDetail/patientDetail'})},
})

index.wxml

<!-- 患者信息栏 -->
<view class="patient-card">
    <image class="card-bg-img" src="../../asset/logo/chacepatient.png"></image>
    <view class="patient-card-info">
        <view class="left-card">
            <view class="patient-name">
                <view wx:if="{{patientInfo==null}}" bind:tap="userLogin" class="unlogin">未登录</view>
                <view wx:else bind:tap="userLogin"> {{patientInfo.p_name}} </view>
                <view class="{{patientInfo==null?'e-card-unlogin':'e-card'}}"bind:tap="toPatientDetail">电子诊疗卡</view>
            </view>
            <view class="patient-id-card" wx:if="{{patientInfo==null}}" class="unlogin">就诊卡:000000</view>
            <view class="patient-id-card" wx:else>就诊卡:{{patientInfo.p_id}}</view>
        </view>
        <view class="right-card">
            <view class="chance-patient" bind:tap="changePatient">切换就诊人</view>
        </view>
    </view> 
</view>

index.wxss

/* 患者信息卡栏目 */
.patient-card{
  position: absolute;
  background-color: white;
  border: 1px solid rgba(0, 0, 0, 0);
  border-radius: 8px;
  box-shadow: 0px 5px 8px lightgrey;
  width: 650rpx;
  height: 11vh;
  left: 50rpx;
  top:8vh;
  z-index: 9;
}
.card-bg-img{
  width: 80%;
  height: 100%;
  border-radius: 8px;
  right: 0px;
  position: absolute;
  z-index: 0;
}
.patient-card-info{
  width: 100%;
  display: flex;
  flex-direction: row;
  position: absolute;
  top: 0px;
  left: 0px;
  z-index: 2;
}
.left-card{
  width: 60%;
  font-size: 1em;
  color: rgb(29, 119, 97);
  font-weight: 600;
  line-height: 2em;
  padding:10px;
}
.unlogin{
  color: gray;
}
.patient-name{
  display: flex;
  flex-direction: row;
  align-items: center;
}
.e-card-unlogin,
.e-card{
  font-weight: 500;
  font-size: 0.6em;
  padding: 3px;
  line-height: 1.2em;
  border: rgb(29, 119, 97) 1px solid;
  border-radius: 3px;
  margin-left: 15px;
  z-index: 4;
}
.e-card-unlogin{
  border: rgb(175, 175, 175) 1px solid;
  color: grey;
}
.chance-patient{
  font-size: 0.8em;
  border: rgb(240, 243, 242) 1px solid;
  padding: 5px 10px;
  border-radius: 8px;
  margin:10px auto;
  color: rgb(251, 255, 254);
}

patientDetail.js

var app = getApp()
Page({
  data: {
    patientInfo:null,
    maskIdenty:'',
    maskTell:'',
    isWholeIdenty:false,
    isWholeTell:false,
  },
  mask(txt){
    if(txt.length==11){
      returntxt.substr(0,3).concat("*****").concat(txt.substr(8,3))
    }else{
      return txt.substr(0,3).concat('***********').concat(txt.substr(14,4));}},
  /**
   * 生命周期函数--监听页面加载
   */
  onLoad(options) {
    var maskIdenty=this.mask(app.globalData.userInfo.p_identity)
    var maskTell=this.mask(app.globalData.userInfo.p_tell)
    this.setData({
      patientInfo:app.globalData.userInfo,
      maskIdenty:maskIdenty,
      maskTell:maskTell,
    })
  },
  showWholeIdenty(){
    var isWhole = this.data.isWholeIdenty
    this.setData({
      isWholeIdenty :! isWhole
    })
  },
  /**
   * 生命周期函数--监听页面初次渲染完成
   */
  onReady() {

  },

  /**
   * 生命周期函数--监听页面显示
   */
  onShow() {

  },

  /**
   * 生命周期函数--监听页面隐藏
   */
  onHide() {

  },

  /**
   * 生命周期函数--监听页面卸载
   */
  onUnload() {

  },

  /**
   * 页面相关事件处理函数--监听用户下拉动作
   */
  onPullDownRefresh() {

  },

  /**
   * 页面上拉触底事件的处理函数
   */
  onReachBottom() {

  },

  /**
   * 用户点击右上角分享
   */
  onShareAppMessage() {

  }
})

patientDetail.wxml

<!--pages/patientDetail/patientDetail.wxml-->

<view class="patient-card-top">
    <view class="patient-name">
        {{patientInfo.p_name}}
        <text class="patient-sex"> {{patientInfo.p_sex}} </text>
    </view>
    <view class="patient-id"> 诊卡号:{{patientInfo.p_id}} </view>
</view>
<view class="qrcode">
    <image src="{{patientInfo.p_qrcode}}" class="qrcode-img" wx:if="{{patientInfo.p_qrcode!=''}}"></image>
    <image src="../../asset/logo/no_qrcode.png" wx:if="{{patientInfo.p_qrcode==''}}" class="qrcode-img"></image>
</view>
<view class="patient-detail">   
    <view class="detail-item">
        <text class="item-name">身份证</text>
        <view class="item-value-column" wx:if="{{isWholeIdenty}}">
            <text class="item-value" > {{patientInfo.p_identity}} </text>
            <image src="../../asset/logo/mask-icon.png" class="show-all-icon"></image>
        </view>
        <view class="item-value-column" wx:else="">
            <text class="item-value"> {{maskIdenty}} </text>
            <image src="../../asset/logo/show-all.png" class="show-all-icon"></image>
        </view>
    </view>
    <view class="detail-item"> 
        <text class="item-name">出生日期</text>
        <text class="item-value"> {{patientInfo.p_birthday}}</text>
    </view>
    <view class="detail-item"> 
        <text class="item-name">手机号</text>
        <view class="item-value-column" wx:if="{{!isWholeTell}}">
            <text class="item-value"> {{maskTell}}</text>
            <image src="../../asset/logo/show-all.png" class="show-all-icon" bind:tap="showWholeIdenty"></image>
        </view>
        <view class="item-value-column" wx:else="">
            <text class="item-value"> {{patientInfo.p_tell}}</text>
            <image src="../../asset/logo/mask-icon.png" class="show-all-icon" bind:tap="showWholeIdenty"></image>
        </view>
    </view>
    <view class="detail-item"> 
        <text class="item-name">地址</text>
        <text class="item-value">{{patientInfo.p_address}}</text> </view>
</view>
<view class="edit-patient">
    <view class="btn-edit">修改信息</view>
</view> 

patientDetail.json

{"usingComponents":{},"navigationBarTitleText":"就诊人详情"}

patientDetail.wxss

/* pages/patientDetail/patientDetail.wxss */
.patient-card-top{
  background-color: #3399ff;
  height: 14vh;
}
.patient-name{
  font-size: 1.5em;
  color: white;
  margin-left: 40rpx;
}
.patient-sex{
  font-size: 1rem;
  font-weight: 400;
  margin-left: 30rpx;
}
.patient-id{
  border: none;
  font-size: 1.2rem;
  color: white;
  line-height: 2rem;
  margin-left: 40rpx;
  background: transparent;
}
.edit-patient,
.qrcode,
.patient-detail{
  width: 700rpx;
  margin: 10px auto;
  display: flex;
  flex-direction: column;
  position: relative;
}
.qrcode-img{
  width: 400rpx;
  height: 400rpx;
  margin: 15px auto;
}
.frash-qrcode{
  width: 100%;
  height: 40rpx;
  font-weight: 600;
  line-height: 40rpx;
  position: absolute;
  top: 200rpx;
  text-align: center;
}
.detail-item{
  line-height: 2em;
  margin: 5px 20rpx;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  font-size: 1.1em;
  border-bottom: dashed 1px lightgray;
}
.item-value-column{
  display: flex;
  flex-direction: row;
  align-items: center;
}
.item-name{
  color: rgb(146, 146, 146);
  width: 150rpx;
}
.item-value{
  color: #878888;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.show-all-icon{
  width:20px;
  height: 14px;
  margin-left: 15rpx;
}
.btn{
  width: 700rpx!important;
  height: 2.5em;
  line-height: 2.5em;
  padding: 0!important;
  font-weight: 400;
}
.btn-edit{
  width: 700rpx;
  margin: 10px auto;
  background-color: rgba(230, 230, 230, 0.519);
  line-height: 2.5em;
  text-align: center;
  border-radius: 5px;
  border:solid 1px rgba(197, 197, 197, 0.897);
}


打赏
分享给朋友:

相关文章

【H5】表单11个月前 (11-27)
【JS】For语句7个月前 (03-17)
【JS】筛选数组7个月前 (03-31)