Commit e975f1a4 by 李君

优化

1 parent becc7ff0
<template> <template>
<el-dialog :title="$t('dialog.mapCoordinateTitle')" class="manage-dialog xy-dialog" :visible.sync="xyEditVisible" :show-close="false" <el-dialog :title="$t('dialog.mapCoordinateTitle')" class="manage-dialog xy-dialog" :visible.sync="xyEditVisible" :show-close="false"
@close="dialogClose"> @close="dialogClose">
<span style="margin-right: 15px;">{{$t('table.deviceNum')}}</span><el-select @change="channelChange" v-model="channelVal"> <!-- <span style="margin-right: 15px;">{{$t('table.deviceNum')}}</span><el-select @change="channelChange" v-model="channelVal">
<el-option v-for="item in channelList" :key="item.id" :label="item.serialnum" :value="item.serialnum" /> <el-option v-for="item in channelList" :key="item.id" :label="item.serialnum" :value="item.serialnum" />
</el-select> </el-select> -->
<div class="xy-content"> <div class="xy-content">
<div class="xy-container1"> <el-row :gutter="20" style="margin-bottom: 15px;">
<canvas id="editXycanvas1" class="xycanvas" @click="getEditXyAxis1"></canvas> <el-col :span="8">
<img :src="editChannelImg" class="editChannelImg" id="editChannelImg" style="width: 640px;height: 360px;" @click="getEditXyAxis1" /> <el-table ref="singleTable" @row-click="setCurrent" :data="channelList" height="360" :highlight-current-row='true' style="width: 100%;" header-row-class-name="manage-tab-head">
</div> <el-table-column :label="$t('table.order')" align="center" type="index" width="80"></el-table-column>
<el-table-column :label="$t('table.deviceNum')" align="center" prop="serialnum"></el-table-column>
<el-table-column label="ip" align="center" prop="localIp"></el-table-column>
</el-table>
</el-col>
<el-col :span="16">
<div class="xy-container1">
<canvas id="editXycanvas1" class="xycanvas" @click="getEditXyAxis1"></canvas>
<img :src="editChannelImg" class="editChannelImg" id="editChannelImg" style="width: 640px;height: 360px;" @click="getEditXyAxis1" />
</div>
</el-col>
</el-row>
<!-- <el-button type="primary" @click='scaleFun(1)'>放大</el-button>
<el-button type="primary" @click='scaleFun(2)'>缩小</el-button> -->
<div class="xy-container"> <div class="xy-container">
<canvas id="editXycanvas" class="xycanvas" @click="getEditXyAxis"></canvas> <canvas id="editXycanvas" class="xycanvas" @click="getEditXyAxis"></canvas>
<img :src="editFloorImg" class="editFloorImg" id="editFloorImg" @click="getEditXyAxis" /> <img :src="editFloorImg" class="editFloorImg" style="height: 300px;" id="editFloorImg" @click="getEditXyAxis" />
</div> </div>
</div> </div>
<div slot="footer" class="dialog-footer"> <div slot="footer" class="dialog-footer">
...@@ -65,10 +78,21 @@ ...@@ -65,10 +78,21 @@
type: 4 type: 4
}, },
step: 1, // 步骤 1 画相机截图中心点 2 画相机边缘点 3 画相机和楼层图多个点 step: 1, // 步骤 1 画相机截图中心点 2 画相机边缘点 3 画相机和楼层图多个点
radix: 0 radix: 0,
scaleVal:1
} }
}, },
methods: { methods: {
scaleFun(val){
if(val==1){
this.scaleVal=this.scaleVal+0.5
}else{
this.scaleVal=this.scaleVal-0.5
}
let dom = document.getElementById('editFloorImg')
dom.style.transform='scale('+this.scaleVal+')'
this.drawFun()
},
dialogInit(pic, channelList) { dialogInit(pic, channelList) {
this.channelList = channelList this.channelList = channelList
this.channelVal = channelList[0].id this.channelVal = channelList[0].id
...@@ -105,6 +129,11 @@ ...@@ -105,6 +129,11 @@
this.commonInit(this.editChannelImg, 'editChannelImg', '.xy-container1', 'channel', 'editXycanvas1') this.commonInit(this.editChannelImg, 'editChannelImg', '.xy-container1', 'channel', 'editXycanvas1')
}, },
// 获取相机截图 // 获取相机截图
setCurrent(row){
this.editForm = {...row}
this.editChannelImg = `${row.picUrl}`
this.drawFun()
},
channelChange(val) { channelChange(val) {
this.channelList.forEach(item => { this.channelList.forEach(item => {
if (item.id == val) { if (item.id == val) {
...@@ -137,8 +166,8 @@ ...@@ -137,8 +166,8 @@
height = parseInt(_xy * _height / _width) height = parseInt(_xy * _height / _width)
this.radix = (_width / _xy).toFixed(0) this.radix = (_width / _xy).toFixed(0)
} else if (_width < _xy) { } else if (_width < _xy) {
width = _width width = _width * this.scaleVal
height = _height height = _height * this.scaleVal
this.radix = 1 this.radix = 1
} }
} }
...@@ -467,10 +496,11 @@ ...@@ -467,10 +496,11 @@
.xy-container { .xy-container {
width: 100%; width: 100%;
height: 300px;
/* text-align: center; */ /* text-align: center; */
position: relative; position: relative;
overflow-x: auto; overflow-x: auto;
overflow-y: hidden; overflow-y: auto;
} }
.xy-container1 { .xy-container1 {
......
...@@ -12,10 +12,10 @@ ...@@ -12,10 +12,10 @@
<el-input v-model="addForm.code" :placeholder="$t('pholder.input')"></el-input> <el-input v-model="addForm.code" :placeholder="$t('pholder.input')"></el-input>
<i class="error-tip">*</i> <i class="error-tip">*</i>
</el-form-item> </el-form-item>
<el-form-item :label="$t('dialog.deviceNum')" prop="deviceSerialNum"> <!-- <el-form-item :label="$t('dialog.deviceNum')" prop="deviceSerialNum">
<el-input v-model="addForm.deviceSerialNum" :placeholder="$t('pholder.input')"></el-input> <el-input v-model="addForm.deviceSerialNum" :placeholder="$t('pholder.input')"></el-input>
<i class="error-tip">*</i> <i class="error-tip">*</i>
</el-form-item> </el-form-item> -->
<el-form-item :label="$t('table.counterType')" prop="counterType"> <el-form-item :label="$t('table.counterType')" prop="counterType">
<el-select v-model="addForm.counterType" :placeholder="$t('pholder.select')"> <el-select v-model="addForm.counterType" :placeholder="$t('pholder.select')">
<el-option v-for="item in counterTypeData" :key="item.key" :label="item.value" :value="item.key" /> <el-option v-for="item in counterTypeData" :key="item.key" :label="item.value" :value="item.key" />
...@@ -197,7 +197,7 @@ export default { ...@@ -197,7 +197,7 @@ export default {
<style scoped lang="less"> <style scoped lang="less">
.dialog_lj{ .dialog_lj{
/deep/.el-dialog__body{ /deep/.el-dialog__body{
height: 320px; height: 300px;
} }
/deep/.el-form-item__label{ /deep/.el-form-item__label{
line-height: 30px; line-height: 30px;
......
...@@ -20,7 +20,7 @@ ...@@ -20,7 +20,7 @@
<div class="aiot_alone_long"> <div class="aiot_alone_long">
<div class="aiot_left"> <div class="aiot_left">
<div style="margin:0 0 10px 10px"> <div style="margin:0 0 10px 10px">
<el-button type="primary" size="mini" class="search-btn" @click="addDesk">{{$t('button.groupAdd')}}</el-button> <el-button type="primary" size="mini" @click="addDesk">{{$t('button.groupAdd')}}</el-button>
</div> </div>
<el-row class="manage-content"> <el-row class="manage-content">
<el-col :span="24" class="treeMenu boxShadow"> <el-col :span="24" class="treeMenu boxShadow">
...@@ -79,8 +79,8 @@ ...@@ -79,8 +79,8 @@
<div class="dwrap"> <div class="dwrap">
<img class="dimg" :src="item.picUrl" :style="{ maxHeight: tableHeight-60 + 'px' }" /> <img class="dimg" :src="item.picUrl" :style="{ maxHeight: tableHeight-60 + 'px' }" />
<div class="label-box"> <div class="label-box">
<p>{{ $t('table.laneName') + ': ' + item.name }}</p> <!-- <p>{{ $t('table.laneName') + ': ' + item.name }}</p> -->
<p>{{ $t('table.deviceNum') + ': ' + item.serialnum }}</p> <p style="background-color: #FAFAFA;padding: 3px 10px;">{{ $t('table.deviceNum') + ': ' + item.localIp + '—' + item.serialnum }}</p>
</div> </div>
<div class="pview"> <div class="pview">
<Painter :cdata="item" :isEdit="true" :desk="currentRow" :list="tableData" @gclick="groupClick" @start="startDesk" @finish="finishDesk"></Painter> <Painter :cdata="item" :isEdit="true" :desk="currentRow" :list="tableData" @gclick="groupClick" @start="startDesk" @finish="finishDesk"></Painter>
......
Markdown is supported
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!