新增 相机管理后管页面

jsowell-admin/src/main/java/com/jsowell/web/controller/pile/PileCameraInfoController.java

@@ -23,21 +23,21 @@ import com.jsowell.common.util.poi.ExcelUtil;
 import com.jsowell.common.core.page.TableDataInfo;
 
 /**
- * 【请填写功能名称】Controller
+ * 车位相机信息Controller
  *
  * @author jsowell
  * @date 2023-12-09
  */
 @RestController
-@RequestMapping("/pile/info")
+@RequestMapping("/pile/camera")
 public class PileCameraInfoController extends BaseController {
     @Autowired
     private IPileCameraInfoService pileCameraInfoService;
 
     /**
-     * 查询【请填写功能名称】列表
+     * 查询车位相机信息列表
      */
-    @PreAuthorize("@ss.hasPermi('pile:info:list')")
+    @PreAuthorize("@ss.hasPermi('pile:camera:list')")
     @GetMapping("/list")
     public TableDataInfo list(PileCameraInfo pileCameraInfo) {
         startPage();
@@ -46,51 +46,51 @@ public class PileCameraInfoController extends BaseController {
     }
 
     /**
-     * 导出【请填写功能名称】列表
+     * 导出车位相机信息列表
      */
-    @PreAuthorize("@ss.hasPermi('pile:info:export')")
-    @Log(title = "【请填写功能名称】", businessType = BusinessType.EXPORT)
+    @PreAuthorize("@ss.hasPermi('pile:camera:export')")
+    @Log(title = "车位相机信息", businessType = BusinessType.EXPORT)
     @PostMapping("/export")
     public void export(HttpServletResponse response, PileCameraInfo pileCameraInfo) {
         List<PileCameraInfo> list = pileCameraInfoService.selectPileCameraInfoList(pileCameraInfo);
         ExcelUtil<PileCameraInfo> util = new ExcelUtil<PileCameraInfo>(PileCameraInfo.class);
-        util.exportExcel(response, list, "【请填写功能名称】数据");
+        util.exportExcel(response, list, "车位相机信息数据");
     }
 
     /**
-     * 获取【请填写功能名称】详细信息
+     * 获取车位相机信息详细信息
      */
-    @PreAuthorize("@ss.hasPermi('pile:info:query')")
+    @PreAuthorize("@ss.hasPermi('pile:camera:query')")
     @GetMapping(value = "/{id}")
     public AjaxResult getInfo(@PathVariable("id") Long id) {
         return AjaxResult.success(pileCameraInfoService.selectPileCameraInfoById(id));
     }
 
     /**
-     * 新增【请填写功能名称】
+     * 新增车位相机信息
      */
-    @PreAuthorize("@ss.hasPermi('pile:info:add')")
-    @Log(title = "【请填写功能名称】", businessType = BusinessType.INSERT)
+    @PreAuthorize("@ss.hasPermi('pile:camera:add')")
+    @Log(title = "车位相机信息", businessType = BusinessType.INSERT)
     @PostMapping
     public AjaxResult add(@RequestBody PileCameraInfo pileCameraInfo) {
         return toAjax(pileCameraInfoService.insertPileCameraInfo(pileCameraInfo));
     }
 
     /**
-     * 修改【请填写功能名称】
+     * 修改车位相机信息
      */
-    @PreAuthorize("@ss.hasPermi('pile:info:edit')")
-    @Log(title = "【请填写功能名称】", businessType = BusinessType.UPDATE)
+    @PreAuthorize("@ss.hasPermi('pile:camera:edit')")
+    @Log(title = "车位相机信息", businessType = BusinessType.UPDATE)
     @PutMapping
     public AjaxResult edit(@RequestBody PileCameraInfo pileCameraInfo) {
         return toAjax(pileCameraInfoService.updatePileCameraInfo(pileCameraInfo));
     }
 
     /**
-     * 删除【请填写功能名称】
+     * 删除车位相机信息
      */
-    @PreAuthorize("@ss.hasPermi('pile:info:remove')")
-    @Log(title = "【请填写功能名称】", businessType = BusinessType.DELETE)
+    @PreAuthorize("@ss.hasPermi('pile:camera:remove')")
+    @Log(title = "车位相机信息", businessType = BusinessType.DELETE)
     @DeleteMapping("/{ids}")
     public AjaxResult remove(@PathVariable Long[] ids) {
         return toAjax(pileCameraInfoService.deletePileCameraInfoByIds(ids));

jsowell-pile/src/main/java/com/jsowell/pile/mapper/PileCameraInfoMapper.java

@@ -6,7 +6,7 @@ import com.jsowell.pile.domain.PileCameraInfo;
 import org.springframework.stereotype.Repository;
 
 /**
- * 【请填写功能名称】Mapper接口
+ * 车位相机信息Mapper接口
  *
  * @author jsowell
  * @date 2023-12-09
@@ -14,47 +14,47 @@ import org.springframework.stereotype.Repository;
 @Repository
 public interface PileCameraInfoMapper {
     /**
-     * 查询【请填写功能名称】
+     * 查询车位相机信息
      *
-     * @param id 【请填写功能名称】主键
-     * @return 【请填写功能名称】
+     * @param id 车位相机信息主键
+     * @return 车位相机信息
      */
     public PileCameraInfo selectPileCameraInfoById(Long id);
 
     /**
-     * 查询【请填写功能名称】列表
+     * 查询车位相机信息列表
      *
-     * @param pileCameraInfo 【请填写功能名称】
-     * @return 【请填写功能名称】集合
+     * @param pileCameraInfo 车位相机信息
+     * @return 车位相机信息集合
      */
     public List<PileCameraInfo> selectPileCameraInfoList(PileCameraInfo pileCameraInfo);
 
     /**
-     * 新增【请填写功能名称】
+     * 新增车位相机信息
      *
-     * @param pileCameraInfo 【请填写功能名称】
+     * @param pileCameraInfo 车位相机信息
      * @return 结果
      */
     public int insertPileCameraInfo(PileCameraInfo pileCameraInfo);
 
     /**
-     * 修改【请填写功能名称】
+     * 修改车位相机信息
      *
-     * @param pileCameraInfo 【请填写功能名称】
+     * @param pileCameraInfo 车位相机信息
      * @return 结果
      */
     public int updatePileCameraInfo(PileCameraInfo pileCameraInfo);
 
     /**
-     * 删除【请填写功能名称】
+     * 删除车位相机信息
      *
-     * @param id 【请填写功能名称】主键
+     * @param id 车位相机信息主键
      * @return 结果
      */
     public int deletePileCameraInfoById(Long id);
 
     /**
-     * 批量删除【请填写功能名称】
+     * 批量删除车位相机信息
      *
      * @param ids 需要删除的数据主键集合
      * @return 结果

jsowell-pile/src/main/java/com/jsowell/pile/service/IPileCameraInfoService.java

@@ -5,56 +5,56 @@ import java.util.List;
 import com.jsowell.pile.domain.PileCameraInfo;
 
 /**
- * 【请填写功能名称】Service接口
+ * 车位相机信息Service接口
  *
  * @author jsowell
  * @date 2023-12-09
  */
 public interface IPileCameraInfoService {
     /**
-     * 查询【请填写功能名称】
+     * 查询车位相机信息
      *
-     * @param id 【请填写功能名称】主键
-     * @return 【请填写功能名称】
+     * @param id 车位相机信息主键
+     * @return 车位相机信息
      */
     public PileCameraInfo selectPileCameraInfoById(Long id);
 
     /**
-     * 查询【请填写功能名称】列表
+     * 查询车位相机信息列表
      *
-     * @param pileCameraInfo 【请填写功能名称】
-     * @return 【请填写功能名称】集合
+     * @param pileCameraInfo 车位相机信息
+     * @return 车位相机信息集合
      */
     public List<PileCameraInfo> selectPileCameraInfoList(PileCameraInfo pileCameraInfo);
 
     /**
-     * 新增【请填写功能名称】
+     * 新增车位相机信息
      *
-     * @param pileCameraInfo 【请填写功能名称】
+     * @param pileCameraInfo 车位相机信息
      * @return 结果
      */
     public int insertPileCameraInfo(PileCameraInfo pileCameraInfo);
 
     /**
-     * 修改【请填写功能名称】
+     * 修改车位相机信息
      *
-     * @param pileCameraInfo 【请填写功能名称】
+     * @param pileCameraInfo 车位相机信息
      * @return 结果
      */
     public int updatePileCameraInfo(PileCameraInfo pileCameraInfo);
 
     /**
-     * 批量删除【请填写功能名称】
+     * 批量删除车位相机信息
      *
-     * @param ids 需要删除的【请填写功能名称】主键集合
+     * @param ids 需要删除的车位相机信息主键集合
      * @return 结果
      */
     public int deletePileCameraInfoByIds(Long[] ids);
 
     /**
-     * 删除【请填写功能名称】信息
+     * 删除车位相机信息信息
      *
-     * @param id 【请填写功能名称】主键
+     * @param id 车位相机信息主键
      * @return 结果
      */
     public int deletePileCameraInfoById(Long id);

jsowell-pile/src/main/java/com/jsowell/pile/service/impl/PileCameraInfoServiceImpl.java

@@ -10,7 +10,7 @@ import com.jsowell.pile.domain.PileCameraInfo;
 import com.jsowell.pile.service.IPileCameraInfoService;
 
 /**
- * 【请填写功能名称】Service业务层处理
+ * 车位相机信息Service业务层处理
  *
  * @author jsowell
  * @date 2023-12-09
@@ -21,10 +21,10 @@ public class PileCameraInfoServiceImpl implements IPileCameraInfoService {
     private PileCameraInfoMapper pileCameraInfoMapper;
 
     /**
-     * 查询【请填写功能名称】
+     * 查询车位相机信息
      *
-     * @param id 【请填写功能名称】主键
-     * @return 【请填写功能名称】
+     * @param id 车位相机信息主键
+     * @return 车位相机信息
      */
     @Override
     public PileCameraInfo selectPileCameraInfoById(Long id) {
@@ -32,10 +32,10 @@ public class PileCameraInfoServiceImpl implements IPileCameraInfoService {
     }
 
     /**
-     * 查询【请填写功能名称】列表
+     * 查询车位相机信息列表
      *
-     * @param pileCameraInfo 【请填写功能名称】
-     * @return 【请填写功能名称】
+     * @param pileCameraInfo 车位相机信息
+     * @return 车位相机信息
      */
     @Override
     public List<PileCameraInfo> selectPileCameraInfoList(PileCameraInfo pileCameraInfo) {
@@ -43,9 +43,9 @@ public class PileCameraInfoServiceImpl implements IPileCameraInfoService {
     }
 
     /**
-     * 新增【请填写功能名称】
+     * 新增车位相机信息
      *
-     * @param pileCameraInfo 【请填写功能名称】
+     * @param pileCameraInfo 车位相机信息
      * @return 结果
      */
     @Override
@@ -55,9 +55,9 @@ public class PileCameraInfoServiceImpl implements IPileCameraInfoService {
     }
 
     /**
-     * 修改【请填写功能名称】
+     * 修改车位相机信息
      *
-     * @param pileCameraInfo 【请填写功能名称】
+     * @param pileCameraInfo 车位相机信息
      * @return 结果
      */
     @Override
@@ -66,9 +66,9 @@ public class PileCameraInfoServiceImpl implements IPileCameraInfoService {
     }
 
     /**
-     * 批量删除【请填写功能名称】
+     * 批量删除车位相机信息
      *
-     * @param ids 需要删除的【请填写功能名称】主键
+     * @param ids 需要删除的车位相机信息主键
      * @return 结果
      */
     @Override
@@ -77,9 +77,9 @@ public class PileCameraInfoServiceImpl implements IPileCameraInfoService {
     }
 
     /**
-     * 删除【请填写功能名称】信息
+     * 删除车位相机信息信息
      *
-     * @param id 【请填写功能名称】主键
+     * @param id 车位相机信息主键
      * @return 结果
      */
     @Override

jsowell-ui/src/api/pile/camera.js

@@ -0,0 +1,44 @@
+import request from '@/utils/request'
+
+// 查询车位相机信息列表
+export function listCamera(query) {
+    return request({
+        url: '/pile/camera/list',
+        method: 'get',
+        params: query
+    })
+}
+
+// 查询车位相机信息详细
+export function getCamera(id) {
+    return request({
+        url: '/pile/camera/' + id,
+        method: 'get'
+    })
+}
+
+// 新增车位相机信息
+export function addCamera(data) {
+    return request({
+        url: '/pile/camera',
+        method: 'post',
+        data: data
+    })
+}
+
+// 修改车位相机信息
+export function updateCamera(data) {
+    return request({
+        url: '/pile/camera',
+        method: 'put',
+        data: data
+    })
+}
+
+// 删除车位相机信息
+export function delCamera(id) {
+    return request({
+        url: '/pile/camera/' + id,
+        method: 'delete'
+    })
+}

jsowell-ui/src/views/pile/camera/index.vue

@@ -0,0 +1,361 @@
+<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="deviceName">
+                <el-input
+                    v-model="queryParams.deviceName"
+                    placeholder="请输入设备名称"
+                    clearable
+                    @keyup.enter.native="handleQuery"
+                />
+            </el-form-item>
+            <el-form-item label="设备IP地址" prop="deviceIp">
+                <el-input
+                    v-model="queryParams.deviceIp"
+                    placeholder="请输入设备IP地址"
+                    clearable
+                    @keyup.enter.native="handleQuery"
+                />
+            </el-form-item>
+            <el-form-item label="设备sn号" prop="deviceSn">
+                <el-input
+                    v-model="queryParams.deviceSn"
+                    placeholder="请输入设备sn号"
+                    clearable
+                    @keyup.enter.native="handleQuery"
+                />
+            </el-form-item>
+            <el-form-item label="车牌号" prop="plateNumber">
+                <el-input
+                    v-model="queryParams.plateNumber"
+                    placeholder="请输入车牌号"
+                    clearable
+                    @keyup.enter.native="handleQuery"
+                />
+            </el-form-item>
+            <el-form-item label="车位状态" prop="parkingState">
+            <el-input
+                v-model="queryParams.parkingState"
+                placeholder="请输入车位状态"
+            clearable
+            @keyup.enter.native="handleQuery"
+            />
+            </el-form-item>
+            <el-form-item label="车位id" prop="zoneId">
+                <el-input
+                    v-model="queryParams.zoneId"
+                    placeholder="请输入车位id"
+                    clearable
+                    @keyup.enter.native="handleQuery"
+                />
+            </el-form-item>
+            <el-form-item label="车位名" prop="zoneName">
+                <el-input
+                    v-model="queryParams.zoneName"
+                    placeholder="请输入车位名"
+                    clearable
+                    @keyup.enter.native="handleQuery"
+                />
+            </el-form-item>
+            <el-form-item label="车牌颜色" prop="color">
+                <el-input
+                    v-model="queryParams.color"
+                    placeholder="请输入车牌颜色"
+                    clearable
+                    @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>
+            </el-form-item>
+        </el-form>
+
+        <el-row :gutter="10" class="mb8">
+            <el-col :span="1.5">
+                <el-button
+                    type="primary"
+                    plain
+                    icon="el-icon-plus"
+                    size="mini"
+                    @click="handleAdd"
+                    v-hasPermi="['pile:camera:add']"
+                >新增</el-button>
+            </el-col>
+            <el-col :span="1.5">
+                <el-button
+                    type="success"
+                    plain
+                    icon="el-icon-edit"
+                    size="mini"
+                    :disabled="single"
+                    @click="handleUpdate"
+                    v-hasPermi="['pile:camera:edit']"
+                >修改</el-button>
+            </el-col>
+            <el-col :span="1.5">
+                <el-button
+                    type="danger"
+                    plain
+                    icon="el-icon-delete"
+                    size="mini"
+                    :disabled="multiple"
+                    @click="handleDelete"
+                    v-hasPermi="['pile:camera:remove']"
+                >删除</el-button>
+            </el-col>
+            <el-col :span="1.5">
+                <el-button
+                    type="warning"
+                    plain
+                    icon="el-icon-download"
+                    size="mini"
+                    @click="handleExport"
+                    v-hasPermi="['pile:camera:export']"
+                >导出</el-button>
+            </el-col>
+            <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
+        </el-row>
+
+        <el-table v-loading="loading" :data="cameraList" @selection-change="handleSelectionChange">
+            <el-table-column type="selection" width="55" align="center" />
+<!--            <el-table-column label="" align="center" prop="id" />-->
+            <el-table-column label="设备名称" align="center" prop="deviceName" />
+            <el-table-column label="设备IP地址" align="center" prop="deviceIp" />
+            <el-table-column label="设备sn号" align="center" prop="deviceSn" />
+            <el-table-column label="车牌号" align="center" prop="plateNumber" />
+            <el-table-column label="车位状态" align="center" prop="parkingState" />
+            <el-table-column label="车位id" align="center" prop="zoneId" />
+            <el-table-column label="车位名" align="center" prop="zoneName" />
+            <el-table-column label="车牌颜色" align="center" prop="color" />
+            <el-table-column label="车牌类型" align="center" prop="plateType" />
+            <el-table-column label="图片base64编码" align="center" prop="image" width="100">
+                <template slot-scope="scope">
+                    <image-preview :src="scope.row.image" :width="50" :height="50"/>
+                </template>
+            </el-table-column>
+            <el-table-column label="操作" align="center" class-name="small-padding fixed-width">
+                <template slot-scope="scope">
+                    <el-button
+                        size="mini"
+                        type="text"
+                        icon="el-icon-edit"
+                        @click="handleUpdate(scope.row)"
+                        v-hasPermi="['pile:camera:edit']"
+                    >修改</el-button>
+                    <el-button
+                        size="mini"
+                        type="text"
+                        icon="el-icon-delete"
+                        @click="handleDelete(scope.row)"
+                        v-hasPermi="['pile:camera:remove']"
+                    >删除</el-button>
+                </template>
+            </el-table-column>
+        </el-table>
+
+        <pagination
+            v-show="total>0"
+            :total="total"
+            :page.sync="queryParams.pageNum"
+            :limit.sync="queryParams.pageSize"
+            @pagination="getList"
+        />
+
+        <!-- 添加或修改车位相机信息对话框 -->
+        <el-dialog :title="title" :visible.sync="open" width="500px" append-to-body>
+            <el-form ref="form" :model="form" :rules="rules" label-width="80px">
+                <el-form-item label="设备名称" prop="deviceName">
+                    <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-form-item>
+                <el-form-item label="设备sn号" prop="deviceSn">
+                    <el-input v-model="form.deviceSn" placeholder="请输入设备sn号" />
+                </el-form-item>
+                <el-form-item label="车牌号" prop="plateNumber">
+                    <el-input v-model="form.plateNumber" placeholder="请输入车牌号" />
+                </el-form-item>
+                <el-form-item label="车位状态" prop="parkingState">
+                <el-input v-model="form.parkingState" placeholder="请输入车位状态" />
+                </el-form-item>
+                <el-form-item label="车位id" prop="zoneId">
+                    <el-input v-model="form.zoneId" placeholder="请输入车位id" />
+                </el-form-item>
+                <el-form-item label="车位名" prop="zoneName">
+                    <el-input v-model="form.zoneName" placeholder="请输入车位名" />
+                </el-form-item>
+                <el-form-item label="车牌颜色" prop="color">
+                    <el-input v-model="form.color" placeholder="请输入车牌颜色" />
+                </el-form-item>
+                <el-form-item label="图片base64编码">
+                    <image-upload v-model="form.image"/>
+                </el-form-item>
+                <el-form-item label="" prop="delFlag">
+                    <el-input v-model="form.delFlag" placeholder="请输入" />
+                </el-form-item>
+            </el-form>
+            <div slot="footer" class="dialog-footer">
+                <el-button type="primary" @click="submitForm">确 定</el-button>
+                <el-button @click="cancel">取 消</el-button>
+            </div>
+        </el-dialog>
+    </div>
+</template>
+
+<script>
+import { listCamera, getCamera, delCamera, addCamera, updateCamera } from "@/api/pile/camera";
+
+export default {
+    name: "Camera",
+    data() {
+        return {
+            // 遮罩层
+            loading: true,
+            // 选中数组
+            ids: [],
+            // 非单个禁用
+            single: true,
+            // 非多个禁用
+            multiple: true,
+            // 显示搜索条件
+            showSearch: true,
+            // 总条数
+            total: 0,
+            // 车位相机信息表格数据
+            cameraList: [],
+            // 弹出层标题
+            title: "",
+            // 是否显示弹出层
+            open: false,
+            // 查询参数
+            queryParams: {
+                pageNum: 1,
+                pageSize: 10,
+                deviceName: null,
+                deviceIp: null,
+                deviceSn: null,
+                plateNumber: null,
+                parkingState: null,
+                zoneId: null,
+                zoneName: null,
+                color: null,
+                plateType: null,
+                image: null,
+            },
+            // 表单参数
+            form: {},
+            // 表单校验
+            rules: {
+            }
+        };
+    },
+    created() {
+        this.getList();
+    },
+    methods: {
+        /** 查询车位相机信息列表 */
+        getList() {
+            this.loading = true;
+            listCamera(this.queryParams).then(response => {
+                this.cameraList = response.rows;
+                this.total = response.total;
+                this.loading = false;
+            });
+        },
+        // 取消按钮
+        cancel() {
+            this.open = false;
+            this.reset();
+        },
+        // 表单重置
+        reset() {
+            this.form = {
+                id: null,
+                deviceName: null,
+                deviceIp: null,
+                deviceSn: null,
+                plateNumber: null,
+                parkingState: null,
+                zoneId: null,
+                zoneName: null,
+                color: null,
+                plateType: null,
+                image: null,
+                createTime: null,
+                delFlag: null
+            };
+            this.resetForm("form");
+        },
+        /** 搜索按钮操作 */
+        handleQuery() {
+            this.queryParams.pageNum = 1;
+            this.getList();
+        },
+        /** 重置按钮操作 */
+        resetQuery() {
+            this.resetForm("queryForm");
+            this.handleQuery();
+        },
+        // 多选框选中数据
+        handleSelectionChange(selection) {
+            this.ids = selection.map(item => item.id)
+            this.single = selection.length!==1
+            this.multiple = !selection.length
+        },
+        /** 新增按钮操作 */
+        handleAdd() {
+            this.reset();
+            this.open = true;
+            this.title = "添加车位相机信息";
+        },
+        /** 修改按钮操作 */
+        handleUpdate(row) {
+            this.reset();
+            const id = row.id || this.ids
+            getCamera(id).then(response => {
+                this.form = response.data;
+                this.open = true;
+                this.title = "修改车位相机信息";
+            });
+        },
+        /** 提交按钮 */
+        submitForm() {
+            this.$refs["form"].validate(valid => {
+                if (valid) {
+                    if (this.form.id != null) {
+                        updateCamera(this.form).then(response => {
+                            this.$modal.msgSuccess("修改成功");
+                            this.open = false;
+                            this.getList();
+                        });
+                    } else {
+                        addCamera(this.form).then(response => {
+                            this.$modal.msgSuccess("新增成功");
+                            this.open = false;
+                            this.getList();
+                        });
+                    }
+                }
+            });
+        },
+        /** 删除按钮操作 */
+        handleDelete(row) {
+            const ids = row.id || this.ids;
+            this.$modal.confirm('是否确认删除车位相机信息编号为"' + ids + '"的数据项？').then(function() {
+                return delCamera(ids);
+            }).then(() => {
+                this.getList();
+                this.$modal.msgSuccess("删除成功");
+            }).catch(() => {});
+        },
+        /** 导出按钮操作 */
+        handleExport() {
+            this.download('pile/camera/export', {
+                ...this.queryParams
+            }, `camera_${new Date().getTime()}.xlsx`)
+        }
+    }
+};
+</script>