Commit 1c3af17a authored by 张牧越's avatar 张牧越

7.19首页、视频监控改版

parent aebe1bbf
NODE_ENV = "development"
Mock: true
VUE_APP_API_URL = "http://qjwl.ythplan.com"
VUE_APP_API_URL = "http://192.168.0.228:8002"
......@@ -48,6 +48,55 @@ export function getProgressDetail() {
})
}
export function getPersonConfig() {
return request({
url: '/pweb/s/project/person/config',
method: 'get'
})
}
export function getCheckInList(params) {
return request({
url: '/pweb/s/project/person/list',
method: 'get',
params
})
}
export function getDeviceConfigOptions() {
return request({
url: '/pweb/s/project/device/config',
method: 'get'
})
}
export function getDeviceList(params) {
return request({
url: '/pweb/s/project/device/list',
method: 'get',
params
})
}
export function getAIWarningConfigOptions() {
return request({
url: '/pweb/s/project/ai/warning/config',
method: 'get'
})
}
export function getAIWarningList(params) {
return request({
url: '/pweb/s/project/ai/warning/list',
method: 'get',
params
})
}
// real-name
......@@ -121,6 +170,20 @@ export function getAllVideoUrl(params) {
}
export function startCameraMove(id, params) {
return noLoadingrequest({
url: `/pweb/s/camera/control/start/${id}`,
method: 'get',
params
})
}
export function stopCameraMove(id) {
return noLoadingrequest({
url: `/pweb/s/camera/control/stop/${id}`,
method: 'get'
})
}
// early-warning
export function getAIdata() {
......
......@@ -123,6 +123,10 @@
color: #fff;
}
::v-deep .el-form-item {
margin-bottom: 0;
}
::v-deep .el-range-input {
background: transparent;
}
......@@ -214,4 +218,10 @@
::v-deep .el-slider__runway.disabled .el-slider__button-wrapper.hover,
::v-deep .el-slider__runway.disabled .el-slider__button-wrapper:hover {
cursor: default !important;
}
::v-deep .el-date-editor--daterange.el-input,
::v-deep .el-date-editor--daterange.el-input__inner {
width: 300px;
}
\ No newline at end of file
@font-face {
font-family: "iconfont";
/* Project id 4100703 */
src: url('iconfont.woff2?t=1686809530756') format('woff2'),
url('iconfont.woff?t=1686809530756') format('woff'),
url('iconfont.ttf?t=1686809530756') format('truetype');
src: url('iconfont.woff2?t=1689752730446') format('woff2'),
url('iconfont.woff?t=1689752730446') format('woff'),
url('iconfont.ttf?t=1689752730446') format('truetype');
}
.iconfont {
......@@ -14,6 +14,66 @@
-moz-osx-font-smoothing: grayscale;
}
.icon-jiaojufangda:before {
content: "\e602";
}
.icon-jiaojusuoxiao:before {
content: "\e603";
}
.icon-zhongxin:before {
content: "\e9e4";
}
.icon-youxia:before {
content: "\e9e0";
}
.icon-youshang:before {
content: "\e9e1";
}
.icon-you2:before {
content: "\e9e2";
}
.icon-jinjiaoju:before {
content: "\e9e3";
}
.icon-zuoxia:before {
content: "\e9e5";
}
.icon-zuo:before {
content: "\e9e6";
}
.icon-xia:before {
content: "\e9e7";
}
.icon-zuoshang:before {
content: "\e9e8";
}
.icon-fangda:before {
content: "\e9dd";
}
.icon-yuanjiaoju:before {
content: "\e9dc";
}
.icon-shang:before {
content: "\e9de";
}
.icon-suoxiao:before {
content: "\e9df";
}
.icon-report-fill-03:before {
content: "\e9cf";
}
......
This diff is collapsed.
{
"id": "4100703",
"name": "智慧工地",
"name": "智慧工地-大屏",
"font_family": "font_family",
"css_prefix_text": "icon-",
"description": "",
"glyphs": [
{
"icon_id": "20743929",
"name": "焦距放大",
"font_class": "jiaojufangda",
"unicode": "e602",
"unicode_decimal": 58882
},
{
"icon_id": "20743932",
"name": "焦距缩小",
"font_class": "jiaojusuoxiao",
"unicode": "e603",
"unicode_decimal": 58883
},
{
"icon_id": "36509848",
"name": "中心",
"font_class": "zhongxin",
"unicode": "e9e4",
"unicode_decimal": 59876
},
{
"icon_id": "36508440",
"name": "右下",
"font_class": "youxia",
"unicode": "e9e0",
"unicode_decimal": 59872
},
{
"icon_id": "36508439",
"name": "右上",
"font_class": "youshang",
"unicode": "e9e1",
"unicode_decimal": 59873
},
{
"icon_id": "36508437",
"name": "右",
"font_class": "you2",
"unicode": "e9e2",
"unicode_decimal": 59874
},
{
"icon_id": "36508429",
"name": "近焦距",
"font_class": "jinjiaoju",
"unicode": "e9e3",
"unicode_decimal": 59875
},
{
"icon_id": "36508431",
"name": "左下",
"font_class": "zuoxia",
"unicode": "e9e5",
"unicode_decimal": 59877
},
{
"icon_id": "36508432",
"name": "左",
"font_class": "zuo",
"unicode": "e9e6",
"unicode_decimal": 59878
},
{
"icon_id": "36508433",
"name": "下",
"font_class": "xia",
"unicode": "e9e7",
"unicode_decimal": 59879
},
{
"icon_id": "36508430",
"name": "左上",
"font_class": "zuoshang",
"unicode": "e9e8",
"unicode_decimal": 59880
},
{
"icon_id": "36508441",
"name": "放大",
"font_class": "fangda",
"unicode": "e9dd",
"unicode_decimal": 59869
},
{
"icon_id": "36508434",
"name": "远焦距",
"font_class": "yuanjiaoju",
"unicode": "e9dc",
"unicode_decimal": 59868
},
{
"icon_id": "36508436",
"name": "上",
"font_class": "shang",
"unicode": "e9de",
"unicode_decimal": 59870
},
{
"icon_id": "36508438",
"name": "缩小",
"font_class": "suoxiao",
"unicode": "e9df",
"unicode_decimal": 59871
},
{
"icon_id": "35871490",
"name": "icon_san",
......
......@@ -20,16 +20,21 @@
v-if="router.child && router.child.length == 0"
:key="index"
class="router-link"
@click="clearRoute"
>
<router-link
:to="{ path: router.menu_url, query: { token_code: token } }"
@click="clearRoute"
>
{{ router.right_name }}</router-link
>
</div>
<el-dropdown v-else :key="index" placement="bottom">
<el-dropdown
v-else
:key="index"
placement="bottom"
:hide-timeout="2000"
>
<div :class="['parent-router', router.isActive ? 'active' : '']">
{{ router.right_name
}}{{ childRouteName ? `/${childRouteName}` : "" }}
......
<template>
<el-dialog
:visible.sync="dialogVisible"
append-to-body
:title="type == 'normal' ? '普通工人今日考勤情况' : '管理人员今日考勤情况'"
top="0"
width="1200px"
>
<el-form
inline
:model="searchForm"
style="padding: 10px; background: #0e3c75; margin-bottom: 10px"
>
<el-form-item label="岗位类型">
<el-select v-model="searchForm.position_type" clearable>
<el-option
v-for="(position_type, index) in type == 'normal'
? normalPositionTypeData
: managerPositionTypeData"
:label="position_type.name"
:value="position_type.value"
:key="index"
></el-option>
</el-select>
</el-form-item>
<el-form-item v-if="type == 'normal'" label="工种">
<el-select v-model="searchForm.work_type" clearable>
<el-option
v-for="(work_type, index) in workTypeData"
:label="work_type.name"
:value="work_type.value"
:key="index"
></el-option>
</el-select>
</el-form-item>
<el-form-item label="状态">
<el-select v-model="searchForm.attendance_status" clearable>
<el-option
v-for="(attStatus, index) in attendanceStatusData"
:label="attStatus.name"
:value="attStatus.value"
:key="index"
></el-option>
</el-select>
</el-form-item>
<el-form-item label="姓名">
<el-input v-model="searchForm.keywords" placeholder="请输入姓名" />
</el-form-item>
<el-form-item>
<el-button
@click="searchRecords"
style="background: rgba(19, 168, 195, 1); color: #fff; border: none"
>查询</el-button
>
</el-form-item>
</el-form>
<el-table :data="tableData" height="550px" stripe>
<el-table-column label="姓名" prop="person_name" align="center">
</el-table-column>
<el-table-column
label="类型"
prop="position_type_name"
align="center"
></el-table-column>
<el-table-column
v-if="type == 'normal'"
label="工种"
prop="job_number"
align="center"
></el-table-column>
<el-table-column label="性别" align="center" prop="sex_name">
</el-table-column>
<el-table-column label="进场时间" align="center" prop="in_time_format">
</el-table-column>
<el-table-column label="离场时间" align="center" prop="out_time_format">
</el-table-column>
<el-table-column
label="状态"
align="center"
width="90"
prop="attendance_type_text"
>
</el-table-column>
</el-table>
<el-pagination
@size-change="handleSizeChange"
@current-change="handleCurrentChange"
:current-page="currentPage"
:page-sizes="[10, 20, 30, 40, 50]"
:page-size="pageSize"
layout="total, sizes, prev, pager, next, jumper"
:total="total"
>
</el-pagination>
</el-dialog>
</template>
<script>
import { getCheckInList, getPersonConfig } from "@/api/index";
export default {
name: "CheckInDialog",
props: {
visible: {
type: Boolean,
default: false,
},
type: {
type: String,
default: "normal",
},
},
data() {
return {
currentPage: 1,
total: 0,
searchForm: {
position_type: "",
work_type: "",
attendance_status: "",
keywords: "",
},
pageSize: 10,
tableData: [],
attendanceStatusData: [],
normalPositionTypeData: [],
managerPositionTypeData: [],
workTypeData: [],
};
},
methods: {
handleCurrentChange(current) {
getCheckInList({
...this.searchForm,
today_attendance: 1,
type: this.type == "normal" ? "2" : "1",
limit: this.pageSize,
page: current,
}).then((res) => {
this.total = res.data.total;
this.tableData = res.data.data;
this.currentPage = current;
});
},
handleSizeChange(size) {
getCheckInList({
...this.searchForm,
today_attendance: 1,
type: this.type == "normal" ? "2" : "1",
limit: size,
page: 1,
}).then((res) => {
this.total = res.data.total;
this.tableData = res.data.data;
this.currentPage = 1;
});
},
searchRecords() {
getCheckInList({
...this.searchForm,
today_attendance: 1,
type: this.type == "normal" ? "2" : "1",
limit: this.pageSize,
page: 1,
}).then((res) => {
this.total = res.data.total;
this.tableData = res.data.data;
this.currentPage = 1;
});
},
getTime(ts) {
let date = new Date(ts);
let year = date.getFullYear();
let month = date.getMonth() + 1;
let day = date.getDate();
month = month > 9 ? month : "0" + month;
day = day < 10 ? "0" + day : day;
let today = year + "-" + month + "-" + day;
return `${today}`;
},
},
computed: {
dialogVisible: {
get() {
return this.visible;
},
set(val) {
this.$emit("changeVisible", val);
},
},
},
mounted() {
getPersonConfig().then((res) => {
this.attendanceStatusData = res.data.attendanceStatusData;
this.workTypeData = res.data.workTypeData;
this.managerPositionTypeData = res.data.managerPositionTypeData;
this.normalPositionTypeData = res.data.normalPositionTypeData;
});
},
watch: {
dialogVisible(val) {
if (val) {
this.searchForm = {
type: this.type == "normal" ? "2" : "1",
today_attendance: 1,
position_type: "",
work_type: "",
attendance_status: "",
keywords: "",
};
this.searchRecords();
} else {
this.total = 0;
this.currentPage = 1;
this.tableData = [];
this.searchForm = {
position_type: "",
work_type: "",
attendance_status: "",
keywords: "",
};
}
},
},
};
</script>
<style lang="less" scoped>
.previewImg {
width: 50px;
height: 50px;
}
</style>
\ No newline at end of file
<template>
<el-dialog
:visible.sync="dialogVisible"
append-to-body
title="设备列表"
top="0"
width="1200px"
>
<el-form
inline
:model="searchForm"
style="padding: 10px; background: #0e3c75; margin-bottom: 10px"
>
<el-form-item label="在线状态">
<el-select v-model="searchForm.is_online" clearable>
<el-option
v-for="(status, index) in deviceOnlineOptions"
:label="status.name"
:value="status.value"
:key="index"
></el-option>
</el-select>
</el-form-item>
<el-form-item>
<el-button
@click="searchRecords"
style="background: rgba(19, 168, 195, 1); color: #fff; border: none"
>查询</el-button
>
</el-form-item>
</el-form>
<el-table :data="tableData" height="550px" stripe>
<el-table-column label="设备名称" prop="device_name" align="center">
</el-table-column>
<el-table-column
label="设备编号"
prop="device_no"
align="center"
></el-table-column>
<el-table-column
label="设备型号"
prop="model"
align="center"
></el-table-column>
<el-table-column label="厂家" align="center" prop="produce_name">
</el-table-column>
<el-table-column
label="在线状态"
align="center"
width="90"
prop="is_online_text"
>
<template slot-scope="scope">
<span
:style="{ color: scope.row.is_online == 1 ? '#5CFF6B' : '#FF5C5C' }"
>{{ scope.row.is_online_text }}</span
>
</template>
</el-table-column>
<el-table-column label="所在区域" align="center" prop="area_name">
</el-table-column>
</el-table>
<el-pagination
@size-change="handleSizeChange"
@current-change="handleCurrentChange"
:current-page="currentPage"
:page-sizes="[10, 20, 30, 40, 50]"
:page-size="pageSize"
layout="total, sizes, prev, pager, next, jumper"
:total="total"
>
</el-pagination>
</el-dialog>
</template>
<script>
import { getDeviceConfigOptions, getDeviceList } from "@/api/index";
export default {
name: "TodayCheckInDialog",
props: {
visible: {
type: Boolean,
default: false,
},
type: {
type: String,
default: "",
},
},
data() {
return {
currentPage: 1,
total: 0,
searchForm: {
status: "",
is_online: "",
},
pageSize: 10,
tableData: [],
deviceOnlineOptions: [],
};
},
methods: {
handleCurrentChange(current) {
getDeviceList({
...this.searchForm,
limit: this.pageSize,
page: current,
}).then((res) => {
this.total = res.data.total;
this.tableData = res.data.data;
this.currentPage = current;
});
},
handleSizeChange(size) {
getDeviceList({
...this.searchForm,
limit: size,
page: 1,
}).then((res) => {
this.total = res.data.total;
this.tableData = res.data.data;
this.currentPage = 1;
});
},
searchRecords() {
getDeviceList({
...this.searchForm,
limit: this.pageSize,
page: 1,
}).then((res) => {
this.total = res.data.total;
this.tableData = res.data.data;
this.currentPage = 1;
});
},
},
mounted() {
getDeviceConfigOptions().then((res) => {
this.deviceOnlineOptions = res.data.isOnlineData;
});
},
computed: {
dialogVisible: {
get() {
return this.visible;
},
set(val) {
this.$emit("changeVisible", val);
},
},
},
watch: {
dialogVisible(val) {
if (val) {
this.searchForm.is_online = this.type === "" ? "" : Number(this.type);
this.searchRecords();
} else {
this.tableData = [];
this.searchForm = {
status: "",
is_online: "",
};
}
},
},
};
</script>
<style lang="less" scoped>
.previewImg {
width: 50px;
height: 50px;
}
</style>
\ No newline at end of file
This diff is collapsed.
<template>
<el-dialog
:visible.sync="dialogVisible"
append-to-body
title="AI预警汇总"
top="0"
width="1200px"
>
<el-form
inline
:model="searchForm"
style="padding: 10px; background: #0e3c75; margin-bottom: 10px"
>
<el-form-item label="预警时间">
<el-date-picker
v-model="searchForm.dateRange"
type="daterange"
range-separator="至"
start-placeholder="开始日期"
end-placeholder="结束日期"
value-format="yyyy-MM-dd"
clearable
>
</el-date-picker>
</el-form-item>
<el-form-item label="预警位置">
<el-select v-model="searchForm.area_id" clearable>
<el-option
v-for="(position, index) in warningPositionOptions"
:label="position.name"
:value="position.id"
:key="index"
></el-option>
</el-select>
</el-form-item>
<el-form-item label="处置状态">
<el-select v-model="searchForm.status" clearable>
<el-option
v-for="(status, index) in warningStatusOptions"
:label="status.name"
:value="status.value"
:key="index"
></el-option>
</el-select>
</el-form-item>
<el-form-item>
<el-button
@click="searchRecords"
style="background: rgba(19, 168, 195, 1); color: #fff; border: none"
>查询</el-button
>
</el-form-item>
</el-form>
<el-table :data="tableData" height="550px" stripe>
<el-table-column label="预警拍照" prop="" align="center">
<template slot-scope="scope">
<el-image
:src="scope.row.alarm_big_img_url"
:preview-src-list="[scope.row.alarm_big_img_url]"
class="previewImg"
/>
</template>
</el-table-column>
<el-table-column
label="预警内容"
prop="alarm_content"
align="center"
></el-table-column>
<el-table-column
label="预警时间"
prop="log_time"
align="center"
></el-table-column>
<el-table-column label="预警位置" align="center" prop="area_name">
</el-table-column>
<el-table-column label="处置状态" align="center" prop="status_text">
<template slot-scope="scope">
<span
:style="{
color:
scope.row.status == 3
? '#5CFF6B'
: scope.row.status == 2
? '#FFC05C'
: '#FF5C5C',
}"
>{{ scope.row.status_text }}</span
>
</template>
</el-table-column>
</el-table>
<el-pagination
@size-change="handleSizeChange"
@current-change="handleCurrentChange"
:current-page="currentPage"
:page-sizes="[10, 20, 30, 40, 50]"
:page-size="pageSize"
layout="total, sizes, prev, pager, next, jumper"
:total="total"
>
</el-pagination>
</el-dialog>
</template>
<script>
import { getAIWarningConfigOptions, getAIWarningList } from "@/api/index";
export default {
name: "WarningRecordDialog",
props: {
visible: {
type: Boolean,
default: false,
},
},
data() {
return {
currentPage: 1,
total: 0,
searchForm: {
dateRange: ["", ""],
status: "",
area_id: "",
},
pageSize: 10,
tableData: [],
warningPositionOptions: [],
warningStatusOptions: [],
};
},
methods: {
handleCurrentChange(current) {
getAIWarningList({
start_log_time:
this.searchForm.dateRange && this.searchForm.dateRange[0]
? this.searchForm.dateRange[0] + " 00:00:00"
: "",
end_log_time:
this.searchForm.dateRange && this.searchForm.dateRange[1]
? this.searchForm.dateRange[1] + " 23:59:59"
: "",
status: this.searchForm.status,
area_id: this.searchForm.area_id,
limit: this.pageSize,
page: current,
}).then((res) => {
this.total = res.data.total;
this.tableData = res.data.data;
this.currentPage = current;
});
},
handleSizeChange(size) {
getAIWarningList({
start_log_time:
this.searchForm.dateRange && this.searchForm.dateRange[0]
? this.searchForm.dateRange[0] + " 00:00:00"
: "",
end_log_time:
this.searchForm.dateRange && this.searchForm.dateRange[1]
? this.searchForm.dateRange[1] + " 23:59:59"
: "",
status: this.searchForm.status,
area_id: this.searchForm.area_id,
limit: size,
page: 1,
}).then((res) => {
this.total = res.data.total;
this.tableData = res.data.data;
this.currentPage = 1;
});
},
searchRecords() {
getAIWarningList({
start_log_time:
this.searchForm.dateRange && this.searchForm.dateRange[0]
? this.searchForm.dateRange[0] + " 00:00:00"
: "",
end_log_time:
this.searchForm.dateRange && this.searchForm.dateRange[1]
? this.searchForm.dateRange[1] + " 23:59:59"
: "",
status: this.searchForm.status,
area_id: this.searchForm.area_id,
limit: this.pageSize,
page: 1,
}).then((res) => {
this.total = res.data.total;
this.tableData = res.data.data;
this.currentPage = 1;
});
},
getTime(ts) {
let date = new Date(ts);
let year = date.getFullYear();
let month = date.getMonth() + 1;
let day = date.getDate();
month = month > 9 ? month : "0" + month;
day = day < 10 ? "0" + day : day;
let today = year + "-" + month + "-" + day;
return `${today}`;
},
},
mounted() {
getAIWarningConfigOptions().then((res) => {
this.warningStatusOptions = res.data.statusData;
this.warningPositionOptions = res.data.areaList;
});
},
computed: {
dialogVisible: {
get() {
return this.visible;
},
set(val) {
this.$emit("changeVisible", val);
},
},
},
watch: {
dialogVisible(val) {
if (val) {
this.searchRecords();
} else {
this.tableData = [];
this.searchForm = {
dateRange: ["", ""],
status: "",
area_id: "",
};
}
},
},
};
</script>
<style lang="less" scoped>
.previewImg {
width: 50px;
height: 50px;
}
</style>
\ No newline at end of file
......@@ -12,6 +12,13 @@
>
<i class="iconfont icon-yangchenzaoyin"></i>
{{ monitor.device_name }} / {{ monitor.device_no }}
<span
:style="{
color: monitor.is_online_text == '在线' ? '#3eec6f' : '',
float: 'right',
}"
>{{ monitor.is_online_text }}</span
>
</div>
</div>
</ShadowContainer>
......@@ -200,6 +207,7 @@
>
PM10
</div>
<div
:class="[
'filter',
......@@ -339,6 +347,8 @@ export default {
warning_line: 0,
noiseWarningData: [],
noiseVisible: false,
activeTab: 0,
timer: null,
};
},
computed: {},
......@@ -576,6 +586,21 @@ export default {
this.$nextTick(() => {
this.renderAQIChart();
});
let dataArray = [
"pm25_data",
"pm10_data",
"temperature_data",
"humidity_data",
"noise_data",
"wind_speed_data",
];
this.timer = setInterval(() => {
this.activeTab++;
if (this.activeTab == dataArray.length) {
this.activeTab = 0;
}
this.changeType(dataArray[this.activeTab]);
}, 4000);
});
getNoiseDeviceList({ top_cat: 9 }).then((res) => {
this.noiseMonitors = res.data;
......@@ -585,8 +610,10 @@ export default {
});
},
changeMonitor(monitor, index) {
clearInterval(this.timer);
this.loading = true;
this.activeIndex = index;
this.activeTab = 0;
getCurrentMonitorStatis({ device_id: monitor.id }).then((res) => {
this.loading = false;
this.currentMonitorStatis = res.data;
......@@ -678,6 +705,9 @@ export default {
mounted() {
this.getNoiseData();
},
destroyed() {
clearInterval(this.timer);
},
};
</script>
<style lang="less" scoped>
......
This diff is collapsed.
......@@ -14,7 +14,7 @@
<i class="iconfont icon-xieliaopingtai"></i>
{{ platform.device_no }}
<span
:style="{ color: platform.is_online == 1 ? '#66cab9' : '' }"
:style="{ color: platform.is_online == 1 ? '#3eec6f' : '' }"
>{{ platform.is_online_text }}</span
>
</div>
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment