ljy/yak_handcuffs
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

2025年04月30日10:50:02

Browse Source
This commit is contained in:
luojiayi 2025-04-30 10:50:03 +08:00
parent 744295e916
commit dd4d7b2412
6 changed files with 91 additions and 124 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
.env.development
View File

@ -1,8 +1,8 @@
VITE_APP_URL = 'http://192.168.3.116:8001/'
VITE_APP_URL_WEBSOCKET = 'http://192.168.3.116:8000/api/websocket'
# VITE_APP_URL = 'http://192.168.3.116:8001/'
# VITE_APP_URL_WEBSOCKET = 'http://192.168.3.116:8000/api/websocket'
# VITE_APP_URL = 'http://47.112.185.26:8001/'
# VITE_APP_URL_WEBSOCKET = 'ws://47.112.185.26:8000/api/websocket'
VITE_APP_URL = 'http://47.112.185.26:8001/'
VITE_APP_URL_WEBSOCKET = 'ws://47.112.185.26:8000/api/websocket'
# VITE_APP_URL = 'http://api.handcuff.zhuhaiguangdun.cn'
# VITE_APP_URL_WEBSOCKET = 'ws://device.handcuff.zhuhaiguangdun.cn:8000/api/websocket'

1
components.d.ts vendored
View File

