工程进度更新页面搭建

src/main/java/com/bonus/digitalSignage/backstage/controller/ProProgressController.java

@@ -37,7 +37,7 @@ public class ProProgressController {
     @PostMapping(value = "getList")
     @DecryptAndVerify(decryptedClass = QueryParamDto.class)//加解密统一管理
     @LogAnnotation(operModul = "综合查询-工程进度更新", operation = "查询列表", operDesc = "系统级事件",operType="查询")
-//    @PreAuthorize("@pms.hasPermission('comprehensive:data:query')")
+    @PreAuthorize("@pms.hasPermission('comprehensive:data:query')")
     public ServerResponse getList(EncryptedReq<QueryParamDto> dto) {
         PageHelper.startPage(dto.getData().getPageNum(), dto.getData().getPageSize());
         return service.getList(dto.getData());
@@ -47,7 +47,7 @@ public class ProProgressController {
     @PostMapping("downloadExcel")
     @DecryptAndVerify(decryptedClass = QueryParamDto.class)//加解密统一管理
     @LogAnnotation(operModul = "工程进度更新-工程进度更新", operation = "导出列表", operDesc = "系统级事件",operType="导出")
-//    @PreAuthorize("@pms.hasPermission('comprehensive:data:export')")
+    @PreAuthorize("@pms.hasPermission('comprehensive:data:export')")
     public void downloadExcel(HttpServletResponse response, EncryptedReq<QueryParamDto> dto) {
         service.downloadExcel(dto.getData(),response);
     }
@@ -56,7 +56,7 @@ public class ProProgressController {
     @PostMapping("detailQuery")
     @DecryptAndVerify(decryptedClass = QueryParamDto.class)//加解密统一管理
     @LogAnnotation(operModul = "工程进度更新-更新进度", operation = "查询详情", operDesc = "系统级事件",operType="查询")
-//    @PreAuthorize("@pms.hasPermission('comprehensive:data:detailQuery')")
+    @PreAuthorize("@pms.hasPermission('comprehensive:data:detailQuery')")
     public ServerResponse detailQuery(HttpServletResponse response, EncryptedReq<QueryParamDto> dto) {
         return service.detailQuery(dto.getData());
     }

src/main/java/com/bonus/digitalSignage/backstage/entity/vo/ProProgressVo.java

@@ -42,12 +42,12 @@ public class ProProgressVo {
     /**
      * 项目进度
      */
-    @Excel(name = "项目进度", width = 30.0, orderNum = "3")
+    @Excel(name = "项目进度(%)", width = 30.0, orderNum = "3")
     private double proProgress;
     /**
      * 更新时间
      */
-    @Excel(name = "更新时间", width = 30.0, orderNum = "4")
+    @Excel(name = "更新时间", width = 30.0, orderNum = "4",format = "yyyy-MM-dd HH:mm:ss",timezone = "GMT+8")
     @JsonFormat(pattern = "yyyy-MM-dd HH:mm:ss", timezone = "GMT+8")
     private Date updateTime;
     /**

src/main/resources/static/js/synthesisQuery/proProgressUpdate.js

@@ -0,0 +1,187 @@
+let form, layer, table, tableIns,element;
+let pageNum = 1, limitSize = 10; // 默认第一页，分页数量为10
+layui.use(['form', 'layer', 'table','element'], function () {
+    form = layui.form;
+    layer = layui.layer;
+    table = layui.table;
+    element = layui.element;
+    layui.form.render();
+    pages(1, 10, 1);
+    element.render();
+})
+
+function pages(pageNum, pageSize, typeNum) {
+    let params = getReqParams(pageNum, pageSize, typeNum);
+    let url = dataUrl + "/backstage/proProgress/getList"
+    ajaxRequest(url, "POST", params, true, function () {
+    }, function (result) {
+        console.log(result);
+        if (result.code === 200) {
+            if (result.data) {
+                initTable(result.data, result.limit, result.curr)
+                laypages(result.count, result.curr, result.limit)
+                element.render();
+            }
+        } else if (result.code === 500) {
+            layer.alert(result.msg, {icon: 2})
+        }
+    }, function (xhr) {
+        error(xhr)
+    });
+
+}
+
+function laypages(total, page, limit) {
+    layui.use(['laypage'], function () {
+        let laypage = layui.laypage;
+        laypage.render({
+            elem: 'voi-page',
+            count: total,
+            curr: page,
+            limit: limit,
+            limits: [10, 20, 50, 100, 200, 500],
+            layout: ['prev', 'page', 'next', 'skip', 'count', 'limit'],
+            groups: 5,
+            jump: function (obj, first) {
+                if (!first) {
+                    pageNum = obj.curr, limitSize = obj.limit;
+                    pages(obj.curr, obj.limit, null);
+                }
+            }
+        });
+    })
+}
+
+/*初始化表格*/
+function initTable(dataList, limit, page) {
+    let loadingMsg = layer.msg("数据加载中,请稍候...", {icon: 16, scrollbar: false, time: 0,});
+    pageNum = page, limitSize = limit;
+    tableIns = table.render({
+        elem: "#table_data",
+        height: "full-150",
+        data: dataList,
+        limit: limit,
+        cols: [
+            [
+                {
+                    title: "序号", width: "5%", unresize: true, align: "center",
+                    templet: function (d) {
+                        return (page - 1) * limit + d.LAY_NUM;
+                    }
+                },
+                {field: "proName", title: "项目名称", width: "30%", unresize: true, align: "center"},
+                {field: "voltageLevel", title: "电压等级", width: "10%", unresize: true, align: "center"},
+                {title: "项目进度", width: "20%", unresize: true, align: "center",templet: schedule},
+                {field: "updateUserName", title: "更新人", width: "10%", unresize: true, align: "center"},
+                {field: "updateTime", title: "更新时间", width: "15%", unresize: true, align: "center"},
+                {
+                    title: "操作", unresize: true, width: "10%", align: "center",
+                    templet: function (d) {
+                        let html = '';
+                        let view = "<a style='cursor:pointer;margin: 0 2px;' title='进度更新' onclick='viewData("+JSON.stringify(d)+")'><img src='../../img/synthesisQuery/update_progress.png'></a>"
+                        html = view;
+                        return html;
+                    }
+                },
+            ],
+        ],
+        done: function (res, curr, count) {
+            layer.close(loadingMsg);
+            table.resize("table_data");
+            count || this.elem.next(".layui-table-view").find(".layui-table-header").css("display", "inline-block");
+            count || this.elem.next(".layui-table-view").find(".layui-table-box").css("overflow", "auto");
+            element.render();
+        },
+    });
+}
+
+
+// 获取参数
+function getReqParams(page, limit, type) {
+    let obj = {};
+    if (!type) {
+        obj = {
+            pageNum: page + "",
+            pageSize: limit + "",
+            keyWord: $('#keyWord').val(),
+
+        };
+    } else {
+        obj = {
+            pageNum: '1',
+            pageSize: '10',
+            keyWord: '',
+        };
+    }
+    obj = {
+        encryptedData: encryptCBC(JSON.stringify(obj))
+    }
+    return obj;
+}
+
+// 查询/重置
+function query(type) {
+    pageNum = 1;
+    if(type === 2){
+        $('#keyWord').val('');
+        layui.form.render();
+    }
+    pages(1, limitSize);
+}
+/**详情*/
+function viewData(obj){
+    openIframeByParamObj("viewData", "详情", "./proClassifyStatisticsDetail.html", "92%", "95%", obj);
+}
+
+/*下载*/
+function downloadExcel(){
+    let obj = {
+        id: $('#proId').val()
+    }
+    let params = {
+        encryptedData: encryptCBC(JSON.stringify(obj))
+    }
+    let loadingMsg = layer.msg("数据导出中,请稍候...", {icon: 16, scrollbar: false, time: 0,});
+    let url = dataUrl + "/backstage/proProgress/downloadExcel?token=" + tokens + "&encryptedData=" + encodeURIComponent(encryptCBC(JSON.stringify(obj)));
+    let xhr = new XMLHttpRequest();
+    xhr.open("post", url, true);
+    xhr.responseType = "blob"; // 转换流
+    xhr.setRequestHeader('Content-Type','application/json;charset=UTF-8')
+    xhr.onload = function () {
+        layer.close(loadingMsg);
+        if (this.status === 200) {
+            let blob = this.response;
+            var a = document.createElement("a");
+            var url = window.URL.createObjectURL(blob);
+            a.href = url;
+            a.download = "工程进度更新" + ".xlsx"; // 文件名
+        } else {
+            layer.msg("数据导出发生异常,请稍后重试", {icon: 16, scrollbar: false, time: 2000});
+        }
+        a.click();
+        window.URL.revokeObjectURL(url);
+    };
+    // xhr.send(params);
+    xhr.send();
+}
+
+// 设置进度值
+function schedule(d) {
+    d.proProgress = parseFloat(d.proProgress ? d.proProgress : 0);
+    d.filter == undefined ? (d.filter = (pageNum - 1) * limitSize + d.LAY_NUM) : d.filter;
+    d.proProgress == undefined ? (d.proProgress = 100) : d.proProgress;
+    var color = "layui-bg-orange";
+    if (d.proProgress < 100) {
+        color = "layui-bg-orange";
+    } else if (d.proProgress === 100) {
+        color = "layui-bg-primary";
+    } else if (d.proProgress > 100) {
+        color = "layui-bg-blue";
+    }
+    //设置页面进度条
+    return (
+        '<div class="layui-progress layui-progress-big" lay-showpercent="true" id="' + d.filter + '" lay-filter="proProgress' + d.filter + '">' +
+        '<div class="layui-progress-bar ' + color + '" lay-percent="' + d.proProgress + '%">' +
+        "</div></div>"
+    );
+}

src/main/resources/static/pages/synthesisQuery/proProgressUpdate.html

@@ -0,0 +1,59 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <link rel="stylesheet" href="../../js/layui-v2.9.14/layui/css/layui.css">
+    <link rel="stylesheet" href="../../css/font.css">
+    <link rel="stylesheet" href="../../css/table-common2.css">
+    <script src="../../js/libs/jquery-3.7.0.min.js" charset="UTF-8" type="text/javascript"></script>
+    <script src="../../js/layui-v2.9.14/layui/layui.js" charset="UTF-8" type="text/javascript"></script>
+    <script src="../../js/publicJs.js"></script>
+    <script src="../../js/commonUtils.js"></script>
+    <script src="../../js/select.js"></script>
+    <script src="../../js/openIframe.js"></script>
+    <script src="../../js/my/aes.js"></script>
+    <script src="../../js/ajaxRequest.js"></script>
+    <title>工程进度更新</title>
+</head>
+<body>
+<div id="content">
+    <div class="basic-search-box layout">
+        <form class="layui-form basic-form" onsubmit="return false;">
+            <div class="layui-form-item">
+                <div class="layui-inline" style="padding: 0 0 0 10px;">
+                    <div class="layui-input-inline">
+                        <input class="layui-input" type="text" id="keyWord" placeholder="搜索关键词" autocomplete="off" maxlength="50">
+                    </div>
+                </div>
+                <div class="layui-inline btns">
+                    <button type="button" class="layui-btn layui-btn-normal layui-btn-sm btn-1" onclick="query(1)">查询
+                    </button>
+                    <button type="button" class="layui-btn layui-btn-normal layui-btn-sm btn-1" onclick="query(2)">重置
+                    </button>
+                    <button type="button" class="layui-btn layui-btn-primary layui-btn-sm" onclick="downloadExcel()">导出
+                    </button>
+                </div>
+            </div>
+        </form>
+    </div>
+    <div class="table-box" table-responsive style="z-index: 1;">
+        <table id="table_data" class="table" lay-filter="table_data"></table>
+        <div id="voi-page" class="layout"></div>
+    </div>
+</div>
+</body>
+<style>
+    .layui-table-init {
+        background-color: transparent !important;
+    }
+
+    .num-btn > span {
+        font-weight: bold;
+    }
+    .layui-table-cell div {
+        display: block;
+        margin: 0;
+    }
+</style>
+<script src="../../js/synthesisQuery/proProgressUpdate.js" charset="UTF-8" type="text/javascript"></script>
+</html>