You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
1346 lines
38 KiB
1346 lines
38 KiB
<template>
|
|
<div class="app-container">
|
|
<el-row :gutter="20">
|
|
<el-col :span="4">
|
|
<div class="qurey">
|
|
<el-input
|
|
:placeholder="
|
|
$t('share.PleaseEnter') +
|
|
$t('site_management.PleaseEnterTheContent')
|
|
"
|
|
v-model="input3"
|
|
class="input-with-select"
|
|
>
|
|
<el-button
|
|
slot="append"
|
|
icon="el-icon-search"
|
|
type="primary"
|
|
></el-button>
|
|
</el-input>
|
|
</div>
|
|
<el-tree
|
|
:data="treeData"
|
|
:props="defaultProps"
|
|
@node-click="handleNodeClick"
|
|
></el-tree>
|
|
</el-col>
|
|
<el-col :span="14">
|
|
<el-alert
|
|
:title="$t('share.prompt')"
|
|
type="info"
|
|
:description="$t('site_management.promptMsg') + ';'"
|
|
show-icon
|
|
>
|
|
</el-alert>
|
|
<div class="tableOperate">
|
|
<div class="btnBox">
|
|
<el-button type="primary" @click="add" :disabled="deviceIdShow">{{
|
|
$t("share.addTo")
|
|
}}</el-button>
|
|
<el-button type="danger">{{ $t("share.delete") }}</el-button>
|
|
<el-button @click="upDataBtn">{{
|
|
$t("site_management.RobotPointUpload")
|
|
}}</el-button>
|
|
</div>
|
|
<div class="tableSearch">
|
|
<el-input
|
|
:placeholder="
|
|
$t('share.PleaseEnter') +
|
|
$t('site_management.PleaseEnterTheContent')
|
|
"
|
|
v-model="input3"
|
|
class="input-with-select"
|
|
>
|
|
<el-button
|
|
slot="append"
|
|
icon="el-icon-search"
|
|
type="primary"
|
|
></el-button>
|
|
</el-input>
|
|
</div>
|
|
</div>
|
|
<el-table
|
|
:data="tableData"
|
|
@row-click="changeCurrentRow"
|
|
highlight-current-row
|
|
>
|
|
<el-table-column type="selection" width="55" fixed="left">
|
|
</el-table-column>
|
|
<el-table-column
|
|
:label="$t('site_management.MonitoringPointLocation')"
|
|
width="200"
|
|
fixed="left"
|
|
align="center"
|
|
:render-header="addRedStar"
|
|
prop="patrolpointName"
|
|
>
|
|
<template slot-scope="scope">
|
|
<el-input
|
|
v-model="scope.row.patrolpointName"
|
|
:placeholder="
|
|
$t('share.PleaseEnter') + $t('site_management.PointName')
|
|
"
|
|
disabled
|
|
></el-input>
|
|
</template>
|
|
</el-table-column>
|
|
|
|
<el-table-column
|
|
:label="$t('site_management.MonitoringContent')"
|
|
width="150"
|
|
align="center"
|
|
prop="patrolContent"
|
|
>
|
|
</el-table-column>
|
|
<el-table-column
|
|
:label="$t('site_management.purpose')"
|
|
prop="purpose"
|
|
>
|
|
</el-table-column>
|
|
<el-table-column
|
|
:label="$t('site_management.MonitoringNumber')"
|
|
width="200"
|
|
align="center"
|
|
:render-header="addRedStar"
|
|
prop="patrolpointCode"
|
|
>
|
|
<template slot-scope="scope">
|
|
<el-input
|
|
v-model="scope.row.patrolpointCode"
|
|
disabled
|
|
:placeholder="
|
|
$t('share.PleaseEnter') +
|
|
$t('site_management.MonitoringPointNumber')
|
|
"
|
|
></el-input>
|
|
</template>
|
|
</el-table-column>
|
|
|
|
<el-table-column
|
|
:label="$t('site_management.InspectionType')"
|
|
width="150"
|
|
align="center"
|
|
:render-header="addRedStar"
|
|
>
|
|
<template slot-scope="scope">
|
|
<el-select
|
|
multiple
|
|
v-model="scope.row.patrolTypeId"
|
|
:placeholder="
|
|
$t('share.PleaseChoose') +
|
|
$t('site_management.InspectionType')
|
|
"
|
|
disabled
|
|
>
|
|
<el-option
|
|
v-for="item in InspectionTypeData"
|
|
:key="item.patrolTypeId"
|
|
:label="item.patrolTypeName"
|
|
:value="item.patrolTypeId"
|
|
>
|
|
</el-option>
|
|
</el-select>
|
|
</template>
|
|
</el-table-column>
|
|
<el-table-column
|
|
:label="$t('site_management.ImportantLevel')"
|
|
width="150"
|
|
align="center"
|
|
:render-header="addRedStar"
|
|
>
|
|
<template slot-scope="scope">
|
|
<el-select
|
|
:placeholder="
|
|
$t('share.PleaseChoose') +
|
|
$t('site_management.ImportantLevel')
|
|
"
|
|
v-model="scope.row.pointImptLevel"
|
|
disabled
|
|
>
|
|
<el-option
|
|
v-for="item in pointImptLevelData"
|
|
:key="item.dictValue"
|
|
:label="item.dictLabel"
|
|
:value="item.dictValue"
|
|
>
|
|
</el-option>
|
|
</el-select>
|
|
</template>
|
|
</el-table-column>
|
|
<el-table-column
|
|
:label="$t('site_management.3DCoordinates')"
|
|
width="270"
|
|
align="center"
|
|
>
|
|
<template slot-scope="scope">
|
|
<div class="tableXYZ">
|
|
<el-input
|
|
placeholder="x(-20,20)"
|
|
v-model="scope.row.positionX"
|
|
disabled
|
|
></el-input>
|
|
<el-input
|
|
placeholder="y(66)"
|
|
v-model="scope.row.positionY"
|
|
disabled
|
|
></el-input>
|
|
<el-input
|
|
placeholder="z(-6,20)"
|
|
v-model="scope.row.positionZ"
|
|
disabled
|
|
></el-input>
|
|
</div>
|
|
</template>
|
|
</el-table-column>
|
|
<el-table-column
|
|
:label="$t('site_management.ReportIdentificationType')"
|
|
width="220"
|
|
align="center"
|
|
>
|
|
</el-table-column>
|
|
<el-table-column
|
|
:label="$t('site_management.IntelligentRecognitionType')"
|
|
width="220"
|
|
align="center"
|
|
>
|
|
<template slot-scope="scope">
|
|
<span class="intelligenceType">设置</span>
|
|
</template>
|
|
</el-table-column>
|
|
<el-table-column
|
|
:label="$t('site_management.DiscriminantBenchmarkImage')"
|
|
width="220"
|
|
align="center"
|
|
>
|
|
</el-table-column>
|
|
<el-table-column
|
|
:label="$t('share.operate')"
|
|
fixed="right"
|
|
align="center"
|
|
width="100"
|
|
>
|
|
<template slot-scope="scope">
|
|
<el-button
|
|
size="mini"
|
|
type="text"
|
|
@click="monitorPointEdit(scope.row)"
|
|
>修改</el-button
|
|
>
|
|
<el-button
|
|
size="mini"
|
|
type="text"
|
|
@click="handleDelete(scope.row.patrolpointId)"
|
|
>{{ $t("share.delete") }}</el-button
|
|
>
|
|
</template>
|
|
</el-table-column>
|
|
</el-table>
|
|
</el-col>
|
|
<el-col :span="6">
|
|
<div class="cameraImgDiv">
|
|
<img src="@/assets/images/camera.png" class="cameraImg" />
|
|
<div>{{ $t("site_management.ClickOnTheLeftSide") }}</div>
|
|
</div>
|
|
<el-tabs v-model="activeName" @tab-click="tabsClick" :stretch="true">
|
|
<el-tab-pane :label="$t('site_management.tabsOne')" name="first">
|
|
<div class="tabsBtn">
|
|
<el-button
|
|
@click="bindingMonitorBtn(0)"
|
|
style="margin-top: 10px"
|
|
:disabled="RightBtnShow"
|
|
>{{
|
|
$t("site_management.BindVisibleLightMonitoringPoints")
|
|
}}</el-button
|
|
>
|
|
<el-button
|
|
@click="bindingMonitorBtn(1)"
|
|
style="margin-top: 10px"
|
|
:disabled="RightBtnShow"
|
|
>{{
|
|
$t("site_management.BindThermalImagingMonitoringPoints")
|
|
}}</el-button
|
|
>
|
|
</div>
|
|
</el-tab-pane>
|
|
<el-tab-pane :label="$t('site_management.tabsTwo')" name="second">
|
|
<div class="tabsBtn">
|
|
<el-button @click="InspectionBtn" :disabled="RightBtnShow">{{
|
|
$t("site_management.BindMonitoringDevices")
|
|
}}</el-button>
|
|
|
|
<el-table style="margin-top: 10px" v-if="false">
|
|
<el-table-column :label="$t('site_management.EquipmentName')">
|
|
</el-table-column>
|
|
<el-table-column :label="$t('site_management.EquipmentCode')">
|
|
</el-table-column>
|
|
<el-table-column :label="$t('share.operate')">
|
|
<template slot-scope="scope">
|
|
<el-button size="mini" type="text">{{
|
|
$t("site_management.Unbind")
|
|
}}</el-button>
|
|
</template>
|
|
</el-table-column>
|
|
</el-table>
|
|
</div>
|
|
</el-tab-pane>
|
|
</el-tabs>
|
|
</el-col>
|
|
</el-row>
|
|
|
|
<!-- 添加监控点位 -->
|
|
<el-dialog
|
|
:title="monitorPointTitle"
|
|
:visible.sync="monitorPointDialogVisible"
|
|
width="60%"
|
|
:before-close="monitorPointHandleClose"
|
|
>
|
|
<el-form
|
|
:model="monitorPointForm"
|
|
label-position="right"
|
|
label-width="190px"
|
|
style="padding-right: 10%"
|
|
:rules="rules"
|
|
ref="ruleForm"
|
|
>
|
|
<el-form-item
|
|
:label="$t('site_management.MonitoringPointName')"
|
|
prop="patrolpointName"
|
|
>
|
|
<el-input
|
|
v-model="monitorPointForm.patrolpointName"
|
|
:placeholder="
|
|
$t('share.PleaseEnter') +
|
|
$t('site_management.MonitoringPointName')
|
|
"
|
|
></el-input>
|
|
</el-form-item>
|
|
<el-form-item
|
|
:label="$t('site_management.MonitoringPointNumber')"
|
|
prop="patrolpointCode"
|
|
>
|
|
<el-input
|
|
v-model="monitorPointForm.patrolpointCode"
|
|
:placeholder="
|
|
$t('share.PleaseEnter') +
|
|
$t('site_management.MonitoringPointNumber')
|
|
"
|
|
></el-input>
|
|
</el-form-item>
|
|
<el-form-item
|
|
:label="$t('site_management.MonitoringContent')"
|
|
prop="patrolContent"
|
|
>
|
|
<el-input
|
|
v-model="monitorPointForm.patrolContent"
|
|
type="textarea"
|
|
maxlength="200"
|
|
:placeholder="
|
|
$t('share.PleaseEnter') + $t('site_management.MonitoringContent')
|
|
"
|
|
></el-input>
|
|
</el-form-item>
|
|
|
|
<el-form-item
|
|
:label="$t('site_management.InspectionType')"
|
|
prop="patrolTypeId"
|
|
>
|
|
<el-select
|
|
v-model="monitorPointForm.patrolTypeId"
|
|
multiple
|
|
filterable
|
|
allow-create
|
|
default-first-option
|
|
:placeholder="
|
|
$t('share.PleaseChoose') + $t('site_management.InspectionType')
|
|
"
|
|
style="width: 100%"
|
|
>
|
|
<el-option
|
|
v-for="item in InspectionTypeData"
|
|
:key="item.patrolTypeId"
|
|
:label="item.patrolTypeName"
|
|
:value="item.patrolTypeId"
|
|
>
|
|
</el-option>
|
|
</el-select>
|
|
</el-form-item>
|
|
<el-form-item
|
|
:label="$t('site_management.ImportantLevel')"
|
|
prop="pointImptLevel"
|
|
>
|
|
<el-select
|
|
v-model="monitorPointForm.pointImptLevel"
|
|
:placeholder="
|
|
$t('share.PleaseChoose') + $t('site_management.ImportantLevel')
|
|
"
|
|
>
|
|
<el-option
|
|
v-for="item in pointImptLevelData"
|
|
:key="item.dictValue"
|
|
:label="item.dictLabel"
|
|
:value="item.dictValue"
|
|
>
|
|
</el-option>
|
|
</el-select>
|
|
</el-form-item>
|
|
<el-form-item :label="$t('site_management.purpose')">
|
|
<el-input
|
|
v-model="monitorPointForm.purpose"
|
|
:placeholder="
|
|
$t('share.PleaseEnter') + $t('site_management.purpose')
|
|
"
|
|
disabled
|
|
></el-input>
|
|
</el-form-item>
|
|
|
|
<el-form-item :label="$t('site_management.coordinate') + ' x'">
|
|
<el-input-number
|
|
v-model="monitorPointForm.positionX"
|
|
:min="-20"
|
|
:max="20"
|
|
label=""
|
|
:step="0.1"
|
|
></el-input-number>
|
|
<span> {{ $t("site_management.coordinateXPrompt") }}</span>
|
|
</el-form-item>
|
|
<el-form-item :label="$t('site_management.coordinate') + ' y'">
|
|
<el-input-number
|
|
v-model="monitorPointForm.positionY"
|
|
:min="66"
|
|
:max="80"
|
|
label=""
|
|
:step="0.1"
|
|
></el-input-number>
|
|
<span> {{ $t("site_management.coordinateYPrompt") }}</span>
|
|
</el-form-item>
|
|
<el-form-item :label="$t('site_management.coordinate') + ' z'">
|
|
<el-input-number
|
|
v-model="monitorPointForm.positionZ"
|
|
:min="-6"
|
|
:max="20"
|
|
label=""
|
|
:step="0.1"
|
|
></el-input-number>
|
|
<span>{{ $t("site_management.coordinateZPrompt") }}</span>
|
|
</el-form-item>
|
|
</el-form>
|
|
<span slot="footer" class="dialog-footer">
|
|
<el-button @click="monitorPointHandleClose">{{
|
|
$t("share.cancel")
|
|
}}</el-button>
|
|
<el-button type="primary" @click="submitForm">{{
|
|
$t("share.confirm")
|
|
}}</el-button>
|
|
</span>
|
|
</el-dialog>
|
|
|
|
<!-- 绑定可见光监测点 -->
|
|
<el-dialog
|
|
:title="bindingMonitorPointTitle"
|
|
:visible.sync="bindingMonitorPointDialogVisible"
|
|
width="70%"
|
|
:before-close="bindingMonitorPointClose"
|
|
>
|
|
<el-row :gutter="20">
|
|
<el-col :span="5">
|
|
<div class="bindingMonitorPointTree">
|
|
<el-tree :data="treeData" :props="defaultProps"></el-tree>
|
|
</div>
|
|
</el-col>
|
|
<el-col :span="13">
|
|
<div class="bindingMonitorPointDiv">
|
|
<videoPlayer />
|
|
</div>
|
|
</el-col>
|
|
<el-col :span="6">
|
|
<div style="background: #eee; padding: 5px">
|
|
{{ $t("site_management.PTZ") }}
|
|
</div>
|
|
<div class="PTZ-content">
|
|
<img src="@/assets/images/PTZImg.png" alt="" class="PTZImg" />
|
|
<div class="r-ti2-pos">
|
|
<div></div>
|
|
<div></div>
|
|
<div></div>
|
|
<div></div>
|
|
<div></div>
|
|
<div></div>
|
|
<div></div>
|
|
<div></div>
|
|
</div>
|
|
</div>
|
|
<div class="r-ti3">
|
|
<div class="r-ti3-d1">
|
|
<img src="@/assets/images/searchImg.png" alt="" />
|
|
<div class="r-ti3-d2">
|
|
<div></div>
|
|
<div></div>
|
|
</div>
|
|
</div>
|
|
<div class="r-ti3-d1">
|
|
<img src="@/assets/images/r2Img.png" alt="" />
|
|
<div class="r-ti3-d2">
|
|
<div></div>
|
|
<div></div>
|
|
</div>
|
|
</div>
|
|
<div class="r-ti3-d1">
|
|
<img src="@/assets/images/r3Img.png" alt="" />
|
|
<div class="r-ti3-d2">
|
|
<div></div>
|
|
<div></div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="r-ti4">
|
|
<div style="display: flex">
|
|
<el-select
|
|
v-model="value"
|
|
:placeholder="$t('site_management.PleaseSelectAPresetPoint')"
|
|
>
|
|
<el-option label="item.label" value="item.value"> </el-option>
|
|
</el-select>
|
|
<img src="@/assets/images/playImg.png" alt="" />
|
|
<img src="@/assets/images/addImg.png" alt="" />
|
|
</div>
|
|
<div style="display: flex; margin-top: 20px">
|
|
<el-input
|
|
:placeholder="$t('site_management.PleaseEnterTheContent')"
|
|
></el-input>
|
|
<img src="@/assets/images/setImg.png" alt="" />
|
|
</div>
|
|
</div>
|
|
</el-col>
|
|
</el-row>
|
|
<el-table
|
|
:data="bindingMonitorPointTableData"
|
|
style="width: 100%"
|
|
@header-click="clickFun"
|
|
>
|
|
<el-table-column
|
|
prop="date"
|
|
:label="$t('site_management.ActionType')"
|
|
align="center"
|
|
>
|
|
</el-table-column>
|
|
<el-table-column
|
|
prop="name"
|
|
:label="$t('site_management.RecordingDuration')"
|
|
align="center"
|
|
>
|
|
</el-table-column>
|
|
<el-table-column
|
|
prop="address"
|
|
:label="$t('site_management.NumberOfPhotosTaken')"
|
|
align="center"
|
|
>
|
|
</el-table-column>
|
|
<el-table-column
|
|
prop="address"
|
|
:label="$t('site_management.PhotoInterval')"
|
|
align="center"
|
|
>
|
|
</el-table-column>
|
|
<el-table-column
|
|
align="center"
|
|
:render-header="(h, obj) => renderHeader(h, obj, $t('share.addTo'))"
|
|
>
|
|
<template slot-scope="scope">
|
|
<span>{{ $t("share.delete") }}</span>
|
|
</template>
|
|
</el-table-column>
|
|
</el-table>
|
|
</el-dialog>
|
|
|
|
<!-- 绑定巡检设备 -->
|
|
<el-dialog
|
|
:title="$t('site_management.SelectInspectionEquipment')"
|
|
:visible.sync="InspectionDialogVisible"
|
|
width="70%"
|
|
:before-close="InspectionHandleClose"
|
|
>
|
|
<el-form :inline="true" :model="queryParams" class="demo-form-inline">
|
|
<el-form-item :label="$t('equipment.DeviceType')">
|
|
<el-select
|
|
v-model="queryParams.region"
|
|
:placeholder="$t('share.PleaseChoose') + $t('equipment.DeviceType')"
|
|
>
|
|
<!-- <el-option label="区域一" value="shanghai"></el-option>
|
|
<el-option label="区域二" value="beijing"></el-option> -->
|
|
</el-select>
|
|
</el-form-item>
|
|
<el-form-item :label="$t('equipment.EquipmentName')">
|
|
<el-input
|
|
v-model="queryParams.user"
|
|
:placeholder="
|
|
$t('share.PleaseEnter') + $t('equipment.EquipmentName')
|
|
"
|
|
></el-input>
|
|
</el-form-item>
|
|
<el-form-item :label="$t('equipment.EquipmentCode')">
|
|
<el-input
|
|
v-model="queryParams.user"
|
|
:placeholder="
|
|
$t('share.PleaseEnter') + $t('equipment.EquipmentCode')
|
|
"
|
|
></el-input>
|
|
</el-form-item>
|
|
<el-form-item :label="$t('equipment.Manufacturer')">
|
|
<el-input
|
|
v-model="queryParams.user"
|
|
:placeholder="
|
|
$t('share.PleaseEnter') + $t('equipment.Manufacturer')
|
|
"
|
|
></el-input>
|
|
</el-form-item>
|
|
<el-form-item>
|
|
<el-button type="primary" icon="el-icon-search" size="mini">{{
|
|
$t("share.search")
|
|
}}</el-button>
|
|
<el-button icon="el-icon-refresh" size="mini">{{
|
|
$t("share.reset")
|
|
}}</el-button>
|
|
</el-form-item>
|
|
</el-form>
|
|
<el-table
|
|
:data="InspectionTableData"
|
|
style="width: 100%"
|
|
@row-click="InspectionChangeCurrentRow"
|
|
highlight-current-row
|
|
>
|
|
<el-table-column
|
|
type="selection"
|
|
width="55"
|
|
align="center"
|
|
fixed="left"
|
|
/>
|
|
<el-table-column
|
|
prop="date"
|
|
min-width="130px"
|
|
:label="$t('equipment.EquipmentName')"
|
|
align="center"
|
|
fixed="left"
|
|
>
|
|
</el-table-column>
|
|
<el-table-column
|
|
prop="name"
|
|
min-width="130px"
|
|
:label="$t('equipment.EquipmentCode')"
|
|
align="center"
|
|
fixed="left"
|
|
>
|
|
</el-table-column>
|
|
<el-table-column
|
|
prop="address"
|
|
min-width="150px"
|
|
:label="$t('equipment.VideoNVREncoding')"
|
|
align="center"
|
|
fixed="left"
|
|
>
|
|
</el-table-column>
|
|
<el-table-column
|
|
prop="address"
|
|
min-width="110px"
|
|
:label="$t('equipment.Manufacturer')"
|
|
align="center"
|
|
fixed="left"
|
|
>
|
|
</el-table-column>
|
|
<el-table-column
|
|
prop="address"
|
|
min-width="150px"
|
|
:label="$t('equipment.MainSystemNumber')"
|
|
align="center"
|
|
fixed="left"
|
|
>
|
|
</el-table-column>
|
|
<el-table-column
|
|
prop="address"
|
|
min-width="140px"
|
|
:label="$t('equipment.SubstationName')"
|
|
align="center"
|
|
>
|
|
</el-table-column>
|
|
<el-table-column
|
|
prop="address"
|
|
min-width="140px"
|
|
:label="$t('equipment.SubstationCode')"
|
|
align="center"
|
|
>
|
|
</el-table-column>
|
|
<el-table-column
|
|
prop="address"
|
|
min-width="140px"
|
|
:label="$t('equipment.areaName')"
|
|
align="center"
|
|
>
|
|
</el-table-column>
|
|
<el-table-column
|
|
prop="address"
|
|
min-width="110px"
|
|
:label="$t('equipment.DeviceType')"
|
|
align="center"
|
|
>
|
|
</el-table-column>
|
|
<el-table-column
|
|
prop="address"
|
|
min-width="130px"
|
|
:label="$t('equipment.EquipmentModel')"
|
|
align="center"
|
|
>
|
|
</el-table-column>
|
|
<el-table-column
|
|
prop="address"
|
|
min-width="110px"
|
|
:label="$t('equipment.UnitOfUse')"
|
|
align="center"
|
|
>
|
|
</el-table-column>
|
|
<el-table-column
|
|
prop="address"
|
|
min-width="140px"
|
|
:label="$t('equipment.EquipmentSource')"
|
|
align="center"
|
|
>
|
|
</el-table-column>
|
|
<el-table-column
|
|
prop="address"
|
|
min-width="150px"
|
|
:label="$t('equipment.dateOfManufacture')"
|
|
align="center"
|
|
>
|
|
</el-table-column>
|
|
<el-table-column
|
|
prop="address"
|
|
min-width="130px"
|
|
:label="$t('equipment.factoryNumber')"
|
|
align="center"
|
|
>
|
|
</el-table-column>
|
|
<el-table-column
|
|
prop="address"
|
|
min-width="150px"
|
|
:label="$t('equipment.IsItARotatingWheel')"
|
|
align="center"
|
|
>
|
|
</el-table-column>
|
|
<el-table-column
|
|
prop="address"
|
|
min-width="100px"
|
|
:label="$t('equipment.UseType')"
|
|
align="center"
|
|
>
|
|
</el-table-column>
|
|
<el-table-column
|
|
prop="address"
|
|
min-width="100px"
|
|
:label="$t('equipment.VideoType')"
|
|
align="center"
|
|
>
|
|
</el-table-column>
|
|
<el-table-column
|
|
prop="address"
|
|
min-width="150px"
|
|
:label="$t('equipment.InstallationPosition')"
|
|
align="center"
|
|
>
|
|
</el-table-column>
|
|
<el-table-column
|
|
prop="address"
|
|
min-width="130px"
|
|
:label="$t('equipment.BelongingRobot')"
|
|
align="center"
|
|
>
|
|
</el-table-column>
|
|
<el-table-column
|
|
prop="address"
|
|
min-width="100px"
|
|
:label="$t('equipment.ipAddress')"
|
|
align="center"
|
|
>
|
|
</el-table-column>
|
|
<el-table-column
|
|
prop="address"
|
|
min-width="100px"
|
|
:label="$t('equipment.port')"
|
|
align="center"
|
|
>
|
|
</el-table-column>
|
|
<el-table-column
|
|
prop="address"
|
|
:label="$t('equipment.user')"
|
|
align="center"
|
|
>
|
|
</el-table-column>
|
|
<el-table-column
|
|
prop="address"
|
|
min-width="100px"
|
|
:label="$t('equipment.password')"
|
|
align="center"
|
|
>
|
|
</el-table-column>
|
|
</el-table>
|
|
|
|
<span slot="footer" class="dialog-footer">
|
|
<el-button @click="dialogVisible = false">取 消</el-button>
|
|
<el-button type="primary" @click="dialogVisible = false"
|
|
>确 定</el-button
|
|
>
|
|
</span>
|
|
</el-dialog>
|
|
<!-- 机器人点位上传 -->
|
|
<el-dialog
|
|
:title="$t('site_management.upload')"
|
|
:visible.sync="upload.open"
|
|
width="30%"
|
|
:before-close="handleClose"
|
|
>
|
|
<div style="width: 100%; text-align: center">
|
|
<el-upload
|
|
ref="uploadRef"
|
|
:limit="1"
|
|
accept=".xlsx, .xls, .txt, .xml"
|
|
:headers="upload.headers"
|
|
:action="upload.url + '?updateSupport=' + upload.updateSupport"
|
|
:disabled="upload.isUploading"
|
|
:on-progress="handleFileUploadProgress"
|
|
:on-success="handleFileSuccess"
|
|
:auto-upload="false"
|
|
drag
|
|
>
|
|
<el-icon class="el-icon--upload"><upload-filled /></el-icon>
|
|
<div class="el-upload__text">
|
|
{{ $t("site_management.uploadMsg") }}
|
|
</div>
|
|
<template #tip>
|
|
<div class="el-upload__tip text-center">
|
|
<!-- <span>仅允许导入xls、xlsx、xml、txt格式文件。</span> -->
|
|
<!-- <el-link type="primary" :underline="false" style="font-size: 12px; vertical-align: baseline"
|
|
@click="importTemplate">下载模板</el-link> -->
|
|
</div>
|
|
</template>
|
|
</el-upload>
|
|
</div>
|
|
<span slot="footer" class="dialog-footer">
|
|
<el-button @click="upload.open = false">{{
|
|
$t("share.cancel")
|
|
}}</el-button>
|
|
<el-button type="primary" @click="submitFileForm">{{
|
|
$t("share.confirm")
|
|
}}</el-button>
|
|
</span>
|
|
</el-dialog>
|
|
</div>
|
|
</template>
|
|
|
|
<script >
|
|
import videoPlayer from "@/components/videoPlayer/index.vue";
|
|
import { getToken } from "@/utils/auth";
|
|
import {
|
|
getTreeAreaDeviceSelect,
|
|
getMonitor,
|
|
getPatroltypeList,
|
|
pointImptLevel,
|
|
postAdd,
|
|
edit,
|
|
editItem,
|
|
postRemove,
|
|
} from "@/api/point/site_management";
|
|
|
|
export default {
|
|
name: "SiteManagement",
|
|
components: {
|
|
videoPlayer,
|
|
},
|
|
data() {
|
|
return {
|
|
treeData: [],
|
|
defaultProps: {
|
|
children: "children",
|
|
label: function (data) {
|
|
return data.areaName || data.deviceName;
|
|
},
|
|
},
|
|
tableData: [],
|
|
activeName: "first",
|
|
monitorPointDialogVisible: false,
|
|
monitorPointForm: {},
|
|
rules: {
|
|
patrolpointName: [
|
|
{
|
|
required: true,
|
|
message:
|
|
this.$t("share.PleaseEnter") +
|
|
this.$t("site_management.MonitoringPointName"),
|
|
trigger: "blur",
|
|
},
|
|
],
|
|
patrolpointCode: [
|
|
{
|
|
required: true,
|
|
message:
|
|
this.$t("share.PleaseEnter") +
|
|
this.$t("site_management.MonitoringPointNumber"),
|
|
trigger: "blur",
|
|
},
|
|
],
|
|
patrolContent: [
|
|
{
|
|
required: true,
|
|
message:
|
|
this.$t("share.PleaseEnter") +
|
|
this.$t("site_management.MonitoringContent"),
|
|
trigger: "blur",
|
|
},
|
|
],
|
|
patrolTypeId: [
|
|
{
|
|
required: true,
|
|
message:
|
|
this.$t("share.PleaseEnter") +
|
|
this.$t("site_management.InspectionType"),
|
|
trigger: "blur",
|
|
},
|
|
],
|
|
pointImptLevel: [
|
|
{
|
|
required: true,
|
|
message:
|
|
this.$t("share.PleaseEnter") +
|
|
this.$t("site_management.ImportantLevel"),
|
|
trigger: "blur",
|
|
},
|
|
],
|
|
},
|
|
monitorPointTitle: "添加监控点位",
|
|
bindingMonitorPointTitle: "绑定可见光监控点",
|
|
bindingMonitorPointDialogVisible: false,
|
|
bindingMonitorPointTableData: [],
|
|
InspectionDialogVisible: false,
|
|
queryParams: {},
|
|
InspectionTableData: [
|
|
{
|
|
date: "2016-05-02",
|
|
name: "王小虎",
|
|
address: "上海市普陀区金沙江路 1518 弄",
|
|
},
|
|
{
|
|
date: "2016-05-04",
|
|
name: "王小虎",
|
|
address: "上海市普陀区金沙江路 1517 弄",
|
|
},
|
|
{
|
|
date: "2016-05-01",
|
|
name: "王小虎",
|
|
address: "上海市普陀区金沙江路 1519 弄",
|
|
},
|
|
{
|
|
date: "2016-05-03",
|
|
name: "王小虎",
|
|
address: "上海市普陀区金沙江路 1516 弄",
|
|
},
|
|
],
|
|
upload: {
|
|
// 是否显示弹出层（用户导入）
|
|
open: false,
|
|
// 弹出层标题（用户导入）
|
|
title: "",
|
|
// 是否禁用上传
|
|
isUploading: false,
|
|
// 是否更新已经存在的用户数据
|
|
updateSupport: 0,
|
|
// 设置上传的请求头部
|
|
headers: { Authorization: "Bearer " + getToken() },
|
|
// 上传的地址
|
|
// url: import.meta.env.VITE_APP_BASE_API + "/zhxx/device/import",
|
|
},
|
|
InspectionTypeData: [],
|
|
pointImptLevelData: [
|
|
{
|
|
value: "I",
|
|
label: "I类",
|
|
},
|
|
{
|
|
value: "II",
|
|
label: "II类",
|
|
},
|
|
{
|
|
value: "III",
|
|
label: "III类",
|
|
},
|
|
],
|
|
input3: null,
|
|
value: null,
|
|
deviceIdShow: true,
|
|
TreeItem: {},
|
|
type: 0,
|
|
RightBtnShow: true,
|
|
};
|
|
},
|
|
mounted() {
|
|
getTreeAreaDeviceSelect().then((res) => {
|
|
if (res.code == 200) {
|
|
this.treeData = res.data;
|
|
}
|
|
}),
|
|
getPatroltypeList().then((res) => {
|
|
if (res.code == 200) {
|
|
this.InspectionTypeData = res.rows;
|
|
}
|
|
});
|
|
pointImptLevel().then((res) => {
|
|
this.pointImptLevelData = res.data;
|
|
});
|
|
},
|
|
methods: {
|
|
// 给表头加必填符号*
|
|
addRedStar(h, { column }) {
|
|
return [
|
|
h("span", { style: "color: red" }, "*"),
|
|
h("span", " " + column.label),
|
|
];
|
|
},
|
|
handleNodeClick(data, e) {
|
|
this.TreeItem = data;
|
|
this.RightBtnShow = true;
|
|
this.monitorPointForm.areaId = data.areaId;
|
|
this.monitorPointForm.deviceId = data.deviceId;
|
|
if (data.deviceId) {
|
|
this.deviceIdShow = false;
|
|
} else {
|
|
this.deviceIdShow = true;
|
|
}
|
|
let obj = {
|
|
areaId: data.areaId,
|
|
};
|
|
if (data.deviceId) {
|
|
obj.deviceId = data.deviceId;
|
|
}
|
|
getMonitor(obj).then((res) => {
|
|
if (res.code == 200) {
|
|
this.tableData = res.rows;
|
|
this.tableData.forEach((item) => {
|
|
let id = item.algSubtypeIds.split(",");
|
|
item.patrolTypeId = id.map(Number);
|
|
});
|
|
}
|
|
});
|
|
},
|
|
|
|
changeCurrentRow(row) {
|
|
this.currentRowId = row.id; // 更新当前点击的行ID
|
|
this.RightBtnShow=false
|
|
this.rowStyle(row);
|
|
},
|
|
// 更改选中行背景色
|
|
rowStyle(row) {
|
|
console.log(row, 1111111111);
|
|
if (this.name === row.name) {
|
|
return { "background-color": "#F7EDED", cursor: "pointer" };
|
|
}
|
|
return { cursor: "pointer" };
|
|
},
|
|
tabsClick() {},
|
|
add() {
|
|
this.type = 0;
|
|
this.monitorPointDialogVisible = true;
|
|
this.monitorPointTitle = this.$t("site_management.AddMonitoringPoints");
|
|
},
|
|
monitorPointHandleClose() {
|
|
this.monitorPointDialogVisible = false;
|
|
},
|
|
monitorPointEdit(data) {
|
|
this.type = 1;
|
|
this.monitorPointDialogVisible = true;
|
|
this.monitorPointTitle = this.$t(
|
|
"site_management.ModifyMonitoringPoints"
|
|
);
|
|
this.monitorPointForm = data;
|
|
// this.tableData.forEach((item) => {
|
|
// if (item.patrolpointId == data.patrolpointId) {
|
|
// // console.log(item, 11111111111111);
|
|
// editItem(item.patrolpointId).then((res) => {
|
|
// console.log(res, 111111111);
|
|
// });
|
|
// }
|
|
// });
|
|
},
|
|
// 关闭绑定可见光监测点弹窗
|
|
bindingMonitorPointClose() {
|
|
this.bindingMonitorPointDialogVisible = false;
|
|
},
|
|
bindingMonitorBtn(type) {
|
|
if (type == 0) {
|
|
this.bindingMonitorPointTitle = this.$t(
|
|
"site_management.BindVisibleLightMonitoringPoints"
|
|
);
|
|
} else {
|
|
this.bindingMonitorPointTitle = this.$t(
|
|
"site_management.BindThermalImagingMonitoringPoints"
|
|
);
|
|
}
|
|
|
|
this.bindingMonitorPointDialogVisible = true;
|
|
},
|
|
clickFun() {},
|
|
renderHeader(h, { column, $index }, type) {
|
|
let that = this;
|
|
return h("div", [
|
|
// 列名称
|
|
h("span", column.label),
|
|
// 按钮
|
|
h(
|
|
"el-button",
|
|
{
|
|
props: {
|
|
type: "text",
|
|
size: "small",
|
|
},
|
|
style: "margin-left: 5px;",
|
|
on: {
|
|
click: function () {
|
|
that.clickButton(type);
|
|
},
|
|
},
|
|
},
|
|
this.$t("share.addTo")
|
|
),
|
|
]);
|
|
},
|
|
clickButton(type) {
|
|
console.log("我点击了" + type + "的列");
|
|
},
|
|
InspectionHandleClose() {
|
|
this.InspectionDialogVisible = false;
|
|
},
|
|
InspectionBtn() {
|
|
this.InspectionDialogVisible = true;
|
|
},
|
|
InspectionChangeCurrentRow(row) {
|
|
this.currentRowId = row.id; // 更新当前点击的行ID
|
|
this.rowStyle(row);
|
|
},
|
|
/**文件上传中处理 */
|
|
handleFileUploadProgress(event, file, fileList) {
|
|
upload.isUploading = true;
|
|
},
|
|
/** 文件上传成功处理 */
|
|
handleFileSuccess(response, file, fileList) {
|
|
upload.open = false;
|
|
upload.isUploading = false;
|
|
proxy.$refs["uploadRef"].handleRemove(file);
|
|
proxy.$alert(
|
|
"<div style='overflow: auto;overflow-x: hidden;max-height: 70vh;padding: 10px 20px 0;'>" +
|
|
response.msg +
|
|
"</div>",
|
|
"导入结果",
|
|
{ dangerouslyUseHTMLString: true }
|
|
);
|
|
// getList();
|
|
},
|
|
/** 提交上传文件 */
|
|
submitFileForm() {
|
|
proxy.$refs["uploadRef"].submit();
|
|
},
|
|
upDataBtn() {
|
|
console.log(111);
|
|
this.upload.open = true;
|
|
},
|
|
handleClose() {},
|
|
// 新增点位
|
|
submitForm() {
|
|
this.$refs["ruleForm"].validate((valid) => {
|
|
if (valid) {
|
|
this.monitorPointForm.patrolTypeId =
|
|
this.monitorPointForm.patrolTypeId.toString();
|
|
if (this.type == 0) {
|
|
postAdd(this.monitorPointForm).then((res) => {
|
|
if (res.code == 200) {
|
|
this.$message({
|
|
type: "success",
|
|
message: "添加成功!",
|
|
});
|
|
this.monitorPointDialogVisible = false;
|
|
this.handleNodeClick(this.TreeItem);
|
|
}
|
|
});
|
|
} else {
|
|
edit(this.monitorPointForm).then((res) => {
|
|
if (res.code == 200) {
|
|
this.$message({
|
|
type: "success",
|
|
message: "修改成功!",
|
|
});
|
|
this.monitorPointDialogVisible = false;
|
|
this.handleNodeClick(this.TreeItem);
|
|
}
|
|
});
|
|
}
|
|
}
|
|
});
|
|
},
|
|
// 删除
|
|
handleDelete(id) {
|
|
postRemove(id).then((res) => {
|
|
if (res.code == 200) {
|
|
this.$message({
|
|
type: "success",
|
|
message: "删除成功!",
|
|
});
|
|
this.handleNodeClick(this.TreeItem);
|
|
}
|
|
});
|
|
},
|
|
},
|
|
};
|
|
</script>
|
|
|
|
<style lang="scss" scoped>
|
|
.qurey {
|
|
margin-bottom: 10px;
|
|
::v-deep.el-button {
|
|
background-color: #46a6ff !important;
|
|
color: #fff !important ;
|
|
}
|
|
}
|
|
.tableOperate {
|
|
margin-top: 10px;
|
|
margin-bottom: 10px;
|
|
display: flex;
|
|
justify-content: space-between;
|
|
.tableSearch {
|
|
::v-deep.el-button {
|
|
background-color: #46a6ff !important;
|
|
color: #fff !important ;
|
|
}
|
|
}
|
|
}
|
|
.tableXYZ {
|
|
display: flex;
|
|
}
|
|
.cameraImgDiv {
|
|
text-align: center;
|
|
}
|
|
.cameraImg {
|
|
width: 30%;
|
|
margin-bottom: 10px;
|
|
}
|
|
.tabsBtn {
|
|
text-align: center;
|
|
}
|
|
.bindingMonitorPointTree {
|
|
width: 100%;
|
|
height: 37vh;
|
|
overflow-y: scroll;
|
|
}
|
|
.bindingMonitorPointDiv {
|
|
width: 100%;
|
|
height: 40vh;
|
|
// background: red;
|
|
}
|
|
.PTZ-content {
|
|
width: 170px;
|
|
margin: 10px auto;
|
|
position: relative;
|
|
img {
|
|
width: 100%;
|
|
}
|
|
}
|
|
.r-ti2-pos {
|
|
position: absolute;
|
|
top: 0;
|
|
left: 0;
|
|
width: 100%;
|
|
height: 100%;
|
|
div {
|
|
position: absolute;
|
|
z-index: 999;
|
|
width: 20px;
|
|
height: 15px;
|
|
cursor: pointer;
|
|
}
|
|
div:first-child {
|
|
top: 32px;
|
|
left: 75px;
|
|
}
|
|
div:nth-child(2) {
|
|
top: 50px;
|
|
left: 102px;
|
|
}
|
|
div:nth-child(3) {
|
|
top: 77px;
|
|
right: 30px;
|
|
}
|
|
div:nth-child(4) {
|
|
bottom: 56px;
|
|
left: 102px;
|
|
}
|
|
div:nth-child(5) {
|
|
bottom: 36px;
|
|
left: 75px;
|
|
}
|
|
div:nth-child(6) {
|
|
bottom: 56px;
|
|
right: 100px;
|
|
}
|
|
div:nth-child(7) {
|
|
bottom: 80px;
|
|
left: 30px;
|
|
}
|
|
div:nth-child(8) {
|
|
top: 50px;
|
|
right: 102px;
|
|
}
|
|
}
|
|
.r-ti3 {
|
|
width: 100%;
|
|
display: flex;
|
|
padding-top: 10px;
|
|
-webkit-box-pack: justify;
|
|
justify-content: space-between;
|
|
}
|
|
.r-ti3-d1 {
|
|
width: 76px;
|
|
position: relative;
|
|
img {
|
|
width: 100%;
|
|
}
|
|
.r-ti3-d2 {
|
|
position: absolute;
|
|
top: 0;
|
|
left: 0;
|
|
width: 100%;
|
|
height: 100%;
|
|
div:first-child {
|
|
width: 50%;
|
|
height: 100%;
|
|
position: absolute;
|
|
top: 0;
|
|
left: 0;
|
|
cursor: pointer;
|
|
}
|
|
div:nth-child(2) {
|
|
width: 50%;
|
|
height: 100%;
|
|
position: absolute;
|
|
top: 0;
|
|
right: 0;
|
|
cursor: pointer;
|
|
}
|
|
}
|
|
}
|
|
.r-ti4 {
|
|
padding-top: 20px;
|
|
img {
|
|
width: 24px;
|
|
height: 24px;
|
|
position: relative;
|
|
top: 6px;
|
|
cursor: pointer;
|
|
}
|
|
}
|
|
.intelligenceType {
|
|
cursor: pointer;
|
|
color: #409eff;
|
|
}
|
|
</style>
|