chenJinxu
/
TelpoH5FrontendWeb
Watch 1
Star 0
Fork 0
Code Issues 0 Pull Requests 0 Releases 0 Wiki Activity
Browse Source

Merge branch 'mer-test' into test

test
JinxChen 3 months ago
parent
bd66369814 ca612848df
commit
bbc498a330
8 changed files with 2785 additions and 109 deletions
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. +4
    -1
      README.md
  2. +81
    -81
      package-lock.json
  3. +2
    -0
      src/router/index.js
  4. +1
    -0
      src/views/health/psychological-main/index.vue
  5. +14
    -7
      src/views/health/psychological/index.scss
  6. +163
    -20
      src/views/health/psychological/index.vue
  7. +323
    -0
      src/views/health/psychological/reportDetails/index.scss
  8. +2197
    -0
      src/views/health/psychological/reportDetails/index.vue

+ 4
- 1
README.md View File

@@ -1195,4 +1195,7 @@ update
`2024.8.7` `2024.8.7`
fix fix


- 修复 心理量表选项起始数调整为0
- 修复 心理量表选项起始数调整为0
`2024.8.21`
update
- 优化 周报汇总切换

+ 81
- 81
package-lock.json View File

@@ -2250,87 +2250,6 @@
"webpack-chain": "^6.4.0", "webpack-chain": "^6.4.0",
"webpack-dev-server": "^3.11.0", "webpack-dev-server": "^3.11.0",
"webpack-merge": "^4.2.2" "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": { "@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": { "vue-router": {
"version": "3.5.3", "version": "3.5.3",
"resolved": "https://registry.npmjs.org/vue-router/-/vue-router-3.5.3.tgz", "resolved": "https://registry.npmjs.org/vue-router/-/vue-router-3.5.3.tgz",


+ 2
- 0
src/router/index.js View File

@@ -68,6 +68,8 @@ const routes = [
{ path: '/psychologicalReport', name: 'psychologicalReport', component: resolve => require(['@/views/health/psychological/report/index'], resolve) }, { 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: '/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) }, { path: '/aiCallAlarm', name: 'aiCallAlarm', component: resolve => require(['@/views/ai-call-alarm'], resolve) },


+ 1
- 0
src/views/health/psychological-main/index.vue View File

@@ -89,6 +89,7 @@ export default {
}, },
// 加载路由参数 // 加载路由参数
async loadParams() { async loadParams() {
this.$toast.loading("数据加载中");
let params = this.$route.query; let params = this.$route.query;
if (params) { if (params) {
this.uid = params.uid; this.uid = params.uid;


+ 14
- 7
src/views/health/psychological/index.scss View File

@@ -69,7 +69,7 @@ $newBlue: #638EE4;
} }
} }
.psy-tab-bar { .psy-tab-bar {
height: 40px;
height: 30px;
position: relative; position: relative;
margin: 5px 0; margin: 5px 0;
padding: 0 10px; padding: 0 10px;
@@ -84,7 +84,7 @@ $newBlue: #638EE4;
justify-content: space-around; justify-content: space-around;
align-items: center; align-items: center;
color: #fff; color: #fff;
height: 40px;
height: 30px;
width: 100%; width: 100%;
/* background-color: red; */ /* background-color: red; */
.psy-tab-item { .psy-tab-item {
@@ -93,12 +93,12 @@ $newBlue: #638EE4;
color: #6D6D6D; color: #6D6D6D;
height: 100%; height: 100%;
width: 100%; width: 100%;
font-size: 18px;
font-size: 14px;
border-radius: 20px; border-radius: 20px;
@include center(); @include center();
&.active { &.active {
color: #FFFFFF; color: #FFFFFF;
background-color: #638EE4;
background-color: #189B3BFF;
} }
} }
} }
@@ -107,7 +107,8 @@ $newBlue: #638EE4;
.main { .main {
position: relative; position: relative;
height: calc(100vh - 150px); height: calc(100vh - 150px);
overflow: scroll;
overflow-y: scroll;
overflow-x: hidden;
.top { .top {
flex: 1; flex: 1;
.title { .title {
@@ -165,6 +166,10 @@ $newBlue: #638EE4;
height: 106px; height: 106px;
width: 106px; width: 106px;
} }
#pieChartDay {
height: 106px;
width: 106px;
}
} }
.pie-chart-right { .pie-chart-right {
height: 150px; height: 150px;
@@ -436,10 +441,12 @@ $newBlue: #638EE4;
} }
.overall { .overall {
display: flex; display: flex;
justify-content: space-between;
align-items: center;
justify-content: flex-start;
align-items: flex-start;
width: 100%; width: 100%;
.left { .left {
flex-direction: column;
p { p {
padding-left: 20px; padding-left: 20px;
font-weight: bold; font-weight: bold;


+ 163
- 20
src/views/health/psychological/index.vue View File

@@ -21,7 +21,7 @@
</div> </div>
</div> </div>
<!-- 情绪切换 --> <!-- 情绪切换 -->
<div class="psy-tab-bar">
<div class="psy-tab-bar" v-if="pageType !== 1">
<div class="psy-tab-con"> <div class="psy-tab-con">
<div class="psy-tab-list"> <div class="psy-tab-list">
<div :class="[ <div :class="[
@@ -194,8 +194,8 @@
<!-- 周报菜单 --> <!-- 周报菜单 -->
<div class="main report" v-show="current == 3"> <div class="main report" v-show="current == 3">
<div class="content"> <div class="content">
<div class="list" v-if="weekList.length > 0">
<div class="item" v-for="(item, index) in weekList" :key="index" @click="onClickItem(item.recordId)">
<div class="list" v-if="pageType === 0 && weekList.length > 0">
<div class="item" v-for="(item, index) in weekList" :key="index" @click="onClickItem(item)">
<div class="left"> <div class="left">
<img :src="weekImg" alt /> <img :src="weekImg" alt />
<div class="middle"> <div class="middle">
@@ -204,13 +204,48 @@
<p>{{ item.name }}</p> <p>{{ item.name }}</p>
</div> </div>
<div class="overall"> <div class="overall">
<span>总评</span>
<div class="left"> <div class="left">
<span>总评</span>
<p :style="{ color: calcResultColor(item.summaryLevel) }"> <p :style="{ color: calcResultColor(item.summaryLevel) }">
{{ item.summary }} {{ item.summary }}
</p> </p>
</div> </div>
</div> </div>
</div>
</div>

<div class="right">
<img :src="moreImg" alt />
</div>
</div>
</div>
<div class="list" v-if="pageType === 1 && weekResultList.length > 0">
<div class="item" v-for="(item, index) in weekResultList" :key="index" @click="onClickItem(item[1])">
<div class="left">
<img :src="weekImg" alt />
<div class="middle">
<div class="title">
<span>周报</span>
<p>{{ item[1].name }}</p>
</div>
<div class="overall">
<span>总评</span>
<div class="left">
<p v-for="(su, index) in item[1].summaryDetails" :key="index" :style="{ color: calcResultColor(su.summaryLevel) }">
{{ su.summary }}
</p>
<!-- <p :style="{ color: calcResultColor(item.summaryLevel) }">
{{ item.summary }}
</p>
<p :style="{ color: calcResultColor(item.summaryLevel) }">
{{ item.summary }}
</p>
<p :style="{ color: calcResultColor(item.summaryLevel) }">
{{ item.summary }}
</p> -->
</div>
</div>
<!-- <div class="trend"> <!-- <div class="trend">
<p>( <span>无抑郁倾向</span><span>5%</span>，<span>轻度抑郁倾向</span> <span>5%</span> )</p> <p>( <span>无抑郁倾向</span><span>5%</span>，<span>轻度抑郁倾向</span> <span>5%</span> )</p>
</div>--> </div>-->
@@ -222,7 +257,7 @@
</div> </div>
</div> </div>
</div> </div>
<div class="list no-data" v-else>
<div class="list no-data" v-if="weekList.length < 1 && weekResultList.length < 1 ">
<img :src="noDataImg" alt /> <img :src="noDataImg" alt />
<p>连续佩戴两周产生对比数据</p> <p>连续佩戴两周产生对比数据</p>
</div> </div>
@@ -386,9 +421,14 @@ export default {
startDate: "", //接口需要的开始时间 startDate: "", //接口需要的开始时间
endDate: "", //接口需要的结束时间 endDate: "", //接口需要的结束时间
currentEmoName: "", //当前情绪名称 currentEmoName: "", //当前情绪名称
weekResultList: [], //周报新详情周报列表
}; };
}, },
computed: { computed: {
// 页面类型，0 保持不动，1显示方式为新页面显示方式
pageType() {
return Number(this.$route.query.pageType) || 0
},
anxietyText() { anxietyText() {
const appTypeList = ['1']; const appTypeList = ['1'];
return appTypeList.indexOf(this.$store.getters.appType) > -1 ? `忧郁` : `抑郁` return appTypeList.indexOf(this.$store.getters.appType) > -1 ? `忧郁` : `抑郁`
@@ -727,19 +767,27 @@ export default {
// 读取路由传过来的参数，根据路由传过来的参数判断是哪种情绪 // 读取路由传过来的参数，根据路由传过来的参数判断是哪种情绪
this.loadParams(); this.loadParams();
this.initEchartText(); this.initEchartText();
this.getPieData();
/* this.getPieData(); */
this.getCalendarData(); this.getCalendarData();
this.getPsychologiclData(); this.getPsychologiclData();
this.getWeekResult(); this.getWeekResult();
}, },
mounted() { mounted() {
this.initEchart(); 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( this.currentDays = this.calcDaysByTabClick(
Number(this.$store.getters.tabClick) Number(this.$store.getters.tabClick)
); );
this.psyCurrent = this.calcPsyTabindex(EmotionModel[this.params.name].type); this.psyCurrent = this.calcPsyTabindex(EmotionModel[this.params.name].type);
window.document.title = "心理监测"; window.document.title = "心理监测";
if(this.pageType === 1) {
this.getWeekResultAny();
}
}, },
methods: { methods: {
loadParams() { loadParams() {
@@ -1272,7 +1320,13 @@ export default {
this.endDate = dateList[1]; this.endDate = dateList[1];
} else { } else {
// 周报菜单 // 周报菜单
this.getWeekResult();
if(this.pageType !== 1) {
this.getWeekResult();
} else {
this.getWeekResultAny();
}
} }
}, },
// 点击情绪tab // 点击情绪tab
@@ -1445,7 +1499,79 @@ export default {
onClose() { onClose() {
this.isPopup = false; 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("数据加载中"); this.$toast.loading("数据加载中");
let baseUrl = let baseUrl =
process.env.NODE_ENV === "production" process.env.NODE_ENV === "production"
@@ -1453,7 +1579,7 @@ export default {
: "https://dbmq.rzliot.com/heart"; : "https://dbmq.rzliot.com/heart";
let reqUrl = `${baseUrl}/api/Data/GetWeekResult`; let reqUrl = `${baseUrl}/api/Data/GetWeekResult`;
let reqParams = { let reqParams = {
uid: this.uid /* '2023101521270090082 */,
uid: this.uid /* '1929285069986332672' */,
type: this.emoType, type: this.emoType,
}; };
axios axios
@@ -1480,16 +1606,33 @@ export default {
this.$toast.success("数据加载完成"); 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,
},
});
}
}, },
}, },
}; };


+ 323
- 0
src/views/health/psychological/reportDetails/index.scss View File

@@ -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;
}
}
}
}

+ 2197
- 0
src/views/health/psychological/reportDetails/index.vue
File diff suppressed because it is too large
View File


Write Preview
Loading…
Cancel
Save