diff --git a/README.md b/README.md index e258d19..4558fdc 100644 --- a/README.md +++ b/README.md @@ -1195,4 +1195,7 @@ update `2024.8.7` fix -- 修复 心理量表选项起始数调整为0 \ No newline at end of file +- 修复 心理量表选项起始数调整为0 +`2024.8.21` +update +- 优化 周报汇总切换 diff --git a/package-lock.json b/package-lock.json index b1151ce..1602f5b 100644 --- a/package-lock.json +++ b/package-lock.json @@ -2250,87 +2250,6 @@ "webpack-chain": "^6.4.0", "webpack-dev-server": "^3.11.0", "webpack-merge": "^4.2.2" - }, - "dependencies": { - "ansi-styles": { - "version": "4.3.0", - "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-4.3.0.tgz", - "integrity": "sha512-zbB9rCJAT1rbjiVDb2hqKFHNYLxgtk8NURxZ3IZwD3F6NtxbXZQCnnSi1Lkx+IDohdPlFp222wVALIheZJQSEg==", - "dev": true, - "optional": true, - "requires": { - "color-convert": "^2.0.1" - } - }, - "chalk": { - "version": "4.1.2", - "resolved": "https://registry.npmjs.org/chalk/-/chalk-4.1.2.tgz", - "integrity": "sha512-oKnbhFyRIXpUuez8iBMmyEa4nbj4IOQyuhc/wy9kY7/WVPcwIO9VA668Pu8RkO7+0G76SLROeyw9CpQ061i4mA==", - "dev": true, - "optional": true, - "requires": { - "ansi-styles": "^4.1.0", - "supports-color": "^7.1.0" - } - }, - "color-convert": { - "version": "2.0.1", - "resolved": "https://registry.npmjs.org/color-convert/-/color-convert-2.0.1.tgz", - "integrity": "sha512-RRECPsj7iu/xb5oKYcsFHSppFNnsj/52OVTRKb4zP5onXwVF3zVmmToNcOfGC+CRDpfK/U584fMg38ZHCaElKQ==", - "dev": true, - "optional": true, - "requires": { - "color-name": "~1.1.4" - } - }, - "color-name": { - "version": "1.1.4", - "resolved": "https://registry.npmjs.org/color-name/-/color-name-1.1.4.tgz", - "integrity": "sha512-dOy+3AuW3a2wNbZHIuMZpTcgjGuLU/uBL/ubcZF9OXbDo8ff4O8yVp5Bf0efS8uEoYo5q4Fx7dY9OgQGXgAsQA==", - "dev": true, - "optional": true - }, - "has-flag": { - "version": "4.0.0", - "resolved": "https://registry.npmjs.org/has-flag/-/has-flag-4.0.0.tgz", - "integrity": "sha512-EykJT/Q1KjTWctppgIAgfSO0tKVuZUjhgMr17kqTumMl6Afv3EISleU7qZUzoXDFTAHTDC4NOoG/ZxU3EvlMPQ==", - "dev": true, - "optional": true - }, - "loader-utils": { - "version": "2.0.4", - "resolved": "https://registry.npmjs.org/loader-utils/-/loader-utils-2.0.4.tgz", - "integrity": "sha512-xXqpXoINfFhgua9xiqD8fPFHgkoq1mmmpE92WlDbm9rNRd/EbRb+Gqf908T2DMfuHjjJlksiK2RbHVOdD/MqSw==", - "dev": true, - "optional": true, - "requires": { - "big.js": "^5.2.2", - "emojis-list": "^3.0.0", - "json5": "^2.1.2" - } - }, - "supports-color": { - "version": "7.2.0", - "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-7.2.0.tgz", - "integrity": "sha512-qpCAvRl9stuOHveKsn7HncJRvv501qIacKzQlO/+Lwxc9+0q2wLyv4Dfvt80/DPn2pqOBsJdDiogXGR9+OvwRw==", - "dev": true, - "optional": true, - "requires": { - "has-flag": "^4.0.0" - } - }, - "vue-loader-v16": { - "version": "npm:vue-loader@16.8.3", - "resolved": "https://registry.npmjs.org/vue-loader/-/vue-loader-16.8.3.tgz", - "integrity": "sha512-7vKN45IxsKxe5GcVCbc2qFU5aWzyiLrYJyUuMz4BQLKctCj/fmCa0w6fGiiQ2cLFetNcek1ppGJQDCup0c1hpA==", - "dev": true, - "optional": true, - "requires": { - "chalk": "^4.1.0", - "hash-sum": "^2.0.0", - "loader-utils": "^2.0.0" - } - } } }, "@vue/cli-shared-utils": { @@ -15020,6 +14939,87 @@ } } }, + "vue-loader-v16": { + "version": "npm:vue-loader@16.8.3", + "resolved": "https://registry.npmjs.org/vue-loader/-/vue-loader-16.8.3.tgz", + "integrity": "sha512-7vKN45IxsKxe5GcVCbc2qFU5aWzyiLrYJyUuMz4BQLKctCj/fmCa0w6fGiiQ2cLFetNcek1ppGJQDCup0c1hpA==", + "dev": true, + "optional": true, + "requires": { + "chalk": "^4.1.0", + "hash-sum": "^2.0.0", + "loader-utils": "^2.0.0" + }, + "dependencies": { + "ansi-styles": { + "version": "4.3.0", + "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-4.3.0.tgz", + "integrity": "sha512-zbB9rCJAT1rbjiVDb2hqKFHNYLxgtk8NURxZ3IZwD3F6NtxbXZQCnnSi1Lkx+IDohdPlFp222wVALIheZJQSEg==", + "dev": true, + "optional": true, + "requires": { + "color-convert": "^2.0.1" + } + }, + "chalk": { + "version": "4.1.2", + "resolved": "https://registry.npmjs.org/chalk/-/chalk-4.1.2.tgz", + "integrity": "sha512-oKnbhFyRIXpUuez8iBMmyEa4nbj4IOQyuhc/wy9kY7/WVPcwIO9VA668Pu8RkO7+0G76SLROeyw9CpQ061i4mA==", + "dev": true, + "optional": true, + "requires": { + "ansi-styles": "^4.1.0", + "supports-color": "^7.1.0" + } + }, + "color-convert": { + "version": "2.0.1", + "resolved": "https://registry.npmjs.org/color-convert/-/color-convert-2.0.1.tgz", + "integrity": "sha512-RRECPsj7iu/xb5oKYcsFHSppFNnsj/52OVTRKb4zP5onXwVF3zVmmToNcOfGC+CRDpfK/U584fMg38ZHCaElKQ==", + "dev": true, + "optional": true, + "requires": { + "color-name": "~1.1.4" + } + }, + "color-name": { + "version": "1.1.4", + "resolved": "https://registry.npmjs.org/color-name/-/color-name-1.1.4.tgz", + "integrity": "sha512-dOy+3AuW3a2wNbZHIuMZpTcgjGuLU/uBL/ubcZF9OXbDo8ff4O8yVp5Bf0efS8uEoYo5q4Fx7dY9OgQGXgAsQA==", + "dev": true, + "optional": true + }, + "has-flag": { + "version": "4.0.0", + "resolved": "https://registry.npmjs.org/has-flag/-/has-flag-4.0.0.tgz", + "integrity": "sha512-EykJT/Q1KjTWctppgIAgfSO0tKVuZUjhgMr17kqTumMl6Afv3EISleU7qZUzoXDFTAHTDC4NOoG/ZxU3EvlMPQ==", + "dev": true, + "optional": true + }, + "loader-utils": { + "version": "2.0.4", + "resolved": "https://registry.npmjs.org/loader-utils/-/loader-utils-2.0.4.tgz", + "integrity": "sha512-xXqpXoINfFhgua9xiqD8fPFHgkoq1mmmpE92WlDbm9rNRd/EbRb+Gqf908T2DMfuHjjJlksiK2RbHVOdD/MqSw==", + "dev": true, + "optional": true, + "requires": { + "big.js": "^5.2.2", + "emojis-list": "^3.0.0", + "json5": "^2.1.2" + } + }, + "supports-color": { + "version": "7.2.0", + "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-7.2.0.tgz", + "integrity": "sha512-qpCAvRl9stuOHveKsn7HncJRvv501qIacKzQlO/+Lwxc9+0q2wLyv4Dfvt80/DPn2pqOBsJdDiogXGR9+OvwRw==", + "dev": true, + "optional": true, + "requires": { + "has-flag": "^4.0.0" + } + } + } + }, "vue-router": { "version": "3.5.3", "resolved": "https://registry.npmjs.org/vue-router/-/vue-router-3.5.3.tgz", diff --git a/src/router/index.js b/src/router/index.js index ab9e1d6..8775e2d 100644 --- a/src/router/index.js +++ b/src/router/index.js @@ -68,6 +68,8 @@ const routes = [ { path: '/psychologicalReport', name: 'psychologicalReport', component: resolve => require(['@/views/health/psychological/report/index'], resolve) }, // 周报/月报-入口 { path: '/psychiclReportEntry', name: 'psychiclReportEntry', component: resolve => require(['@/views/health/psychological/report/report-entry'], resolve) }, + // 周报/月报 + { path: '/reportDetails', name: 'reportDetails', component: resolve => require(['@/views/health/psychological/reportDetails/index'], resolve) }, // 告警详情-中间页 { path: '/aiCallAlarm', name: 'aiCallAlarm', component: resolve => require(['@/views/ai-call-alarm'], resolve) }, diff --git a/src/views/health/psychological-main/index.vue b/src/views/health/psychological-main/index.vue index 04c61b8..9fc9999 100644 --- a/src/views/health/psychological-main/index.vue +++ b/src/views/health/psychological-main/index.vue @@ -89,6 +89,7 @@ export default { }, // 加载路由参数 async loadParams() { + this.$toast.loading("数据加载中"); let params = this.$route.query; if (params) { this.uid = params.uid; diff --git a/src/views/health/psychological/index.scss b/src/views/health/psychological/index.scss index c2c9b89..50cada7 100644 --- a/src/views/health/psychological/index.scss +++ b/src/views/health/psychological/index.scss @@ -69,7 +69,7 @@ $newBlue: #638EE4; } } .psy-tab-bar { - height: 40px; + height: 30px; position: relative; margin: 5px 0; padding: 0 10px; @@ -84,7 +84,7 @@ $newBlue: #638EE4; justify-content: space-around; align-items: center; color: #fff; - height: 40px; + height: 30px; width: 100%; /* background-color: red; */ .psy-tab-item { @@ -93,12 +93,12 @@ $newBlue: #638EE4; color: #6D6D6D; height: 100%; width: 100%; - font-size: 18px; + font-size: 14px; border-radius: 20px; @include center(); &.active { color: #FFFFFF; - background-color: #638EE4; + background-color: #189B3BFF; } } } @@ -107,7 +107,8 @@ $newBlue: #638EE4; .main { position: relative; height: calc(100vh - 150px); - overflow: scroll; + overflow-y: scroll; + overflow-x: hidden; .top { flex: 1; .title { @@ -165,6 +166,10 @@ $newBlue: #638EE4; height: 106px; width: 106px; } + #pieChartDay { + height: 106px; + width: 106px; + } } .pie-chart-right { height: 150px; @@ -436,10 +441,12 @@ $newBlue: #638EE4; } .overall { display: flex; - justify-content: space-between; - align-items: center; + justify-content: flex-start; + align-items: flex-start; width: 100%; + .left { + flex-direction: column; p { padding-left: 20px; font-weight: bold; diff --git a/src/views/health/psychological/index.vue b/src/views/health/psychological/index.vue index 62b3ee3..35931cb 100644 --- a/src/views/health/psychological/index.vue +++ b/src/views/health/psychological/index.vue @@ -21,7 +21,7 @@ -
+
-
-
+
+
@@ -204,13 +204,48 @@

{{ item.name }}

+ 总评
- 总评 +

{{ item.summary }}

+
+
+ +
+ +
+
+
+
+
+
+ +
+
+ 周报 +

{{ item[1].name }}

+
+
+ 总评 +
+

+ {{ su.summary }} +

+ +
+
@@ -222,7 +257,7 @@
-
+

连续佩戴两周产生对比数据

@@ -386,9 +421,14 @@ export default { startDate: "", //接口需要的开始时间 endDate: "", //接口需要的结束时间 currentEmoName: "", //当前情绪名称 + weekResultList: [], //周报新详情周报列表 }; }, computed: { + // 页面类型，0 保持不动，1显示方式为新页面显示方式 + pageType() { + return Number(this.$route.query.pageType) || 0 + }, anxietyText() { const appTypeList = ['1']; return appTypeList.indexOf(this.$store.getters.appType) > -1 ? `忧郁` : `抑郁` @@ -727,19 +767,27 @@ export default { // 读取路由传过来的参数，根据路由传过来的参数判断是哪种情绪 this.loadParams(); this.initEchartText(); - this.getPieData(); + /* this.getPieData(); */ this.getCalendarData(); this.getPsychologiclData(); this.getWeekResult(); }, mounted() { this.initEchart(); - this.current = Number(this.$store.getters.tabClick) || 0; + if(this.params.current) { + this.current = Number(this.params.current); + } else { + this.current = Number(this.$store.getters.tabClick) || 0; + } + this.currentDays = this.calcDaysByTabClick( Number(this.$store.getters.tabClick) ); this.psyCurrent = this.calcPsyTabindex(EmotionModel[this.params.name].type); window.document.title = "心理监测"; + if(this.pageType === 1) { + this.getWeekResultAny(); + } }, methods: { loadParams() { @@ -1272,7 +1320,13 @@ export default { this.endDate = dateList[1]; } else { // 周报菜单 - this.getWeekResult(); + + if(this.pageType !== 1) { + this.getWeekResult(); + } else { + this.getWeekResultAny(); + } + } }, // 点击情绪tab @@ -1445,7 +1499,79 @@ export default { onClose() { this.isPopup = false; }, - getWeekResult() { + //循环调用3次 GetWeekResult 接口 + async getWeekResultAny() { + + Promise.all([ + await this.getWeekResultPro(1), + await this.getWeekResultPro(2), + await this.getWeekResultPro(3), + ]).then(res =>{ + let weekResultLists = res.reduce((accumulator, currentValue) => accumulator.concat(currentValue), []) + + let typeMap = {}; + weekResultLists.forEach(item => { + if (!typeMap[item.name]) { + typeMap[item.name] = { + name: item.name, + recordId: [], + summary: [], + summaryLevel: [], + summaryDetails: [], + type: item.type, + + }; + weekResultLists.push(typeMap[item.name]); + } + + typeMap[item.name].recordId.push(item.recordId); + typeMap[item.name].summary.push(item.summary); + typeMap[item.name].summaryLevel.push(item.summaryLevel); + let combinedArray = typeMap[item.name].summary.map((sum, index) => ({summary: sum, summaryLevel: typeMap[item.name].summaryLevel[index]})); + console.log(combinedArray); + typeMap[item.name].summaryDetails = combinedArray + + }); + let array = Object.entries(typeMap); + this.weekResultList = array.reverse(); + console.log("weekResultLists", this.weekResultList); + console.log("typeMap", typeMap); + }); + + }, + getWeekResultPro(type) { + let baseUrl = + process.env.NODE_ENV === "production" + ? "https://dbmq.rzliot.com/auth_heart" + : "https://dbmq.rzliot.com/heart"; + let reqUrl = `${baseUrl}/api/Data/GetWeekResult`; + let reqParams = { + uid: this.uid /* '1929285069986332672' */, + type: type || this.emoType, + }; + return new Promise(resolve => { + axios + .get(reqUrl, { + params: { ...reqParams }, + /* headers: { 'AccessToken': this.$store.getters.ssjlToken } */ + }).then(res => { + const data = res.data.response; + let summaryList = data.map(item => { + return { + name: item.Name.replace("周报", "") + .replace(/-/g, ".") + .replace(/~/g, "-"), + recordId: item.RecordId, + summary: this.$replaceAll(item.Summary, '抑郁', '忧郁'), + summaryLevel: item.SummaryLevel, + type: item.Type, + }; + }); + resolve(summaryList) + }) + }) + }, + getWeekResult(type) { this.$toast.loading("数据加载中"); let baseUrl = process.env.NODE_ENV === "production" @@ -1453,7 +1579,7 @@ export default { : "https://dbmq.rzliot.com/heart"; let reqUrl = `${baseUrl}/api/Data/GetWeekResult`; let reqParams = { - uid: this.uid /* '2023101521270090082 */, + uid: this.uid /* '1929285069986332672' */, type: this.emoType, }; axios @@ -1480,16 +1606,33 @@ export default { this.$toast.success("数据加载完成"); }); }, - onClickItem(recordId) { - this.$router.push({ - name: "psychologicalReport", - query: { - recordId: recordId, - name: this.currentEmoName, - isShowLeft: true, - uid: this.uid, - }, - }); + onClickItem(item) { + if(this.pageType === 1) { + // 跳转去新的周报详情页 + this.$router.push({ + name: "reportDetails", + query: { + recordId: item.recordId[Number(this.psyCurrent) - 1], + name: this.currentEmoName, + isShowLeft: true, + uid: this.uid, + time: item.name, + current: 3, + + }, + }); + } else { + this.$router.push({ + name: "psychologicalReport", + query: { + recordId: item.recordId, + name: this.currentEmoName, + isShowLeft: true, + uid: this.uid, + }, + }); + } + }, }, }; diff --git a/src/views/health/psychological/reportDetails/index.scss b/src/views/health/psychological/reportDetails/index.scss new file mode 100644 index 0000000..2c56ff5 --- /dev/null +++ b/src/views/health/psychological/reportDetails/index.scss @@ -0,0 +1,323 @@ +.main-details { + height: 100vh; + width: 100%; + overflow: hidden; + background-color: #F5F5F5; + font-family: Source Han Sans CN; + + .report-details { + height: calc(100vh - 88px); + overflow: scroll; + background-color: #fff; + + .line { + height: 11px; + background-color: $lineGray; + } + + .overall-rating { + padding: 23px 15px; + margin-bottom: 9px; + + .con { + padding: 17px 18px; + display: flex; + justify-content: flex-start; + align-items: flex-start; + flex-direction: column; + font-size: 14px; + background: #FFFFFF; + border: 1px solid #535353; + box-shadow: 4px 5px 0px 0px #638EE4; + border-radius: 5px; + + p { + font-size: 18px; + font-family: Source Han Sans CN; + color: #666666; + + .bold { + color: #282828; + font-weight: bold; + } + } + + .space-between { + width: 100%; + display: flex; + justify-content: space-between; + align-items: center; + + .time { + font-size: 12px; + } + } + + .normal { + font-size: 13px; + line-height: 21px; + text-align: left; + color: #666666; + } + + .bold-pro { + color: #282828; + font-size: 24px; + font-weight: bold; + padding: 12px 0; + } + } + } + + .pie-chart-top { + display: flex; + justify-content: space-between; + align-items: flex-start; + padding: 23px 15px 16px 15px; + + p { + font-size: 12px; + font-family: Source Han Sans CN; + line-height: 21px; + } + + .bold { + font-size: 18px; + font-weight: bold; + color: #282828; + line-height: 18px; + } + } + + .count { + padding: 0 15px 5px 15px; + text-align: left; + + p { + font-size: 12px; + font-family: Source Han Sans CN; + font-weight: 400; + color: #8B8B8B; + line-height: 18px; + } + } + + .pie-chart-con { + flex: 1; + padding: 5px 0 10px 0; + display: flex; + justify-content: space-between; + align-items: flex-start; + background-color: #fff; + + .pie-chart-left { + position: relative; + height: 150px; + padding-left: 15px; + width: 35%; + @include center(); + + #pieChart { + height: 106px; + width: 106px; + } + #pieChartDay { + height: 106px; + width: 106px; + } + } + + .pie-chart-right { + height: 150px; + width: 65%; + @include center(); + + .list { + display: flex; + justify-content: center; + flex-direction: column; + .item { + width: 100%; + display: flex; + justify-content: space-between; + align-items: center; + font-size: 12px; + padding: 9px 0; + .item-left { + display: flex; + justify-content: flex-start; + align-items: center; + padding-right: 10px; + + .circle { + height: 12px; + width: 12px; + margin: 0 4px; + } + + span { + font-size: 12px; + } + + .text { + color: #000; + font-size: 12px; + } + } + + .item-right { + @include center(); + span { + font-size: 12px; + } + } + .status { + padding: 0 5px; + @include center(); + img { + height: 15px; + width: 9px; + padding: 0 3px ; + } + } + } + } + } + } + + .statistics { + position: relative; + padding: 5px 14px 5px 14px; + .list { + flex: 1; + width: 100%; + display: flex; + justify-content: space-between; + align-items: center; + font-size: 16px; + + .item { + @include center(); + width: 58px; + /* height: px2rem(136); */ + flex-direction: column; + + .top { + font-size: 12px; + } + + .middle { + font-size: 24px; + font-weight: bold; + padding: 5px; + } + + .bottom { + font-size: 9px + } + } + } + } + + .bar-chart { + height: 350px; + background-color: #fff; + padding: 0 5px; + + .echart { + height: 350px; + padding: 0 5px; + } + } + + .advice { + padding: 26px 15px 30px 15px; + + .content { + background: #F2F6FF; + border-radius: 10px; + padding: 20px 15px; + text-align: left; + + p { + font-size: 15px; + font-weight: 400; + color: #707070; + line-height: 23px; + } + + .title { + font-size: 18px; + font-weight: bold; + color: #638EE4; + line-height: 18px; + padding-bottom: 13px; + } + } + } + + .overview { + padding: 0 15px 16px 15px; + + .content { + .title { + text-align: left; + + .title-text { + font-size: 18px; + font-weight: bold; + color: #282828; + line-height: 18px; + } + + .mood-list { + display: grid; + grid-template-columns: repeat(2, 1fr); //定义了一个 2x2 的网格布 + grid-template-rows: repeat(2, 1fr); + gap: 21px; + padding: 21px 21px 22px 20px; + + .item { + width: 107px; + height: 94px; + background-color: #F2F6FF; + display: flex; + justify-content: center; + align-items: flex-start; + flex-direction: column; + padding-left: 30px; + + p { + font-size: 14px; + padding: 0; + color: #666666; + @include center(); + /* align-items: flex-end; */ + .day { + /* padding: 5px; */ + font-size: 28px; + } + + .day-text { + font-size: 12px; + padding: 0 5px; + } + img { + height: 15px; + width: 9px; + } + } + } + } + } + } + } + &.no-data { + @include center(); + flex-direction: column; + p { + font-size: 16px; + } + } + } +} \ No newline at end of file diff --git a/src/views/health/psychological/reportDetails/index.vue b/src/views/health/psychological/reportDetails/index.vue new file mode 100644 index 0000000..df91659 --- /dev/null +++ b/src/views/health/psychological/reportDetails/index.vue @@ -0,0 +1,2197 @@ + + + + + + \ No newline at end of file