Compare commits
11 Commits
0ffe8c96fc
...
f475dabd54
| Author | SHA1 | Date |
|---|---|---|
|
|
f475dabd54 | 1 week ago |
|
|
9c78847557 | 4 weeks ago |
|
|
6a0bb0c838 | 4 weeks ago |
|
|
5c6fb69758 | 1 month ago |
|
|
7ebf87739d | 1 month ago |
|
|
4d3b419109 | 1 month ago |
|
|
55680f540a | 1 month ago |
|
|
2786eb842f | 1 month ago |
|
|
57988c941a | 2 months ago |
|
|
61e9b3dbbf | 2 months ago |
|
|
138cfd2212 | 2 months ago |
@ -1 +1,5 @@
@@ -1 +1,5 @@
|
||||
/**app.wxss**/ |
||||
|
||||
view { |
||||
--nav-bar-title-font-size: 36rpx; |
||||
} |
||||
|
||||
@ -1,3 +1,3 @@
@@ -1,3 +1,3 @@
|
||||
.page{ |
||||
padding: 0 40rpx; |
||||
.mp-html{ |
||||
padding: 20rpx 40rpx; |
||||
} |
||||
|
||||
@ -1,4 +1,17 @@
@@ -1,4 +1,17 @@
|
||||
<van-tabs active="{{ active }}" color="#B982FF" sticky swipeable bind:change="onChange"> |
||||
<van-tab title="用户协议"><mp-html content="{{doc}}"></mp-html></van-tab> |
||||
<van-tab title="隐私政策"><mp-html content="{{doc}}"></mp-html></van-tab> |
||||
<van-tab title="隐私政策"> |
||||
<view class="mp-html"> |
||||
<mp-html content="{{doc1}}"></mp-html> |
||||
</view> |
||||
</van-tab> |
||||
<van-tab title="用户协议"> |
||||
<view class="mp-html"> |
||||
<mp-html content="{{doc2}}"></mp-html> |
||||
</view> |
||||
</van-tab> |
||||
<van-tab title="个人信息共享知情同意书"> |
||||
<view class="mp-html"> |
||||
<mp-html content="{{doc3}}"></mp-html> |
||||
</view> |
||||
</van-tab> |
||||
</van-tabs> |
||||
|
||||
|
Before Width: | Height: | Size: 272 KiB After Width: | Height: | Size: 256 KiB |
|
After Width: | Height: | Size: 264 KiB |
|
After Width: | Height: | Size: 444 KiB |
|
After Width: | Height: | Size: 265 KiB |
|
After Width: | Height: | Size: 64 KiB |
|
After Width: | Height: | Size: 333 KiB |
|
After Width: | Height: | Size: 271 KiB |
|
After Width: | Height: | Size: 385 KiB |
|
After Width: | Height: | Size: 247 KiB |
|
After Width: | Height: | Size: 38 KiB |
|
After Width: | Height: | Size: 1.9 KiB |
|
After Width: | Height: | Size: 32 KiB |
|
After Width: | Height: | Size: 28 KiB |
|
After Width: | Height: | Size: 30 KiB |
|
After Width: | Height: | Size: 414 B |
|
After Width: | Height: | Size: 2.2 KiB |
|
After Width: | Height: | Size: 875 B |
|
Before Width: | Height: | Size: 1.3 MiB After Width: | Height: | Size: 2.9 MiB |
|
Before Width: | Height: | Size: 9.1 KiB After Width: | Height: | Size: 8.4 KiB |
|
Before Width: | Height: | Size: 6.6 KiB After Width: | Height: | Size: 7.1 KiB |
|
Before Width: | Height: | Size: 492 KiB After Width: | Height: | Size: 634 KiB |
@ -0,0 +1,5 @@
@@ -0,0 +1,5 @@
|
||||
{ |
||||
"usingComponents": { |
||||
"navbar": "/components/navbar/index" |
||||
} |
||||
} |
||||
@ -0,0 +1,168 @@
@@ -0,0 +1,168 @@
|
||||
page { |
||||
background-color: #f6f8f9; |
||||
} |
||||
|
||||
.page { |
||||
min-height: 100vh; |
||||
padding-bottom: 300rpx; |
||||
.reference { |
||||
font-size: 24rpx; |
||||
color: #69686e; |
||||
vertical-align: text-top; |
||||
line-height: 1; |
||||
} |
||||
.module1 { |
||||
margin: 32rpx 40rpx 0; |
||||
padding: 214rpx 40rpx 0; |
||||
height: 1034rpx; |
||||
box-sizing: border-box; |
||||
.content { |
||||
font-size: 32rpx; |
||||
color: #211d2e; |
||||
line-height: 56rpx; |
||||
} |
||||
.container { |
||||
margin-top: 32rpx; |
||||
border-radius: 24rpx 24rpx 24rpx 24rpx; |
||||
.title { |
||||
padding-top: 32rpx; |
||||
display: flex; |
||||
align-items: center; |
||||
gap: 22rpx; |
||||
font-size: 36rpx; |
||||
color: #211d2e; |
||||
font-weight: bold; |
||||
&::before { |
||||
content: ''; |
||||
width: 8rpx; |
||||
height: 36rpx; |
||||
background: #b982ff; |
||||
border-radius: 0rpx 0rpx 0rpx 0rpx; |
||||
} |
||||
} |
||||
.progress { |
||||
margin: 30rpx 2rpx 0; |
||||
padding-bottom: 32rpx; |
||||
.row { |
||||
display: flex; |
||||
gap: 16rpx; |
||||
.aside { |
||||
flex-shrink: 0; |
||||
display: flex; |
||||
flex-direction: column; |
||||
align-items: center; |
||||
.line-top { |
||||
height: 12rpx; |
||||
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-content { |
||||
padding-bottom: 38rpx; |
||||
font-size: 32rpx; |
||||
color: #69686e; |
||||
line-height: 56rpx; |
||||
.name { |
||||
font-size: 32rpx; |
||||
color: #211d2e; |
||||
font-weight: bold; |
||||
} |
||||
} |
||||
} |
||||
} |
||||
} |
||||
.tip { |
||||
margin-top: -10rpx; |
||||
font-size: 32rpx; |
||||
color: #69686e; |
||||
text-align: right; |
||||
.num { |
||||
font-size: 44rpx; |
||||
color: #b982ff; |
||||
font-weight: bold; |
||||
} |
||||
} |
||||
} |
||||
.module2 { |
||||
margin: 32rpx 40rpx 0; |
||||
padding: 40rpx; |
||||
background: #ffffff; |
||||
border-radius: 24rpx 24rpx 24rpx 24rpx; |
||||
.title { |
||||
font-size: 32rpx; |
||||
color: #211d2e; |
||||
font-weight: bold; |
||||
} |
||||
.content { |
||||
margin-top: 20rpx; |
||||
font-size: 28rpx; |
||||
color: #adacb2; |
||||
line-height: 56rpx; |
||||
} |
||||
} |
||||
.footer { |
||||
position: fixed; |
||||
bottom: 0; |
||||
left: 0; |
||||
padding: 20rpx 40rpx calc(50rpx + env(safe-area-inset-bottom)); |
||||
width: 100%; |
||||
box-sizing: border-box; |
||||
display: flex; |
||||
align-items: center; |
||||
gap: 14rpx; |
||||
background-color: #fff; |
||||
.share { |
||||
padding: 0 38rpx; |
||||
margin: 0; |
||||
border: none; |
||||
line-height: 1; |
||||
background-color: transparent; |
||||
&::after { |
||||
border: none; |
||||
padding: 0; |
||||
} |
||||
.icon { |
||||
width: 44rpx; |
||||
height: 44rpx; |
||||
} |
||||
.name { |
||||
margin-top: 12rpx; |
||||
font-size: 28rpx; |
||||
color: #b982ff; |
||||
} |
||||
} |
||||
.btn { |
||||
flex: 1; |
||||
height: 88rpx; |
||||
font-size: 36rpx; |
||||
color: #ffffff; |
||||
display: flex; |
||||
align-items: center; |
||||
justify-content: center; |
||||
background: linear-gradient(197deg, #ffbcf9 0%, #b982ff 100%); |
||||
border-radius: 100rpx 100rpx 100rpx 100rpx; |
||||
} |
||||
} |
||||
} |
||||
@ -0,0 +1,24 @@
@@ -0,0 +1,24 @@
|
||||
const app = getApp<IAppOption>() |
||||
|
||||
Page({ |
||||
data: {}, |
||||
onLoad() { |
||||
app.waitLogin({ type: [1] }).then(() => {}) |
||||
}, |
||||
handleAdd() { |
||||
wx.navigateTo({ |
||||
url: '/patient/pages/qolAdd/index', |
||||
}) |
||||
}, |
||||
handleBack() { |
||||
wx.navigateBack({ |
||||
fail() { |
||||
wx.reLaunch({ |
||||
url: '/patient/pages/index/index', |
||||
}) |
||||
}, |
||||
}) |
||||
}, |
||||
}) |
||||
|
||||
export {} |
||||
@ -0,0 +1,91 @@
@@ -0,0 +1,91 @@
|
||||
<navbar custom-style="background:{{background}}" fixed> |
||||
<van-icon name="arrow-left" slot="left" size="18px" color="#000" bind:tap="handleBack" /> |
||||
</navbar> |
||||
<view |
||||
class="page" |
||||
style="background: url('{{imageUrl}}bg15.png?t={{Timestamp}}') no-repeat top center/100% 518rpx;padding-top:{{pageTop}}px;" |
||||
> |
||||
<view class="module1" style="background: url('{{imageUrl}}bg16.png?t={{Timestamp}}') no-repeat top center/cover"> |
||||
<view class="content"> |
||||
<view> |
||||
研究表明,GO-QOL生活质量评估能敏锐反映患者的主观感受变化,是评估治疗效果的重要工具。 |
||||
<text class="reference">[1]</text> |
||||
</view> |
||||
<view>它不仅能帮你看清自己“主观世界”的变化还能成为你和医生沟通的重要桥梁。</view> |
||||
</view> |
||||
<view class="container"> |
||||
<view class="title">适用场景</view> |
||||
<view class="progress"> |
||||
<view class="row"> |
||||
<view class="aside"> |
||||
<view class="line-top" style="opacity: 0"></view> |
||||
<view class="side"></view> |
||||
<view class="line"></view> |
||||
</view> |
||||
<view class="r-content"> |
||||
<text class="name">初诊时:</text> |
||||
作为基线记录生活影响 |
||||
<text class="reference">[3]</text> |
||||
</view> |
||||
</view> |
||||
<view class="row"> |
||||
<view class="aside"> |
||||
<view class="line-top"></view> |
||||
<view class="side"></view> |
||||
<view class="line"></view> |
||||
</view> |
||||
<view class="r-content"> |
||||
<text class="name">诊疗中:</text> |
||||
分数上升说明主观改善 |
||||
<text class="reference">[4]</text> |
||||
</view> |
||||
</view> |
||||
<view class="row"> |
||||
<view class="aside"> |
||||
<view class="line-top"></view> |
||||
<view class="side"></view> |
||||
<view class="line"></view> |
||||
</view> |
||||
<view class="r-content"> |
||||
<text class="name">病情期:</text> |
||||
判断是否还需更多支持 |
||||
<text class="reference">[2-3]</text> |
||||
</view> |
||||
</view> |
||||
</view> |
||||
</view> |
||||
<view class="tip"> |
||||
共 |
||||
<text class="num">16</text> |
||||
题,可能会占用您3分钟 |
||||
</view> |
||||
</view> |
||||
<view class="module2"> |
||||
<view class="title">参考文献:</view> |
||||
<view class="content"> |
||||
<view> |
||||
[1]Kahaly, George J et al.“Teprotumumab lmproves Quality of Life in Thyroid Eye Disease: Meta-analysis and |
||||
Matching adjusted Indirect Comparison." Journal of the EndocrineSociety vol.9,6 bvaf063.8 Apr.2025 |
||||
</view> |
||||
<view> |
||||
[2] Lee, T.H.B., & Sundar, G.(2020). Quality of Life in ThyroidEye Disease: A Systematic Review.Ophthalmic |
||||
plastic andreconstructive surgery,36(2),118-126. |
||||
</view> |
||||
<view> |
||||
[3] Dietrich A, Taylor P, White P, et al. Establishing theusefulness of the GO-QOL in a UK hospital-treated |
||||
populationwith thyroid eye disease in the ClRTED trial. Psychol HealthMed.2018;23(sup1):1341-1355. |
||||
</view> |
||||
<view> |
||||
[4] Smith TJ, Cockerham K, Barretto N, et al. Bridging andValidation of the Specific Graves Ophthalmopathy |
||||
Quality ofLife Questionnaire With Health State Utility Values. EndocrPract.2024;30(5):470-475. |
||||
</view> |
||||
</view> |
||||
</view> |
||||
<view class="footer"> |
||||
<button class="share" open-type="share"> |
||||
<image class="icon" src="{{imageUrl}}icon69.png?t={{Timestamp}}"></image> |
||||
<view class="name">分享</view> |
||||
</button> |
||||
<view class="btn" bind:tap="handleAdd">开始评测</view> |
||||
</view> |
||||
</view> |
||||
@ -0,0 +1,5 @@
@@ -0,0 +1,5 @@
|
||||
{ |
||||
"usingComponents": { |
||||
"navbar": "/components/navbar/index" |
||||
} |
||||
} |
||||
@ -0,0 +1,126 @@
@@ -0,0 +1,126 @@
|
||||
page { |
||||
background-color: #ffffff; |
||||
} |
||||
|
||||
.page { |
||||
.page-header { |
||||
padding: 40rpx; |
||||
position: sticky; |
||||
top: 0; |
||||
left: 0; |
||||
.progress { |
||||
display: flex; |
||||
align-items: center; |
||||
justify-content: space-between; |
||||
gap: 10rpx; |
||||
.p-item { |
||||
flex: 1; |
||||
.name { |
||||
font-size: 36rpx; |
||||
color: #adacb2; |
||||
line-height: 44rpx; |
||||
} |
||||
.line { |
||||
margin-top: 16rpx; |
||||
height: 16rpx; |
||||
background: #ffffff; |
||||
border-radius: 0rpx 0rpx 0rpx 0rpx; |
||||
} |
||||
&.active { |
||||
.name { |
||||
color: #b982ff; |
||||
} |
||||
.line { |
||||
background: #b982ff; |
||||
} |
||||
} |
||||
} |
||||
} |
||||
.title { |
||||
margin-top: 44rpx; |
||||
font-size: 36rpx; |
||||
color: #211d2e; |
||||
font-weight: bold; |
||||
} |
||||
.content { |
||||
margin-top: 24rpx; |
||||
font-size: 32rpx; |
||||
color: #211d2e; |
||||
line-height: 48rpx; |
||||
} |
||||
} |
||||
.module { |
||||
padding: 0 40rpx 200rpx; |
||||
.row { |
||||
margin-bottom: 52rpx; |
||||
.title { |
||||
font-size: 36rpx; |
||||
color: #211d2e; |
||||
font-weight: bold; |
||||
} |
||||
.select { |
||||
margin-top: 24rpx; |
||||
display: grid; |
||||
grid-template-columns: repeat(3, 1fr); |
||||
gap: 24rpx; |
||||
.s-item1, |
||||
.s-item2, |
||||
.s-item3, |
||||
.s-item4 { |
||||
padding: 18rpx; |
||||
font-size: 32rpx; |
||||
color: #69686e; |
||||
line-height: 48rpx; |
||||
text-align: center; |
||||
background-color: #f6f8f9; |
||||
border-radius: 16rpx; |
||||
} |
||||
.s-item4 { |
||||
order: 1; |
||||
&.active { |
||||
background-color: #dafdee; |
||||
color: #1ec580; |
||||
} |
||||
} |
||||
.s-item3 { |
||||
order: 2; |
||||
&.active { |
||||
background-color: #dafdee; |
||||
color: #1ec580; |
||||
} |
||||
} |
||||
.s-item2 { |
||||
order: 3; |
||||
&.active { |
||||
background-color: #fff4e0; |
||||
color: #ffa300; |
||||
} |
||||
} |
||||
.s-item1 { |
||||
order: 4; |
||||
&.active { |
||||
background-color: #ffe7e7; |
||||
color: #ef3939; |
||||
} |
||||
} |
||||
} |
||||
} |
||||
.btn { |
||||
display: flex; |
||||
align-items: center; |
||||
justify-content: center; |
||||
height: 88rpx; |
||||
font-size: 36rpx; |
||||
color: #ffffff; |
||||
background: linear-gradient(197deg, #ffbcf9 0%, #b982ff 100%); |
||||
border-radius: 100rpx 100rpx 100rpx 100rpx; |
||||
} |
||||
.prev { |
||||
margin-top: 20rpx; |
||||
padding: 20rpx; |
||||
text-align: center; |
||||
font-size: 36rpx; |
||||
color: #69686e; |
||||
} |
||||
} |
||||
} |
||||
@ -0,0 +1,257 @@
@@ -0,0 +1,257 @@
|
||||
const app = getApp<IAppOption>() |
||||
|
||||
Page({ |
||||
data: { |
||||
id: '', |
||||
step: 0, |
||||
qolList0: [ |
||||
{ |
||||
title: '1. 骑自行车或电动车', |
||||
answer: '', |
||||
answerList: { |
||||
4: '没学过', |
||||
3: '无影响', |
||||
2: '有点影响', |
||||
1: '严重影响', |
||||
}, |
||||
}, |
||||
{ |
||||
title: '2. 开车', |
||||
answer: '', |
||||
answerList: { |
||||
4: '没学过', |
||||
3: '无影响', |
||||
2: '有点影响', |
||||
1: '严重影响', |
||||
}, |
||||
}, |
||||
{ |
||||
title: '3. 室内走动', |
||||
answer: '', |
||||
answerList: { |
||||
3: '无影响', |
||||
2: '有点影响', |
||||
1: '严重影响', |
||||
}, |
||||
}, |
||||
{ |
||||
title: '4. 室外走动', |
||||
answer: '', |
||||
answerList: { |
||||
3: '无影响', |
||||
2: '有点影响', |
||||
1: '严重影响', |
||||
}, |
||||
}, |
||||
{ |
||||
title: '5. 看书看报', |
||||
answer: '', |
||||
answerList: { |
||||
3: '无影响', |
||||
2: '有点影响', |
||||
1: '严重影响', |
||||
}, |
||||
}, |
||||
{ |
||||
title: '6. 看电视', |
||||
answer: '', |
||||
answerList: { |
||||
3: '无影响', |
||||
2: '有点影响', |
||||
1: '严重影响', |
||||
}, |
||||
}, |
||||
{ |
||||
title: '7. 兴趣爱好及平时娱乐', |
||||
answer: '', |
||||
answerList: { |
||||
3: '无影响', |
||||
2: '有点影响', |
||||
1: '严重影响', |
||||
}, |
||||
}, |
||||
{ |
||||
title: '8. 过去的1周内,您是否觉得甲状腺相关眼病会阻碍您去做您想做的事', |
||||
answer: '', |
||||
answerList: { |
||||
3: '无影响', |
||||
2: '有点影响', |
||||
1: '严重影响', |
||||
}, |
||||
}, |
||||
], |
||||
qolList1: [ |
||||
{ |
||||
title: '9. 您是否感觉到甲状腺相关眼病改变您的外表?', |
||||
answer: '', |
||||
answerList: { |
||||
3: '不,没有', |
||||
2: '是的,有点', |
||||
1: '是的,严重', |
||||
}, |
||||
}, |
||||
{ |
||||
title: '10. 您是否感觉到甲状腺相关眼病使您受到了别人的注视?', |
||||
answer: '', |
||||
answerList: { |
||||
3: '不,没有', |
||||
2: '是的,有点', |
||||
1: '是的,严重', |
||||
}, |
||||
}, |
||||
{ |
||||
title: '11. 您是否感觉到别人因为甲状腺相关眼病对您不友善?', |
||||
answer: '', |
||||
answerList: { |
||||
3: '不,没有', |
||||
2: '是的,有点', |
||||
1: '是的,严重', |
||||
}, |
||||
}, |
||||
{ |
||||
title: '12. 您是否感觉到甲状腺相关眼病影响您的自信心?', |
||||
answer: '', |
||||
answerList: { |
||||
3: '不,没有', |
||||
2: '是的,有点', |
||||
1: '是的,严重', |
||||
}, |
||||
}, |
||||
{ |
||||
title: '13. 您是否感觉到甲状腺相关眼病影响您结交新朋友?', |
||||
answer: '', |
||||
answerList: { |
||||
3: '不,没有', |
||||
2: '是的,有点', |
||||
1: '是的,严重', |
||||
}, |
||||
}, |
||||
{ |
||||
title: '14. 您是否感觉到甲状腺相关眼病使您收到了社会孤立?', |
||||
answer: '', |
||||
answerList: { |
||||
3: '不,没有', |
||||
2: '是的,有点', |
||||
1: '是的,严重', |
||||
}, |
||||
}, |
||||
{ |
||||
title: '15. 您是否感觉到甲状腺相关眼病使您拍照的次数减少了?', |
||||
answer: '', |
||||
answerList: { |
||||
3: '不,没有', |
||||
2: '是的,有点', |
||||
1: '是的,严重', |
||||
}, |
||||
}, |
||||
{ |
||||
title: '16. 您是否会试图掩饰甲状腺相关眼病给您带来的外貌变化?', |
||||
answer: '', |
||||
answerList: { |
||||
3: '不,没有', |
||||
2: '是的,有点', |
||||
1: '是的,严重', |
||||
}, |
||||
}, |
||||
], |
||||
}, |
||||
onLoad(options) { |
||||
this.setData({ |
||||
id: options.id, |
||||
}) |
||||
app.waitLogin({ type: [1] }).then(() => { |
||||
if (options.id) { |
||||
this.getDetail() |
||||
} |
||||
}) |
||||
}, |
||||
getDetail() { |
||||
const { qolList0, qolList1 } = this.data |
||||
wx.ajax({ |
||||
method: 'GET', |
||||
url: '?r=xd/qol/view', |
||||
data: { |
||||
Id: this.data.id, |
||||
}, |
||||
}).then((res) => { |
||||
this.setData({ |
||||
detail: res, |
||||
}) |
||||
qolList0.forEach((item, index) => { |
||||
item.answer = res[`Question${index + 1}`] |
||||
}) |
||||
qolList1.forEach((item, index) => { |
||||
item.answer = res[`Question${index + 9}`] |
||||
}) |
||||
this.setData({ |
||||
qolList0, |
||||
qolList1, |
||||
}) |
||||
}) |
||||
}, |
||||
handleSelect(e) { |
||||
const { id } = this.data |
||||
if (id) return |
||||
const { list, key, index } = e.currentTarget.dataset |
||||
this.setData({ |
||||
[`${list}[${index}].answer`]: key, |
||||
}) |
||||
}, |
||||
handleNext() { |
||||
this.setData({ |
||||
step: 1, |
||||
}) |
||||
wx.pageScrollTo({ |
||||
scrollTop: 0, |
||||
}) |
||||
}, |
||||
handleReset() { |
||||
wx.redirectTo({ |
||||
url: '/patient/pages/qolAdd/index', |
||||
}) |
||||
}, |
||||
handleSubmit() { |
||||
const { qolList0, qolList1 } = this.data |
||||
const arr = [...qolList0, ...qolList1] |
||||
const form = {} |
||||
for (let i = 0; i < arr.length; i++) { |
||||
const item = arr[i] |
||||
const order = item.title.split('.')[0] |
||||
if (!item.answer) { |
||||
wx.showToast({ |
||||
title: `请填写第${order}题`, |
||||
icon: 'none', |
||||
}) |
||||
return |
||||
} |
||||
form[`Question${order}`] = item.answer |
||||
} |
||||
wx.ajax({ |
||||
method: 'POST', |
||||
url: '?r=xd/qol/create', |
||||
data: { |
||||
...form, |
||||
}, |
||||
}).then((res) => { |
||||
wx.redirectTo({ |
||||
url: `/patient/pages/qolResult/index?id=${res.Id}`, |
||||
}) |
||||
}) |
||||
}, |
||||
handlePrev() { |
||||
this.setData({ |
||||
step: 0, |
||||
}) |
||||
}, |
||||
handleBack() { |
||||
wx.navigateBack({ |
||||
fail() { |
||||
wx.reLaunch({ |
||||
url: '/patient/pages/index/index', |
||||
}) |
||||
}, |
||||
}) |
||||
}, |
||||
}) |
||||
|
||||
export {} |
||||
@ -0,0 +1,66 @@
@@ -0,0 +1,66 @@
|
||||
<navbar custom-style="background:{{background}}" fixed> |
||||
<van-icon name="arrow-left" slot="left" size="18px" color="#000" bind:tap="handleBack" /> |
||||
</navbar> |
||||
<view class="page"> |
||||
<view |
||||
class="page-header" |
||||
style="background:#fff url('{{imageUrl}}bg18.png?t={{Timestamp}}') no-repeat top center/100% 412rpx;padding-top:{{pageTop+20}}px;" |
||||
> |
||||
<view class="progress"> |
||||
<view class="p-item active"> |
||||
<view class="name">视觉功能</view> |
||||
<view class="line"></view> |
||||
</view> |
||||
<view class="p-item {{step==1 && 'active'}}"> |
||||
<view class="name">外观</view> |
||||
<view class="line"></view> |
||||
</view> |
||||
</view> |
||||
<view class="title">请根据过去1周的情况填写</view> |
||||
<view class="content">过去一周内,甲状腺相关眼病是否影响您做以下的事情?根据您的实际情况选择。</view> |
||||
</view> |
||||
<view class="module" wx:if="{{step==0}}"> |
||||
<view class="row" wx:for="{{qolList0}}" wx:key="index"> |
||||
<view class="title">{{item.title}}</view> |
||||
<view class="select"> |
||||
<view |
||||
class="s-item{{answerKey}} {{item.answer == answerKey && 'active'}}" |
||||
wx:for="{{item.answerList}}" |
||||
wx:key="index" |
||||
wx:for-item="answerItem" |
||||
wx:for-index="answerKey" |
||||
bind:tap="handleSelect" |
||||
data-list="qolList0" |
||||
data-index="{{index}}" |
||||
data-key="{{answerKey}}" |
||||
> |
||||
{{answerItem}} |
||||
</view> |
||||
</view> |
||||
</view> |
||||
<view class="btn" bind:tap="handleNext">下一页(1/2)</view> |
||||
</view> |
||||
<view class="module" wx:if="{{step==1}}"> |
||||
<view class="row" wx:for="{{qolList1}}" wx:key="index"> |
||||
<view class="title">{{item.title}}</view> |
||||
<view class="select"> |
||||
<view |
||||
class="s-item{{answerKey}} {{item.answer == answerKey && 'active'}}" |
||||
wx:for="{{item.answerList}}" |
||||
wx:key="index" |
||||
wx:for-item="answerItem" |
||||
wx:for-index="answerKey" |
||||
bind:tap="handleSelect" |
||||
data-list="qolList1" |
||||
data-index="{{index}}" |
||||
data-key="{{answerKey}}" |
||||
> |
||||
{{answerItem}} |
||||
</view> |
||||
</view> |
||||
</view> |
||||
<view class="btn" wx:if="{{id}}" bind:tap="handleReset">重新测评</view> |
||||
<view class="btn" wx:else bind:tap="handleSubmit">提交(2/2)</view> |
||||
<view class="prev" bind:tap="handlePrev">上一步</view> |
||||
</view> |
||||
</view> |
||||
@ -0,0 +1,10 @@
@@ -0,0 +1,10 @@
|
||||
{ |
||||
"navigationStyle": "default", |
||||
"navigationBarTitleText": "评估报告", |
||||
"usingComponents": { |
||||
"navbar": "/components/navbar/index", |
||||
"van-tab": "@vant/weapp/tab/index", |
||||
"van-tabs": "@vant/weapp/tabs/index", |
||||
"ec-canvas": "/components/ec-canvas/ec-canvas" |
||||
} |
||||
} |
||||
@ -0,0 +1,208 @@
@@ -0,0 +1,208 @@
|
||||
page { |
||||
background-color: #f6f8f9; |
||||
} |
||||
|
||||
.page { |
||||
padding-bottom: 200rpx; |
||||
.page-header { |
||||
background-color: #fff; |
||||
.tab-class { |
||||
font-size: 32rpx; |
||||
} |
||||
.form { |
||||
padding: 0 18rpx; |
||||
display: flex; |
||||
justify-content: flex-end; |
||||
.date { |
||||
display: flex; |
||||
align-items: center; |
||||
gap: 10rpx; |
||||
font-size: 32rpx; |
||||
color: #69686e; |
||||
.icon { |
||||
transform: rotate(90deg); |
||||
font-size: 20rpx; |
||||
color: #adacb2; |
||||
} |
||||
.start, |
||||
.end { |
||||
padding: 18rpx 0; |
||||
} |
||||
} |
||||
} |
||||
} |
||||
.chart-list { |
||||
padding: 32rpx 40rpx 0; |
||||
.chart-card { |
||||
margin-bottom: 24rpx; |
||||
padding: 32rpx; |
||||
background-color: #fff; |
||||
border-radius: 24rpx; |
||||
.title { |
||||
font-size: 32rpx; |
||||
color: #211d2e; |
||||
font-weight: bold; |
||||
} |
||||
.chart { |
||||
height: 420rpx; |
||||
} |
||||
} |
||||
} |
||||
.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 { |
||||
margin-top: 16rpx; |
||||
padding: 24rpx 32rpx; |
||||
border-radius: 24rpx; |
||||
background-color: #fff; |
||||
.wrap { |
||||
padding-bottom: 32rpx; |
||||
display: flex; |
||||
align-items: center; |
||||
gap: 22rpx; |
||||
border-bottom: 1px dashed rgba(33, 29, 46, 0.05); |
||||
.num { |
||||
font-size: 104rpx; |
||||
color: var(--color); |
||||
font-weight: bold; |
||||
line-height: 1; |
||||
} |
||||
.inner { |
||||
.label { |
||||
padding: 4rpx 16rpx; |
||||
border-radius: 50rpx 50rpx 50rpx 0; |
||||
display: inline-block; |
||||
font-size: 28rpx; |
||||
color: #ffffff; |
||||
line-height: 36rpx; |
||||
background: var(--label-background); |
||||
} |
||||
.name { |
||||
margin-top: 12rpx; |
||||
font-size: 28rpx; |
||||
color: #adacb2; |
||||
} |
||||
} |
||||
} |
||||
.stat { |
||||
padding-top: 24rpx; |
||||
display: flex; |
||||
align-items: center; |
||||
justify-content: space-between; |
||||
.s-item { |
||||
font-size: 32rpx; |
||||
color: #adacb2; |
||||
display: flex; |
||||
align-items: center; |
||||
gap: 24rpx; |
||||
.score { |
||||
color: #211d2e; |
||||
} |
||||
} |
||||
} |
||||
} |
||||
} |
||||
} |
||||
} |
||||
} |
||||
.page-footer { |
||||
position: fixed; |
||||
bottom: 0; |
||||
left: 0; |
||||
z-index: 100000; |
||||
width: 100%; |
||||
box-sizing: border-box; |
||||
padding: 20rpx 40rpx calc(20rpx + env(safe-area-inset-bottom)); |
||||
background-color: #fff; |
||||
box-shadow: 0 8rpx 32rpx rgba(25, 0, 57, 0.07); |
||||
display: flex; |
||||
align-items: center; |
||||
.home { |
||||
padding: 0 34rpx; |
||||
text-align: center; |
||||
font-size: 28rpx; |
||||
color: #b982ff; |
||||
.icon { |
||||
width: 44rpx; |
||||
height: 44rpx; |
||||
} |
||||
} |
||||
.btn { |
||||
flex: 1; |
||||
height: 88rpx; |
||||
font-size: 38rpx; |
||||
color: #ffffff; |
||||
display: flex; |
||||
align-items: center; |
||||
justify-content: center; |
||||
background: linear-gradient(197deg, #ffbcf9 0%, #b982ff 100%); |
||||
border-radius: 100rpx 100rpx 100rpx 100rpx; |
||||
} |
||||
} |
||||
} |
||||
|
||||
.status1 { |
||||
--color: #ef3939; |
||||
--background: #ffdddd; |
||||
--label-background: linear-gradient(177deg, #ff9090 0%, #ef3939 100%); |
||||
} |
||||
.status2 { |
||||
--color: #ffa300; |
||||
--background: #fff4e0; |
||||
--label-background: linear-gradient(153deg, #ffd48b 0%, #ffa300 100%); |
||||
} |
||||
.status3 { |
||||
--color: #1ec580; |
||||
--background: #dafdee; |
||||
--label-background: linear-gradient(330deg, #1ec580 0%, #4feaaa 100%); |
||||
} |
||||
@ -0,0 +1,336 @@
@@ -0,0 +1,336 @@
|
||||
import dayjs from 'dayjs' |
||||
const app = getApp<IAppOption>() |
||||
let echarts: any = null |
||||
|
||||
Page({ |
||||
data: { |
||||
type: '1', |
||||
BeginMonth: '', |
||||
EndMonth: '', |
||||
|
||||
fields: { |
||||
1: 'day', |
||||
2: 'month', |
||||
3: 'year', |
||||
}, |
||||
|
||||
list: [], |
||||
pagination: { |
||||
page: 1, |
||||
pages: 1, |
||||
count: 1, |
||||
}, |
||||
}, |
||||
chartComponent1: null as any, |
||||
chartComponent2: null as any, |
||||
chartComponent3: null as any, |
||||
async onLoad() { |
||||
echarts = await require.async('../../../gift/compontnts/echart/echarts.js') |
||||
this.chartComponent1 = this.selectComponent('#chart1') |
||||
this.chartComponent2 = this.selectComponent('#chart2') |
||||
this.chartComponent3 = this.selectComponent('#chart3') |
||||
|
||||
app.waitLogin({ type: [1] }).then(() => { |
||||
this.handleChangeType() |
||||
this.getList() |
||||
}) |
||||
}, |
||||
handleChangeType(e?: WechatMiniprogram.CustomEvent) { |
||||
let type = '' |
||||
if (e) { |
||||
type = e.detail.index + 1 |
||||
} else { |
||||
type = this.data.type |
||||
} |
||||
let EndMonth = '' |
||||
let BeginMonth = '' |
||||
if (type == '1') { |
||||
EndMonth = dayjs().format('YYYY-MM-DD') |
||||
BeginMonth = dayjs().subtract(6, 'd').format('YYYY-MM-DD') |
||||
} else if (type == '2') { |
||||
EndMonth = dayjs().format('YYYY-MM') |
||||
BeginMonth = dayjs().subtract(1, 'M').format('YYYY-MM') |
||||
} else if (type == '3') { |
||||
EndMonth = dayjs().format('YYYY') |
||||
BeginMonth = dayjs().subtract(1, 'y').format('YYYY') |
||||
} else if (type == '4' && e) { |
||||
} |
||||
this.setData({ |
||||
page: 0, |
||||
type: type, |
||||
Num: '5', |
||||
EndMonth, |
||||
BeginMonth, |
||||
}) |
||||
this.getChatData() |
||||
}, |
||||
handleChange() { |
||||
this.getChatData() |
||||
}, |
||||
getChatData() { |
||||
const { type, BeginMonth, EndMonth } = this.data |
||||
wx.ajax({ |
||||
method: 'GET', |
||||
url: '?r=xd/qol/graph', |
||||
data: { |
||||
DateType: type, |
||||
StartDate: BeginMonth, |
||||
EndDate: EndMonth, |
||||
count: 0, |
||||
}, |
||||
}).then((res) => { |
||||
const list0: any[] = [] |
||||
const list1: any[] = [] |
||||
const list2: any[] = [] |
||||
res.list.forEach((item: any) => { |
||||
list0.push({ |
||||
Date: item.Date, |
||||
value: item.TotalScore, |
||||
}) |
||||
list1.push({ |
||||
Date: item.Date, |
||||
value: item.VisionScore, |
||||
}) |
||||
list2.push({ |
||||
Date: item.Date, |
||||
value: item.AppearanceScore, |
||||
}) |
||||
}) |
||||
|
||||
this.initChart(list0, 'chartComponent1') |
||||
this.initChart(list1, 'chartComponent2') |
||||
this.initChart(list2, 'chartComponent3') |
||||
}) |
||||
}, |
||||
initChart(defaultList = [] as any[], key) { |
||||
return new Promise((reslove) => { |
||||
this[key].init((canvas, width, height, dpr) => { |
||||
const chart = echarts.init(canvas, null, { |
||||
width, |
||||
height, |
||||
devicePixelRatio: dpr, // new
|
||||
}) |
||||
canvas.setChart(chart) |
||||
|
||||
const option: any = { |
||||
tooltip: { |
||||
show: false, |
||||
trigger: 'axis', |
||||
axisPointer: { |
||||
type: 'shadow', |
||||
}, |
||||
confine: true, |
||||
backgroundColor: 'rgba(0, 0, 0, 0.5)', |
||||
textStyle: { |
||||
color: '#fff', |
||||
fontSize: 10, |
||||
}, |
||||
order: 'seriesDesc', |
||||
}, |
||||
grid: { |
||||
top: '30', |
||||
left: '0', |
||||
right: '0', |
||||
bottom: '10', |
||||
containLabel: true, |
||||
}, |
||||
xAxis: [ |
||||
{ |
||||
type: 'category', |
||||
axisTick: { |
||||
show: false, |
||||
inside: true, |
||||
length: 1, |
||||
alignWithLabel: true, |
||||
lineStyle: { |
||||
type: 'dotted', |
||||
color: '#D8D8D8', |
||||
width: 4, |
||||
cap: 'round', |
||||
}, |
||||
}, |
||||
axisLine: { |
||||
lineStyle: { |
||||
color: '#8C8C8C', |
||||
type: 'dashed', |
||||
}, |
||||
}, |
||||
splitLine: { |
||||
show: true, |
||||
showMinLine: false, |
||||
lineStyle: { |
||||
type: 'dotted', |
||||
color: 'rgba(137, 141, 151, 0.23)', |
||||
}, |
||||
}, |
||||
data: defaultList.map((item) => dayjs(item.Date).format('MM-DD')), |
||||
}, |
||||
], |
||||
yAxis: [ |
||||
{ |
||||
type: 'value', |
||||
minInterval: 20, |
||||
max: 100, |
||||
axisLine: { |
||||
show: false, |
||||
lineStyle: { |
||||
type: 'solid', |
||||
color: 'rgba(161, 164, 172, 1)', |
||||
}, |
||||
}, |
||||
splitLine: { |
||||
show: true, |
||||
showMinLine: false, |
||||
lineStyle: { |
||||
type: 'dotted', |
||||
color: 'rgba(137, 141, 151, 0.23)', |
||||
}, |
||||
}, |
||||
}, |
||||
], |
||||
series: [ |
||||
{ |
||||
name: '总分', |
||||
data: defaultList.length ? defaultList.map((item) => item.value) : [25], |
||||
barWidth: '16', |
||||
label: { |
||||
show: true, |
||||
position: 'top', |
||||
color: '#B982FF', |
||||
fontSize: 14, |
||||
}, |
||||
type: 'line', |
||||
symbolSize: 4, |
||||
showSymbol: defaultList.length >= 1, |
||||
connectNulls: true, |
||||
z: 10, |
||||
itemStyle: { |
||||
color: '#B982FF', |
||||
}, |
||||
markLine: { |
||||
symbol: ['none', 'none'], |
||||
data: [ |
||||
{ |
||||
name: '达标区', |
||||
yAxis: 80, |
||||
label: { |
||||
formatter: '{b}', |
||||
position: 'insideMiddle', |
||||
color: '#24D8C8', |
||||
fontSize: '10', |
||||
}, |
||||
lineStyle: { |
||||
cap: '', |
||||
color: '#34D7C7', |
||||
type: 'dashed', |
||||
}, |
||||
}, |
||||
], |
||||
}, |
||||
markArea: { |
||||
itemStyle: { |
||||
color: 'rgba(37,217,200,0.19)', |
||||
}, |
||||
data: [ |
||||
[ |
||||
{ |
||||
yAxis: 80, |
||||
}, |
||||
{ |
||||
yAxis: 100, |
||||
}, |
||||
], |
||||
], |
||||
}, |
||||
}, |
||||
], |
||||
dataZoom: { |
||||
type: 'inside', // 有type这个属性,滚动条在最下面,也可以不行,写y:36,这表示距离顶端36px,一般就是在图上面。
|
||||
startValue: 0, |
||||
endValue: 4, |
||||
filterMode: 'none', |
||||
}, |
||||
} |
||||
|
||||
chart.setOption(option) |
||||
reslove(chart) |
||||
return chart |
||||
}) |
||||
}) |
||||
}, |
||||
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: 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) |
||||
} |
||||
}, |
||||
handleDelete(e) { |
||||
const { id, index } = e.currentTarget.dataset |
||||
const { list } = this.data |
||||
wx.showModal({ |
||||
title: '确认删除吗?', |
||||
confirmColor: '#8c75d0', |
||||
success: (res) => { |
||||
if (res.confirm) { |
||||
wx.ajax({ |
||||
method: 'POST', |
||||
url: '?r=xd/qol/delete', |
||||
data: { |
||||
Id: id, |
||||
}, |
||||
}).then(() => { |
||||
this.setData({ |
||||
list: list.filter((_item, i) => i !== index), |
||||
}) |
||||
}) |
||||
} |
||||
}, |
||||
}) |
||||
}, |
||||
handleDetail(e) { |
||||
const { id } = e.currentTarget.dataset |
||||
wx.navigateTo({ |
||||
url: `/patient/pages/qolAdd/index?id=${id}`, |
||||
}) |
||||
}, |
||||
handleQol() { |
||||
wx.navigateTo({ |
||||
url: '/patient/pages/qol/index', |
||||
}) |
||||
}, |
||||
handleHome() { |
||||
wx.reLaunch({ |
||||
url: '/patient/pages/index/index', |
||||
}) |
||||
}, |
||||
handleBack() { |
||||
wx.navigateBack({ |
||||
fail() { |
||||
wx.reLaunch({ |
||||
url: '/patient/pages/index/index', |
||||
}) |
||||
}, |
||||
}) |
||||
}, |
||||
}) |
||||
|
||||
export {} |
||||
@ -0,0 +1,119 @@
@@ -0,0 +1,119 @@
|
||||
<view class="page"> |
||||
<view class="page-header"> |
||||
<van-tabs |
||||
active="{{ active }}" |
||||
tab-class="tab-class" |
||||
color="#B982FF" |
||||
line-width="60rpx" |
||||
line-height="8rpx" |
||||
title-active-color="#211D2E" |
||||
title-inactive-color="#69686E" |
||||
bind:change="handleChangeType" |
||||
> |
||||
<van-tab title="日"></van-tab> |
||||
<van-tab title="月度"></van-tab> |
||||
<van-tab title="年度"></van-tab> |
||||
</van-tabs> |
||||
<view class="form"> |
||||
<view class="date"> |
||||
<picker |
||||
bindchange="handleChange" |
||||
class="start" |
||||
end="{{EndMonth}}" |
||||
fields="{{fields[type]}}" |
||||
mode="date" |
||||
model:value="{{BeginMonth}}" |
||||
> |
||||
{{BeginMonth}} |
||||
</picker> |
||||
<view class="line">~</view> |
||||
<picker |
||||
bindchange="handleChange" |
||||
class="end" |
||||
fields="{{fields[type]}}" |
||||
mode="date" |
||||
model:value="{{EndMonth}}" |
||||
start="{{BeginMonth}}" |
||||
> |
||||
{{EndMonth}} |
||||
</picker> |
||||
<van-icon class="icon" name="play" /> |
||||
</view> |
||||
</view> |
||||
</view> |
||||
|
||||
<view class="chart-list"> |
||||
<view class="chart-card"> |
||||
<view class="title">GO-QOL整体记录曲线</view> |
||||
<view class="chart"> |
||||
<ec-canvas id="chart1" ec="{{ ec }}"></ec-canvas> |
||||
</view> |
||||
</view> |
||||
<view class="chart-card"> |
||||
<view class="title">GO-QOL视觉功能影响记录曲线</view> |
||||
<view class="chart"> |
||||
<ec-canvas id="chart2" ec="{{ ec }}"></ec-canvas> |
||||
</view> |
||||
</view> |
||||
<view class="chart-card"> |
||||
<view class="title">GO-QOL外观影响记录曲线</view> |
||||
<view class="chart"> |
||||
<ec-canvas id="chart3" ec="{{ ec }}"></ec-canvas> |
||||
</view> |
||||
</view> |
||||
</view> |
||||
|
||||
<view class="list"> |
||||
<view class="list-title">我的历史测评报告</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"> |
||||
<view class="wrap"> |
||||
<view class="num">{{item.TotalScore}}</view> |
||||
<view class="inner"> |
||||
<view class="label" wx:if="{{item.TotalScore >= 80}}">轻度影响</view> |
||||
<view class="label" wx:elif="{{item.TotalScore >= 40}}">中度影响</view> |
||||
<view class="label" wx:else>重度影响</view> |
||||
<view class="name">TED生活质量评分</view> |
||||
</view> |
||||
</view> |
||||
<view class="stat"> |
||||
<view class="s-item"> |
||||
视觉功能 |
||||
<view class="score">{{item.VisionScore}}分</view> |
||||
</view> |
||||
<view class="s-item"> |
||||
外观 |
||||
<view class="score">{{item.AppearanceScore}}分</view> |
||||
</view> |
||||
</view> |
||||
</view> |
||||
</view> |
||||
</view> |
||||
<pagination pagination="{{pagination}}"></pagination> |
||||
</view> |
||||
</view> |
||||
|
||||
<view class="page-footer"> |
||||
<view class="home" bind:tap="handleHome"> |
||||
<image class="icon" src="{{imageUrl}}icon74.png?t={{Timestamp}}"></image> |
||||
<view>首页</view> |
||||
</view> |
||||
<view class="btn" bind:tap="handleQol">评测</view> |
||||
</view> |
||||
</view> |
||||
@ -0,0 +1,5 @@
@@ -0,0 +1,5 @@
|
||||
{ |
||||
"usingComponents": { |
||||
"navbar": "/components/navbar/index" |
||||
} |
||||
} |
||||
@ -0,0 +1,218 @@
@@ -0,0 +1,218 @@
|
||||
p age { |
||||
background-color: #f6f8f9; |
||||
} |
||||
|
||||
.page { |
||||
padding: 40rpx 40rpx 120rpx; |
||||
.container { |
||||
padding: 32rpx; |
||||
border: 2rpx solid #ffffff; |
||||
background: #fff linear-gradient(180deg, #efe3ff 0%, #ffffff 100%) no-repeat top center/100% 228rpx; |
||||
border-radius: 24rpx; |
||||
box-shadow: 0 8rpx 32rpx rgba(25, 0, 57, 0.07); |
||||
.info { |
||||
display: flex; |
||||
align-items: center; |
||||
justify-content: space-between; |
||||
.wrap { |
||||
.w-header { |
||||
display: flex; |
||||
align-items: flex-end; |
||||
gap: 10rpx; |
||||
line-height: 1; |
||||
.num { |
||||
font-size: 128rpx; |
||||
color: var(--color); |
||||
font-weight: bold; |
||||
} |
||||
.label { |
||||
padding: 4rpx 16rpx; |
||||
margin-bottom: 14rpx; |
||||
font-size: 28rpx; |
||||
color: #ffffff; |
||||
line-height: 36rpx; |
||||
border-radius: 50rpx 50rpx 50rpx 0rpx; |
||||
background: var(--label-background); |
||||
} |
||||
} |
||||
.tip { |
||||
font-size: 28rpx; |
||||
color: #adacb2; |
||||
} |
||||
} |
||||
.status { |
||||
width: 152rpx; |
||||
height: 152rpx; |
||||
flex-shrink: 0; |
||||
} |
||||
} |
||||
.c-line { |
||||
position: relative; |
||||
margin: 32rpx -32rpx; |
||||
border-bottom: 1px dashed #f6f8f9; |
||||
&::before { |
||||
position: absolute; |
||||
top: -13rpx; |
||||
left: -13rpx; |
||||
content: ''; |
||||
background-color: #f6f8f9; |
||||
width: 28rpx; |
||||
height: 28rpx; |
||||
border-radius: 50%; |
||||
} |
||||
&::after { |
||||
position: absolute; |
||||
top: -13rpx; |
||||
right: -13rpx; |
||||
content: ''; |
||||
background-color: #f6f8f9; |
||||
width: 28rpx; |
||||
height: 28rpx; |
||||
border-radius: 50%; |
||||
} |
||||
} |
||||
.card { |
||||
margin-bottom: 24rpx; |
||||
padding: 36rpx 30rpx 80rpx; |
||||
background: #faf7ff; |
||||
border-radius: 20rpx 20rpx 20rpx 20rpx; |
||||
border: 2rpx solid #efe2fe; |
||||
.c-header { |
||||
display: flex; |
||||
align-items: center; |
||||
gap: 12rpx; |
||||
font-size: 24rpx; |
||||
color: rgba(33, 29, 46, 0.28); |
||||
.skew { |
||||
width: 10rpx; |
||||
height: 22rpx; |
||||
background: #b982ff; |
||||
transform: skew(-15deg); |
||||
} |
||||
} |
||||
.c-content { |
||||
margin-top: 16rpx; |
||||
font-size: 32rpx; |
||||
color: #211d2e; |
||||
font-weight: bold; |
||||
display: flex; |
||||
align-items: center; |
||||
gap: 10rpx; |
||||
.label { |
||||
padding: 0 12rpx; |
||||
font-size: 20rpx; |
||||
color: #ffffff; |
||||
line-height: 32rpx; |
||||
border-radius: 50rpx 50rpx 50rpx 0rpx; |
||||
background: var(--label-background); |
||||
} |
||||
} |
||||
.progress { |
||||
position: relative; |
||||
margin-top: 38rpx; |
||||
display: grid; |
||||
grid-template-columns: 4fr 4fr 2fr; |
||||
gap: 4rpx; |
||||
.p-item { |
||||
.title { |
||||
display: flex; |
||||
align-items: center; |
||||
justify-content: space-between; |
||||
font-size: 24rpx; |
||||
color: #adacb2; |
||||
} |
||||
.line1 { |
||||
margin-top: 8rpx; |
||||
height: 16rpx; |
||||
background: rgba(185, 130, 255, 0.2); |
||||
} |
||||
.line2 { |
||||
margin-top: 8rpx; |
||||
height: 16rpx; |
||||
background: rgba(185, 130, 255, 0.6); |
||||
} |
||||
.line3 { |
||||
margin-top: 8rpx; |
||||
height: 16rpx; |
||||
background: #b982ff; |
||||
} |
||||
} |
||||
.slide { |
||||
position: absolute; |
||||
top: 30rpx; |
||||
transform: translateX(-50%); |
||||
.circle { |
||||
width: 28rpx; |
||||
height: 28rpx; |
||||
background: #b982ff; |
||||
border-radius: 50%; |
||||
border: 2rpx solid #ffffff; |
||||
} |
||||
.num { |
||||
position: absolute; |
||||
bottom: -12rpx; |
||||
left: 50%; |
||||
transform: translate(-50%, 100%); |
||||
padding: 0 10rpx; |
||||
min-width: 52rpx; |
||||
height: 32rpx; |
||||
font-size: 32rpx; |
||||
color: #b982ff; |
||||
text-align: center; |
||||
line-height: 32rpx; |
||||
background: #eae0fa; |
||||
border-radius: 8rpx 8rpx 8rpx 8rpx; |
||||
} |
||||
} |
||||
} |
||||
} |
||||
.effect { |
||||
margin-top: 24rpx; |
||||
font-size: 28rpx; |
||||
color: #adacb2; |
||||
text-align: center; |
||||
} |
||||
} |
||||
.page-effect-wrap { |
||||
margin: 64rpx 0 0; |
||||
display: flex; |
||||
align-items: center; |
||||
justify-content: center; |
||||
.page-effect { |
||||
font-size: 32rpx; |
||||
color: var(--color); |
||||
line-height: 44rpx; |
||||
padding: 8rpx 42rpx; |
||||
background: var(--background); |
||||
border-radius: 96rpx 96rpx 96rpx 96rpx; |
||||
border: 2rpx solid #ffffff; |
||||
} |
||||
} |
||||
.report { |
||||
margin-top: 88rpx; |
||||
height: 88rpx; |
||||
display: flex; |
||||
align-items: center; |
||||
justify-content: center; |
||||
font-size: 36rpx; |
||||
color: #ffffff; |
||||
background: linear-gradient(197deg, #ffbcf9 0%, #b982ff 100%); |
||||
border-radius: 100rpx 100rpx 100rpx 100rpx; |
||||
} |
||||
} |
||||
|
||||
.status1 { |
||||
--color: #ef3939; |
||||
--background: #ffdddd; |
||||
--label-background: linear-gradient(177deg, #ff9090 0%, #ef3939 100%); |
||||
} |
||||
.status2 { |
||||
--color: #ffa300; |
||||
--background: #fff4e0; |
||||
--label-background: linear-gradient(153deg, #ffd48b 0%, #ffa300 100%); |
||||
} |
||||
.status3 { |
||||
--color: #1ec580; |
||||
--background: #dafdee; |
||||
--label-background: linear-gradient(330deg, #1ec580 0%, #4feaaa 100%); |
||||
} |
||||
@ -0,0 +1,45 @@
@@ -0,0 +1,45 @@
|
||||
const app = getApp<IAppOption>() |
||||
|
||||
Page({ |
||||
data: { |
||||
id: '', |
||||
detail: {}, |
||||
}, |
||||
onLoad(options) { |
||||
this.setData({ |
||||
id: options.id, |
||||
}) |
||||
app.waitLogin({ type: [1] }).then(() => { |
||||
this.getDetail() |
||||
}) |
||||
}, |
||||
getDetail() { |
||||
wx.ajax({ |
||||
method: 'GET', |
||||
url: '?r=xd/qol/view', |
||||
data: { |
||||
Id: this.data.id, |
||||
}, |
||||
}).then((res) => { |
||||
this.setData({ |
||||
detail: res, |
||||
}) |
||||
}) |
||||
}, |
||||
handleReport() { |
||||
wx.navigateTo({ |
||||
url: '/patient/pages/qolReport/index', |
||||
}) |
||||
}, |
||||
handleBack() { |
||||
wx.navigateBack({ |
||||
fail() { |
||||
wx.reLaunch({ |
||||
url: '/patient/pages/index/index', |
||||
}) |
||||
}, |
||||
}) |
||||
}, |
||||
}) |
||||
|
||||
export {} |
||||
@ -0,0 +1,114 @@
@@ -0,0 +1,114 @@
|
||||
<navbar custom-style="background:{{background}}" fixed> |
||||
<van-icon name="arrow-left" slot="left" size="18px" color="#000" bind:tap="handleBack" /> |
||||
</navbar> |
||||
<view |
||||
class="page {{detail.TotalScore>=0 && 'status1'}} {{detail.TotalScore>=40 && 'status2'}} {{detail.TotalScore>=80 && 'status3'}}" |
||||
style="background: url('{{imageUrl}}bg15.png?t={{Timestamp}}') no-repeat top center/100% 518rpx;padding-top:{{pageTop+20}}px;" |
||||
> |
||||
<view class="container"> |
||||
<view class="info"> |
||||
<view class="wrap"> |
||||
<view class="w-header"> |
||||
<view class="num">{{detail.TotalScore}}</view> |
||||
<view class="label" wx:if="{{detail.TotalScore >= 80}}">轻度影响</view> |
||||
<view class="label" wx:elif="{{detail.TotalScore >= 40}}">中度影响</view> |
||||
<view class="label" wx:else>重度影响</view> |
||||
</view> |
||||
<view class="tip">本次TED生活质量评分</view> |
||||
</view> |
||||
<image class="status" wx:if="{{detail.TotalScore >= 80}}" src="{{imageUrl}}icon72.png?t={{Timestamp}}"></image> |
||||
<image class="status" wx:elif="{{detail.TotalScore >= 40}}" src="{{imageUrl}}icon71.png?t={{Timestamp}}"></image> |
||||
<image class="status" wx:else src="{{imageUrl}}icon70.png?t={{Timestamp}}"></image> |
||||
</view> |
||||
<view class="c-line"></view> |
||||
<view class="card {{detail.VisionScore>=0 && 'status1'}} {{detail.VisionScore>=40 && 'status2'}} {{detail.VisionScore>=80 && 'status3'}}"> |
||||
<view class="c-header"> |
||||
<view class="skew"></view> |
||||
视觉功能 |
||||
</view> |
||||
<view class="c-content"> |
||||
当前分数:{{detail.VisionScore}} |
||||
<view class="label" wx:if="{{detail.VisionScore >= 80}}">轻度影响</view> |
||||
<view class="label" wx:elif="{{detail.VisionScore >= 40}}">中度影响</view> |
||||
<view class="label" wx:else>重度影响</view> |
||||
</view> |
||||
<view class="progress"> |
||||
<view class="p-item"> |
||||
<view class="title"> |
||||
<view class="start">0</view> |
||||
<view class="end">39</view> |
||||
</view> |
||||
<view class="line1"></view> |
||||
</view> |
||||
<view class="p-item"> |
||||
<view class="title"> |
||||
<view class="start"></view> |
||||
<view class="end">79</view> |
||||
</view> |
||||
<view class="line2"></view> |
||||
</view> |
||||
<view class="p-item"> |
||||
<view class="title"> |
||||
<view class="start"></view> |
||||
<view class="end">100</view> |
||||
</view> |
||||
<view class="line3"></view> |
||||
</view> |
||||
<view class="slide" style="left:{{detail.VisionScore}}%"> |
||||
<view class="circle"></view> |
||||
<view class="num">{{detail.VisionScore}}</view> |
||||
</view> |
||||
</view> |
||||
</view> |
||||
<view class="card {{detail.AppearanceScore>=0 && 'status1'}} {{detail.AppearanceScore>=40 && 'status2'}} {{detail.AppearanceScore>=80 && 'status3'}}"> |
||||
<view class="c-header"> |
||||
<view class="skew"></view> |
||||
外观 |
||||
</view> |
||||
<view class="c-content"> |
||||
当前分数:{{detail.AppearanceScore}} |
||||
<view class="label" wx:if="{{detail.AppearanceScore >= 80}}">轻度影响</view> |
||||
<view class="label" wx:elif="{{detail.AppearanceScore >= 40}}">中度影响</view> |
||||
<view class="label" wx:else>重度影响</view> |
||||
</view> |
||||
<view class="progress"> |
||||
<view class="p-item"> |
||||
<view class="title"> |
||||
<view class="start">0</view> |
||||
<view class="end">39</view> |
||||
</view> |
||||
<view class="line1"></view> |
||||
</view> |
||||
<view class="p-item"> |
||||
<view class="title"> |
||||
<view class="start"></view> |
||||
<view class="end">79</view> |
||||
</view> |
||||
<view class="line2"></view> |
||||
</view> |
||||
<view class="p-item"> |
||||
<view class="title"> |
||||
<view class="start"></view> |
||||
<view class="end">100</view> |
||||
</view> |
||||
<view class="line3"></view> |
||||
</view> |
||||
<view class="slide" style="left:{{detail.AppearanceScore}}%"> |
||||
<view class="circle"></view> |
||||
<view class="num">{{detail.AppearanceScore}}</view> |
||||
</view> |
||||
</view> |
||||
</view> |
||||
<view class="effect">分数越低, 对生活质量影响越严重</view> |
||||
</view> |
||||
<view class="page-effect-wrap"> |
||||
<view class="page-effect" wx:if="{{detail.TotalScore >= 80}}">建议保持定期监测,保持良好生活习惯</view> |
||||
<view class="page-effect" wx:elif="{{detail.TotalScore >= 40}}">建议就诊检查,评估是否需要调整治疗</view> |
||||
<view class="page-effect" wx:else>建议前往眼科中心 及时就诊</view> |
||||
</view> |
||||
|
||||
<view class="report" bind:tap="handleReport"> |
||||
查看我的评估报告 |
||||
<van-icon name="arrow" /> |
||||
</view> |
||||
</view> |
||||