@ -46,6 +46,7 @@ declare module '@vue/runtime-core' {
InfoWindow: typeof import('./src/components/InfoWindow.vue')['default']
RouterLink: typeof import('vue-router')['RouterLink']
RouterView: typeof import('vue-router')['RouterView']
SectionDate: typeof import('./src/components/sectionDate.vue')['default']
Sidebar: typeof import('./src/components/sidebar.vue')['default']
TableCustom: typeof import('./src/components/table-custom.vue')['default']
TableDetail: typeof import('./src/components/table-detail.vue')['default']

73
src/components/sectionDate.vue Normal file
View File

@ -0,0 +1,73 @@
<template>
<div class="condition">
<el-radio-group v-model="radioType">
<el-radio-button label="时" value="hour" />
<el-radio-button label="天" value="day" />
<el-radio-button label="周" value="week" />
</el-radio-group>
<div class="condition-time">
<el-date-picker
v-if="radioType == 'hour'"
style="width: 350px"
v-model="value"
type="datetimerange"
format="YYYY-MM-DD HH:mm:ss"
value-format="YYYY-MM-DD HH:mm:ss"
start-placeholder="开始时间"
end-placeholder="结束时间"
@change="handleDateChange"
/>
<el-date-picker
v-else-if="radioType == 'day'"
style="width: 350px"
v-model="value1"
type="daterange"
value-format="YYYY-MM-DD HH:mm:ss"
start-placeholder="开始时间"
end-placeholder="结束时间"
@change="handleDateChange"
/>
<el-date-picker v-else style="width: 370px" v-model="value2" type="week" value-format="YYYY-MM-DD" placeholder="请选择周" @change="handleWeekChange" />
</div>
</div>
</template>
<script setup lang="ts">
import { format } from "@/utils";
import { ref } from "vue";
const value = ref("");
const value1 = ref("");
const value2 = ref("");
const radioType = ref("hour");
const emit = defineEmits(["change"]);
const handleWeekChange = (val) => {
value.value = "";
value1.value = "";
let time = new Date(val).getTime() + 6 * 24 * 60 * 60 * 1000;
emit("change", { startDate: `${val} 00:00:00`, endDate: `${format(time, "YYYY-MM-DD")} 00:00:00`, type: radioType.value });
};
const handleDateChange = (val) => {
if (radioType.value === "hour") {
value1.value = "";
value2.value = "";
} else {
value.value = "";
value2.value = "";
}
emit("change", { startDate: val[0], endDate: val[1], type: radioType.value });
};
</script>
<style scoped lang="less">
.condition {
display: flex;
align-items: center;
margin-left: 20px;
.condition-time {
overflow: hidden;
margin-left: 20px;
}
}
</style>

56
src/views/statisticalCenter/deviceHistory.vue
View File

@ -2,59 +2,20 @@
<div class="deviceStatistics card">
<div class="card-head">
<div class="title">内容数据</div>
<div class="condition">
<el-radio-group v-model="radioType">
<el-radio-button label="时" value="hour" />
<el-radio-button label="天" value="day" />
<el-radio-button label="周" value="week" />
</el-radio-group>
<div class="condition-time">
<el-date-picker
style="width: 370px"
v-if="radioType == 'week'"
v-model="value"
type="week"
value-format="YYYY-MM-DD"
placeholder="请选择周"
@change="handleWeekChange"
/>
<el-date-picker
v-else
style="width: 350px"
v-model="value1"
type="datetimerange"
format="YYYY-MM-DD HH:mm:ss"
value-format="YYYY-MM-DD HH:mm:ss"
start-placeholder="开始时间"
end-placeholder="结束时间"
@change="handleDateChange"
/>
</div>
</div>
<SectionDate @change="api" />
</div>
<slot name="chart"></slot>
</div>
</template>
<script setup>
import { format } from "@/utils";
import { ref } from "vue";
const value = ref("");
const value1 = ref("");
const radioType = ref("hour");
const { api } = defineProps({
import SectionDate from "@/components/sectionDate.vue";
const props = defineProps({
api: {
type: Function,
required: true,
},
});
const handleWeekChange = (val) => {
let time = new Date(val).getTime() + 6 * 24 * 60 * 60 * 1000;
api({ type: radioType.value, startDate: `${val} 00:00:00`, endDate: `${format(time, "YYYY-MM-DD")} 00:00:00` });
};
const handleDateChange = (val) => {
api({ type: radioType.value, startDate: val[0], endDate: val[1] });
};
</script>
<style scoped lang="less">
.card {
@ -87,15 +48,6 @@ const handleDateChange = (val) => {
background: #061451;
}
}
.condition {
display: flex;
align-items: center;
margin-left: 20px;
.condition-time {
overflow: hidden;
margin-left: 20px;
}
}
}
}
</style>

8
src/views/statisticalCenter/index.vue
View File

@ -122,7 +122,6 @@ let option2 = ref({
{ value: 0, name: "SOS告警" },
{ value: 0, name: "围栏告警" },
{ value: 0, name: "破坏告警" },
{ value: 0, name: "低电告警" },
{ value: 0, name: "心率告警" },
{ value: 0, name: "血氧告警" },
{ value: 0, name: "体温告警" },
@ -154,7 +153,6 @@ const getStatisticsWarningApi = () => {
{ value: res?.sosCount, name: "SOS告警" },
{ value: res?.railCount, name: "围栏告警" },
{ value: res?.destroyCount, name: "破坏告警" },
{ value: res?.batteryCount, name: "低电告警" },
{ value: res?.heartRateCount, name: "心率告警" },
{ value: res?.bloodOxygenCount, name: "血氧告警" },
{ value: res?.tempCount, name: "体温告警" },
@ -175,28 +173,24 @@ const getStatisticsUseCount = () => {
const getStatisticsContent = (req) => {
statisticsContent(req).then((res) => {
if (res.times && res.times.length) {
option.value.xAxis.data = res.times;
option.value.xAxis.data = res.times.map((item) => (req.type == "hour" ? format(item) : format(item, "YYYY-MM-DD")));
option.value.series = [
{
stack: "Total",
name: "SOS预警数组",
data: res?.sosArr,
type: "line",
},
{
stack: "Total",
name: "围栏预警数组",
data: res?.railArr,
type: "line",
},
{
stack: "Total",
name: "破坏预警数组",
data: res?.destroyArr,
type: "line",
},
{
stack: "Total",
name: "生理预警数组",
data: res?.healthArr,
type: "line",

69
src/views/synthesizeManage/mapLocation/index.vue
View File

@ -3,57 +3,10 @@
<div class="box">
<div class="editTool">
<span>时间区间：</span>
<el-radio-group v-model="sectionType">
<el-radio-button :value="1">小时</el-radio-button>
<el-radio-button :value="2">天</el-radio-button>
<el-radio-button :value="3">周</el-radio-button>
</el-radio-group>
<div class="editTool-time">
<el-date-picker
v-if="sectionType != 3"
style="width: 300px"
type="datetimerange"
range-separator="-"
start-placeholder="开始时间"
end-placeholder="结束时间"
v-model="time"
@change="timeChange"
/>
<el-date-picker v-model="week" v-else type="week" value-format="YYYY-MM-DD" placeholder="请选择周" @change="weekChange" />
</div>
<!-- <span>位置样式：</span>
<el-radio-group v-model="styleType">
<el-radio-button :value="1">点</el-radio-button>
<el-radio-button :value="2">线</el-radio-button>
</el-radio-group> -->
<SectionDate @change="sectionDateChange" />
</div>
<div id="mapcontainer" style="flex: 1"></div>
</div>
<!-- <el-row :gutter="20">
<el-col :span="6">
<div class="incidentList">
<div class="head">
<div class="head-text">选择设备（SN列表）</div>
</div>
<div class="list scrollbar">
<div class="list-item" :class="`${index == 0 ? 'active' : ''}`" v-for="(item, index) in 15" :key="item">
<div class="img">
<img :src="handcuffs" alt="" />
</div>
<div class="content">
<div class="content-name">设备序号：10</div>
<div class="content-time">2025/03/26 18:33:32</div>
</div>
<el-icon v-if="index == 0"><View /></el-icon>
<el-icon v-else><Hide /></el-icon>
</div>
</div>
</div>
</el-col>
<el-col :span="24" class="container-right">
</el-col>
</el-row> -->
<div :style="{ display: 'none' }">
<InfoWindow class="infoBox" :value="deviceInfo" @close="InfoWin.close()" />
</div>
@ -72,14 +25,12 @@ import InfoWindow from "@/components/InfoWindow.vue";
import ViaMarker from "@/assets/img/via-marker.png";
import endMarker from "@/assets/img/end-marker.png";
import startMarker from "@/assets/img/start-marker.png";
import SectionDate from "@/components/sectionDate.vue";
const { query } = useRoute();
let d = new Date();
let newMap = null;
let time = ref([new Date(`${format(d, "YYYY-MM-DD")} 00:00:00`), new Date(`${format(d, "YYYY-MM-DD")} 23:59:59`)]);
let week = ref(d);
let deviceInfo = ref({});
let sectionType = ref(1);
let InfoWin = null;
const params = reactive<TLocateRecord.TReq>({
@ -88,23 +39,18 @@ const params = reactive<TLocateRecord.TReq>({
endDate: `${format(d, "YYYY-MM-DD")} 23:59:59`,
});
const weekChange = (val: any) => {
let endTime = new Date(val).getTime() + 6 * 24 * 60 * 60 * 1000;
params.startDate = `${val} 00:00:00`;
params.endDate = `${format(endTime, "YYYY-MM-DD")} 23:59:59`;
getLocateRecord();
};
const timeChange = (val: any) => {
params.startDate = `${format(val[0], "YYYY-MM-DD")} 00:00:00`;
params.endDate = `${format(val[1], "YYYY-MM-DD")} 23:59:59`;
const sectionDateChange = (val) => {
params.startDate = val.startDate;
params.endDate = val.endDate;
getLocateRecord();
};
const getLocateRecord = () => {
locateRecord(params).then((res) => {
newMap.clearMap();
if (res && res.length) {
let list = res;
newMap.clearMap();
newMap.setCenter([list[0].lng, list[0].lat]);
newMap.polyline(list);
let startIcon = newMap.newIcon({
@ -136,6 +82,7 @@ const getLocateRecord = () => {
InfoWin.open(newMap.map, marker.getPosition());
});
});
} else {
}
});
};