rain/jiapu
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

家谱现有接口调试50%

Browse Source
This commit is contained in:
rain
2026-07-09 17:29:25 +08:00
commit 6050508144
262 changed files with 63354 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files
public/js/lay-module/mods/extend/jsan-notice.css
+96
View File
@@ -0,0 +1,96 @@
/**
消息盒子容器
*/
.lay-jsan-notice-marker {
position: absolute;
}
/**
消息盒子基础样式
*/
.lay-jsan-notice-marker-box {
/*position: absolute;*/
width: 35px;
height: 35px;
border: 1px solid #e2e2e2;
text-align: center;
line-height: 35px;
color: #e2e2e2;
float: left;
background-color: #ffffff;
}
/**
消息盒子鼠标悬停样式
*/
.lay-jsan-notice-marker-box:hover {
background-color: #f2f2f2;
color: #1E9FFF;
}
/**
消息盒子中图标样式
*/
.lay-jsan-notice-marker-icon {
font-size: 26px!important;
}
/**
最新消息，消息盒子样式
*/
.lay-jsan-notice-marker-news {
color: #FF5722!important;
}
/**
消息盒子操作按钮
*/
.lay-jsan-notice-marker-btn {
/*position: absolute;*/
width: 15px;
height: 35px;
border: 1px solid #e2e2e2;
text-align: center;
line-height: 35px;
color: #e2e2e2;
float: left;
background-color: #ffffff;
font-size: 16px;
}
.lay-jsan-notice-marker-btn:hover {
background-color: #f2f2f2;
color: #1E9FFF;
}
.lay-jsan-notice-marker-item {
padding: 5px 0 5px 10px;
background-color: #f2f2f2;
border-radius: 5px;
margin-bottom: 12px;
}
.lay-jsan-notice-marker-item:hover {
background-color: #dddddd;
cursor: pointer;
}
.lay-jsan-notice-marker-item-title-new {
color: #FF5722;
}
.lay-jsan-notice-marker-item-title {
font-size: 14px;
font-weight: bold;
}
.lay-jsan-notice-marker-item-date {
font-size: 10px;
color: #d2d2d2;
padding: 2px 0 2px 0;
}
.lay-jsan-notice-marker-item-content {
font-size: 12px;
color: #d2d2d2;
}
public/js/lay-module/mods/extend/jsan-notice.js
+243
View File
@@ -0,0 +1,243 @@
// noinspection ThisExpressionReferencesGlobalObjectJS
/**
* 基于layui v-2.5.4 版本，封装的消息组件
* 作者：jsan
* 日期：2019-07-28
*/
(function (root, factroy) {
typeof root.layui === "object" && layui.define ? layui.define(["layer"], function(mods){mods("jsanNotice", factroy(layui.layer))}) : factroy(root.layer);
}(this, function (layer) {
// //引入css
layui.link(layui.cache.base+"mods/extend/jsan-notice.css?v="+(new Date).getTime());
/**
* 消息盒子方法
* @param option 参数对象：
* elem 元素选择器，如：#test
* positionX 盒子左右定位位置[right,left]，默认right
* positionY 盒子相对位置，可以选择不同的单位长度，如：100px
* lowKey true隐藏，false显示
* noticeWindow 详细消息窗口属性
*/
layer.noticeMarker = function (option) {
const $ = layui.$,
that = {},
POSITION_X_STYLE = typeof option["positionX"] === "undefined" || option["positionX"] === "right" ? "right: 1px;" : option["positionX"]+" 1px;",
POSITION_Y_STYPE = typeof option["positionY"] === "undefined" ? "top: 0;" : "top: "+option["positionY"]+";",
MARKER = "lay-jsan-notice-marker",
MARKER_BOX = "lay-jsan-notice-marker-box",
MARKER_BOX_NEWS = "lay-jsan-notice-marker-news",
MARKER_BOX_ICON = "layui-icon layui-icon-speaker lay-jsan-notice-marker-icon",
MARKER_BOX_BTN = "lay-jsan-notice-marker-btn",
MARKER_BOX_HIDE_BTN_ICON = "layui-icon layui-icon-"+(typeof option["positionX"] === "undefined" || option["positionX"] === "right" ? "right" : "left"),
MARKER_BOX_SHOW_BTN_ICON = "layui-icon layui-icon-"+(typeof option["positionX"] === "undefined" || option["positionX"] === "right" ? "left" : "right");
that.properties = {}; //初始化属性
$(option.elem).hide(); //隐藏初始化元素
that.properties.index = NOTICE_MARKER_INDEX++; //消息框唯一标识
that.properties.isOpen = option["lowKey"]; //初始化是否显示
that.properties.option = option; //录入初始化配置
that.properties.option.positionX = typeof option["positionX"] === "undefined" ? "right" : option["positionX"]; //初始化定位
that.properties.option.positionY = typeof option["positionY"] === "undefined" ? "right" : option["positionY"]; //初始化定位
that.properties.marker = $("<div id='notice-marker-"+that.properties.index+"' class='"+MARKER+"' style='"+POSITION_X_STYLE+POSITION_Y_STYPE+"'></div>"); //容器
that.properties.markerBoxBtn = $("<div class='"+MARKER_BOX_BTN+"'></div>"); //提示显示角标
that.properties.markerBoxBtnIcon = $("<i class='"+MARKER_BOX_HIDE_BTN_ICON+"'></i>"); //提示显示角标
that.properties.markerBox = $("<div class='"+MARKER_BOX+"'></div>"); //消息盒子
that.properties.markerBoxIcon = $("<i class='"+MARKER_BOX_ICON+"'></i>"); //消息盒子图标
//初始化默认方法
/**
* 消息提醒方法
* @param option 参数对象
* lowKey true隐藏，false显示
*/
that.remind = function(option) {
if(option["lowKey"] && that.properties.isOpen) {
//提醒时不弹出
this.hideBox();
}else if(!option["lowKey"] && !that.properties.isOpen) {
this.showBox();
}
this.properties.markerBox.addClass(MARKER_BOX_NEWS);
this.properties.markerBoxBtn.addClass(MARKER_BOX_NEWS);
};
/**
* 隐藏消息盒子方法
*/
that.hideBox = function() {
if(this.properties.isOpen) {
this.properties.markerBox.hide();
this.properties.markerBoxBtnIcon.removeClass(MARKER_BOX_HIDE_BTN_ICON);
this.properties.markerBoxBtnIcon.addClass(MARKER_BOX_SHOW_BTN_ICON);
this.properties.isOpen = false;
}
};
/**
* 显示消息盒子方法
*/
that.showBox = function() {
if(!this.properties.isOpen) {
this.properties.markerBox.show();
this.properties.markerBoxBtnIcon.removeClass(MARKER_BOX_SHOW_BTN_ICON);
this.properties.markerBoxBtnIcon.addClass(MARKER_BOX_HIDE_BTN_ICON);
this.properties.isOpen = true;
}
};
//封装渲染
that.properties.markerBoxBtn.html(that.properties.markerBoxBtnIcon);
that.properties.markerBox.html(that.properties.markerBoxIcon);
that.properties.marker.html(that.properties.option["positionX"] === "left" ? that.properties.markerBox : that.properties.markerBoxBtn);
that.properties.marker.append(that.properties.option["positionX"] === "left" ? that.properties.markerBoxBtn : that.properties.markerBox);
$("body").append(that.properties.marker);
//隐藏/显示事件
that.properties.markerBoxBtn.unbind().on("click", that, function (event) {
event.data.properties.isOpen ? event.data.hideBox() : event.data.showBox();
});
//初始化详细消息窗口
/**
* type 1：组件自带消息窗口，2：打开用户自定义窗口，默认是1
* title 消息窗口标题
* classType 消息类型（type=1时生效） 属于Object类型 {"id": "name"} 如：{"notice": "通知", "alerted": "预警", "other": "其他"}
* url 自定义消息窗口时打开的链接
* width 消息窗口宽度 可以选择不同的单位长度，如：100px
* height 消息窗口高度 可以选择不同的单位长度，如：100px
* contentWidth 消息内容窗口宽度
* contentHeight 消息内容窗口高度
*/
if(typeof that.properties.option.noticeWindow === "object" && that.properties.option.noticeWindow["type"] !== 2) {
that.noticeWindow = {};
that.noticeWindow.index = that.properties.index;
that.noticeWindow.width = typeof that.properties.option.noticeWindow["width"] === "string" ? that.properties.option.noticeWindow["width"] : "150px";
that.noticeWindow.height = typeof that.properties.option.noticeWindow["height"] === "string" ? that.properties.option.noticeWindow["height"] : "560px";
that.noticeWindow.contentWidth = typeof that.properties.option.noticeWindow["contentWidth"] === "string" ? that.properties.option.noticeWindow["contentWidth"] : "650px";
that.noticeWindow.contentHeight = typeof that.properties.option.noticeWindow["contentHeight"] === "string" ? that.properties.option.noticeWindow["contentHeight"] : "560px";
that.noticeWindow.window = $("<div id='notice-marker-window-"+that.noticeWindow.index+"' class='layui-tab' lay-filter='notice-marker-window-"+that.noticeWindow.index+"'></div>");
that.noticeWindow.tabTitle = $("<ul id='notice-marker-window-title-"+that.noticeWindow.index+"' class='layui-tab-title'></ul>");
that.noticeWindow.tabContent = $("<div id='notice-marker-window-content-"+that.noticeWindow.index+"' class='layui-tab-content'></div>");
const classType = {};
if(typeof that.properties.option.noticeWindow["classType"] === "object") {
for(let tab in that.properties.option.noticeWindow["classType"]) {
classType[tab] = ["<li id='notice-marker-window-title-"+tab+"'>"+that.properties.option.noticeWindow["classType"][tab]+"<span class='layui-badge-dot layui-hide'></span></li>", "<div id='notice-marker-window-content-"+tab+"' lay-id='notice-marker-window-content-"+tab+"' class='layui-tab-item'></div>"];
}
}else {
classType['notice'] = ["<li id='notice-marker-window-title-notice'>消息</li>", "<div id='notice-marker-window-content-notice' lay-id='notice-marker-window-content-\"+tab+\"' class='layui-tab-item'></div>"];
}
that.noticeWindow.classType = classType;
//详细消息窗口渲染
that.noticeWindow.window.html(that.noticeWindow.tabTitle);
that.noticeWindow.window.append(that.noticeWindow.tabContent);
for(let tab in that.noticeWindow.classType) {
that.noticeWindow.tabTitle.append(that.noticeWindow.classType[tab][0]);
that.noticeWindow.tabContent.append(that.noticeWindow.classType[tab][1]);
}
that.noticeWindow.window.hide();
that.noticeWindow.tabTitle.find("li").eq(0).addClass("layui-this");
that.noticeWindow.tabContent.find(".layui-tab-item").eq(0).addClass("layui-show");
$("body").append(that.noticeWindow.window);
layui.use('element', function(){});
that.properties.markerBox.unbind().on("click", that, function (event) {
event.data.hideBox();
layer.open({
type: 1,
id: "notice-marker-window-layer-"+that.noticeWindow.index,
title: typeof event.data.properties.option.noticeWindow["title"] === "string" ? event.data.properties.option.noticeWindow["title"] : "<i class='layui-icon layui-icon-friends'></i>",
area: [event.data.noticeWindow.width - 12, event.data.noticeWindow.height],
offset: [event.data.properties.option.positionY, (that.properties.option["positionX"] === "right" ? ($("body").width()-16-Number(that.noticeWindow.width.replace("px", "")))+"px" : "16px")],
shade: 0,
maxmin: true,
content: $("#"+event.data.noticeWindow.window.attr("id")),
cancel: function () {
that.noticeWindow.window.hide();
}
});
event.data.properties.markerBox.removeClass(MARKER_BOX_NEWS);
event.data.properties.markerBoxBtn.removeClass(MARKER_BOX_NEWS);
});
/**
* 向消息窗口推送消息
* @param option 参数对象
* lowKey 是否使用盒子提醒 true不提醒，false提醒
* classTypeId 消息所属消息类型的id
* content 需要推送的类型集合 Array，每组数据包括：
* title 消息标题。最大27位长度，大于27会自动省略
* content 消息内容。最大44位长度，大于44位自动省略
* date 消息发布时间 yyyy-MM-dd HH:mm:ss
* url 点击消息后跳转位置
*/
that.addNews = function (option) {
for(let i in option.content) {
const item = $("<div class='lay-jsan-notice-marker-item' notice-url = '" + option.content[i]["url"] + "'></div>");
item.append("<div class='lay-jsan-notice-marker-item-title lay-jsan-notice-marker-item-title-new'>"+(option.content[i]["title"].length > 28 ? option.content[i]["title"].substring(0, 25)+"..." : option.content[i]["title"] )+"</div>");
item.append("<div class='lay-jsan-notice-marker-item-date'>"+option.content[i]["date"]+"</div>");
item.append("<div class='lay-jsan-notice-marker-item-content'>"+(option.content[i]["content"].length > 45 ? option.content[i]["content"].substring(0, 43)+"..." : option.content[i]["content"])+"</div>");
$("#notice-marker-window-content-"+option["classTypeId"]).prepend(item);
}
$("#notice-marker-window-title-"+option["classTypeId"]).find(".layui-badge-dot").removeClass("layui-hide");
noticeMarkerItemEvent(option, this);
const lowKey = typeof option["lowKey"] === "undefined" ? false : option["lowKey"];
this.remind({"lowKey": lowKey});
};
var noticeMarkerItemEvent = function (option, that) {
$("#notice-marker-window-content-"+option["classTypeId"]+" .lay-jsan-notice-marker-item").unbind().on("click", function (event) {
$(this).find(".lay-jsan-notice-marker-item-title").eq(0).removeClass("lay-jsan-notice-marker-item-title-new");
if($("#notice-marker-window-content-"+option["classTypeId"]).find(".lay-jsan-notice-marker-item-title-new").length === 0) {
$("#notice-marker-window-title-"+option["classTypeId"]).find(".layui-badge-dot").addClass("layui-hide");
}
$(this).attr("notice-url");
layer.open({
type: 2,
title: that.properties.option.noticeWindow["title"],
area: [that.noticeWindow.contentWidth, that.noticeWindow.contentHeight],
shade: 0,
maxmin: true,
content: $(this).attr("notice-url")
});
});
}
}else if(typeof that.properties.option.noticeWindow === "object" && that.properties.option.noticeWindow["type"] === 2) {
that.noticeWindow = {};
that.noticeWindow.index = that.properties.index;
that.noticeWindow.url = that.properties.option.noticeWindow["url"];
that.noticeWindow.width = typeof that.properties.option.noticeWindow["width"] === "string" ? that.properties.option.noticeWindow["width"] : "150px";
that.noticeWindow.height = typeof that.properties.option.noticeWindow["height"] === "string" ? that.properties.option.noticeWindow["height"] : "560px";
that.properties.markerBox.unbind().on("click", that, function (event) {
event.data.hideBox();
layer.open({
type: 2,
id: "notice-marker-window-layer-"+that.noticeWindow.index,
title: typeof event.data.properties.option.noticeWindow["title"] === "string" ? event.data.properties.option.noticeWindow["title"] : "<i class='layui-icon layui-icon-friends'></i>",
area: [event.data.noticeWindow.width, event.data.noticeWindow.height],
offset: [event.data.properties.option.positionY, (that.properties.option["positionX"] === "right" ? ($("body").width()-16-Number(that.noticeWindow.width.replace("px", "")))+"px" : "16px")],
shade: 0,
maxmin: true,
content: event.data.noticeWindow.url
});
});
}
//初始显示设置
that.properties.isOpen ? that.hideBox() : that.showBox();
return that;
};
return {mod: "jsanNotice", v: "1.0.11"};
}));
NOTICE_MARKER_INDEX = 1;