修改设备管理页面

ruoyi-ui/src/api/system/device.js

@@ -3,7 +3,7 @@ import request from '@/utils/request'
 // 查询【请填写功能名称】列表
 export function listDevice(query) {
   return request({
-    url: '/system/device/list',
+    url: '/business/device/list',
     method: 'get',
     params: query
   })
@@ -12,7 +12,7 @@ export function listDevice(query) {
 // 查询【请填写功能名称】详细
 export function getDevice(id) {
   return request({
-    url: '/system/device/' + id,
+    url: '/business/device/' + id,
     method: 'get'
   })
 }
@@ -20,7 +20,7 @@ export function getDevice(id) {
 // 新增【请填写功能名称】
 export function addDevice(data) {
   return request({
-    url: '/system/device',
+    url: '/business/device',
     method: 'post',
     data: data
   })
@@ -29,7 +29,7 @@ export function addDevice(data) {
 // 修改【请填写功能名称】
 export function updateDevice(data) {
   return request({
-    url: '/system/device',
+    url: '/business/device',
     method: 'put',
     data: data
   })
@@ -38,7 +38,7 @@ export function updateDevice(data) {
 // 删除【请填写功能名称】
 export function delDevice(id) {
   return request({
-    url: '/system/device/' + id,
+    url: '/business/device/' + id,
     method: 'delete'
   })
 }
@@ -46,7 +46,7 @@ export function delDevice(id) {
 // 导出【请填写功能名称】
 export function exportDevice(query) {
   return request({
-    url: '/system/device/export',
+    url: '/business/device/export',
     method: 'get',
     params: query
   })

ruoyi-ui/src/api/system/product.js

@@ -0,0 +1,62 @@
+import request from '@/utils/request'
+
+// 查询【请填写功能名称】列表
+export function listProduct(query) {
+  return request({
+    url: '/business/product/list',
+    method: 'get',
+    params: query
+  })
+}
+
+// 查询【请填写功能名称】列表
+export function queryProduct(query) {
+  return request({
+    url: '/business/product/query',
+    method: 'get',
+    params: query
+  })
+}
+
+// 查询【请填写功能名称】详细
+export function getProduct(id) {
+  return request({
+    url: '/business/product/' + id,
+    method: 'get'
+  })
+}
+
+// 新增【请填写功能名称】
+export function addProduct(data) {
+  return request({
+    url: '/business/product',
+    method: 'post',
+    data: data
+  })
+}
+
+// 修改【请填写功能名称】
+export function updateProduct(data) {
+  return request({
+    url: '/business/product',
+    method: 'put',
+    data: data
+  })
+}
+
+// 删除【请填写功能名称】
+export function delProduct(id) {
+  return request({
+    url: '/business/product/' + id,
+    method: 'delete'
+  })
+}
+
+// 导出【请填写功能名称】
+export function exportProduct(query) {
+  return request({
+    url: '/business/product/export',
+    method: 'get',
+    params: query
+  })
+}

ruoyi-ui/src/views/system/device/index.vue

@@ -1,9 +1,9 @@
 <template>
   <div class="app-container">
     <el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px">
-      <el-form-item label="设备桩号" prop="deviceNo">
+      <el-form-item label="设备桩号" prop="stakeMark">
         <el-input
-          v-model="queryParams.deviceNo"
+          v-model="queryParams.stakeMark"
           placeholder="请输入设备桩号"
           clearable
           @keyup.enter.native="handleQuery"
@@ -26,36 +26,54 @@
         />
       </el-form-item>
       <el-form-item label="方向" prop="direction">
-        <el-input
+        <el-select v-model="queryParams.direction" clearable placeholder="请选择方向" class="select-width">
-          v-model="queryParams.direction"
+          <el-option
-          placeholder="请输入方向"
+            v-for="dict in directionList"
-          clearable
+            :key="dict.value"
-          @keyup.enter.native="handleQuery"
+            :label="dict.label"
-        />
+            :value="dict.value"
+          ></el-option>
+        </el-select>
       </el-form-item>
-      <el-form-item label="厂家" prop="production">
+      <el-form-item label="所属部门" prop="groupId">
-        <el-input
+        <el-select v-model="queryParams.groupId" clearable placeholder="请选择所属部门" class="select-width">
-          v-model="queryParams.production"
+          <el-option
-          placeholder="请输入厂家"
+            v-for="dict in groupList"
-          clearable
+            :key="dict.deptId"
-          @keyup.enter.native="handleQuery"
+            :label="dict.deptName"
-        />
+            :value="dict.deptId"
+          ></el-option>
+        </el-select>
       </el-form-item>
-      <el-form-item label="型号" prop="model">
+      <el-form-item label="设备状态" prop="deviceState">
-        <el-input
+        <el-select v-model="queryParams.useState" clearable placeholder="请选择使用状态" class="select-width">
-          v-model="queryParams.model"
+          <el-option
-          placeholder="请输入型号"
+            v-for="dict in useStateList"
-          clearable
+            :key="dict.value"
-          @keyup.enter.native="handleQuery"
+            :label="dict.label"
-        />
+            :value="dict.value"
+          ></el-option>
+        </el-select>
       </el-form-item>
-      <el-form-item label="网段" prop="network">
+      <el-form-item label="设备类型" prop="deviceType">
-        <el-input
+        <el-select v-model="queryParams.deviceType" clearable placeholder="请选择设备类型" class="select-width">
-          v-model="queryParams.network"
+          <el-option
-          placeholder="请输入网段"
+            v-for="dict in deviceTypeList"
-          clearable
+            :key="dict.value"
-          @keyup.enter.native="handleQuery"
+            :label="dict.label"
-        />
+            :value="dict.value"
+          ></el-option>
+        </el-select>
+      </el-form-item>
+      <el-form-item label="设备所属" prop="deviceType">
+        <el-select v-model="queryParams.facilitiesType" clearable placeholder="请选择设备所属" class="select-width">
+          <el-option
+            v-for="dict in facilitiesTypeList"
+            :key="dict.value"
+            :label="dict.label"
+            :value="dict.value"
+          ></el-option>
+        </el-select>
       </el-form-item>
       <el-form-item>
         <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
@@ -72,7 +90,8 @@
           size="mini"
           @click="handleAdd"
           v-hasPermi="['system:device:add']"
-        >新增</el-button>
+        >新增
+        </el-button>
       </el-col>
       <el-col :span="1.5">
         <el-button
@@ -83,7 +102,8 @@
           :disabled="single"
           @click="handleUpdate"
           v-hasPermi="['system:device:edit']"
-        >修改</el-button>
+        >修改
+        </el-button>
       </el-col>
       <el-col :span="1.5">
         <el-button
@@ -94,7 +114,8 @@
           :disabled="multiple"
           @click="handleDelete"
           v-hasPermi="['system:device:remove']"
-        >删除</el-button>
+        >删除
+        </el-button>
       </el-col>
       <el-col :span="1.5">
         <el-button
@@ -104,23 +125,86 @@
           size="mini"
           @click="handleExport"
           v-hasPermi="['system:device:export']"
-        >导出</el-button>
+        >导出
+        </el-button>
       </el-col>
       <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
     </el-row>
 
     <el-table v-loading="loading" :data="deviceList" @selection-change="handleSelectionChange">
-      <el-table-column type="selection" width="55" align="center" />
+      <el-table-column type="selection" width="55" align="center"/>
-      <el-table-column label="设备ID" align="center" prop="id" />
+      <el-table-column label="设备图片  " align="center" prop="deviceImg">
-      <el-table-column label="设备桩号" align="center" prop="deviceNo" />
+        <template slot-scope="scope">
-      <el-table-column label="设备名称" align="center" prop="deviceName" />
+          <el-image
-      <el-table-column label="设备IP" align="center" prop="deviceIp" />
+            v-if="scope.row.deviceImg"
-      <el-table-column label="方向" align="center" prop="direction" />
+            style="width: 30px; height: 30px"
-      <el-table-column label="厂家" align="center" prop="production" />
+            :src="scope.row.deviceImg"
-      <el-table-column label="型号" align="center" prop="model" />
+            :preview-src-list="[scope.row.deviceImg]"
-      <el-table-column label="网段" align="center" prop="network" />
+          >
-      <el-table-column label="备注" align="center" prop="content" />
+          </el-image>
-      <el-table-column label="设备类型" align="center" prop="type" />
+          <p v-else>暂无</p>
+        </template>
+      </el-table-column>
+      <el-table-column label="设备ID" align="center" prop="id"/>
+      <el-table-column label="物联设备ID" align="center" prop="iotDeviceId"/>
+      <el-table-column label="设备桩号" align="center" prop="stakeMark"/>
+      <el-table-column label="设备名称" align="center" prop="deviceName"/>
+      <el-table-column label="设备IP" align="center" prop="deviceIp"/>
+      <el-table-column label="设备编号" align="center" prop="deviceCode"/>
+      <el-table-column label="方向" align="center" prop="direction">
+        <template slot-scope="scope">
+            <span v-for="(item, index) in directionList" :key="index" v-if="scope.row.direction === item.value">
+              {{ item.label }}
+            </span>
+        </template>
+      </el-table-column>
+      <el-table-column label="所属产品" align="center" prop="productId">
+        <template slot-scope="scope">
+            <span v-for="(item, index) in productList" :key="index" v-if="scope.row.productId === item.id">
+              {{ item.productName }}
+            </span>
+        </template>
+      </el-table-column>
+      <el-table-column label="所属部门" align="center" prop="groupId">
+        <template slot-scope="scope">
+            <span v-for="(item, index) in groupList" :key="index" v-if="scope.row.groupId === item.deptId">
+              {{ item.deptName }}
+            </span>
+        </template>
+      </el-table-column>
+      <el-table-column label="设备状态" align="center" prop="deviceState">
+        <template slot-scope="scope">
+            <span v-for="(item, index) in deviceStateList" :key="index" v-if="scope.row.deviceState === item.value">
+              {{ item.label }}
+            </span>
+        </template>
+      </el-table-column>
+      <el-table-column label="设备类型" align="center" prop="deviceType">
+        <template slot-scope="scope">
+            <span v-for="(item, index) in deviceTypeList" :key="index" v-if="scope.row.deviceType === item.value">
+              {{ item.label }}
+            </span>
+        </template>
+      </el-table-column>
+      <el-table-column label="生产日期" align="center" prop="productionDate"/>
+      <el-table-column label="使用年限" align="center" prop="durableYears"/>
+      <el-table-column label="安装位置" align="center" prop="installationSite"/>
+      <el-table-column label="使用状态" align="center" prop="useState">
+        <template slot-scope="scope">
+            <span v-for="(item, index) in useStateList" :key="index" v-if="scope.row.useState === item.value">
+              {{ item.label }}
+            </span>
+        </template>
+      </el-table-column>
+      <el-table-column label="设备所属" align="center" prop="facilitiesType">
+        <template slot-scope="scope">
+            <span v-for="(item, index) in facilitiesTypeList" :key="index"
+                  v-if="scope.row.facilitiesType === item.value"
+            >
+              {{ item.label }}
+            </span>
+        </template>
+      </el-table-column>
       <el-table-column label="操作" align="center" class-name="small-padding fixed-width">
         <template slot-scope="scope">
           <el-button
@@ -129,14 +213,16 @@
             icon="el-icon-edit"
             @click="handleUpdate(scope.row)"
             v-hasPermi="['system:device:edit']"
-          >修改</el-button>
+          >修改
+          </el-button>
           <el-button
             size="mini"
             type="text"
             icon="el-icon-delete"
             @click="handleDelete(scope.row)"
             v-hasPermi="['system:device:remove']"
-          >删除</el-button>
+          >删除
+          </el-button>
         </template>
       </el-table-column>
     </el-table>
@@ -150,28 +236,119 @@
     />
 
     <!-- 添加或修改【请填写功能名称】对话框 -->
-    <el-dialog :title="title" :visible.sync="open" width="500px" 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="80px">
+      <el-form ref="form" :model="form" :rules="rules" label-width="100px">
-        <el-form-item label="设备桩号" prop="deviceNo">
+        <el-form-item label="设备图片" prop="deviceImg">
-          <el-input v-model="form.deviceNo" placeholder="请输入设备桩号" />
+          <div class="photo">
+            <el-upload
+              name="file"
+              :action="reqFileUrl"
+              :accept="accept"
+              :before-upload="beforeUpload"
+              :headers="{'Authorization': 'Bearer ' + getToken()}"
+              :show-file-list="false"
+              :on-success="handleSuccess"
+            >
+              <img v-if="form.deviceImg" :src="form.deviceImg" class="avatar">
+              <i v-else class="el-icon-plus avatar-uploader-icon"></i>
+            </el-upload>
+          </div>
+        </el-form-item>
+        <el-form-item label="物联设备ID" prop="iotDeviceId">
+          <el-input v-model="form.iotDeviceId" placeholder="请输入物联设备ID"/>
+        </el-form-item>
+        <el-form-item label="设备桩号" prop="stakeMark">
+          <el-input v-model="form.stakeMark" placeholder="请输入设备桩号"/>
         </el-form-item>
         <el-form-item label="设备名称" prop="deviceName">
-          <el-input v-model="form.deviceName" placeholder="请输入设备名称" />
+          <el-input v-model="form.deviceName" placeholder="请输入设备名称"/>
         </el-form-item>
         <el-form-item label="设备IP" prop="deviceIp">
-          <el-input v-model="form.deviceIp" placeholder="请输入设备IP" />
+          <el-input v-model="form.deviceIp" placeholder="请输入设备IP"/>
+        </el-form-item>
+        <el-form-item label="设备编号" prop="deviceCode">
+          <el-input v-model="form.deviceCode" placeholder="请输入设备编号"/>
         </el-form-item>
         <el-form-item label="方向" prop="direction">
-          <el-input v-model="form.direction" placeholder="请输入方向" />
+          <el-select v-model="form.direction" clearable placeholder="请选择方向" class="select-width">
+            <el-option
+              v-for="dict in directionList"
+              :key="dict.value"
+              :label="dict.label"
+              :value="dict.value"
+            ></el-option>
+          </el-select>
         </el-form-item>
-        <el-form-item label="厂家" prop="production">
+        <el-form-item label="所属产品" prop="productId">
-          <el-input v-model="form.production" placeholder="请输入厂家" />
+          <el-select v-model="form.productId" clearable placeholder="请选择所属产品" class="select-width">
+            <el-option
+              v-for="dict in productList"
+              :key="dict.id"
+              :label="dict.productName"
+              :value="dict.id"
+            ></el-option>
+          </el-select>
         </el-form-item>
-        <el-form-item label="型号" prop="model">
+        <el-form-item label="所属部门" prop="groupId">
-          <el-input v-model="form.model" placeholder="请输入型号" />
+          <el-select v-model="form.groupId" clearable placeholder="请选择所属部门" class="select-width">
+            <el-option
+              v-for="dict in groupList"
+              :key="dict.deptId"
+              :label="dict.deptName"
+              :value="dict.deptId"
+            ></el-option>
+          </el-select>
         </el-form-item>
-        <el-form-item label="网段" prop="network">
+        <el-form-item label="设备类型" prop="deviceType">
-          <el-input v-model="form.network" placeholder="请输入网段" />
+          <el-select v-model="form.deviceType" clearable placeholder="请选择设备类型" class="select-width">
+            <el-option
+              v-for="dict in deviceTypeList"
+              :key="dict.value"
+              :label="dict.label"
+              :value="dict.value"
+            ></el-option>
+          </el-select>
+        </el-form-item>
+        <el-row>
+          <el-col :span="12">
+            <el-form-item label="生产日期" prop="productionDate">
+              <el-date-picker
+                v-model="form.productionDate"
+                type="datetime"
+                placeholder="选择日期时间"
+              >
+              </el-date-picker>
+            </el-form-item>
+          </el-col>
+          <el-col :span="12">
+            <el-form-item label="使用年限" prop="durableYears">
+              <el-input-number v-model="form.durableYears" controls-position="right" :min="0">
+              </el-input-number>
+            </el-form-item>
+          </el-col>
+        </el-row>
+        <el-form-item label="安装位置" prop="installationSite">
+          <el-input v-model="form.installationSite" placeholder="请输入安装位置"/>
+        </el-form-item>
+        <el-form-item label="使用状态" prop="useState">
+          <el-select v-model="form.useState" clearable placeholder="请选择使用状态" class="select-width">
+            <el-option
+              v-for="dict in useStateList"
+              :key="dict.value"
+              :label="dict.label"
+              :value="dict.value"
+            ></el-option>
+          </el-select>
+        </el-form-item>
+        <el-form-item label="设备所属" prop="facilitiesType">
+          <el-select v-model="form.facilitiesType" clearable placeholder="请选择设备所属" class="select-width">
+            <el-option
+              v-for="dict in facilitiesTypeList"
+              :key="dict.value"
+              :label="dict.label"
+              :value="dict.value"
+            ></el-option>
+          </el-select>
         </el-form-item>
         <el-form-item label="备注">
           <!-- 脚本 -->
@@ -191,16 +368,23 @@
 </template>
 
 <script>
-import { listDevice, getDevice, delDevice, addDevice, updateDevice } from "@/api/system/device";
+import { getToken } from '@/utils/auth'
-import JsonEditor from '@/components/JsonEditor'
+import { listDevice, getDevice, delDevice, addDevice, updateDevice } from '@/api/system/device'
+import { listDept } from '@/api/system/dept'
+import { queryProduct } from '@/api/system/product'
+import JsonEditor from '@/components/Editor'
 
 export default {
-  name: "Device",
+  name: 'Device',
   components: {
     JsonEditor
   },
   data() {
     return {
+      //上传图片路径
+      reqFileUrl: process.env.VUE_APP_BASE_API + '/common/upload',
+      //限制图片格式
+      accept: '.jpg,.jpeg,.png,.JPG,.JPEG,.svg,.SVG',
       // 代码编辑器配置
       editorOptions: {
         mode: 'text', // 默认模式 tree,code,form,text,view
@@ -221,125 +405,284 @@ export default {
       // 【请填写功能名称】表格数据
       deviceList: [],
       // 弹出层标题
-      title: "",
+      title: '',
       // 是否显示弹出层
       open: false,
       // 查询参数
       queryParams: {
         pageNum: 1,
         pageSize: 10,
-        deviceNo: null,
+        stakeMark: null,
         deviceName: null,
         deviceIp: null,
         direction: null,
-        production: null,
+        groupId: null,
-        model: null,
+        deviceState: null,
-        network: null,
+        deviceType: null
-        content: null,
-        type: null
       },
       // 表单参数
       form: {},
       // 表单校验
       rules: {
+        stakeMark: [
+          { required: true, message: '请输入设备桩号', trigger: 'blur' }
+        ],
+        deviceName: [
+          { required: true, message: '请输入设备名称', trigger: 'blur' }
+        ],
+        deviceType: [
+          { required: true, message: '请输入设备类型', trigger: 'blur' }
+        ]
+      },
+      // 方向列表
+      directionList: [],
+      // 所属部门数据列表
+      groupList: [],
+      // 所属产品列表
+      productList: [],
+      // 设备状态列表
+      deviceStateList: [],
+      // 设备类型列表
+      deviceTypeList: [],
+      // 使用状态列表
+      useStateList: [],
+      // 设备所属列表
+      facilitiesTypeList: []
     }
-    };
   },
   created() {
-    this.getList();
+    this.getList()
+    this.directionList = [
+      {
+        label: '上行',
+        value: '1'
+      },
+      {
+        label: '中',
+        value: '2'
+      },
+      {
+        label: '下行',
+        value: '3'
+      }
+    ]
+    listDept().then(response => {
+      this.groupList = response.data
+    })
+    queryProduct().then(response => {
+      this.productList = response.data
+    })
+    this.deviceStateList = [
+      {
+        label: '异常',
+        value: '0'
+      },
+      {
+        label: '正常',
+        value: '1'
+      }
+    ]
+    this.deviceTypeList = [
+      {
+        label: '摄像机',
+        value: 1
+      },
+      {
+        label: '可变信息标志',
+        value: 2
+      },
+      {
+        label: '气象监测器',
+        value: 3
+      },
+      {
+        label: '出口诱导灯',
+        value: 4
+      },
+      {
+        label: '路段语音广播',
+        value: 5
+      },
+      {
+        label: '护栏碰撞',
+        value: 6
+      },
+      {
+        label: '毫米波雷达',
+        value: 7
+      },
+      {
+        label: '合流区预警',
+        value: 8
+      },
+      {
+        label: '智慧锥桶',
+        value: 9
+      },
+      {
+        label: '激光疲劳唤醒',
+        value: 10
+      },
+      {
+        label: '一类交通量调查站',
+        value: 11
+      },
+      {
+        label: '行车诱导',
+        value: 12
+      },
+      {
+        label: '智能设备箱',
+        value: 13
+      },
+      {
+        label: '光线在线监测',
+        value: 14
+      }
+    ]
+    this.useStateList = [
+      {
+        label: '未使用',
+        value: 0
+      },
+      {
+        label: '已使用',
+        value: 1
+      }
+    ]
+    this.facilitiesTypeList = [
+      {
+        label: '主干道',
+        value: '0'
+      },
+      {
+        label: '服务区',
+        value: '1'
+      },
+      {
+        label: '收费站',
+        value: '3'
+      }
+    ]
   },
   methods: {
+    //获得令牌
+    getToken() {
+      return getToken()
+    },
+    //上传图片后成功的操作
+    handleSuccess(response, file, fileList) {
+      this.form.deviceImg = response.url
+    },
+    //上传之前的操作 验证
+    beforeUpload(file) {
+      const isLt2M = file.size / 1024 / 1024 < 2    //这里做文件大小限制
+      if (!isLt2M) {
+        this.$message({
+          message: '上传文件大小不能超过 2M ',
+          type: 'warning'
+        })
+      }
+      return isLt2M
+    },
     /** 查询【请填写功能名称】列表 */
     getList() {
-      this.loading = true;
+      this.loading = true
       listDevice(this.queryParams).then(response => {
-        this.deviceList = response.rows;
+        this.deviceList = response.rows
-        this.total = response.total;
+        this.total = response.total
-        this.loading = false;
+        this.loading = false
-      });
+      })
     },
     // 取消按钮
     cancel() {
-      this.open = false;
+      this.open = false
-      this.reset();
+      this.reset()
     },
     // 表单重置
     reset() {
       this.form = {
         id: null,
-        deviceNo: null,
+        deviceImg: null,
+        iotDeviceId: null,
+        stakeMark: null,
         deviceName: null,
         deviceIp: null,
+        deviceCode: null,
         direction: null,
-        production: null,
+        productId: null,
-        model: null,
+        groupId: null,
-        network: null,
+        deviceState: null,
-        content: null,
+        productionDate: null,
-        type: null
+        durableYears: null,
-      };
+        installationSite: null,
-      this.resetForm("form");
+        useState: null,
+        facilitiesType: null
+      }
+      this.resetForm('form')
     },
     /** 搜索按钮操作 */
     handleQuery() {
-      this.queryParams.pageNum = 1;
+      this.queryParams.pageNum = 1
-      this.getList();
+      this.getList()
     },
     /** 重置按钮操作 */
     resetQuery() {
-      this.resetForm("queryForm");
+      this.resetForm('queryForm')
-      this.handleQuery();
+      this.handleQuery()
     },
     // 多选框选中数据
     handleSelectionChange(selection) {
       this.ids = selection.map(item => item.id)
-      this.single = selection.length!==1
+      this.single = selection.length !== 1
       this.multiple = !selection.length
     },
     /** 新增按钮操作 */
     handleAdd() {
-      this.reset();
+      this.reset()
-      this.open = true;
+      this.open = true
-      this.title = "添加【请填写功能名称】";
+      this.title = '添加【请填写功能名称】'
     },
     /** 修改按钮操作 */
     handleUpdate(row) {
-      this.reset();
+      this.reset()
       const id = row.id || this.ids
       getDevice(id).then(response => {
-        this.form = response.data;
+        this.form = response.data
-        this.open = true;
+        this.open = true
-        this.title = "修改【请填写功能名称】";
+        this.title = '修改【请填写功能名称】'
-      });
+      })
     },
     /** 提交按钮 */
     submitForm() {
-      this.$refs["form"].validate(valid => {
+      this.$refs['form'].validate(valid => {
         if (valid) {
           if (this.form.id != null) {
             updateDevice(this.form).then(response => {
-              this.$modal.msgSuccess("修改成功");
+              this.$modal.msgSuccess('修改成功')
-              this.open = false;
+              this.open = false
-              this.getList();
+              this.getList()
-            });
+            })
           } else {
             addDevice(this.form).then(response => {
-              this.$modal.msgSuccess("新增成功");
+              this.$modal.msgSuccess('新增成功')
-              this.open = false;
+              this.open = false
-              this.getList();
+              this.getList()
-            });
+            })
           }
         }
-      });
+      })
     },
     /** 删除按钮操作 */
     handleDelete(row) {
-      const ids = row.id || this.ids;
+      const ids = row.id || this.ids
       this.$modal.confirm('是否确认删除【请填写功能名称】编号为"' + ids + '"的数据项？').then(function() {
-        return delDevice(ids);
+        return delDevice(ids)
       }).then(() => {
-        this.getList();
+        this.getList()
-        this.$modal.msgSuccess("删除成功");
+        this.$modal.msgSuccess('删除成功')
-      }).catch(() => {});
+      }).catch(() => {
+      })
     },
     /** 导出按钮操作 */
     handleExport() {
@@ -348,5 +691,45 @@ export default {
       }, `device_${new Date().getTime()}.xlsx`)
     }
   }
