|
@@ -87,7 +87,19 @@
|
|
|
<el-divider></el-divider>
|
|
|
<template>
|
|
|
<div>
|
|
|
- <h3 style="font-weight: bold">执法人员</h3> <!-- 表格上方的标题 -->
|
|
|
+ <el-descriptions :title="title" :column="1" border>
|
|
|
+ <el-descriptions-item label="附件" prop="attachPath">
|
|
|
+ <fileUpload v-model="attachPath" disabled class="fjList"></fileUpload>
|
|
|
+ </el-descriptions-item>
|
|
|
+ <el-descriptions-item label="说明">
|
|
|
+ <el-input v-model="describe" disabled/>
|
|
|
+ </el-descriptions-item>
|
|
|
+ </el-descriptions>
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+ <el-divider></el-divider>
|
|
|
+ <el-tabs v-model="activeTab" type="card">
|
|
|
+ <el-tab-pane label="执法人员" name="persons">
|
|
|
<el-table :data="workOrderDetails.persons" style="width: 100%">
|
|
|
<el-table-column prop="personName" label="人员姓名"></el-table-column>
|
|
|
<el-table-column prop="personCode" label="证件号码"></el-table-column>
|
|
@@ -100,10 +112,7 @@
|
|
|
</template>
|
|
|
</el-table-column>
|
|
|
</el-table>
|
|
|
- </div>
|
|
|
- </template>
|
|
|
- <el-divider></el-divider>
|
|
|
- <el-tabs v-model="activeTab" type="card">
|
|
|
+ </el-tab-pane>
|
|
|
<el-tab-pane label="执法记录" name="recordLogList">
|
|
|
<el-table :data="workOrderDetails.recordLogList" style="width: 100%">
|
|
|
<el-table-column prop="personCode" label="执法人员姓名"></el-table-column>
|
|
@@ -111,6 +120,19 @@
|
|
|
<el-table-column prop="deviceName" label="执法使用的设备名称"></el-table-column>
|
|
|
<el-table-column prop="startTime" label="执法开始时间"></el-table-column>
|
|
|
<el-table-column prop="endTime" label="执法结束时间"></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-video-camera"
|
|
|
+ @click="playBack(scope.row)"
|
|
|
+ v-hasPermi="['camerachannel:camerachannel:selectchannel']"
|
|
|
+ >回放
|
|
|
+ </el-button>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
</el-table>
|
|
|
</el-tab-pane>
|
|
|
<el-tab-pane label="子项信息" name="subitems">
|
|
@@ -171,12 +193,54 @@
|
|
|
</el-table>
|
|
|
</el-tab-pane>
|
|
|
</el-tabs>
|
|
|
+
|
|
|
+ <!--大华预览回放窗口-->
|
|
|
+ <el-dialog :title="dssPreviewTitle" :visible.sync="dssPreviewVisible" v-if="dssPreviewVisible"
|
|
|
+ customClass="videoCustomWidth"
|
|
|
+ @close="destroy" append-to-body
|
|
|
+ >
|
|
|
+ <div id="dssPreview" style="width:1020px;height:625px;position:relative;"></div>
|
|
|
+ </el-dialog>
|
|
|
+ <!--海康预览回放窗口-->
|
|
|
+ <!--预览-->
|
|
|
+ <el-dialog :title="cameraTitle" :visible.sync="cameraVisible" v-if="cameraVisible" customClass="videoCustomWidth"
|
|
|
+ @close="hikDisconnect" append-to-body
|
|
|
+ >
|
|
|
+ <div id="playWnd" style="width:1020px;height:625px;position:relative;"></div>
|
|
|
+ </el-dialog>
|
|
|
+ <!--回放-->
|
|
|
+ <el-dialog :title="cameraTitlePlayBack" :visible.sync="cameraVisiblePlayBack" v-if="cameraVisiblePlayBack"
|
|
|
+ customClass="videoCustomWidthPlayBack"
|
|
|
+ @close="cancelEventLocationShow()"
|
|
|
+ >
|
|
|
+ <div class="item" style="z-index: 99999"><span class="label">回放开始时间:</span>
|
|
|
+ <input type="datetime-local" value-format="yyyy-MM-dd HH:mm:ss" v-model="startTimeStamp"/>
|
|
|
+ <span class="label">回放结束时间:</span>
|
|
|
+ <input type="datetime-local" value-format="yyyy-MM-dd HH:mm:ss" v-model="endTimeStamp"/>
|
|
|
+ </div>
|
|
|
+ <div class="item" style="margin-top: 20px;margin-left: -20px;">
|
|
|
+ <button style="width:90px;padding:0;margin:0;" class="btn" @click="startPlayback">回放</button>
|
|
|
+ <button style="width:90px;padding:0;margin:0;" class="btn" @click="stopAllPlayback">停止全部回放</button>
|
|
|
+ </div>
|
|
|
+ <div style="width:1020px;height:625px;position:relative;">
|
|
|
+ <div id="playWndPlayBack" class="playWndPlayBack" style="left: 0px; top: 0px;"></div>
|
|
|
+ </div>
|
|
|
+ </el-dialog>
|
|
|
+ <haikang-t-v-walls ref="haikangTVWalls"></haikang-t-v-walls>
|
|
|
</div>
|
|
|
</el-dialog>
|
|
|
</template>
|
|
|
|
|
|
<script>
|
|
|
-import {getDetails} from "@/api/lawenforcement/record";
|
|
|
+import {getCamera, getDetails, getFillForm,selectchannelCodeByCameraId,getDahuaVideoServer} from "@/api/lawenforcement/record";
|
|
|
+import fileUpload from '@/views/components/FileUpload/index.vue';
|
|
|
+import {selectConfigKey} from '@/api/system/config'
|
|
|
+/** ----------------------------------摄像头预览开始------------------------------------- */
|
|
|
+import DHWs from '@/dahua/lib/DHWs'
|
|
|
+import {getChildrenByDeptId} from "@/api/system/dept";
|
|
|
+
|
|
|
+/** ----------------------------------摄像头预览结束------------------------------------- */
|
|
|
+
|
|
|
|
|
|
export default {
|
|
|
name: 'DetailsVue',
|
|
@@ -184,6 +248,7 @@ export default {
|
|
|
'lawenforcement_type',
|
|
|
'lawenforcement_jobType'
|
|
|
],
|
|
|
+ components: {fileUpload},
|
|
|
props: {
|
|
|
detailRecordId: {
|
|
|
type: String,
|
|
@@ -196,10 +261,31 @@ export default {
|
|
|
},
|
|
|
data() {
|
|
|
return {
|
|
|
+ title:"填报",
|
|
|
+ cameraTitlePlayBack: '',
|
|
|
workOrderDetails: {},
|
|
|
- activeTab: 'recordLogList', // 默认激活的页签
|
|
|
+ cameraVisiblePlayBack: false,
|
|
|
+ /***大华***/
|
|
|
+ dssPreviewTitle: '',
|
|
|
+ dssPreviewVisible: false,
|
|
|
+ /***海康***/
|
|
|
+ cameraTitle: '',
|
|
|
+ cameraVisible: false,
|
|
|
+ oWebControl: null,
|
|
|
+ startTimeStamp: '',
|
|
|
+ endTimeStamp: '',
|
|
|
+ attachPath:'',
|
|
|
+ describe:'',
|
|
|
+ camera:null,
|
|
|
+ activeTab: 'persons', // 默认激活的页签
|
|
|
};
|
|
|
},
|
|
|
+ created() {
|
|
|
+ /** ----------------------------------摄像头预览开始------------------------------------- */
|
|
|
+ const DHWsInstance = DHWs.getInstance()
|
|
|
+ this.ws = DHWsInstance
|
|
|
+ /** ----------------------------------摄像头预览结束------------------------------------- */
|
|
|
+ },
|
|
|
computed: {
|
|
|
detailDialog: {
|
|
|
get() {
|
|
@@ -216,6 +302,17 @@ export default {
|
|
|
this.workOrderDetails = res.data;
|
|
|
});
|
|
|
},
|
|
|
+ getFillForm(recordId) {
|
|
|
+ getFillForm({recordId:recordId}).then(res => {
|
|
|
+ if (res.data!==undefined){
|
|
|
+ this.title = res.data.type
|
|
|
+ if (res.data.attachPath!==undefined){
|
|
|
+ this.attachPath = res.data.attachPath;
|
|
|
+ }
|
|
|
+ this.describe = res.data.describe;
|
|
|
+ }
|
|
|
+ });
|
|
|
+ },
|
|
|
closeDetail() {
|
|
|
this.detailDialog = false
|
|
|
},
|
|
@@ -233,12 +330,178 @@ export default {
|
|
|
const day = String(date.getDate()).padStart(2, '0');
|
|
|
return `${year}-${month}-${day}`;
|
|
|
},
|
|
|
+
|
|
|
+ /** ----------------------------------摄像头回放开始------------------------------------- */
|
|
|
+ playBack(row) {
|
|
|
+ getCamera(row.deviceId).then(response => {
|
|
|
+ this.camera = response.data
|
|
|
+ console.log(this.camera)
|
|
|
+ })
|
|
|
+ selectConfigKey('DssVersion').then(res => {
|
|
|
+ if (this.ws.getLocalDssVersion() != res.data) {
|
|
|
+ this.$modal.confirm('系统检测到新客户端版本,请更新后使用', '系统提示', {
|
|
|
+ confirmButtonText: '确定',
|
|
|
+ cancelButtonText: '取消',
|
|
|
+ type: 'warning'
|
|
|
+ }).then(() => {
|
|
|
+ selectConfigKey('video_plugin_url').then(response => {
|
|
|
+ window.open(response.data)
|
|
|
+ })
|
|
|
+ }).catch(() => {
|
|
|
+ return
|
|
|
+ })
|
|
|
+ return
|
|
|
+ }
|
|
|
+ getCamera(row.deviceId).then(response => {
|
|
|
+ this.camera = response.data
|
|
|
+ const cameraCode = this.camera.cameraCode
|
|
|
+ const cameraName = this.camera.cameraName
|
|
|
+ const deviceSn = this.camera.deviceSn
|
|
|
+ const deviceCode = this.camera.deviceCode
|
|
|
+ const deviceProtocolType = this.camera.deviceProtocolType
|
|
|
+ const deviceLoginType = this.camera.deviceLoginType
|
|
|
+ const convergencePlatform = this.camera.convergencePlatform
|
|
|
+ //如果是大华摄像头
|
|
|
+ if (convergencePlatform === '1') {
|
|
|
+ selectchannelCodeByCameraId(this.camera.id).then(res => {
|
|
|
+ if (cameraCode != null && cameraCode.length > 0) {
|
|
|
+ this.dssPreviewTitle = '视频回放'
|
|
|
+ this.dssPreviewVisible = true
|
|
|
+ this.playBack_dss(cameraCode, cameraName, deviceCode, deviceSn, deviceProtocolType, deviceLoginType)
|
|
|
+ } else {
|
|
|
+ this.$modal.msg('没有匹配到相对应摄像头!!!')
|
|
|
+ }
|
|
|
+ })
|
|
|
+ } else {
|
|
|
+ //海康头
|
|
|
+ console.log('haikang')
|
|
|
+ const cameraIndexCode = this.camera.cameraCode
|
|
|
+ this.$refs.haikangTVWalls.showTVWall(cameraIndexCode, 1)
|
|
|
+ }
|
|
|
+ })
|
|
|
+
|
|
|
+ })
|
|
|
+ },
|
|
|
+ /** ----------------------------------摄像头回放结束------------------------------------- */
|
|
|
+
|
|
|
+ /** ----------------------------------大华摄像头回放开始------------------------------------- */
|
|
|
+ alertLogin: function() {
|
|
|
+ this.$modal.msg('登录中....')
|
|
|
+ },
|
|
|
+ alertLoginSuccess: function() {
|
|
|
+ this.$modal.msgSuccess('登录成功!')
|
|
|
+ },
|
|
|
+ alertLoginFailed: function() {
|
|
|
+ this.$modal.msgError('登陆失败!')
|
|
|
+ },
|
|
|
+ alertReinstall: function() {
|
|
|
+ this.$modal.msgWarning('请重新安装客户端')
|
|
|
+ },
|
|
|
+ /** 预览按钮操作 */
|
|
|
+ // playBack_dss(channelCode, channelName,cameraCode,cameraName) {
|
|
|
+ playBack_dss(cameraCode, cameraName, deviceCode, deviceSn, deviceProtocolType, deviceLoginType) {
|
|
|
+ getDahuaVideoServer().then(newResponse => {
|
|
|
+ this.ws.detectConnectQt().then(res => {
|
|
|
+ if (res) { // 连接客户端成功
|
|
|
+ this.alertLogin()
|
|
|
+ this.ws.login({
|
|
|
+ loginIp: newResponse.loginIp,
|
|
|
+ loginPort: newResponse.loginPort,
|
|
|
+ userName: newResponse.userName,
|
|
|
+ userPwd: newResponse.userPwd,
|
|
|
+ token: '',
|
|
|
+ https: 1
|
|
|
+ })
|
|
|
+ this.ws.on('loginState', (res) => {
|
|
|
+ this.isLogin = res
|
|
|
+ if (res) {
|
|
|
+ this.alertLoginSuccess()
|
|
|
+ this.activePanel = 'key2'
|
|
|
+ let channelList = []
|
|
|
+ for (let i = 0; i < cameraCode.length; i++) {
|
|
|
+ let code = { 'channelId': cameraCode }
|
|
|
+ channelList.push(code)
|
|
|
+ }
|
|
|
+ this.create(this.careteListJson(cameraCode, cameraName, deviceCode, deviceSn, deviceProtocolType, deviceLoginType), channelList, 'dssPreview', 'playbackUI')
|
|
|
+ } else {
|
|
|
+ this.alertLoginFailed()
|
|
|
+ }
|
|
|
+ })
|
|
|
+ } else { // 连接客户端失败
|
|
|
+ this.alertReinstall()
|
|
|
+ }
|
|
|
+ })
|
|
|
+ })
|
|
|
+ },
|
|
|
+ /** ----------------------------------大华摄像头回放结束------------------------------------- */
|
|
|
+ cancelEventLocationShow() {
|
|
|
+ if (this.oWebControl != null) {
|
|
|
+ this.oWebControl.JS_HideWnd() // 先让窗口隐藏,规避可能的插件窗口滞后于浏览器消失问题
|
|
|
+ this.oWebControl.JS_Disconnect().then(function() { // 断开与插件服务连接成功
|
|
|
+ },
|
|
|
+ function() { // 断开与插件服务连接失败
|
|
|
+ })
|
|
|
+ }
|
|
|
+ this.cameraIndexCodePlayBack = ''
|
|
|
+ },
|
|
|
+ startPlayback() {
|
|
|
+ //录像回放功能
|
|
|
+ var cameraIndexCode = this.cameraIndexCodePlayBack //获取输入的监控点编号值,必填
|
|
|
+ var startTimeStamp = new Date(this.startTimeStamp).getTime() //回放开始时间戳,必填
|
|
|
+ var endTimeStamp = new Date(this.endTimeStamp).getTime() //回放结束时间戳,必填
|
|
|
+ var recordLocation = 0 //录像存储位置:0-中心存储,1-设备存储
|
|
|
+ var transMode = 1 //传输协议:0-UDP,1-TCP
|
|
|
+ var gpuMode = 0 //是否启用GPU硬解,0-不启用,1-启用
|
|
|
+ var wndId = -1 //播放窗口序号(在2x2以上布局下可指定播放窗口)
|
|
|
+
|
|
|
+ this.oWebControl.JS_RequestInterface({
|
|
|
+ funcName: 'startPlayback',
|
|
|
+ argument: JSON.stringify({
|
|
|
+ cameraIndexCode: cameraIndexCode, //监控点编号
|
|
|
+ startTimeStamp: Math.floor(startTimeStamp / 1000).toString(), //录像查询开始时间戳,单位:秒
|
|
|
+ endTimeStamp: Math.floor(endTimeStamp / 1000).toString(), //录像结束开始时间戳,单位:秒
|
|
|
+ recordLocation: recordLocation, //录像存储类型:0-中心存储,1-设备存储
|
|
|
+ transMode: transMode, //传输协议:0-UDP,1-TCP
|
|
|
+ gpuMode: gpuMode, //是否启用GPU硬解,0-不启用,1-启用
|
|
|
+ wndId: wndId //可指定播放窗口
|
|
|
+ })
|
|
|
+ })
|
|
|
+ },
|
|
|
+ stopAllPlayback() {
|
|
|
+ //录像回放停止
|
|
|
+ this.oWebControl.JS_RequestInterface({
|
|
|
+ funcName: 'stopAllPlayback'
|
|
|
+ })
|
|
|
+ },
|
|
|
+ destroy() { // 调用销毁控件接口
|
|
|
+ if (!this.isLogin) {
|
|
|
+ this.$modal.msgWarning('正在登陆客户端,请稍等......')
|
|
|
+ return false
|
|
|
+ }
|
|
|
+ const ctrls = this.ws.ctrls.map(i => {
|
|
|
+ if (i.ctrlCode === this.ctrl) {
|
|
|
+ return i.ctrlCode
|
|
|
+ }
|
|
|
+ })
|
|
|
+ this.ws.destroyCtrl(ctrls)
|
|
|
+ },
|
|
|
+ hikDisconnect() {
|
|
|
+ console.log('111')
|
|
|
+ let that = this
|
|
|
+ if (that.oWebControl != null) {
|
|
|
+ that.oWebControl.JS_HideWnd() // 先让窗口隐藏,规避可能的插件窗口滞后于浏览器消失问题
|
|
|
+ that.oWebControl.JS_Disconnect().then(function() {
|
|
|
+ }, function() {
|
|
|
+ }) // 断开与插件服务连接成功 // 断开与插件服务连接失败
|
|
|
+ }
|
|
|
+ },
|
|
|
},
|
|
|
watch: {
|
|
|
detailRecordId: {
|
|
|
handler(newVal) {
|
|
|
if (newVal) {
|
|
|
this.getData(newVal)
|
|
|
+ this.getFillForm(newVal)
|
|
|
}
|
|
|
},
|
|
|
immediate: true,
|