激素页面开发

src/pages/d_patientHormones/index.json

@@ -0,0 +1,5 @@
+{
+  "navigationBarTitleText": "激素用药详情",
+  "navigationStyle": "default",
+  "usingComponents": {}
+}

src/pages/d_patientHormones/index.scss

@@ -0,0 +1,105 @@
+page {
+  background-color: #f6f8f9;
+}
+.page {
+  .list {
+    margin: 28rpx 40rpx 0;
+    .list-title {
+      font-size: 36rpx;
+      color: #211d2e;
+      font-weight: bold;
+    }
+    .list-container {
+      .row {
+        display: flex;
+        gap: 16rpx;
+        .aside {
+          flex-shrink: 0;
+          display: flex;
+          flex-direction: column;
+          align-items: center;
+          .line-top {
+            height: 58rpx;
+            border-right: 1px dashed rgba(185, 130, 255, 0.29);
+          }
+          .side {
+            position: relative;
+            width: 32rpx;
+            height: 32rpx;
+            border-radius: 50%;
+            background-color: rgba(185, 130, 255, 0.3);
+            &::after {
+              position: absolute;
+              top: 50%;
+              left: 50%;
+              transform: translate(-50%, -50%);
+              display: block;
+              content: '';
+              width: 18rpx;
+              height: 18rpx;
+              background-color: #b982ff;
+              border-radius: 50%;
+            }
+          }
+          .line {
+            flex: 1;
+            border-right: 1px dashed rgba(185, 130, 255, 0.29);
+          }
+        }
+        .r-container {
+          padding-top: 48rpx;
+          flex: 1;
+          .date {
+            font-size: 32rpx;
+            color: #211d2e;
+            font-weight: bold;
+          }
+          .r-card-hormones {
+            margin-top: 16rpx;
+            padding: 26rpx 32rpx;
+            background: linear-gradient( 11deg, #FFFFFF 0%, #FFFFFF 49%, #F6EFFF 100%);
+            border-radius: 24rpx 24rpx 24rpx 24rpx;
+            border: 2rpx solid #ffffff;
+            .rch-row {
+              display: flex;
+              .col {
+                .title {
+                  font-size: 32rpx;
+                  color: #211d2e;
+                }
+                .content {
+                  margin-top: 24rpx;
+                  font-size: 40rpx;
+                  color: #b982ff;
+                  font-weight: bold;
+                }
+              }
+              .line {
+                flex-shrink: 0;
+                margin: 0 32rpx;
+                width: 1px;
+                height: 102rpx;
+                background-color: rgba(33, 29, 46, 0.05);
+              }
+            }
+            .rch-footer {
+              margin-top: 22rpx;
+              border-top: 1px solid rgba(33, 29, 46, 0.05);
+              padding-top: 22rpx;
+              display: flex;
+              gap: 48rpx;
+              .name {
+                width: 8em;
+                font-size: 32rpx;
+                color: #211d2e;
+              }
+              .range {
+                color: #b982ff;
+              }
+            }
+          }
+        }
+      }
+    }
+  }
+}

src/pages/d_patientHormones/index.ts

@@ -0,0 +1,44 @@
+const _app = getApp<IAppOption>()
+
+Page({
+  data: {
+    list: [
+      {
+        date: '2025-09-02',
+      },
+    ],
+    pagination: {
+      page: 1,
+      pages: 1,
+      count: 1,
+    },
+  },
+  onLoad() {},
+  getList(newPage = 1) {
+    wx.ajax({
+      method: 'GET',
+      url: '?r=xd/qol/list',
+      data: {
+        page: newPage,
+      },
+    }).then((res) => {
+      let list = res.page == 1 ? res.list : [...this.data.list, ...res.list]
+      this.setData({
+        list,
+        pagination: {
+          page: res.page,
+          pages: res.pages,
+          count: res.count,
+        },
+      })
+    })
+  },
+  onReachBottom() {
+    const { page, pages } = this.data.pagination
+    if (pages > page) {
+      this.getList(page + 1)
+    }
+  },
+})
+
+export {}

src/pages/d_patientHormones/index.wxml

@@ -0,0 +1,43 @@
+<view class="page">
+  <view class="list">
+    <view class="list-title">xxx的激素用药详情</view>
+    <view class="list-container">
+      <view
+        class="row {{item.TotalScore>=0 && 'status1'}} {{item.TotalScore>=40 && 'status2'}} {{item.TotalScore>=80 && 'status3'}}"
+        wx:for="{{list}}"
+        wx:key="index"
+        bind:tap="handleDetail"
+        data-id="{{item.Id}}"
+        data-index="{{index}}"
+        bind:longpress="handleDelete"
+      >
+        <view class="aside">
+          <view class="line-top" style="opacity: 0"></view>
+          <view class="side"></view>
+          <view class="line"></view>
+        </view>
+        <view class="r-container">
+          <view class="date">{{item.date}}</view>
+          <view class="r-card-hormones">
+            <view class="rch-row">
+              <view class="col">
+                <view class="title">最近一周激素治疗方式</view>
+                <view class="content">口服</view>
+              </view>
+              <view class="line"></view>
+              <view class="col">
+                <view class="title">每日用药量</view>
+                <view class="content">30mg</view>
+              </view>
+            </view>
+            <view class="rch-footer">
+              <view class="name">已进行的治疗疗程</view>
+              <text class="range">3周</text>
+            </view>
+          </view>
+        </view>
+      </view>
+      <pagination pagination="{{pagination}}"></pagination>
+    </view>
+  </view>
+</view>

src/patient/pages/hormonesResult/index.json

@@ -0,0 +1,5 @@
+{
+  "usingComponents": {
+    "navbar": "/components/navbar/index"
+  }
+}

src/patient/pages/hormonesResult/index.scss

@@ -0,0 +1,183 @@
+page {
+  background-color: #f6f8f9;
+}
+.nav-back {
+  color: #333333;
+  font-size: 36rpx;
+}
+.nav-title {
+  color: #333333;
+}
+
+.page {
+  padding: 0 40rpx calc(env(safe-area-inset-bottom) + 200rpx);
+  .banner {
+    padding: 32rpx;
+    height: 280rpx;
+    box-sizing: border-box;
+    .title {
+      font-size: 32rpx;
+      color: #ffffff;
+    }
+    .content {
+      margin-top: 6rpx;
+      display: flex;
+      align-items: baseline;
+      gap: 48rpx;
+      .num {
+        font-size: 72rpx;
+        color: #ffffff;
+        font-weight: bold;
+        display: flex;
+        align-items: baseline;
+        .sub {
+          font-size: 32rpx;
+          font-weight: normal;
+        }
+      }
+      .tip {
+        font-size: 28rpx;
+        color: rgba(255, 255, 255, 0.44);
+      }
+    }
+    .footer {
+      margin-top: 22rpx;
+      border-top: 1px solid rgba(255, 255, 255, 0.44);
+      padding-top: 22rpx;
+      font-size: 32rpx;
+      color: #ffffff;
+    }
+  }
+
+  .warmth {
+    margin-top: 24rpx;
+    padding: 32rpx;
+    background: linear-gradient(180deg, #f7f1ff 0%, #ffffff 17%, #ffffff 100%);
+    border-radius: 24rpx 24rpx 24rpx 24rpx;
+    border: 2rpx solid #ffffff;
+    .w-header {
+      font-size: 40rpx;
+      color: #211d2e;
+      font-weight: bold;
+      display: flex;
+      align-items: center;
+      gap: 16rpx;
+      &::before {
+        flex-shrink: 0;
+        content: '';
+        width: 6rpx;
+        height: 36rpx;
+        background: linear-gradient(197deg, #ffbcf9 0%, #b982ff 100%);
+      }
+    }
+    .w-body {
+      margin-top: 32rpx;
+      font-size: 36rpx;
+      color: #211d2e;
+    }
+    .w-footer {
+      margin-top: 32rpx;
+      font-size: 36rpx;
+      color: #b982ff;
+    }
+  }
+
+  .tips {
+    margin-top: 32rpx;
+    padding: 32rpx;
+    background: linear-gradient(180deg, #f7f1ff 0%, #ffffff 17%, #ffffff 100%);
+    border-radius: 24rpx 24rpx 24rpx 24rpx;
+    border: 2rpx solid #ffffff;
+    .t-header {
+      font-size: 40rpx;
+      color: #211d2e;
+      font-weight: bold;
+      display: flex;
+      align-items: center;
+      gap: 16rpx;
+      &::before {
+        flex-shrink: 0;
+        content: '';
+        width: 6rpx;
+        height: 36rpx;
+        background: linear-gradient(197deg, #ffbcf9 0%, #b982ff 100%);
+      }
+    }
+    .t-body {
+      margin-top: 32rpx;
+      .content {
+        font-size: 36rpx;
+        color: #211d2e;
+      }
+      .container {
+        margin-top: 32rpx;
+        padding: 46rpx 32rpx;
+        background: #f6f8f9;
+        border-radius: 16rpx 16rpx 16rpx 16rpx;
+        border: 2rpx solid #ffffff;
+        .row {
+          display: flex;
+          gap: 18rpx;
+          .aside {
+            display: flex;
+            flex-direction: column;
+            align-items: center;
+            .order {
+              flex-shrink: 0;
+              width: 32rpx;
+              height: 32rpx;
+              font-size: 24rpx;
+              color: #ffffff;
+              text-align: center;
+              line-height: 32rpx;
+              border-radius: 32rpx 32rpx 0 32rpx;
+              background-color: #b982ff;
+            }
+            .line {
+              flex: 1;
+              border-right: 1px dashed #b982ff;
+            }
+            .line-top {
+              height: 16rpx;
+              border-right: 1px dashed #b982ff;
+            }
+            .op0 {
+              opacity: 0;
+            }
+          }
+          .r-content {
+            font-size: 36rpx;
+            color: #69686e;
+            line-height: 64rpx;
+          }
+        }
+      }
+    }
+    .t-footer {
+      margin-top: 34rpx;
+      font-size: 32rpx;
+      color: #adacb2;
+      line-height: 48rpx;
+    }
+  }
+
+  .page-footer {
+    position: fixed;
+    bottom: 0;
+    left: 0;
+    padding: 32rpx 30rpx calc(env(safe-area-inset-bottom) + 20rpx);
+    width: 100vw;
+    box-sizing: border-box;
+    background-color: #fff;
+    .btn {
+      height: 88rpx;
+      font-size: 32rpx;
+      color: #FFFFFF;
+      display: flex;
+      align-items: center;
+      justify-content: center;
+      background: linear-gradient(197deg, #ffbcf9 0%, #b982ff 100%);
+      border-radius: 100rpx 100rpx 100rpx 100rpx;
+    }
+  }
+}

src/patient/pages/hormonesResult/index.ts

@@ -0,0 +1,22 @@
+const _app = getApp<IAppOption>()
+
+Page({
+  data: {},
+  onLoad() {},
+  handleReport() {
+    wx.redirectTo({
+      url: '/patient/pages/qolReport/index',
+    })
+  },
+  handleBack() {
+    wx.navigateBack({
+      fail() {
+        wx.reLaunch({
+          url: '/patient/pages/index/index',
+        })
+      },
+    })
+  },
+})
+
+export {}

src/patient/pages/hormonesResult/index.wxml

@@ -0,0 +1,78 @@
+<navbar custom-style="background:{{background}};" fixed>
+  <van-icon class="nav-back" name="arrow-left" slot="left" bind:tap="handleBack" />
+  <view class="nav-title" slot="title">激素量表</view>
+</navbar>
+
+<view
+  class="page"
+  style="background: url('{{imageUrl}}bg10.png?t={{Timestamp}}') no-repeat top center/100% 610rpx;padding-top:{{pageTop+22}}px;"
+>
+  <view class="banner" style="background: url('/images/bg39.png') no-repeat center/100%">
+    <view class="title">本次激素用量为</view>
+    <view class="content">
+      <view class="num">
+        30
+        <view class="sub">mg/周</view>
+      </view>
+      <view class="tip">*周用量=日用量*7天</view>
+    </view>
+    <view class="footer">您已持续口服1-2个月</view>
+  </view>
+  <view class="warmth">
+    <view class="w-header">温馨提醒</view>
+    <view class="w-body">
+      全身应用糖皮质激素可引起不良反应，程度与用药剂量和用药时间相关。
+      长期糖皮质激素口服治疗的不良反应发生率大于静脉冲击治疗。
+    </view>
+    <view class="w-footer">一文了解糖皮质激素的不良反应</view>
+  </view>
+  <view class="tips">
+    <view class="t-header">健康小贴士</view>
+    <view class="t-body">
+      <view class="content">使用糖皮质激素时可酌情采取以下措施：</view>
+      <view class="container">
+        <view class="row">
+          <view class="aside">
+            <view class="line-top op0"></view>
+            <view class="order">1</view>
+            <view class="line"></view>
+          </view>
+          <view class="r-content">低钠高钾高蛋白饮食</view>
+        </view>
+        <view class="row">
+          <view class="aside">
+            <view class="line-top"></view>
+            <view class="order">2</view>
+            <view class="line"></view>
+          </view>
+          <view class="r-content">补充钙剂和维生素D</view>
+        </view>
+        <view class="row">
+          <view class="aside">
+            <view class="line-top"></view>
+            <view class="order">3</view>
+            <view class="line"></view>
+          </view>
+          <view class="r-content">
+            加服胃肠黏膜保护药物,预防消化道溃疡及出血:若合并感染,应同时应用抗生素,以防止感染扩散和加重;
+          </view>
+        </view>
+        <view class="row">
+          <view class="aside">
+            <view class="line-top"></view>
+            <view class="order">4</view>
+            <view class="line op0"></view>
+          </view>
+          <view class="r-content">监测血压和血糖水平,应用或调整降压和降糖药物。</view>
+        </view>
+      </view>
+    </view>
+    <view class="t-footer">
+      <view>*以上内容参考文献：《中国甲状腺相关眼 病诊断和治疗指南（2022 年）》</view>
+      <view>*提示：本内容仅作参考，如有不适请尽快 线下就医并遵医嘱。</view>
+    </view>
+  </view>
+  <view class="page-footer">
+    <view class="btn" bind:tap="handleReport">查看我的健康报告</view>
+  </view>
+</view>

src/patient/pages/qolReport/index.ts

@@ -1,4 +1,5 @@
 import dayjs from 'dayjs'
+
 const app = getApp<IAppOption>()
 let echarts: any = null
 
@@ -39,7 +40,8 @@ Page({
     let type = ''
     if (e) {
       type = e.detail.index + 1
-    } else {
+    }
+    else {
       type = this.data.type
     }
     let EndMonth = ''
@@ -47,17 +49,20 @@ Page({
     if (type == '1') {
       EndMonth = dayjs().format('YYYY-MM-DD')
       BeginMonth = dayjs().subtract(6, 'd').format('YYYY-MM-DD')
-    } else if (type == '2') {
+    }
+    else if (type == '2') {
       EndMonth = dayjs().format('YYYY-MM')
       BeginMonth = dayjs().subtract(1, 'M').format('YYYY-MM')
-    } else if (type == '3') {
+    }
+    else if (type == '3') {
       EndMonth = dayjs().format('YYYY')
       BeginMonth = dayjs().subtract(1, 'y').format('YYYY')
-    } else if (type == '4' && e) {
+    }
+    else if (type == '4' && e) {
     }
     this.setData({
       page: 0,
-      type: type,
+      type,
       Num: '5',
       EndMonth,
       BeginMonth,
@@ -163,7 +168,7 @@ Page({
                   color: 'rgba(137, 141, 151, 0.23)',
                 },
               },
-              data: defaultList.map((item) => dayjs(item.Date).format('MM-DD')),
+              data: defaultList.map(item => dayjs(item.Date).format('MM-DD')),
             },
           ],
           yAxis: [
@@ -191,7 +196,7 @@ Page({
           series: [
             {
               name: '总分',
-              data: defaultList.length ? defaultList.map((item) => item.value) : [25],
+              data: defaultList.length ? defaultList.map(item => item.value) : [25],
               barWidth: '16',
               label: {
                 show: true,
@@ -268,7 +273,7 @@ Page({
     }).then((res) => {
       let list = res.page == 1 ? res.list : [...this.data.list, ...res.list]
       this.setData({
-        list: list,
+        list,
         pagination: {
           page: res.page,
           pages: res.pages,