健康咨询平台实时时间

This commit is contained in:
huangzhen
2025-09-30 10:18:06 +08:00
26 changed files with 841 additions and 316 deletions
+5 -3
View File
@@ -22,6 +22,8 @@ export const Map = {
emergencyMarker: null, // 应急人员marker
startMarker: null,
endMarker: null,
driving: null,
walking: null,
/**
* @desc 地图舒适化
* @param el dom元素 id选择器
@@ -246,7 +248,7 @@ export const Map = {
ctx.textAlign = 'right';
ctx.textBaseline = 'middle';
ctx.fillStyle = '#ffffff';
ctx.fillText(text, 25, 10);
ctx.fillText(text, 24.5, 10.8);
resolve(canvas.toDataURL());
};
@@ -431,13 +433,13 @@ export const Map = {
* @desc 创建地图详情弹窗
*
* */
createInfoModal({ option, content }) {
createInfoModal({ option, content }, flag = true) {
let { latitude, longitude } = option;
this.infoWindow = new AMap.InfoWindow({
position: [longitude, latitude],
offset: new AMap.Pixel(-8, -25),
content: content,
closeWhenClickMap: true,
closeWhenClickMap: flag,
});
this.infoWindow.open(this.map);
},
@@ -82,10 +82,12 @@
if (props.afterFetch && isFunction(props.afterFetch)) {
dataSource.value = props.afterFetch({ result, setPage: setPage, setDataSource: setDataSource });
} else {
dataSource.value = result?.records;
dataSource.value = result?.records ? result?.records : result;
}
if (result.hasOwnProperty('records')) {
paginationProp.value = { ...paginationProp.value, ...result };
paginationProp.value.pageSize = result.size;
}
paginationProp.value = { ...paginationProp.value, ...result };
paginationProp.value.pageSize = result.size;
}
} catch (e) {
dataSource.value = [];
+5
View File
@@ -0,0 +1,5 @@
<svg t="1758877481917" class="icon" viewBox="0 0 1654 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="6865"
width="20" height="20">
<path d="M827.076923 78.769231C590.769231 78.769231 393.846154 259.938462 393.846154 496.246154 393.846154 764.061538 590.769231 945.230769 827.076923 945.230769S1260.307692 771.938462 1260.307692 496.246154c0-236.307692-196.923077-417.476923-433.230769-417.476923zM0 456.861538h315.076923v78.769231H0v-78.769231z m1339.076923 70.892308c0 275.692308-228.430769 496.246154-512 496.246154S315.076923 803.446154 315.076923 527.753846v-31.507692C315.076923 228.430769 535.630769 7.876923 811.323077 0h15.753846c259.938462 0 480.492308 189.046154 512 441.107692v15.753846h315.076923v78.769231h-315.076923z"
fill="#979797" p-id="6866"></path>
</svg>

After

Width:  |  Height:  |  Size: 807 B

+2
View File
@@ -0,0 +1,2 @@
export const iconPath: string =
'path://M827.076923 78.769231C590.769231 78.769231 393.846154 259.938462 393.846154 496.246154 393.846154 764.061538 590.769231 945.230769 827.076923 945.230769S1260.307692 771.938462 1260.307692 496.246154c0-236.307692-196.923077-417.476923-433.230769-417.476923zM0 456.861538h315.076923v78.769231H0v-78.769231z m1339.076923 70.892308c0 275.692308-228.430769 496.246154-512 496.246154S315.076923 803.446154 315.076923 527.753846v-31.507692C315.076923 228.430769 535.630769 7.876923 811.323077 0h15.753846c259.938462 0 480.492308 189.046154 512 441.107692v15.753846h315.076923v78.769231h-315.076923z';
+2 -2
View File
@@ -24,7 +24,7 @@ const routes: Array<RouteRecordRaw> = [
meta: {
title: '副屏',
},
component: () => import('/@/views/indexSun.vue'),
component: () => import('/@/views/healthConsultation/HealthConsultationIndex.vue'),
},
{
path: '/home',
@@ -32,7 +32,7 @@ const routes: Array<RouteRecordRaw> = [
meta: {
title: '健康咨询',
},
component: () => import('../views/healthConsultation/HealthConsultationIndex.vue'),
component: () => import('/@/views/indexSun.vue'),
},
{
path: '/indexSon',
+7 -7
View File
@@ -32,10 +32,10 @@ export function getToday() {
}
//分钟转小时
export function minuteToStr(minutes) {
export function minuteToStr(minutes: any) {
if (!minutes) return '0分';
let h = Math.floor(minutes / 60);
let m = Math.floor(minutes % 60);
const h: any = Math.floor(minutes / 60);
const m: any = Math.floor(minutes % 60);
if (h) {
return `${h}小时${m > 0 ? `${m}分钟` : ''}`;
}
@@ -43,12 +43,12 @@ export function minuteToStr(minutes) {
}
//处理echarts-环形图 数据为0时不显示label
export function visibleChartLabel(chartData) {
export function visibleChartLabel(chartData: any) {
const data = cloneDeep(chartData);
let list = data?.map((item) => item?.value);
let flag = list.every((item) => item == 0);
const list: any = data?.map((item: any) => item?.value);
const flag: any = list.every((item: any) => item == 0);
if (!flag) {
data.forEach((val) => {
data.forEach((val: any) => {
if (val.value == 0) {
val.value = 0;
}
+1
View File
@@ -87,6 +87,7 @@
closeDialog();
emit('confirmHelp', {
...userInfo.value,
emergencyType: userInfo.value?.popType + '',
hospitalList: list.map((item: any) => {
item['latitude'] = item['lat'];
item['longitude'] = item['lon'];
+41 -1
View File
@@ -14,7 +14,7 @@
</div>
<div class="con-item">
<span>二级单位</span>
<span>{{ userInfo?.orgName }}</span>
<span>{{ userInfo?.deptName }}</span>
</div>
<div class="con-item">
<span>手机号码</span>
@@ -32,6 +32,9 @@
<span>发生地点</span>
<span>{{ userInfo?.address || userInfo?.gpsErrorMsg }}</span>
</div>
<div class="btn-box">
<a-button type="primary" @click="confirmHelp" :loading="helpLoading">确认</a-button>
</div>
</div>
</template>
</Dialog>
@@ -41,12 +44,15 @@
import { useDialog } from '/@/views/components/dialogHooks.ts';
import { watch, ref } from 'vue';
import { useTheme } from '/@/hooks/theme/useTheme.ts';
import { nearResourcesApi } from '/@/views/indexSun/indexSun.api.ts';
const props = defineProps({
record: Object,
});
const userInfo = ref({});
const { themeType } = useTheme();
const helpLoading = ref<boolean>(false);
const emit = defineEmits(['confirmHelp']);
watch(
() => props.record,
(nVal) => {
@@ -55,6 +61,35 @@
);
const { visible, title, closeDialog, openDialog } = useDialog({ title: '健康监测工具报警' });
//确认帮助
async function confirmHelp() {
let list: any = [];
try {
helpLoading.value = true;
const res: any = await nearResourcesApi({ longitude: userInfo.value?.lon, latitude: userInfo.value?.lat });
if (res.code === 200) {
list = res.result || [];
}
} catch (err: any) {
console.error(err);
} finally {
helpLoading.value = false;
}
closeDialog();
emit('confirmHelp', {
...userInfo.value,
departName: userInfo.value?.deptName,
orgName: userInfo.value?.orgName,
emergencyType: '3',
userId: userInfo.value?.bindUserId,
hospitalList: list.map((item: any) => {
item['latitude'] = item['lat'];
item['longitude'] = item['lon'];
return item;
}),
});
}
defineExpose({
openDialog,
});
@@ -89,4 +124,9 @@
}
}
}
.btn-box {
text-align: center;
margin-top: 2%;
}
</style>
@@ -33,6 +33,7 @@
import healthContentBottomItem2 from './components/healthContentBottomItem2.vue';
import healthContentBottomItem3 from './components/healthContentBottomItem3.vue';
import healthContentBottomItem4 from './components/healthContentBottomItem4.vue';
import { ref, onMounted, watch, onUnmounted } from 'vue';
import dayjs from 'dayjs';
import { startTime } from '/@/utils/utils.ts';
@@ -72,6 +73,7 @@
getTime();
updateRightDate();
startTimer(); // 启动定时器
document.title = '健康咨询平台';
});
watch(
@@ -97,7 +99,7 @@
background-size: 100% 100%;
.sun-screen-title {
height: 87px;
height: 80px;
background: url('/@/assets/indexSun/bg.png') no-repeat;
background-size: 100% 100%;
display: flex;
@@ -125,10 +127,10 @@
.sun-title-center {
flex: 1;
font-size: 58px;
font-size: 50px;
letter-spacing: 10px;
// text-shadow: 2px 2px 5px rgba(118, 141, 219, 0.53);
font-weight: 400;
font-weight: bold;
font-family: PangMenZhengDao;
}
}
@@ -10,19 +10,11 @@
import * as echarts from 'echarts';
import { getDocCountStat } from '/@/views/healthConsultation/api/health';
import { iconPath } from '/@/router/iconPath.ts';
const chartRef = ref<HTMLDivElement | null>(null);
let chartInstance: echarts.ECharts | null = null;
// const total = 2920;
// const data = [
// { name: '新疆医科大学第一附属医院', value: 650 },
// { name: '昌吉州宝石花医院', value: 422 },
// { name: '新疆维吾尔自治区人民医院', value: 928 },
// { name: '新克拉玛依市中心医院', value: 560 },
// ];
const transformHospitalData = (hospitals: { docCount: number; hospitalName: string }[]) => {
return hospitals.map((hospital) => ({
name: hospital.hospitalName,
@@ -54,36 +46,29 @@
chartInstance = echarts.init(chartRef.value);
const option: echarts.EChartsOption = {
// title: {
// text: '医院专家数量统计',
// left: 'center',
// top: 10,
// textStyle: {
// color: '#fff',
// fontSize: 18,
// fontWeight: 'bold',
// },
// },
tooltip: {
trigger: 'item',
formatter: '{b}: {c}人 ({d}%)',
position: 'right',
},
series: [
{
name: '专家人数',
type: 'pie',
radius: ['30%', '40%'],
center: ['50%', '55%'],
radius: ['30%', '50%'],
center: ['40%', '50%'],
data: value,
minAngle: 10,
label: {
position: 'outside',
show: true,
color: '#fff',
fontSize: 12,
lineHeight: 20,
fontSize: 10,
lineHeight: 19,
formatter: (params: any) => {
const name: string = params.name;
const value: number = params.value;
const maxLen = 6; // 超过 6 个字就换行
const maxLen = name.length > 10 ? 6 : 5;
let newName = '';
for (let i = 0; i < name.length; i += maxLen) {
@@ -93,18 +78,27 @@
return `${newName}(${value}人)`;
},
},
// itemStyle: {
// borderRadius: 5,
// borderColor: '#0f2c44',
// borderWidth: 2,
labelLine: {
show: true,
length: 20, // 第一段线长度(从圆到转折点)
length2: 15, // 第二段线长度(从转折点到文字)
smooth: 0.2, // 平滑度
lineStyle: {
width: 2,
type: 'solid',
},
},
// emphasis: {
// scale: true,
// scaleSize: -10,
// },
},
],
graphic: [
{
type: 'text',
left: 'center',
top: '48%',
left: '34%',
top: '44%',
style: {
text: `总人数`,
// textAlign: 'center',
@@ -116,8 +110,8 @@
},
{
type: 'text',
left: 'center',
top: '56%', // 第二行位置
left: '37%',
top: '53.7%', // 第二行位置
style: {
// text: `${total}`,
text: `${getTotalDocCount(value)}`,
@@ -132,78 +126,32 @@
legend: [
{
orient: 'vertical',
left: 20,
top: 10,
itemGap: 10,
icon: 'path://M200 512 H307 a154,154 0 1,0 308,0 a154,154 0 1,0 -308,0 H824',
right: 20,
top: 'center',
icon: iconPath,
formatter: (name) => {
let newName = [];
const maxLen = 6; // 超过 6 个字就换行
for (let i = 0; i < name.length; i += maxLen) {
newName.push(name.substring(i, i + maxLen));
}
return `{name|${newName.join('\n')}}`;
},
textStyle: {
color: '#fff',
fontSize: 12,
fontSize: 10,
rich: {
name: {
fontSize: 12,
lineHeight: 12,
fontSize: 10,
color: '#fff',
align: 'left', // 左对齐
// lineHeight: 20,
fontFamily: 'HarmonyOS Sans SC',
verticalAlign: 'middle',
},
// value: {
// fontSize: 14,
// color: '#aaa',
// align: 'left', // 左对齐
// lineHeight: 20,
// },
},
},
// data: [data[0].name, data[3].name],
data:
value && Array.isArray(value)
? value
.filter((_, index) => index % 2 === 0)
.slice(0, 2)
.map((item) => item.name || '')
: ['', ''],
// formatter: (name: string) => {
// const item = data.find((d) => d.name === name);
// return `{name|${name}}\n{value|${item?.value}人}`;
// },
},
{
orient: 'vertical',
right: 20,
top: 10,
itemGap: 10,
icon: 'circle',
textStyle: {
color: '#fff',
fontSize: 12,
rich: {
name: {
fontSize: 12,
color: '#fff',
align: 'right', // 右对齐
// lineHeight: 20,
},
// value: {
// fontSize: 14,
// color: '#aaa',
// align: 'right', // 右对齐
// lineHeight: 20,
// },
},
},
// data: [data[1].name, data[2].name],
data:
value && Array.isArray(value)
? value
.filter((_, index) => index % 2 === 1)
.slice(0, 2)
.map((item) => item.name || '')
: ['', ''],
// formatter: (name: string) => {
// const item = data.find((d) => d.name === name);
// return `{name|${name}}\n{value|${item?.value}人}`;
// },
data: value,
},
],
color: colors,
@@ -10,6 +10,7 @@
import * as echarts from 'echarts';
import { getDeptCountStat } from '/@/views/healthConsultation/api/health';
import { iconPath } from '/@/router/iconPath.ts';
const chartRef = ref<HTMLDivElement | null>(null);
let chart: echarts.ECharts | null = null;
@@ -36,6 +37,7 @@
const option: echarts.EChartsOption = {
backgroundColor: 'transparent',
tooltip: {},
// title: {
// text: '单位咨询数量统计',
// left: 'center',
@@ -53,7 +55,7 @@
itemGap: 30, // 默认 10,这里改成 30,让两段文字隔开一些
// 圆环 icon
// icon: 'path://M512 0a512 512 0 1 0 0 1024A512 512 0 0 0 512 0zm0 896a384 384 0 1 1 0-768 384 384 0 0 1 0 768z',
icon: 'circle',
icon: iconPath,
data: ['员工咨询全科医生', '员工咨询专家'],
},
grid: {
@@ -10,6 +10,7 @@
import * as echarts from 'echarts';
import { getDepartmentCountStat } from '/@/views/healthConsultation/api/health';
import { iconPath } from '/@/router/iconPath.ts';
const chartRef = ref<HTMLDivElement | null>(null);
let chart: echarts.ECharts | null = null;
@@ -36,6 +37,7 @@
const option: echarts.EChartsOption = {
backgroundColor: 'transparent',
tooltip: {},
// title: {
// text: '科室咨询数量统计',
// left: 'center',
@@ -51,9 +53,7 @@
itemWidth: 20,
itemHeight: 16,
itemGap: 30, // 默认 10,这里改成 30,让两段文字隔开一些
// 圆环 icon
// icon: 'path://M512 0a512 512 0 1 0 0 1024A512 512 0 0 0 512 0zm0 896a384 384 0 1 1 0-768 384 384 0 0 1 0 768z',
icon: 'circle',
icon: iconPath,
data: ['图文', '视频'],
},
grid: {
@@ -10,6 +10,7 @@
import * as echarts from 'echarts';
import { getHospitalCountStat } from '/@/views/healthConsultation/api/health';
import { iconPath } from '/@/router/iconPath.ts';
const chartRef = ref<HTMLDivElement | null>(null);
let chart: echarts.ECharts | null = null;
@@ -67,6 +68,7 @@
const option: echarts.EChartsOption = {
backgroundColor: 'transparent',
tooltip: {},
// title: {
// text: '单位咨询数量统计',
// left: 'center',
@@ -82,9 +84,7 @@
itemWidth: 20,
itemHeight: 16,
itemGap: 30, // 默认 10,这里改成 30,让两段文字隔开一些
// 圆环 icon
// icon: 'path://M512 0a512 512 0 1 0 0 1024A512 512 0 0 0 512 0zm0 896a384 384 0 1 1 0-768 384 384 0 0 1 0 768z',
icon: 'circle',
icon: iconPath,
data: ['图文', '视频'],
},
grid: {
@@ -1,6 +1,13 @@
<template>
<swiper :slides-per-view="1" :space-between="10" :loop="true" :autoplay="{ delay: 10000, disableOnInteraction: false }" class="mySwiper">
<swiper-slide v-for="(page, index) in pages" :key="index">
<swiper
v-if="pages().length > 0"
:slides-per-view="1"
:space-between="10"
:loop="true"
:autoplay="{ delay: 10000, disableOnInteraction: false }"
class="mySwiper"
>
<swiper-slide v-for="(page, index) in pages()" :key="index">
<div class="grid-container">
<div v-for="item in page" :key="item.id" class="item">
<div class="item-left">
@@ -9,7 +16,7 @@
<div class="item-right">
<div class="name">
<span>{{ item.doctorName }}</span>
<span class="position">{{ item.doctorJob_dictText }}</span>
<span class="position">{{ item.doctorTitle_dictText }}</span>
</div>
<div class="hospital">{{ item.resourceName }} | {{ item.departmentName }}</div>
<div class="experience">
@@ -28,7 +35,7 @@
</template>
<script setup lang="ts">
import { onMounted, ref, computed } from 'vue';
import { onMounted, ref } from 'vue';
import { Swiper, SwiperSlide } from 'swiper/vue';
import 'swiper/css';
import 'swiper/css/navigation';
@@ -60,13 +67,15 @@
// 将每 6 个元素分为一页
const items = ref<Doctor[]>([]);
const pages = computed(() => {
const pages = () => {
const result: Doctor[][] = [];
for (let i = 0; i < items.value.length; i += 6) {
result.push(items.value.slice(i, i + 6));
}
console.log(result);
return result;
});
};
function getData() {
getDocList()
+207 -75
View File
@@ -7,7 +7,8 @@
</div>
<div class="sun-title-center">{{ getCenterInfo.screenTitle || '健康服务中心' }}</div>
<div class="sun-title-right">
<a-button class="top-right-button" @click="toOther">健康监测大屏</a-button>
<a-button class="top-right-button" @click="toZ">咨询服务平台</a-button>
<a-button class="top-right-button" @click="toOther" :loading="otherLoading">健康监测大屏</a-button>
</div>
</div>
<div class="sun-body-content">
@@ -34,6 +35,7 @@
:hospitalList="hospitalList"
@clear-hospital-list="clearHospitalList"
:show-rest-b="showRestB"
:user-data="userData"
@handle-detail="handleCenterMapClick"
:show-map-bottom="showMapBottom"
@show-rest-b="
@@ -47,7 +49,7 @@
</div>
<div class="sun-body-right">
<div class="sun-body-right-one">
<one-right-new :user-data="userData" @handle-view="handleOneRightView" @handle-archives="handleArchives" />
<one-right-new :user-data="userData" @handle-view="handleOneRightView" @handle-emer="handleEmer" />
</div>
<div class="sun-body-right-two">
<oneR
@@ -68,7 +70,7 @@
</div>
<PhoneDialog ref="phoneDialogRef" :title="phoneDialogTitle" :useForm="true" :setting="setting" :phoneType="phoneType" />
<!-- 健康监测弹窗 -->
<EmployeeDialog ref="employeeDialogRef" :record="socketData" />
<EmployeeDialog ref="employeeDialogRef" :record="socketData" @confirm-help="confirmHelp" />
<!-- 应急、120弹窗 -->
<EmergencyDialog ref="emergencyDialogRef" :record="socketData1" @confirm-help="confirmHelp" />
<IndexModal
@@ -83,13 +85,22 @@
:twoROnly="twoROnly"
>
<template #bodyCell="{ column, record }">
<template v-if="column.dataIndex === 'd'">
<template v-if="record?.latitude && record?.longitude">
<environment-outlined style="height: auto !important; color: #178ef2 !important" @click="forHelp(record)" />
</template>
<template v-else>
<span style="color: red">未获取到位置信息</span>
</template>
</template>
<template v-if="column.dataIndex === 'cz'">
<a-button type="link" @click="forHelp(record)">助信息</a-button>
<a-button type="link" @click="forHelp(record)">助信息</a-button>
</template>
</template>
</IndexModal>
</template>
<script setup lang="ts">
import { EnvironmentOutlined } from '@ant-design/icons-vue';
import OneL from '/@/views/indexSun/oneL.vue';
import twoL from '/@/views/indexSun/twoL.vue';
import oneR from '/@/views/indexSun/oneR.vue';
@@ -99,8 +110,10 @@
centerMapColumns,
centerMapFromList,
columns,
contactListColumns,
fromLists,
infoContentSpecial,
monitorColumns,
oneRNewColumns,
threeRModalColumns,
threeRModalFromList,
@@ -125,9 +138,12 @@
const { getCenterInfo, setCount } = useUserStore();
import {
healthArchivesApi,
careUserApi,
contactListApi,
nearResourcesApi,
oneLApi,
oneRApi,
queryAnYanTokenApi,
roomDetailApi,
threeRModalApi,
todayEmergencyListApi,
@@ -141,6 +157,7 @@
import ThreeLeftNew from '/@/views/indexSun/threeLeftNew.vue';
import OneRightNew from '/@/views/indexSun/oneRightNew.vue';
import TwoNewR from '/@/views/indexSun/twoNewR.vue';
import { message } from 'ant-design-vue';
//0:处置 1:处理 2:呼入 3:全部
const phoneType = ref('');
const phoneDialogTitle = ref('呼入电话');
@@ -165,6 +182,7 @@
const showMapBottom = ref(false);
const userData = ref<object>({});
const centerMapRef = ref();
const otherLoading = ref<boolean>(false);
onMounted(() => {
getTime();
@@ -201,6 +219,8 @@
indexModalRef.value.closeDialog();
record['lat'] = record?.latitude;
record['lon'] = record?.longitude;
Map.driving && Map.driving.clear();
Map.walking && Map.walking.clear();
if (record['lat']) {
let list: any = [];
const res: any = await nearResourcesApi({ longitude: record?.lon, latitude: record?.lat });
@@ -217,11 +237,30 @@
showRestB.value = false;
userData.value = record;
}
confirmHelp(record);
await confirmHelp(record);
}
function toOther() {
window.open('http://aygc.jy.pc.iosp.ydpt.tech/envShow/envFullscreen', '_blank');
otherLoading.value = true;
queryAnYanTokenApi()
.then((res: any) => {
if (res.code === 200) {
otherLoading.value = false;
window.open('http://aygc.pc.iosp.ydpt.tech/monitor/health?tokens=' + res?.result, '_blank');
} else {
message.error(res?.message);
}
})
.catch((err) => {
otherLoading.value = false;
console.log(err);
});
}
async function toZ() {
const routeUrl = router.resolve({
path: '/home2',
}).href;
window.open(routeUrl, '_blank');
}
function handleOneLeftClick(item: any) {
@@ -259,8 +298,17 @@
}
function handleOneRClick() {
router.push({
path: '/indexSon',
// router.push({
// path: '/indexSon',
// });
indexModalTitle.value = '健康终端报警';
indexColumn.value = monitorColumns;
firstFormOne.value = [];
twoROnly.value = '';
modalApi.value = oneRApi;
needDept.value = true;
nextTick(() => {
indexModalRef.value.openDialog();
});
}
@@ -269,7 +317,7 @@
const { socketData, setSocketData, closeSocket } = useSocket(socketUrl);
const employeeDialogRef = ref();
function employeeDialogOpen() {
function openEmergencyOpen() {
setSocketData1({
userId: '1942871719583739905',
phone: '15129287781',
@@ -294,6 +342,60 @@
});
emergencyDialogRef.value.openDialog();
}
function employeeDialogOpen() {
setSocketData({
watchNo: 'A5GTQ24920002519',
eventType: 'a_key_alarm',
eventType_dictText: '一键告警',
bindUserId: '1942871719583739905',
bindDate: '2025-07-23',
createBy: 'apiusername',
createDate: '2025-09-25 15:01:11',
dataValue: '',
address: null,
lon: 0,
lat: 0,
dataDate: '2025-09-25',
warnTime: '2025-09-25 15:00:03',
gpsErrorMsg: '定位超时',
lonGd: null,
latGd: null,
addressGd: null,
sendFlag: '0',
largeScreenFlag: '0',
orgCode: 'A01A01A02',
orgName: '硬件部',
realName: '连龙刚',
phone: '15129287781',
hospitalList: [
{
name: '跃满油田作业区',
lon: 82.9955,
lat: 40.787056,
},
{
name: '跃满油田作业区',
lon: 82.9955,
lat: 40.787056,
},
{
name: '采油一厂稠油小屋',
lon: 84.881775,
lat: 44.987652,
},
],
centerId: '1940693902422519809',
popType: 3,
keyUser: '0',
avatar: null,
sex: 2,
age: 37,
workNo: '2025001',
deptName: '软硬件开发部',
audioUrl: null,
});
employeeDialogRef.value.openDialog();
}
setTimeout(() => {
// employeeDialogOpen();
@@ -327,73 +429,98 @@
const showHospitalList = ref(false);
async function confirmHelp(data: any) {
if (!data.lon) return (showMapBottom.value = true);
Map.driveLine && Map.driveLine.clear();
try {
const res = await careUserApi({ userId: data?.userId });
data['careLiaisonName'] = res?.result?.careLiaisonName;
data['careLiaisonPhone'] = res?.result?.careLiaisonPhone;
data['lifeguardName'] = res?.result?.lifeguardName;
data['lifeguardPhone'] = res?.result?.lifeguardPhone;
} catch (err) {
console.log(err);
}
userData.value = data;
if (!data.lon || !data.lat) {
centerMapRef.value.newResetMap();
showMapBottom.value = true;
return;
}
Map.removeOverlayGroup();
hospitalList.value = data.hospitalList;
// showHospitalList.value = true;
//用户的坐标信息
let point = [data.lon, data.lat];
// if (data.hospitalList && data.hospitalList.length > 0) {
// try {
const a = ((await getHospitalList(data.hospitalList, point)) as any) || [];
hospitalList.value = a.sort((a: any, b: any) => a.distance - b.distance);
// showHospitalList.value = true;
// } catch (error) {
// console.log('获取医院列表时出错:', error);
// }
// } else {
// console.log('没有医院list');
// }
// showMapBottom.value = true;
const arr = await Map.createOverlay1(
[...hospitalList.value, { latitude: data.lat, longitude: data.lon }],
{
content: (val) => {
return `<div style="
try {
hospitalList.value = data.hospitalList;
// showHospitalList.value = true;
//用户的坐标信息
let point = [data.lon, data.lat];
centerMapRef.value.setStartPosition(data);
// if (data.hospitalList && data.hospitalList.length > 0) {
// try {
const a = ((await getHospitalList(data.hospitalList, point)) as any) || [];
hospitalList.value = a.sort((a: any, b: any) => a.distance - b.distance);
// showHospitalList.value = true;
// } catch (error) {
// console.log('获取医院列表时出错:', error);
// }
// } else {
// console.log('没有医院list');
// }
// showMapBottom.value = true;
const arr = await Map.createOverlay1(
[...hospitalList.value, { latitude: data.lat, longitude: data.lon }],
{
content: (val: any) => {
return `<div style="
width: 21px;
height: 44px;
position: absolute;
left: -20px;
top: -20px;" title="${val?.name}">
</div>`;
},
},
},
async (val) => {
if (val.type == '3') {
Map.createInfoModal({ option: val, content: infoContentSpecial(val) });
} else if (val.type == '4') {
Map.createInfoModal({ option: val, content: infoContentSpecial(val) });
} else {
Map.createInfoModal({ option: val, content: infoContentSpecial(val) });
}
Map.clearNaviLine();
Map.createNaviLine([val.lon, val.lat], [data.lon, data.lat]);
// const viewBtn = document.getElementById(val.id);
// viewBtn.onclick = () => {
// handleClcikDetail(val);
// };
('');
},
true,
'1'
);
async (val) => {
if (val.type == '3') {
Map.createInfoModal({ option: val, content: infoContentSpecial(val) }, false);
} else if (val.type == '4') {
Map.createInfoModal({ option: val, content: infoContentSpecial(val) }, false);
} else {
Map.createInfoModal({ option: val, content: infoContentSpecial(val) }, false);
}
const end = await Map.getAddressByPoint([val.lon, val.lat]);
if (!data?.address) {
data['address'] = await Map.getAddressByPoint([data.lon, data.lat]);
}
centerMapRef.value.getSearch({
startPosition: [data.lon, data.lat],
endPosition: [val.lon, val.lat],
start: data['address'],
end,
});
('');
},
true,
'1'
);
Map.getAddressByPoint(point)
.then((res) => {
const option = {
lon: data.lon,
lat: data.lat,
position: point,
name: data.realName,
address: res,
sex: data.sex,
};
Map.createEmergencyMarker(option);
Map.map.setFitView([...arr, Map.emergencyMarker], false, [180, 180, 180, 180]);
})
.catch((err) => {});
userData.value = data;
Map.getAddressByPoint(point)
.then((res) => {
const option = {
lon: data.lon,
lat: data.lat,
position: point,
name: data.realName,
address: res,
sex: data.sex,
};
Map.createEmergencyMarker(option);
Map.map.setFitView([...arr, Map.emergencyMarker], false, [180, 180, 180, 180]);
})
.catch((err: any) => {
console.log(err);
});
} catch (e: any) {
console.log(e);
}
}
async function getHospitalList(hospitalList, userLocation) {
@@ -552,8 +679,8 @@
firstFormOne.value = [];
const params = {
centerId: centerId.value,
startDate: '2000-01-01',
endDate: '2025-09-25',
// startDate: '2000-01-01',
// endDate: '2030-12-31',
};
indexModalTitle.value = '今日应急';
modalApi.value = todayEmergencyListApi;
@@ -562,14 +689,14 @@
indexModalRef.value.openDialog();
});
}
function handleArchives(userId: string) {
indexColumn.value = oneRNewColumns;
function handleEmer(userId: string) {
indexColumn.value = contactListColumns;
firstFormOne.value = [];
const params = {
userId: userId,
userId,
};
indexModalTitle.value = '今日应急';
modalApi.value = healthArchivesApi;
indexModalTitle.value = '紧急联系人';
modalApi.value = contactListApi;
apiParams.value = params;
nextTick(() => {
indexModalRef.value.openDialog();
@@ -617,6 +744,11 @@
text-align: right;
line-height: 50px;
padding-right: 30px;
> button {
&:nth-child(1) {
margin-right: 10px;
}
}
}
.sun-title-center {
+157 -43
View File
@@ -23,7 +23,8 @@
<div class="reset-map" :class="[themeType]" @click="resetMap">
<RedoOutlined title="重置地图" />
</div>
<div v-show="showRoutePanel" v-click-outside="outClick" class="line-container">
<!-- <div v-show="showRoutePanel" v-click-outside="outClick" class="line-container" :class="['no-top']">-->
<div v-show="showRoutePanel" class="line-container" :class="[currentIndex !== list.length - 1 ? 'no-top' : '']">
<div v-show="routeList.length > 0" class="has-data">
<div class="line-title"> {{ panelTitle }}</div>
<div class="line-content">
@@ -68,7 +69,7 @@
<div>
<img :src="noLocationPng" alt="" />
</div>
<div> 未获取到当前救助人员的位置信息 </div>
<div> 未获取到当前求助信息的位置信息 </div>
</div>
</div>
</div>
@@ -97,6 +98,8 @@
const formState = ref({
start: '',
end: '',
startPosition: [],
endPosition: [],
});
// 1 aed 2 健康小屋 3 油田医院 4 救护车
const numList = reactive([useStore.getTypeThree, useStore.getTypeOne, useStore.getTypeFive, useStore.getTypeFour]);
@@ -127,14 +130,17 @@
type: Boolean,
default: () => false,
},
userData: {
type: Object,
default: () => {},
},
});
const showRoutePanel = ref(false);
const panelTitle = ref();
const level = ref(0);
const routeList = ref([]);
const routeList = ref<any[]>([]);
const emits = defineEmits(['clearHospitalList', 'showRestB', 'handleDetail']);
let placeSearch = null;
let driving = null;
let placeSearch: any = null;
watch(
() => props.showHospitalList,
(v) => {
@@ -169,11 +175,11 @@
$bus.on(earlyWarning, (params) => {
drawMarker(params);
});
document.addEventListener('click', (e) => {
document.addEventListener('click', (e: any) => {
let t = e.target.closest('.viewBtn');
if (t) {
if (t.id) {
handleClcikDetail(JSON.parse(t.id));
handleClickDetail(JSON.parse(t.id));
}
}
});
@@ -185,17 +191,20 @@
const poi = result.poiList.pois[0]; // 取第一个结果
const { lat, lng } = poi.location;
formState.value.start = poi.name;
formState.value.startPosition = [lng, lat];
Map.createSMarker([lng, lat]);
Map.map.setZoom(15);
}
});
}
function endSelect(e: any) {
placeSearch.search(e.poi.name, function (status, result) {
if (status === 'complete' && result.poiList.pois.length > 0) {
const poi = result.poiList.pois[0]; // 取第一个结果
const { lat, lng } = poi.location;
formState.value.end = poi.name;
formState.value.endPosition = [lng, lat];
Map.createEMarker([lng, lat]);
Map.map.setZoom(15);
}
@@ -205,7 +214,7 @@
function showDrivingLine(item) {
nextTick(() => {
panelTitle.value = '全程' + item.driveTime + item.distance;
routeList.value = item.routeList?.map((item) => item?.instruction);
routeList.value = item.routeList?.map((item: any) => item?.instruction);
if (item.lon) {
Map.clearNaviLine();
Map.createNaviLine(item.userLocation, [item.lon, item.lat]);
@@ -221,14 +230,46 @@
function removeInput() {
formState.value.start = '';
formState.value.startPosition = [];
formState.value.end = '';
formState.value.endPosition = [];
searchFlag.value = false;
Map.startMarker && Map.startMarker?.setMap(null);
Map.endMarker && Map.endMarker?.setMap(null);
Map.driving && Map.driving.clear();
Map.walking && Map.walking.clear();
}
function changeTab(item: any, i: number) {
closeDrivingElement();
currentIndex.value = i;
closeDrivingElement();
tab(item);
if (item.hasOwnProperty('type')) {
formState.value.startPosition = [];
formState.value.endPosition = [];
emits('showRestB');
} else {
setInfoByUserData(props.userData);
}
}
function setInfoByUserData(data: any) {
if (data?.address) {
formState.value.start = data.address;
formState.value.startPosition = [data?.lon, data?.lat];
} else {
if (data?.lon && data?.lat) {
formState.value.startPosition = [data?.lon, data?.lat];
Map.getAddressByPoint([data?.lon, data?.lat])
.then((res: any) => {
formState.value.start = res;
})
.catch((err) => {
console.log(err);
formState.value.start = '';
});
}
}
}
function tab(item: any) {
@@ -242,7 +283,7 @@
tab(item);
}
function searchRoute(callback: ((this: MediaQueryList, ev: MediaQueryListEvent) => any) | null) {
async function searchRoute(callback: ((this: MediaQueryList, ev: MediaQueryListEvent) => any) | null) {
showRoutePanel.value = false;
panelTitle.value = '';
if (!formState.value.start) {
@@ -251,44 +292,83 @@
if (!formState.value.end) {
return message.warn('请输入终点');
}
getSearch(formState.value);
}
function getSearch({ startPosition, endPosition, start, end }) {
Map.driving && Map.driving.clear();
Map.walking && Map.walking.clear();
const distance = Map.getDistance(startPosition, endPosition);
searchFlag.value = true;
// let map = new Map.aMap.Map('container', {
// resizeEnable: true,
// center: [116.397428, 39.90923], //地图中心点
// zoom: 13, //地图显示的缩放级别
// });
driving = new Map.aMap.Driving({
map: Map.map,
panel: 'panel',
});
driving.search([{ keyword: formState.value.start }, { keyword: formState.value.end }], function (status, result) {
// result 即是对应的驾车导航信息,相关数据结构文档请参考 https://lbs.amap.com/api/javascript-api/reference/route-search#m_DrivingResult
if (status === 'complete') {
// console.log('绘制驾车路线完成');
if (distance > 2000) {
Map.driving = new Map.aMap.Driving({
map: Map.map,
panel: 'panel',
});
Map.driving.search([{ keyword: start }, { keyword: end }], function (status: any) {
// result 即是对应的驾车导航信息,相关数据结构文档请参考 https://lbs.amap.com/api/javascript-api/reference/route-search#m_DrivingResult
if (status === 'complete') {
// console.log('绘制驾车路线完成');
searchFlag.value = false;
} else {
searchFlag.value = false;
}
});
Map.aMap.Event.addListener(Map.driving, 'complete', (res: any) => {
const data = JSON.parse(JSON.stringify(res));
searchFlag.value = false;
} else {
if (data.info == 'OK') {
const { routes } = data;
setTitle(routes[0]);
let arr = [];
arr.push(data.originName);
routes[0].steps.map((item: any) => {
arr.push(item.instruction);
});
arr.push(data.destinationName);
showRoutePanel.value = true;
routeList.value = arr;
}
});
} else {
Map.walking = new Map.aMap.Walking({
map: Map.map,
panel: 'panel',
});
Map.walking.search([{ keyword: start }, { keyword: end }], function (status: any) {
// result 即是对应的步行导航信息,相关数据结构文档请参考 https://lbs.amap.com/api/javascript-api/reference/route-search#m_DrivingResult
if (status === 'complete') {
// console.log('绘制步行路线完成');
searchFlag.value = false;
} else {
searchFlag.value = false;
}
});
Map.aMap.Event.addListener(Map.walking, 'complete', (res: any) => {
const data = JSON.parse(JSON.stringify(res));
searchFlag.value = false;
}
});
Map.aMap.Event.addListener(driving, 'complete', (res) => {
const data = JSON.parse(JSON.stringify(res));
searchFlag.value = false;
if (data.info == 'OK') {
const { routes } = data;
setTitle(routes[0]);
let arr = [];
arr.push(data.originName);
routes[0].steps.map((item: any) => {
arr.push(item.instruction);
});
arr.push(data.destinationName);
showRoutePanel.value = true;
routeList.value = arr;
}
});
if (data.info == 'ok') {
const { routes } = data;
setTitle(routes[0]);
let arr = [];
arr.push(data.originName);
routes[0].steps.map((item: any) => {
arr.push(item.instruction);
});
arr.push(data.destinationName);
showRoutePanel.value = true;
routeList.value = arr;
}
});
}
}
async function getMapData(type, params = { type: '' }) {
async function getMapData(type: any, params = { type: '' }) {
try {
const { code, result } = await mapApiSwitch(type, params);
if (!params.type) {
@@ -327,7 +407,7 @@
// const viewBtn = document.getElementById(val.id);
// viewBtn.onclick = () => {
// handleClcikDetail(val);
// handleClickDetail(val);
// };
},
true
@@ -342,15 +422,20 @@
}
function closeDrivingElement() {
if (driving) driving.clear();
Map.clearNavigationElements();
Map.driving && Map.driving.clear();
Map.walking && Map.walking.clear();
if (currentIndex.value !== list.value.length - 1) {
Map.clearNavigationElements();
} else {
Map.clearNaviLine();
}
formState.value.start = '';
formState.value.end = '';
showRoutePanel.value = false;
emits('clearHospitalList');
}
function handleClcikDetail(res) {
function handleClickDetail(res: any) {
emits('handleDetail', res);
}
@@ -389,12 +474,27 @@
function resetMap() {
Map.clearSOrE();
closeDrivingElement();
removeInput();
changeTab(list.value[currentIndex.value === 4 ? 0 : currentIndex.value], currentIndex.value);
emits('showRestB');
}
function newResetMap() {
Map.clearSOrE();
closeDrivingElement();
removeInput();
tab(currentIndex.value);
}
function setStartPosition(data: any) {
setInfoByUserData(data);
}
defineExpose({
resetMap,
newResetMap,
setStartPosition,
getSearch,
});
</script>
@@ -668,11 +768,19 @@
padding: 9px 18px;
min-height: 200px;
max-height: 473px;
overflow: auto;
overflow: hidden;
background: #0a1d36;
border-radius: 2px;
display: flex;
flex-direction: column;
//border: 1px solid #1b7ef2;
.has-data {
height: 100%;
display: flex;
flex-direction: column;
overflow: auto;
}
.line-title {
margin-bottom: 9px;
font-size: 14px;
@@ -682,6 +790,8 @@
}
.line-content {
flex: 1;
overflow: auto;
font-size: 12px;
color: var(--cardFontColor);
@@ -785,4 +895,8 @@
}
}
}
.no-top {
top: 50px !important;
}
</style>
+6
View File
@@ -21,6 +21,9 @@ enum Api {
nearResources = '/health-emergency/emergency/LargeScreenNew/nearResources',
todayEmergencyList = '/health-emergency/emergency/LargeScreenNew/todayEmergencyList',
healthArchives = '/health-emergency/emergency/LargeScreenNew/healthArchives',
contactList = '/health-system/sys/api/emergencyContact/contactList',
careUser = '/health-emergency/emergency/LargeScreenNew/careUser',
queryAnYanToken = '/health-emergency/emergency/LargeScreenNew/queryAnYanToken',
}
export const statisticsNewApi = (params: any) => post(Api.statisticsNew, params);
@@ -35,6 +38,9 @@ export const twoRNApi = (params: any) => get(Api.twoRN, params);
export const nearResourcesApi = (params: any) => get(Api.nearResources, params);
export const todayEmergencyListApi = (params: any) => post(Api.todayEmergencyList, params);
export const healthArchivesApi = (params: any) => get(Api.healthArchives, params);
export const contactListApi = (params: any) => get(Api.contactList, params);
export const careUserApi = (params: any) => get(Api.careUser, params);
export const queryAnYanTokenApi = () => get(Api.queryAnYanToken, {});
export const threeRModalApi = (params: any) => post(Api.threeRModal, params);
export const twoRModal1Api = (params: any) => post(Api.twoRModal1, params);
+97 -2
View File
@@ -2,6 +2,7 @@ import * as echarts from 'echarts';
import { initatorTypee, isTrueOfFalse, SexType, sexTypeList, sexTypeListNew } from '/@/utils/settings.ts';
import { getDictByCode2 } from '/@/views/index.api.ts';
import dayjs from 'dayjs';
import { h } from 'vue';
export const legend1 = new URL('/@/assets/img/legend1.png', import.meta.url).href;
export const legend2 = new URL('/@/assets/img/legend5.png', import.meta.url).href;
export const legend3 = new URL('/@/assets/img/legend3.png', import.meta.url).href;
@@ -44,7 +45,7 @@ export function getClassCharts(dx: any, dy: any, m: any) {
// nameGap: 10,
// nameRotate: 0, // 设置旋转角度,0 表示水平
nameTextStyle: {
fontSize: 12,
fontSize: 10,
color: '#65C6E7',
left: 100,
},
@@ -56,7 +57,7 @@ export function getClassCharts(dx: any, dy: any, m: any) {
type: 'solid',
},
},
interval: 25, // 步长
// interval: 25, // 步长
max: m,
min: 0, // 起始 - 设置y轴刻度的最小值
axisLabel: {
@@ -837,6 +838,7 @@ export const oneRNewColumns = [
title: '性别',
dataIndex: 'sex',
key: 'sex',
width: 80,
customRender: ({ text }) => {
if (text == '1') {
return '女';
@@ -849,11 +851,13 @@ export const oneRNewColumns = [
title: '年龄',
dataIndex: 'age',
key: 'age',
width: 80,
},
{
title: '应急方式',
dataIndex: 'emergencyType',
key: 'emergencyType',
width: 90,
customRender: ({ text }) => {
switch (text) {
case '0':
@@ -869,9 +873,100 @@ export const oneRNewColumns = [
}
},
},
{
title: '应急时间',
dataIndex: 'time',
key: 'time',
},
{
title: '详细地址',
dataIndex: 'd',
key: 'd',
width: 90,
ellipsis: true,
},
{
title: '操作',
dataIndex: 'cz',
key: 'cz',
width: 80,
},
];
export const monitorColumns = [
{
title: '姓名',
dataIndex: 'realName',
key: 'realName',
},
{
title: '单位名称',
dataIndex: 'orgName1',
key: 'orgName1',
},
{
title: '部门名称',
dataIndex: 'orgName2',
key: 'orgName2',
},
{
title: '手机号码',
dataIndex: 'phone',
key: 'phone',
width: 100,
},
{
title: '事件类型',
dataIndex: 'eventType_dictText',
key: 'eventType_dictText',
width: 100,
},
{
title: '异常值',
dataIndex: 'dataValue',
key: 'dataValue',
width: 80,
},
{
title: '详细地址',
dataIndex: 'address',
key: 'address',
customRender: ({ record }) => {
return !record?.address ? h('div', { style: { color: 'red' } }, record?.gpsErrorMsg) : record?.address;
},
ellipsis: true,
},
{
title: '预警时间',
dataIndex: 'warnTime',
key: 'warnTime',
},
];
export const contactListColumns = [
{
title: '联系人姓名',
dataIndex: 'name',
key: 'name',
},
{
title: '关系',
dataIndex: 'familyRelation_dictText',
key: 'familyRelation_dictText',
},
{
title: '联系人电话',
dataIndex: 'phone',
key: 'phone',
},
{
title: '身份证号',
dataIndex: 'idCard',
key: 'idCard',
customRender: ({ text }) => {
if (text) {
return text.substring(0, 6) + '********' + text.substring(14);
}
return '-';
},
},
];
+141 -29
View File
@@ -1,7 +1,7 @@
<template>
<div class="one-r-box">
<div class="title">
<div>助信息</div>
<div>助信息</div>
<!-- <div class="top-button-d">-->
<a-button size="small" class="title-button title-button-one" @click="handleView">今日应急</a-button>
@@ -10,9 +10,9 @@
<template v-if="props.userData && Object.keys(props.userData).length > 0">
<div class="basic-info">
<span>{{ userData.realName }}</span>
<a-button v-if="props.userData && Object.keys(props.userData).length > 0" size="small" class="title-button" @click="handleArchives"
>健康档案</a-button
>
<a-button v-if="props.userData && Object.keys(props.userData).length > 0" size="small" class="title-button" @click="handleArchives">
健康档案
</a-button>
</div>
<div class="emer-top-d-outer">
<div class="emer-top-d">
@@ -39,14 +39,14 @@
<div class="emer-item-d">
<div>当前位置</div>
<div class="emer-item-d-t" :style="{ color: !userData?.lon || !userData?.lat ? '#F24439' : '' }">
{{ !userData?.lon || !userData?.lat ? '未获取到位置信息' : locationInfo }}
{{ !userData?.address ? (!userData?.lon || !userData?.lat ? '未获取到位置信息' : locationInfo) : userData?.address }}
</div>
</div>
</div>
</div>
<div class="title title-two">
<span>联系人</span>
<a-button size="small" class="title-button">紧急联系人</a-button>
<a-button size="small" class="title-button" @click="handleEmer">紧急联系人</a-button>
</div>
<div class="emer-info-outer">
<div class="emer-info">
@@ -77,26 +77,62 @@
<Empty class="empty-d" :description="'暂无救助人员'" />
</template>
<Dialog :openVis="openInfo" width="30%" title="健康报警员工信息" @close="handlePoliceClose">
<Dialog :openVis="openInfo" width="30%" title="健康档案" @close="handlePoliceClose">
<template #container>
<div class="police-con" :class="[themeType]">
<Row style="font-size: 14px; font-weight: bold"> 个人信息 </Row>
<Row>
<Col :span="8">姓名{{ archives?.realName || '--' }}</Col>
<Col :span="8">性别{{ archives?.sex_dictText || '--' }}</Col>
<Col :span="8">年龄{{ archives?.age || '--' }}</Col>
</Row>
<Row>
<Col :span="8">二级单位{{ archives?.orgName2 || '--' }}</Col>
<Col :span="8">部门{{ archives?.orgName || '--' }}</Col>
<Col :span="8">手机号码{{ archives?.phone || '--' }}</Col>
</Row>
<Row style="font-size: 14px; font-weight: bold"> 健康信息 </Row>
<Row> 异常事件{{ archives?.eventType_dictText || '--' }} </Row>
<Row>
<Col :span="8">异常值{{ archives?.dataValue || '--' }}</Col>
<Col :span="16">发生时间{{ archives?.warnTime || '--' }}</Col>
<Row class="open-info-top-title">
<div class="title-left"></div>
六大健康指标
<div class="title-right"></div>
</Row>
<div class="open-info-body">
<div>
<div class="item-d">
<div class="item-label">BMI</div><div class="item-value">{{ archives?.bmi || '-' }}</div>
</div>
<div class="item-d">
<div class="item-label">尿酸</div><div class="item-value">{{ archives?.ua || '-' }}</div>
</div>
<div class="item-d">
<div class="item-label">血同型半胱氨酸</div><div class="item-value">{{ archives?.hcy || '-' }}</div>
</div>
<div class="item-d">
<div class="item-label">空腹葡萄糖</div><div class="item-value">{{ archives?.glu || '-' }}</div>
</div>
<div>
<div style="color: #ffffff"> 血压</div>
<div class="son-item item-d">
<div class="item-label">目前收缩压监测值</div><div class="item-value">{{ archives?.sbp || '-' }}</div>
</div>
<div class="son-item item-d">
<div class="item-label">目前舒张压监测值</div><div class="item-value">{{ archives?.dbp || '-' }}</div>
</div>
</div>
<div>
<div style="color: #ffffff"> 血脂</div>
<div class="son-item item-d">
<div class="item-label">总胆固醇</div><div class="item-value">{{ archives?.tc || '-' }}</div>
</div>
<div class="son-item item-d">
<div class="item-label">甘油三酯</div><div class="item-value">{{ archives?.tg || '-' }}</div>
</div>
<div class="son-item item-d">
<div class="item-label">低密度脂蛋白</div><div class="item-value">{{ archives?.ldl || '-' }}</div>
</div>
</div>
</div>
<div>
<div class="item-d">
<div class="item-label">既往史</div><div class="item-value">{{ archives?.pastHistory || '-' }}</div>
</div>
<div class="item-d">
<div class="item-label">手术史</div><div class="item-value">{{ archives?.surgicalHistory || '-' }}</div>
</div>
<div class="item-d">
<div class="item-label">用药史</div><div class="item-value">{{ archives?.medicationHistory || '-' }}</div>
</div>
</div>
</div>
</div>
</template>
</Dialog>
@@ -104,7 +140,7 @@
</template>
<script setup lang="ts">
import pointPng from '/@/assets/indexSun/point.png';
import { Col, Empty, Row } from 'ant-design-vue';
import { Empty, Row } from 'ant-design-vue';
import { Map } from '/@/assets/mapUtils/map.ts';
import { ref, watch } from 'vue';
import Dialog from '/@/components/dialog/Dialog.vue';
@@ -117,7 +153,7 @@
const { themeType } = useTheme();
const locationInfo = ref<string>('');
const emit = defineEmits(['handleView']);
const emit = defineEmits(['handleView', 'handleEmer']);
const openInfo = ref<boolean>(false);
const archives = ref<object>({});
@@ -134,14 +170,29 @@
function handleView() {
emit('handleView');
}
function handleEmer() {
emit('handleEmer', props.userData?.userId);
}
function handleArchives() {
archives.value = {};
openInfo.value = true;
healthArchivesApi({ userId: props.userData?.userId })
.then((res) => {})
.catch((err) => {});
.then((res: any) => {
console.log(res);
if (res?.code === 200) {
archives.value = res?.result || {};
}
})
.catch((err) => {
console.log(err);
});
}
function handlePoliceClose() {
archives.value = {};
openInfo.value = false;
}
function getTypeName(type: string) {
@@ -159,6 +210,7 @@
}
}
function getSex(type: string) {
type = type + '';
switch (type) {
case '1':
return '女';
@@ -171,7 +223,7 @@
function getAddress() {
Map.getAddressByPoint([props.userData?.lon, props.userData?.lat])
.then((res: string) => {
.then((res: any) => {
locationInfo.value = res;
})
.catch((err) => {
@@ -209,7 +261,7 @@
.title-button {
color: #ffffff;
font-weight: bold;
font-size: 10px !important;
font-size: 13px !important;
padding: 2px 10px;
background: radial-gradient(ellipse at center, #082147 0%, #08254c 55%, #085faa 100%);
border-radius: 8px;
@@ -320,4 +372,64 @@
margin-bottom: 5px;
}
}
.title-left,
.title-right {
width: 48px;
height: 2px;
background: linear-gradient(90deg, #02fafc 0%, rgba(2, 250, 252, 0) 100%);
border-radius: 1px;
margin: 0 10px;
}
.title-left {
transform: rotate(180deg);
}
.open-info-top-title {
font-size: 18px;
font-weight: bold;
align-items: center;
justify-content: center;
color: #5cfbff;
margin: 10px 0;
}
.open-info-body {
padding: 0 20px;
font-size: 16px;
> div {
&:nth-child(1) {
padding: 0 10px 10px;
border-bottom: 1px solid #5cfbff;
}
&:nth-child(2) {
padding: 0 10px 10px;
margin-top: 20px;
}
> div {
margin: 10px 0;
}
}
.item-d {
display: flex;
}
.item-label {
color: #ffffff;
}
.item-value {
color: #5cfbff;
flex: 1;
white-space: wrap;
word-break: break-all;
}
.son-item {
font-size: 14px;
}
}
</style>
+22 -7
View File
@@ -31,10 +31,10 @@
<div> <img :src="imgList[chooseType]" alt="" />{{ tabList[chooseType].label }}</div>
<div v-if="[0, 1].includes(chooseType)"> 参考范围: {{ tabList[chooseType].tips }} </div>
</div>
<div style="height: 210px">
<div style="height: 210px; display: flex; align-items: center; justify-content: center; width: 100%">
<div style="height: 100%" class="content-chart">
<template v-if="[0, 1, 2, 3].includes(chooseType)">
<three-left-new-item :choose-type="chooseType" />
<three-left-new-item :org-code="selectValue" :type="selectValue1" :choose-type="chooseType" />
</template>
<template v-if="[4].includes(chooseType)">
<sleep-item :orgCode="selectValue" :type="selectValue1" style="height: 100%" />
@@ -79,12 +79,12 @@
{
label: '心率',
value: 0,
tips: '正常范围60~100次/分',
tips: '正常60~100次/分',
},
{
label: '血氧',
value: 1,
tips: '血氧饱和度范围95%~100%',
tips: '血氧饱和度95%~100%',
},
{
label: '血压',
@@ -115,9 +115,23 @@
]);
const newChart = ref<HTMLElement>();
function clickChooseType(type: any) {
if (timer.value) {
clearInterval(timer.value);
timer.value = setInterval(() => {
if (chooseType.value !== 5) {
chooseType.value += 1;
} else {
chooseType.value = 0;
}
getData();
}, 10000);
}
if (chooseType.value === type) return;
chooseType.value = type;
getData();
nextTick(() => {
getData();
});
}
onMounted(() => {
@@ -144,7 +158,7 @@
chooseType.value = 0;
}
getData();
}, 5000);
}, 10000);
}
onBeforeUnmount(() => {
@@ -447,7 +461,8 @@
justify-content: space-between;
}
.content-chart {
width: 100%;
position: relative;
width: 90%;
margin: 0 auto;
flex: 1;
.charts {
@@ -32,6 +32,10 @@
userCount: {
type: Number,
},
chooseIndex: {
type: Number,
default: () => 0,
},
themeType: {
type: String,
default: () => '',
@@ -59,7 +63,7 @@
function initChart(chartData, total, color) {
nextTick(() => {
let myChart = echarts.init(healthChart.value);
let options = circleRing(chartData, total, color);
let options = circleRing(chartData, total, color, props.chooseIndex);
myChart.setOption(options);
window.addEventListener('resize', () => {
myChart.resize();
@@ -27,10 +27,24 @@ export function screenPie(chartData) {
show: true,
position: 'outside',
formatter: function (params: any) {
return `${params.name}\n占比:${params.percent}%\n人次:${params.value}`;
return `{name|${params.name}}\n{percent|占比:${params.percent}%}\n{value|${params.value}}`;
},
rich: {
name: {
fontSize: 10,
lineHeight: 15,
},
percent: {
fontSize: 10,
lineHeight: 15,
},
value: {
fontSize: 10,
lineHeight: 15,
},
},
color: '#ffffff',
fontSize: 14,
fontSize: 10,
},
labelLine: {
show: true,
@@ -45,7 +59,7 @@ export function screenPie(chartData) {
}
//左侧圆
export function circleRing(chartData, total, color) {
export function circleRing(chartData, total, color, index = 0) {
const data = visibleChartLabel(chartData);
return {
color: color,
@@ -79,15 +93,33 @@ export function circleRing(chartData, total, color) {
position: 'outside',
// formatter: '{a}{d}%\n{c}人次',
formatter: function (params: any) {
return `${params.name}:${params.percent}%\n${params.value}`;
if (index === 3) {
return `{name|${params.name}}\n{percent|占比:${params.percent}%}\n{value|${params.value}次}`;
} else {
return `{name|${params.name}:${params.percent}%}\n{value|${params.value}次}`;
}
},
rich: {
name: {
fontSize: 10,
lineHeight: 15,
},
percent: {
fontSize: 10,
lineHeight: 15,
},
value: {
fontSize: 10,
lineHeight: 15,
},
},
color: '#ffffff',
fontSize: 14,
fontSize: 10,
},
labelLine: {
show: true,
length: 2,
length2: 30,
length2: 25,
minTurnAngle: 120,
},
data: data,
@@ -72,6 +72,7 @@
}
.pie-container.self {
width: 100%;
position: relative;
padding-bottom: 0 !important;
}
@@ -7,6 +7,7 @@
:tips="dataList[props.chooseType].tips"
:color="dataList[props.chooseType].color"
:user-count="dataList[props.chooseType].userCount"
:chooseIndex="props.chooseType"
/>
</template>
r
+8 -8
View File
@@ -93,7 +93,6 @@
});
}
const myChart = ref();
function getData() {
twoLApi({
sex: chooseType.value,
@@ -110,23 +109,24 @@
});
}
function initChart(value) {
myChart.value = echarts.init(newChart.value!);
function initChart(value: any) {
let myChart = echarts.init(newChart.value);
const dx =
value.map((item) => {
value.map((item: any) => {
return item.name;
}) || [];
const dy =
value.map((item) => {
value.map((item: any) => {
return item.count;
}) || [];
const max = value.sort((a, b) => b.count - a.count).length > 0 ? value.sort((a, b) => b.count - a.count)[0].count : [];
const max: any =
value.sort((a: any, b: any) => b.count - a.count).length > 0 ? value.sort((a: any, b: any) => b.count - a.count)[0].count : [];
const m = max % 25 === 0 ? max : (parseInt(max / 25) + 1) * 25;
let option = getClassCharts(dx, dy, m);
myChart.value.setOption(option);
myChart.setOption(option);
window.addEventListener('resize', () => {
myChart.value.resize();
myChart && myChart.resize();
});
}
const emit = defineEmits(['handleView']);
+18 -18
View File
@@ -7,13 +7,13 @@ export const list = [
},
{
label: '关爱联络员',
field: '',
field: 'careLiaisonName',
span: 12,
options: null,
},
{
label: '单位',
field: 'workNoUnit',
field: 'workUnit',
span: 24,
options: null,
},
@@ -84,13 +84,13 @@ export const list = [
options: null,
},
{
label: '血压控制目标(收缩压)',
label: '目标',
field: 'systolicPressureTarget',
span: 8,
options: null,
},
{
label: '目前收缩压监测值',
label: '目前',
field: 'systolicPressureCurrent',
span: 8,
options: null,
@@ -102,13 +102,13 @@ export const list = [
options: null,
},
{
label: '血压控制目标(舒张压)',
label: '目标',
field: 'diastolicPressureTarget',
span: 8,
options: null,
},
{
label: '目前舒张压监测值',
label: '目前',
field: 'diastolicPressureCurrent',
span: 8,
options: null,
@@ -135,13 +135,13 @@ export const list = [
options: null,
},
{
label: '血糖控制目标',
label: '目标',
field: 'bloodSugarTarget',
span: 8,
options: null,
},
{
label: '目前血糖监测值',
label: '目前',
field: 'bloodSugarCurrent',
span: 8,
options: null,
@@ -153,13 +153,13 @@ export const list = [
options: null,
},
{
label: 'LDL控制目标',
label: '目标',
field: 'ldlTarget',
span: 8,
options: null,
},
{
label: '目前LDL监测值',
label: '目前',
field: 'ldlCurrent',
span: 8,
options: null,
@@ -171,13 +171,13 @@ export const list = [
options: null,
},
{
label: 'TC控制目标',
label: '目标',
field: 'tcTarget',
span: 8,
options: null,
},
{
label: '目前TC监测值',
label: '目前',
field: 'tcCurrent',
span: 8,
options: null,
@@ -189,13 +189,13 @@ export const list = [
options: null,
},
{
label: 'TG控制目标',
label: '目标',
field: 'tgTarget',
span: 8,
options: null,
},
{
label: '目前TG监测值',
label: '目前',
field: 'tgCurrent',
span: 8,
options: null,
@@ -207,13 +207,13 @@ export const list = [
options: null,
},
{
label: '血尿酸控制目标',
label: '目标',
field: 'uricAcidTarget',
span: 8,
options: null,
},
{
label: '目前血尿酸监测值',
label: '目前',
field: 'uricAcidCurrent',
span: 8,
options: null,
@@ -225,13 +225,13 @@ export const list = [
options: null,
},
{
label: '同型半胱氨酸控制目标',
label: '目标',
field: 'homocysteineTarget',
span: 8,
options: null,
},
{
label: '目前同型半胱氨酸监测值',
label: '目前',
field: 'homocysteineCurrent',
span: 8,
options: null,