From 1bec05ea1679112d4a722943d557f7f48d529d2e Mon Sep 17 00:00:00 2001
From: sgj <1442489573@qq.com>
Date: 星期五, 05 十二月 2025 17:10:37 +0800
Subject: [PATCH] 智能抓拍页面修改
---
/dev/null | 63 ----
fzzy-igdss-web/src/main/resources/static/snapRecord/snapRecord.js | 278 +++++++++++++++++++++
fzzy-igdss-web/src/main/java/com/fzzy/sys/controller/snapRecord/SnapRecordController.java | 60 ++++
fzzy-igdss-core/src/main/java/com/fzzy/igds/service/SnapRecordService.java | 31 ++
fzzy-igdss-web/src/main/resources/static/snapRecord/snapRecord-style.css | 201 +++++++++++++++
fzzy-igdss-web/src/main/resources/templates/snapRecord/snapRecord.html | 105 ++++++++
fzzy-igdss-web/src/main/java/com/fzzy/sys/manager/snapRecord/SnapRecordManager.java | 42 +++
7 files changed, 717 insertions(+), 63 deletions(-)
diff --git a/fzzy-igdss-core/src/main/java/com/fzzy/igds/service/SnapRecordService.java b/fzzy-igdss-core/src/main/java/com/fzzy/igds/service/SnapRecordService.java
index 06f71df..86cc26a 100644
--- a/fzzy-igdss-core/src/main/java/com/fzzy/igds/service/SnapRecordService.java
+++ b/fzzy-igdss-core/src/main/java/com/fzzy/igds/service/SnapRecordService.java
@@ -1,6 +1,7 @@
package com.fzzy.igds.service;
import com.baomidou.mybatisplus.core.conditions.query.QueryWrapper;
+import com.baomidou.mybatisplus.extension.plugins.pagination.Page;
import com.fzzy.igds.data.BaseResp;
import com.fzzy.igds.data.IgdsBaseParam;
import com.fzzy.igds.domain.SnapRecord;
@@ -21,6 +22,36 @@
@Resource
private SnapRecordMapper snapRecordMapper;
+ /**
+ * 鍒嗛〉鏌ヨ鏁版嵁
+ *
+ * @param page
+ * @param param
+ */
+ public void listPage(Page<SnapRecord> page, IgdsBaseParam param) {
+ QueryWrapper<SnapRecord> queryWrapper = getQueryWrapper(param);
+ snapRecordMapper.selectPage(page, queryWrapper);
+ }
+
+ /**
+ * 灏佽鏌ヨ鏉′欢
+ *
+ * @param param
+ */
+ public QueryWrapper<SnapRecord> getQueryWrapper(IgdsBaseParam param) {
+ QueryWrapper<SnapRecord> queryWrapper = new QueryWrapper<>();
+
+ param.setCompanyId(ContextUtil.getCompanyId());
+ queryWrapper.eq("company_id", param.getCompanyId());
+
+ if (StringUtils.isNotBlank(param.getDeptId())) {
+ queryWrapper.eq("dept_id", param.getDeptId());
+ }
+ queryWrapper.orderByDesc("create_time");
+
+ return queryWrapper;
+ }
+
public List<SnapRecord> listAll(IgdsBaseParam param) {
if (null == param)
diff --git a/fzzy-igdss-view/src/main/java/com/fzzy/igds/SnapRecord.view.xml b/fzzy-igdss-view/src/main/java/com/fzzy/igds/SnapRecord.view.xml
deleted file mode 100644
index b1b0854..0000000
--- a/fzzy-igdss-view/src/main/java/com/fzzy/igds/SnapRecord.view.xml
+++ /dev/null
@@ -1,200 +0,0 @@
-<?xml version="1.0" encoding="UTF-8"?>
-<ViewConfig>
- <Arguments/>
- <Context/>
- <Model/>
- <View layout="padding:10">
- <ClientEvent name="onClick">
-/**
-* 鏌ヨ
-*/
-query = function(){
- view.get("#dsMain").flushAsync();
-}
</ClientEvent>
- <Property name="packages">font-awesome,css-common</Property>
- <DataSet id="dsMain">
- <Property name="loadMode">lazy</Property>
- <Property name="dataType">[dtSnapRecord]</Property>
- <Property name="dataProvider">snapRecordPR#listAll</Property>
- </DataSet>
- <DataSet id="dsParam">
- <ClientEvent name="onReady">self.insert({});</ClientEvent>
- <Property name="dataType">dtBaseParam</Property>
- </DataSet>
- <Container>
- <Property name="className">c-param</Property>
- <AutoForm>
- <Property name="cols">*,90,90,*,*</Property>
- <Property name="dataSet">dsParam</Property>
- <Property name="labelAlign">right</Property>
- <Property name="labelWidth">100</Property>
- <AutoFormElement>
- <Property name="name">deptId</Property>
- <Property name="property">deptId</Property>
- <Editor/>
- </AutoFormElement>
- <Button>
- <ClientEvent name="onClick">var param = view.get("#dsParam.data");
-console.log("param",param);
-view.get("#dsMain").set("parameter",param).flushAsync();
-</ClientEvent>
- <Property name="caption">鎼滅储</Property>
- <Property name="iconClass">fa fa-search</Property>
- <Property name="exClassName">btn-q1</Property>
- </Button>
- <Button>
- <ClientEvent name="onClick">view.get("#dsParam").set("data",{});</ClientEvent>
- <Property name="caption">閲嶇疆</Property>
- <Property name="exClassName">btn-q2</Property>
- <Property name="iconClass">fa fa-refresh</Property>
- </Button>
- </AutoForm>
- </Container>
- <Container>
- <Property name="className">c-data</Property>
- <ToolBar>
- <ToolBarButton>
- <ClientEvent name="onClick">view.get("#dsMain").insert({});
-view.get("#dialogMain").show();
-</ClientEvent>
- <Property name="caption">鏂板</Property>
- <Property name="exClassName">btn1</Property>
- <Property name="width">100</Property>
- <Property name="iconClass">fa fa-plus</Property>
- </ToolBarButton>
- <ToolBarButton>
- <ClientEvent name="onClick">var data = view.get("#dgMain").get("selection");
-view.get("#dialogMain").show();
- </ClientEvent>
- <Property name="id">btnUpdate</Property>
- <Property name="caption">淇敼</Property>
- <Property name="exClassName">btn2</Property>
- <Property name="width">100</Property>
- <Property name="iconClass">fa fa-pencil-square-o</Property>
- </ToolBarButton>
- <ToolBarButton>
- <ClientEvent name="onClick">var data = view.get("#dgMain").get("selection")
-if(!data){
- $alert("璇烽�夋嫨鏁版嵁");
- }else{
- view.get("#ajaxDelData").set("parameter", data).execute(function(result){
- if("200"!=result.code){
- $alert("寮傚父淇℃伅锛�"+result.message);
- }else{
- $notify("鎵ц鎴愬姛");
- query();
- }
- })
-}</ClientEvent>
- <Property name="caption">鍒犻櫎</Property>
- <Property name="exClassName">btn3</Property>
- <Property name="width">100</Property>
- <Property name="iconClass">fa fa-times</Property>
- </ToolBarButton>
- </ToolBar>
- <DataGrid id="dgMain" layoutConstraint="padding:8" selectionMode="singleRow">
- <ClientEvent name="onDataRowClick">self.set("selection", arg.data)</ClientEvent>
- <Property name="dataSet">dsMain</Property>
- <Property name="readOnly">true</Property>
- <RowSelectorColumn/>
- <RowNumColumn/>
- <DataColumn name="deptId">
- <Property name="property">deptId</Property>
- </DataColumn>
- <DataColumn name="cameraId">
- <Property name="property">cameraId</Property>
- </DataColumn>
- <DataColumn name="result">
- <Property name="property">result</Property>
- </DataColumn>
- <DataColumn name="snapTime">
- <Property name="property">snapTime</Property>
- </DataColumn>
- <DataColumn name="imgName">
- <Property name="property">imgName</Property>
- </DataColumn>
- <DataColumn name="imgPath">
- <Property name="property">imgPath</Property>
- </DataColumn>
- </DataGrid>
- </Container>
- <Dialog id="dialogMain" layout="regionPadding:8">
- <Property name="closeable">false</Property>
- <Property name="caption">鏅鸿兘鎶撴媿</Property>
- <Property name="width">1200</Property>
- <Property name="iconClass">fa fa-tasks</Property>
- <Buttons>
- <Button id="btnOk">
- <ClientEvent name="onClick">view.get("#saveAction").execute(function(){
- self.get("parent").hide();
-});</ClientEvent>
- <Property name="caption">淇濆瓨</Property>
- <Property name="iconClass">fa fa-check-circle</Property>
- <Property name="exClassName">btn1</Property>
- <Property name="width">120</Property>
- </Button>
- <Button>
- <ClientEvent name="onClick">view.get("#dsMain.data:#").cancel();
- self.get("parent").hide();</ClientEvent>
- <Property name="caption">鍙栨秷</Property>
- <Property name="exClassName">btn3</Property>
- <Property name="iconClass">fa fa-times-circle</Property>
- <Property name="width">120</Property>
- </Button>
- </Buttons>
- <Children>
- <Container>
- <AutoForm>
- <Property name="dataSet">dsMain</Property>
- <Property name="cols">*,*,*</Property>
- <Property name="labelAlign">right</Property>
- <Property name="labelSeparator">锛�</Property>
- <Property name="labelWidth">120</Property>
- <AutoFormElement>
- <Property name="name">deptId</Property>
- <Property name="property">deptId</Property>
- <Editor/>
- </AutoFormElement>
- <AutoFormElement>
- <Property name="name">cameraId</Property>
- <Property name="property">cameraId</Property>
- <Editor/>
- </AutoFormElement>
- <AutoFormElement>
- <Property name="name">result</Property>
- <Property name="property">result</Property>
- <Editor/>
- </AutoFormElement>
- <AutoFormElement>
- <Property name="name">snapTime</Property>
- <Property name="property">snapTime</Property>
- <Editor/>
- </AutoFormElement>
- <AutoFormElement>
- <Property name="name">imgName</Property>
- <Property name="property">imgName</Property>
- <Editor/>
- </AutoFormElement>
- <AutoFormElement>
- <Property name="name">imgPath</Property>
- <Property name="property">imgPath</Property>
- <Editor/>
- </AutoFormElement>
- </AutoForm>
- </Container>
- </Children>
- <Tools/>
- </Dialog>
- <UpdateAction id="saveAction">
- <Property name="dataResolver">snapRecordPR#saveUpdate</Property>
- <UpdateItem>
- <Property name="dataSet">dsMain</Property>
- <Property name="dataPath">[#current]</Property>
- </UpdateItem>
- </UpdateAction>
- <AjaxAction id="ajaxDelData">
- <Property name="confirmMessage">纭畾瑕佸垹闄ゆ暟鎹箞锛�</Property>
- <Property name="service">snapRecordPR#delete</Property>
- </AjaxAction>
- </View>
-</ViewConfig>
diff --git a/fzzy-igdss-view/src/main/java/com/fzzy/igds/SnapRecordPR.java b/fzzy-igdss-view/src/main/java/com/fzzy/igds/SnapRecordPR.java
deleted file mode 100644
index 5d6cb0c..0000000
--- a/fzzy-igdss-view/src/main/java/com/fzzy/igds/SnapRecordPR.java
+++ /dev/null
@@ -1,63 +0,0 @@
-package com.fzzy.igds;
-
-import com.bstek.dorado.annotation.DataProvider;
-import com.bstek.dorado.annotation.DataResolver;
-import com.bstek.dorado.annotation.Expose;
-import com.fzzy.igds.data.BaseResp;
-import com.fzzy.igds.data.IgdsBaseParam;
-import com.fzzy.igds.domain.SnapRecord;
-import com.fzzy.igds.service.SnapRecordService;
-import org.apache.commons.lang3.StringUtils;
-import org.springframework.stereotype.Component;
-import org.springframework.transaction.annotation.Transactional;
-
-import javax.annotation.Resource;
-import java.util.List;
-
-@Component
-public class SnapRecordPR {
-
- @Resource
- private SnapRecordService snapRecordService;
-
-
-
-
- /**
- * snapRecordPR#listAll
- * 璐ㄦ娂鍒楄〃
- */
- @DataProvider
- public List<SnapRecord> listAll(IgdsBaseParam param) {
- return snapRecordService.listAll(param);
- }
-
- /**
- * 淇濆瓨/鏇存柊
- *
- * @param snapRecord
- * @return
- */
- @Transactional
- @DataResolver
- public BaseResp saveUpdate(SnapRecord snapRecord) {
- if (null == snapRecord.getCreateTime()) {
- return snapRecordService.addData(snapRecord);
- } else {
- return snapRecordService.updateData(snapRecord);
- }
- }
-
-
- /**
- * 鍒犻櫎
- *
- * @param snapRecord
- * @return
- */
- @Expose
- public BaseResp delete(SnapRecord snapRecord) {
- if (StringUtils.isNotEmpty(snapRecord.getId())) return snapRecordService.deleteData(snapRecord);
- return BaseResp.success();
- }
-}
diff --git a/fzzy-igdss-web/src/main/java/com/fzzy/sys/controller/snapRecord/SnapRecordController.java b/fzzy-igdss-web/src/main/java/com/fzzy/sys/controller/snapRecord/SnapRecordController.java
new file mode 100644
index 0000000..b2ed31d
--- /dev/null
+++ b/fzzy-igdss-web/src/main/java/com/fzzy/sys/controller/snapRecord/SnapRecordController.java
@@ -0,0 +1,60 @@
+package com.fzzy.sys.controller.snapRecord;
+
+import com.baomidou.mybatisplus.extension.plugins.pagination.Page;
+import com.fzzy.igds.constant.RespCodeEnum;
+import com.fzzy.igds.data.IgdsBaseParam;
+import com.fzzy.igds.data.PageResponse;
+import com.fzzy.igds.domain.SnapRecord;
+import com.fzzy.sys.manager.snapRecord.SnapRecordManager;
+import lombok.extern.slf4j.Slf4j;
+import org.springframework.stereotype.Controller;
+import org.springframework.ui.Model;
+import org.springframework.web.bind.annotation.GetMapping;
+import org.springframework.web.bind.annotation.RequestBody;
+import org.springframework.web.bind.annotation.RequestMapping;
+import org.springframework.web.bind.annotation.ResponseBody;
+
+import javax.annotation.Resource;
+
+
+@Slf4j
+@Controller
+@RequestMapping("/snapRecord")
+public class SnapRecordController {
+
+ private static final String prefix = "snapRecord";
+
+ @Resource
+ private SnapRecordManager snapRecordManager;
+
+ @GetMapping
+ public String getSnapRecord(
+ Model model) {
+
+ IgdsBaseParam param = new IgdsBaseParam();
+ param.setPage(1);
+ param.setLimit(6);
+ Page<SnapRecord> images = snapRecordManager.pageData(param);
+ model.addAttribute("snapRecordList", images.getRecords());
+ model.addAttribute("currentPage", images.getCurrent());
+ model.addAttribute("totalItems", images.getTotal());
+ model.addAttribute("pageSize", images.getSize());
+ return prefix + "/snapRecord";
+ }
+
+ /**
+ * 鍒嗛〉鑾峰彇鏁版嵁
+ *
+ * @param param
+ * @return
+ */
+ @RequestMapping("/pageData")
+ @ResponseBody
+ public PageResponse<Page<SnapRecord>> pageData(@RequestBody IgdsBaseParam param) {
+ Page<SnapRecord> snapRecordPage = snapRecordManager.pageData(param);
+ if (null == snapRecordPage.getRecords() || snapRecordPage.getRecords().isEmpty()) {
+ return new PageResponse<>(RespCodeEnum.CODE_2000.getCode(), "鑾峰彇鍒版暟鎹俊鎭负绌�");
+ }
+ return new PageResponse<>(RespCodeEnum.CODE_0000, snapRecordPage);
+ }
+}
diff --git a/fzzy-igdss-web/src/main/java/com/fzzy/sys/manager/snapRecord/SnapRecordManager.java b/fzzy-igdss-web/src/main/java/com/fzzy/sys/manager/snapRecord/SnapRecordManager.java
new file mode 100644
index 0000000..ca8d371
--- /dev/null
+++ b/fzzy-igdss-web/src/main/java/com/fzzy/sys/manager/snapRecord/SnapRecordManager.java
@@ -0,0 +1,42 @@
+package com.fzzy.sys.manager.snapRecord;
+
+import com.baomidou.mybatisplus.extension.plugins.pagination.Page;
+import com.fzzy.igds.data.IgdsBaseParam;
+import com.fzzy.igds.domain.SnapRecord;
+import com.fzzy.igds.service.SnapRecordService;
+import com.fzzy.igds.utils.ContextUtil;
+import com.ruoyi.common.utils.StringUtils;
+import lombok.extern.slf4j.Slf4j;
+import org.springframework.stereotype.Component;
+
+import javax.annotation.Resource;
+import java.util.ArrayList;
+
+@Slf4j
+@Component
+public class SnapRecordManager {
+
+ @Resource
+ private SnapRecordService snapRecordService;
+
+ /**
+ * 鍒嗛〉鏌ヨ鏁版嵁
+ *
+ * @param param
+ * @return
+ */
+ public Page<SnapRecord> pageData(IgdsBaseParam param) {
+ if (StringUtils.isEmpty(param.getCompanyId())) {
+ param.setCompanyId(ContextUtil.getCompanyId());
+ }
+
+ Page<SnapRecord> corePage = new Page<>(param.getPage(), param.getLimit());
+ snapRecordService.listPage(corePage, param);
+
+ if (null == corePage.getRecords() || corePage.getRecords().isEmpty()) {
+ return corePage.setRecords(new ArrayList<>());
+ }
+
+ return corePage;
+ }
+}
diff --git a/fzzy-igdss-web/src/main/resources/static/snapRecord/snapRecord-style.css b/fzzy-igdss-web/src/main/resources/static/snapRecord/snapRecord-style.css
new file mode 100644
index 0000000..c773d4f
--- /dev/null
+++ b/fzzy-igdss-web/src/main/resources/static/snapRecord/snapRecord-style.css
@@ -0,0 +1,201 @@
+/* 鍥剧墖棰勮灞傛牱寮� */
+.img-preview {
+ display: none;
+ position: fixed;
+ top: 0;
+ left: 0;
+ width: 100%;
+ height: 100%;
+ background-color: rgba(0, 0, 0, 0.9);
+ z-index: 1000;
+ justify-content: center;
+ align-items: center;
+}
+
+.preview-content {
+ max-width: 90%;
+ max-height: 90%;
+ position: relative;
+}
+
+.preview-img {
+ max-width: 100%;
+ max-height: 90vh;
+ border-radius: 4px;
+ box-shadow: 0 5px 15px rgba(0, 0, 0, 0.3);
+}
+
+.close-preview {
+ position: absolute;
+ top: -40px;
+ right: -10px;
+ color: white;
+ font-size: 2rem;
+ cursor: pointer;
+ background: rgba(0, 0, 0, 0.5);
+ width: 40px;
+ height: 40px;
+ border-radius: 50%;
+ display: flex;
+ justify-content: center;
+ align-items: center;
+ transition: all 0.3s ease;
+}
+
+.close-preview:hover {
+ background: rgba(255, 255, 255, 0.2);
+ transform: scale(1.1);
+}
+
+/* 鍥剧墖缃戞牸鏍峰紡 */
+.gallery-grid {
+ display: grid;
+ grid-template-columns: repeat(auto-fill, minmax(350px, 1fr));
+ gap: 20px;
+ margin-bottom: 15px;
+}
+
+.gallery-item {
+ background: white;
+ border-radius: 8px;
+ overflow: hidden;
+ box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
+ transition: all 0.3s ease;
+}
+
+.gallery-item:hover {
+ transform: translateY(-5px);
+ box-shadow: 0 10px 20px rgba(0, 0, 0, 0.12);
+}
+
+.gallery-img {
+ width: 100%;
+ height: 195px;
+ object-fit: cover;
+ cursor: pointer;
+ transition: all 0.3s ease;
+}
+
+.gallery-img:hover {
+ opacity: 0.95;
+}
+
+.gallery-info {
+ padding: 15px;
+}
+
+.gallery-header {
+ display: flex;
+ justify-content: space-between;
+ align-items: center;
+ margin-bottom: 10px;
+}
+
+.gallery-title {
+ font-size: 1.5rem;
+ font-weight: 600;
+ color: #333;
+ margin: 0;
+ flex: 1;
+ white-space: nowrap;
+ overflow: hidden;
+ text-overflow: ellipsis;
+}
+
+.gallery-meta {
+ display: flex;
+ flex-direction: column;
+ gap: 2px;
+}
+
+.meta-item {
+ display: flex;
+ align-items: center;
+ font-size: 1.3rem;
+ color: #666;
+}
+
+.meta-item i {
+ width: 16px;
+ margin-right: 6px;
+ color: #999;
+ font-size: 1.25rem;
+}
+
+.gallery-filename i {
+ margin-right: 5px;
+ font-size: 0.7rem;
+}
+
+/* 鏍囩鏍峰紡 */
+.gallery-tags {
+ display: flex;
+ flex-wrap: wrap;
+ /*gap: 8px;*/
+ /*margin: 12px 0;*/
+}
+
+
+/* 鍒嗛〉鏍峰紡 */
+.pagination-container {
+ display: flex;
+ justify-content: center;
+ /*margin-top: 40px;*/
+}
+
+/* 绌虹姸鎬佹牱寮� */
+.empty-state {
+ grid-column: 1 / -1;
+ text-align: center;
+ padding: 60px 20px;
+ color: #999;
+}
+
+.empty-state i {
+ font-size: 4rem;
+ margin-bottom: 20px;
+ color: #ddd;
+}
+
+.empty-state h3 {
+ font-size: 1.5rem;
+ margin-bottom: 10px;
+ color: #666;
+}
+
+/* 鍝嶅簲寮忚璁� */
+@media (max-width: 992px) {
+ .gallery-grid {
+ grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
+ gap: 25px;
+ }
+}
+
+@media (max-width: 768px) {
+
+
+ .main-nav li {
+ margin: 0 10px;
+ }
+
+ .gallery-grid {
+ grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
+ gap: 20px;
+ }
+
+ .gallery-img {
+ height: 180px;
+ }
+
+}
+
+@media (max-width: 576px) {
+ .gallery-grid {
+ grid-template-columns: 1fr;
+ }
+
+ .gallery-img {
+ height: 200px;
+ }
+
+}
\ No newline at end of file
diff --git a/fzzy-igdss-web/src/main/resources/static/snapRecord/snapRecord.js b/fzzy-igdss-web/src/main/resources/static/snapRecord/snapRecord.js
new file mode 100644
index 0000000..01668a6
--- /dev/null
+++ b/fzzy-igdss-web/src/main/resources/static/snapRecord/snapRecord.js
@@ -0,0 +1,278 @@
+var layer;
+var laypage;
+
+$(function () {
+ // 鍒濆鍖栧垎椤�
+ layui.use(['laypage', 'layer'], function () {
+ layer = layui.layer;
+ laypage = layui.laypage;
+
+ // 鍒濆鍖栧垎椤电粍浠�
+ initPagination();
+ });
+
+ // 鍒濆鍖栧浘鐗囬瑙堝姛鑳�
+ initImagePreview();
+});
+
+/**
+ * 鍒濆鍖栧垎椤电粍浠�
+ */
+function initPagination() {
+ laypage.render({
+ elem: 'pagination',
+ count: typeof totalItems !== 'undefined' ? totalItems : 0,
+ limit: typeof pageSize !== 'undefined' ? pageSize : 6,
+ curr: typeof currentPage !== 'undefined' ? currentPage : 1,
+ layout: ['count', 'prev', 'page', 'next', 'refresh', 'skip'],
+ jump: function (obj, first) {
+ if (!first) {
+ searchRecord(obj.curr, obj.limit)
+ }
+ }
+ });
+}
+
+/**
+ * 閲嶆柊鍒濆鍖栧垎椤电粍浠�
+ * @param {number} totalCount - 鎬昏褰曟暟
+ * @param {number} pageSize - 姣忛〉澶у皬
+ * @param {number} currentPage - 褰撳墠椤电爜
+ */
+function reinitPagination(totalCount, pageSize, currentPage) {
+ laypage.render({
+ elem: 'pagination',
+ count: totalCount,
+ limit: pageSize,
+ curr: currentPage,
+ layout: ['count', 'prev', 'page', 'next', 'refresh', 'skip'],
+ jump: function (obj, first) {
+ if (!first) {
+ searchRecord(obj.curr, obj.limit)
+ }
+ }
+ });
+}
+
+/**
+ * 鑾峰彇鎶撴媿璁板綍鏁版嵁
+ * @param {Object} params - 鏌ヨ鍙傛暟瀵硅薄
+ * @param {Function} callback - 鍥炶皟鍑芥暟
+ */
+function fetchSnapRecordData(params, callback) {
+ $.ajax({
+ url: '../../snapRecord/pageData',
+ type: 'POST',
+ dataType: "json",
+ contentType: "application/json;charset=UTF-8",
+ data: JSON.stringify(params),
+ success: function (response) {
+ if (response.code === '0000') {
+ callback(null, response.data);
+ } else {
+ callback(new Error(response.msg || '鏁版嵁鍔犺浇澶辫触'), null);
+ }
+ },
+ error: function (xhr, status, error) {
+ callback(new Error('璇锋眰澶辫触锛岃绋嶅悗閲嶈瘯'), null);
+ }
+ });
+}
+
+/**
+ * 鏋勫缓鏌ヨ鍙傛暟
+ * @param {number} page - 椤电爜
+ * @param {number} size - 姣忛〉澶у皬
+ * @returns {Object} 鏌ヨ鍙傛暟瀵硅薄
+ */
+function buildQueryParams(page, size) {
+ var params = {
+ page: page,
+ limit: size
+ };
+
+ // 娣诲姞琛ㄥ崟鏌ヨ鏉′欢
+ var form = document.getElementById('snapRecord-form');
+ if (form) {
+ var inputs = form.querySelectorAll('input[name], select[name]');
+ inputs.forEach(function(input) {
+ if (input.value) { // 鍙坊鍔犻潪绌哄��
+ params[input.name] = input.value;
+ }
+ });
+ }
+
+ return params;
+}
+
+/**
+ * 鏇存柊鍥剧墖鐢诲粖鍐呭
+ * @param {Array} records - 鎶撴媿璁板綍鏁版嵁
+ */
+function updateGallery(records) {
+ var container = document.getElementById('gallery-container');
+ if (!container) return;
+
+ // 娓呯┖鐜版湁鍐呭
+ container.innerHTML = '';
+
+ if (!records || records.length === 0) {
+ // 鏄剧ず绌虹姸鎬�
+ container.innerHTML = `
+ <div class="empty-state">
+ <i class="fa-solid fa-camera-slash"></i>
+ <h3>鏆傛棤鎶撴媿璁板綍</h3>
+ <p>褰撳墠娌℃湁鍙睍绀虹殑鎶撴媿璁板綍鏁版嵁</p>
+ </div>
+ `;
+ // 闅愯棌鍒嗛〉
+ $('.pagination-container').hide();
+ return;
+ }
+
+ // 鏄剧ず鍒嗛〉
+ $('.pagination-container').show();
+
+ // 鐢熸垚鍥剧墖鍗＄墖
+ var html = '';
+ records.forEach(function(record) {
+ html += `
+ <div class="gallery-item">
+ <img src="/logo-sm.png" alt="${record.id}"
+ data-url="/logo-sm.png" data-id="${record.id}"
+ class="gallery-img" onclick="showSnapRecordPreview(this.getAttribute('data-url'))">
+ <div class="gallery-info">
+ <div class="gallery-header">
+ <h3 class="gallery-title">${record.id}</h3>
+ </div>
+ <div class="gallery-meta">
+ <div class="meta-item">
+ <i class="layui-icon layui-icon-home"></i>
+ <span>${record.deptId || ''}</span>
+ </div>
+ <div class="meta-item">
+ <i class="layui-icon layui-icon-video"></i>
+ <span>${record.cameraId || ''}</span>
+ </div>
+ <div class="meta-item">
+ <i class="layui-icon layui-icon-date"></i>
+ <span>${formatDate(record.snapTime)}</span>
+ </div>
+ </div>
+ <div class="gallery-tags">
+ <span class="tag-person">
+ <i class="layui-icon layui-icon-face-smile"></i>
+ <span>娴嬭瘯鏍囩</span>
+ </span>
+ </div>
+ </div>
+ </div>
+ `;
+ });
+
+ container.innerHTML = html;
+}
+
+/**
+ * 鏍煎紡鍖栨棩鏈�
+ * @param {string|number} date - 鏃ユ湡瀛楃涓叉垨鏃堕棿鎴�
+ */
+function formatDate(date) {
+ if (!date) return '';
+ var d = new Date(date);
+ return d.getFullYear() + '-' +
+ String(d.getMonth() + 1).padStart(2, '0') + '-' +
+ String(d.getDate()).padStart(2, '0') + ' ' +
+ String(d.getHours()).padStart(2, '0') + ':' +
+ String(d.getMinutes()).padStart(2, '0') + ':' +
+ String(d.getSeconds()).padStart(2, '0');
+}
+
+/**
+ * 鍒濆鍖栧浘鐗囬瑙堝姛鑳�
+ */
+function initImagePreview() {
+ var preview = document.getElementById('imgPreview');
+ var previewImg = document.getElementById('previewImg');
+ var closeBtn = document.getElementById('closePreview');
+
+ // 濡傛灉棰勮鍏冪礌涓嶅瓨鍦紝鍒欎笉鍒濆鍖�
+ if (!preview || !previewImg) {
+ return;
+ }
+
+ // 鍏抽棴鎸夐挳鐐瑰嚮浜嬩欢
+ if (closeBtn) {
+ closeBtn.addEventListener('click', closePreview);
+ }
+
+ // 鐐瑰嚮棰勮鍖哄煙澶栧叧闂�
+ preview.addEventListener('click', function (e) {
+ if (e.target === preview) {
+ closePreview();
+ }
+ });
+
+ // 閿洏浜嬩欢鐩戝惉
+ document.addEventListener('keydown', function (e) {
+ if (e.key === 'Escape' && preview.style.display === 'flex') {
+ closePreview();
+ }
+ });
+
+ // 鍏抽棴棰勮鍑芥暟
+ function closePreview() {
+ preview.style.display = 'none';
+ previewImg.src = '';
+ }
+}
+
+/**
+ * 鏄剧ず鍥剧墖棰勮
+ * @param {string} imgUrl 鍥剧墖URL
+ */
+function showSnapRecordPreview(imgUrl) {
+ var preview = document.getElementById('imgPreview');
+ var previewImg = document.getElementById('previewImg');
+
+ if (preview && previewImg) {
+ previewImg.src = imgUrl;
+ preview.style.display = 'flex';
+ }
+}
+
+/**
+ * 璇诲彇杞︾墝鍙�
+ */
+function searchRecord(page , size) {
+ var pageNumber = 1;
+ var sizeNumber = 6;
+ if (pageSize && pageSize > 0){
+ size = pageSize;
+ }
+
+ if (size && size > 0){
+ sizeNumber = size;
+ }
+ if (page && page > 0){
+ pageNumber = page;
+ }
+ // 鏋勯�犳煡璇㈠弬鏁帮紝浠庣涓�椤靛紑濮�
+ var queryParams = buildQueryParams(pageNumber, sizeNumber);
+ // 鏄剧ずloading
+ var loadingIndex = layer.load(1, {shade: [0.1, '#fff']});
+ // 璋冪敤鏁版嵁璇锋眰鏂规硶
+ fetchSnapRecordData(queryParams, function(error, data) {
+ // 鍏抽棴loading
+ layer.close(loadingIndex);
+ if (error) {
+ layer.msg(error.message);
+ return;
+ }
+
+ // 鏇存柊椤甸潰鏁版嵁
+ updateGallery(data.records);
+ // 閲嶆柊鍒濆鍖栧垎椤电粍浠�
+ reinitPagination(data.total, data.size, data.current);
+ });
+}
diff --git a/fzzy-igdss-web/src/main/resources/templates/snapRecord/snapRecord.html b/fzzy-igdss-web/src/main/resources/templates/snapRecord/snapRecord.html
new file mode 100644
index 0000000..e3f1bc1
--- /dev/null
+++ b/fzzy-igdss-web/src/main/resources/templates/snapRecord/snapRecord.html
@@ -0,0 +1,105 @@
+<!DOCTYPE html>
+<html lang="zh" xmlns:th="http://www.thymeleaf.org" xmlns:shiro="http://www.pollix.at/thymeleaf/shiro">
+<head>
+ <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
+ <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
+ <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
+ <meta name="renderer" content="webkit">
+ <th:block th:include="include :: header('鏅鸿兘鎶撴媿')" />
+ <link rel="stylesheet" type="text/css" th:href="@{/ajax/libs/layui-ruoyi/css/layui.css}"/>
+ <link rel="stylesheet" th:href="@{/snapRecord/snapRecord-style.css}">
+</head>
+<body class="gray-bg">
+<div class="container-div">
+ <div class="row">
+ <div class="col-sm-12 search-collapse">
+ <form id="snapRecord-form">
+ <div class="select-list">
+ <ul>
+ <li>
+ 鎵�灞炰粨搴擄細<input type="text" name="deptId"/>
+ </li>
+ <li>
+ <a class="btn btn-primary btn-rounded btn-sm" onclick="searchRecord()"><i class="fa fa-search"></i> 鎼滅储</a>
+ <a class="btn btn-warning btn-rounded btn-sm" onclick="$.form.reset()"><i class="fa fa-refresh"></i> 閲嶇疆</a>
+ </li>
+ </ul>
+ </div>
+ </form>
+ </div>
+
+ <div class="col-sm-12 " style="padding-top: 10px;">
+ <!-- 鍥剧墖缃戞牸 -->
+ <div class="gallery-grid" id="gallery-container">
+ <!-- 鍥剧墖涓虹┖鏃舵樉绀� -->
+ <div th:if="${#lists.isEmpty(snapRecordList)}" class="empty-state">
+ <i class="fa-solid fa-camera-slash"></i>
+ <h3>鏆傛棤鎶撴媿璁板綍</h3>
+ <p>褰撳墠娌℃湁鍙睍绀虹殑鎶撴媿璁板綍鏁版嵁</p>
+ </div>
+ <!-- 鍥剧墖鍗＄墖 -->
+ <div th:each="snapRecord : ${snapRecordList}" class="gallery-item">
+<!-- <img th:src="${snapRecord.imgPath}" th:alt="${snapRecord.id}"-->
+<!-- th:data-url="${snapRecord.imgPath}" th:data-id="${snapRecord.id}"-->
+ <img th:src="@{/logo-sm.png}" th:alt="${snapRecord.id}"
+ th:data-url="@{/logo-sm.png}" th:data-id="${snapRecord.id}"
+ class="gallery-img" onclick="showSnapRecordPreview(this.getAttribute('data-url'))">
+ <div class="gallery-info">
+ <div class="gallery-header">
+ <h3 class="gallery-title" th:text="${snapRecord.id}"></h3>
+ </div>
+
+ <div class="gallery-meta">
+ <div class="meta-item">
+ <i class="layui-icon layui-icon-home"></i>
+ <span th:text="${snapRecord.deptId}"></span>
+ </div>
+ <div class="meta-item">
+ <i class="layui-icon layui-icon-video"></i>
+ <span th:text="${snapRecord.cameraId}"></span>
+ </div>
+ <div class="meta-item">
+ <i class="layui-icon layui-icon-date"></i>
+ <span th:text="${#dates.format(snapRecord.snapTime, 'yyyy-MM-dd HH:mm:ss')}"></span>
+ </div>
+ </div>
+
+ <!-- 鏍囩鍒楄〃 -->
+ <div class="gallery-tags">
+ <span class="tag-person">
+ <i class="layui-icon layui-icon-face-smile"></i>
+ <span>娴嬭瘯鏍囩</span>
+ </span>
+ </div>
+
+ </div>
+ </div>
+ </div>
+
+ <!-- 鍒嗛〉鎺т欢 -->
+ <div class="pagination-container" th:if="${not #lists.isEmpty(snapRecordList)}">
+ <div id="pagination"></div>
+ </div>
+ </div>
+ </div>
+ <!-- 鍥剧墖棰勮灞� -->
+ <div class="img-preview" id="imgPreview">
+ <div class="preview-content">
+ <img src="" alt="棰勮鍥剧墖" class="preview-img" id="previewImg">
+ <div class="close-preview" id="closePreview">
+ <i class="layui-icon layui-icon-clear"></i>
+ </div>
+ </div>
+ </div>
+</div>
+<th:block th:include="include :: footer" />
+<script th:src="@{/ajax/libs/layui-ruoyi/layui.js}"></script>
+<script th:src="@{/snapRecord/snapRecord.js}"></script>
+<script th:inline="javascript">
+ var currentPage = [[${currentPage}]];
+ var totalItems = [[${totalItems}]];
+ var pageSize = [[${pageSize}]];
+</script>
+
+</body>
+</html>
\ No newline at end of file
--
Gitblit v1.9.3