diff --git a/src/app.json b/src/app.json index 7a4fe4f..89d5194 100644 --- a/src/app.json +++ b/src/app.json @@ -8,7 +8,11 @@ "pages/information/index", "pages/informationDetail/index", "pages/message/index", - "pages/webview/index" + "pages/webview/index", + "pages/d_interactive/index", + "pages/d_interactiveDoctor/index", + "pages/d_patientDetail/index", + "pages/d_userInfo/index" ], "subPackages": [ { @@ -72,9 +76,9 @@ }, { "root": "gift", + "independent": true, "pages": [ "pages/giftList/index", - "pages/giftDetail/index", "pages/conformOrder/index", "pages/siteList/index", "pages/siteEdit/index", @@ -127,6 +131,12 @@ "text": "资料库" }, { + "iconPath": "/images/tabbar/tab2.png", + "selectedIconPath": "/images/tabbar/tab-active2.png", + "pagePath": "pages/d_interactive/index", + "text": "互动" + }, + { "iconPath": "/images/tabbar/tab3.png", "selectedIconPath": "/images/tabbar/tab-active3.png", "pagePath": "pages/my/index", diff --git a/src/pages/d_interactive/index.json b/src/pages/d_interactive/index.json new file mode 100644 index 0000000..3a50fc6 --- /dev/null +++ b/src/pages/d_interactive/index.json @@ -0,0 +1,8 @@ +{ + "navigationStyle": "custom", + "usingComponents": { + "zd-navBar": "/components/zd-navBar/navBar", + "van-icon": "@vant/weapp/icon/index", + "van-popup": "@vant/weapp/popup/index" + } +} diff --git a/src/pages/d_interactive/index.scss b/src/pages/d_interactive/index.scss new file mode 100644 index 0000000..b6ae878 --- /dev/null +++ b/src/pages/d_interactive/index.scss @@ -0,0 +1,161 @@ +page { + background-color: rgba(242, 244, 245, 1); + padding-bottom: calc(140rpx + env(safe-area-inset-bottom)); +} +.page { + min-height: 100vh; + .page-header { + position: sticky; + top: 0; + padding: 30rpx; + box-shadow: 0rpx 8rpx 16rpx 0rpx rgba(40, 48, 49, 0.04); + z-index: 10; + .wrap { + display: flex; + align-items: center; + .search { + flex: 1; + padding: 18rpx 32rpx; + display: flex; + align-items: center; + gap: 16rpx; + background: linear-gradient(to top, #ffffff 0%, #ebf3f4 100%); + box-shadow: 0rpx 8rpx 8rpx 0rpx rgba(40, 48, 49, 0.04); + border-radius: 140rpx 140rpx 140rpx 140rpx; + border: 2rpx solid #ffffff; + .icon { + width: 40rpx; + height: 40rpx; + } + .input { + flex: 1; + font-size: 28rpx; + } + .input-place { + color: rgba(173, 179, 180, 1); + } + } + .clear { + margin-left: 32rpx; + width: 44rpx; + height: 44rpx; + } + } + .navbar { + margin-top: 32rpx; + display: flex; + justify-content: space-between; + align-items: center; + .nav { + position: relative; + flex: 1; + text-align: center; + font-size: 32rpx; + color: rgba(103, 113, 114, 1); + transition: all 0.3s; + .dot { + padding: 0 4rpx; + position: absolute; + left: 50%; + transform: translateX(35rpx); + top: 0; + min-width: 18rpx; + height: 26rpx; + font-size: 18rpx; + line-height: 26rpx; + color: rgba(255, 255, 255, 1); + border-radius: 50%; + background: rgba(215, 108, 108, 1); + } + &.active { + font-size: 32rpx; + color: rgba(98, 190, 208, 1); + font-weight: bold; + &::after { + position: absolute; + bottom: -30rpx; + left: 50%; + transform: translateX(-50%); + content: ''; + width: 52rpx; + height: 8rpx; + border-radius: 24rpx 24rpx 0 0; + background: #62bed0; + } + } + } + } + } + .list { + margin: 30rpx; + .list-item { + margin-bottom: 24rpx; + padding: 30rpx; + border-radius: 24rpx; + background-color: #fff; + display: flex; + .avatar { + flex-shrink: 0; + position: relative; + width: 92rpx; + height: 92rpx; + .a-img { + width: 100%; + height: 100%; + border-radius: 50%; + } + .dot { + position: absolute; + top: 0; + right: 0; + width: 18rpx; + height: 18rpx; + border: 2rpx solid #ffffff; + border-radius: 50%; + background: #d76c6c; + } + } + .wrap { + flex: 1; + padding-left: 24rpx; + .w-header { + display: flex; + align-items: center; + justify-content: space-between; + .name { + font-size: 32rpx; + color: rgba(40, 48, 49, 1); + font-weight: bold; + } + .date { + font-size: 24rpx; + color: rgba(154, 161, 162, 1); + } + } + .tags { + margin-top: 12rpx; + display: flex; + flex-wrap: wrap; + gap: 12rpx; + .tag { + padding: 4rpx 16rpx; + border-radius: 8rpx; + border-color: rgba(242, 244, 245, 1); + font-size: 22rpx; + color: rgba(103, 113, 114, 1); + background-color: rgba(242, 244, 245, 1); + } + } + .content { + margin-top: 20rpx; + max-width: 18em; + font-size: 28rpx; + color: rgba(154, 161, 162, 1); + overflow: hidden; + white-space: nowrap; + text-overflow: ellipsis; + } + } + } + } +} diff --git a/src/pages/d_interactive/index.ts b/src/pages/d_interactive/index.ts new file mode 100644 index 0000000..94ecf61 --- /dev/null +++ b/src/pages/d_interactive/index.ts @@ -0,0 +1,123 @@ +const app = getApp(); + +Page({ + data: { + list: [] as any, + unReadCount: 0, + pagination: { + page: 1, + pages: 1, + count: 1, + }, + active: '', + search: '', + }, + onShow() { + app.waitLogin({ type: [2] }).then((_res) => { + this.getList(); + }); + }, + handleTapSearch() { + app.zdMpBehavior({ doctor: true, PageName: 'BTN_DOCTORINTERACTIONSEARCH' }); + }, + handleSearch() { + this.setData({ + list: [], + pagination: { + page: 1, + pages: 1, + count: 1, + }, + }); + this.getList(); + }, + handleNav(e) { + const { active } = e.currentTarget.dataset; + this.setData({ + active, + }); + this.getList(); + }, + getList(newPage = 1) { + const { active } = this.data; + if (active == '' && newPage == 1) { + app.zdMpBehavior({ doctor: true, PageName: 'PG_DOCTORINTERACTIONALL' }); + } + if (active == '1' && newPage == 1) { + app.zdMpBehavior({ doctor: true, PageName: 'PG_DOCTORINTERACTIONREAD' }); + } + if (active == '2' && newPage == 1) { + app.zdMpBehavior({ doctor: true, PageName: 'PG_DOCTORINTERACTIONUNREAD' }); + } + wx.ajax({ + method: 'GET', + url: '?r=zd/doctor/message-interact/get-interact-patient-list', + data: { + page: newPage, + search: this.data.search, + readStatus: this.data.active, + }, + }).then((res) => { + const list = res.page === 1 ? res.list : [...this.data.list, ...res.list]; + this.setData({ + list, + unReadCount: res.unReadCount, + pagination: { + page: res.page, + pages: res.pages, + count: res.count, + }, + }); + }); + }, + onReachBottom() { + const { page, pages } = this.data.pagination; + if (pages > page) { + this.getList(page + 1); + } + }, + handleDetail(e) { + app.zdMpBehavior({ doctor: true, PageName: 'BTN_DOCTORINTERACTIONVIEW' }); + const { index } = e.currentTarget.dataset; + const { list } = this.data; + const listItem: any = list[index]; + wx.navigateTo({ + url: `/pages/d_interactiveDoctor/index?patientId=${listItem.patientId}`, + }); + }, + hancleClaer() { + if (Number(this.data.unReadCount) === 0) { + wx.showToast({ + title: '暂无未读消息', + icon: 'none', + }); + return; + } + wx.showModal({ + title: '提示', + content: '确认清空消息吗?', + confirmColor: '#62bed0', + success: (res) => { + if (res.confirm) { + wx.ajax({ + method: 'POST', + url: '?r=zd/doctor/message-interact/read-history', + data: {}, + }).then((_res) => { + this.setData({ + unReadCount: 0, + list: this.data.list.map((item: any) => { + return { + ...item, + msgReadStatus: '1', + }; + }), + }); + const header = this.selectComponent('#tabbar'); + header.getList(); //子组件的方法 + }); + } + }, + }); + }, +}); diff --git a/src/pages/d_interactive/index.wxml b/src/pages/d_interactive/index.wxml new file mode 100644 index 0000000..3672782 --- /dev/null +++ b/src/pages/d_interactive/index.wxml @@ -0,0 +1,62 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + {{item.patientName}} + {{item.Telephone}} + {{item.msgCreateTime}} + + + + {{tag}} + + + {{item.msgContent}} + + + + + diff --git a/src/pages/d_interactiveDoctor/index.json b/src/pages/d_interactiveDoctor/index.json new file mode 100644 index 0000000..279a451 --- /dev/null +++ b/src/pages/d_interactiveDoctor/index.json @@ -0,0 +1,8 @@ +{ + "navigationBarTitleText": "互动", + "navigationStyle": "default", + "usingComponents": { + "van-icon": "@vant/weapp/icon/index", + "van-popup": "@vant/weapp/popup/index" + } +} diff --git a/src/pages/d_interactiveDoctor/index.scss b/src/pages/d_interactiveDoctor/index.scss new file mode 100644 index 0000000..4bf683d --- /dev/null +++ b/src/pages/d_interactiveDoctor/index.scss @@ -0,0 +1,642 @@ +page { + background-color: rgba(242, 244, 245, 1); +} +.page { + height: 100vh; + overflow: hidden; + display: flex; + flex-direction: column; + justify-content: space-between; + .page-header { + padding-bottom: 30rpx; + border-radius: 0 0 24rpx 24rpx; + background-color: #fff; + .user { + flex-shrink: 0; + padding: 36rpx 30rpx 0; + display: flex; + align-items: center; + justify-content: space-between; + .avatar { + width: 104rpx; + height: 104rpx; + border-radius: 50%; + } + .wrap { + flex: 1; + padding: 0 20rpx; + .name { + display: flex; + justify-content: space-between; + align-items: center; + font-size: 40rpx; + color: rgba(40, 48, 49, 1); + font-weight: bold; + .tip { + display: block; + padding: 2rpx 16rpx; + font-size: 24rpx; + color: #fff; + border-radius: 0 30rpx 30rpx 30rpx; + background-color: #67baca; + } + .detail { + flex-shrink: 0; + font-size: 28rpx; + color: rgba(103, 186, 202, 1); + font-weight: normal; + } + } + .tags { + margin-top: 20rpx; + display: flex; + flex-wrap: wrap; + gap: 12rpx; + .tag { + padding: 4rpx 16rpx; + font-size: 22rpx; + color: rgba(103, 113, 114, 1); + border-radius: 8rpx; + background-color: rgba(242, 244, 245, 1); + } + } + } + } + .adl { + margin: 32rpx 30rpx 0; + background: #ffffff; + box-shadow: 0rpx 8rpx 32rpx 0rpx rgba(40, 48, 49, 0.04); + border-radius: 24rpx 24rpx 24rpx 24rpx; + border: 2rpx solid #f8f9f9; + .a-header { + display: flex; + align-items: flex-start; + flex-direction: column; + .content { + border-radius: 24rpx 0 24rpx 0; + padding: 14rpx 28rpx; + font-size: 28rpx; + line-height: 1; + color: rgba(98, 190, 208, 1); + background-color: rgba(242, 248, 249, 1); + } + .box { + width: 40rpx; + height: 40rpx; + background-color: rgba(242, 248, 249, 1); + } + } + .a-content { + position: relative; + z-index: 1; + margin-top: -40rpx; + padding: 32rpx 30rpx; + background-color: #fff; + border-radius: 24rpx; + .row { + display: flex; + align-items: center; + gap: 20rpx; + &:first-of-type { + margin-bottom: 24rpx; + } + .label { + flex-shrink: 0; + font-size: 28rpx; + color: rgba(154, 161, 162, 1); + } + .num { + min-width: 3em; + font-size: 28rpx; + color: rgba(40, 48, 49, 1); + } + .tag { + display: flex; + align-items: center; + background-color: rgba(232, 245, 248, 1); + border-radius: 12rpx; + .t-label { + padding: 8rpx 12rpx; + font-size: 24rpx; + color: rgba(255, 255, 255, 1); + background-color: rgba(103, 186, 202, 1); + border-radius: 12rpx; + display: flex; + align-items: center; + gap: 8rpx; + flex-shrink: 0; + .icon { + width: 24rpx; + height: 24rpx; + } + } + .t-content { + padding: 0 16rpx 0 8rpx; + display: flex; + align-items: center; + font-size: 28rpx; + color: rgba(103, 186, 202, 1); + display: flex; + align-items: center; + gap: 4rpx; + flex-shrink: 0; + .icon { + width: 24rpx; + height: 28rpx; + } + } + &.tag-warn { + background-color: rgba(227, 220, 64, 0.1); + .t-label { + background-color: rgba(225, 217, 45, 1); + } + .t-content { + color: rgba(225, 217, 45, 1); + } + } + &.tag-error { + background-color: rgba(248, 234, 234, 1); + .t-label { + background-color: rgba(215, 108, 108, 1); + } + .t-content { + color: rgba(215, 108, 108, 1); + } + } + } + } + } + } + } + .page-container { + flex: 1; + overflow: hidden; + .scroll-view { + height: 100%; + .date { + padding-top: 20rpx; + font-size: 28rpx; + color: rgba(173, 179, 180, 1); + text-align: center; + } + .patient { + padding: 15rpx 30rpx; + display: flex; + .avatar { + padding-right: 16rpx; + flex-shrink: 0; + .a-img { + width: 80rpx; + height: 80rpx; + border-radius: 50%; + } + } + .p-container { + flex: 1; + margin-right: 74rpx; + display: flex; + flex-direction: column; + align-items: start; + .guide { + margin-bottom: 32rpx; + padding: 32rpx 30rpx; + border-radius: 0 32rpx 32rpx; + background: linear-gradient(13deg, #ffffff 8%, #e8f0f1 100%); + border: 2rpx solid #ffffff; + .title { + font-size: 32rpx; + color: rgba(40, 48, 49, 1); + font-weight: bold; + } + .sub-title { + font-size: 28rpx; + color: rgba(154, 161, 162, 1); + margin-bottom: 30rpx; + } + .list { + .l-item { + display: flex; + align-items: center; + gap: 16rpx; + margin-bottom: 30rpx; + .order { + flex-shrink: 0; + width: 28rpx; + height: 28rpx; + font-size: 24rpx; + display: flex; + align-items: center; + justify-content: center; + color: rgba(255, 255, 255, 1); + border-radius: 6rpx; + background: #67baca; + } + .content { + font-size: 32rpx; + color: rgba(40, 48, 49, 1); + } + } + } + .tip { + font-size: 28rpx; + color: rgba(103, 113, 114, 1); + display: flex; + align-items: center; + .icon { + width: 44rpx; + height: 44rpx; + } + } + } + .message { + margin-bottom: 32rpx; + padding: 26rpx 32rpx; + background-color: #fff; + border-radius: 0 32rpx 32rpx; + font-size: 32rpx; + color: rgba(40, 48, 49, 1); + white-space: pre-line; + } + .referral-replay { + margin-bottom: 32rpx; + padding: 18rpx 32rpx; + border-radius: 32rpx; + background-color: #fff; + .title { + font-size: 32rpx; + color: #283031; + line-height: 48rpx; + } + .sub-title { + margin-top: 32rpx; + font-size: 32rpx; + color: #67baca; + font-weight: bold; + display: flex; + align-items: center; + &::before { + margin-right: 8rpx; + content: ''; + width: 6rpx; + height: 32rpx; + background-color: #67baca; + border-radius: 84rpx; + } + } + .r-list { + margin-top: 12rpx; + .item { + padding: 24rpx 0; + font-size: 32rpx; + color: #283031; + line-height: 36rpx; + border-bottom: 1px solid #eaeced; + &:last-of-type { + border: none; + } + } + } + } + } + } + .doctor { + padding: 15rpx 30rpx; + display: flex; + justify-content: flex-end; + .avatar { + padding-left: 16rpx; + flex-shrink: 0; + .a-img { + width: 80rpx; + height: 80rpx; + border-radius: 50%; + } + } + .d-container { + flex: 1; + margin-left: 74rpx; + display: flex; + flex-direction: column; + align-items: flex-end; + .guide { + margin-bottom: 32rpx; + padding: 32rpx 30rpx; + border-radius: 32rpx 0 32rpx 32rpx; + background: linear-gradient(13deg, #ffffff 8%, #e8f0f1 100%); + border: 2rpx solid #ffffff; + .title { + font-size: 32rpx; + color: rgba(40, 48, 49, 1); + font-weight: bold; + } + .sub-title { + font-size: 28rpx; + color: rgba(154, 161, 162, 1); + margin-bottom: 30rpx; + } + .list { + .l-item { + display: flex; + align-items: center; + gap: 16rpx; + margin-bottom: 30rpx; + .order { + flex-shrink: 0; + width: 28rpx; + height: 28rpx; + font-size: 24rpx; + display: flex; + align-items: center; + justify-content: center; + color: rgba(255, 255, 255, 1); + border-radius: 6rpx; + background: #67baca; + } + .content { + font-size: 32rpx; + color: rgba(40, 48, 49, 1); + } + } + } + .tip { + font-size: 28rpx; + color: rgba(103, 113, 114, 1); + display: flex; + align-items: center; + .icon { + width: 44rpx; + height: 44rpx; + } + } + } + .message { + margin-bottom: 32rpx; + padding: 26rpx 32rpx; + background: #67baca; + border-radius: 32rpx 0 32rpx 32rpx; + font-size: 32rpx; + color: #fff; + white-space: pre-line; + } + .week { + margin-bottom: 32rpx; + padding: 26rpx 32rpx; + background-color: #fff; + border-radius: 32rpx 0 32rpx 32rpx; + .w-title { + font-size: 32rpx; + color: rgba(40, 48, 49, 1); + text-align: right; + } + .w-container { + margin-top: 24rpx; + .w-content { + padding: 32rpx; + font-size: 32rpx; + color: rgba(40, 48, 49, 1); + line-height: 48rpx; + border-radius: 24rpx; + background-color: rgba(247, 248, 249, 1); + } + .row { + display: flex; + .label { + width: 156rpx; + height: 76rpx; + display: flex; + align-items: center; + justify-content: center; + font-size: 32rpx; + color: rgba(255, 255, 255, 1); + background-color: rgba(103, 186, 202, 1); + } + .content { + width: 156rpx; + height: 76rpx; + display: flex; + align-items: center; + justify-content: center; + font-size: 32rpx; + color: rgba(40, 48, 49, 1); + background-color: rgba(242, 244, 245, 1); + } + &:first-of-type { + .label { + border-radius: 24rpx 0 0 0; + } + .content { + border-radius: 0 24rpx 0 0; + } + } + &:last-of-type { + .label { + border-radius: 0 0 0 24rpx; + } + .content { + border-radius: 0 0 24rpx 0; + } + } + &:not(:last-of-type) { + border-bottom: 2rpx solid #fff; + } + } + } + } + .adl { + margin-bottom: 32rpx; + padding: 32rpx 156rpx 34rpx 30rpx; + border-radius: 0 32rpx 32rpx; + background: linear-gradient(141deg, #edfcff 0%, #d4f3f9 100%); + border: 2rpx solid #fff; + .title { + width: 324rpx; + height: 40rpx; + } + .sub-title { + margin-top: 18rpx; + line-height: 1; + font-size: 28rpx; + color: rgba(255, 255, 255, 0.8); + } + .btn { + margin-top: 20rpx; + width: 220rpx; + height: 56rpx; + text-align: center; + line-height: 56rpx; + font-size: 28rpx; + color: #e04775; + background: #ffffff; + border-radius: 102rpx 102rpx 102rpx 102rpx; + } + .tip { + margin-top: 10rpx; + font-size: 24rpx; + color: #fff; + } + } + .audio { + margin-bottom: 32rpx; + padding: 22rpx 24rpx; + border-radius: 32rpx 0 32rpx 32rpx; + background: #67baca; + min-width: 218rpx; + font-size: 32rpx; + color: #fff; + display: flex; + align-items: center; + justify-content: flex-end; + gap: 12rpx; + box-sizing: border-box; + .icon { + width: 32rpx; + height: 40rpx; + } + } + .info { + margin-bottom: 32rpx; + padding: 26rpx 32rpx; + background-color: #fff; + border-radius: 32rpx 0 32rpx 32rpx; + .content { + font-size: 28rpx; + color: #283031; + } + .btn { + margin-top: 24rpx; + padding: 22rpx; + font-size: 32rpx; + color: #283031; + line-height: 40rpx; + text-align: center; + background: #67baca; + color: #ffffff; + border-radius: 104rpx 104rpx 104rpx 104rpx; + border: 1rpx solid #f8f9f9; + } + } + .referral { + margin-bottom: 32rpx; + width: 502rpx; + height: 262rpx; + background: linear-gradient(223deg, #59b0c2 0%, #94e2f1 100%); + box-shadow: 0rpx 4rpx 24rpx 0rpx rgba(0, 0, 0, 0.07); + border-radius: 24rpx 24rpx 24rpx 24rpx; + .r-header { + padding: 20rpx 24rpx 0 32rpx; + display: flex; + .title { + font-size: 32rpx; + color: #ffffff; + line-height: 48rpx; + } + .icon { + flex-shrink: 0; + width: 138rpx; + height: 122rpx; + } + } + .r-footer { + padding: 32rpx; + background: linear-gradient(11deg, #ffffff 8%, rgba(255, 255, 255, 0.79) 100%); + border-radius: 24rpx 24rpx 24rpx 24rpx; + border: 2rpx solid #ffffff; + .btn { + width: 438rpx; + height: 64rpx; + font-size: 32rpx; + color: #fff; + text-align: center; + line-height: 64rpx; + background: #67baca; + border-radius: 104rpx 104rpx 104rpx 104rpx; + } + } + } + } + } + .place { + height: 200rpx; + } + } + } + .page-footer { + padding: 32rpx 30rpx calc(32rpx + env(safe-area-inset-bottom)); + box-sizing: border-box; + display: flex; + gap: 28rpx; + border-radius: 32rpx 32rpx 0 0; + box-shadow: 0rpx 8rpx 16rpx 0rpx rgba(40, 48, 49, 0.04); + border: 2rpx solid #ffffff; + background-color: #fff; + .send { + flex: 1; + display: flex; + align-items: center; + justify-content: center; + font-size: 32rpx; + color: rgba(40, 48, 49, 1); + height: 76rpx; + background: #ffffff; + box-shadow: 0rpx 8rpx 16rpx 0rpx rgba(40, 48, 49, 0.04); + border-radius: 140rpx 140rpx 140rpx 140rpx; + border: 2rpx solid #f2f4f5; + .icon { + width: 36rpx; + height: 36rpx; + } + } + .send-date { + flex-shrink: 0; + font-size: 24rpx; + color: #283031; + text-align: center; + .icon { + width: 40rpx; + height: 40rpx; + } + } + } +} + +.popup-message { + padding: 30rpx; + background-color: rgba(242, 244, 245, 1); + .title { + padding: 0 32rpx 32rpx; + font-size: 36rpx; + color: rgba(40, 48, 49, 1); + font-weight: bold; + text-align: center; + } + .list { + max-height: 50vh; + overflow-y: auto; + overflow-x: hidden; + .l-item { + margin-bottom: 24rpx; + padding: 30rpx; + font-size: 32rpx; + color: rgba(40, 48, 49, 1); + border-radius: 24rpx; + background-color: #fff; + &.active { + color: #fff; + background-color: rgba(103, 186, 202, 1); + } + } + } + .submit { + margin-top: 24rpx; + width: 690rpx; + height: 84rpx; + font-size: 36rpx; + color: rgba(255, 255, 255, 1); + font-weight: bold; + background: #67baca; + display: flex; + align-items: center; + justify-content: center; + border-radius: 64rpx 64rpx 64rpx 64rpx; + } +} diff --git a/src/pages/d_interactiveDoctor/index.ts b/src/pages/d_interactiveDoctor/index.ts new file mode 100644 index 0000000..a324810 --- /dev/null +++ b/src/pages/d_interactiveDoctor/index.ts @@ -0,0 +1,443 @@ +import dayjs from 'dayjs'; + +const app = getApp(); + +interface IMessageItem { + msgId: string; + msgContentType: '1' | '2' | '3' | '4' | '5' | '6' | '7' | '8' | '9'; // 1:文本 2: 出诊时间 3: adl卡片 4: 语音 5: 欢迎语 6:补充真实姓名 7: 提醒完善信息 8: 复诊卡片 9:患者恢复复诊消息 + msgContent: any; + msgVisitTime: string; + msgVisitTimeType?: string; + msgFromType: '1' | '2'; // 1: 患者 2: 医生 + isPlay?: boolean; + msgCreateTime: string; // 消息创建时间 + msgCreateTimeName?: string; // 消息创建时间 + showTime?: boolean; +} + +interface Item { + wordId: string; + word: string; +} + +Page({ + data: { + doctor: {} as any, + + patientId: '', + messageListShow: false, + patientDetail: {}, + + isLoad: false, + isFinish: false, + scrollTop: 0, + scrollIntoView: '', + messageList: [] as IMessageItem[], + nextMsgId: '', + + wordIndex: 0, + wordList: [] as Item[], + + week: ['周一', '周二', '周三', '周四', '周五', '周六', '周日'], + timeDay: { 1: '上午', 2: '下午' }, + }, + + innerAudioContext: null as WechatMiniprogram.InnerAudioContext | null, + + onLoad(options) { + this.innerAudioContext = wx.createInnerAudioContext({ + useWebAudioImplement: true, + }); + this.setData({ + patientId: options.patientId, + }); + }, + onShow() { + app.waitLogin({ type: [2] }).then((_res) => { + app.zdMpBehavior({ doctor: true, PageName: 'PG_DOCTORINTERACTIONDETAIL' }); + this.getDoctorDetail(); + this.getPatientDetail(); + this.getMessageList(); + this.getWordList(); + }); + }, + onUnload() { + if (this.innerAudioContext) { + this.innerAudioContext.stop(); + } + }, + getDoctorDetail() { + wx.ajax({ + method: 'GET', + url: '?r=zd/doctor/account/info', + data: {}, + }).then((res) => { + this.setData({ + doctor: res.doctor, + }); + }); + }, + getPatientDetail() { + wx.ajax({ + method: 'GET', + url: '?r=zd/doctor/message-interact/get-patient-info', + data: { + patientId: this.data.patientId, + }, + }).then((res) => { + if (res.LastAdlTime) { + res.LastAdlTimeName = dayjs(res.LastAdlTime).from(dayjs().format('YYYY-MM-DD')).replace(' ', ''); + } + this.setData({ + patientDetail: res, + }); + }); + }, + getMessageList() { + if (this.data.isLoad || this.data.isFinish) return; + this.setData({ + isLoad: true, + }); + const nextMsgId = this.data.nextMsgId; + wx.ajax({ + method: 'GET', + url: '?r=zd/doctor/message-interact/doctor-get-message-list', + data: { + nextMsgId, + patientId: this.data.patientId, + }, + }).then((res) => { + res.messageList.map((item) => { + if (item.msgContentType === '4') { + item.msgContent = JSON.parse(item.msgContent); + } + if (item.msgContentType === '2') { + item.msgVisitTime = item.msgVisitTimeType == 2 ? item.msgVisitTime : JSON.parse(item.msgVisitTime); + } + if (item.msgContentType === '5') { + item.welcomeMsg = JSON.parse(item.welcomeMsg); + } + if (item.msgContentType === '9') { + item.ReVisitInfo = JSON.parse(item.ReVisitInfo); + item.ReVisitInfo.visitDateName = dayjs(item.ReVisitInfo.visitDate).format('YYYY年M月DD日'); + } + + return item; + }); + if (!this.data.nextMsgId && !res.messageList.length) { + res.messageList = [ + { + msgId: '0', + msgContentType: '0', + msgContent: '', + msgVisitTime: '', + msgFromType: '2', + }, + ]; + } + this.setData({ + messageList: [...res.messageList.reverse(), ...this.data.messageList], + nextMsgId: res.nextMsgId, + unReadCount: res.unReadCount, + firstNotReadMsgId: res.firstNotReadMsgId, + isVisitAdl: res.isVisitAdl, + adlMsgId: res.adlMsgId, + isLoad: false, + isFinish: nextMsgId === res.nextMsgId, + }); + this.filterCreateTime(); + if (!nextMsgId) { + this.handleView(); + } + }); + }, + scrolltoupper(e) { + if (e.detail.direction === 'top') { + this.getMessageList(); + } + }, + getWordList() { + wx.ajax({ + method: 'GET', + url: '?r=zd/doctor/message-interact/get-common-word-list', + data: {}, + }).then((res) => { + this.setData({ + wordList: res, + }); + }); + }, + handleSendDate() { + app.zdMpBehavior({ doctor: true, PageName: 'BTN_DOCTORINTERACTIONDETAILMYCLINICTIME' }); + const { + messageList, + doctor: { Clinic }, + } = this.data; + if (!Clinic || (Array.isArray(Clinic) && !Clinic.length)) { + wx.showModal({ + title: '完善出诊时间?', + content: '您还没有录入出诊时间', + confirmText: '录入', + confirmColor: '#62bed0', + success: (res) => { + if (res.confirm) { + wx.navigateTo({ + url: '/pages/d_userInfo/index', + }); + } + }, + }); + return; + } + wx.showModal({ + title: '提示', + content: '将您的出诊时间发送给患者?', + confirmColor: '#62bed0', + success: (res) => { + if (res.confirm) { + this.setData({ + messageList: [ + ...messageList, + { + msgId: '', + msgContentType: '2', + msgContent: '', + msgVisitTime: this.data.doctor.Clinic, + msgVisitTimeType: this.data.doctor.ClinicType, + msgFromType: '2', + msgCreateTime: dayjs().format('YYYY-MM-DD HH:mm:ss'), + }, + ], + }); + this.filterCreateTime(); + wx.ajax({ + method: 'POST', + url: '?r=zd/doctor/message-interact/send-visit-time', + data: { + patientId: this.data.patientId, + }, + }); + this.handleView(); + } + }, + }); + }, + handleSendShow() { + app.zdMpBehavior({ doctor: true, PageName: 'BTN_DOCTORINTERACTIONDETAILSENDMESSAGE' }); + this.setData({ + messageListShow: true, + }); + }, + handlePopupMessageClose() { + this.setData({ + messageListShow: false, + }); + }, + handleWord(e) { + const { index } = e.currentTarget.dataset; + this.setData({ + wordIndex: index, + }); + }, + handleSendWord() { + const { messageList, wordList, wordIndex } = this.data; + const { wordId, word } = wordList[wordIndex]; + this.setData({ + messageList: [ + ...messageList, + { + msgId: '', + msgContentType: '1', + msgContent: word, + msgVisitTime: '', + msgFromType: '2', + msgCreateTime: dayjs().format('YYYY-MM-DD HH:mm:ss'), + }, + ], + }); + this.filterCreateTime(); + this.handlePopupMessageClose(); + this.handleView(); + wx.ajax({ + method: 'POST', + url: '?r=zd/doctor/message-interact/send-word-message', + data: { + patientId: this.data.patientId, + wordId, + }, + }); + }, + handleSendUserConform(e) { + const { id } = e.currentTarget.dataset; + const title = { + 6: '发送后患者将收到补充姓名通知', + 7: '发送后患者将收到完善信息通知', + }[id]; + wx.showModal({ + title, + confirmColor: '#62bed0', + success: (res) => { + if (res.confirm) { + this.handleSendUser(id); + } + }, + }); + }, + handleSendUser(id) { + const { messageList } = this.data; + const content = { + 6: '请完善您的真实姓名,以便我清楚了解您的病情', + 7: '请完善您的个人信息,以便我清楚了解您的病情', + }[id]; + this.setData({ + messageList: [ + ...messageList, + { + msgId: '', + msgContentType: id, + msgContent: content, + msgVisitTime: '', + msgFromType: '2', + msgCreateTime: dayjs().format('YYYY-MM-DD HH:mm:ss'), + }, + ], + }); + this.filterCreateTime(); + this.handlePopupMessageClose(); + this.handleView(); + const url = { + 6: '?r=zd/doctor/message-interact/send-remind-name', + 7: '?r=zd/doctor/message-interact/send-remind-init', + }[id]; + wx.ajax({ + method: 'POST', + url, + data: { + patientId: this.data.patientId, + }, + }); + }, + + formatTime(date: string) { + let msgCreateTimeName = ''; + if (dayjs().format('YYYY-MM-DD') === dayjs(date).format('YYYY-MM-DD')) { + msgCreateTimeName = dayjs(date).format('HH:mm'); + } else if (dayjs().format('YYYY-MM-DD') === dayjs(date).add(1, 'day').format('YYYY-MM-DD')) { + msgCreateTimeName = `昨天 ${dayjs(date).format('HH:mm')}`; + } else if (dayjs().diff(date, 'day') < 7) { + msgCreateTimeName = dayjs(date).format(`dddd HH:mm`); + } else { + msgCreateTimeName = dayjs(date).format('YYYY-MM-DD HH:mm'); + } + return msgCreateTimeName; + }, + filterCreateTime() { + const gapTime = 5 * 60 * 1000; + const { messageList } = this.data; + + let preTime = 0; + messageList.forEach((item, index) => { + if (index === 0) { + item.showTime = true; + preTime = dayjs(item.msgCreateTime).valueOf(); + item.msgCreateTimeName = this.formatTime(item.msgCreateTime); + } else { + const curTime = dayjs(item.msgCreateTime).valueOf(); + if (curTime - preTime > gapTime) { + item.showTime = true; + item.msgCreateTimeName = this.formatTime(item.msgCreateTime); + preTime = dayjs(item.msgCreateTime).valueOf(); + } + } + }); + this.setData({ + messageList, + }); + }, + handleView(index = -1) { + this.setData({ + scrollIntoView: index > -1 ? `view${index}` : `place`, + }); + }, + handlePatientDetail() { + app.zdMpBehavior({ doctor: true, PageName: 'BTN_DOCTORINTERACTIONDETAILPATIENTFILE' }); + wx.navigateTo({ + url: `/pages/d_patientDetail/index?id=${this.data.patientId}`, + }); + }, + handleAudio(e) { + const { index } = e.currentTarget.dataset; + const { messageList } = this.data; + const messageItem = messageList[index]; + const { url } = messageItem.msgContent[0]; + if (this.innerAudioContext) { + if (messageItem.isPlay) { + this.innerAudioContext.stop(); + messageItem.isPlay = false; + this.setData({ + messageList, + }); + return; + } + this.innerAudioContext.stop(); + this.innerAudioContext.src = url; + this.innerAudioContext.play(); + messageItem.isPlay = true; + this.innerAudioContext.onEnded(() => { + messageItem.isPlay = false; + this.setData({ + messageList, + }); + }); + this.innerAudioContext.onStop(() => { + messageItem.isPlay = false; + this.setData({ + messageList, + }); + }); + this.setData({ + messageList, + }); + } + }, + handleAdl() { + wx.showToast({ + title: '患者点击此按钮可进入ADL测评页面', + icon: 'none', + }); + }, + handleReferral() { + wx.showModal({ + title: '', + content: '您将给患者发送复诊时间填写卡片?', + confirmText: '发送', + confirmColor: '#62bed0', + success: (res) => { + if (res.confirm) { + wx.ajax({ + method: 'POST', + url: '?r=zd/doctor/message-interact/send-re-visit', + data: { + patientId: this.data.patientId, + }, + }).then(() => { + this.setData({ + messageList: [ + ...this.data.messageList, + { + msgId: '', + msgContentType: '8', + msgVisitTime: '', + msgContent: '', + msgFromType: '2', + msgCreateTime: dayjs().format('YYYY-MM-DD HH:mm:ss'), + }, + ], + }); + this.handleView(); + }); + } + }, + }); + }, +}); diff --git a/src/pages/d_interactiveDoctor/index.wxml b/src/pages/d_interactiveDoctor/index.wxml new file mode 100644 index 0000000..b27b4a0 --- /dev/null +++ b/src/pages/d_interactiveDoctor/index.wxml @@ -0,0 +1,293 @@ + + + + + + + + {{patientDetail.patientName}} + + 提醒补充真实姓名 + + + + 患者档案 + + + + + + {{tag}} + + + + + + + 最近一次测评:{{patientDetail.LastAdlTimeName}} + + + + + 最新ADL评分 + {{patientDetail.AdlScore}} + + + + 已达标 + + + + + {{patientDetail.TotalScoreChange}} + + + + + + 接近达标 + + + + + {{patientDetail.TotalScoreChange}} + + + + + + 待达标 + + + + + {{patientDetail.TotalScoreChange}} + + + + + 最新激素用量 + {{patientDetail.SteroidDailyDose}}mg + + + + 已达标 + + + + + {{patientDetail.SteroidDailyDoseChange}}mg + + + + + + 待达标 + + + + + {{patientDetail.SteroidDailyDoseChange}}mg + + + + + + + + + + + {{message.msgCreateTimeName}} + + + + + + {{message.msgContent}} + + 我最近一次复诊时间是{{message.ReVisitInfo.visitDateName}} + 我的方案是 + + 1.激素 + 2.传统免疫抑制剂(如他克莫司、吗 替麦考酚酯等) + 3.静脉输注丙种球蛋白 + 4.血浆置换 + 5.B细胞抑制剂(如:利妥昔单抗、泰 它西普、伊奈利珠单抗) + 6.FcRn拮抗剂(如:艾加莫德) + 7.C5补体抑制剂(如:依库珠单抗) + 8.中药或中成药 + 9.其他 + + + + + + + + {{message.welcomeMsg.title}} + {{message.welcomeMsg.questionDes}} + + + {{index+1}} + {{item.question}} + + + + {{message.welcomeMsg.guideClick}} + + + + {{message.msgContent}} + + 以下是我的出诊时间 + + {{message.msgVisitTime}} + + + {{week[item.weekday-1]}} + {{timeDay[item.timeType]}} + + + + + + + ADL+激素双达标 + 点击进入ADL + 建议您定期做ADL测评 + + + {{message.msgContent[0].duration}}'' + + + + + {{message.msgContent}} + 提交您的真实姓名 + + + {{message.msgContent}} + 完善个人信息 + + + + 您最近有按照医生的 提醒,定期复诊吗? + + + + 已复诊 + + + + + + + + + + + + + 发送消息 + + + 完善个人信息 + + + + 我的出诊时间 + + + + 复诊提醒 + + + + + + + 发送消息 + + + {{item.word}} + + + 发送 + + diff --git a/src/pages/d_patientDetail/index.json b/src/pages/d_patientDetail/index.json new file mode 100644 index 0000000..466dd2c --- /dev/null +++ b/src/pages/d_patientDetail/index.json @@ -0,0 +1,10 @@ +{ + "navigationStyle": "custom", + "usingComponents": { + "zd-navBar": "/components/zd-navBar/navBar", + "van-icon": "@vant/weapp/icon/index", + "van-popup": "@vant/weapp/popup/index", + "ec-canvas": "/components/ec-canvas/ec-canvas", + "toast": "/components/toast/index" + } +} diff --git a/src/pages/d_patientDetail/index.scss b/src/pages/d_patientDetail/index.scss new file mode 100644 index 0000000..655a40b --- /dev/null +++ b/src/pages/d_patientDetail/index.scss @@ -0,0 +1,884 @@ +page { + background-color: rgba(242, 244, 245, 1); + padding-bottom: calc(140rpx + env(safe-area-inset-bottom)); +} +.page { + width: 100vw; + overflow-x: hidden; + min-height: 100vh; + .banner { + margin: 40rpx 30rpx 32rpx; + padding: 36rpx 20rpx; + background: #ffffff; + border-radius: 24rpx 24rpx 24rpx 24rpx; + position: relative; + .watermark { + position: absolute; + top: 80rpx; + z-index: 2; + font-size: 36rpx; + line-height: 58rpx; + color: rgba(0, 0, 0, 0.05); + transform: rotate(-12deg); + text-align: center; + .p { + white-space: wrap; + } + } + .banner-container { + .user { + display: flex; + .avatar { + .avatar-img { + width: 100rpx; + height: 100rpx; + border-radius: 50%; + } + } + .wrap { + padding-left: 20rpx; + .w-header { + display: flex; + align-items: center; + flex-wrap: wrap; + gap: 8rpx; + .name { + font-size: 32rpx; + color: rgba(40, 48, 49, 1); + font-weight: bold; + } + .icon { + width: 32rpx; + height: 32rpx; + } + .tel { + position: relative; + z-index: 3; + font-size: 32rpx; + color: rgba(154, 161, 162, 1); + display: flex; + align-items: center; + .tel-icon { + margin-left: 10rpx; + width: 32rpx; + height: 32rpx; + } + } + .send { + margin-left: 32rpx; + width: 92rpx; + height: 32rpx; + font-size: 22rpx; + color: rgba(103, 186, 202, 1); + text-align: center; + border: 1px solid #67baca; + border-radius: 58rpx 58rpx 58rpx 58rpx; + } + } + .w-tags { + margin-top: 28rpx; + display: flex; + flex-wrap: wrap; + align-items: center; + gap: 12rpx; + .label { + width: 164rpx; + height: 40rpx; + } + .tag { + padding: 6rpx 16rpx; + font-size: 24rpx; + line-height: 28rpx; + color: rgba(103, 113, 114, 1); + background-color: rgba(242, 244, 245, 1); + border-radius: 8rpx; + } + } + } + } + .adl { + margin-top: 32rpx; + background: #ffffff; + box-shadow: 0rpx 8rpx 32rpx 0rpx rgba(40, 48, 49, 0.04); + border-radius: 24rpx 24rpx 24rpx 24rpx; + border: 2rpx solid #f8f9f9; + .a-header { + display: flex; + align-items: flex-start; + flex-direction: column; + .content { + position: relative; + .sub-content1 { + position: relative; + z-index: 1; + border-radius: 24rpx 0 24rpx 0; + padding: 14rpx 28rpx; + font-size: 28rpx; + color: rgba(98, 190, 208, 1); + background-color: rgba(242, 248, 249, 1); + } + .sub-content2 { + position: absolute; + right: 20rpx; + top: 0; + transform: translateX(100%); + border-radius: 0 0 24rpx 0; + padding: 14rpx 28rpx 14rpx 40rpx; + font-size: 28rpx; + color: #e59a29; + background-color: #fff5df; + } + } + .box { + width: 40rpx; + height: 40rpx; + background-color: rgba(242, 248, 249, 1); + } + } + .a-content { + position: relative; + z-index: 1; + margin-top: -40rpx; + padding: 32rpx 30rpx; + background-color: #fff; + border-radius: 24rpx; + .row { + display: flex; + align-items: center; + gap: 20rpx; + &:first-of-type { + margin-bottom: 24rpx; + } + .label { + flex-shrink: 0; + font-size: 28rpx; + color: rgba(154, 161, 162, 1); + width: 6em; + } + .num { + min-width: 3em; + font-size: 28rpx; + color: rgba(40, 48, 49, 1); + } + .tag { + display: flex; + align-items: center; + background-color: rgba(232, 245, 248, 1); + border-radius: 12rpx; + .t-label { + padding: 8rpx 12rpx; + font-size: 24rpx; + color: rgba(255, 255, 255, 1); + background-color: rgba(103, 186, 202, 1); + border-radius: 12rpx; + display: flex; + align-items: center; + gap: 8rpx; + flex-shrink: 0; + .icon { + width: 24rpx; + height: 24rpx; + } + } + .t-content { + padding: 0 16rpx 0 8rpx; + display: flex; + align-items: center; + font-size: 28rpx; + color: rgba(103, 186, 202, 1); + display: flex; + align-items: center; + gap: 4rpx; + flex-shrink: 0; + .icon { + width: 24rpx; + height: 28rpx; + } + } + &.tag-warn { + background-color: rgba(227, 220, 64, 0.1); + .t-label { + background-color: rgba(225, 217, 45, 1); + } + .t-content { + color: rgba(225, 217, 45, 1); + } + } + &.tag-error { + background-color: rgba(248, 234, 234, 1); + .t-label { + background-color: rgba(215, 108, 108, 1); + } + .t-content { + color: rgba(215, 108, 108, 1); + } + } + } + } + .d-row { + margin-top: 22rpx; + display: flex; + gap: 20rpx; + .label { + flex-shrink: 0; + width: 6em; + font-size: 28rpx; + color: rgba(154, 161, 162, 1); + } + .content { + min-width: 3em; + font-size: 28rpx; + color: rgba(40, 48, 49, 1); + } + } + } + } + .info-card { + position: relative; + margin-top: 16rpx; + padding: 32rpx 30rpx; + border-radius: 24rpx; + box-shadow: 0rpx 8rpx 32rpx 0rpx rgba(40, 48, 49, 0.04); + border: 2rpx solid #f8f9f9; + background-color: #fff; + display: grid; + gap: 32rpx 22rpx; + grid-template-columns: repeat(auto-fit, minmax(40%, 1fr)); + .ic-item { + display: flex; + .label { + font-size: 28rpx; + color: #9aa1a2; + white-space: nowrap; + } + .content { + font-size: 28rpx; + color: #283031; + white-space: nowrap; + } + } + .edit { + position: absolute; + bottom: 0; + right: 0; + padding: 6rpx 18rpx; + display: flex; + align-items: center; + font-size: 28rpx; + color: #fff; + border-radius: 32rpx 0 24rpx 0; + background-color: #67baca; + .icon { + width: 32rpx; + height: 32rpx; + } + } + } + .b-footer { + margin: 32rpx auto 0; + display: flex; + align-items: center; + justify-content: center; + .send { + margin: 0 42rpx; + width: 200rpx; + height: 60rpx; + font-size: 32rpx; + color: rgba(98, 190, 208, 1); + display: flex; + align-items: center; + justify-content: center; + background: #ffffff; + border-radius: 64rpx 64rpx 64rpx 64rpx; + border: 2rpx solid #62bed0; + } + .remark { + width: 200rpx; + height: 60rpx; + font-size: 32rpx; + color: rgba(98, 190, 208, 1); + display: flex; + align-items: center; + justify-content: center; + background: #ffffff; + border-radius: 64rpx 64rpx 64rpx 64rpx; + border: 2rpx solid #62bed0; + } + } + } + } + + .chart-container { + margin: 30rpx; + padding: 30rpx; + border-radius: 24rpx; + background-color: #fff; + position: relative; + .watermark { + position: absolute; + top: 80rpx; + z-index: 2; + font-size: 36rpx; + line-height: 58rpx; + color: rgba(0, 0, 0, 0.05); + transform: rotate(-12deg); + text-align: center; + .p { + max-width: 90vw; + white-space: wrap; + } + } + .container { + .c-nav { + position: relative; + z-index: 3; + display: flex; + padding: 8rpx; + border-radius: 98rpx; + background-color: #f2f4f5; + .nav-item { + flex: 1; + padding: 12rpx; + font-size: 32rpx; + color: #677172; + text-align: center; + &.active { + color: #fff; + border-radius: 62rpx; + background-color: #62bed0; + } + } + } + .filter { + position: relative; + z-index: 3; + margin-top: 32rpx; + display: flex; + gap: 16rpx; + align-items: center; + border-radius: 80rpx 80rpx 80rpx 80rpx; + .type { + padding: 10rpx 32rpx; + display: flex; + align-items: center; + justify-content: center; + font-size: 28rpx; + color: rgba(103, 113, 114, 1); + background-color: rgba(242, 244, 245, 1); + border-radius: 34rpx; + .icon { + width: 24rpx; + height: 24rpx; + } + } + .range { + padding: 10rpx 32rpx; + display: flex; + align-items: center; + font-size: 28rpx; + color: rgba(103, 113, 114, 1); + border-radius: 34rpx; + background-color: rgba(242, 244, 245, 1); + .icon { + width: 24rpx; + height: 24rpx; + } + } + } + .card { + margin: 32rpx 0 0; + padding: 20rpx; + background: #ffffff; + box-shadow: 0rpx 8rpx 32rpx 0rpx rgba(40, 48, 49, 0.04); + border-radius: 24rpx 24rpx 24rpx 24rpx; + border: 2rpx solid #f8f9f9; + .pie { + height: 376rpx; + } + .line { + border-top: 1px dashed rgba(242, 244, 245, 1); + } + .w-header { + padding-top: 32rpx; + display: flex; + justify-content: space-between; + .title { + font-size: 32rpx; + color: #484848; + } + .legend { + display: flex; + align-items: center; + gap: 25rpx; + .item { + font-size: 20rpx; + color: #4f4f4f; + display: flex; + align-items: center; + .logo { + margin-right: 8rpx; + width: 16rpx; + height: 16rpx; + border-radius: 50%; + background-color: #cf5375; + &.hormone { + background-color: #3192a1; + } + } + .icon { + margin-right: 8rpx; + width: 17rpx; + height: 24rpx; + } + } + } + } + .column { + height: 400rpx; + } + } + .module { + margin-top: 30rpx; + .module-header { + display: flex; + .date { + flex-shrink: 0; + font-size: 24rpx; + color: #333333; + } + .tags { + margin-left: 14rpx; + flex: 1; + display: flex; + flex-wrap: nowrap; + overflow-x: scroll; + white-space: nowrap; + &::-webkit-scrollbar { + display: none; + } + .tag1 { + margin-left: 14rpx; + padding: 0 12rpx; + background: #d86687; + border-radius: 6rpx; + font-size: 24rpx; + line-height: 36rpx; + text-align: center; + color: #ffffff; + } + .tag2 { + margin-left: 14rpx; + padding: 0 12rpx; + background: #0b184f; + border-radius: 6rpx; + font-size: 24rpx; + line-height: 36rpx; + text-align: center; + color: #ffffff; + } + .tag3 { + margin-left: 14rpx; + padding: 0 12rpx; + background: #24d8c8; + border-radius: 6rpx; + font-size: 24rpx; + line-height: 36rpx; + text-align: center; + color: #ffffff; + } + } + } + .module-container { + margin-top: 24rpx; + display: flex; + .aside { + margin-right: 30rpx; + padding-left: 14rpx; + border-right: 1px dashed #dddddd; + } + .m-card { + flex: 1; + box-shadow: 0 4rpx 29rpx 0rpx rgba(207, 83, 116, 0.25); + border-radius: 24rpx; + .card-header { + padding: 20rpx 18rpx 4rpx 48rpx; + border-radius: 24rpx 24rpx 0 0; + display: flex; + align-items: center; + justify-content: space-between; + box-shadow: 8rpx 8rpx 16rpx 0rpx rgba(143, 217, 226, 0.1); + &.grade1 { + background: linear-gradient(90deg, #26dac9 7%, rgba(143, 217, 226, 0) 70%, rgba(143, 217, 226, 0) 100%); + } + &.grade2 { + background: linear-gradient( + 90deg, + rgba(235, 111, 87, 1) 7%, + rgba(143, 217, 226, 0) 70%, + rgba(143, 217, 226, 0) 100% + ); + } + &.grade3 { + background: linear-gradient( + 90deg, + rgba(207, 83, 117, 1) 7%, + rgba(143, 217, 226, 0) 70%, + rgba(143, 217, 226, 0) 100% + ); + } + .num { + display: flex; + align-items: baseline; + font-size: 96rpx; + line-height: 1; + color: #ffffff; + letter-spacing: 4rpx; + .sub { + font-size: 24rpx; + color: #fff; + } + } + .num-detail { + display: flex; + .n-item { + width: 73rpx; + &.active { + .box { + background-color: #cf5375; + } + } + .box { + width: 45rpx; + height: 45rpx; + width: 45rpx; + height: 45rpx; + font-size: 32rpx; + color: #fff; + text-align: center; + line-height: 45rpx; + background: #333333; + border-radius: 12rpx 12rpx 12rpx 12rpx; + } + .name { + font-size: 24rpx; + line-height: 48rpx; + color: rgba(51, 51, 51, 0.5); + } + } + } + .status { + font-size: 24rpx; + color: #989898; + text-align: right; + .s-num { + font-size: 32rpx; + } + .s-core { + font-size: 24rpx; + color: #989898; + // background: #484848; + border-radius: 6rpx; + } + } + } + .card-container { + padding: 8rpx 23rpx 20rpx; + border-radius: 0 0 24rpx 24rpx; + background-color: #fff; + .cc-title { + text-indent: 22rpx; + font-size: 24rpx; + color: rgba(79, 79, 79, 1); + } + .cc-content { + margin-top: 12rpx; + padding: 16rpx 20rpx; + border-radius: 24rpx; + background-color: rgba(249, 249, 249, 1); + .line { + font-size: 24rpx; + color: #666666; + line-height: 36rpx; + .dot { + color: #666666; + font-weight: bold; + } + .red { + color: #cf5375; + } + .green { + color: #25d9c8; + } + } + } + .fold { + margin-top: 16rpx; + .fold-header { + display: flex; + justify-content: flex-end; + font-size: 24rpx; + color: rgba(204, 204, 204, 1); + } + .fold-container { + padding-top: 10rpx; + height: 500rpx; + overflow: hidden; + transition: all 0.5s; + &.hide { + padding: 0; + height: 0; + } + .fold-img { + width: 100%; + } + .scurt { + width: 100%; + border: 1px solid rgba(0, 0, 0, 0.1); + box-sizing: border-box; + .s-header { + display: flex; + height: 40rpx; + margin-bottom: -1px; + border-bottom: 1rpx solid rgba(0, 0, 0, 0.1); + .none { + flex-shrink: 0; + width: 226rpx; + background-color: rgba(228, 228, 228, 1); + } + .bar { + flex: 1; + display: flex; + .num { + flex: 1; + text-align: center; + font-size: 24rpx; + color: #fff; + line-height: 40rpx; + } + } + } + .s-body { + display: flex; + .s-aside { + width: 28rpx; + background-color: rgba(102, 102, 102, 0.15); + flex-shrink: 0; + .sa-item { + display: flex; + text-align: center; + justify-content: center; + align-items: center; + font-size: 18rpx; + color: rgba(102, 102, 102, 1); + line-height: 1; + overflow: hidden; + &:not(:last-of-type) { + margin-bottom: -1px; + border-bottom: 1px solid rgba(0, 0, 0, 0.1); + } + } + .sa-item1 { + height: 158rpx; + } + .sa-item2 { + height: 54rpx; + } + .sa-item3 { + height: 106rpx; + } + .sa-item4 { + height: 108rpx; + } + } + .s-container { + flex: 1; + .sc-row { + display: flex; + height: 54rpx; + overflow: hidden; + .sc-title { + width: 198rpx; + font-size: 18rpx; + color: rgba(102, 102, 102, 1); + text-align: center; + line-height: 53rpx; + } + .sc-col { + margin-left: -1px; + border-left: 1px solid rgba(0, 0, 0, 0.1); + flex: 1; + text-align: center; + .icon { + margin-top: 11rpx; + width: 32rpx; + height: 32rpx; + } + } + } + .sc-row:not(:last-of-type) { + margin-bottom: -1px; + border-bottom: 1px solid rgba(0, 0, 0, 0.1); + } + .sc-row:nth-of-type(2n-1) { + background-color: rgba(217, 217, 217, 0.2); + } + } + } + } + } + } + } + } + .drug-card { + margin-top: 30rpx; + flex: 1; + box-shadow: 0 4rpx 29rpx 0rpx rgba(207, 83, 116, 0.25); + border-radius: 24rpx; + .d-header { + border-radius: 24rpx 0 0 0; + padding: 20rpx 50rpx; + display: flex; + align-items: center; + justify-content: space-between; + background: linear-gradient(95deg, #26dac9 7%, rgba(143, 217, 226, 0) 100%); + .name { + font-size: 28rpx; + color: #ffffff; + } + .status { + font-size: 22rpx; + color: #5b6363; + .num { + font-size: 22rpx; + color: #cf5375; + } + } + } + .content { + padding: 20rpx 50rpx; + font-size: 22rpx; + color: #666666; + } + } + } + } + } + } +} + +.popup-remark { + padding: 32rpx 30rpx 84rpx; + .title { + display: flex; + justify-content: center; + font-size: 36rpx; + color: rgba(40, 48, 49, 1); + font-weight: bold; + } + .textarea { + padding: 30rpx; + margin-top: 32rpx; + width: 100%; + height: 216rpx; + box-sizing: border-box; + background: #f7f8f9; + border-radius: 24rpx 24rpx 24rpx 24rpx; + border: 2rpx solid #f8f9f9; + font-size: 32rx; + } + .submit { + margin-top: 32rpx; + height: 84rpx; + display: flex; + justify-content: center; + align-items: center; + background: #67baca; + font-size: 36rpx; + color: #fff; + border-radius: 64rpx 64rpx 64rpx 64rpx; + } +} +.popup-edit { + width: 650rpx; + background-color: #fff; + .title { + padding-top: 46rpx; + font-size: 40rpx; + color: #283031; + font-weight: bold; + text-align: center; + } + .popup-container { + padding: 0 32rpx 32rpx; + min-height: 20vh; + max-height: 50vh; + overflow-y: auto; + .row { + margin-top: 48rpx; + .row-header { + display: flex; + align-items: center; + justify-content: space-between; + .label { + font-size: 32rpx; + color: #283031; + font-weight: bold; + } + .change-phone { + font-size: 32rpx; + color: #cf5375; + } + } + .row-content { + padding-top: 24rpx; + .radio-btns { + display: grid; + grid-template-columns: repeat(2, 1fr); + gap: 22rpx; + .btn { + padding: 18rpx 24rpx; + font-size: 32rpx; + color: #677172; + text-align: center; + line-height: 40rpx; + background: #f7f8f9; + border-radius: 12rpx 12rpx 12rpx 12rpx; + &.active { + color: #fff; + background-color: #67baca; + } + } + } + } + } + } + .popup-footer { + box-shadow: 0rpx 4rpx 32rpx 0rpx rgba(0, 0, 0, 0.15); + padding: 32rpx; + display: flex; + align-items: center; + justify-content: space-between; + gap: 18rpx; + .cancel { + flex: 1; + height: 74rpx; + border-radius: 98rpx 98rpx 98rpx 98rpx; + border: 1px solid #67baca; + font-size: 36rpx; + line-height: 74rpx; + color: #67baca; + text-align: center; + } + .conform { + flex: 1; + height: 74rpx; + border-radius: 98rpx 98rpx 98rpx 98rpx; + border: 1px solid #67baca; + background-color: #67baca; + font-size: 36rpx; + line-height: 74rpx; + color: #fff; + text-align: center; + } + } +} diff --git a/src/pages/d_patientDetail/index.ts b/src/pages/d_patientDetail/index.ts new file mode 100644 index 0000000..30a6ffc --- /dev/null +++ b/src/pages/d_patientDetail/index.ts @@ -0,0 +1,1075 @@ +import dayjs from 'dayjs'; + +const app = getApp(); + +let echarts: any = null; +Page({ + data: { + toastShow: false, + toastType: 'patientDetailSafeDoctor', + toastParams: {} as any, + + showTel: false, + + doctor: {}, + hospital: {}, + + id: '', + remark: '', + detail: {} as any, + ec: { + lazyLoad: true, + }, + fields: { + 1: 'day', + 2: 'month', + 3: 'year', + }, + + StartDate: '', + EndDate: '', + typeRange: [ + { + id: '1', + value: '按天', + }, + { + id: '2', + value: '按月', + }, + { + id: '3', + value: '按年', + }, + ], + type: '3', + typeName: '按年', + userInfo: {}, + + popupRemarkShow: false, + remarkFocus: false, + + popupEditShow: false, + + antibodyTypeRangeList: [ + { + id: '1', + value: 'AchR', + }, + { + id: '2', + value: 'MuSK', + }, + { + id: '3', + value: 'LRP4', + }, + { + id: '4', + value: 'RyR', + }, + ], + thyroidAbnormalRangeList: [ + { + id: '1', + value: '是', + }, + { + id: '2', + value: '否', + }, + ], + previousConvulsionRangeList: [ + { + id: '1', + value: '是', + }, + { + id: '2', + value: '否', + }, + ], + traditionalImmunosuppressantRangeList: [ + { + id: '1', + value: '他克莫司', + }, + { + id: '2', + value: '硫唑嘌呤', + }, + { + id: '3', + value: '吗替麦考酚酯', + }, + { + id: '4', + value: '其它', + }, + ], + medicalInsuranceTypeRangeList: [ + { + id: '1', + value: '城市职工', + }, + { + id: '2', + value: '城市居民', + }, + { + id: '3', + value: '新农合', + }, + ], + + nav: '0', + + adlList: [] as any, + tableData: [ + { + title: '说话', + key: 'TalkingScore', + }, + { + title: '咀嚼', + key: 'ChewScore', + }, + { + title: '吞咽', + key: 'SwallowScore', + }, + { + title: '呼吸', + key: 'BreathScore', + }, + { + title: '刷牙梳头能力受损', + key: 'BrushTeethAndCombHairScore', + }, + { + title: '从椅子上起身能力受损', + key: 'GetUpFromChairScore', + }, + { + title: '复视/重影', + key: 'DoubleVisionScore', + }, + { + title: '眼睑下垂', + key: 'DroopyEyelidsScore', + }, + ], + + pagination: { + page: 1, + pages: 1, + count: 1, + }, + }, + ecDataTrendComponent1: null as any, + ecDataTrendComponent2: null as any, + ecDataTrendComponent3: null as any, + ecDataTrendComponent4: null as any, + async onLoad(option) { + this.setData({ + id: option.id, + }); + echarts = await require.async('../../gift/compontnts/echart/echarts.js'); + this.ecDataTrendComponent1 = this.selectComponent('#chart1'); + this.ecDataTrendComponent2 = this.selectComponent('#chart2'); + this.ecDataTrendComponent3 = this.selectComponent('#chart3'); + this.ecDataTrendComponent4 = this.selectComponent('#chart4'); + + app.waitLogin({ type: [2] }).then(async (_res) => { + app.zdMpBehavior({ doctor: true, PageName: 'PG_DOCTORPATIENTDETAIL' }); + this.getDoctorDetail(); + await this.getDetail(); + this.handleNav({ currentTarget: { dataset: { index: '0' } } }, false); + }); + }, + getDoctorDetail() { + wx.ajax({ + method: 'GET', + url: '?r=zd/doctor/account/info', + data: {}, + }).then((res) => { + this.setData({ + doctor: res.doctor, + hospital: res.hospital, + toastShow: true, + toastType: 'patientDetailSafeDoctor', + toastParams: { + Name: res.doctor.Name, + HospitalName: res.hospital.Name, + }, + }); + }); + }, + getDetail() { + return wx + .ajax({ + method: 'GET', + url: '?r=zd/doctor/patient/info', + data: { patientId: this.data.id }, + }) + .then((res) => { + if (res.LastAdlTime) { + res.LastAdlTimeName = dayjs(res.LastAdlTime).from(dayjs().format('YYYY-MM-DD')).replace(' ', ''); + } + if (res.LastUseDrugsTime) { + res.LastUseDrugsTimeName = + dayjs().format('YYYY-MM-DD') === res.LastUseDrugsTime + ? '' + : dayjs(res.LastUseDrugsTime).from(dayjs().format('YYYY-MM-DD')).replace(' ', ''); + } + this.setData({ + detail: { + ...res, + hideName: res.Name.replace(/^(.)(.*)$/, (_, first, rest) => first + '*'.repeat(rest.length)), + }, + }); + }); + }, + handleTypeChange(e) { + const index = e.detail.value; + const { typeRange, nav } = this.data; + const type = typeRange[index].id; + const typeName = typeRange[index].value; + let EndDate = ''; + let StartDate = ''; + if (type === '1') { + EndDate = dayjs().format('YYYY-MM-DD'); + StartDate = dayjs().subtract(6, 'd').format('YYYY-MM-DD'); + } else if (type === '2') { + EndDate = dayjs().format('YYYY-MM'); + StartDate = dayjs().subtract(1, 'M').format('YYYY-MM'); + } else if (type === '3') { + EndDate = dayjs().format('YYYY'); + StartDate = dayjs().subtract(1, 'y').format('YYYY'); + } + this.setData({ + type, + typeName, + EndDate, + StartDate, + }); + if (nav === '0') { + this.getGraph(); + } else { + this.getAdlList(); + } + }, + handleChange() { + const { nav } = this.data; + if (nav === '0') { + this.getGraph(); + } else { + this.getAdlList(); + } + }, + getGraph() { + wx.ajax({ + method: 'GET', + url: '?r=zd/doctor/patient/adl-graph', + data: { + patientId: this.data.id, + StartDate: this.data.StartDate, + EndDate: this.data.EndDate, + DateType: this.data.type, + count: 0, + }, + }).then(async (res) => { + this.initChart1(res.adlSummary); + this.initChart2(res.adlSummary); + + const medication = res.medication.map((item) => { + return { + Date: item.InjectionDate, + ...item, + }; + }); + const list = res.list; + const newList: any[] = this.mergeArr(list, medication); + const chart3 = await this.initChart3(newList as never[]); + const chart4 = await this.initChart4(newList as never[]); + echarts.connect([chart3, chart4]); + }); + }, + mergeArr(array1: any[] = [], array2: any[] = []) { + // 合并两个数组中相同Date字段的对象 + const mergedArray: any[] = []; + const mergedMap = new Map(); + + array1.concat(array2).forEach((obj) => { + const date = obj.Date; + if (mergedMap.has(date)) { + mergedMap.get(date).push(obj); + } else { + mergedMap.set(date, [obj]); + } + }); + + mergedMap.forEach((objs: any) => { + if (objs.length === 1) { + mergedArray.push(objs[0]); + } else { + const mergedObj = objs.reduce((acc, cur) => ({ ...acc, ...cur })); + mergedArray.push(mergedObj); + } + }); + + // 按照Date字段对合并后的数组进行排序 + mergedArray.sort((a, b) => { + return a.Date.localeCompare(b.Date); + }); + return mergedArray; + }, + initChart1(adlSummary = {}) { + this.ecDataTrendComponent1.init((canvas, width, height, dpr) => { + const chart = echarts.init(canvas, null, { + width, + height, + devicePixelRatio: dpr, // new + }); + canvas.setChart(chart); + + const option = { + tooltip: { + trigger: 'item', + formatter: '{b} \n {c}次,{d}%', + }, + legend: { + show: false, + }, + color: ['rgba(226, 219, 65, 1)', 'rgba(215, 108, 108, 1)', 'rgba(98, 190, 208, 1)'], + series: [ + { + name: '全部患者', + type: 'pie', + radius: ['40%', '60%'], + center: ['50%', '50%'], + label: { + show: true, + width: 80, + alignTo: 'edge', + minMargin: 5, + edgeDistance: 10, + lineHeight: 15, + formatter: '{b} \n{time|{d}%}', + rich: { + time: { + fontSize: 10, + color: '#999', + }, + }, + }, + labelLine: { + length: 15, + length2: 0, + maxSurfaceAngle: 80, + }, + labelLayout(params) { + const isLeft = params.labelRect.x < chart.getWidth() / 2; + const points = params.labelLinePoints; + // Update the end point. + points[2][0] = isLeft ? params.labelRect.x : params.labelRect.x + params.labelRect.width; + return { + labelLinePoints: points, + }; + }, + data: [ + { value: adlSummary.adlNearNum, name: 'ADL接近达标' }, + { value: adlSummary.adlUnStandardNum, name: 'ADL未达标' }, + { value: adlSummary.adlStandardNum, name: 'ADL达标' }, + ], + emphasis: { + itemStyle: { + shadowBlur: 10, + shadowOffsetX: 0, + shadowColor: 'rgba(0, 0, 0, 0.5)', + }, + }, + }, + ], + }; + + chart.setOption(option); + return chart; + }); + }, + initChart2(adlSummary = {}) { + this.ecDataTrendComponent2.init((canvas, width, height, dpr) => { + const chart = echarts.init(canvas, null, { + width, + height, + devicePixelRatio: dpr, // new + }); + canvas.setChart(chart); + + const option = { + tooltip: { + trigger: 'item', + formatter: '{b} \n {c}次,{d}%', + }, + legend: { + show: false, + }, + color: ['rgba(215, 108, 108, 1)', 'rgba(98, 190, 208, 1)'], + series: [ + { + name: '全部患者', + type: 'pie', + radius: ['40%', '60%'], + center: ['50%', '50%'], + label: { + show: true, + width: 80, + alignTo: 'edge', + minMargin: 5, + edgeDistance: 10, + lineHeight: 15, + formatter: '{b} \n{time|{d}%}', + rich: { + time: { + fontSize: 10, + color: '#999', + }, + }, + }, + labelLine: { + length: 15, + length2: 0, + maxSurfaceAngle: 80, + }, + labelLayout(params) { + const isLeft = params.labelRect.x < chart.getWidth() / 2; + const points = params.labelLinePoints; + // Update the end point. + points[2][0] = isLeft ? params.labelRect.x : params.labelRect.x + params.labelRect.width; + return { + labelLinePoints: points, + }; + }, + data: [ + { value: adlSummary.SteroidDailyDoseUnStandardNum, name: '激素未达标' }, + { value: adlSummary.SteroidDailyDoseStandardNum, name: '激素达标' }, + ], + emphasis: { + itemStyle: { + shadowBlur: 10, + shadowOffsetX: 0, + shadowColor: 'rgba(0, 0, 0, 0.5)', + }, + }, + }, + ], + }; + + chart.setOption(option); + return chart; + }); + }, + + initChart3(defaultList = []) { + const { userInfo } = this.data; + const list: any = defaultList; + return new Promise((reslove) => { + this.ecDataTrendComponent3.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: true, + inside: true, + length: 1, + alignWithLabel: true, + lineStyle: { + type: 'dotted', + color: '#D8D8D8', + width: 4, + cap: 'round', + }, + }, + axisLine: { + lineStyle: { + color: '#8C8C8C', + type: 'dashed', + }, + }, + data: list.map((item) => dayjs(item.Date).format('MM-DD')), + axisLabel: { + formatter() { + return ''; + }, + }, + }, + ], + yAxis: [ + { + type: 'value', + minInterval: 1, + }, + ], + series: [ + { + name: '总分', + data: list.length ? list.map((item) => item.TotalScore) : [25], + barWidth: '16', + label: { + show: true, + position: 'top', + color: '#CF5375', + }, + type: 'line', + symbol: 'circle', + symbolSize: 8, + showSymbol: list.length >= 1, + connectNulls: true, + z: 10, + itemStyle: { + color: '#CF5375', + }, + markLine: { + symbol: ['none', 'none'], + data: [ + { + name: '达标区(1分)', + yAxis: 1, + 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: 0, + }, + { + yAxis: 1, + }, + ], + ], + }, + }, + ], + dataZoom: { + type: 'inside', // 有type这个属性,滚动条在最下面,也可以不行,写y:36,这表示距离顶端36px,一般就是在图上面。 + startValue: list.length - 5, + endValue: list.length - 1, + filterMode: 'none', + }, + }; + + if (this.data.detail.UserType === 4) { + const markLineData = list + .filter((item) => item.InjectionBottles) + .map((item) => { + return { + name: '', + xAxis: dayjs(item.Date).format('MM-DD'), + lineStyle: { + color: 'rgba(37, 217, 200,0.5)', + cap: '', + type: 'solid', + }, + + label: { + formatter: '', + position: 'insideEndBottom', + rotate: 0, + color: '#25D9C8', + offset: [60, 0], + }, + }; + }); + option.series.push({ + name: '用药', + data: list.map((item) => (item.InjectionBottles ? 0 : null)), + type: 'line', + symbol: + 'image://data:image/png;base64,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', + symbolSize: [11, 16], + symbolOffset: [0, 0], + itemStyle: { + color: '#25D9C8', + }, + lineStyle: { + width: 0, + }, + tooltip: { + show: false, + }, + z: 11, + markLine: { + symbol: ['none', 'none'], + data: markLineData, + }, + }); + // option.series.push({ + // name: "用药时间", + // data: list.map((item: any) => (item.InjectionBottles ? item.TotalScore : 0)), + // type: "line", + // symbol: + // "image://data:image/png;base64,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", + // symbolSize: [11, 16], + // symbolOffset: [0, "100%"], + // itemStyle: { + // color: "#25D9C8", + // }, + // tooltip: { + // show: false, + // }, + // lineStyle: { + // width: 0, + // }, + // z: 1, + // }); + } + + chart.setOption(option); + reslove(chart); + return chart; + }); + }); + }, + initChart4(defaultList = []) { + const { userInfo } = this.data; + const list: any = defaultList; + return new Promise((reslove) => { + this.ecDataTrendComponent4.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: true, + inside: true, + length: 1, + alignWithLabel: true, + lineStyle: { + type: 'dotted', + color: '#D8D8D8', + width: 4, + cap: 'round', + }, + }, + axisLine: { + lineStyle: { + color: '#8C8C8C', + type: 'dashed', + }, + }, + data: list.map((item) => dayjs(item.Date).format('MM-DD')), + }, + ], + yAxis: [ + { + type: 'value', + minInterval: 1, + max(value) { + return value.max + 20 > 999 ? 999 : value.max + 20; + }, + axisLabel: { + // width: 20, + formatter(value: number) { + return value; + }, + }, + }, + ], + series: [ + { + name: '激素用量', + data: list.length ? list.map((item) => item.SteroidDailyDose) : [20], + barWidth: '16', + type: 'line', + symbol: 'circle', + symbolSize: 8, + connectNulls: true, + showSymbol: list.length >= 1, + z: 10, + label: { + show: true, + position: 'top', + color: '#18474e', + z: 11, + formatter({ value }) { + return `${value}mg`; + }, + }, + itemStyle: { + color: '#3192A1', + }, + markLine: { + symbol: ['none', 'none'], + data: [ + { + name: '达标区(5mg)', + yAxis: 5, + label: { + formatter: '{b}', + position: 'insideMiddle', + color: '#24D8C8', + fontSize: '10', + }, + lineStyle: { + cap: '', + color: '#34D7C7', + type: 'dashed', + }, + }, + { + name: '20', + yAxis: 20, + label: { + formatter: '{b}', + position: 'start', + color: '#D76C6C', + distance: 8, + }, + lineStyle: { + cap: '', + color: '#D76C6C', + type: 'dashed', + }, + }, + ], + }, + markArea: { + itemStyle: { + color: 'rgba(37,217,200,0.19)', + }, + data: [ + [ + { + yAxis: 0, + }, + { + yAxis: 5, + }, + ], + ], + }, + }, + ], + dataZoom: { + type: 'inside', // 有type这个属性,滚动条在最下面,也可以不行,写y:36,这表示距离顶端36px,一般就是在图上面。 + startValue: list.length - 5, + endValue: list.length - 1, + filterMode: 'none', + }, + }; + if (this.data.detail.UserType === 4) { + const markLineData = list + .filter((item) => item.InjectionBottles) + .map((item) => { + return { + name: '', + xAxis: dayjs(item.Date).format('MM-DD'), + lineStyle: { + color: 'rgba(37, 217, 200,0.5)', + cap: '', + type: 'solid', + }, + label: { + formatter: '', + position: 'insideEndBottom', + rotate: 0, + color: '#25D9C8', + offset: [60, 0], + }, + }; + }); + const maxValue = Math.max(...list.map((item) => item.SteroidDailyDose)); + option.series.push({ + name: '用药', + data: list.map((item) => (item.InjectionBottles ? 0 : null)), + type: 'line', + symbol: + 'image://data:image/png;base64,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', + symbolSize: [11, 16], + symbolOffset: [0, 0], + itemStyle: { + color: '#25D9C8', + }, + lineStyle: { + width: 0, + }, + tooltip: { + show: false, + }, + z: 11, + markLine: { + symbol: ['none', 'none'], + data: markLineData, + }, + }); + // option.series.push({ + // name: "用药时间", + // data: list.map((item: any) => (item.InjectionBottles ? item.TotalScore : 0)), + // type: "line", + // symbol: + // "image://data:image/png;base64,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", + // symbolSize: [11, 16], + // symbolOffset: [0, "100%"], + // itemStyle: { + // color: "#25D9C8", + // }, + // tooltip: { + // show: false, + // }, + // lineStyle: { + // width: 0, + // }, + // z: 1, + // }); + } + + chart.setOption(option); + reslove(chart); + return chart; + }); + }); + }, + handleRemark() { + app.zdMpBehavior({ doctor: true, PageName: 'BTN_DOCTORPATIENTDETAILREMARK' }); + this.setData({ + popupRemarkShow: true, + remark: this.data.detail.DoctorRemark, + }); + setTimeout(() => { + this.setData({ + remarkFocus: true, + }); + }, 300); + }, + handleRemarkClose() { + this.setData({ + popupRemarkShow: false, + remarkFocus: false, + remark: '', + }); + }, + handleRemarkSubmit() { + if (!this.data.remark) { + wx.showToast({ + icon: 'none', + title: '请输入备注', + }); + } + wx.ajax({ + method: 'POST', + url: '?r=zd/doctor/patient/remark', + data: { + PatientId: this.data.id, + DoctorRemark: this.data.remark, + }, + }).then((_res) => { + this.handleRemarkClose(); + this.getDetail(); + }); + }, + + handleEditUser() { + app.zdMpBehavior({ doctor: true, PageName: 'BTN_DOCTORPATIENTDETAILEDIT' }); + this.setData({ + popupEditShow: true, + }); + }, + handleUserCancel() { + this.setData({ + popupEditShow: false, + }); + }, + handleUserSubmit() { + this.handleUserCancel(); + this.handlePatientUpdate(); + }, + handleRadio(e) { + const { id, key } = e.currentTarget.dataset; + this.setData({ + [`detail.${key}`]: id, + }); + }, + handlePatientUpdate() { + const { detail } = this.data; + wx.ajax({ + method: 'POST', + url: '?r=zd/doctor/patient/update', + data: { + PatientId: detail.PatientId, //患者Id + AntibodyType: detail.AntibodyType, //抗体类型 1:AChR 2:Musk 3:LRP4 4:RYR + ThyroidAbnormal: detail.ThyroidAbnormal, //胸腺异常 1:是 2:否 + PreviousConvulsion: detail.PreviousConvulsion, //既往发生危象 1:是 2:否 + TraditionalImmunosuppressant: detail.TraditionalImmunosuppressant, //传统免疫抑制剂 1:特克莫苏 2:硫唑嘌呤 3:马替麦考酚酯 4:其他 + MedicalInsuranceType: detail.MedicalInsuranceType, //医保类型 1:城市职工 2:城市居民 3:新农合 + }, + }).then(() => { + wx.showToast({ + icon: 'none', + title: '更新成功', + }); + this.getDetail(); + }); + }, + handleBack() { + wx.navigateBack(); + }, + handleSend() { + app.zdMpBehavior({ doctor: true, PageName: 'BTN_DOCTORPATIENTDETAILMESSAGE' }); + wx.navigateTo({ + url: `/pages/d_interactiveDoctor/index?patientId=${this.data.detail.PatientId}`, + }); + }, + + handleNav(e, mp = true) { + const { index } = e.currentTarget.dataset; + if (index == 0 && mp) { + app.zdMpBehavior({ doctor: true, PageName: 'BTN_DOCTORPATIENTDETAILREPORTGUIDE' }); + } + if (index == 1 && mp) { + app.zdMpBehavior({ doctor: true, PageName: 'BTN_DOCTORPATIENTDETAILNOTEGUIDE' }); + } + this.setData({ + nav: index, + }); + this.handleTypeChange({ detail: { value: '2' } }); + }, + getAdlList(newPage = 1) { + const { detail, EndDate, StartDate, type } = this.data; + wx.ajax({ + method: 'GET', + url: '?r=zd/doctor/patient/adl-list', + data: { + DateType: type, + PatientId: detail.PatientId, + StartDate, + EndDate, + page: newPage, + }, + }).then((res) => { + res.list.map((item) => { + let grade = 1; + if (item.TotalScore < 5) { + grade = 1; + } else if (item.TotalScore >= 5 && item.TotalScore < 15) { + grade = 2; + } else { + grade = 3; + } + item.grade = grade; + item.fold = false; + return item; + }); + + const adlList = res.page === 1 ? res.list : [...this.data.adlList, ...res.list]; + this.setData({ + adlList, + pagination: { + page: res.page, + pages: res.pages, + count: res.count, + }, + }); + }); + }, + onReachBottom() { + const { page, pages } = this.data.pagination; + const nav = this.data.nav; + if (pages > page && nav === '1') { + this.getAdlList(page + 1); + } + }, + handleFold(e) { + const { index } = e.currentTarget.dataset; + this.setData({ + [`adlList[${index}].fold`]: !this.data.adlList[index].fold, + }); + }, + handleAdlDetail() {}, + handleToastOk() { + this.setData({ + toastShow: false, + }); + }, + handleToastCancel() { + wx.navigateBack(); + }, + handleToggleTel() { + console.log(11111); + this.setData({ + showTel: !this.data.showTel, + }); + }, +}); diff --git a/src/pages/d_patientDetail/index.wxml b/src/pages/d_patientDetail/index.wxml new file mode 100644 index 0000000..c770edf --- /dev/null +++ b/src/pages/d_patientDetail/index.wxml @@ -0,0 +1,588 @@ + + + + + + 本页面内容涉及患者个人信息 + 仅用于{{hospital.Name}}{{doctor.Name}}医生进行患者随访管理 + 不可用于其他用途 + 【gMG给力加油站】 + + + + 双达标测评报告 + 双达标笔记 + + + + {{typeName}} + + + + + {{StartDate}} + + ~ + + {{EndDate}} + + + + + + + + + + + + + 备注 + + 保存 + + + + + + 编辑患者信息 + + + + 抗体类型 + + + + + {{item.value}} + + + + + + + 胸腺异常 + + + + + {{item.value}} + + + + + + + 既往发生危象 + + + + + {{item.value}} + + + + + + + 传统免疫抑制剂 + + + + + {{item.value}} + + + + + + + 医保类型 + + + + + {{item.value}} + + + + + + + 取消 + 保存 + + + + + diff --git a/src/pages/d_userInfo/index.json b/src/pages/d_userInfo/index.json new file mode 100644 index 0000000..931a721 --- /dev/null +++ b/src/pages/d_userInfo/index.json @@ -0,0 +1,8 @@ +{ + "navigationBarTitleText": "个人信息", + "navigationStyle": "default", + "usingComponents": { + "van-icon": "@vant/weapp/icon/index", + "van-popup": "@vant/weapp/popup/index" + } +} diff --git a/src/pages/d_userInfo/index.scss b/src/pages/d_userInfo/index.scss new file mode 100644 index 0000000..4088357 --- /dev/null +++ b/src/pages/d_userInfo/index.scss @@ -0,0 +1,214 @@ +page { + background: #f2f4f5; +} +.page { + padding: 164rpx 30rpx 40rpx; + .container { + position: relative; + padding: 92rpx 30rpx 64rpx; + background: #ffffff; + border-radius: 24rpx 24rpx 24rpx 24rpx; + .avatar { + position: absolute; + top: -90rpx; + left: 50%; + transform: translateX(-50%); + display: flex; + flex-direction: column; + align-items: center; + justify-content: center; + .avatar-user { + flex-shrink: 0; + width: 156rpx; + height: 156rpx; + border-radius: 50%; + } + .edit { + margin-top: -15rpx; + padding: 8rpx 24rpx; + background: #f2f4f5; + border-radius: 108rpx 108rpx 108rpx 108rpx; + font-size: 24rpx; + color: rgba(40, 48, 49, 1); + display: flex; + align-items: center; + line-height: 1; + .icon { + margin-right: 8rpx; + width: 24rpx; + height: 24rpx; + } + } + } + .row { + margin-top: 64rpx; + display: flex; + justify-content: space-between; + .label { + flex-shrink: 0; + font-size: 32rpx; + color: rgba(154, 161, 162, 1); + width: 6em; + } + .switch-row { + display: flex; + justify-content: flex-end; + .switch { + transform: scale(0.8); + } + } + .content { + flex: 1; + font-size: 32rpx; + color: rgba(40, 48, 49, 1); + } + .option { + flex-shrink: 0; + display: flex; + align-items: center; + .change { + font-size: 32rpx; + color: rgba(98, 190, 208, 1); + } + .icon { + color: #d4d9da; + } + } + } + } + .switch-btn { + margin: 64rpx 0; + font-size: 36rpx; + color: rgba(255, 255, 255, 1); + display: flex; + align-items: center; + justify-content: center; + height: 84rpx; + background: #67baca; + border-radius: 64rpx 64rpx 64rpx 64rpx; + } +} + +.popup-date { + padding: 32rpx 30rpx 84rpx; + .title { + display: flex; + justify-content: center; + font-size: 36rpx; + color: rgba(40, 48, 49, 1); + font-weight: bold; + } + .textarea { + padding: 30rpx; + margin-top: 32rpx; + width: 100%; + height: 180rpx; + box-sizing: border-box; + background: #f7f8f9; + border-radius: 24rpx 24rpx 24rpx 24rpx; + border: 2rpx solid #f8f9f9; + font-size: 32rx; + } + .week { + margin-top: 32rpx; + .w-row { + display: grid; + grid-template-columns: 156rpx repeat(2, 1fr); + background-color: rgba(242, 244, 245, 1); + &:nth-of-type(2n) { + background-color: rgba(247, 248, 249, 1); + } + &:not(:last-of-type) { + border-bottom: 1px solid #fff; + } + &:first-of-type { + border-radius: 24rpx 24rpx 0 0; + .name { + border-radius: 24rpx 0 0 0; + } + } + &:last-of-type { + border-radius: 0 0 24rpx 24rpx; + .name { + border-radius: 0 0 0 24rpx; + } + } + .name { + height: 76rpx; + font-size: 32rpx; + color: #fff; + display: flex; + align-items: center; + justify-content: center; + background-color: rgba(103, 186, 202, 1); + } + .item { + position: relative; + font-size: 32rpx; + color: rgba(103, 113, 114, 1); + display: flex; + align-items: center; + justify-content: center; + border-left: 1px solid #fff; + .icon { + position: absolute; + bottom: 0; + right: 0; + width: 32rpx; + height: 32rpx; + display: none; + } + &.active { + background-color: rgba(237, 252, 255, 1); + .icon { + display: block; + } + } + } + } + } + .submit { + margin-top: 32rpx; + height: 84rpx; + display: flex; + justify-content: center; + align-items: center; + background: #67baca; + font-size: 36rpx; + color: #fff; + border-radius: 64rpx 64rpx 64rpx 64rpx; + } +} + +.popup-brief { + padding: 32rpx 30rpx 84rpx; + .title { + display: flex; + justify-content: center; + font-size: 36rpx; + color: rgba(40, 48, 49, 1); + font-weight: bold; + } + .textarea { + padding: 30rpx; + margin-top: 32rpx; + width: 100%; + height: 280rpx; + box-sizing: border-box; + background: #f7f8f9; + border-radius: 24rpx 24rpx 24rpx 24rpx; + border: 2rpx solid #f8f9f9; + font-size: 32rx; + } + .submit { + margin-top: 32rpx; + height: 84rpx; + display: flex; + justify-content: center; + align-items: center; + background: #67baca; + font-size: 36rpx; + color: #fff; + border-radius: 64rpx 64rpx 64rpx 64rpx; + } +} diff --git a/src/pages/d_userInfo/index.ts b/src/pages/d_userInfo/index.ts new file mode 100644 index 0000000..5c92f2c --- /dev/null +++ b/src/pages/d_userInfo/index.ts @@ -0,0 +1,231 @@ +const app = getApp(); + +Page({ + data: { + doctor: {} as any, + hospital: {}, + popupDateShow: false, + popupDateFocus: false, + popupBriefShow: false, + popupBriefFocus: false, + ClinicList: [ + { + name: '周一', + weekday: 1, + timeTypeActive1: false, + timeTypeActive2: false, + }, + { + name: '周二', + weekday: 2, + timeTypeActive1: false, + timeTypeActive2: false, + }, + { + name: '周三', + weekday: 3, + timeTypeActive1: false, + timeTypeActive2: false, + }, + { + name: '周四', + weekday: 4, + timeTypeActive1: false, + timeTypeActive2: false, + }, + { + name: '周五', + weekday: 5, + timeTypeActive1: false, + timeTypeActive2: false, + }, + { + name: '周六', + weekday: 6, + timeTypeActive1: false, + timeTypeActive2: false, + }, + { + name: '周日', + weekday: 7, + timeTypeActive1: false, + timeTypeActive2: false, + }, + ], + PopupClinic: '', + }, + onLoad() {}, + onShow() { + app.waitLogin({ type: [2] }).then((_res) => { + app.zdMpBehavior({ doctor: true, PageName: 'PG_DOCTORPERSONALINFO' }); + this.getDetail(); + }); + }, + getDetail() { + wx.ajax({ + method: 'GET', + url: '?r=zd/doctor/account/info', + data: {}, + }).then((res) => { + const { ClinicList } = this.data; + + let weekName = ''; + if (res.doctor.ClinicType == 2) { + weekName = res.doctor.Clinic; + } else { + (res.doctor.Clinic ? res.doctor.Clinic : []).forEach((subItem: any) => { + if (subItem.timeType == 1) { + ClinicList[subItem.weekday - 1].timeTypeActive1 = true; + } + if (subItem.timeType == 2) { + ClinicList[subItem.weekday - 1].timeTypeActive2 = true; + } + }); + + weekName = (res.doctor.Clinic ? res.doctor.Clinic : []) + .map((subItem: { weekday: string | number; timeType: string | number }) => { + const week = ['周一', '周二', '周三', '周四', '周五', '周六', '周日']; + const timeDay = { 1: '上午', 2: '下午' }; + return `${week[Number(subItem.weekday) - 1]}${timeDay[subItem.timeType]}`; + }) + .join(','); + } + + this.setData({ + doctor: { + weekName, + ...res.doctor, + Telephone: res.doctor.Telephone.replace(/(\d{3})\d{4}(\d{4})/, '$1****$2'), + }, + hospital: res.hospital, + ClinicList, + }); + }); + }, + handleChangeClinicType(e) { + const value = e.detail.value; + if (value) { + this.setData({ + 'doctor.ClinicType': 2, + 'doctor.Clinic': '', + 'doctor.weekName': '', + }); + } else { + this.setData({ + 'doctor.ClinicType': 1, + 'doctor.Clinic': [], + 'doctor.weekName': '', + }); + } + this.handleWeekIntroduceSubmit(); + }, + handleChangePhone() { + app.zdMpBehavior({ doctor: true, PageName: 'BTN_DOCTORPERSONALINFOCHANGEPHONE' }); + wx.navigateTo({ + url: '/doctor/pages/d_changePhone/index', + }); + }, + handleWeek() { + const { doctor } = this.data; + this.setData({ + PopupClinic: Array.isArray(doctor.Clinic) ? '' : doctor.Clinic, + popupDateShow: true, + }); + setTimeout(() => { + this.setData({ + popupDateFocus: true, + }); + }, 300); + }, + handleWeekSelect(e) { + const { type, index } = e.currentTarget.dataset; + const ClinicList = this.data.ClinicList; + ClinicList[index][`timeTypeActive${type}`] = !ClinicList[index][`timeTypeActive${type}`]; + this.setData({ + ClinicList, + }); + }, + handleWeekIntroduceSubmit() { + const { doctor, PopupClinic } = this.data; + let Clinic = ''; + if (doctor.ClinicType == 2) { + Clinic = PopupClinic; + } else { + const ClinicList = this.data.ClinicList; + Clinic = ClinicList.reduce((pre, cur) => { + if (cur.timeTypeActive1) { + pre.push({ weekday: cur.weekday, timeType: 1 }); + } + if (cur.timeTypeActive2) { + pre.push({ weekday: cur.weekday, timeType: 2 }); + } + return pre; + }, [] as any); + } + wx.ajax({ + method: 'POST', + url: '?r=zd/doctor/account/update-info', + data: { + Introduce: this.data.doctor.Introduce, + Clinic, + ClinicType: doctor.ClinicType, + }, + }).then(() => { + this.onClose(); + }); + }, + handleBrief() { + this.setData({ + popupBriefShow: true, + }); + setTimeout(() => { + this.setData({ + popupBriefFocus: true, + }); + }, 300); + }, + handleBriefInput(e) { + const doctor = this.data.doctor; + doctor.Introduce = e.detail.value; + this.setData({ + doctor, + }); + }, + onClose() { + this.setData({ + popupDateShow: false, + popupBriefShow: false, + popupBriefFocus: false, + popupDateFocus: false, + }); + this.getDetail(); + }, + handleSwitch() { + app.zdMpBehavior({ doctor: true, PageName: 'BTN_DOCTORPERSONALINFOSWITCHACCOUNT' }); + wx.navigateTo({ + url: '/doctor/pages/d_changeDoctor/index', + }); + }, + handleLoginOut() { + wx.showModal({ + title: '确认退出?', + confirmColor: '#62bed0', + success: (res) => { + if (res.confirm) { + wx.ajax({ + method: 'POST', + url: '?r=zd/doctor/account/reg-logout', + data: {}, + }).then((_res) => { + app.globalData.loginType = 1; + app.globalData.anyWhere = true; + app.globalData.first = true; + wx.reLaunch({ + url: '/pages/login/index', + }); + }); + } + }, + }); + }, +}); diff --git a/src/pages/d_userInfo/index.wxml b/src/pages/d_userInfo/index.wxml new file mode 100644 index 0000000..6a1e4a3 --- /dev/null +++ b/src/pages/d_userInfo/index.wxml @@ -0,0 +1,121 @@ + + + + + + + + + + + 姓名 + {{doctor.Name}} + + + + 电话 + {{doctor.Telephone}} + 更换 + + + 医院 + {{hospital.Name}} + + + + 多院区出诊 + + + + + + 门诊时间 + {{doctor.weekName || '暂无'}} + + + + 个人简介 + {{doctor.Introduce || '暂无'}} + + + + + + + + + + + + + 门诊时间 + + + + {{item.name}} + + 上午 + + + + 下午 + + + + + 保存 + + + + + + 医生简介 + + 保存 + + diff --git a/src/pages/login/index.wxml b/src/pages/login/index.wxml index cfb7841..adb9d9e 100644 --- a/src/pages/login/index.wxml +++ b/src/pages/login/index.wxml @@ -26,10 +26,10 @@ 手机号验证码 - - - 我是患者 - + + + +