renkang/xj-screen
7
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Merge branch 'dev' into test

Browse Source
This commit is contained in:
zk
2023-12-27 09:14:17 +08:00
parent 568c0132e7 2e106c4731
commit 98abe8d9ca
37 changed files with 333 additions and 200 deletions
Download Patch File Download Diff File Expand all files Collapse all files
.eslintignore
+1
View File
@@ -7,6 +7,7 @@ node_modules
.vscode
.idea
dist
dist.zip
/public
/docs
.husky
package.json
+1
View File
@@ -15,6 +15,7 @@
"dependencies": {
"@amap/amap-jsapi-loader": "^1.0.1",
"@iamzzg/data-view": "^2.10.0",
"@turf/turf": "^6.5.0",
"autoprefixer": "^10.4.16",
"axios": "^1.6.2",
"dayjs": "^1.11.10",
src/assets/less/amap-item.less
+1
View File
@@ -31,6 +31,7 @@
//marker
.amap-marker-label {
padding: 0;
border: none;
}
.alarm-content {
src/assets/less/index.less
+5
View File
@@ -68,6 +68,11 @@
}
// 下拉框样式-start
.ant-select.bg-000 {
color: #fff !important;
background-color: #000;
}
.ant-select-dropdown {
background-color: #00152b !important;
border-right: 1px solid #1b7ef2;
src/assets/mapUtils/commonFun.ts
+35 -1
View File
@@ -1,5 +1,6 @@
import { mapIcon1, mapIcon2, mapIcon3, mapIcon4 } from '/@/components/chinaMap/chinaHooks.ts';
import { watchIcon } from '/@/components/secondaryScreen/secondMap/secondMapHooks.ts';
import * as turf from '@turf/turf';
/**
* @desc 创建icon
@@ -31,7 +32,7 @@ export function typeToIcon(type: string) {
if (type == '3') {
return createIcon({ icon: mapIcon2, iconSize, imageSize });
}
if (type == '5') {
if (type == '5' || type == '4') {
return createIcon({ icon: mapIcon3, iconSize, imageSize });
}
if (type == '6') {
@@ -60,3 +61,36 @@ export function createCircle(option) {
...option,
});
}
export function getLonLat(result = []) {
let arr = [];
for (let i = 0; i < result.length; i++) {
let { lon, lat, lng } = result[i];
if (lng) {
lon = lng;
}
if (!lon || !lat) {
continue;
}
let point = turf.point([lon, lat]);
arr.push(point);
}
return arr;
}
/**
* @desc 根据多点算中心点
*/
export function getCenter(list = []) {
if (!list || !Array.isArray(list)) {
return undefined;
}
if (list.length < 1) {
return undefined;
}
let features = turf.featureCollection(list);
let centerObj = turf.center(features);
return centerObj?.geometry?.coordinates;
}
// export function
src/assets/mapUtils/map.ts
+21 -21
View File
@@ -1,17 +1,12 @@
import AMapLoader from '@amap/amap-jsapi-loader';
import china from '/@/assets/lngLat/china.ts';
import chinaInner from '/@/assets/lngLat/chinaInner.ts';
import { createCircle, createIcon, typeToIcon } from '/@/assets/mapUtils/commonFun.ts';
import { createCircle, createIcon, getCenter, getLonLat, typeToIcon } from '/@/assets/mapUtils/commonFun.ts';
import { aircraftContent, alarmIcon } from '/@/components/chinaMap/chinaHooks.ts';
import { isFunction } from '/@/utils/is.ts';
import { Callback, ExtDataType, InitMap, MarkerOption, ResultType } from '/@/assets/mapUtils/mapFunTypes.ts';
import { defaultOption, getZoom, mapKey, mapPlugin } from '/@/assets/mapUtils/mapConstant.ts';
export const defaultOption = {
center: [106.3, 37.87], //地图中心点
zoom: 4.3, //地图显示的缩放级别
mapStyle: 'darkblue', //地图样式
};
export const mapPlugin = ['AMap.ToolBar', 'AMap.Driving', 'AMap.GeoJSON', 'AMap.MarkerCluster', 'AMap.PlaceSearch'];
let AMap = null;
export const Map = {
map: null,
@@ -29,7 +24,7 @@ export const Map = {
initMap({ el, option }: InitMap) {
return new Promise((resolve) => {
AMapLoader.load({
key: '4bbcb216b889f2d612cbed05ae6979c8', // 申请好的Web端开发者Key，首次调用 load 时必填
key: mapKey, // 申请好的Web端开发者Key，首次调用 load 时必填
version: '2.0', // 指定要加载的 JSAPI 的版本，缺省时默认为 1.4.15
plugins: mapPlugin, // 需要使用的的插件列表，如比例尺'AMap.Scale'等
}).then((res) => {
@@ -40,7 +35,7 @@ export const Map = {
resizeEnable: true,
center: center,
zoom: zoom,
mapStyle: 'amap://styles/darkblue',
mapStyle: 'amap://styles/' + mapStyle,
version: '2.0',
});
// 异步同时加载多个插件
@@ -105,6 +100,7 @@ export const Map = {
if (this.airMarkerList) {
this.airMarkerList = [];
}
this.clearActiveHospital();
// this.map.remove(this.airMarkerList);
}, //
/**
@@ -116,6 +112,10 @@ export const Map = {
createOverlay(result: ResultType[], extData?: ExtDataType, callback?: Callback) {
this.removeOverlayGroup();
this.overlayGroup = new AMap.OverlayGroup();
let list = getLonLat(result);
let center = getCenter(list);
let zoom = getZoom(list);
this.setZoomCenter(center, zoom);
for (let i = 0; i < result.length; i++) {
let { type, lon, lat, lng } = result[i];
if (lng) {
@@ -126,7 +126,6 @@ export const Map = {
}
// 创建一个 Icon
let startIcon = typeToIcon(type);
// debugger;
// 将 icon 传入 marker
let startMarker = new AMap.Marker({
// 点的坐标
@@ -231,23 +230,24 @@ export const Map = {
this.removeOverlayGroup();
this.clearActiveHospital();
if (!cityCode) return;
this.placeSearch = new AMap.PlaceSearch({
pageSize: 30, // 单页显示结果条数
pageIndex: 1, // 页码
city: cityCode, // 兴趣点城市
citylimit: true, //是否强制限制在设置的城市内搜索
map: this.map, // 展现结果的地图实例
// panel: 'map_hospital', // 结果列表将在此容器中进行展示。
autoFitView: false, // 是否自动调整地图视野使绘制的 Marker点都处于视口的可见范围
});
if (!this.placeSearch) {
this.placeSearch = new AMap.PlaceSearch({
pageSize: 30, // 单页显示结果条数
pageIndex: 1, // 页码
city: cityCode, // 兴趣点城市
citylimit: true, //是否强制限制在设置的城市内搜索
map: this.map, // 展现结果的地图实例
// panel: 'map_hospital', // 结果列表将在此容器中进行展示。
autoFitView: false, // 是否自动调整地图视野使绘制的 Marker点都处于视口的可见范围
});
}
this.placeSearch.setCity(cityCode);
//关键字查询
this.placeSearch.search(keywords);
},
clearActiveHospital() {
if (this.placeSearch) {
// debugger;
this.placeSearch.clear();
this.placeSearch = null;
}
},
createMarker(option: MarkerOption, callbck?: Callback) {
src/assets/mapUtils/mapConstant.ts
+22
View File
@@ -0,0 +1,22 @@
// 地图默认配置
export const defaultOption = {
center: [108.660704, 36.386058], //地图中心点
zoom: 6.5, //地图显示的缩放级别
mapStyle: 'darkblue', //地图样式
};
// 地图key
export const mapKey = '4bbcb216b889f2d612cbed05ae6979c8'
export const mapPlugin = ['AMap.ToolBar', 'AMap.Driving', 'AMap.GeoJSON', 'AMap.MarkerCluster', 'AMap.PlaceSearch'];
//根据数据量设置地图层级
export function getZoom(list = []) {
let len = list.length
// console.log('len', len)
if (len <= 5) {
return 7.5;
} else if (len <= 30) {
return 6.7;
} else {
return 7;
}
}
src/components/body-d-left/oneL.vue
+6 -3
View File
@@ -23,10 +23,10 @@
</template>
<script setup lang="ts">
import { onMounted, ref } from 'vue';
import bus from '/@/utils/bus.ts';
import PublicTitle from '../publicTitle.vue';
import { list } from './left.api';
import { timeTab, useSpin, useStatistics } from '/@/components/body-d-left/bodyLeftHooks.ts';
import { useDetailStore } from '/@/store/modules/detailData.ts';
const typeTime = ref(timeTab);
const { statistics, setStatistics } = useStatistics();
@@ -38,6 +38,8 @@
getList();
});
const useDetail = useDetailStore();
async function getList() {
setSpin(true);
try {
@@ -48,7 +50,8 @@
}
setStatistics(result[0]);
let { alerdyreceive = '', totalacceptance = '' } = result[0];
bus.emit('alerdyreceive', { alerdyreceive, totalacceptance });
useDetail.setAlerdyreceive(alerdyreceive);
useDetail.setTotalacceptance(totalacceptance);
} catch {
setSpin(!spinning.value);
}
@@ -104,4 +107,4 @@
}
}
}
</style>
</style>
src/components/body-d-left/twoL.vue
+2 -2
View File
@@ -184,7 +184,7 @@
//框背景色
.ant-select:not(.ant-select-customize-input) .ant-select-selector {
color: #1b7ef2 !important;
color: #1b7ef2;
background-color: transparent !important;
border: 1px solid #1b7ef2 !important;
}
@@ -214,4 +214,4 @@
.ant-select-item-option-selected:not(.ant-select-item-option-disabled) {
background-color: #002e64 !important;
}
</style>
</style>
src/components/body-d-right/bodyRightHooks.ts
+1
View File
@@ -132,6 +132,7 @@ export function ringOption(chartData, total) {
color: '#ffffff',
fontSize: 16,
},
selectedMode: false,
},
series: [
{
src/components/body-d-right/oneR.vue
+1 -1
View File
@@ -238,7 +238,7 @@ antd表格样式
*/
.ant-table-thead > tr > th {
border-bottom: 1px solid #1e73c2 !important;
//border-bottom: 1px solid #1e73c2 !important;
}
.ant-table-body {
src/components/chinaMap/chinaMap.vue
+13 -15
View File
@@ -49,12 +49,12 @@
<!-- <div class="level">地图层级：{{ level }}</div>-->
</div>
<div class="center-footer">
<div class="count-item" @click="test">
<div class="num">{{ footerData?.alerdyreceive || '/' }}</div>
<div class="count-item">
<div class="num">{{ useDetail?.alerdyreceive || '/' }}</div>
<div class="text">累计受理</div>
</div>
<div class="count-item">
<div class="num">{{ footerData?.totalacceptance || '/' }}</div>
<div class="num">{{ useDetail?.totalacceptance || '/' }}</div>
<div class="text">累计处置</div>
</div>
</div>
@@ -62,11 +62,12 @@
</template>
<script lang="ts" setup>
import { onMounted, ref } from 'vue';
import $bus from '/@/utils/bus.ts';
import { message } from 'ant-design-vue';
import { Map } from '/@/assets/mapUtils/map';
import { aircraft, getKmStr, getTimeStr, legendList, mapApiSwitch, tabList, TabType } from '/@/components/chinaMap/chinaHooks';
import { useDetailStore } from '/@/store/modules/detailData.ts';
const useDetail = useDetailStore();
function test() {
Map.clearActiveHospital();
@@ -97,11 +98,15 @@
}
}
const currentCityCode = ref('');
function logMapinfo() {
// let zoom = Map.map.getZoom();
Map.map.getCity(function (info) {
const { citycode } = info;
Map.createActiveHospital(citycode);
if (currentCityCode.value != citycode) {
Map.createActiveHospital(citycode);
currentCityCode.value = citycode;
}
});
}
@@ -137,19 +142,12 @@
}
}
const footerData = ref({
alerdyreceive: '',
totalacceptance: '',
});
onMounted(() => {
console.log('reload');
Map.initMap({ el: 'mapContainer' }).then(() => {
getMapData(tabList[0].type);
Map.map && Map.map.on('moveend', setLevel);
Map.map && Map.map.on('zoomend', setLevel);
$bus.on('alerdyreceive', (val) => {
footerData.value = val;
});
Map.map && Map.map.on('zoomend', setLevel);
});
});
const routeList = ref([]);
src/components/dialog/Dialog.vue
+2 -1
View File
@@ -38,11 +38,12 @@
background-size: 100% 100%;
color: #ffffff !important;
padding-left: 2%;
font-size: 18px;
font-weight: bold;
}
.ant-modal-header {
padding: 0 !important;
padding-bottom: 0;
border-bottom: none;
}
src/components/item-d/item-d.vue
+10
View File
@@ -74,6 +74,16 @@
height: calc(100% - 40px);
}
.inner::after {
content: '';
position: absolute;
left: 0;
top: 0;
width: 20px;
height: 20px;
background-color: #051a2b;
}
.left-pie {
position: relative;
padding-bottom: 0 !important;
src/components/item-d/pieCharts.ts
+8 -5
View File
@@ -1,7 +1,8 @@
// 步数
import {visibleChartLabel} from "/@/utils/utils.ts";
export function screenPie(chartData, total, color, formatter) {
export function screenPie(chartData, total, color) {
const data = visibleChartLabel(chartData)
return {
color: color,
tooltip: {
@@ -14,7 +15,7 @@ export function screenPie(chartData, total, color, formatter) {
borderColor: '#1b7ef2',
},
legend: {
left: '72%',
right: '5%',
top: 'center',
orient: 'vertical',
icon: 'circle',
@@ -23,12 +24,13 @@ export function screenPie(chartData, total, color, formatter) {
color: '#ffffff',
fontSize: 16,
},
selectedMode: false
},
series: [
{
type: 'pie',
radius: ['50%', '76%'],
center: ['40%', '49%'],
radius: ['50%', '72%'],
center: ['37%', '49%'],
avoidLabelOverlap: false,
label: {
show: true,
@@ -42,7 +44,7 @@ export function screenPie(chartData, total, color, formatter) {
length2: 10,
minTurnAngle: 120,
},
data: chartData,
data: data,
},
],
};
@@ -72,6 +74,7 @@ export function circleRing(chartData, total, color) {
color: '#ffffff',
fontSize: 16,
},
selectedMode: false
},
series: [
{
src/components/secondaryScreen/commonApi.ts
+1 -1
View File
@@ -1,7 +1,7 @@
import { get, post } from '/@/api/request.ts';
export enum Api {
depart = 'sys/sysDepart/allSecondaryDeparts',
depart = '/health-watch/watch/watchDevice/getUnitList',
getWatchDataByOrgCode = '/health-watch/watch/watchData/getWatchDataByOrgCode',
getMonitorList = '/health-watch/watch/watchMonitorData/getMonitorList',
sleepApi = '/health-watch/watch/watchData/getSleep',
src/components/secondaryScreen/screen-right/screenRightHooks.ts
+3 -1
View File
@@ -61,6 +61,7 @@ export function sleepCharts({ time, short, long, awake, type }) {
borderColor: '#1b7ef2',
},
legend: {
orient: 'horizontal',
data: ['清醒', '浅睡', '深睡'],
textStyle: {
color: '#ffffff',
@@ -69,7 +70,8 @@ export function sleepCharts({ time, short, long, awake, type }) {
height: 40,
itemHeight: 14,
top: -5,
left: '52%',
right: '15%',
selectedMode: false,
},
color: ['#14B3F8', '#6D7BEB', '#5451DC'],
xAxis: {
src/components/secondaryScreen/screen-right/threeR.vue
+1
View File
@@ -43,6 +43,7 @@
pageSize: 10,
total: 0,
onChange: pageChange,
showSizeChanger: false,
});
const timer = ref(null);
const pages = ref(0); //总页数
src/components/secondaryScreen/screen-right/twoR.vue
+1 -1
View File
@@ -75,7 +75,7 @@
.count {
position: absolute;
width: 77%;
width: 71%;
top: 51%;
display: flex;
flex-direction: column;
src/components/secondaryScreen/secondMap/components/footerDialog.vue
+1 -8
View File
@@ -1,6 +1,6 @@
<template>
<div class="modal-content">
<div class="empty-png"></div>
<!-- <div class="empty-png"></div>-->
<div class="modal-header">
<button type="button" aria-label="Close" class="modal-close" @click="closeDialog">X</button>
<div class="modal-title" id="vcDialogTitle0">健康报警员工信息</div>
@@ -38,13 +38,6 @@
border: 0;
border-radius: 2px;
.empty-png {
width: 100%;
height: 16px;
background: url('../../../../assets/images/bg.png') no-repeat;
background-position-y: -500px;
}
.modal-close {
width: 40px;
height: 40px;
src/components/secondaryScreen/secondMap/components/userInfoModal/bloodOxygen.vue
+6 -1
View File
@@ -52,7 +52,12 @@
keyType: propTypes.string.def('2'),
});
const { refresh, setRefresh } = useChangeTable();
const apiParams = ref(getParams());
const apiParams = ref({
flag: 0,
userId: props.userId,
pageSize: 10,
pageNo: 1,
});
function tableReload() {
apiParams.value = {
src/components/secondaryScreen/secondMap/components/userInfoModal/heartRate.vue
+6 -1
View File
@@ -53,7 +53,12 @@
keyType: propTypes.string.def('1'),
});
const { refresh, setRefresh } = useChangeTable();
const apiParams = ref(getParams());
const apiParams = ref({
flag: 0,
userId: props.userId,
pageSize: 10,
pageNo: 1,
});
function tableReload() {
apiParams.value = {
src/components/secondaryScreen/secondMap/components/userInfoModal/motion.vue
+6 -1
View File
@@ -48,7 +48,12 @@
keyType: propTypes.string.def('6'),
});
const { refresh, setRefresh } = useChangeTable();
const apiParams = ref(getParams());
const apiParams = ref({
flag: 0,
userId: props.userId,
pageSize: 10,
pageNo: 1,
});
function tableReload() {
apiParams.value = {
src/components/secondaryScreen/secondMap/components/userInfoModal/pressure.vue
+6 -1
View File
@@ -50,7 +50,12 @@
});
let echart = null;
const apiParams = ref(getParams());
const apiParams = ref({
flag: 0,
userId: props.userId,
pageSize: 10,
pageNo: 1,
});
const { refresh, setRefresh } = useChangeTable();
function tableReload() {
src/components/secondaryScreen/secondMap/components/userInfoModal/publicTitle.vue
+38 -16
View File
@@ -1,5 +1,9 @@
<template>
<div style="display: flex; align-items: center; justify-content: center; position: relative" :style="{ minHeight: props.showList ? '30px' : '' }">
<div
class="public-title"
style="display: flex; align-items: center; justify-content: center; position: relative"
:style="{ minHeight: props.showList ? '30px' : '' }"
>
<a-radio-group v-model:value="active" button-style="solid" @change="changeType" v-if="showStatus && props.showList">
<a-radio-button v-if="props.showOne" :value="1">日</a-radio-button>
<a-radio-button :value="2">周</a-radio-button>
@@ -12,18 +16,12 @@
</div>
</div>
<div
class="public-title"
style="display: flex; justify-content: center; margin-top: 20px; align-items: center; position: relative"
:style="{ minHeight: props.showList ? '' : '30px' }"
>
<div class="fff" style="position: absolute; left: 10px; display: flex; align-items: center; color: #fff" v-if="!props.showList">
锻炼类型：
<!-- <JDictSelectTag-->
<!-- v-model:value="motionType"-->
<!-- style="min-width: 140px"-->
<!-- placeholder="请选择锻炼类型"-->
<!-- dictCode="watch_exercise_type"-->
<!-- @change="changeSelect"-->
<!-- />-->
<a-select
v-model:value="motionType"
class="type-select"
@@ -32,8 +30,10 @@
@change="changeSelect"
></a-select>
</div>
<div class="item-picker" style="display: flex; font-size: 20px" v-if="showStatus && props.showList">
<span style="margin: 0 0 0 5px; cursor: pointer" @click="changeDate('0')">&lt;</span>
<div style="display: flex; font-size: 20px; align-items: center" v-if="showStatus && props.showList">
<a-button class="btn" type="primary" size="small" @click="changeDate('0')">
<LeftOutlined class="icon" style="color: #fff" />
</a-button>
<div style="position: relative">
<a-date-picker
ref="datePicker"
@@ -42,6 +42,7 @@
:format="rType()"
:picker="getP()"
@change="changeValue"
:allow-clear="false"
style="opacity: 0; z-index: 99; position: absolute; top: 0; left: 0"
>
<template #dateRender="{ current }">
@@ -50,21 +51,22 @@
</div>
</template>
</a-date-picker>
<div style="z-index: 1; min-width: 150px; text-align: center"
><span>{{ getDateFormat(dateInfo) }}</span></div
>
<div style="z-index: 1; min-width: 150px; text-align: center; color: #fff">{{ getDateFormat(dateInfo) }} </div>
</div>
<span style="margin: 0 0 5px 5px; cursor: pointer" @click="changeDate('1')">&gt;</span>
<a-button class="btn" type="primary" :disabled="!isRight" size="small" @click="changeDate('1')">
<RightOutlined class="icon" style="color: #fff" />
</a-button>
</div>
</div>
</template>
<script setup lang="ts">
import { nextTick, onMounted, ref } from 'vue';
import { computed, nextTick, onMounted, ref } from 'vue';
import { RightOutlined, LeftOutlined } from '@ant-design/icons-vue';
import chartImg from '/@/assets/images/chart.png';
import listImg from '/@/assets/images/list.png';
import dayjs from 'dayjs';
import { propTypes } from '/@/utils/propTypes';
// import JDictSelectTag from '/@/components/Form/src/jeecg/components/JDictSelectTag.vue';
import { userDataDayByYearApi } from '/@/components/secondaryScreen/secondMap/secondMapApi.ts';
import { getCodeInfo, montionFieldNames } from '/@/api/dictCode.ts';
@@ -95,6 +97,8 @@
const active = ref(props.showOne ? 1 : 2);
const showStatus = ref(true);
const dateInfo = ref(dayjs());
const isRight = computed(() => dayjs(dateInfo.value).format('YYYY-MM-DD') != dayjs().format('YYYY-MM-DD'));
const motionType = ref();
const dateFormat = 'YYYY-MM-DD';
@@ -262,4 +266,22 @@
border: 1px solid #1890ff;
border-radius: 50px;
}
.btn {
.icon {
color: #fff !important;
height: 20px;
line-height: 20px;
}
}
.public-title {
:deep(.ant-btn-primary[disabled], .ant-btn-primary[disabled]:hover, .ant-btn-primary[disabled]:focus, .ant-btn-primary[disabled]:active) {
color: rgba(0, 0, 0, 0.25);
border-color: #92bfe9;
background: #92bfe9;
text-shadow: none;
box-shadow: none;
}
}
</style>
src/components/secondaryScreen/secondMap/components/userInfoModal/sleep.vue
+6 -2
View File
@@ -55,7 +55,12 @@
keyType: propTypes.string.def('4'),
});
const { refresh, setRefresh } = useChangeTable();
const apiParams = ref(getParams());
const apiParams = ref({
flag: 0,
userId: props.userId,
pageSize: 10,
pageNo: 1,
});
function tableReload() {
nextTick(() => {
@@ -65,7 +70,6 @@
pageSize: 10,
pageNo: 1,
};
console.log('apiParams.value', apiParams.value);
setRefresh();
});
}
src/components/secondaryScreen/secondMap/components/userInfoModal/stepNumber.vue
+6 -1
View File
@@ -55,7 +55,12 @@
keyType: propTypes.string.def('7'),
});
const { refresh, setRefresh } = useChangeTable();
const apiParams = ref(getParams());
const apiParams = ref({
flag: 0,
userId: props.userId,
pageSize: 10,
pageNo: 1,
});
function tableReload() {
apiParams.value = {
src/components/secondaryScreen/secondMap/components/userInfoModal/temperature.vue
+6 -1
View File
@@ -52,7 +52,12 @@
keyType: propTypes.string.def('5'),
});
const { refresh, setRefresh } = useChangeTable();
const apiParams = ref(getParams());
const apiParams = ref({
flag: 0,
userId: props.userId,
pageSize: 10,
pageNo: 1,
});
function tableReload() {
apiParams.value = {
src/components/secondaryScreen/secondMap/components/watchListDialog.vue
+1 -1
View File
@@ -128,7 +128,7 @@
:deep(.ant-table-tbody > tr > td) {
border-bottom: none;
padding: 0 4px;
padding: 10px 4px;
}
:deep(.ant-table-row:hover) {
src/components/secondaryScreen/secondMap/secondMap.vue
+28 -25
View File
@@ -9,8 +9,8 @@
</div>
<div v-show="false" id="container"></div>
<div v-show="false" id="panel"></div>
<div v-show="isShow" :class="className" class="footer-data" style="--moveUp: 50px; --moveDown: -90px">
<div class="empty-png"></div>
<!-- <div v-show="isShow" :class="className" class="footer-data" style="&#45;&#45;moveUp: 120px; &#45;&#45;moveDown: -80px">-->
<div v-show="isShow" :class="className" class="footer-data" style="--moveUp: 20px; --moveDown: -80px">
<div
v-for="item in footerList"
:style="{ cursor: item.key == 'allotDeviceNum' ? 'pointer' : 'default' }"
@@ -25,7 +25,7 @@
v-show="isShowAlarm"
:class="isShowAlarm ? 'slide-top' : 'slide-bottom'"
class="footer-dialog-con"
style="--moveUp: 120px; --moveDown: -120px"
style="--moveUp: 20px; --moveDown: -180px"
>
<FooterDialog :detailLeft="detailLeft" :detailRight="detailRight" @closeDialog="closeDialog"></FooterDialog>
</div>
@@ -73,7 +73,7 @@
async function getFooterTable(orgCode) {
const params = {
orgCode: orgCode || props.orgCode,
dataDate: getToday(),
// dataDate: getToday(),
};
const { code, result } = await footerApi(params);
if (code == 200) {
@@ -83,10 +83,14 @@
async function getMapList() {
try {
const { code, result } = await mapListApi({});
const { code, result } = await mapListApi({ orgCode: props.orgCode });
if (code == 200 && result.length > 0) {
const newArr = result.map((item) => ({ ...item, type: '6' }));
mapList.value = newArr;
let orgCode = newArr[0].orgCode?.substring(0, 6);
getFooterTable(orgCode);
setIsShow(true);
Map.createOverlay(
newArr,
{
@@ -101,10 +105,13 @@
},
},
(val) => {
getFooterTable(val.orgCode);
getFooterTable(val.orgCode?.substring(0, 6));
setIsShow(true);
}
);
} else {
Map.removeOverlayGroup();
setIsShow(false);
}
} catch {}
}
@@ -158,6 +165,7 @@
display: flex;
flex-direction: column;
position: relative;
overflow: hidden;
}
.form-container {
@@ -174,21 +182,12 @@
.footer-data {
position: absolute;
left: 0;
right: 0;
left: 4px;
right: 4px;
bottom: var(--moveDown);
display: flex;
z-index: 999;
.empty-png {
position: absolute;
top: -16px;
left: 0;
width: 100%;
height: 16px;
background: url('../../../assets/images/bg.png') no-repeat;
background-position-y: -500px;
}
border: 1px solid rgba(35, 132, 221);
.col-item {
flex: 1;
@@ -198,7 +197,7 @@
.col-text {
height: 40px;
line-height: 40px;
background: rgba(35, 132, 221);
background: rgba(35, 132, 221, 0.5);
}
.col-value {
@@ -211,8 +210,8 @@
.footer-dialog-con {
position: absolute;
left: 0;
right: 0;
left: 4px;
right: 4px;
bottom: var(--moveDown);
z-index: 999;
}
@@ -223,10 +222,12 @@
@keyframes slide-top {
0% {
transform: translateY(0);
//transform: translateY(var(--moveUp));
bottom: var(--moveDown);
}
100% {
transform: translateY(var(--moveDown));
//transform: translateY(var(--moveDown));
bottom: var(--moveUp);
}
}
@@ -236,10 +237,12 @@
@keyframes slide-bottom {
0% {
transform: translateY(var(--moveDown));
//transform: translateY(var(--moveDown));
bottom: var(--moveUp);
}
100% {
transform: translateY(var(--moveUp));
//transform: translateY(var(--moveUp));
bottom: var(--moveDown);
}
}
}
src/components/secondaryScreen/secondMap/secondMapHooks.ts
+7 -8
View File
@@ -22,7 +22,7 @@ export function useDepart() {
}
async function getOptionData() {
const { result, code } = await allSecondaryDeparts();
const { result = [], code } = await allSecondaryDeparts();
if (code == 200) {
let res = [{ departName: '长庆油田', orgCode: 'A01' }, ...result];
setOption(res);
@@ -80,12 +80,12 @@ export function useFooterTable() {
key: 'userCount',
extData: {},
},
{
name: '入库设备数量',
value: '',
key: 'deviceNum',
extData: {},
},
// {
// name: '入库设备数量',
// value: '',
// key: 'deviceNum',
// extData: {},
// },
{
name: '佩戴手表人数',
value: '',
@@ -115,7 +115,6 @@ export function useFooterTable() {
function setFooterList(res: any) {
const arrList = cloneDeep(footerList.value);
if (res) {
console.log('resssss', res);
arrList.forEach((item) => {
item.value = res[item.key];
item.extData = res;
src/router/index.ts
+2 -24
View File
@@ -1,6 +1,4 @@
import {createRouter, createWebHistory, Router, RouteRecordRaw} from 'vue-router';
import {getAuthCache} from '/@/utils/auth.ts';
import {TOKEN_KEY} from '/@/enum/cacheEnum.ts';
import { createRouter, createWebHistory, Router, RouteRecordRaw } from 'vue-router';
const routes: Array<RouteRecordRaw> = [
{
@@ -36,27 +34,7 @@ const routes: Array<RouteRecordRaw> = [
const router: Router = createRouter({
history: createWebHistory('/'),
// mode: 'hash',
routes: [...routes],
});
let token = getAuthCache(TOKEN_KEY);
// router.beforeEach((to, from, next) => {
// console.log('to', to);
// console.log('token', token);
// // token = null;
// if (token) {
// // 如果已经登录的话
// next();
// } else {
// if (to.path === '/login') {
// // 如果是登录页面的话，直接next()
// next();
// } else {
// // 否则 跳转到登录页面
// next({
// path: '/login',
// });
// }
// }
// });
export default router;
src/store/modules/detailData.ts
+17
View File
@@ -0,0 +1,17 @@
import { defineStore } from 'pinia';
export const useDetailStore = defineStore({
id: 'detail-store',
state: () => ({
alerdyreceive: '',
totalacceptance: '',
}),
actions: {
setAlerdyreceive(info) {
this.alerdyreceive = info;
},
setTotalacceptance(info) {
this.totalacceptance = info;
},
},
});
src/utils/socket.ts
+8 -8
View File
@@ -1,4 +1,4 @@
import { onMounted, onUnmounted, ref } from 'vue';
import { ref } from 'vue';
import { getAppEnvConfig } from '/@/utils/env.ts';
import { useUserStore } from '/@/store/modules/user.ts';
import { getAuthCache } from '/@/utils/auth.ts';
@@ -33,7 +33,7 @@ export function useSocket(p = basicPath) {
//心跳检测
const heartCheck = {
timeout: 1000 * 10, //1分钟发一次心跳
timeout: 1000 * 50, //50s发一次心跳
timeoutObj: null,
serverTimeoutObj: null,
reset: function () {
@@ -47,10 +47,10 @@ export function useSocket(p = basicPath) {
//这里发送一个心跳，后端收到后，返回一个心跳消息，
//onmessage拿到返回的心跳就说明连接正常
if (socket.value.readyState === WebSocket.OPEN) {
//console.log('p1' + new Date().toLocaleString());
console.log('连接正常' + new Date().toLocaleString());
socket.value.send('ping');
} else {
//console.log('p2');
console.log('连接断开');
init();
}
self.serverTimeoutObj = setTimeout(function () {
@@ -74,20 +74,20 @@ export function useSocket(p = basicPath) {
socket.value.onclose = function () {
reconnect(path.value);
//console.log('连接关闭!:', new Date().toLocaleString());
console.log('连接关闭', new Date().toLocaleString());
};
socket.value.onerror = function () {
reconnect(path.value);
//console.log('连接错误!');
console.log('连接错误');
};
socket.value.onopen = function () {
heartCheck.reset().start(); //心跳检测重置
//console.log('连接成功!' + new Date().toLocaleString());
console.log('连接成功:' + new Date().toLocaleString());
};
socket.value.onmessage = function (event) {
//如果获取到消息，心跳检测重置
heartCheck.reset().start(); //拿到任何消息都说明当前连接是正常的
//console.log('收到消息啦:', event);
console.log('收到消息:', event.data);
if (event.data != 'pong') {
let data = JSON.parse(event.data);
socketData.value = data;
src/utils/utils.ts
+2 -2
View File
@@ -8,9 +8,9 @@ export function getZero(num: any) {
return num;
}
export function useTopTime() {
export function useTopTime(startDay = '2018-10-01') {
const timeLeft = dayjs().format('YYYY年MM月DD日 HH时mm分ss秒');
const timeRight = dayjs().diff(dayjs('2018-10-01'), 'day') + '天';
const timeRight = dayjs().diff(dayjs(startDay), 'day') + '天';
// +
// getZero(dayjs().diff(dayjs(dayjs().format('YYYY-MM-DD') + ' 00:00:00'), 'hours')) +
// '时' +
src/views/index.vue
+43 -43
View File
@@ -78,57 +78,57 @@
});
//应急求助
// const { socketData: emergencyData, setSocketData: setEmergencyData, closeSocket: closeSocket2 } = useSocket(emergencyPath);
// const emergencyDialogRef = ref();
//
// watch(emergencyData, (nVal) => {
// if (nVal) {
// nextTick(() => {
// setEmergencyData(nVal);
// emergencyDialogRef.value.openDialog;
// });
// }
// });
const { socketData: emergencyData, setSocketData: setEmergencyData, closeSocket: closeSocket2 } = useSocket(emergencyPath);
const emergencyDialogRef = ref();
watch(emergencyData, (nVal) => {
if (nVal) {
nextTick(() => {
setEmergencyData(nVal);
emergencyDialogRef.value.openDialog;
});
}
});
onUnmounted(() => {
// 监听窗口关闭事件，当窗口关闭时，主动去关闭websocket连接，防止连接还没断开就关闭窗口，server端会抛异常。
window.onbeforeunload = function () {
// closeSocket();
// closeSocket2();
closeSocket();
closeSocket2();
};
clearInterval(interval.value);
});
function test() {
let nVal = {
watchNo: 'CRFTQ22C03000080',
eventType: 'heart_rate',
bindUserId: 'fd358031299d4816b5d304fd818ecc73',
createBy: null,
createDate: null,
dataValue: '999',
address:
'一段文字一段文字一段文字一段文字一段文字一段文字一段文字一段文字一段文字一段文字一段文字一段文字一段文字一段文字一段文字一段文字一段文字一段文字一段文字一段文字一段文字一段文字一段文字一段文字一段文字一段文字一段文字一段文字一段文字',
lon: 108.6666,
lat: 29.8888,
dataDate: '2023-12-07',
warnTime: '2023-12-07',
gpsErrorMsg: '',
lonGd: 108.67084314886117,
latGd: 29.88607705672868,
addressGd: null,
sendFlag: '0',
largeScreenFlag: '0',
orgCode: null,
orgName: '冯地坑采油作业区',
realName: '王志文',
phone: '15229020494',
};
nextTick(() => {
setEmergencyData(nVal);
emergencyDialogRef.value.openDialog();
});
}
// function test() {
// let nVal = {
// watchNo: 'CRFTQ22C03000080',
// eventType: 'heart_rate',
// bindUserId: 'fd358031299d4816b5d304fd818ecc73',
// createBy: null,
// createDate: null,
// dataValue: '999',
// address:
// '一段文字一段文字一段文字一段文字一段文字一段文字一段文字一段文字一段文字一段文字一段文字一段文字一段文字一段文字一段文字一段文字一段文字一段文字一段文字一段文字一段文字一段文字一段文字一段文字一段文字一段文字一段文字一段文字一段文字',
// lon: 108.6666,
// lat: 29.8888,
// dataDate: '2023-12-07',
// warnTime: '2023-12-07',
// gpsErrorMsg: '',
// lonGd: 108.67084314886117,
// latGd: 29.88607705672868,
// addressGd: null,
// sendFlag: '0',
// largeScreenFlag: '0',
// orgCode: null,
// orgName: '冯地坑采油作业区',
// realName: '王志文',
// phone: '15229020494',
// };
// nextTick(() => {
// setEmergencyData(nVal);
// emergencyDialogRef.value.openDialog();
// });
// }
</script>
<style lang="less" scoped>
.outer {
src/views/indexSon.vue
+9 -5
View File
@@ -10,7 +10,7 @@
</span>
</div>
<div class="title-d-middle"> 心血管监测</div>
<div class="title-d-right"> 累计运行时间：{{ dayTimeT }}</div>
<div class="title-d-right"> 累计监测时间：{{ dayTimeT }}</div>
</div>
<div class="body-d">
<div class="body-d-left">
@@ -22,11 +22,11 @@
<a-select
placeholder="选择单位"
v-model:value="orgCode"
class="type-select"
class="type-select bg-000"
:options="option"
:field-names="fieldNames"
></a-select>
<a-select placeholder="选择时间范围" v-model:value="type" class="type-select" :options="timeRangeOption"></a-select>
<a-select placeholder="选择时间范围" v-model:value="type" class="type-select bg-000" :options="timeRangeOption"></a-select>
</template>
</SecondMap>
</div>
@@ -79,12 +79,12 @@
const dayTimeT = ref();
function getTime() {
const { timeRight } = useTopTime();
const { timeRight } = useTopTime('2022-12-20');
dayTimeT.value = timeRight;
}
function clickBack() {
router.replace({ path: '/home' });
router.push({ path: '/home' });
}
</script>
<style lang="less" scoped>
@@ -192,6 +192,10 @@
.type-select {
width: 140px;
margin-right: 10px;
:deep(.ant-select-selection-item) {
color: #fff !important;
}
}
}