Переглянути джерело

增加 洞悉界面

增加 情绪周报详情
增加 Jenkins部署脚本
test
chenJinxu 11 місяці тому
джерело
коміт
b178417ffb
10 змінених файлів з 368 додано та 72 видалено
  1. +37
    -0
      h5_frontend_web_run.sh
  2. +29
    -0
      health_student_web_run.sh
  3. +1
    -0
      package.json
  4. +19
    -0
      setup_development.sh
  5. +29
    -0
      setup_production.sh
  6. +29
    -0
      setup_test.sh
  7. +144
    -14
      src/views/insight/index.vue
  8. +7
    -3
      src/views/myself/index.vue
  9. +44
    -25
      src/views/today/report.vue
  10. +29
    -30
      src/views/today/scss/report.scss

+ 37
- 0
h5_frontend_web_run.sh Переглянути файл

@@ -0,0 +1,37 @@
#!/bin/bash
###
# @Date: 2022-08-18 09:19:07
# @LastEditors: JinxChen
# @LastEditTime: 2022-08-18 10:06:40
# @FilePath: \TelpoH5FrontendWeb\h5_frontend_web_run.sh
# @description: 部署脚本
###

environment=$1
version=$2
echo "环境变量为${environment},版本为$version!"
if [[ ${environment} = 'production' ]];
then
echo "开始远程构建容器"
docker stop h5_frontend_web || true;
docker rm h5_frontend_web || true;
docker rmi -f $(docker images | grep registry.cn-shanghai.aliyuncs.com/tolpo_platform/h5_frontend_web | awk '{print $3}')
#docker login --username=telpo_linwl@1111649216405698 --password=telpo#1234 registry.cn-shanghai.aliyuncs.com;
#docker login --username=telpo_fengjj@1111649216405698 --password=PWDaliyun123 registry.cn-shanghai.aliyuncs.com
docker login --username=rzl_wangjx@1111649216405698 --password=telpo.123 registry.cn-shanghai.aliyuncs.com
docker pull registry.cn-shanghai.aliyuncs.com/tolpo_platform/h5_frontend_web:$version
docker run -p 8075:80 -d --restart=always --name h5_frontend_web registry.cn-shanghai.aliyuncs.com/tolpo_platform/h5_frontend_web:$version;
#删除产生的None镜像
docker rmi -f $(docker images | grep none | awk '{print $3}')
docker ps -a
else
echo "开始在测试环境远程构建容器"
docker stop h5_frontend_web || true
docker rm h5_frontend_web || true
docker rmi -f $(docker images | grep 139.224.254.18:5000/h5_frontend_web | awk '{print $3}')
docker pull 139.224.254.18:5000/h5_frontend_web:$version
docker run -p 8075:80 -d --restart=always --name h5_frontend_web 139.224.254.18:5000/h5_frontend_web:$version;
#删除产生的None镜像
docker rmi -f $(docker images | grep none | awk '{print $3}')
docker ps -a
fi

+ 29
- 0
health_student_web_run.sh Переглянути файл

@@ -0,0 +1,29 @@

environment=$1
version=$2
echo "环境变量为${environment},版本为$version!"
if [[ ${environment} = 'production' ]];
then
echo "开始远程构建容器"
docker stop health_student_web || true;
docker rm health_student_web || true;
docker rmi -f $(docker images | grep registry.cn-shanghai.aliyuncs.com/tolpo_platform/health_student_web | awk '{print $3}')
#docker login --username=telpo_linwl@1111649216405698 --password=telpo#1234 registry.cn-shanghai.aliyuncs.com;
#docker login --username=telpo_fengjj@1111649216405698 --password=PWDaliyun123 registry.cn-shanghai.aliyuncs.com
docker login --username=rzl_wangjx@1111649216405698 --password=telpo.123 registry.cn-shanghai.aliyuncs.com
docker pull registry.cn-shanghai.aliyuncs.com/tolpo_platform/health_student_web:$version
docker run -p 8070:80 -d --restart=always --name health_student_web registry.cn-shanghai.aliyuncs.com/tolpo_platform/health_student_web:$version;
#删除产生的None镜像
docker rmi -f $(docker images | grep none | awk '{print $3}')
docker ps -a
else
echo "开始在测试环境远程构建容器"
docker stop health_student_web || true
docker rm health_student_web || true
docker rmi -f $(docker images | grep 139.224.254.18:5000/health_student_web | awk '{print $3}')
docker pull 139.224.254.18:5000/health_student_web:$version
docker run -p 8070:80 -d --restart=always --name health_student_web 139.224.254.18:5000/health_student_web:$version;
#删除产生的None镜像
docker rmi -f $(docker images | grep none | awk '{print $3}')
docker ps -a
fi

