|
|
|
|
<template>
|
|
|
|
|
<div class="app-container">
|
|
|
|
|
<el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px">
|
|
|
|
|
<el-form-item label="设备名" prop="name">
|
|
|
|
|
<el-input v-model="queryParams.name" placeholder="请输入设备名" clearable @keyup.enter.native="handleQuery" />
|
|
|
|
|
</el-form-item>
|
|
|
|
|
<el-form-item label="序列号" prop="devsn">
|
|
|
|
|
<el-input v-model="queryParams.devsn" placeholder="请输入设备序列号" clearable @keyup.enter.native="handleQuery" />
|
|
|
|
|
</el-form-item>
|
|
|
|
|
<el-form-item>
|
|
|
|
|
<el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
|
|
|
|
|
<el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
|
|
|
|
|
</el-form-item>
|
|
|
|
|
</el-form>
|
|
|
|
|
|
|
|
|
|
<el-row :gutter="10" class="mb8">
|
|
|
|
|
<el-col :span="1.5">
|
|
|
|
|
<el-button type="primary" plain icon="el-icon-plus" size="mini" @click="handleAdd"
|
|
|
|
|
v-hasPermi="['web:camera:add']">新增</el-button>
|
|
|
|
|
</el-col>
|
|
|
|
|
<el-col :span="1.5">
|
|
|
|
|
<el-button type="danger" plain icon="el-icon-delete" size="mini" :disabled="multiple" @click="handleDelete"
|
|
|
|
|
v-hasPermi="['web:camera:remove']">删除</el-button>
|
|
|
|
|
</el-col>
|
|
|
|
|
<el-col :span="1.5">
|
|
|
|
|
<el-button type="warning" plain icon="el-icon-download" size="mini" @click="handleExport"
|
|
|
|
|
v-hasPermi="['web:camera:export']">导出</el-button>
|
|
|
|
|
</el-col>
|
|
|
|
|
<el-col :span="1.5">
|
|
|
|
|
<el-button type="success" plain icon="el-icon-refresh" size="mini" @click="register"
|
|
|
|
|
v-hasPermi="['web:camera:reboot']">重启服务</el-button>
|
|
|
|
|
</el-col>
|
|
|
|
|
<el-col :span="1.5">
|
|
|
|
|
<el-button type="success" plain icon="el-icon-refresh" size="mini" @click="restartM3u8"
|
|
|
|
|
v-hasPermi="['web:camera:m3u8']">重启视频服务</el-button>
|
|
|
|
|
</el-col>
|
|
|
|
|
<right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
|
|
|
|
|
</el-row>
|
|
|
|
|
|
|
|
|
|
<el-table v-loading="loading" :data="cameraList" @selection-change="handleSelectionChange">
|
|
|
|
|
<el-table-column type="selection" width="55" align="center" />
|
|
|
|
|
<el-table-column min-width="60" align="center" label="序号">
|
|
|
|
|
<template slot-scope="scope">
|
|
|
|
|
<span>{{ (queryParams.page - 1) * queryParams.limit + scope.$index + 1 }}</span>
|
|
|
|
|
</template>
|
|
|
|
|
</el-table-column>
|
|
|
|
|
<el-table-column label="设备名" align="center" prop="name" />
|
|
|
|
|
<el-table-column label="设备ip" align="center" prop="ip" />
|
|
|
|
|
<el-table-column label="设备序列号" align="center" prop="devsn" />
|
|
|
|
|
<el-table-column label="首次注册时间" align="center" prop="firstTime" width="220"/>
|
|
|
|
|
<el-table-column label="心跳时间" align="center" prop="updateTime" width="220"/>
|
|
|
|
|
<el-table-column label="4G强度" align="center" prop="rssiLevel" />
|
|
|
|
|
<el-table-column label="接入方式" align="center" prop="accessType">
|
|
|
|
|
<template slot-scope="scope">
|
|
|
|
|
<dict-tag :options="dict.type.camera_access_type" :value="scope.row.accessType"/>
|
|
|
|
|
</template>
|
|
|
|
|
</el-table-column>
|
|
|
|
|
<el-table-column label="摄像机品牌" align="center" prop="brand">
|
|
|
|
|
<template slot-scope="scope">
|
|
|
|
|
<div v-for="item in brandList">
|
|
|
|
|
{{(scope.row.brand == item.id)?item.name:''}}
|
|
|
|
|
</div>
|
|
|
|
|
</template>
|
|
|
|
|
</el-table-column>
|
|
|
|
|
<el-table-column label="状态" align="center" prop="status">
|
|
|
|
|
<template slot-scope="scope">
|
|
|
|
|
<span v-if="scope.row.status == 1">
|
|
|
|
|
<el-tag type="success">在线</el-tag>
|
|
|
|
|
</span>
|
|
|
|
|
<span v-if="scope.row.status == 0">
|
|
|
|
|
<el-tag type="info">离线</el-tag>
|
|
|
|
|
</span>
|
|
|
|
|
</template>
|
|
|
|
|
</el-table-column>
|
|
|
|
|
<el-table-column label="操作" align="center" class-name="small-padding fixed-width">
|
|
|
|
|
<template slot-scope="scope">
|
|
|
|
|
<!-- <el-button
|
|
|
|
|
size="mini"
|
|
|
|
|
type="text"
|
|
|
|
|
icon="el-icon-setting"
|
|
|
|
|
@click="openFtpCfg(scope.row)"
|
|
|
|
|
v-hasPermi="['web:camera:remove']"
|
|
|
|
|
>FTP配置</el-button>
|
|
|
|
|
<el-button
|
|
|
|
|
size="mini"
|
|
|
|
|
type="text"
|
|
|
|
|
icon="el-icon-search"
|
|
|
|
|
@click="showVideo(scope.row)"
|
|
|
|
|
v-hasPermi="['web:camera:remove']"
|
|
|
|
|
>查看视频</el-button> -->
|
|
|
|
|
<el-button size="mini" type="text" icon="el-icon-edit" @click="handleUpdate(scope.row)"
|
|
|
|
|
v-hasPermi="['web:camera:edit']">修改</el-button>
|
|
|
|
|
<!-- <el-button
|
|
|
|
|
size="mini"
|
|
|
|
|
type="text"
|
|
|
|
|
icon="el-icon-refresh"
|
|
|
|
|
@click="reboot(scope.row)"
|
|
|
|
|
v-hasPermi="['web:camera:remove']"
|
|
|
|
|
v-loading.fullscreen.lock="fullscreenLoading"
|
|
|
|
|
>重启</el-button> -->
|
|
|
|
|
<el-button size="mini" type="text" icon="el-icon-delete" @click="handleDelete(scope.row)"
|
|
|
|
|
v-hasPermi="['web:camera:remove']">删除</el-button>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<el-button size="mini" type="text" icon="el-icon-view" @click="playVideo(scope.row)"
|
|
|
|
|
v-hasPermi="['web:camera:net']">播放视频</el-button>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<el-button size="mini" type="text" icon="el-icon-setting" @click="setConfig(scope.row)"
|
|
|
|
|
v-hasPermi="['web:camera:config']">参数</el-button>
|
|
|
|
|
|
|
|
|
|
<el-dropdown size="mini" @command="(command) => handleCommand(command, scope.row)"
|
|
|
|
|
v-hasPermi="['web:camera:4g']">
|
|
|
|
|
<span class="el-dropdown-link">
|
|
|
|
|
<i class="el-icon-d-arrow-right el-icon--right"></i>更多
|
|
|
|
|
</span>
|
|
|
|
|
<el-dropdown-menu slot="dropdown">
|
|
|
|
|
<el-dropdown-item command="refreshRssi" icon="el-icon-s-operation">
|
|
|
|
|
刷新4G信号</el-dropdown-item>
|
|
|
|
|
<el-dropdown-item command="openFtpCfg" icon="el-icon-setting">FTP配置
|
|
|
|
|
</el-dropdown-item>
|
|
|
|
|
<el-dropdown-item command="showVideo" icon="el-icon-view">查看视频
|
|
|
|
|
</el-dropdown-item>
|
|
|
|
|
<el-dropdown-item command="showLog" icon="el-icon-view">查看日志
|
|
|
|
|
</el-dropdown-item>
|
|
|
|
|
<el-dropdown-item command="showDate" icon="el-icon-view">补光时间
|
|
|
|
|
</el-dropdown-item>
|
|
|
|
|
<el-dropdown-item command="reboot" icon="el-icon-refresh">重启
|
|
|
|
|
</el-dropdown-item>
|
|
|
|
|
<el-dropdown-item command="autocfg" icon="el-icon-refresh">自动重启配置
|
|
|
|
|
</el-dropdown-item>
|
|
|
|
|
<el-dropdown-item command="setTime" icon="el-icon-refresh">时间校准
|
|
|
|
|
</el-dropdown-item>
|
|
|
|
|
</el-dropdown-menu>
|
|
|
|
|
</el-dropdown>
|
|
|
|
|
</template>
|
|
|
|
|
</el-table-column>
|
|
|
|
|
</el-table>
|
|
|
|
|
|
|
|
|
|
<pagination v-show="total > 0" :total="total" :page.sync="queryParams.page" :limit.sync="queryParams.limit"
|
|
|
|
|
@pagination="getList" />
|
|
|
|
|
|
|
|
|
|
<!-- 添加或修改摄像机对话框 -->
|
|
|
|
|
<el-dialog :title="title" :visible.sync="open" width="600px" append-to-body>
|
|
|
|
|
<el-form ref="form" :model="form" :rules="rules" label-width="100px">
|
|
|
|
|
<el-form-item label="设备名" prop="name">
|
|
|
|
|
<el-input v-model="form.name" placeholder="请输入设备名" />
|
|
|
|
|
</el-form-item>
|
|
|
|
|
<el-form-item label="设备ip" prop="ip">
|
|
|
|
|
<el-input v-model="form.ip" placeholder="请输入设备ip" />
|
|
|
|
|
</el-form-item>
|
|
|
|
|
<el-form-item label="设备端口" prop="port">
|
|
|
|
|
<el-input v-model="form.port" placeholder="请输入设备端口" />
|
|
|
|
|
</el-form-item>
|
|
|
|
|
<el-form-item label="设备登录账号" prop="username">
|
|
|
|
|
<el-input v-model="form.username" placeholder="请输入设备登录账号" />
|
|
|
|
|
</el-form-item>
|
|
|
|
|
<el-form-item label="设备登录密码" prop="password">
|
|
|
|
|
<el-input v-model="form.password" placeholder="请输入设备登录密码" />
|
|
|
|
|
</el-form-item>
|
|
|
|
|
<el-form-item label="设备序列号" prop="devsn">
|
|
|
|
|
<el-input v-model="form.devsn" placeholder="请输入设备序列号" />
|
|
|
|
|
</el-form-item>
|
|
|
|
|
<el-form-item label="接入方式" prop="accessType">
|
|
|
|
|
<el-select v-model="form.accessType" placeholder="请选择接入方式">
|
|
|
|
|
<el-option
|
|
|
|
|
v-for="dict in dict.type.camera_access_type"
|
|
|
|
|
:key="dict.value"
|
|
|
|
|
:label="dict.label"
|
|
|
|
|
:value="parseInt(dict.value)"
|
|
|
|
|
></el-option>
|
|
|
|
|
</el-select>
|
|
|
|
|
</el-form-item>
|
|
|
|
|
<el-form-item label="摄像机品牌" prop="brand">
|
|
|
|
|
<el-select v-model="form.brand" placeholder="请选择摄像机品牌">
|
|
|
|
|
<el-option
|
|
|
|
|
v-for="dict in brandList"
|
|
|
|
|
:key="dict.id"
|
|
|
|
|
:label="dict.name"
|
|
|
|
|
:value="parseInt(dict.id)"
|
|
|
|
|
></el-option>
|
|
|
|
|
</el-select>
|
|
|
|
|
</el-form-item>
|
|
|
|
|
</el-form>
|
|
|
|
|
<div slot="footer" class="dialog-footer">
|
|
|
|
|
<el-button type="primary" @click="submitForm">确 定</el-button>
|
|
|
|
|
<el-button @click="cancel">取 消</el-button>
|
|
|
|
|
</div>
|
|
|
|
|
</el-dialog>
|
|
|
|
|
|
|
|
|
|
<!-- ftp配置对话框 -->
|
|
|
|
|
<el-dialog title="FTP配置" :visible.sync="ftp.open">
|
|
|
|
|
<div class="container">
|
|
|
|
|
<!-- 表单 -->
|
|
|
|
|
<div class="ftpform">
|
|
|
|
|
<el-form :model="ftp.form" :label-width="ftp.width">
|
|
|
|
|
<el-form-item label="启用">
|
|
|
|
|
<el-switch v-model="ftp.run"></el-switch>
|
|
|
|
|
</el-form-item>
|
|
|
|
|
<el-form-item label="服务器地址">
|
|
|
|
|
<el-input v-model="ftp.form.address"></el-input>
|
|
|
|
|
</el-form-item>
|
|
|
|
|
<el-form-item label="服务器端口">
|
|
|
|
|
<el-input v-model="ftp.form.port"></el-input>
|
|
|
|
|
</el-form-item>
|
|
|
|
|
<el-form-item label="用户名">
|
|
|
|
|
<el-input v-model="ftp.form.username"></el-input>
|
|
|
|
|
</el-form-item>
|
|
|
|
|
<el-form-item label="密码">
|
|
|
|
|
<el-input v-model="ftp.form.password"></el-input>
|
|
|
|
|
</el-form-item>
|
|
|
|
|
<el-form-item label="FTP图片路径">
|
|
|
|
|
<el-input v-model="ftp.form.pathRule" type="textarea" :rows="3"></el-input>
|
|
|
|
|
</el-form-item>
|
|
|
|
|
</el-form>
|
|
|
|
|
</div>
|
|
|
|
|
<!-- 参考表格 -->
|
|
|
|
|
<div class="table">
|
|
|
|
|
<div class="head">路径配置参考</div>
|
|
|
|
|
<div class="content">
|
|
|
|
|
<div class="tips">
|
|
|
|
|
<span>%Y: 年</span>
|
|
|
|
|
<span>%M: 月</span>
|
|
|
|
|
<span>%D: 日</span>
|
|
|
|
|
<span>%h: 时</span>
|
|
|
|
|
<span>%m: 分</span>
|
|
|
|
|
<span>%s: 秒</span>
|
|
|
|
|
<span>%u: 毫秒</span>
|
|
|
|
|
<span>%c: 通道</span>
|
|
|
|
|
<span>%n: 设备序列号</span>
|
|
|
|
|
<span>%i: 设备ip</span>
|
|
|
|
|
<span>%e: 事件名称</span>
|
|
|
|
|
<span>%a: MAC地址</span>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="notice">
|
|
|
|
|
<div>注意: </div>
|
|
|
|
|
<div>
|
|
|
|
|
文件夹名以/隔开; 多个%%自动转为一个%;
|
|
|
|
|
不可出现路径代码提示中没有的"%"+字符组合, 否则将保存失败!
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
<div slot="footer" class="dialog-footer">
|
|
|
|
|
<el-button @click="ftp.open = false">取 消</el-button>
|
|
|
|
|
<el-button type="primary" @click="ftpConfirm">确 定</el-button>
|
|
|
|
|
</div>
|
|
|
|
|
</el-dialog>
|
|
|
|
|
<!-- 自动重启配置对话框 -->
|
|
|
|
|
<el-dialog title="自动重启配置" :visible.sync="restartcfg.open">
|
|
|
|
|
<div class="container">
|
|
|
|
|
<!-- 表单 -->
|
|
|
|
|
<div class="restartcfgform">
|
|
|
|
|
<el-form>
|
|
|
|
|
<el-form-item label="启用">
|
|
|
|
|
<el-switch v-model="restartcfg.run"></el-switch>
|
|
|
|
|
</el-form-item>
|
|
|
|
|
<el-select v-model="restartcfg.form.uWeekDay" placeholder="选择星期">
|
|
|
|
|
<el-option v-for="item in options" :key="item.value" :label="item.label" :value="parseInt(item.value)">
|
|
|
|
|
</el-option>
|
|
|
|
|
</el-select>
|
|
|
|
|
<el-time-select v-model="restartcfg.form.uHour" :picker-options="{
|
|
|
|
|
start: '00:00',
|
|
|
|
|
step: '01:00',
|
|
|
|
|
end: '23:00'
|
|
|
|
|
}" placeholder="选择时间">
|
|
|
|
|
</el-time-select>
|
|
|
|
|
</el-form>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
<div slot="footer" class="dialog-footer">
|
|
|
|
|
<el-button @click="restartcfg.open = false">取 消</el-button>
|
|
|
|
|
<el-button type="primary" @click="restartcfgConfirm">确 定</el-button>
|
|
|
|
|
</div>
|
|
|
|
|
</el-dialog>
|
|
|
|
|
<!-- 日志详情对话框 -->
|
|
|
|
|
<el-dialog title="日志查询" :visible.sync="logform.open">
|
|
|
|
|
<div >
|
|
|
|
|
<!-- 表单 -->
|
|
|
|
|
<el-form :model="logform.queryForm" ref="queryForm" size="small" :inline="true" label-width="200px">
|
|
|
|
|
|
|
|
|
|
<el-date-picker v-model="timeStage" type="datetimerange" range-separator="至" start-placeholder="开始日期"
|
|
|
|
|
end-placeholder="结束日期" @change="chooseTimeRange" :picker-options="setDateRange">
|
|
|
|
|
</el-date-picker>
|
|
|
|
|
<el-form-item>
|
|
|
|
|
<el-button type="primary" icon="el-icon-search" size="mini" @click="handleAutoQuery">查询</el-button>
|
|
|
|
|
</el-form-item>
|
|
|
|
|
<el-table :data="logInfoList" stripe style="width: 100%">
|
|
|
|
|
|
|
|
|
|
<el-table-column label="记录时间" align="center" prop="clogTime" />
|
|
|
|
|
<el-table-column label="用户名" align="center" prop="coperUserName" />
|
|
|
|
|
<el-table-column label="主类型" align="center" prop="cmainType" />
|
|
|
|
|
<el-table-column label="次类型" align="center" prop="csubType" />
|
|
|
|
|
<el-table-column label="远程IP" align="center" prop="cremoteIP" />
|
|
|
|
|
|
|
|
|
|
</el-table>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
</el-form>
|
|
|
|
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
</el-dialog>
|
|
|
|
|
<el-dialog title="查看时间" :visible.sync="updateDate.open">
|
|
|
|
|
<div>
|
|
|
|
|
<el-form :model="updateDate.queryForm" label-width="80px">
|
|
|
|
|
<el-form-item label="模式">
|
|
|
|
|
<el-select v-model="updateDate.queryForm.emMode" placeholder="请选择模式" style="width: 200px;">
|
|
|
|
|
<el-option
|
|
|
|
|
v-for="item in modelList"
|
|
|
|
|
:key="item.value"
|
|
|
|
|
:label="item.label"
|
|
|
|
|
:value="item.value">
|
|
|
|
|
</el-option>
|
|
|
|
|
</el-select>
|
|
|
|
|
</el-form-item>
|
|
|
|
|
<el-form-item label="预设亮度">
|
|
|
|
|
<el-input-number v-model="updateDate.queryForm.nPreValue" controls-position="right" :min="1" :max="100"></el-input-number>
|
|
|
|
|
</el-form-item>
|
|
|
|
|
<el-form-item label="亮度">
|
|
|
|
|
<el-input-number v-model="updateDate.queryForm.nBrightness" controls-position="right" :min="1" :max="100"></el-input-number>
|
|
|
|
|
</el-form-item>
|
|
|
|
|
<el-form-item v-if="updateDate.queryForm.emMode=='3'" label="时间段1">
|
|
|
|
|
<el-time-picker
|
|
|
|
|
size="small"
|
|
|
|
|
align="center"
|
|
|
|
|
format="HH:mm:ss"
|
|
|
|
|
style="width: 150px;margin-right: 5px;"
|
|
|
|
|
v-model="updateDate.queryForm.startTime1"
|
|
|
|
|
:picker-options="{
|
|
|
|
|
selectableRange: '00:00:00 - 23:59:59'
|
|
|
|
|
}"
|
|
|
|
|
placeholder="任意时间点">
|
|
|
|
|
</el-time-picker>
|
|
|
|
|
<el-time-picker
|
|
|
|
|
size="small"
|
|
|
|
|
align="center"
|
|
|
|
|
style="width: 150px"
|
|
|
|
|
v-model="updateDate.queryForm.endTime1"
|
|
|
|
|
:picker-options="{
|
|
|
|
|
selectableRange: '00:00:00 - 23:59:59'
|
|
|
|
|
}"
|
|
|
|
|
placeholder="任意时间点">
|
|
|
|
|
</el-time-picker>
|
|
|
|
|
</el-form-item>
|
|
|
|
|
<el-form-item v-if="updateDate.queryForm.emMode=='3'" label="时间段2">
|
|
|
|
|
<el-time-picker
|
|
|
|
|
size="small"
|
|
|
|
|
align="center"
|
|
|
|
|
style="width: 150px;margin-right: 5px;"
|
|
|
|
|
v-model="updateDate.queryForm.startTime2"
|
|
|
|
|
:picker-options="{
|
|
|
|
|
selectableRange: '00:00:00 - 23:59:59'
|
|
|
|
|
}"
|
|
|
|
|
placeholder="任意时间点">
|
|
|
|
|
</el-time-picker>
|
|
|
|
|
<el-time-picker
|
|
|
|
|
size="small"
|
|
|
|
|
align="center"
|
|
|
|
|
style="width: 150px"
|
|
|
|
|
v-model="updateDate.queryForm.endTime2"
|
|
|
|
|
:picker-options="{
|
|
|
|
|
selectableRange: '00:00:00 - 23:59:59'
|
|
|
|
|
}"
|
|
|
|
|
placeholder="任意时间点">
|
|
|
|
|
</el-time-picker>
|
|
|
|
|
</el-form-item>
|
|
|
|
|
</el-form>
|
|
|
|
|
<div slot="footer" class="dialog-footer">
|
|
|
|
|
<el-button @click="updateDate.open = false">取 消</el-button>
|
|
|
|
|
<el-button type="primary" @click="setLightCfg()">确 定</el-button>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</el-dialog>
|
|
|
|
|
|
|
|
|
|
<!-- <el-dialog title="播放视频" :visible.sync="videoData.open">
|
|
|
|
|
<div>
|
|
|
|
|
<video
|
|
|
|
|
id="my-video"
|
|
|
|
|
class="video-js vjs-default-skin"
|
|
|
|
|
controls
|
|
|
|
|
preload="auto"
|
|
|
|
|
width="500px"
|
|
|
|
|
>
|
|
|
|
|
<source src="http://192.168.1.219/hls/192_168_1_40/live.m3u8" type="application/x-mpegURL" />
|
|
|
|
|
</video>
|
|
|
|
|
</div>
|
|
|
|
|
</el-dialog>-->
|
|
|
|
|
|
|
|
|
|
<el-dialog
|
|
|
|
|
title="播放视频"
|
|
|
|
|
:visible.sync="videoData.open"
|
|
|
|
|
:close-on-click-modal="false"
|
|
|
|
|
:append-to-body="true"
|
|
|
|
|
@close="closeVideo"
|
|
|
|
|
align="center"
|
|
|
|
|
>
|
|
|
|
|
<div v-html="videoHtml">
|
|
|
|
|
</div>
|
|
|
|
|
</el-dialog>
|
|
|
|
|
|
|
|
|
|
<el-dialog title="水尺参数" :visible.sync="configopen" width="600px" append-to-body>
|
|
|
|
|
<el-form ref="cform" :model="configform" label-width="100px">
|
|
|
|
|
<el-form-item label="总长度" prop="tLen">
|
|
|
|
|
<el-input type="number" v-model="configform.tlen" placeholder="某一时刻水位+水位上水尺长度（单位米）" />
|
|
|
|
|
</el-form-item>
|
|
|
|
|
<el-form-item label="出水长度" prop="cLen">
|
|
|
|
|
<el-input type="number" v-model="configform.clen" placeholder="某一时刻水面上水尺长度（单位米）" />
|
|
|
|
|
</el-form-item>
|
|
|
|
|
<el-form-item label="出水长度" prop="cP">
|
|
|
|
|
<el-input type="number" v-model="configform.cp" placeholder="水面上的水尺长度对应像素" />
|
|
|
|
|
</el-form-item>
|
|
|
|
|
</el-form>
|
|
|
|
|
<div slot="footer" class="dialog-footer">
|
|
|
|
|
<el-button type="primary" @click="configSubmit">确 定</el-button>
|
|
|
|
|
</div>
|
|
|
|
|
</el-dialog>
|
|
|
|
|
|
|
|
|
|
</div>
|
|
|
|
|
</template>
|
|
|
|
|
|
|
|
|
|
<script>
|
|
|
|
|
import { formatDate } from "../../../utils/common";
|
|
|
|
|
import { Message } from 'element-ui'
|
|
|
|
|
import videojs from "video.js";
|
|
|
|
|
import "videojs-contrib-hls";
|
|
|
|
|
|
|
|
|
|
export default {
|
|
|
|
|
name: "Camera",
|
|
|
|
|
dicts: ['camera_access_type'],
|
|
|
|
|
data() {
|
|
|
|
|
return {
|
|
|
|
|
videoHtml: '',
|
|
|
|
|
// 遮罩层
|
|
|
|
|
loading: true,
|
|
|
|
|
|
|
|
|
|
fullscreenLoading: false,
|
|
|
|
|
// 选中数组
|
|
|
|
|
ids: [],
|
|
|
|
|
// 非单个禁用
|
|
|
|
|
single: true,
|
|
|
|
|
// 非多个禁用
|
|
|
|
|
multiple: true,
|
|
|
|
|
// 显示搜索条件
|
|
|
|
|
showSearch: true,
|
|
|
|
|
// 总条数
|
|
|
|
|
total: 0,
|
|
|
|
|
// 摄像机表格数据
|
|
|
|
|
cameraList: [],
|
|
|
|
|
// 弹出层标题
|
|
|
|
|
title: "",
|
|
|
|
|
// 是否显示弹出层
|
|
|
|
|
open: false,
|
|
|
|
|
configopen: false,
|
|
|
|
|
videoData:{
|
|
|
|
|
open: false,
|
|
|
|
|
},
|
|
|
|
|
// 查询参数
|
|
|
|
|
queryParams: {
|
|
|
|
|
page: 1,
|
|
|
|
|
limit: 10,
|
|
|
|
|
name: null,
|
|
|
|
|
ip: null,
|
|
|
|
|
port: null,
|
|
|
|
|
username: null,
|
|
|
|
|
password: null,
|
|
|
|
|
devsn: null,
|
|
|
|
|
status: null
|
|
|
|
|
},
|
|
|
|
|
// 表单参数
|
|
|
|
|
form: {},
|
|
|
|
|
configform: {},
|
|
|
|
|
// 表单校验
|
|
|
|
|
rules: {
|
|
|
|
|
},
|
|
|
|
|
// ftp配置
|
|
|
|
|
ftp: {
|
|
|
|
|
open: false,
|
|
|
|
|
form: {
|
|
|
|
|
address: '',
|
|
|
|
|
port: '',
|
|
|
|
|
username: '',
|
|
|
|
|
password: '',
|
|
|
|
|
pathRule: '',
|
|
|
|
|
isEnable: '',
|
|
|
|
|
devsn: '',
|
|
|
|
|
accessType: null,
|
|
|
|
|
brand: null
|
|
|
|
|
},
|
|
|
|
|
run: false,
|
|
|
|
|
width: '100px'
|
|
|
|
|
},
|
|
|
|
|
modelList:[
|
|
|
|
|
{
|
|
|
|
|
value: '0', label: '强制关闭'
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
value: '1', label: '强制开启'
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
value: '2', label: '自动'
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
value: '3', label: '自动时间'
|
|
|
|
|
}
|
|
|
|
|
],
|
|
|
|
|
//自动重启设置
|
|
|
|
|
restartcfg: {
|
|
|
|
|
open: false,
|
|
|
|
|
form: {
|
|
|
|
|
id: '',
|
|
|
|
|
bEnable: '',
|
|
|
|
|
uHour: '',
|
|
|
|
|
uWeekDay: '',
|
|
|
|
|
},
|
|
|
|
|
run: false,
|
|
|
|
|
},
|
|
|
|
|
//日志
|
|
|
|
|
logform: {
|
|
|
|
|
open: false,
|
|
|
|
|
queryForm: {
|
|
|
|
|
id: '',
|
|
|
|
|
startTime: '',
|
|
|
|
|
endTime: ''
|
|
|
|
|
},
|
|
|
|
|
|
|
|
|
|
run: false,
|
|
|
|
|
},
|
|
|
|
|
updateDate:{
|
|
|
|
|
open: false,
|
|
|
|
|
queryForm: {
|
|
|
|
|
id: '',
|
|
|
|
|
emMode: '',
|
|
|
|
|
nPreValue: '1',
|
|
|
|
|
nBrightness: '1',
|
|
|
|
|
startTime1: new Date(2022, 9, 10, 18, 40),
|
|
|
|
|
endTime1: new Date(2022, 9, 10, 18, 40),
|
|
|
|
|
startTime2: new Date(2022, 9, 10, 18, 40),
|
|
|
|
|
endTime2: new Date(2022, 9, 10, 18, 40),
|
|
|
|
|
},
|
|
|
|
|
},
|
|
|
|
|
logInfoList: [],
|
|
|
|
|
options: [{
|
|
|
|
|
value: '0',
|
|
|
|
|
label: '星期日'
|
|
|
|
|
}, {
|
|
|
|
|
value: '1',
|
|
|
|
|
label: '星期一'
|
|
|
|
|
}, {
|
|
|
|
|
value: '2',
|
|
|
|
|
label: '星期二'
|
|
|
|
|
}, {
|
|
|
|
|
value: '3',
|
|
|
|
|
label: '星期三'
|
|
|
|
|
}, {
|
|
|
|
|
value: '4',
|
|
|
|
|
label: '星期四'
|
|
|
|
|
}, {
|
|
|
|
|
value: '5',
|
|
|
|
|
label: '星期五'
|
|
|
|
|
}, {
|
|
|
|
|
value: '6',
|
|
|
|
|
label: '星期六'
|
|
|
|
|
}],
|
|
|
|
|
// 摄像机品牌列表
|
|
|
|
|
brandList: [],
|
|
|
|
|
timeStage: [],
|
|
|
|
|
num: Date.now(),
|
|
|
|
|
// 设置可选择的时间段，*** 必须在 data 返回数据 ***
|
|
|
|
|
setDateRange: {
|
|
|
|
|
|
|
|
|
|
// 设置不能选择的日期
|
|
|
|
|
onPick: ({
|
|
|
|
|
maxDate,
|
|
|
|
|
minDate
|
|
|
|
|
}) => {
|
|
|
|
|
if (minDate) { //如果默认有最小日期
|
|
|
|
|
this.choiceDate0 = minDate.getTime();
|
|
|
|
|
} else { //如果最小日期被清空，则最小日期为当天
|
|
|
|
|
this.choiceDate0 = new Date();
|
|
|
|
|
}
|
|
|
|
|
if (maxDate) {
|
|
|
|
|
this.choiceDate0 = '';
|
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
disabledDate: (time) => {
|
|
|
|
|
let choiceDateTime = new Date(this.choiceDate0).getTime(); //选中的第一个日期
|
|
|
|
|
if (this.choiceDate0) {
|
|
|
|
|
//间隔15天，则加减14天---“这主要看需求”
|
|
|
|
|
//14天的时间戳：14*24*3600*1000=1209600000
|
|
|
|
|
return (time.getTime() > (choiceDateTime + 86400000)) || (time.getTime() < (choiceDateTime - 86400000));
|
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
|
|
|
|
|
},
|
|
|
|
|
};
|
|
|
|
|
},
|
|
|
|
|
created() {
|
|
|
|
|
this.getList();
|
|
|
|
|
this.geBrandList();
|
|
|
|
|
},
|
|
|
|
|
mounted() {
|
|
|
|
|
this.$nextTick(() => {
|
|
|
|
|
this.getVideo()
|
|
|
|
|
})
|
|
|
|
|
},
|
|
|
|
|
methods: {
|
|
|
|
|
/** 查询brand列表 */
|
|
|
|
|
async geBrandList() {
|
|
|
|
|
let res = await this.$axiosGet('/web/brand/brands');
|
|
|
|
|
if(res.code === 0){
|
|
|
|
|
this.brandList = res.data;
|
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
|
|
|
|
|
/** 查询摄像机列表 */
|
|
|
|
|
async getList() {
|
|
|
|
|
this.loading = true;
|
|
|
|
|
let res = await this.$axiosGet('/web/camera/list', this.queryParams);
|
|
|
|
|
if (res.code === 0) {
|
|
|
|
|
this.cameraList = res.data;
|
|
|
|
|
this.total = res.count;
|
|
|
|
|
}
|
|
|
|
|
this.loading = false;
|
|
|
|
|
},
|
|
|
|
|
// 取消按钮
|
|
|
|
|
cancel() {
|
|
|
|
|
this.open = false;
|
|
|
|
|
this.reset();
|
|
|
|
|
},
|
|
|
|
|
// 表单重置
|
|
|
|
|
reset() {
|
|
|
|
|
this.form = {
|
|
|
|
|
id: null,
|
|
|
|
|
name: null,
|
|
|
|
|
ip: null,
|
|
|
|
|
port: null,
|
|
|
|
|
username: null,
|
|
|
|
|
password: null,
|
|
|
|
|
devsn: null,
|
|
|
|
|
status: "0",
|
|
|
|
|
accessType: null,
|
|
|
|
|
brand: null
|
|
|
|
|
};
|
|
|
|
|
this.resetForm("form");
|
|
|
|
|
},
|
|
|
|
|
configreset() {
|
|
|
|
|
this.configform = {
|
|
|
|
|
id: null,
|
|
|
|
|
lstart: null,
|
|
|
|
|
tlen: null,
|
|
|
|
|
clen: null,
|
|
|
|
|
cp: null
|
|
|
|
|
};
|
|
|
|
|
this.resetForm("configform");
|
|
|
|
|
},
|
|
|
|
|
// 表单重置
|
|
|
|
|
ftpCfgReset() {
|
|
|
|
|
this.ftp.form = {
|
|
|
|
|
address: '',
|
|
|
|
|
port: '',
|
|
|
|
|
username: '',
|
|
|
|
|
password: '',
|
|
|
|
|
pathRule: '',
|
|
|
|
|
isEnable: '',
|
|
|
|
|
devsn: ''
|
|
|
|
|
};
|
|
|
|
|
this.resetForm("form");
|
|
|
|
|
},
|
|
|
|
|
updateDateReset(){
|
|
|
|
|
this.updateDate.queryForm= {
|
|
|
|
|
id: '',
|
|
|
|
|
emMode: '2',
|
|
|
|
|
nPreValue: '1',
|
|
|
|
|
nBrightness: '1',
|
|
|
|
|
startTime1: new Date(2022, 9, 10, 18, 40),
|
|
|
|
|
endTime1: new Date(2022, 9, 10, 18, 40),
|
|
|
|
|
startTime2: new Date(2022, 9, 10, 18, 40),
|
|
|
|
|
endTime2: new Date(2022, 9, 10, 18, 40),
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
},
|
|
|
|
|
/** 搜索按钮操作 */
|
|
|
|
|
handleQuery() {
|
|
|
|
|
this.queryParams.page = 1;
|
|
|
|
|
this.getList();
|
|
|
|
|
},
|
|
|
|
|
/** 重置按钮操作 */
|
|
|
|
|
resetQuery() {
|
|
|
|
|
this.resetForm("queryForm");
|
|
|
|
|
this.handleQuery();
|
|
|
|
|
},
|
|
|
|
|
// 多选框选中数据
|
|
|
|
|
handleSelectionChange(selection) {
|
|
|
|
|
this.ids = selection.map(item => item.id)
|
|
|
|
|
this.single = selection.length !== 1
|
|
|
|
|
this.multiple = !selection.length
|
|
|
|
|
},
|
|
|
|
|
/** 新增按钮操作 */
|
|
|
|
|
handleAdd() {
|
|
|
|
|
this.reset();
|
|
|
|
|
this.open = true;
|
|
|
|
|
this.title = "添加摄像机";
|
|
|
|
|
},
|
|
|
|
|
// 更多操作触发
|
|
|
|
|
handleCommand(command, row) {
|
|
|
|
|
switch (command) {
|
|
|
|
|
case "refreshRssi":
|
|
|
|
|
this.refreshRssi(row);
|
|
|
|
|
break;
|
|
|
|
|
case "openFtpCfg":
|
|
|
|
|
this.openFtpCfg(row);
|
|
|
|
|
break;
|
|
|
|
|
case "showVideo":
|
|
|
|
|
this.showVideo(row);
|
|
|
|
|
break;
|
|
|
|
|
case "showLog":
|
|
|
|
|
this.showLog(row);
|
|
|
|
|
break;
|
|
|
|
|
case "showDate":
|
|
|
|
|
this.showDate(row);
|
|
|
|
|
break;
|
|
|
|
|
case "reboot":
|
|
|
|
|
this.reboot(row);
|
|
|
|
|
break;
|
|
|
|
|
case "autocfg":
|
|
|
|
|
this.autocfg(row);
|
|
|
|
|
break;
|
|
|
|
|
case "setTime":
|
|
|
|
|
this.setTime(row);
|
|
|
|
|
break;
|
|
|
|
|
case "playVideo":
|
|
|
|
|
this.playVideo(row);
|
|
|
|
|
break;
|
|
|
|
|
default:
|
|
|
|
|
break;
|
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
/** 播放视频 */
|
|
|
|
|
playVideo(row){
|
|
|
|
|
this.videoData.open = true;
|
|
|
|
|
this.$nextTick(() => {
|
|
|
|
|
this.getVideo('http://192.168.1.219/hls/192_168_1_40/live.m3u8')
|
|
|
|
|
})
|
|
|
|
|
},
|
|
|
|
|
//初始化播放器
|
|
|
|
|
getVideo(url) {
|
|
|
|
|
this.videoHtml = '<video id="myVideo" width="810px" class="video-js vjs-default-skin" controls></video>';
|
|
|
|
|
this.$nextTick(() => {
|
|
|
|
|
let options = {
|
|
|
|
|
autoplay: true, // 设置自动播放
|
|
|
|
|
controls: true, // 显示播放的控件
|
|
|
|
|
sources: [ //如果需要切换视频源，src需要动态设置
|
|
|
|
|
{
|
|
|
|
|
src: url,
|
|
|
|
|
type: "application/x-mpegURL" // 告诉videojs,这是一个hls流
|
|
|
|
|
}
|
|
|
|
|
]
|
|
|
|
|
};
|
|
|
|
|
// videoJs的第一个参数表示的是，文档中video的id
|
|
|
|
|
setTimeout(() => {
|
|
|
|
|
this.player = videojs("myVideo", options);
|
|
|
|
|
},2000)
|
|
|
|
|
})
|
|
|
|
|
},
|
|
|
|
|
//通过移除DOM彻底关闭视频，避免关闭窗口后依然获取视频流占用资源
|
|
|
|
|
closeVideo() {
|
|
|
|
|
if (this.player) {
|
|
|
|
|
this.player.dispose(); // 该方法会重置videojs的内部状态并移除dom
|
|
|
|
|
this.videoHtml = '';
|
|
|
|
|
}
|
|
|
|
|
//注意关闭窗口时间，要在控件销毁之后，否则会有问题
|
|
|
|
|
this.videoData.open = false
|
|
|
|
|
},
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
/** 修改按钮操作 */
|
|
|
|
|
async handleUpdate(row) {
|
|
|
|
|
this.reset();
|
|
|
|
|
const id = row.id || this.ids
|
|
|
|
|
let res = await this.$axiosGet('/web/camera/info/' + id);
|
|
|
|
|
if (res.code === 0) {
|
|
|
|
|
this.form = res.data;
|
|
|
|
|
this.open = true;
|
|
|
|
|
this.title = "修改";
|
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
setConfig(row){
|
|
|
|
|
this.configreset();
|
|
|
|
|
this.configform = row.paramsObject;
|
|
|
|
|
this.configform.id = row.id;
|
|
|
|
|
this.configopen = true;
|
|
|
|
|
},
|
|
|
|
|
async refreshRssi(row) {
|
|
|
|
|
const id = row.id;
|
|
|
|
|
const status = row.status;
|
|
|
|
|
if (status != 1) {
|
|
|
|
|
this.$modal.msg("设备未在线");
|
|
|
|
|
return;
|
|
|
|
|
}
|
|
|
|
|
let res = await this.$axiosGet('/web/camera/refreshRssi/' + id);
|
|
|
|
|
if (res.code === 0) {
|
|
|
|
|
this.$modal.msgSuccess("执行成功");
|
|
|
|
|
this.getList();
|
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
async openFtpCfg(row) {
|
|
|
|
|
this.ftpCfgReset();
|
|
|
|
|
const id = row.id;
|
|
|
|
|
const status = row.status;
|
|
|
|
|
if (status != 1) {
|
|
|
|
|
this.$modal.msg("设备未在线");
|
|
|
|
|
return;
|
|
|
|
|
}
|
|
|
|
|
let res = await this.$axiosGet('/camera/ftp/getNetCfg', { 'cameraId': id });
|
|
|
|
|
if (res.code === 0) {
|
|
|
|
|
this.ftp.form = res.data;
|
|
|
|
|
this.ftp.run = this.ftp.form.isEnable == 1;
|
|
|
|
|
this.ftp.open = true;
|
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
// 发送ftp配置表单
|
|
|
|
|
async ftpConfirm() {
|
|
|
|
|
this.ftp.form.isEnable = this.ftp.run ? 1 : 0;
|
|
|
|
|
let res = await this.$axiosPost('/camera/ftp/editNetCfg', this.ftp.form);
|
|
|
|
|
if (res.code === 0) {
|
|
|
|
|
this.$modal.msgSuccess("修改成功");
|
|
|
|
|
this.ftp.open = false;
|
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
async autocfg(row) {
|
|
|
|
|
|
|
|
|
|
this.restartcfg.form.id = row.id;
|
|
|
|
|
|
|
|
|
|
const status = row.status;
|
|
|
|
|
if (status != 1) {
|
|
|
|
|
this.$modal.msg("设备未在线");
|
|
|
|
|
return;
|
|
|
|
|
}
|
|
|
|
|
let res = await this.$axiosGet('/web/camera/getautocfg/' + this.restartcfg.form.id);
|
|
|
|
|
|
|
|
|
|
if (res.code === 0) {
|
|
|
|
|
|
|
|
|
|
this.restartcfg.form = res.data;
|
|
|
|
|
if(this.restartcfg.form.uHour <10){
|
|
|
|
|
this.restartcfg.form.uHour="0"+this.restartcfg.form.uHour+":00"
|
|
|
|
|
}else{
|
|
|
|
|
this.restartcfg.form.uHour+=":00"
|
|
|
|
|
}
|
|
|
|
|
this.restartcfg.form.id = row.id;
|
|
|
|
|
this.restartcfg.run = this.restartcfg.form.bEnable == 1;
|
|
|
|
|
this.restartcfg.open = true;
|
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
async setTime(row) {
|
|
|
|
|
const status = row.status;
|
|
|
|
|
if (status != 1) {
|
|
|
|
|
this.$modal.msg("设备未在线");
|
|
|
|
|
return;
|
|
|
|
|
}
|
|
|
|
|
let res = await this.$axiosGet('/web/camera/setNowTime/' + row.id);
|
|
|
|
|
if (res.code === 0) {
|
|
|
|
|
this.$modal.msgSuccess("执行成功");
|
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
|
|
|
|
|
//发送自动重启配置表单
|
|
|
|
|
async restartcfgConfirm() {
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
this.restartcfg.form.bEnable = this.restartcfg.run ? 1 : 0;
|
|
|
|
|
this.restartcfg.form.uHour = this.restartcfg.form.uHour.substring(0, 2)
|
|
|
|
|
let res = await this.$axiosPost('/web/camera/setautocfg', this.restartcfg.form);
|
|
|
|
|
if (res.code === 0) {
|
|
|
|
|
this.$modal.msgSuccess("修改成功");
|
|
|
|
|
this.restartcfg.open = false;
|
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
// 显示时间
|
|
|
|
|
showDate(row){
|
|
|
|
|
const status = row.status;
|
|
|
|
|
if (status != 1) {
|
|
|
|
|
this.$modal.msg("设备未在线");
|
|
|
|
|
return;
|
|
|
|
|
}
|
|
|
|
|
// 重置表单
|
|
|
|
|
this.updateDateReset()
|
|
|
|
|
this.updateDate.queryForm.id = row.id;
|
|
|
|
|
this.getLigntCfg(row.id);
|
|
|
|
|
},
|
|
|
|
|
// 查询时间
|
|
|
|
|
async getLigntCfg(id){
|
|
|
|
|
let res = await this.$axiosGet('/web/camera/getLigntCfg/' + id);
|
|
|
|
|
if(res.code === 0){
|
|
|
|
|
let objDate = res.data
|
|
|
|
|
this.updateDate.queryForm.emMode = objDate.emMode + '';
|
|
|
|
|
this.updateDate.queryForm.nPreValue = objDate.nPreValue;
|
|
|
|
|
this.updateDate.queryForm.nBrightness = objDate.nBrightness;
|
|
|
|
|
this.updateDate.queryForm.startTime1 = new Date(2022,12,12,objDate.startHour,objDate.startMinute,objDate.startSecond)
|
|
|
|
|
this.updateDate.queryForm.endTime1 = new Date(2022,12,12,objDate.endHour,objDate.endMinute,objDate.endSecond)
|
|
|
|
|
this.updateDate.queryForm.startTime2 = new Date(2022,12,12,objDate.startHour2,objDate.startMinute2,objDate.startSecond2)
|
|
|
|
|
this.updateDate.queryForm.endTime2 = new Date(2022,12,12,objDate.endHour2,objDate.endMinute2,objDate.endSecond2)
|
|
|
|
|
this.updateDate.open = true;
|
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
//修改时间
|
|
|
|
|
async setLightCfg(){
|
|
|
|
|
let queryData = {
|
|
|
|
|
id: this.updateDate.queryForm.id,
|
|
|
|
|
emMode: this.updateDate.queryForm.emMode,
|
|
|
|
|
nPreValue: this.updateDate.queryForm.nPreValue,
|
|
|
|
|
nBrightness: this.updateDate.queryForm.nBrightness,
|
|
|
|
|
startTime1:formatDate(this.updateDate.queryForm.startTime1).split(' ')[1],
|
|
|
|
|
endTime1: formatDate(this.updateDate.queryForm.endTime1).split(' ')[1],
|
|
|
|
|
startTime2: formatDate(this.updateDate.queryForm.startTime2).split(' ')[1],
|
|
|
|
|
endTime2: formatDate(this.updateDate.queryForm.endTime2).split(' ')[1],
|
|
|
|
|
};
|
|
|
|
|
let res = await this.$axiosPost('/web/camera/setLightCfg',queryData);
|
|
|
|
|
if (res.code === 0){
|
|
|
|
|
Message.success(res.msg)
|
|
|
|
|
this.updateDate.open = false;
|
|
|
|
|
}else{
|
|
|
|
|
Message.error(res.msg)
|
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
reboot(row) {
|
|
|
|
|
const id = row.id;
|
|
|
|
|
const status = row.status;
|
|
|
|
|
if (status != 1) {
|
|
|
|
|
this.$modal.msg("设备未在线");
|
|
|
|
|
return;
|
|
|
|
|
}
|
|
|
|
|
this.$modal.confirm('是否确认重启？').then(() => {
|
|
|
|
|
this.exeReboot(id)
|
|
|
|
|
}).catch(() => { });
|
|
|
|
|
},
|
|
|
|
|
async exeReboot(id) {
|
|
|
|
|
const loading = this.$loading({
|
|
|
|
|
lock: true,
|
|
|
|
|
text: 'Loading',
|
|
|
|
|
spinner: 'el-icon-loading',
|
|
|
|
|
background: 'rgba(0, 0, 0, 0.7)'
|
|
|
|
|
});
|
|
|
|
|
// this.fullscreenLoading = true;
|
|
|
|
|
let res = await this.$axiosGet('/web/camera/reboot/' + id);
|
|
|
|
|
if (res.code === 0) {
|
|
|
|
|
// this.fullscreenLoading = false;
|
|
|
|
|
loading.close();
|
|
|
|
|
this.$modal.msgSuccess("执行成功,请稍等几分钟后继续操作");
|
|
|
|
|
this.getList();
|
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
async showVideo(row) {
|
|
|
|
|
const id = row.id
|
|
|
|
|
const status = row.status;
|
|
|
|
|
if (status != 1) {
|
|
|
|
|
this.$modal.msg("设备未在线");
|
|
|
|
|
return;
|
|
|
|
|
}
|
|
|
|
|
let res = await this.$axiosGet('/web/camera/showVideo/' + id);
|
|
|
|
|
if (res.code === 500) {
|
|
|
|
|
this.$modal.msg(res.msg);
|
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
async showLog(row) {
|
|
|
|
|
this.logform.queryForm.id = row.id
|
|
|
|
|
const status = row.status;
|
|
|
|
|
if (status != 1) {
|
|
|
|
|
this.$modal.msg("设备未在线");
|
|
|
|
|
return;
|
|
|
|
|
}
|
|
|
|
|
this.logform.open = true;
|
|
|
|
|
},
|
|
|
|
|
chooseTimeRange() {
|
|
|
|
|
|
|
|
|
|
if (this.timeStage != null) {
|
|
|
|
|
this.logform.queryForm.startTime = formatDate(this.timeStage[0], 'yyyy-MM-dd hh:mm:ss');
|
|
|
|
|
this.logform.queryForm.endTime = formatDate(this.timeStage[1], 'yyyy-MM-dd hh:mm:ss');
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
},
|
|
|
|
|
async handleAutoQuery() {
|
|
|
|
|
if(this.timeStage == null || this.timeStage.length == 0 ){
|
|
|
|
|
this.$modal.msg("请选择时间");
|
|
|
|
|
return;
|
|
|
|
|
}
|
|
|
|
|
let res = await this.$axiosGet('/web/camera/getloginfo', this.logform.queryForm);
|
|
|
|
|
|
|
|
|
|
if (res.code === 0) {
|
|
|
|
|
this.logInfoList = res.data;
|
|
|
|
|
this.$modal.msgSuccess("查询成功");
|
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
async register() {
|
|
|
|
|
let res = await this.$axiosGet('/web/camera/register');
|
|
|
|
|
if (res.code === 0) {
|
|
|
|
|
this.$modal.msgSuccess("执行成功");
|
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
async restartM3u8() {
|
|
|
|
|
let res = await this.$axiosGet('/web/camera/retartPullM3u8');
|
|
|
|
|
if (res.code === 0) {
|
|
|
|
|
this.$modal.msgSuccess("执行成功，请等待几分钟...");
|
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
async addMethod() {
|
|
|
|
|
let res = await this.$axiosPost('/web/camera/add', this.form);
|
|
|
|
|
if (res.code === 0) {
|
|
|
|
|
this.$modal.msgSuccess("新增成功");
|
|
|
|
|
this.open = false;
|
|
|
|
|
this.getList();
|
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
async editMethod() {
|
|
|
|
|
let res = await this.$axiosPost('/web/camera/edit', this.form);
|
|
|
|
|
if (res.code === 0) {
|
|
|
|
|
this.$modal.msgSuccess("修改成功");
|
|
|
|
|
this.open = false;
|
|
|
|
|
this.getList();
|
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
/** 提交按钮 */
|
|
|
|
|
submitForm() {
|
|
|
|
|
this.$refs["form"].validate(valid => {
|
|
|
|
|
if (valid) {
|
|
|
|
|
if (this.form.id != null) {
|
|
|
|
|
this.editMethod();
|
|
|
|
|
} else {
|
|
|
|
|
this.addMethod();
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
});
|
|
|
|
|
},
|
|
|
|
|
async configSubmit() {
|
|
|
|
|
let res = await this.$axiosPost('/web/camera/setConfig', this.configform);
|
|
|
|
|
if (res.code === 0) {
|
|
|
|
|
this.$modal.msgSuccess("设置成功");
|
|
|
|
|
this.configopen = false;
|
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
/** 删除按钮操作 */
|
|
|
|
|
async handleDelete(row) {
|
|
|
|
|
const ids = row.id || this.ids;
|
|
|
|
|
let res = await this.$axiosDelete('/web/camera/delete/' + ids);
|
|
|
|
|
if (res.code === 0) {
|
|
|
|
|
this.$modal.msgSuccess("删除成功");
|
|
|
|
|
this.getList();
|
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
/** 导出按钮操作 */
|
|
|
|
|
handleExport() {
|
|
|
|
|
this.download('web/camera/export', {
|
|
|
|
|
...this.queryParams
|
|
|
|
|
}, `camera_${new Date().getTime()}.xlsx`)
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
};
|
|
|
|
|
</script>
|
|
|
|
|
|
|
|
|
|
<style scoped>
|
|
|
|
|
.container {
|
|
|
|
|
display: flex;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.ftpform {
|
|
|
|
|
width: 300px;
|
|
|
|
|
margin-right: 50px;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.ftpform .el-form {
|
|
|
|
|
width: 100%;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.table {
|
|
|
|
|
flex: 1;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.head {
|
|
|
|
|
font-size: 24px;
|
|
|
|
|
line-height: 36px;
|
|
|
|
|
text-align: center;
|
|
|
|
|
height: 36px;
|
|
|
|
|
margin: 0 auto;
|
|
|
|
|
border-radius: 2px;
|
|
|
|
|
box-shadow:
|
|
|
|
|
1px 1px 2px hsla(200, 88%, 55%, .22),
|
|
|
|
|
inset -2px -2px 2px hsla(200, 88%, 55%, .22),
|
|
|
|
|
inset 0 0 1px hsla(200, 88%, 55%, .22);
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.tips {
|
|
|
|
|
margin: 10px 0;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.tips span {
|
|
|
|
|
display: grid;
|
|
|
|
|
grid: 1fr/1fr 10px;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.notice {
|
|
|
|
|
color: #f33;
|
|
|
|
|
padding-right: 20px;
|
|
|
|
|
display: flex;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.notice div:first-child {
|
|
|
|
|
width: 80px;
|
|
|
|
|
}
|
|
|
|
|
</style>
|