-};
+}
 </script>
+
+<style lang="scss" scoped>
+
+$width: 150px;
+$height: 150px;
+
+::v-deep .el-upload {
+  border: 1px dashed #d9d9d9;
+  border-radius: 6px;
+  cursor: pointer;
+  position: relative;
+  overflow: hidden;
+  width: $width;
+  height: $height;
+}
+
+// 鼠标移入边框颜色
+::v-deep .el-upload:hover {
+  border-color: #409EFF;
+}
+
+.avatar-uploader-icon {
+  font-size: 28px;
+  color: #8c939d;
+  width: $width;
+  height: $height;
+  line-height: $height;
+  text-align: center;
+}
+
+.avatar {
+  width: $width;
+  height: $height;
+  display: block;
+}
+
+.photo {
+  margin-left: 30%;
+}
+</style>

zc-business/src/main/java/com/zc/business/domain/DcDevice.java

@@ -1,6 +1,8 @@
 package com.zc.business.domain;
 
+import com.baomidou.mybatisplus.annotation.IdType;
 import com.baomidou.mybatisplus.annotation.TableField;
+import com.baomidou.mybatisplus.annotation.TableId;
 import io.swagger.annotations.ApiModel;
 import io.swagger.annotations.ApiModelProperty;
 import lombok.Data;