+ 1
- 0
package.json Переглянути файл

@@ -5,6 +5,7 @@
"scripts": {
"serve": "vue-cli-service serve",
"build": "vue-cli-service build",
"build-test": "vue-cli-service build --mode test",
"lint": "vue-cli-service lint",
"deps": "yarn upgrade-interactive --latest",
"dev": "vue-cli-service serve --mode development",


+ 19
- 0
setup_development.sh Переглянути файл

@@ -0,0 +1,19 @@

npm -v
npm config set registry https://registry.npm.taobao.org
npm install
npm run build-dev
image_version=`date +%Y%m%d%H%M`;
docker stop health_student_web || true;
docker rm health_student_web || true;
# 删除镜像
docker rmi -f $(docker images | grep telpo/health_student_web | awk '{print $3}')
# 构建telpo/mrp:$image_version镜像
docker build --no-cache . -t telpo/health_student_web:$image_version;
#删除产生的None镜像
docker rmi -f $(docker images | grep none | awk '{print $3}')
# 查看镜像列表
docker images;
docker run -p 8070:80 -d --restart=always --name health_student_web telpo/health_student_web:$image_version;
# 查看日志
docker logs health_student_web;

+ 29
- 0
setup_production.sh Переглянути файл

@@ -0,0 +1,29 @@
#!/bin/bash
###
# @Date: 2022-08-18 09:19:07
# @LastEditors: JinxChen
# @LastEditTime: 2022-08-18 09:29:15
# @FilePath: \TelpoH5FrontendWeb\setup_production.sh
# @description:
###
npm -v
npm config set registry https://registry.npm.taobao.org
npm install
npm run build
image_version=$version;
# 删除镜像
docker rmi -f $(docker images | grep registry.cn-shanghai.aliyuncs.com/tolpo_platform/health_student_web | awk '{print $3}')
# 构建telpo/mrp:$image_version镜像
docker build --no-cache . -t telpo/health_student_web:$image_version;
#TODO:推送镜像到阿里仓库
echo '=================开始推送镜像======================='
#docker login --username=telpo_linwl@1111649216405698 --password=telpo#1234 registry.cn-shanghai.aliyuncs.com
#docker login --username=telpo_fengjj@1111649216405698 --password=PWDaliyun123 registry.cn-shanghai.aliyuncs.com
docker login --username=rzl_wangjx@1111649216405698 --password=telpo.123 registry.cn-shanghai.aliyuncs.com
docker tag telpo/health_student_web:$image_version registry.cn-shanghai.aliyuncs.com/tolpo_platform/health_student_web:$image_version
docker push registry.cn-shanghai.aliyuncs.com/tolpo_platform/health_student_web:$image_version
echo '=================推送镜像完成======================='
#删除产生的None镜像
docker rmi -f $(docker images | grep none | awk '{print $3}')
# 查看镜像列表
docker images;

+ 29
- 0
setup_test.sh Переглянути файл

@@ -0,0 +1,29 @@

###
# @Date: 2022-08-18 09:19:07
# @LastEditors: JinxChen
# @LastEditTime: 2022-08-18 09:29:35
# @FilePath: \TelpoH5FrontendWeb\setup_test.sh
# @description:
###
#!/bin/bash
npm -v
npm config set registry https://registry.npm.taobao.org
npm install
npm run build-test
image_version=$version;
# 删除镜像
docker rmi -f $(
docker images | grep 139.224.254.18:5000/h5_frontend_web | awk '{print $3}'
)
# 构建telpo/mrp:$image_version镜像
docker build --no-cache . -t health_student_web:$image_version;
#TODO:推送镜像到私有仓库
echo '=================开始推送镜像======================='
docker tag health_student_web:$image_version 139.224.254.18:5000/h5_frontend_web:$image_version
docker push 139.224.254.18:5000/h5_frontend_web:$image_version
echo '=================推送镜像完成======================='
#删除产生的None镜像
docker rmi -f $(docker images | grep none | awk '{print $3}')
# 查看镜像列表
docker images;

+ 144
- 14
src/views/insight/index.vue Переглянути файл

@@ -6,15 +6,20 @@
<div class="periodItem month" :class="{ active: active == 1 }" @click="active = 1">月</div>
</div>
<div class="periodSwitch">
<div class="arrow arrowLeft" @click="active = active == 0 ? 1 : 0">
<div class="arrow arrowLeft">
<van-icon name="arrow-left"></van-icon>
</div>
<div class="timearea">kdfdfkjhsojldkfho</div>
<div class="arrow arrowRight" @click="active = active == 1 ? 0 : 1">
<div class="timearea">2023-11-28~2023-11-24</div>
<div class="arrow arrowRight">
<van-icon name="arrow"></van-icon>
</div>
</div>
<div class="label">情绪感知</div>
<div class="label">
<div class="left">情绪感知</div>
<div class="right">
<span @click="onRouterTo()">详情 ></span>
</div>
</div>
<div class="periodNav">
<div
class="periodItem minPeriodItem"
@@ -46,7 +51,13 @@
<div class="title">{{ item.name }}{{ emotionList[emotionActive].name }}倾向</div>
</div>
</div>
<div class="label">体征感知</div>
<div class="label">
<div class="left">体征感知</div>
<div class="right">
<span>详情 ></span>
</div>
</div>

<div class="periodNav">
<div
class="periodItem minPeriodItem"
@@ -58,6 +69,14 @@
<span>{{ item.name }}</span>
</div>
</div>
<!-- bmi显示/输入 -->
<div class="bmi" v-show="signActive == 2">
<p>身高:<span>170</span>cm</p>
<p>体重:<span>60</span>kg</p>
<p>BMI:<span>24.5</span></p>
<p>{{ bmi.result }}</p>
<van-button type="primary" size="mini">更新</van-button>
</div>
<div class="ChatBox" :class="{ hiddenChart: signActive == 2 }">
<div class="legendBox minLegendBox">
<div class="legend">
@@ -84,10 +103,48 @@
</div>
</div>
<div class="ChatBox minChartBox" :class="{ hiddenChart: signActive != 2 }">
<h4>运动步数</h4>
<div class="Chat stepChart" id="stepChart"></div>
<div class="result">
<div class="wrapBox">
<div class="text">
<div class="left"><p>总步数:285</p></div>
<div class="right">
<img :src="upImg" alt="" />
<span>923</span>
</div>
</div>
<div class="text">
<div class="left"><p>平均步数:285</p></div>
<div class="right">
<img :src="downImg" alt="" />
<span>923</span>
</div>
</div>
</div>
</div>
</div>
<div class="ChatBox minChartBox" :class="{ hiddenChart: signActive != 2 }">
<h4>热量消耗</h4>
<div class="Chat calorieChart" id="calorieChart"></div>
<div class="result">
<div class="wrapBox">
<div class="text">
<div class="left"><p>总消耗:285</p></div>
<div class="right">
<img :src="upImg" alt="" />
<span>923</span>
</div>
</div>
<div class="text">
<div class="left"><p>平均消耗:285</p></div>
<div class="right">
<img :src="downImg" alt="" />
<span>923</span>
</div>
</div>
</div>
</div>
</div>
</div>
</template>
@@ -178,7 +235,15 @@ export default {
type: 'severe',
color: '#FF5F8B'
}
]
],
bmi: {
height: '170',
weight: '57',
value: '24.5',
result: '肥胖'
},
upImg: require('@/assets/today/icons/up.png'),
downImg: require('@/assets/today/icons/down.png')
};
},
created() {},
@@ -701,19 +766,19 @@ export default {

if (!point) {
option.series = [
{
{
type: 'bar',
barMaxWidth: 15,
label: {
show: true,
color: '#000',
position: 'outside',
position: 'outside'
},
itemStyle: {
borderRadius: 12
}
},
]
}
];
}

return option;
@@ -725,6 +790,14 @@ export default {
onSignClick(index) {
this.signActive = index;
// 体征选项变化重新渲染图表
},
onRouterTo(name) {
this.$router.push({
name: 'report',
query: {
name: name
}
});
}
}
};
@@ -774,10 +847,36 @@ export default {
font-size: 45px;
}
}
.bmi {
display: flex;
justify-content: flex-start;
align-items: center;
white-space: nowrap;
padding: 40px 8px 0 8px;
font-weight: bold;

p {
padding: 0 5px;
font-size: 28px;
}
.van-button {
padding: 5px 10px;
margin-left: 50px;
font-size: 14px;
color: #333;
border-radius: 30px;
}
}
.label {
font-size: 40px;
font-weight: bold;
padding: 30px 0;
padding: 30px 10px 30px 0;
display: flex;
justify-content: space-between;
align-items: center;
.right {
font-size: 30px;
}
}
.ChatBox {
overflow: hidden;
@@ -786,7 +885,9 @@ export default {
border: 2px solid #cdf348;
border-radius: 70px;
margin-top: 30px;

h4 {
padding: 40px 0 10px 60px;
}
.legendBox {
width: 100%;
height: 150px;
@@ -899,11 +1000,40 @@ export default {
}
.Chat {
width: calc(100vw - 60px);
height: 450px;
height: 500px;
}
.result {
height: 140px;
padding: 0 30px;
border-radius: 70px;
display: flex;
justify-content: center;
align-items: flex-start;
flex-direction: column;
.wrapBox {
padding: 10px 180px 10px 60px;
width: 100%;
background-color: #e6e6e6;
border-radius: 70px;
}
.text {
display: flex;
justify-content: space-between;
align-items: center;
.right {
@include center();
img {
height: 30px;
width: 30px;
object-fit: contain;
margin: 0 5px;
}
}
}
}
}
.minChartBox {
height: 450px;
height: 760px;
}
.hiddenChart {
width: 0;


+ 7
- 3
src/views/myself/index.vue Переглянути файл

@@ -245,7 +245,7 @@ export default {
},
getDeviceList() {
ToastService.loading({ message: '正在加载', forbidClick: false });
let that = this;
/* let that = this; */
APIDevice.deviceList({
userId: this.$store.getters.userId,
mapType: 'gaode',
@@ -267,12 +267,16 @@ export default {

if (isNotNull(item.devicesList)) {
this.currentDevice = { ...item.devicesList[0] };
item.devicesList.forEach(val => {
this.$store.commit('roleUser', item.devicesList[0].roleUser);
this.$store.commit('deviceType', item.devicesList[0].deviceType);
this.$store.commit('deviceId', item.devicesList[0].deviceId);
this.$store.commit('serialNo', item.devicesList[0].serialNo);
/* item.devicesList.forEach(val => {
if (val.deviceId == that.$store.getters.deviceId) {
this.$store.commit('roleUser', val.roleUser);
this.$store.commit('deviceType', val.deviceType);
}
});
}); */
} else {
this.$store.commit('deviceId', '');
this.$store.commit('serialNo', '');


+ 44
- 25
src/views/today/report.vue Переглянути файл

@@ -1,10 +1,10 @@
<template>
<!-- 周/月报 -->
<div class="report">
<van-nav-bar title="心理监测周报" :border="true" @click-left="onNavBack">
<van-nav-bar title="周报" :border="true" @click-left="onNavBack">
<template #left>
<van-icon name="arrow-left" size="24" style="padding: 0" v-show="params.isShowLeft" />
<span v-show="params.isShowLeft">返回</span>
<van-icon name="arrow-left" size="24" style="padding: 0" />
<span>返回</span>
</template>
</van-nav-bar>
<div class="main">
@@ -65,13 +65,18 @@
</div>
<div class="statistics">
<div class="list">
<div class="item" v-for="(item, index) in statisticsList" :key="index">
<div
class="item"
v-for="(item, index) in statisticsList"
:key="index"
:style="{ backgroundColor: item.bgColor }"
>
<div class="top">
<span>{{ item.label || '--' }}</span>
</div>

<div class="middle">
<span :style="{ color: calcColor(item.value) }">{{ item.value || '--' }}</span>
<span>{{ item.value || '--' }}</span>
</div>

<div class="bottom">
@@ -81,6 +86,9 @@
</div>
</div>
<div class="line"></div>
<div class="chart-title">
<p>{{ echartsTitle }}</p>
</div>
<!-- 数据图-柱形图 -->
<div class="bar-chart">
<div class="echart" ref="charts"></div>
@@ -90,7 +98,13 @@
<div class="advice">
<div class="content">
<p class="title">健康建议</p>
<p>{{ weekResult.Advice || '--' }}</p>
<!-- <p>{{ weekResult.Advice || '--' }}</p> -->
<p>
健康建议抑郁是一种负性情绪,是人们遇到具体生活事件后,出现
的一种不愉快、烦闷压抑的内心体验。情绪受挫折的影响是很正常
的反应,不要任由情绪跟着负面想法走,让自己陷入抑郁之中。与
人沟通,有助于排解不良情绪;把注意力放到当下真正需要关注的 事情中来,积极应对困难,有助于改善现状。
</p>
</div>
</div>
<!-- 概览 -->
@@ -99,9 +113,14 @@
<div class="title">
<span class="title-text">{{ surveyTitle }}</span>
<div class="mood-list">
<div class="item" v-for="(item, index) in emotionList" :key="index">
<div
class="item"
v-for="(item, index) in emotionList"
:key="index"
:style="{ backgroundColor: item.color }"
>
<p>
<span :style="{ color: item.color }" class="day">{{ item.days }}</span>
<span class="day">{{ item.days }}</span>
<span class="day-text">天</span>
<img :src="calcWeekImg(item.days, item.lastDay)" alt="" />
<span class="day-text status">{{ calcWeekImg(item.days, item.lastDay, true) }}</span>
@@ -161,12 +180,12 @@ export default {
} */
],
statisticsList: [
/* { label: "最大值", value: "75", time: "08:15" },
{ label: "最小值", value: "40", time: "10:15" },
{ label: "最近值", value: "50", time: "18:15" } */
/* { label: '最大值', value: '75', time: '08:15', bgColor: '#ff5f8b' },
{ label: '最小值', value: '40', time: '10:15', bgColor: '#189b3b' },
{ label: '最近值', value: '50', time: '18:15', bgColor: '#2ea7e0' } */
],
emotionList: [],
surveyTitle: '本周概',
surveyTitle: '本周概',
echarts: null,
// 路由传过来的情绪参数
emoName: '',
@@ -223,7 +242,8 @@ export default {
params: {},
weekResult: {},
upImg: require('@/assets/today/icons/up.png'),
downImg: require('@/assets/today/icons/down.png')
downImg: require('@/assets/today/icons/down.png'),
signGrid: []
};
},
created() {
@@ -265,7 +285,7 @@ export default {
useUTC: false
},
title: {
text: this.echartsTitle,
/* text: this.echartsTitle, */
left: 1,
right: 25,
bottom: 20,
@@ -343,7 +363,7 @@ export default {
top: '20%',
left: '1%',
right: '5%',
bottom: '15%',
bottom: '5%',
containLabel: true
},
xAxis: {
@@ -386,7 +406,7 @@ export default {
color: '#FFF',
fontSize: 14
},
show: true,
show: false,
height: 25,
bottom: '3%',
handleStyle: {
@@ -628,7 +648,7 @@ export default {
process.env.NODE_ENV === 'production' ? 'https://dbmq.rzliot.com/auth_heart' : 'https://dbmq.rzliot.com/heart';
let reqUrl = `${baseUrl}/api/Data/GetWeekResultDetail`;
let reqParams = {
recordId: this.params.recordId
recordId: /* this.params.recordId */ '1728096156447281486'
};
axios
.get(reqUrl, {
@@ -701,7 +721,8 @@ export default {
? this.currentDays === 0
? this.$dayjs(data.MaxDesc).format('HH:mm')
: this.$dayjs(data.MaxDesc).format('MM/DD HH:mm')
: ''
: '',
bgColor: '#ff5f8b'
};
let Min = {
label: '最小值',
@@ -710,7 +731,8 @@ export default {
? this.currentDays === 0
? this.$dayjs(data.MinDesc).format('HH:mm')
: this.$dayjs(data.MinDesc).format('MM/DD HH:mm')
: ''
: '',
bgColor: '#189b3b'
};
let Avg = {
label: '平均值',
@@ -719,7 +741,8 @@ export default {
? this.currentDays === 0
? this.$dayjs(data.AvgDesc).format('HH:mm')
: this.$dayjs(data.AvgDesc).format('MM/DD HH:mm')
: ''
: '',
bgColor: '#2ea7e0'
};
this.statisticsList.push(Max);
this.statisticsList.push(Min);
@@ -897,11 +920,7 @@ export default {
},
onNavBack() {
this.$router.push({
name: 'emotionDetails',
query: {
uid: this.params.uid,
name: this.params.name
}
name: 'Insight'
});
},
// 计算字体显示的颜色


+ 29
- 30
src/views/today/scss/report.scss Переглянути файл

@@ -9,27 +9,25 @@
height: calc(100vh - 90px);
overflow: scroll;
background-color: #fff;
padding: 0 20px;
.line {
height: 22px;
background-color: $lineGray;
}

.overall-rating {
padding: 46px 30px;
padding: 46px 15px;
margin-bottom: 18px;

.con {
padding: 34px 36px;
padding: 34px 20px;
display: flex;
justify-content: flex-start;
align-items: flex-start;
flex-direction: column;
font-size: 28px;
background: #FFFFFF;
border: 1px solid #535353;
box-shadow: 2px 10px 0px 0px $green;
border-radius: 10px;
border: 1px solid #cdf348;
border-radius: 40px;

p {
font-size: 36px;
@@ -193,21 +191,22 @@
font-size: 32px;

.item {
@include center();
display: flex;
justify-content: flex-start;
align-items: flex-start;
width: 136px;
padding: 10px;
padding: 30px;
/* height: px2rem(136); */
flex-direction: column;
border: 1px solid $border_color;
border-radius: 30px;
color: #fff;
.top {
font-size: 24px;
}

.middle {
font-size: 48px;
font-weight: bold;
padding: 10px;
}

.bottom {
@@ -216,40 +215,41 @@
}
}
}

.chart-title {
padding: 30px;
font-size: 36px;
font-weight: bold;
color: #282828;
}
.bar-chart {
height: 700px;
height: 500px;
background-color: #fff;
padding: 0 10px;

border: 1px solid #cdf348;
border-radius: 70px;
.echart {
height: 700px;
height: 500px;
padding: 0 10px;
}
}

.advice {
padding: 52px 30px 60px 30px;

padding: 52px 20px 60px 20px;
.content {
background: #F2F6FF;
border-radius: 20px;
padding: 40px 30px;
padding: 0px 10px;
text-align: left;

p {
font-size: 30px;
font-weight: 400;
font-size: 24px;
color: #707070;
line-height: 46px;
}

.title {
font-size: 36px;
font-size: 26px;
font-weight: bold;
color: $green;
/* color: $green; */
line-height: 36px;
padding-bottom: 26px;
}
}
}
@@ -277,20 +277,19 @@

.item {
width: 214px;
height: 198px;
background-color: #F2F6FF;
height: 250px;
display: flex;
justify-content: center;
align-items: flex-start;
flex-direction: column;
padding-left: 60px;

color: #fff;
border: 1px solid #cdf348;
border-radius: 40px;
p {
font-size: 28px;
padding: 0;
color: #666666;
@include center();
/* align-items: flex-end; */
.day {
/* padding: 5px; */
font-size: 56px;


Завантаження…
Відмінити
Зберегти