Skip to content

G
gassafety
Commit 4ca0eff7 authored by 王晓倩's avatar 王晓倩
Browse files
Options

管道列表页、设备信息列表页

parent 26d35ba5
Show whitespace changes
Inline Side-by-side
Showing with 122 additions and 88 deletions
gassafety-web/src/views/device/deviceInfo/index.vue
View file @ 4ca0eff7
......@@ -10,10 +10,10 @@
@keyup.enter.native="handleQuery"
/>
</el-form-item>
<el-form-item label="设备型号" prop="deviceModel">
<el-form-item label="设备编号" prop="deviceCode">
<el-input
v-model="queryParams.deviceModel"
placeholder="请输入设备型号"
v-model="queryParams.deviceCode"
placeholder="请输入设备编号"
clearable
size="small"
@keyup.enter.native="handleQuery"
......@@ -29,15 +29,6 @@
></el-option>
</el-select>
</el-form-item>
<el-form-item label="物联网编号" prop="iotNo">
<el-input
v-model="queryParams.iotNo"
placeholder="请输入物联网编号"
clearable
size="small"
@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>
......@@ -55,7 +46,7 @@
v-hasPermi="['device:deviceInfo:add']"
>新增</el-button>
</el-col>
<el-col :span="1.5">
<!--<el-col :span="1.5">
<el-button
type="success"
plain
......@@ -87,14 +78,13 @@
@click="handleExport"
v-hasPermi="['device:deviceInfo:export']"
>导出</el-button>
</el-col>
</el-col>-->
<right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
</el-row>
<el-table v-loading="loading" :data="deviceInfoList" @selection-change="handleSelectionChange">
<el-table-column type="selection" width="55" align="center" />
<!-- <el-table-column label="所属管道" align="center" prop="pipeId" />-->
<el-table-column label="设备名称" align="center" prop="deviceName" />
<el-table-column label="所属管道" align="center" prop="pipeName" />
<el-table-column label="设备编号" align="center" prop="deviceCode" />
<el-table-column label="设备类型" align="center" prop="deviceType">
<template slot-scope="scope">
......@@ -106,7 +96,6 @@
</el-table-column>
<el-table-column label="设备型号" align="center" prop="deviceModel" />
<el-table-column label="所在地址" align="center" prop="deviceAddr" />
<el-table-column label="物联网编号" align="center" prop="iotNo" />
<el-table-column label="安装时间" align="center" prop="installationTime" width="180">
<template slot-scope="scope">
<span>{{ parseTime(scope.row.installationTime) }}</span>
......@@ -146,25 +135,20 @@
/>
<!-- 添加或修改设备信息对话框 -->
<el-dialog :title="title" :visible.sync="open" width="850px" append-to-body>
<el-dialog :title="title" :visible.sync="open" width="800px" append-to-body>
<el-form ref="form" :model="form" :rules="rules" label-width="135px">
<el-form-item label="所属管道" prop="pipeId">
<el-input v-model="form.pipeId" placeholder="请输入所属管道" />
</el-form-item>
<el-form-item label="设备名称" prop="deviceName">
<el-input v-model="form.deviceName" placeholder="请输入设备名称" />
</el-form-item>
<el-form-item label="设备编号" prop="deviceCode">
<el-input v-model="form.deviceCode" placeholder="请输入设备编号" />
</el-form-item>
<el-form-item label="所在地址" prop="deviceAddr">
<el-input v-model="form.deviceAddr" placeholder="请输入所在地址" />
</el-form-item>
<el-form-item label="设备型号" prop="deviceModel">
<el-input v-model="form.deviceModel" placeholder="请输入设备型号" />
<el-select v-model="form.pipeId" placeholder="请选择所属管道" clearable size="small" style="width: 600px">
<el-option
v-for="item in options"
:key="item.pipeId"
:label="item.pipeName"
:value="item.pipeId"
></el-option>
</el-select>
</el-form-item>
<el-form-item label="设备类型">
<el-select v-model="form.deviceType" placeholder="请选择设备类型">
<el-select v-model="form.deviceType" placeholder="请选择设备类型" style="width: 600px">
<el-option
v-for="dict in typeOptions"
:key="dict.dictValue"
......@@ -173,15 +157,34 @@
></el-option>
</el-select>
</el-form-item>
<el-form-item label="经度" prop="longitude">
<el-input v-model="form.longitude" placeholder="请输入经度" />
<el-form-item label="设备名称" prop="deviceName">
<el-input v-model="form.deviceName" placeholder="请输入设备名称" style="width: 600px" />
</el-form-item>
<el-form-item label="设备编号" prop="deviceCode">
<el-input v-model="form.deviceCode" placeholder="请输入设备编号" style="width: 600px" />
</el-form-item>
<el-form-item label="纬度" prop="latitude">
<el-input v-model="form.latitude" placeholder="请输入纬度" />
<el-form-item label="设备型号" prop="deviceModel">
<el-input v-model="form.deviceModel" placeholder="请输入设备型号" style="width: 600px" />
</el-form-item>
<el-form-item label="物联网编号" prop="iotNo">
<el-input v-model="form.iotNo" placeholder="请输入物联网编号" />
</el-form-item>
<el-form-item label="所在地址" prop="deviceAddr">
<el-input v-model="form.deviceAddr" placeholder="请输入所在地址" style="width: 600px" />
</el-form-item>
<el-form-item label="经纬度" >
<el-row>
<el-col :span="8">
<el-input v-model.number="form.longitude" placeholder="请输入经度" />
</el-col>
<el-col :span="8">
<el-input v-model.number="form.latitude" placeholder="请输入纬度"/>
</el-col>
<el-col :span="5">
<el-button type="primary" plain @click="MapdialogFun">选择经纬度</el-button>
</el-col>
</el-row>
</el-form-item>
<el-form-item label="设备图片上传" prop="iconUrl">
<MyFileUpload
listType="picture-card"
......@@ -217,7 +220,8 @@
</template>
<script>
import { listDeviceInfo, getDeviceInfo, delDeviceInfo, addDeviceInfo, updateDeviceInfo, exportDeviceInfo, countDeviceByType } from "@/api/device/deviceInfo";
import { listDeviceInfo, getDeviceInfo, addDeviceInfo, updateDeviceInfo, exportDeviceInfo } from "@/api/device/deviceInfo";
import { pipeAllInfoList } from "@/api/device/pipe";
import MyFileUpload from '@/components/MyFileUpload';
export default {
......@@ -247,6 +251,8 @@ export default {
title: "",
// 是否显示弹出层
open: false,
// 管道列表
options: [],
// 上传文件列表
fileList: [],
// 设备类型字典
......@@ -256,8 +262,8 @@ export default {
pageNum: 1,
pageSize: 10,
enterpriseId: null,
pipeId: null,
deviceName: null,
deviceCode: null,
deviceAddr: null,
deviceModel: null,
deviceType: null,
......@@ -348,12 +354,18 @@ export default {
/** 新增按钮操作 */
handleAdd() {
this.reset();
pipeAllInfoList().then(response => {
this.options = response.data;
this.open = true;
this.title = "添加设备信息";
});
},
/** 修改按钮操作 */
handleUpdate(row) {
this.reset();
pipeAllInfoList().then(response => {
this.options = response.data;
});
const deviceId = row.deviceId || this.ids
getDeviceInfo(deviceId).then(response => {
this.form = response.data;
......@@ -388,17 +400,18 @@ export default {
},
/** 删除按钮操作 */
handleDelete(row) {
const deviceIds = row.deviceId || this.ids;
this.$confirm('是否确认删除设备信息编号为"' + deviceIds + '"的数据项?', "警告", {
row.isDel = "1";
this.$confirm('是否确认删除设备名称为"' + row.deviceName + '"的数据项?', "警告", {
confirmButtonText: "确定",
cancelButtonText: "取消",
type: "warning"
}).then(function() {
return delDeviceInfo(deviceIds);
}).then(function () {
return updateDeviceInfo(row);
}).then(() => {
this.getList();
this.msgSuccess("删除成功");
}).catch(() => {});
this.msgSuccess("已删除");
}).catch(() => {
});
},
/** 导出按钮操作 */
handleExport() {
......@@ -418,3 +431,9 @@ export default {
}
};
</script>
<style>
.el-col {
margin-left: 0;
margin-right: 10px;
}
</style>
gassafety-web/src/views/device/pipe/index.vue
View file @ 4ca0eff7
<template>
<div class="app-container">
<el-form :model="queryParams" ref="queryForm" :inline="true" v-show="showSearch" label-width="68px">
<el-form :model="queryParams" ref="queryForm" :inline="true" v-show="showSearch" label-width="100px">
<el-form-item label="管道名称" prop="pipeName">
<el-input
v-model="queryParams.pipeName"
......@@ -10,6 +10,15 @@
@keyup.enter.native="handleQuery"
/>
</el-form-item>
<el-form-item label="管道编号" prop="pipeCode">
<el-input
v-model="queryParams.pipeCode"
placeholder="请输入管道编号"
clearable
size="small"
@keyup.enter.native="handleQuery"
/>
</el-form-item>
<el-form-item label="管道类型" prop="pipeType">
<el-select v-model="queryParams.pipeType" placeholder="请选择管道类型" size="small">
<el-option
......@@ -37,7 +46,7 @@
v-hasPermi="['device:pipe:add']"
>新增</el-button>
</el-col>
<el-col :span="1.5">
<!--<el-col :span="1.5">
<el-button
type="success"
plain
......@@ -69,16 +78,13 @@
@click="handleExport"
v-hasPermi="['device:pipe:export']"
>导出</el-button>
</el-col>
</el-col>-->
<right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
</el-row>
<el-table v-loading="loading" :data="pipeList" @selection-change="handleSelectionChange">
<el-table-column type="selection" width="55" align="center" />
<el-table-column label="管道名称" align="center" prop="pipeName" />
<el-table-column label="所在地址" align="center" prop="pipeAddr" />
<el-table-column label="管道坐标" align="center" prop="coordinates" />
<el-table-column label="管道长度" align="center" prop="pipeLength" />
<el-table-column label="管道编号" align="center" prop="pipeCode" />
<el-table-column label="管道类型" align="center" prop="pipeType" >
<template slot-scope="scope">
<span v-if="scope.row.pipeType == 1">地埋管线</span>
......@@ -93,6 +99,8 @@
<span v-if="scope.row.pipePressure == 4">高压</span>
</template>
</el-table-column>
<el-table-column label="管道长度" align="center" prop="pipeLength" />
<el-table-column label="所在地址" align="center" prop="pipeAddr" />
<el-table-column label="安装时间" align="center" prop="installationTime" width="180">
<template slot-scope="scope">
<span>{{ parseTime(scope.row.installationTime)}}</span>
......@@ -132,25 +140,10 @@
/>
<!-- 添加或修改管道信息对话框 -->
<el-dialog :title="title" :visible.sync="open" width="850px" append-to-body>
<el-dialog :title="title" :visible.sync="open" width="800px" append-to-body>
<el-form ref="form" :model="form" :rules="rules" label-width="135px">
<el-form-item label="管道名称" prop="pipeName">
<el-input v-model="form.pipeName" placeholder="请输入管道名称" />
</el-form-item>
<el-form-item label="管道编号" prop="pipeCode">
<el-input v-model="form.pipeCode" placeholder="请输入管道编号" />
</el-form-item>
<el-form-item label="所在地址" prop="pipeAddr">
<el-input v-model="form.pipeAddr" placeholder="请输入所在地址" />
</el-form-item>
<el-form-item label="管道坐标" prop="coordinates">
<el-input v-model="form.coordinates" type="textarea" placeholder="请输入坐标" />
</el-form-item>
<el-form-item label="管道长度" prop="pipeLength">
<el-input v-model="form.pipeLength"placeholder="请输入管道长度" />
</el-form-item>
<el-form-item label="管道类型">
<el-select v-model="form.pipeType" placeholder="请选择管道类型">
<el-select v-model="form.pipeType" placeholder="请选择管道类型" style="width: 600px">
<el-option
v-for="dict in typeOptions"
:key="dict.dictValue"
......@@ -159,8 +152,14 @@
></el-option>
</el-select>
</el-form-item>
<el-form-item label="管道名称" prop="pipeName">
<el-input v-model="form.pipeName" placeholder="请输入管道名称" style="width: 600px"/>
</el-form-item>
<el-form-item label="管道编号" prop="pipeCode">
<el-input v-model="form.pipeCode" placeholder="请输入管道编号" style="width: 600px" />
</el-form-item>
<el-form-item label="管道压力">
<el-select v-model="form.pipePressure" placeholder="请选择管道压力">
<el-select v-model="form.pipePressure" placeholder="请选择管道压力" style="width: 600px">
<el-option
v-for="dict in pressureOptions"
:key="dict.dictValue"
......@@ -169,6 +168,20 @@
></el-option>
</el-select>
</el-form-item>
<el-form-item label="所在地址" prop="pipeAddr">
<el-input v-model="form.pipeAddr" placeholder="请输入所在地址" style="width: 600px" />
</el-form-item>
<el-form-item label="管道长度" prop="pipeLength">
<el-input v-model="form.pipeLength"placeholder="请输入管道长度" style="width: 600px" />
</el-form-item>
<el-form-item label="管道坐标" prop="coordinates">
<el-col :span="18">
<el-input v-model="form.coordinates" type="textarea" placeholder="请输入坐标" />
</el-col>
<el-col :span="5">
<el-button type="primary" plain @click="MapdialogFun">选择坐标</el-button>
</el-col>
</el-form-item>
<el-form-item label="设备图片上传" prop="iconUrl">
<MyFileUpload
listType="picture-card"
......@@ -186,7 +199,7 @@
</el-date-picker>
</el-form-item>
<el-form-item label="备注" prop="remarks">
<el-input v-model="form.remarks" placeholder="请输入备注" />
<el-input v-model="form.remarks" placeholder="请输入备注" style="width: 600px" />
</el-form-item>
</el-form>
<div slot="footer" class="dialog-footer">
......@@ -305,6 +318,7 @@ export default {
inspectionTime: null,
remarks: null
};
this.fileList = [];
this.resetForm("form");
},
/** 搜索按钮操作 */
......@@ -366,17 +380,18 @@ export default {
},
/** 删除按钮操作 */
handleDelete(row) {
const pipeIds = row.pipeId || this.ids;
this.$confirm('是否确认删除管道信息编号为"' + pipeIds + '"的数据项?', "警告", {
row.isDel = "1";
this.$confirm('是否确认删除管道名称为"' + row.pipeName + '"的数据项?', "警告", {
confirmButtonText: "确定",
cancelButtonText: "取消",
type: "warning"
}).then(function() {
return delPipe(pipeIds);
}).then(function () {
return updatePipe(row);
}).then(() => {
this.getList();
this.msgSuccess("删除成功");
}).catch(() => {});
this.msgSuccess("已删除");
}).catch(() => {
});
},
/** 导出按钮操作 */
handleExport() {
......
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