@@ -20,6 +22,7 @@ public class DcDevice {
     public static final String ONLINE = "1";
 
     @ApiModelProperty("ID")
+    @TableId(value = "id", type = IdType.AUTO)
     private Long id;
     @ApiModelProperty("物联设备ID")
     private String iotDeviceId;
@@ -37,6 +40,8 @@ public class DcDevice {
     private String deviceCode;
     @ApiModelProperty("设备类型")
     private Integer deviceType;
+    @ApiModelProperty("设备图片")
+    private String deviceImg;
     @ApiModelProperty("安装日期")
     private Date installationDate;
     @ApiModelProperty("生产日期")
@@ -55,6 +60,10 @@ public class DcDevice {
     private String remark;
     @ApiModelProperty("设施归属类型（0:默认1: 道路沿线2:桥梁3: 隧道4:收费广场5: 收费站6: 服务区等")
     private String facilitiesType;
+    @ApiModelProperty("设备ip")
+    private String deviceIp;
+    @ApiModelProperty("范围桩号")
+    private String stakeMarkRange;
     @ApiModelProperty("创建时间")
     private Date createTime;
     @ApiModelProperty("修改时间")

zc-business/src/main/resources/mapper/business/DcDeviceMapper.xml

@@ -25,6 +25,10 @@ PUBLIC "-//mybatis.org//DTD Mapper 3.0//EN"
         <result property="remark" column="remark"/>
         <result property="createTime" column="create_time"/>
         <result property="updateTime" column="update_time"/>
+        <result property="facilitiesType" column="facilities_type"/>
+        <result property="deviceIp" column="device_ip"/>
+        <result property="stakeMarkRange" column="stake_mark_range"/>
+        <result property="deviceImg" column="device_img"/>
         <result property="longitude"    column="longitude"/>
         <result property="latitude"    column="latitude"/>
     </resultMap>
@@ -54,14 +58,19 @@ PUBLIC "-//mybatis.org//DTD Mapper 3.0//EN"
                other_config,
                remark,
                create_time,
-               update_time
+               update_time,
+               facilities_type,
+               device_ip,
+               stake_mark_range,
+               device_img
         from dc_device
     </sql>
 
 
     <select id="selectDcDeviceList" parameterType="dcDevice" resultMap="DcDevice">
         select t1.id, t1.iot_device_id, t1.group_id, t1.product_id, t1.stake_mark, t1.direction, t1.device_name, t1.device_code, t1.device_type,
-        t1.installation_Date,t1.production_date,t1.durable_years,t1.installation_site,t1.use_state,t1.device_state,t1.other_config,t1.remark,t1.create_time,t1.update_time,
+        t1.installation_Date,t1.production_date,t1.durable_years,t1.installation_site,t1.use_state,t1.device_state,t1.other_config,t1.remark,
+        t1.create_time,t1.update_time,t1.facilities_type,t1.device_ip,t1.stake_mark_range,t1.device_img,
         t1.facilities_type,t2.longitude,t2.latitude
         from dc_device t1
         left join dc_stake_mark t2 on t1.stake_mark = t2.stake_mark and t1.direction = t2.direction
@@ -85,6 +94,10 @@ PUBLIC "-//mybatis.org//DTD Mapper 3.0//EN"
             <if test="remark != null  and remark != ''">and t1.remark = #{remark}</if>
             <if test="createTime != null  and createTime != ''">and t1.create_time = #{createTime}</if>
             <if test="updateTime != null  and updateTime != ''">and t1.update_time = #{updateTime}</if>
+            <if test="facilitiesType != null  and facilitiesType != ''">and t1.facilities_type = #{facilitiesType}</if>
+            <if test="deviceIp != null  and deviceIp != ''">and t1.device_ip = #{deviceIp}</if>
+            <if test="stakeMarkRange != null  and stakeMarkRange != ''">and t1.stake_mark_range = #{stakeMarkRange}</if>
+            <if test="deviceImg != null  and deviceImg != ''">and t1.device_img = #{deviceImg}</if>
         </where>
 
     </select>