Skip to content

G
gassafety
Commit 565013a7 authored by 王晓倩's avatar 王晓倩
Browse files
Options

设备信息详情、管道详情

parent ee8f7bd4
Hide whitespace changes
Inline Side-by-side
Showing with 390 additions and 193 deletions
gassafety-system/src/main/java/com/zehong/system/domain/TDeviceInfo.java
View file @ 565013a7
...@@ -74,13 +74,13 @@ public class TDeviceInfo extends BaseEntity ...@@ -74,13 +74,13 @@ public class TDeviceInfo extends BaseEntity
private String phone; private String phone;
/** 安装时间 */ /** 安装时间 */
@JsonFormat(pattern = "yyyy-MM-dd HH:mm:ss") @JsonFormat(pattern = "yyyy-MM-dd")
@Excel(name = "安装时间", width = 30, dateFormat = "yyyy-MM-dd HH:mm:ss") @Excel(name = "安装时间", width = 30, dateFormat = "yyyy-MM-dd")
private Date installationTime; private Date installationTime;
/** 最后巡检时间 */ /** 最后巡检时间 */
@JsonFormat(pattern = "yyyy-MM-dd HH:mm:ss") @JsonFormat(pattern = "yyyy-MM-dd")
@Excel(name = "最后巡检时间", width = 30, dateFormat = "yyyy-MM-dd HH:mm:ss") @Excel(name = "最后巡检时间", width = 30, dateFormat = "yyyy-MM-dd")
private Date inspectionTime; private Date inspectionTime;
/** 是否删除 */ /** 是否删除 */
......
gassafety-system/src/main/java/com/zehong/system/domain/TPipe.java
View file @ 565013a7
...@@ -57,13 +57,13 @@ public class TPipe extends BaseEntity ...@@ -57,13 +57,13 @@ public class TPipe extends BaseEntity
private String iconUrl; private String iconUrl;
/** 安装时间 */ /** 安装时间 */
@JsonFormat(pattern = "yyyy-MM-dd HH:mm:ss") @JsonFormat(pattern = "yyyy-MM-dd")
@Excel(name = "安装时间", width = 30, dateFormat = "yyyy-MM-dd HH:mm:ss") @Excel(name = "安装时间", width = 30, dateFormat = "yyyy-MM-dd")
private Date installationTime; private Date installationTime;
/** 最后巡检时间 */ /** 最后巡检时间 */
@JsonFormat(pattern = "yyyy-MM-dd HH:mm:ss") @JsonFormat(pattern = "yyyy-MM-dd")
@Excel(name = "最后巡检时间", width = 30, dateFormat = "yyyy-MM-dd HH:mm:ss") @Excel(name = "最后巡检时间", width = 30, dateFormat = "yyyy-MM-dd")
private Date inspectionTime; private Date inspectionTime;
/** 是否删除 */ /** 是否删除 */
......
gassafety-web/src/views/device/deviceInfo/index.vue
View file @ 565013a7
...@@ -88,16 +88,16 @@ ...@@ -88,16 +88,16 @@
<el-table-column label="设备编号" align="center" prop="deviceCode" /> <el-table-column label="设备编号" align="center" prop="deviceCode" />
<el-table-column label="设备类型" align="center" prop="deviceType"> <el-table-column label="设备类型" align="center" prop="deviceType">
<template slot-scope="scope"> <template slot-scope="scope">
<span v-if="scope.row.deviceType == 1">调压箱</span> <span v-if="scope.row.deviceType == 1">调压阀</span>
<span v-if="scope.row.deviceType == 2">阀门井</span> <span v-if="scope.row.deviceType == 2">阀门井</span>
<span v-if="scope.row.deviceType == 3">流量计</span> <span v-if="scope.row.deviceType == 3">流量计</span>
<span v-if="scope.row.deviceType == 4">智能燃气表</span> <span v-if="scope.row.deviceType == 4">压力表</span>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column label="设备型号" align="center" prop="deviceModel" /> <el-table-column label="设备型号" align="center" prop="deviceModel" />
<el-table-column label="所在地址" align="center" prop="deviceAddr" /> <el-table-column label="所在地址" align="center" prop="deviceAddr" />
<el-table-column label="安装时间" align="center" prop="installationTime" width="180" /> <el-table-column label="安装日期" align="center" prop="installationTime" width="180" />
<el-table-column label="最后巡检时间" align="center" prop="inspectionTime" width="180" /> <el-table-column label="最后巡检日期" align="center" prop="inspectionTime" width="180" />
<el-table-column label="操作" align="center" class-name="small-padding fixed-width"> <el-table-column label="操作" align="center" class-name="small-padding fixed-width">
<template slot-scope="scope"> <template slot-scope="scope">
<el-button <el-button
...@@ -133,88 +133,150 @@ ...@@ -133,88 +133,150 @@
/> />
<!-- 添加或修改设备信息对话框 --> <!-- 添加或修改设备信息对话框 -->
<el-dialog :title="title" :visible.sync="open" width="800px" append-to-body> <el-dialog :title="title" :visible.sync="open" append-to-body @close="cancel">
<el-form ref="form" :model="form" :rules="rules" label-width="135px"> <el-form ref="form" :model="form" :rules="rules" label-width="135px">
<el-form-item label="所属管道" prop="pipeId"> <el-col :span="11">
<el-select v-model="form.pipeId" placeholder="请选择所属管道" clearable size="small" style="width: 600px"> <el-form-item label="所属管道" prop="pipeId">
<el-option <el-select v-model="form.pipeId" placeholder="请选择所属管道" style="width: 100%" >
v-for="item in options" <el-option
:key="item.pipeId" v-for="item in options"
:label="item.pipeName" :key="item.pipeId"
:value="item.pipeId" :label="item.pipeName"
></el-option> :value="item.pipeId"
</el-select> >
</el-form-item> </el-option>
<el-form-item label="设备类型"> </el-select>
<el-select v-model="form.deviceType" placeholder="请选择设备类型" style="width: 600px"> </el-form-item>
<el-option </el-col>
v-for="dict in typeOptions"
:key="dict.dictValue" <el-col :span="12">
:label="dict.dictLabel" <el-form-item label="设备编号" prop="deviceCode">
:value="dict.dictValue" <el-input v-model="form.deviceCode" placeholder="请输入设备编号" />
></el-option> </el-form-item>
</el-select> </el-col>
</el-form-item>
<el-form-item label="设备名称" prop="deviceName"> <el-col :span="11">
<el-input v-model="form.deviceName" placeholder="请输入设备名称" style="width: 600px" /> <el-form-item label="设备类型" prop="deviceType">
</el-form-item> <el-select v-model="form.deviceType" placeholder="请选择设备类型" style="width: 100%" >
<el-form-item label="设备编号" prop="deviceCode"> <el-option
<el-input v-model="form.deviceCode" placeholder="请输入设备编号" style="width: 600px" /> v-for="dict in typeOptions"
</el-form-item> :key="dict.dictValue"
<el-form-item label="设备型号" prop="deviceModel"> :label="dict.dictLabel"
<el-input v-model="form.deviceModel" placeholder="请输入设备型号" style="width: 600px" /> :value="dict.dictValue"
</el-form-item> ></el-option>
<el-form-item label="物联网编号" prop="iotNo"> </el-select>
<el-input v-model="form.iotNo" placeholder="请输入物联网编号" /> </el-form-item>
</el-form-item> </el-col>
<el-form-item label="所在地址" prop="deviceAddr">
<el-input v-model="form.deviceAddr" placeholder="请输入所在地址" style="width: 600px" /> <el-col :span="12">
</el-form-item> <el-form-item label="设备名称" prop="deviceName">
<el-form-item label="经纬度" > <el-input
<el-row> v-model="form.deviceName"
<el-col :span="8"> placeholder="请输入设备名称"
<el-input v-model.number="form.longitude" placeholder="请输入经度" /> />
</el-col> </el-form-item>
<el-col :span="8"> </el-col>
<el-input v-model.number="form.latitude" placeholder="请输入纬度"/>
</el-col> <el-col :span="11">
<el-col :span="5"> <el-form-item label="设备型号" prop="deviceModel">
<el-button type="primary" plain @click="MapdialogFun">选择经纬度</el-button> <el-input
v-model="form.deviceModel"
placeholder="请输入设备型号"
/>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="物联网编号" prop="iotNo">
<el-input v-model="form.iotNo" placeholder="请输入物联网编号" />
</el-form-item>
</el-col>
<el-col :span="23">
<el-form-item label="所在地址" prop="deviceAddr">
<el-input v-model="form.deviceAddr" placeholder="请输入所在地址" />
</el-form-item>
</el-col>
<el-col :span="23">
<el-form-item label="经纬度坐标" prop="longitude">
<el-row>
<el-col :span="8">
<el-input v-model.number="form.longitude" placeholder="请输入经度" />
</el-col>
<el-col :span="8" style="margin-left: 10px">
<el-input v-model.number="form.latitude" placeholder="请输入纬度"/>
</el-col>
<el-col :span="5" style="margin-left: 10px">
<el-button type="primary" plain @click="MapdialogFun">选择经纬度</el-button>
</el-col>
</el-row>
</el-form-item>
</el-col>
<el-col :span="11">
<el-form-item label="联系人" prop="linkman">
<el-input v-model="form.linkman" placeholder="请输入联系人" />
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="联系电话" prop="phone">
<el-input
type="number"
maxlength="12"
v-model="form.phone"
placeholder="请输入联系电话"
/>
</el-form-item>
</el-col>
<el-col>
<el-form-item label="设备图片上传" prop="iconUrl">
<MyFileUpload
listType="picture-card"
@resFun="getFileInfo"
@remove="listRemove"
:fileArr="fileList"
/>
<el-input v-show="false" disabled v-model="form.iconUrl"></el-input>
</el-form-item>
</el-col>
<el-col>
<el-form-item label="安装日期" prop="installationTime">
<el-col :span="11">
<el-date-picker clearable size="small"
style="width: 100%"
v-model="form.installationTime"
type="date"
value-format="yyyy-MM-dd"
placeholder="请选择安装日期">
</el-date-picker>
</el-col> </el-col>
</el-row> </el-form-item>
</el-form-item> </el-col>
<el-form-item label="设备图片上传" prop="iconUrl">
<MyFileUpload <el-col :span="23">
listType="picture-card" <el-form-item label="备注信息" prop="remarks">
@resFun="getFileInfo" <el-input type="textarea" v-model="form.remarks" placeholder="请输入备注信息" />
@remove="listRemove" </el-form-item>
:fileArr="fileList" </el-col>
/>
</el-form-item>
<el-form-item label="联系人" prop="linkman">
<el-input v-model="form.linkman" placeholder="请输入联系人" />
</el-form-item>
<el-form-item label="电话" prop="phone">
<el-input v-model="form.phone" placeholder="请输入电话" />
</el-form-item>
<el-form-item label="安装时间" prop="installationTime">
<el-date-picker clearable size="small"
v-model="form.installationTime"
type="datetime"
value-format="yyyy-MM-dd HH:mm:ss"
placeholder="选择安装时间">
</el-date-picker>
</el-form-item>
<el-form-item label="备注" prop="remarks">
<el-input v-model="form.remarks" placeholder="请输入备注" />
</el-form-item>
</el-form> </el-form>
<div slot="footer" class="dialog-footer"> <div slot="footer" class="dialog-footer">
<el-button type="primary" @click="submitForm">确 定</el-button> <el-button type="primary" @click="submitForm">确 定</el-button>
<el-button @click="cancel">取 消</el-button> <el-button @click="cancel">取 消</el-button>
</div> </div>
</el-dialog> </el-dialog>
<!-- <Mapdialog v-if="loadmap" :dialogTableVisible="dialogTableVisible" @dialogcancelFun="dialogcancelFun" :slat="form.latitude" :slng="form.longitude" @confirm="qrFun" />-->
<Mapdialog
v-if="loadmap"
:dialogTableVisible="dialogTableVisible"
@dialogcancelFun="dialogcancelFun"
:slat="form.latitude"
:slng="form.longitude"
@confirmFun="confirmFun($event)"
></Mapdialog>
</div> </div>
</template> </template>
...@@ -222,12 +284,13 @@ ...@@ -222,12 +284,13 @@
import { listDeviceInfo, getDeviceInfo, addDeviceInfo, updateDeviceInfo, exportDeviceInfo } from "@/api/device/deviceInfo"; import { listDeviceInfo, getDeviceInfo, addDeviceInfo, updateDeviceInfo, exportDeviceInfo } from "@/api/device/deviceInfo";
import { pipeAllInfoList } from "@/api/device/pipe"; import { pipeAllInfoList } from "@/api/device/pipe";
import MyFileUpload from '@/components/MyFileUpload'; import MyFileUpload from '@/components/MyFileUpload';
// import Mapdialog from "@/components/maplnglat.vue"; import Mapdialog from "@/components/mapDialog/checkDeviceLoaction.vue";
export default { export default {
name: "DeviceInfo", name: "DeviceInfo",
components: { components: {
MyFileUpload, MyFileUpload,
Mapdialog
}, },
data() { data() {
return { return {
...@@ -284,6 +347,43 @@ export default { ...@@ -284,6 +347,43 @@ export default {
form: {}, form: {},
// 表单校验 // 表单校验
rules: { rules: {
pipeId: [
{ required: true, message: "请选择所属管道", trigger: "blur" },
],
deviceType: [
{ required: true, message: "请选择设备类型", trigger: "blur" },
],
deviceName: [
{ required: true, message: "请输入设备名称", trigger: "blur" },
],
deviceCode: [
{ required: true, message: "请输入设备编号", trigger: "blur" },
],
deviceModel: [
{ required: true, message: "请输入设备型号", trigger: "blur" },
],
deviceAddr: [
{ required: true, message: "请输入所在地址", trigger: "blur" },
],
longitude: [
{ required: true, message: "请输入经纬度", trigger: "blur" },
],
iotNo: [
{ required: true, message: "请输入物联网编号", trigger: "blur" },
],
/*linkman: [
{ required: true, message: "请输入联系人", trigger: "blur" }
],
phone: [
{ required: true, message: "请输入联系电话", trigger: "blur" },
{ min: 11, max: 11, message: "长度11个数字", trigger: "blur" },
],
iconUrl: [
{ required: true, message: "请上传图片", trigger: "change" }
],
installationTime: [
{ required: true, message: "请选择日期", trigger: "change" },
],*/
} }
}; };
}, },
...@@ -307,22 +407,22 @@ export default { ...@@ -307,22 +407,22 @@ export default {
this.form.iconUrl = res.url; this.form.iconUrl = res.url;
}, },
listRemove(e) { listRemove(e) {
this.form.url = ""; this.form.iconUrl = "";
this.fileList = []; this.fileList = [];
}, },
// qrFun(res) { confirmFun(res) {
// //确认选择经纬度 //确认选择经纬度
// this.form.longitude = res.lng; this.form.longitude = res.lng;
// this.form.latitude = res.lat; this.form.latitude = res.lat;
// }, },
// MapdialogFun() { MapdialogFun() {
// this.loadmap = true; this.loadmap = true;
// this.dialogTableVisible = true; this.dialogTableVisible = true;
// }, },
// dialogcancelFun() { dialogcancelFun() {
// this.loadmap = false; this.loadmap = false;
// this.dialogTableVisible = false; this.dialogTableVisible = false;
// }, },
// 取消按钮 // 取消按钮
cancel() { cancel() {
this.open = false; this.open = false;
...@@ -373,7 +473,7 @@ export default { ...@@ -373,7 +473,7 @@ export default {
pipeAllInfoList().then(response => { pipeAllInfoList().then(response => {
this.options = response.data; this.options = response.data;
this.open = true; this.open = true;
this.title = "添加设备信息"; this.title = "新增设备信息";
}); });
}, },
/** 修改按钮操作 */ /** 修改按钮操作 */
...@@ -385,14 +485,14 @@ export default { ...@@ -385,14 +485,14 @@ export default {
const deviceId = row.deviceId || this.ids const deviceId = row.deviceId || this.ids
getDeviceInfo(deviceId).then(response => { getDeviceInfo(deviceId).then(response => {
this.form = response.data; this.form = response.data;
if (this.form.iconUrl) {
this.fileList.push({
url: this.form.iconUrl,
});
}
this.open = true; this.open = true;
this.title = "修改设备信息"; this.title = "修改设备信息";
}); });
if (this.form.iconUrl) {
this.fileList.push({
url: this.form.iconUrl,
});
}
}, },
/** 提交按钮 */ /** 提交按钮 */
submitForm() { submitForm() {
...@@ -457,8 +557,15 @@ export default { ...@@ -457,8 +557,15 @@ export default {
}; };
</script> </script>
<style> <style>
.el-col { .notice {
margin-left: 0; background: white;
margin-right: 10px; position: fixed;
top: 102px;
right: 0;
left: 0;
margin: auto;
width: 80%;
height: 80%;
border: solid 1px;
} }
</style> </style>
gassafety-web/src/views/device/deviceInfoDetail/index.vue
View file @ 565013a7
...@@ -32,7 +32,7 @@ ...@@ -32,7 +32,7 @@
<el-form-item label="设备型号:" prop="deviceModel"> <el-form-item label="设备型号:" prop="deviceModel">
<font>{{form.deviceModel}}</font> <font>{{form.deviceModel}}</font>
</el-form-item> </el-form-item>
<el-form-item label="物联网编号:" prop="iotNo" v-if="form.iotNo != null || form.iotNo != ''"> <el-form-item label="物联网编号:" prop="iotNo">
<font>{{form.iotNo}}</font> <font>{{form.iotNo}}</font>
</el-form-item> </el-form-item>
<el-form-item label="联系人:" prop="linkman"> <el-form-item label="联系人:" prop="linkman">
...@@ -70,7 +70,7 @@ ...@@ -70,7 +70,7 @@
</el-form> </el-form>
</div> </div>
<div id="marbox" style="width: 700px;height: 400px;float: left;margin-top: -25px; border: 1px solid rgb(218, 213, 213);"> <div id="marbox" style="width: 700px;height: 390px;float: left;margin-top: -25px; border: 1px solid rgb(218, 213, 213);">
<div style="width: 100%;height: 100%" id="container"></div> <div style="width: 100%;height: 100%" id="container"></div>
</div> </div>
</div> </div>
...@@ -106,12 +106,9 @@ ...@@ -106,12 +106,9 @@
this.gaoMap = gaoMap; this.gaoMap = gaoMap;
}, },
methods: { methods: {
/** 获取巡检计划详情 */
getDetail (){ getDetail (){
getDeviceInfo(this.deviceId).then(response =>{ getDeviceInfo(this.deviceId).then(response =>{
this.form = response.data; this.form = response.data;
console.log("this.form",this.form)
this.gaoMap.resetMapCenter([this.form.longitude, this.form.latitude]); this.gaoMap.resetMapCenter([this.form.longitude, this.form.latitude]);
this.gaoMap.addMarker(DEVICE_TYPE.WORKORDER, this.form) this.gaoMap.addMarker(DEVICE_TYPE.WORKORDER, this.form)
}); });
......
gassafety-web/src/views/device/pipe/index.vue
View file @ 565013a7
...@@ -101,8 +101,8 @@ ...@@ -101,8 +101,8 @@
</el-table-column> </el-table-column>
<el-table-column label="管道长度" align="center" prop="pipeLength" /> <el-table-column label="管道长度" align="center" prop="pipeLength" />
<el-table-column label="所在地址" align="center" prop="pipeAddr" /> <el-table-column label="所在地址" align="center" prop="pipeAddr" />
<el-table-column label="安装时间" align="center" prop="installationTime" width="180" /> <el-table-column label="安装日期" align="center" prop="installationTime" width="180" />
<el-table-column label="最后巡检时间" align="center" prop="inspectionTime" width="180" /> <el-table-column label="最后巡检日期" align="center" prop="inspectionTime" width="180" />
<el-table-column label="操作" align="center" class-name="small-padding fixed-width"> <el-table-column label="操作" align="center" class-name="small-padding fixed-width">
<template slot-scope="scope"> <template slot-scope="scope">
<el-button <el-button
...@@ -138,84 +138,120 @@ ...@@ -138,84 +138,120 @@
/> />
<!-- 添加或修改管道信息对话框 --> <!-- 添加或修改管道信息对话框 -->
<el-dialog :title="title" :visible.sync="open" width="800px" append-to-body> <el-dialog :title="title" :visible.sync="open" append-to-body @close="cancel">
<el-form ref="form" :model="form" :rules="rules" label-width="135px"> <el-form ref="form" :model="form" :rules="rules" label-width="135px">
<el-form-item label="管道类型"> <el-col :span="23">
<el-select v-model="form.pipeType" placeholder="请选择管道类型" style="width: 600px"> <el-form-item label="管道名称" prop="pipeName">
<el-option <el-input v-model="form.pipeName" placeholder="请输入管道名称" />
v-for="dict in typeOptions" </el-form-item>
:key="dict.dictValue" </el-col>
:label="dict.dictLabel" <el-col :span="11">
:value="dict.dictValue" <el-form-item label="管道编号" prop="pipeCode">
></el-option> <el-input v-model="form.pipeCode" placeholder="请输入管道编号" />
</el-select> </el-form-item>
</el-form-item> </el-col>
<el-form-item label="管道名称" prop="pipeName"> <el-col :span="12">
<el-input v-model="form.pipeName" placeholder="请输入管道名称" style="width: 600px"/> <el-form-item label="管道长度" prop="pipeLength">
</el-form-item> <el-input type="number" min="0" v-model="form.pipeLength" placeholder="请输入管道长度">
<el-form-item label="管道编号" prop="pipeCode"> <i
<el-input v-model="form.pipeCode" placeholder="请输入管道编号" style="width: 600px" /> slot="suffix"
</el-form-item> style="color: #000; font-style: normal; margin-right: 10px"
<el-form-item label="管道压力"> >米</i
<el-select v-model="form.pipePressure" placeholder="请选择管道压力" style="width: 600px"> >
<el-option </el-input>
v-for="dict in pressureOptions" </el-form-item>
:key="dict.dictValue" </el-col>
:label="dict.dictLabel" <el-col :span="23">
:value="dict.dictValue" <el-form-item label="管道所在地址" prop="pipeAddr">
></el-option> <el-input v-model="form.pipeAddr" placeholder="请输入管道所在地址" />
</el-select> </el-form-item>
</el-form-item> </el-col>
<el-form-item label="所在地址" prop="pipeAddr"> <el-col :span="23">
<el-input v-model="form.pipeAddr" placeholder="请输入所在地址" style="width: 600px" /> <el-form-item label="管道坐标" prop="coordinates">
</el-form-item> <el-col :span="18">
<el-form-item label="管道长度" prop="pipeLength"> <el-input type="textarea" v-model="form.coordinates" placeholder="请输入管道坐标" />
<el-input v-model="form.pipeLength"placeholder="请输入管道长度" style="width: 600px" /> </el-col>
</el-form-item> <el-col :span="5" style="margin-left: 10px">
<el-form-item label="管道坐标" prop="coordinates"> <el-button type="primary" plain @click="MapdialogFun">选择管道坐标</el-button>
<el-col :span="18"> </el-col>
<el-input v-model="form.coordinates" type="textarea" placeholder="请输入坐标" /> </el-form-item>
</el-col> </el-col>
<el-col :span="5"> <el-col>
<el-button type="primary" plain @click="MapdialogFun">选择坐标</el-button> <el-form-item label="管道类型" prop="pipeType">
</el-col> <el-radio-group v-model="form.pipeType">
</el-form-item> <el-radio label="1">地埋管线</el-radio>
<el-form-item label="设备图片上传" prop="iconUrl"> <el-radio label="2">地表管线</el-radio>
<MyFileUpload </el-radio-group>
listType="picture-card" </el-form-item>
@resFun="getFileInfo" </el-col>
@remove="listRemove" <el-col>
:fileArr="fileList" <el-form-item label="管道压力" prop="pipePressure">
/> <!-- select -->
</el-form-item> <el-radio-group v-model="form.pipePressure">
<el-form-item label="安装时间" prop="installationTime"> <!-- 1低压，2中压，3次高压，4高压 -->
<el-date-picker clearable size="small" <el-radio label="1">低压</el-radio>
v-model="form.installationTime" <el-radio label="2">中压</el-radio>
type="datetime" <el-radio label="3">次高压</el-radio>
value-format="yyyy-MM-dd HH:mm:ss" <el-radio label="4">高压</el-radio>
placeholder="选择安装时间"> </el-radio-group>
</el-date-picker> </el-form-item>
</el-form-item> </el-col>
<el-form-item label="备注" prop="remarks"> <el-col>
<el-input v-model="form.remarks" placeholder="请输入备注" style="width: 600px" /> <el-form-item label="管道图片上传" prop="iconUrl">
</el-form-item> <MyFileUpload
listType="picture-card"
@resFun="getFileInfo"
@remove="listRemove"
:fileArr="fileList"
/>
<el-input v-show="false" disabled v-model="form.iconUrl"></el-input>
</el-form-item>
</el-col>
<el-col>
<el-form-item label="安装日期" prop="installationTime">
<el-col :span="11">
<el-date-picker clearable size="small"
style="width: 100%"
v-model="form.installationTime"
type="date"
value-format="yyyy-MM-dd"
placeholder="请选择安装日期">
</el-date-picker>
</el-col>
</el-form-item>
</el-col>
<el-col :span="23">
<el-form-item label="备注信息" prop="remarks">
<el-input v-model="form.remarks" type="textarea" placeholder="请输入备注信息" />
</el-form-item>
</el-col>
</el-form> </el-form>
<div slot="footer" class="dialog-footer"> <div slot="footer" class="dialog-footer">
<el-button type="primary" @click="submitForm">确 定</el-button> <el-button type="primary" @click="submitForm">确 定</el-button>
<el-button @click="cancel">取 消</el-button> <el-button @click="cancel">取 消</el-button>
</div> </div>
</el-dialog> </el-dialog>
<Mapdialog
v-if="loadmap"
:dialogTableVisible="dialogTableVisible"
@dialogcancelFun="dialogcancelFun"
@confirmFun="confirmFun($event)"
:str="str"
></Mapdialog>
</div> </div>
</template> </template>
<script> <script>
import { listPipe, getPipe, delPipe, addPipe, updatePipe, exportPipe } from "@/api/device/pipe"; import { listPipe, getPipe, addPipe, updatePipe, exportPipe } from "@/api/device/pipe";
import MyFileUpload from '@/components/MyFileUpload'; import MyFileUpload from '@/components/MyFileUpload';
// import Mapdialog from "@/components/mapDialog/checkPipeLineLocation.vue";
export default { export default {
name: "Pipe", name: "Pipe",
components: { components: {
MyFileUpload MyFileUpload,
Mapdialog
}, },
data() { data() {
return { return {
...@@ -241,9 +277,10 @@ export default { ...@@ -241,9 +277,10 @@ export default {
open: false, open: false,
// 上传文件列表 // 上传文件列表
fileList: [], fileList: [],
// 管道类型字典 // 地图
typeOptions: [], loadmap: false,
// 管道压力字典 dialogTableVisible: false,
// 管道压力数据字典
pressureOptions: [], pressureOptions: [],
// 查询参数 // 查询参数
queryParams: { queryParams: {
...@@ -262,9 +299,42 @@ export default { ...@@ -262,9 +299,42 @@ export default {
remarks: null remarks: null
}, },
// 表单参数 // 表单参数
form: {}, form: {
pipeName: "",
pipeType: "1",
pipePressure: "1",
iconUrl: "",
coordinates: ""
},
// 表单校验 // 表单校验
rules: { rules: {
pipeName: [
{ required: true, message: "请输入管道名称", trigger: "blur" },
],
pipeCode: [
{ required: true, message: "请输入管道编号", trigger: "blur" },
],
pipeLength: [
{ required: true, message: "请输入管道长度", trigger: "blur" },
],
pipeAddr: [
{ required: true, message: "请输入管道所在地址", trigger: "blur" },
],
pipeType: [
{ required: true, message: "请选择管道类型", trigger: "blur" },
],
pipePressure: [
{ required: true, message: "请选择管道压力", trigger: "blur" },
],
coordinates: [
{ required: true, message: "请选择管道坐标", trigger: "blur" },
],
/*iconUrl: [
{ required: true, message: "请上传图片", trigger: "change" },
],
installationTime: [
{ required: true, message: "请选择日期", trigger: "change" },
],*/
} }
}; };
}, },
...@@ -291,9 +361,22 @@ export default { ...@@ -291,9 +361,22 @@ export default {
this.form.iconUrl = res.url; this.form.iconUrl = res.url;
}, },
listRemove(e) { listRemove(e) {
this.form.url = ""; this.form.iconUrl = "";
this.fileList = []; this.fileList = [];
}, },
confirmFun(res) {
//确认选择经纬度
this.form.longitude = res.lng;
this.form.latitude = res.lat;
},
MapdialogFun() {
this.loadmap = true;
this.dialogTableVisible = true;
},
dialogcancelFun() {
this.loadmap = false;
this.dialogTableVisible = false;
},
// 取消按钮 // 取消按钮
cancel() { cancel() {
this.open = false; this.open = false;
...@@ -316,7 +399,6 @@ export default { ...@@ -316,7 +399,6 @@ export default {
inspectionTime: null, inspectionTime: null,
remarks: null remarks: null
}; };
this.fileList = [];
this.resetForm("form"); this.resetForm("form");
}, },
/** 搜索按钮操作 */ /** 搜索按钮操作 */
...@@ -339,7 +421,7 @@ export default { ...@@ -339,7 +421,7 @@ export default {
handleAdd() { handleAdd() {
this.reset(); this.reset();
this.open = true; this.open = true;
this.title = "添加管道信息"; this.title = "新增管道信息";
}, },
/** 修改按钮操作 */ /** 修改按钮操作 */
handleUpdate(row) { handleUpdate(row) {
...@@ -347,13 +429,13 @@ export default { ...@@ -347,13 +429,13 @@ export default {
const pipeId = row.pipeId || this.ids const pipeId = row.pipeId || this.ids
getPipe(pipeId).then(response => { getPipe(pipeId).then(response => {
this.form = response.data; this.form = response.data;
this.open = true;
this.title = "修改管道信息";
if (this.form.iconUrl) { if (this.form.iconUrl) {
this.fileList.push({ this.fileList.push({
name: this.form.iconUrl, url: this.form.iconUrl,
}); });
} }
this.open = true;
this.title = "修改管道信息";
}); });
}, },
/** 提交按钮 */ /** 提交按钮 */
...@@ -423,3 +505,17 @@ export default { ...@@ -423,3 +505,17 @@ export default {
} }
}; };
</script> </script>
<style>
.notice {
background: white;
position: fixed;
top: 102px;
right: 0;
left: 0;
margin: auto;
width: 80%;
height: 80%;
border: solid 1px;
}
</style>
gassafety-web/src/views/device/pipeDetail/index.vue
View file @ 565013a7
...@@ -56,7 +56,7 @@ ...@@ -56,7 +56,7 @@
</el-form> </el-form>
</div> </div>
<div id="marbox" style="width: 700px;height: 400px;float: left;margin-top: -25px; border: 1px solid rgb(218, 213, 213);"> <div id="marbox" style="width: 700px;height: 390px;float: left;margin-top: -25px; border: 1px solid rgb(218, 213, 213);">
<div style="width: 100%;height: 100%" id="container"></div> <div style="width: 100%;height: 100%" id="container"></div>
</div> </div>
</div> </div>
...@@ -92,12 +92,9 @@ ...@@ -92,12 +92,9 @@
this.gaoMap = gaoMap; this.gaoMap = gaoMap;
}, },
methods: { methods: {
/** 获取巡检计划详情 */
getDetail (){ getDetail (){
getPipe(this.pipeId).then(response =>{ getPipe(this.pipeId).then(response =>{
this.form = response.data; this.form = response.data;
console.log("this.form",this.form)
this.gaoMap.resetMapCenter([this.form.longitude, this.form.latitude]); this.gaoMap.resetMapCenter([this.form.longitude, this.form.latitude]);
this.gaoMap.addMarker(DEVICE_TYPE.WORKORDER, this.form) this.gaoMap.addMarker(DEVICE_TYPE.WORKORDER, this.form)
}); });
......
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