更新本地js
This commit is contained in:
@@ -95,6 +95,7 @@ public class jobController {
|
|||||||
*/
|
*/
|
||||||
@GetMapping("getJobDataTableMarge")
|
@GetMapping("getJobDataTableMarge")
|
||||||
public ApiResult<?> getJobDataTableMarge() {
|
public ApiResult<?> getJobDataTableMarge() {
|
||||||
|
syncRemoveData();
|
||||||
QueryWrapper<BizDbConfig> queryWrapper = new QueryWrapper<>();
|
QueryWrapper<BizDbConfig> queryWrapper = new QueryWrapper<>();
|
||||||
queryWrapper.eq("is_enabled", "1");
|
queryWrapper.eq("is_enabled", "1");
|
||||||
List<BizDbConfig> configs = bizDbConfigService.list(queryWrapper);
|
List<BizDbConfig> configs = bizDbConfigService.list(queryWrapper);
|
||||||
@@ -178,4 +179,14 @@ public class jobController {
|
|||||||
bizDeviceInfoService.save(deviceInfo);
|
bizDeviceInfoService.save(deviceInfo);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
public void syncRemoveData() {
|
||||||
|
QueryWrapper<DataTableInfo> dataTableWrapper = new QueryWrapper<>();
|
||||||
|
dataTableWrapper.le("create_time", DateUtils.dsValueNDaysAgo(3));
|
||||||
|
dataTableInfoService.remove(dataTableWrapper);
|
||||||
|
|
||||||
|
QueryWrapper<DataTableField> fieldWrapper = new QueryWrapper<>();
|
||||||
|
fieldWrapper.le("create_time", DateUtils.dsValueNDaysAgo(3));
|
||||||
|
dataTableFieldService.remove(fieldWrapper);
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -5,6 +5,7 @@ import com.mini.capi.biz.domain.BizHomeUser;
|
|||||||
import com.mini.capi.biz.service.BizHomeUserService;
|
import com.mini.capi.biz.service.BizHomeUserService;
|
||||||
import com.mini.capi.model.auth.LoginRequest;
|
import com.mini.capi.model.auth.LoginRequest;
|
||||||
import com.mini.capi.model.info.TodoHandleDTO;
|
import com.mini.capi.model.info.TodoHandleDTO;
|
||||||
|
import com.mini.capi.utils.AESUtil;
|
||||||
import jakarta.annotation.Resource;
|
import jakarta.annotation.Resource;
|
||||||
import jakarta.servlet.http.HttpServletRequest;
|
import jakarta.servlet.http.HttpServletRequest;
|
||||||
import jakarta.servlet.http.HttpServletResponse;
|
import jakarta.servlet.http.HttpServletResponse;
|
||||||
@@ -38,7 +39,7 @@ public class LoginController {
|
|||||||
String password = loginRequest.getPassword();
|
String password = loginRequest.getPassword();
|
||||||
|
|
||||||
QueryWrapper<BizHomeUser> queryWrapper = new QueryWrapper<>();
|
QueryWrapper<BizHomeUser> queryWrapper = new QueryWrapper<>();
|
||||||
queryWrapper.eq("user_name", username).eq("password", password);
|
queryWrapper.eq("user_name", username).eq("password", AESUtil.encrypt(password));
|
||||||
BizHomeUser user = userService.getOne(queryWrapper);
|
BizHomeUser user = userService.getOne(queryWrapper);
|
||||||
if (user != null) {
|
if (user != null) {
|
||||||
request.getSession().setAttribute("currentUser", user);
|
request.getSession().setAttribute("currentUser", user);
|
||||||
|
|||||||
@@ -66,7 +66,6 @@ public class AESUtil {
|
|||||||
*/
|
*/
|
||||||
public static String decrypt(String content, String key) {
|
public static String decrypt(String content, String key) {
|
||||||
try {
|
try {
|
||||||
|
|
||||||
SecretKeySpec skey = new SecretKeySpec(key.getBytes(), algorithm);
|
SecretKeySpec skey = new SecretKeySpec(key.getBytes(), algorithm);
|
||||||
IvParameterSpec iv = new IvParameterSpec(key.getBytes(charset), 0, offset);
|
IvParameterSpec iv = new IvParameterSpec(key.getBytes(charset), 0, offset);
|
||||||
Cipher cipher = Cipher.getInstance(transformation);
|
Cipher cipher = Cipher.getInstance(transformation);
|
||||||
|
|||||||
@@ -68,4 +68,10 @@ public class DateUtils {
|
|||||||
// 格式化日期为yyyymmdd
|
// 格式化日期为yyyymmdd
|
||||||
return currentDate.format(DATE_FORMATTER);
|
return currentDate.format(DATE_FORMATTER);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
|
public static String dsValueNDaysAgo(long days) {
|
||||||
|
LocalDate targetDate = LocalDate.now().minusDays(days);
|
||||||
|
return targetDate.format(DATE_FORMATTER);
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -261,6 +261,7 @@
|
|||||||
<label for="folderParent" class="block text-sm font-medium text-text-secondary mb-1">父文件夹</label>
|
<label for="folderParent" class="block text-sm font-medium text-text-secondary mb-1">父文件夹</label>
|
||||||
<select id="folderParent"
|
<select id="folderParent"
|
||||||
class="w-full px-3 py-2 border border-border-color rounded-md focus:outline-none focus:ring-2 focus:ring-accent focus:border-transparent">
|
class="w-full px-3 py-2 border border-border-color rounded-md focus:outline-none focus:ring-2 focus:ring-accent focus:border-transparent">
|
||||||
|
<option value="0">/</option>
|
||||||
<option th:each="folders : ${folderTrees}" th:value="${folders.getFolder().getFolderId()}"
|
<option th:each="folders : ${folderTrees}" th:value="${folders.getFolder().getFolderId()}"
|
||||||
th:text="${folders.getFolder().getFolderName()}"></option>
|
th:text="${folders.getFolder().getFolderName()}"></option>
|
||||||
</select>
|
</select>
|
||||||
|
|||||||
@@ -1,348 +0,0 @@
|
|||||||
<!DOCTYPE html>
|
|
||||||
<html lang="zh-CN">
|
|
||||||
<head>
|
|
||||||
<meta charset="UTF-8">
|
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
||||||
<title>超大容量快捷图标库（300+）</title>
|
|
||||||
<!-- 引入外部资源 -->
|
|
||||||
<script src="https://cdn.tailwindcss.com"></script>
|
|
||||||
<link href="https://cdn.jsdelivr.net/npm/font-awesome@4.7.0/css/font-awesome.min.css" rel="stylesheet">
|
|
||||||
<script src="https://cdn.jsdelivr.net/npm/lodash@4.17.21/lodash.min.js"></script>
|
|
||||||
|
|
||||||
<!-- Tailwind 配置 -->
|
|
||||||
<script>
|
|
||||||
tailwind.config = {
|
|
||||||
theme: {
|
|
||||||
extend: {
|
|
||||||
colors: {
|
|
||||||
primary: '#165DFF',
|
|
||||||
secondary: '#36CFC9',
|
|
||||||
success: '#52C41A',
|
|
||||||
warning: '#FAAD14',
|
|
||||||
danger: '#FF4D4F',
|
|
||||||
purple: '#722ED1',
|
|
||||||
blue: '#1890FF',
|
|
||||||
green: '#00B42A',
|
|
||||||
yellow: '#FF7D00',
|
|
||||||
indigo: '#4096ff',
|
|
||||||
pink: '#f5222d',
|
|
||||||
cyan: '#13c2c2',
|
|
||||||
orange: '#fa8c16',
|
|
||||||
dark: '#1D2129',
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<!-- 自定义工具类 -->
|
|
||||||
<style type="text/tailwindcss">
|
|
||||||
@layer utilities {
|
|
||||||
.icon-card {
|
|
||||||
@apply flex flex-col items-center p-4 rounded-xl border border-gray-200 hover:border-primary hover:shadow-md transition-all duration-300 cursor-pointer;
|
|
||||||
}
|
|
||||||
|
|
||||||
.icon-container {
|
|
||||||
@apply w-14 h-14 rounded-full flex items-center justify-center mb-3 text-xl;
|
|
||||||
}
|
|
||||||
|
|
||||||
.icon-search-highlight {
|
|
||||||
@apply bg-primary/5 border-primary/30;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
</head>
|
|
||||||
<body class="bg-gray-50 p-4 md:p-6">
|
|
||||||
<div class="max-w-7xl mx-auto">
|
|
||||||
<!-- 头部与搜索区 -->
|
|
||||||
<div class="mb-8">
|
|
||||||
<h1 class="text-2xl md:text-3xl font-bold text-dark mb-2">快捷图标库（300+图标）</h1>
|
|
||||||
<p class="text-gray-600 mb-6">海量功能图标与名称组合，支持搜索和筛选</p>
|
|
||||||
|
|
||||||
<!-- 搜索与筛选区 -->
|
|
||||||
<div class="flex flex-col sm:flex-row gap-4 mb-6">
|
|
||||||
<div class="relative flex-1">
|
|
||||||
<input
|
|
||||||
type="text"
|
|
||||||
id="iconSearch"
|
|
||||||
placeholder="搜索图标名称或类名（如：数据库、fa-database）..."
|
|
||||||
class="w-full py-3 pl-10 pr-4 rounded-lg border border-gray-200 focus:outline-none focus:border-primary focus:ring-1 focus:ring-primary transition-all"
|
|
||||||
>
|
|
||||||
<i class="fa fa-search absolute left-3 top-1/2 -translate-y-1/2 text-gray-400"></i>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="flex gap-2">
|
|
||||||
<select id="colorFilter"
|
|
||||||
class="py-3 px-4 rounded-lg border border-gray-200 focus:outline-none focus:border-primary focus:ring-1 focus:ring-primary">
|
|
||||||
<option value="all">所有颜色</option>
|
|
||||||
<option value="primary"> primary</option>
|
|
||||||
<option value="secondary"> secondary</option>
|
|
||||||
<option value="success"> success</option>
|
|
||||||
<option value="warning"> warning</option>
|
|
||||||
<option value="danger"> danger</option>
|
|
||||||
<option value="purple"> purple</option>
|
|
||||||
</select>
|
|
||||||
|
|
||||||
<button id="resetFilter" class="py-3 px-4 bg-gray-100 hover:bg-gray-200 rounded-lg transition-colors">
|
|
||||||
<i class="fa fa-refresh mr-1"></i> 重置
|
|
||||||
</button>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<!-- 统计信息 -->
|
|
||||||
<div class="text-sm text-gray-500 mb-2">
|
|
||||||
<span id="iconCount">0</span> 个图标（显示 <span id="visibleCount">0</span> 个）
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<!-- 图标网格容器 -->
|
|
||||||
<div id="iconGrid"
|
|
||||||
class="grid grid-cols-2 sm:grid-cols-3 md:grid-cols-4 lg:grid-cols-6 xl:grid-cols-8 gap-4 md:gap-6">
|
|
||||||
<!-- 图标将通过JavaScript动态生成 -->
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<!-- 使用说明 -->
|
|
||||||
<div class="mt-10 p-4 bg-white rounded-lg border border-gray-200">
|
|
||||||
<h3 class="font-bold mb-3">使用说明</h3>
|
|
||||||
<ul class="list-disc pl-5 text-gray-600 space-y-2 text-sm">
|
|
||||||
<li>每个图标下方显示了对应的Font Awesome类名（如fa-database）</li>
|
|
||||||
<li>点击图标可复制其HTML代码到剪贴板</li>
|
|
||||||
<li>支持按名称、类名搜索和按颜色筛选</li>
|
|
||||||
<li>如需调整颜色，可修改容器的bg-*和text-*类（如bg-primary/10和text-primary）</li>
|
|
||||||
<li>Font Awesome官方文档：<a href="https://fontawesome.com/v4/icons/" class="text-primary hover:underline"
|
|
||||||
target="_blank">https://fontawesome.com/v4/icons/</a></li>
|
|
||||||
</ul>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<!-- 复制成功提示 -->
|
|
||||||
<div id="copyToast"
|
|
||||||
class="fixed bottom-6 right-6 bg-success text-white px-4 py-2 rounded-lg shadow-lg opacity-0 transition-opacity duration-300 flex items-center">
|
|
||||||
<i class="fa fa-check-circle mr-2"></i> 已复制到剪贴板
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<script>
|
|
||||||
// 颜色池 - 用于随机分配图标颜色
|
|
||||||
const colorPool = [
|
|
||||||
'primary', 'secondary', 'success', 'warning', 'danger',
|
|
||||||
'purple', 'blue', 'green', 'yellow', 'indigo', 'pink', 'cyan', 'orange'
|
|
||||||
];
|
|
||||||
|
|
||||||
// 基础图标数据（50个示例，实际使用时可扩展到300+）
|
|
||||||
const baseIcons = [
|
|
||||||
{name: '数据库管理', icon: 'fa-database'},
|
|
||||||
{name: '性能监控', icon: 'fa-line-chart'},
|
|
||||||
{name: '用户管理', icon: 'fa-user-circle'},
|
|
||||||
{name: '安全中心', icon: 'fa-shield'},
|
|
||||||
{name: '日志审计', icon: 'fa-file-text'},
|
|
||||||
{name: '系统设置', icon: 'fa-cog'},
|
|
||||||
{name: '备份恢复', icon: 'fa-cloud-upload'},
|
|
||||||
{name: 'API接口', icon: 'fa-plug'},
|
|
||||||
{name: '告警中心', icon: 'fa-bell'},
|
|
||||||
{name: '网络配置', icon: 'fa-wifi'},
|
|
||||||
{name: '存储管理', icon: 'fa-hdd-o'},
|
|
||||||
{name: '任务调度', icon: 'fa-calendar-check-o'},
|
|
||||||
{name: '消息中心', icon: 'fa-envelope'},
|
|
||||||
{name: '报表分析', icon: 'fa-bar-chart'},
|
|
||||||
{name: '帮助中心', icon: 'fa-question-circle'},
|
|
||||||
{name: '服务器管理', icon: 'fa-server'},
|
|
||||||
{name: '代码仓库', icon: 'fa-code'},
|
|
||||||
{name: '项目管理', icon: 'fa-tasks'},
|
|
||||||
{name: '团队管理', icon: 'fa-users'},
|
|
||||||
{name: '密钥管理', icon: 'fa-key'},
|
|
||||||
{name: '流量分析', icon: 'fa-area-chart'},
|
|
||||||
{name: '访问控制', icon: 'fa-ban'},
|
|
||||||
{name: '风险检测', icon: 'fa-exclamation-triangle'},
|
|
||||||
{name: '国际化设置', icon: 'fa-language'},
|
|
||||||
{name: '资源下载', icon: 'fa-download'},
|
|
||||||
{name: '文件上传', icon: 'fa-upload'},
|
|
||||||
{name: '定时任务', icon: 'fa-clock-o'},
|
|
||||||
{name: '数据地图', icon: 'fa-map'},
|
|
||||||
{name: '文档中心', icon: 'fa-book'},
|
|
||||||
{name: '收藏夹', icon: 'fa-star'},
|
|
||||||
{name: '邮件系统', icon: 'fa-envelope-o'},
|
|
||||||
{name: '即时通讯', icon: 'fa-comments'},
|
|
||||||
{name: '视频会议', icon: 'fa-video-camera'},
|
|
||||||
{name: '语音通话', icon: 'fa-phone'},
|
|
||||||
{name: '数据同步', icon: 'fa-exchange'},
|
|
||||||
{name: '缓存清理', icon: 'fa-trash'},
|
|
||||||
{name: '病毒扫描', icon: 'fa-bug'},
|
|
||||||
{name: '防火墙', icon: 'fa-shield'},
|
|
||||||
{name: '负载均衡', icon: 'fa-balance-scale'},
|
|
||||||
{name: '容器管理', icon: 'fa-cubes'},
|
|
||||||
{name: '虚拟机', icon: 'fa-desktop'},
|
|
||||||
{name: '云存储', icon: 'fa-cloud'},
|
|
||||||
{name: 'CDN加速', icon: 'fa-bolt'},
|
|
||||||
{name: 'DNS配置', icon: 'fa-sitemap'},
|
|
||||||
{name: 'SSL证书', icon: 'fa-lock'},
|
|
||||||
{name: 'API文档', icon: 'fa-file-code-o'},
|
|
||||||
{name: '错误跟踪', icon: 'fa-bug'},
|
|
||||||
{name: '性能分析', icon: 'fa-tachometer'},
|
|
||||||
{name: '代码审查', icon: 'fa-search'}
|
|
||||||
];
|
|
||||||
|
|
||||||
// 扩展到300个图标（通过组合基础图标+功能前缀）
|
|
||||||
function generate300Icons() {
|
|
||||||
const prefixes = [
|
|
||||||
'用户', '系统', '数据', '安全', '网络', '存储', '应用',
|
|
||||||
'服务', '设备', '终端', '日志', '监控', '分析', '报表',
|
|
||||||
'配置', '管理', '运维', '开发', '测试', '生产', '备份',
|
|
||||||
'恢复', '同步', '迁移', '部署', '发布', '更新', '升级',
|
|
||||||
'降级', '回滚', '审计', '统计', '查询', '过滤', '导出',
|
|
||||||
'导入', '打印', '分享', '协作', '权限', '角色', '部门'
|
|
||||||
];
|
|
||||||
|
|
||||||
const icons = [...baseIcons];
|
|
||||||
let currentLength = baseIcons.length;
|
|
||||||
|
|
||||||
// 循环生成直到达到300个
|
|
||||||
while (currentLength < 300) {
|
|
||||||
// 随机组合前缀和基础图标
|
|
||||||
const randomPrefix = prefixes[Math.floor(Math.random() * prefixes.length)];
|
|
||||||
const randomBase = baseIcons[Math.floor(Math.random() * baseIcons.length)];
|
|
||||||
|
|
||||||
// 避免重复名称
|
|
||||||
const newName = `${randomPrefix}${randomBase.name}`;
|
|
||||||
if (!icons.some(icon => icon.name === newName)) {
|
|
||||||
icons.push({
|
|
||||||
name: newName,
|
|
||||||
icon: randomBase.icon // 复用基础图标
|
|
||||||
});
|
|
||||||
currentLength++;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
return icons;
|
|
||||||
}
|
|
||||||
|
|
||||||
// 生成所有图标
|
|
||||||
const allIcons = generate300Icons();
|
|
||||||
const iconGrid = document.getElementById('iconGrid');
|
|
||||||
const iconCountEl = document.getElementById('iconCount');
|
|
||||||
const visibleCountEl = document.getElementById('visibleCount');
|
|
||||||
const copyToast = document.getElementById('copyToast');
|
|
||||||
|
|
||||||
// 初始化图标网格
|
|
||||||
function renderIcons(iconsToRender = allIcons) {
|
|
||||||
// 清空网格
|
|
||||||
iconGrid.innerHTML = '';
|
|
||||||
|
|
||||||
// 渲染图标
|
|
||||||
iconsToRender.forEach(icon => {
|
|
||||||
// 随机分配颜色（也可根据需要固定颜色）
|
|
||||||
const color = colorPool[Math.floor(Math.random() * colorPool.length)];
|
|
||||||
|
|
||||||
const iconCard = document.createElement('div');
|
|
||||||
iconCard.className = 'icon-card';
|
|
||||||
iconCard.dataset.name = icon.name;
|
|
||||||
iconCard.dataset.icon = icon.icon;
|
|
||||||
iconCard.dataset.color = color;
|
|
||||||
|
|
||||||
iconCard.innerHTML = `
|
|
||||||
<div class="icon-container bg-${color}/10 text-${color}">
|
|
||||||
<i class="fa ${icon.icon}"></i>
|
|
||||||
</div>
|
|
||||||
<span class="font-medium text-center">${icon.name}</span>
|
|
||||||
<div class="text-xs text-gray-500 mt-1">${icon.icon}</div>
|
|
||||||
`;
|
|
||||||
|
|
||||||
// 点击复制功能
|
|
||||||
iconCard.addEventListener('click', () => {
|
|
||||||
const html = `
|
|
||||||
<div class="icon-card">
|
|
||||||
<div class="icon-container bg-${color}/10 text-${color}">
|
|
||||||
<i class="fa ${icon.icon}"></i>
|
|
||||||
</div>
|
|
||||||
<span class="font-medium">${icon.name}</span>
|
|
||||||
<div class="text-xs text-gray-500 mt-2">${icon.icon}</div>
|
|
||||||
</div>
|
|
||||||
`.trim();
|
|
||||||
|
|
||||||
navigator.clipboard.writeText(html).then(() => {
|
|
||||||
// 显示复制成功提示
|
|
||||||
copyToast.style.opacity = '1';
|
|
||||||
setTimeout(() => {
|
|
||||||
copyToast.style.opacity = '0';
|
|
||||||
}, 2000);
|
|
||||||
});
|
|
||||||
});
|
|
||||||
|
|
||||||
iconGrid.appendChild(iconCard);
|
|
||||||
});
|
|
||||||
|
|
||||||
// 更新统计
|
|
||||||
iconCountEl.textContent = allIcons.length;
|
|
||||||
visibleCountEl.textContent = iconsToRender.length;
|
|
||||||
}
|
|
||||||
|
|
||||||
// 初始化页面
|
|
||||||
renderIcons();
|
|
||||||
|
|
||||||
// 搜索功能
|
|
||||||
document.getElementById('iconSearch').addEventListener('input', (e) => {
|
|
||||||
const searchTerm = e.target.value.toLowerCase().trim();
|
|
||||||
const colorFilter = document.getElementById('colorFilter').value;
|
|
||||||
|
|
||||||
if (!searchTerm && colorFilter === 'all') {
|
|
||||||
renderIcons();
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
|
|
||||||
// 筛选图标
|
|
||||||
const filtered = allIcons.filter(icon => {
|
|
||||||
const matchesSearch =
|
|
||||||
icon.name.toLowerCase().includes(searchTerm) ||
|
|
||||||
icon.icon.toLowerCase().includes(searchTerm);
|
|
||||||
|
|
||||||
const matchesColor = colorFilter === 'all' || true; // 颜色筛选在渲染时处理
|
|
||||||
|
|
||||||
return matchesSearch && matchesColor;
|
|
||||||
});
|
|
||||||
|
|
||||||
renderIcons(filtered);
|
|
||||||
|
|
||||||
// 高亮搜索结果
|
|
||||||
if (searchTerm) {
|
|
||||||
document.querySelectorAll('.icon-card').forEach(card => {
|
|
||||||
const nameMatch = card.dataset.name.toLowerCase().includes(searchTerm);
|
|
||||||
const iconMatch = card.dataset.icon.toLowerCase().includes(searchTerm);
|
|
||||||
|
|
||||||
if (nameMatch || iconMatch) {
|
|
||||||
card.classList.add('icon-search-highlight');
|
|
||||||
} else {
|
|
||||||
card.classList.remove('icon-search-highlight');
|
|
||||||
}
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
// 应用颜色筛选
|
|
||||||
if (colorFilter !== 'all') {
|
|
||||||
document.querySelectorAll('.icon-card').forEach(card => {
|
|
||||||
if (card.dataset.color === colorFilter) {
|
|
||||||
card.style.display = '';
|
|
||||||
} else {
|
|
||||||
card.style.display = 'none';
|
|
||||||
}
|
|
||||||
});
|
|
||||||
|
|
||||||
// 更新可见计数
|
|
||||||
const visibleCount = document.querySelectorAll(`.icon-card[data-color="${colorFilter}"]`).length;
|
|
||||||
visibleCountEl.textContent = visibleCount;
|
|
||||||
}
|
|
||||||
});
|
|
||||||
|
|
||||||
// 颜色筛选
|
|
||||||
document.getElementById('colorFilter').addEventListener('change', (e) => {
|
|
||||||
// 触发搜索事件以应用筛选
|
|
||||||
document.getElementById('iconSearch').dispatchEvent(new Event('input'));
|
|
||||||
});
|
|
||||||
|
|
||||||
// 重置筛选
|
|
||||||
document.getElementById('resetFilter').addEventListener('click', () => {
|
|
||||||
document.getElementById('iconSearch').value = '';
|
|
||||||
document.getElementById('colorFilter').value = 'all';
|
|
||||||
renderIcons();
|
|
||||||
});
|
|
||||||
</script>
|
|
||||||
</body>
|
|
||||||
</html>
|
|
||||||
Reference in New Issue
Block a user