新增页面
This commit is contained in:
parent
2055ca3c31
commit
71a9dc556f
|
|
@ -0,0 +1,662 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="zh-CN">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>后台管理系统</title>
|
||||
<!-- 引入Tailwind CSS -->
|
||||
<script src="https://cdn.tailwindcss.com"></script>
|
||||
|
||||
<!-- Font Awesome 备选方案 -->
|
||||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
|
||||
<link rel="stylesheet" href="https://cdn.bootcdn.net/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css" onerror="this.onerror=null;this.disabled=true;">
|
||||
|
||||
<!-- Chart.js 备选方案 -->
|
||||
<script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/4.4.8/chart.umd.min.js"></script>
|
||||
<script src="https://cdn.bootcdn.net/ajax/libs/Chart.js/4.4.8/chart.umd.min.js" onerror="this.onerror=null;this.remove();"></script>
|
||||
|
||||
<!-- 配置Tailwind自定义主题 -->
|
||||
<script>
|
||||
tailwind.config = {
|
||||
theme: {
|
||||
extend: {
|
||||
colors: {
|
||||
primary: '#165DFF',
|
||||
secondary: '#0E2E8A',
|
||||
accent: '#36CFC9',
|
||||
neutral: '#F5F7FA',
|
||||
'neutral-dark': '#1D2129',
|
||||
},
|
||||
fontFamily: {
|
||||
inter: ['Inter', 'system-ui', 'sans-serif'],
|
||||
},
|
||||
},
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<!-- 自定义工具类 -->
|
||||
<style type="text/tailwindcss">
|
||||
@layer utilities {
|
||||
.content-auto {
|
||||
content-visibility: auto;
|
||||
}
|
||||
.sidebar-shadow {
|
||||
box-shadow: 0 0 20px rgba(0, 0, 0, 0.05);
|
||||
}
|
||||
.card-hover {
|
||||
transition: all 0.3s ease;
|
||||
}
|
||||
.card-hover:hover {
|
||||
transform: translateY(-5px);
|
||||
box-shadow: 0 10px 20px rgba(22, 93, 255, 0.1);
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
<!-- 图标备选方案 - 如果Font Awesome加载失败 -->
|
||||
<style>
|
||||
.icon {
|
||||
display: inline-block;
|
||||
width: 1em;
|
||||
height: 1em;
|
||||
stroke-width: 0;
|
||||
stroke: currentColor;
|
||||
fill: currentColor;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
/* 基础图标样式 */
|
||||
.icon-menu::before { content: "≡"; }
|
||||
.icon-cogs::before { content: "⚙"; }
|
||||
.icon-bell::before { content: "🔔"; }
|
||||
.icon-angle-down::before { content: "▼"; }
|
||||
.icon-angle-up::before { content: "▲"; }
|
||||
.icon-dashboard::before { content: "📊"; }
|
||||
.icon-th-large::before { content: "📋"; }
|
||||
.icon-users::before { content: "👥"; }
|
||||
.icon-shopping-cart::before { content: "🛒"; }
|
||||
.icon-cog::before { content: "🔧"; }
|
||||
.icon-bar-chart::before { content: "📈"; }
|
||||
.icon-question-circle::before { content: "❓"; }
|
||||
.icon-eye::before { content: "👁"; }
|
||||
.icon-arrow-up::before { content: "↑"; }
|
||||
.icon-arrow-down::before { content: "↓"; }
|
||||
.icon-credit-card::before { content: "💳"; }
|
||||
.icon-user-plus::before { content: "👤+"; }
|
||||
</style>
|
||||
</head>
|
||||
<body class="font-inter bg-neutral text-neutral-dark min-h-screen flex flex-col">
|
||||
<!-- 顶部导航栏 -->
|
||||
<header class="bg-white shadow-sm fixed top-0 left-0 right-0 z-20 transition-all duration-300" id="header">
|
||||
<div class="flex items-center justify-between h-16 px-4 sm:px-6 lg:px-8">
|
||||
<!-- 左侧Logo和菜单切换 -->
|
||||
<div class="flex items-center">
|
||||
<button id="menu-toggle" class="lg:hidden mr-3 text-gray-500 hover:text-primary focus:outline-none">
|
||||
<i class="fa fa-bars text-xl icon-menu"></i>
|
||||
</button>
|
||||
<div class="flex items-center">
|
||||
<div class="h-8 w-8 rounded-md bg-primary flex items-center justify-center text-white">
|
||||
<i class="fa fa-cogs icon-cogs"></i>
|
||||
</div>
|
||||
<span class="ml-2 text-lg font-semibold hidden sm:block">AdminPro</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 右侧用户信息 -->
|
||||
<div class="flex items-center space-x-4">
|
||||
<button class="text-gray-500 hover:text-primary relative">
|
||||
<i class="fa fa-bell-o text-xl icon-bell"></i>
|
||||
<span class="absolute top-0 right-0 h-4 w-4 bg-red-500 rounded-full text-white text-xs flex items-center justify-center">3</span>
|
||||
</button>
|
||||
<div class="flex items-center cursor-pointer hover:text-primary">
|
||||
<img src="https://picsum.photos/id/1005/40/40" alt="用户头像" class="h-8 w-8 rounded-full object-cover border-2 border-primary/20">
|
||||
<span class="ml-2 hidden md:block">管理员</span>
|
||||
<i class="fa fa-angle-down ml-1 text-xs icon-angle-down"></i>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</header>
|
||||
|
||||
<!-- 侧边栏 -->
|
||||
<aside id="sidebar" class="fixed left-0 top-16 bottom-0 w-64 bg-white sidebar-shadow transform -translate-x-full lg:translate-x-0 transition-transform duration-300 z-10 overflow-y-auto">
|
||||
<nav class="py-4">
|
||||
<div class="px-4 mb-4">
|
||||
<div class="text-xs text-gray-400 uppercase font-semibold">主导航</div>
|
||||
</div>
|
||||
|
||||
<!-- 菜单项目 -->
|
||||
<a href="#" class="flex items-center px-4 py-3 text-primary bg-primary/5 border-l-4 border-primary">
|
||||
<i class="fa fa-dashboard w-6 icon-dashboard"></i>
|
||||
<span class="ml-2">仪表盘</span>
|
||||
</a>
|
||||
|
||||
<div class="menu-group">
|
||||
<div class="menu-header flex items-center justify-between px-4 py-3 cursor-pointer hover:bg-gray-50">
|
||||
<div class="flex items-center">
|
||||
<i class="fa fa-th-large w-6 text-gray-500 icon-th-large"></i>
|
||||
<span class="ml-2">内容管理</span>
|
||||
</div>
|
||||
<i class="fa fa-angle-down text-xs text-gray-500 icon-angle-down"></i>
|
||||
</div>
|
||||
<div class="menu-items pl-10">
|
||||
<a href="#" class="block px-4 py-2 text-sm text-gray-600 hover:bg-gray-50 hover:text-primary">文章管理</a>
|
||||
<a href="#" class="block px-4 py-2 text-sm text-gray-600 hover:bg-gray-50 hover:text-primary">分类管理</a>
|
||||
<a href="#" class="block px-4 py-2 text-sm text-gray-600 hover:bg-gray-50 hover:text-primary">评论管理</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<a href="#" class="flex items-center px-4 py-3 text-gray-600 hover:bg-gray-50 hover:text-primary">
|
||||
<i class="fa fa-users w-6 text-gray-500 icon-users"></i>
|
||||
<span class="ml-2">用户管理</span>
|
||||
</a>
|
||||
|
||||
<a href="#" class="flex items-center px-4 py-3 text-gray-600 hover:bg-gray-50 hover:text-primary">
|
||||
<i class="fa fa-shopping-cart w-6 text-gray-500 icon-shopping-cart"></i>
|
||||
<span class="ml-2">订单管理</span>
|
||||
<span class="ml-auto bg-red-500 text-white text-xs px-2 py-0.5 rounded-full">新</span>
|
||||
</a>
|
||||
|
||||
<div class="menu-group">
|
||||
<div class="menu-header flex items-center justify-between px-4 py-3 cursor-pointer hover:bg-gray-50">
|
||||
<div class="flex items-center">
|
||||
<i class="fa fa-cog w-6 text-gray-500 icon-cog"></i>
|
||||
<span class="ml-2">系统设置</span>
|
||||
</div>
|
||||
<i class="fa fa-angle-down text-xs text-gray-500 icon-angle-down"></i>
|
||||
</div>
|
||||
<div class="menu-items pl-10">
|
||||
<a href="#" class="block px-4 py-2 text-sm text-gray-600 hover:bg-gray-50 hover:text-primary">基本设置</a>
|
||||
<a href="#" class="block px-4 py-2 text-sm text-gray-600 hover:bg-gray-50 hover:text-primary">安全设置</a>
|
||||
<a href="#" class="block px-4 py-2 text-sm text-gray-600 hover:bg-gray-50 hover:text-primary">权限管理</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<a href="#" class="flex items-center px-4 py-3 text-gray-600 hover:bg-gray-50 hover:text-primary">
|
||||
<i class="fa fa-bar-chart w-6 text-gray-500 icon-bar-chart"></i>
|
||||
<span class="ml-2">数据统计</span>
|
||||
</a>
|
||||
|
||||
<a href="#" class="flex items-center px-4 py-3 text-gray-600 hover:bg-gray-50 hover:text-primary">
|
||||
<i class="fa fa-question-circle w-6 text-gray-500 icon-question-circle"></i>
|
||||
<span class="ml-2">帮助中心</span>
|
||||
</a>
|
||||
</nav>
|
||||
</aside>
|
||||
|
||||
<!-- 主内容区域 -->
|
||||
<main class="flex-1 pt-16 lg:pl-64 transition-all duration-300">
|
||||
<div class="p-4 sm:p-6 lg:p-8">
|
||||
<!-- 页面标题 -->
|
||||
<div class="mb-8">
|
||||
<h1 class="text-[clamp(1.5rem,3vw,2.5rem)] font-bold text-neutral-dark">仪表盘</h1>
|
||||
<p class="text-gray-500 mt-1">欢迎回来，管理员！这里是您的系统概览</p>
|
||||
</div>
|
||||
|
||||
<!-- 数据卡片 -->
|
||||
<div class="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-4 gap-6 mb-8">
|
||||
<!-- 卡片1 -->
|
||||
<div class="bg-white rounded-xl shadow-sm p-6 card-hover">
|
||||
<div class="flex items-center justify-between">
|
||||
<div>
|
||||
<p class="text-gray-500 text-sm">今日访问量</p>
|
||||
<h3 class="text-2xl font-bold mt-2">12,458</h3>
|
||||
<p class="text-green-500 text-sm mt-2 flex items-center">
|
||||
<i class="fa fa-arrow-up mr-1 icon-arrow-up"></i> 12.5%
|
||||
<span class="text-gray-500 ml-1">较昨日</span>
|
||||
</p>
|
||||
</div>
|
||||
<div class="h-12 w-12 rounded-full bg-blue-100 flex items-center justify-center text-primary">
|
||||
<i class="fa fa-eye text-xl icon-eye"></i>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 卡片2 -->
|
||||
<div class="bg-white rounded-xl shadow-sm p-6 card-hover">
|
||||
<div class="flex items-center justify-between">
|
||||
<div>
|
||||
<p class="text-gray-500 text-sm">今日订单</p>
|
||||
<h3 class="text-2xl font-bold mt-2">386</h3>
|
||||
<p class="text-green-500 text-sm mt-2 flex items-center">
|
||||
<i class="fa fa-arrow-up mr-1 icon-arrow-up"></i> 8.2%
|
||||
<span class="text-gray-500 ml-1">较昨日</span>
|
||||
</p>
|
||||
</div>
|
||||
<div class="h-12 w-12 rounded-full bg-green-100 flex items-center justify-center text-green-600">
|
||||
<i class="fa fa-shopping-cart text-xl icon-shopping-cart"></i>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 卡片3 -->
|
||||
<div class="bg-white rounded-xl shadow-sm p-6 card-hover">
|
||||
<div class="flex items-center justify-between">
|
||||
<div>
|
||||
<p class="text-gray-500 text-sm">总收入</p>
|
||||
<h3 class="text-2xl font-bold mt-2">¥48,521</h3>
|
||||
<p class="text-green-500 text-sm mt-2 flex items-center">
|
||||
<i class="fa fa-arrow-up mr-1 icon-arrow-up"></i> 5.3%
|
||||
<span class="text-gray-500 ml-1">较昨日</span>
|
||||
</p>
|
||||
</div>
|
||||
<div class="h-12 w-12 rounded-full bg-purple-100 flex items-center justify-center text-purple-600">
|
||||
<i class="fa fa-credit-card text-xl icon-credit-card"></i>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 卡片4 -->
|
||||
<div class="bg-white rounded-xl shadow-sm p-6 card-hover">
|
||||
<div class="flex items-center justify-between">
|
||||
<div>
|
||||
<p class="text-gray-500 text-sm">新用户注册</p>
|
||||
<h3 class="text-2xl font-bold mt-2">256</h3>
|
||||
<p class="text-red-500 text-sm mt-2 flex items-center">
|
||||
<i class="fa fa-arrow-down mr-1 icon-arrow-down"></i> 2.1%
|
||||
<span class="text-gray-500 ml-1">较昨日</span>
|
||||
</p>
|
||||
</div>
|
||||
<div class="h-12 w-12 rounded-full bg-orange-100 flex items-center justify-center text-orange-600">
|
||||
<i class="fa fa-user-plus text-xl icon-user-plus"></i>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 图表和数据表格 -->
|
||||
<div class="grid grid-cols-1 lg:grid-cols-3 gap-6">
|
||||
<!-- 图表区域 -->
|
||||
<div class="bg-white rounded-xl shadow-sm p-6 lg:col-span-2">
|
||||
<div class="flex items-center justify-between mb-6">
|
||||
<h3 class="font-semibold text-lg">销售趋势</h3>
|
||||
<div class="flex space-x-2">
|
||||
<button class="px-3 py-1 text-sm bg-primary/10 text-primary rounded-md hover:bg-primary/20 transition">本周</button>
|
||||
<button class="px-3 py-1 text-sm text-gray-500 hover:bg-gray-100 rounded-md transition">本月</button>
|
||||
<button class="px-3 py-1 text-sm text-gray-500 hover:bg-gray-100 rounded-md transition">全年</button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="h-80" id="chart-container">
|
||||
<!-- 图表容器 - 如果Chart.js加载失败会显示替代内容 -->
|
||||
<canvas id="salesChart"></canvas>
|
||||
<div id="chart-fallback" class="hidden h-full flex items-center justify-center text-gray-500">
|
||||
<div class="text-center">
|
||||
<div class="text-4xl mb-2">📈</div>
|
||||
<p>销售趋势图表</p>
|
||||
<div class="mt-4 bg-gray-100 rounded-lg p-4 text-sm">
|
||||
<div class="flex justify-between mb-1">
|
||||
<span>周一</span>
|
||||
<span>¥12,000</span>
|
||||
</div>
|
||||
<div class="flex justify-between mb-1">
|
||||
<span>周二</span>
|
||||
<span>¥19,000</span>
|
||||
</div>
|
||||
<div class="flex justify-between mb-1">
|
||||
<span>周三</span>
|
||||
<span>¥15,000</span>
|
||||
</div>
|
||||
<div class="flex justify-between mb-1">
|
||||
<span>周四</span>
|
||||
<span>¥25,000</span>
|
||||
</div>
|
||||
<div class="flex justify-between mb-1">
|
||||
<span>周五</span>
|
||||
<span>¥22,000</span>
|
||||
</div>
|
||||
<div class="flex justify-between mb-1">
|
||||
<span>周六</span>
|
||||
<span>¥30,000</span>
|
||||
</div>
|
||||
<div class="flex justify-between">
|
||||
<span>周日</span>
|
||||
<span>¥32,000</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 热门商品 -->
|
||||
<div class="bg-white rounded-xl shadow-sm p-6">
|
||||
<h3 class="font-semibold text-lg mb-6">热门商品</h3>
|
||||
<div class="space-y-4">
|
||||
<div class="flex items-center">
|
||||
<img src="https://picsum.photos/id/26/60/60" alt="商品图片" class="h-12 w-12 rounded-md object-cover">
|
||||
<div class="ml-3 flex-1">
|
||||
<h4 class="font-medium">智能手表 Pro</h4>
|
||||
<p class="text-sm text-gray-500">¥1,299</p>
|
||||
</div>
|
||||
<div class="text-right">
|
||||
<p class="font-semibold">1,245</p>
|
||||
<p class="text-xs text-green-500">+12.5%</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="flex items-center">
|
||||
<img src="https://picsum.photos/id/96/60/60" alt="商品图片" class="h-12 w-12 rounded-md object-cover">
|
||||
<div class="ml-3 flex-1">
|
||||
<h4 class="font-medium">无线耳机 Max</h4>
|
||||
<p class="text-sm text-gray-500">¥899</p>
|
||||
</div>
|
||||
<div class="text-right">
|
||||
<p class="font-semibold">987</p>
|
||||
<p class="text-xs text-green-500">+8.3%</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="flex items-center">
|
||||
<img src="https://picsum.photos/id/119/60/60" alt="商品图片" class="h-12 w-12 rounded-md object-cover">
|
||||
<div class="ml-3 flex-1">
|
||||
<h4 class="font-medium">智能音箱 Mini</h4>
|
||||
<p class="text-sm text-gray-500">¥399</p>
|
||||
</div>
|
||||
<div class="text-right">
|
||||
<p class="font-semibold">756</p>
|
||||
<p class="text-xs text-red-500">-2.1%</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="flex items-center">
|
||||
<img src="https://picsum.photos/id/180/60/60" alt="商品图片" class="h-12 w-12 rounded-md object-cover">
|
||||
<div class="ml-3 flex-1">
|
||||
<h4 class="font-medium">运动手环</h4>
|
||||
<p class="text-sm text-gray-500">¥199</p>
|
||||
</div>
|
||||
<div class="text-right">
|
||||
<p class="font-semibold">623</p>
|
||||
<p class="text-xs text-green-500">+5.7%</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="flex items-center">
|
||||
<img src="https://picsum.photos/id/201/60/60" alt="商品图片" class="h-12 w-12 rounded-md object-cover">
|
||||
<div class="ml-3 flex-1">
|
||||
<h4 class="font-medium">智能门锁</h4>
|
||||
<p class="text-sm text-gray-500">¥1,599</p>
|
||||
</div>
|
||||
<div class="text-right">
|
||||
<p class="font-semibold">432</p>
|
||||
<p class="text-xs text-green-500">+15.2%</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 最近订单 -->
|
||||
<div class="mt-6 bg-white rounded-xl shadow-sm overflow-hidden">
|
||||
<div class="p-6 border-b">
|
||||
<h3 class="font-semibold text-lg">最近订单</h3>
|
||||
</div>
|
||||
<div class="overflow-x-auto">
|
||||
<table class="min-w-full divide-y divide-gray-200">
|
||||
<thead class="bg-gray-50">
|
||||
<tr>
|
||||
<th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">订单编号</th>
|
||||
<th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">客户</th>
|
||||
<th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">金额</th>
|
||||
<th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">状态</th>
|
||||
<th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">日期</th>
|
||||
<th class="px-6 py-3 text-right text-xs font-medium text-gray-500 uppercase tracking-wider">操作</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody class="bg-white divide-y divide-gray-200">
|
||||
<tr class="hover:bg-gray-50 transition">
|
||||
<td class="px-6 py-4 whitespace-nowrap text-sm font-medium">#ORD-7821</td>
|
||||
<td class="px-6 py-4 whitespace-nowrap">
|
||||
<div class="flex items-center">
|
||||
<img src="https://picsum.photos/id/1027/40/40" alt="用户头像" class="h-8 w-8 rounded-full">
|
||||
<div class="ml-3">
|
||||
<div class="text-sm font-medium">张三</div>
|
||||
<div class="text-xs text-gray-500">zhangsan@example.com</div>
|
||||
</div>
|
||||
</div>
|
||||
</td>
|
||||
<td class="px-6 py-4 whitespace-nowrap text-sm">¥2,399.00</td>
|
||||
<td class="px-6 py-4 whitespace-nowrap">
|
||||
<span class="px-2 py-1 text-xs rounded-full bg-green-100 text-green-800">已完成</span>
|
||||
</td>
|
||||
<td class="px-6 py-4 whitespace-nowrap text-sm text-gray-500">2023-06-15</td>
|
||||
<td class="px-6 py-4 whitespace-nowrap text-right text-sm">
|
||||
<button class="text-primary hover:text-primary/80 mr-3">查看</button>
|
||||
<button class="text-gray-500 hover:text-gray-700">编辑</button>
|
||||
</td>
|
||||
</tr>
|
||||
<tr class="hover:bg-gray-50 transition">
|
||||
<td class="px-6 py-4 whitespace-nowrap text-sm font-medium">#ORD-7820</td>
|
||||
<td class="px-6 py-4 whitespace-nowrap">
|
||||
<div class="flex items-center">
|
||||
<img src="https://picsum.photos/id/1066/40/40" alt="用户头像" class="h-8 w-8 rounded-full">
|
||||
<div class="ml-3">
|
||||
<div class="text-sm font-medium">李四</div>
|
||||
<div class="text-xs text-gray-500">lisi@example.com</div>
|
||||
</div>
|
||||
</div>
|
||||
</td>
|
||||
<td class="px-6 py-4 whitespace-nowrap text-sm">¥1,299.00</td>
|
||||
<td class="px-6 py-4 whitespace-nowrap">
|
||||
<span class="px-2 py-1 text-xs rounded-full bg-blue-100 text-blue-800">处理中</span>
|
||||
</td>
|
||||
<td class="px-6 py-4 whitespace-nowrap text-sm text-gray-500">2023-06-15</td>
|
||||
<td class="px-6 py-4 whitespace-nowrap text-right text-sm">
|
||||
<button class="text-primary hover:text-primary/80 mr-3">查看</button>
|
||||
<button class="text-gray-500 hover:text-gray-700">编辑</button>
|
||||
</td>
|
||||
</tr>
|
||||
<tr class="hover:bg-gray-50 transition">
|
||||
<td class="px-6 py-4 whitespace-nowrap text-sm font-medium">#ORD-7819</td>
|
||||
<td class="px-6 py-4 whitespace-nowrap">
|
||||
<div class="flex items-center">
|
||||
<img src="https://picsum.photos/id/1074/40/40" alt="用户头像" class="h-8 w-8 rounded-full">
|
||||
<div class="ml-3">
|
||||
<div class="text-sm font-medium">王五</div>
|
||||
<div class="text-xs text-gray-500">wangwu@example.com</div>
|
||||
</div>
|
||||
</div>
|
||||
</td>
|
||||
<td class="px-6 py-4 whitespace-nowrap text-sm">¥899.00</td>
|
||||
<td class="px-6 py-4 whitespace-nowrap">
|
||||
<span class="px-2 py-1 text-xs rounded-full bg-yellow-100 text-yellow-800">待发货</span>
|
||||
</td>
|
||||
<td class="px-6 py-4 whitespace-nowrap text-sm text-gray-500">2023-06-14</td>
|
||||
<td class="px-6 py-4 whitespace-nowrap text-right text-sm">
|
||||
<button class="text-primary hover:text-primary/80 mr-3">查看</button>
|
||||
<button class="text-gray-500 hover:text-gray-700">编辑</button>
|
||||
</td>
|
||||
</tr>
|
||||
<tr class="hover:bg-gray-50 transition">
|
||||
<td class="px-6 py-4 whitespace-nowrap text-sm font-medium">#ORD-7818</td>
|
||||
<td class="px-6 py-4 whitespace-nowrap">
|
||||
<div class="flex items-center">
|
||||
<img src="https://picsum.photos/id/1062/40/40" alt="用户头像" class="h-8 w-8 rounded-full">
|
||||
<div class="ml-3">
|
||||
<div class="text-sm font-medium">赵六</div>
|
||||
<div class="text-xs text-gray-500">zhaoliu@example.com</div>
|
||||
</div>
|
||||
</div>
|
||||
</td>
|
||||
<td class="px-6 py-4 whitespace-nowrap text-sm">¥399.00</td>
|
||||
<td class="px-6 py-4 whitespace-nowrap">
|
||||
<span class="px-2 py-1 text-xs rounded-full bg-red-100 text-red-800">已取消</span>
|
||||
</td>
|
||||
<td class="px-6 py-4 whitespace-nowrap text-sm text-gray-500">2023-06-14</td>
|
||||
<td class="px-6 py-4 whitespace-nowrap text-right text-sm">
|
||||
<button class="text-primary hover:text-primary/80 mr-3">查看</button>
|
||||
<button class="text-gray-500 hover:text-gray-700">编辑</button>
|
||||
</td>
|
||||
</tr>
|
||||
<tr class="hover:bg-gray-50 transition">
|
||||
<td class="px-6 py-4 whitespace-nowrap text-sm font-medium">#ORD-7817</td>
|
||||
<td class="px-6 py-4 whitespace-nowrap">
|
||||
<div class="flex items-center">
|
||||
<img src="https://picsum.photos/id/1083/40/40" alt="用户头像" class="h-8 w-8 rounded-full">
|
||||
<div class="ml-3">
|
||||
<div class="text-sm font-medium">孙七</div>
|
||||
<div class="text-xs text-gray-500">sunqi@example.com</div>
|
||||
</div>
|
||||
</div>
|
||||
</td>
|
||||
<td class="px-6 py-4 whitespace-nowrap text-sm">¥1,599.00</td>
|
||||
<td class="px-6 py-4 whitespace-nowrap">
|
||||
<span class="px-2 py-1 text-xs rounded-full bg-green-100 text-green-800">已完成</span>
|
||||
</td>
|
||||
<td class="px-6 py-4 whitespace-nowrap text-sm text-gray-500">2023-06-13</td>
|
||||
<td class="px-6 py-4 whitespace-nowrap text-right text-sm">
|
||||
<button class="text-primary hover:text-primary/80 mr-3">查看</button>
|
||||
<button class="text-gray-500 hover:text-gray-700">编辑</button>
|
||||
</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
<div class="px-6 py-4 border-t flex items-center justify-between">
|
||||
<p class="text-sm text-gray-500">显示 1 至 5 条，共 24 条</p>
|
||||
<div class="flex space-x-1">
|
||||
<button class="px-3 py-1 rounded border border-gray-300 text-gray-500 hover:bg-gray-50 disabled:opacity-50" disabled>上一页</button>
|
||||
<button class="px-3 py-1 rounded border border-primary bg-primary text-white">1</button>
|
||||
<button class="px-3 py-1 rounded border border-gray-300 hover:bg-gray-50">2</button>
|
||||
<button class="px-3 py-1 rounded border border-gray-300 hover:bg-gray-50">3</button>
|
||||
<button class="px-3 py-1 rounded border border-gray-300 hover:bg-gray-50">下一页</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</main>
|
||||
|
||||
<!-- 遮罩层 -->
|
||||
<div id="overlay" class="fixed inset-0 bg-black bg-opacity-50 z-10 hidden lg:hidden"></div>
|
||||
|
||||
<!-- JavaScript -->
|
||||
<script>
|
||||
// 菜单切换
|
||||
const menuToggle = document.getElementById('menu-toggle');
|
||||
const sidebar = document.getElementById('sidebar');
|
||||
const overlay = document.getElementById('overlay');
|
||||
|
||||
menuToggle.addEventListener('click', () => {
|
||||
sidebar.classList.toggle('-translate-x-full');
|
||||
overlay.classList.toggle('hidden');
|
||||
document.body.classList.toggle('overflow-hidden');
|
||||
});
|
||||
|
||||
overlay.addEventListener('click', () => {
|
||||
sidebar.classList.add('-translate-x-full');
|
||||
overlay.classList.add('hidden');
|
||||
document.body.classList.remove('overflow-hidden');
|
||||
});
|
||||
|
||||
// 子菜单展开/折叠
|
||||
const menuHeaders = document.querySelectorAll('.menu-header');
|
||||
|
||||
menuHeaders.forEach(header => {
|
||||
header.addEventListener('click', () => {
|
||||
const icon = header.querySelector('.fa-angle-down, .icon-angle-down');
|
||||
const menuItems = header.nextElementSibling;
|
||||
|
||||
icon.classList.toggle('rotate-180');
|
||||
icon.classList.toggle('icon-angle-up');
|
||||
icon.classList.toggle('icon-angle-down');
|
||||
menuItems.classList.toggle('hidden');
|
||||
});
|
||||
});
|
||||
|
||||
// 初始化图表 - 添加错误处理
|
||||
document.addEventListener('DOMContentLoaded', () => {
|
||||
try {
|
||||
// 检查Chart是否加载成功
|
||||
if (typeof Chart !== 'undefined') {
|
||||
const ctx = document.getElementById('salesChart').getContext('2d');
|
||||
|
||||
const salesChart = new Chart(ctx, {
|
||||
type: 'line',
|
||||
data: {
|
||||
labels: ['周一', '周二', '周三', '周四', '周五', '周六', '周日'],
|
||||
datasets: [
|
||||
{
|
||||
label: '销售额',
|
||||
data: [12000, 19000, 15000, 25000, 22000, 30000, 32000],
|
||||
borderColor: '#165DFF',
|
||||
backgroundColor: 'rgba(22, 93, 255, 0.1)',
|
||||
fill: true,
|
||||
tension: 0.4
|
||||
},
|
||||
{
|
||||
label: '订单量',
|
||||
data: [120, 190, 150, 250, 220, 300, 320],
|
||||
borderColor: '#36CFC9',
|
||||
backgroundColor: 'transparent',
|
||||
borderDash: [5, 5],
|
||||
tension: 0.4
|
||||
}
|
||||
]
|
||||
},
|
||||
options: {
|
||||
responsive: true,
|
||||
maintainAspectRatio: false,
|
||||
plugins: {
|
||||
legend: {
|
||||
position: 'top',
|
||||
}
|
||||
},
|
||||
scales: {
|
||||
y: {
|
||||
beginAtZero: true
|
||||
}
|
||||
},
|
||||
animation: {
|
||||
duration: 2000,
|
||||
easing: 'easeOutQuart'
|
||||
}
|
||||
}
|
||||
});
|
||||
} else {
|
||||
// 如果Chart未加载，显示备用内容
|
||||
document.getElementById('chart-fallback').classList.remove('hidden');
|
||||
}
|
||||
} catch (error) {
|
||||
// 发生错误时显示备用内容
|
||||
document.getElementById('chart-fallback').classList.remove('hidden');
|
||||
console.log('Chart.js加载失败，显示备用内容');
|
||||
}
|
||||
});
|
||||
|
||||
// 滚动时改变header样式
|
||||
window.addEventListener('scroll', () => {
|
||||
const header = document.getElementById('header');
|
||||
if (window.scrollY > 10) {
|
||||
header.classList.add('shadow');
|
||||
} else {
|
||||
header.classList.remove('shadow');
|
||||
}
|
||||
});
|
||||
|
||||
// 检查Font Awesome是否加载成功
|
||||
document.addEventListener('DOMContentLoaded', function() {
|
||||
setTimeout(function() {
|
||||
const testIcon = document.createElement('i');
|
||||
testIcon.className = 'fa fa-test';
|
||||
document.body.appendChild(testIcon);
|
||||
|
||||
// 检查图标是否正常显示
|
||||
const computedStyle = window.getComputedStyle(testIcon);
|
||||
if (computedStyle.getPropertyValue('font-family') !== 'FontAwesome' &&
|
||||
!document.querySelector('.fa-bars').classList.contains('fa-bars')) {
|
||||
// Font Awesome加载失败，使用备用图标类
|
||||
document.querySelectorAll('.fa').forEach(el => {
|
||||
const classes = Array.from(el.classList);
|
||||
const iconClass = classes.find(c => c.startsWith('fa-') && c !== 'fa');
|
||||
if (iconClass) {
|
||||
const iconName = iconClass.replace('fa-', 'icon-');
|
||||
el.classList.add(iconName);
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
document.body.removeChild(testIcon);
|
||||
}, 1000);
|
||||
});
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,149 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
|
||||
<meta http-equiv="Pragma" content="no-cache">
|
||||
<meta http-equiv="Cache-Control" content="no-cache">
|
||||
<meta http-equiv="Expires" content="0">
|
||||
<title>登录</title>
|
||||
<link href="public/login/css/login.css" type="text/css" rel="stylesheet">
|
||||
<link rel="stylesheet" type="text/css" media="screen" href="public/login/css/layui.css">
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<div class="login" style="margin-left: 48%;">
|
||||
<div class="message">后台管理系统</div>
|
||||
<div class="message" style="color: red;width: 500px;margin-left: -10%;">涉密不上网，上网不涉密</div>
|
||||
<div id="darkbannerwrap"></div>
|
||||
<div id="loginDiv">
|
||||
<div id="login-form" >
|
||||
<div style="overflow: hidden;width: 100%;">
|
||||
<img id="nameImg" src="public/login/image/我的.png" style="float: left;display: inline-block;margin-top: 3%;margin-right: 2%;">
|
||||
<input id="username" name="username" placeholder="手机号" type="text" style="float: left;display: inline-block"
|
||||
autocomplete="off">
|
||||
<!-- <hr class="hr15">-->
|
||||
</div>
|
||||
<hr class="hr15">
|
||||
<div style="overflow: hidden;width: 100%;">
|
||||
<img id="passwordImg" src="public/login/image/密码.png" style="float: left;display: inline-block;margin-top: 3%;margin-right: 2%;">
|
||||
<input id="pwd" name="password" placeholder="密码" type="password" style="float: left;display: inline-block"
|
||||
autocomplete="off">
|
||||
</div>
|
||||
<hr class="hr15">
|
||||
<div style="overflow: hidden;width: 100%;">
|
||||
<img id="vCodeImg" src="public/login/image/验证码.png" style="float: left;display: inline-block;margin-top: 3%;margin-right: 2%;">
|
||||
<input type="text" class="form-control" name="verifyCode" id="verifyCode" required="required" placeholder="验证码">
|
||||
<input id="uuid" type="hidden" name="uuid" />
|
||||
<img id="vCode" title="看不清，请点我" onclick="getVerifyCode()" onmouseover="mouseover(this)" style="margin-left: 9.5%" />
|
||||
</div>
|
||||
<hr class="hr15">
|
||||
<button style="width: 92%;height: 37px;margin-left: 8%;" type="submit"
|
||||
onclick="login(this);"></button>
|
||||
<hr class="hr20">
|
||||
<span id="info" style="color: red"></span>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</body>
|
||||
<script src="public/login/js/jquery-3.7.1.min.js"></script>
|
||||
<script type="text/javascript" src="public/login/js/layui.js"></script>
|
||||
<script src="public/login/js/aes.js"></script>
|
||||
<script src="public/login/public.js"></script>
|
||||
<script type="text/javascript">
|
||||
getVerifyCode();
|
||||
|
||||
//获取验证码
|
||||
function getVerifyCode() {
|
||||
var url = IP_ADDRESS+"/code?" + Math.random();
|
||||
$.ajax({
|
||||
//请求方式
|
||||
type : "GET",
|
||||
//请求的媒体类型
|
||||
//请求地址
|
||||
url : url,
|
||||
//请求成功
|
||||
success : function(result) {
|
||||
$("#uuid").val(result.uuid);
|
||||
$("#vCode").attr("src","data:image/png;base64," + result.img);
|
||||
},
|
||||
//请求失败，包含具体的错误信息
|
||||
error : function(e){
|
||||
console.log(e.status);
|
||||
console.log(e.responseText);
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
function mouseover(obj) {
|
||||
obj.style.cursor = "pointer";
|
||||
}
|
||||
|
||||
|
||||
function login(obj) {
|
||||
var username = $.trim($('#username').val());
|
||||
var password = $.trim($('#pwd').val());
|
||||
var verifyCode = $.trim($('#verifyCode').val());
|
||||
var uuid = $.trim($('#uuid').val());
|
||||
if (username == "" || password == "") {
|
||||
$("#info").html('用户名或者密码不能为空');
|
||||
} else {
|
||||
$.ajax({
|
||||
type : 'post',
|
||||
url : IP_ADDRESS + '/realname/allSystem/login',
|
||||
contentType:'application/json;charset=UTF-8',
|
||||
data :JSON.stringify( {
|
||||
username:encryptCBC(username),
|
||||
password:encryptCBC(password),
|
||||
code:verifyCode,
|
||||
uuid:uuid
|
||||
}),
|
||||
success : function(data) {
|
||||
if(data && data.code){
|
||||
if(data.code=='200'){
|
||||
window.location.href="home.html";
|
||||
}else{
|
||||
$("#info").html(data.msg);
|
||||
getVerifyCode();
|
||||
}
|
||||
}else{
|
||||
$("#info").html(data.msg);
|
||||
getVerifyCode();
|
||||
}
|
||||
|
||||
},
|
||||
error : function(xhr, textStatus, errorThrown) {
|
||||
var msg = xhr.responseText;
|
||||
var response = JSON.parse(msg);
|
||||
$("#info").html(response.message);
|
||||
getVerifyCode();
|
||||
}
|
||||
});
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
/**
|
||||
* 获取当日时间
|
||||
*/
|
||||
function getNowTime() {
|
||||
var nowDate = new Date();
|
||||
var year = nowDate.getFullYear();
|
||||
var month = nowDate.getMonth() + 1 < 10 ? "0" + (nowDate.getMonth() + 1) :
|
||||
nowDate.getMonth() + 1;
|
||||
var day = nowDate.getDate() < 10 ? "0" + nowDate.getDate() : nowDate.getDate();
|
||||
var h =nowDate.getHours();
|
||||
var m=nowDate.getMinutes();
|
||||
var s=nowDate.getSeconds();
|
||||
var dateStr = year + "-" + month + "-" + day+" "+h+":"+m+":"+s;
|
||||
return dateStr;
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
</script>
|
||||
</html>
|
||||
File diff suppressed because one or more lines are too long
|
|
@ -0,0 +1,171 @@
|
|||
*{
|
||||
font: 13px/1.5 '微软雅黑', Verdana, Helvetica, Arial, sans-serif;
|
||||
-webkit-box-sizing: border-box;
|
||||
-moz-box-sizing: border-box;
|
||||
-box-sizing: border-box;
|
||||
padding:0;
|
||||
margin:0;
|
||||
list-style:none;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
body,html{
|
||||
height:100%;
|
||||
overflow:hidden;
|
||||
}
|
||||
body{
|
||||
background:url(../image/background.png) no-repeat center;
|
||||
background-size: cover;
|
||||
}
|
||||
a{
|
||||
color:#27A9E3;
|
||||
text-decoration:none;
|
||||
cursor:pointer;
|
||||
}
|
||||
.login{
|
||||
/*margin: 150px auto 0 auto;*/
|
||||
min-height: 420px;
|
||||
max-width: 420px;
|
||||
padding: 40px;
|
||||
/*background-color: #ffffff;*/
|
||||
margin-left: 43%;
|
||||
margin-top: 13%;
|
||||
border-radius: 4px;
|
||||
/* overflow-x: hidden; */
|
||||
box-sizing: border-box;
|
||||
}
|
||||
a.logo{
|
||||
display: block;
|
||||
height: 58px;
|
||||
width: 167px;
|
||||
margin: 0 auto 30px auto;
|
||||
background-size: 167px 42px;
|
||||
}
|
||||
.message {
|
||||
margin: -16px -11px -1px 41px;
|
||||
padding: 18px 10px 18px 60px;
|
||||
background: #fff;
|
||||
position: relative;
|
||||
color: #000;
|
||||
font-size: 32px;
|
||||
}
|
||||
#darkbannerwrap {
|
||||
/*background: url(../img/login/aiwrap.png);*/
|
||||
width: 18px;
|
||||
height: 10px;
|
||||
margin: 0 0 20px -58px;
|
||||
position: relative;
|
||||
}
|
||||
#username{
|
||||
}
|
||||
#password{
|
||||
}
|
||||
#nameImg{
|
||||
/*width: 5%;*/
|
||||
/*height: 50%;*/
|
||||
float: left;
|
||||
/*margin-top: 4%;*/
|
||||
/*background-image: url(../img/login/我的.png);*/
|
||||
background-repeat: no-repeat;
|
||||
}
|
||||
|
||||
input[type=text],
|
||||
input[type=file],
|
||||
input[type=password],
|
||||
input[type=email], select {
|
||||
border: 1px solid #DCDEE0;
|
||||
vertical-align: middle;
|
||||
border-radius: 3px;
|
||||
height: 50px;
|
||||
padding: 0px 16px;
|
||||
font-size: 14px;
|
||||
color: #555555;
|
||||
outline:none;
|
||||
width:90%;
|
||||
}
|
||||
input[type=text]:focus,
|
||||
input[type=file]:focus,
|
||||
input[type=password]:focus,
|
||||
input[type=email]:focus, select:focus {
|
||||
border: 1px solid #27A9E3;
|
||||
}
|
||||
|
||||
|
||||
input[type=submit],
|
||||
button{
|
||||
display: inline-block;
|
||||
vertical-align: middle;
|
||||
padding: 12px 24px;
|
||||
font-size: 18px;
|
||||
line-height: 24px;
|
||||
text-align: center;
|
||||
white-space: nowrap;
|
||||
vertical-align: middle;
|
||||
cursor: pointer;
|
||||
color: #ffffff;
|
||||
/*background-color: #189F92;*/
|
||||
border-radius: 3px;
|
||||
border: none;
|
||||
-webkit-appearance: none;
|
||||
outline:none;
|
||||
background: url(../image/登录.png);
|
||||
width:100%;
|
||||
background-size: 100%;
|
||||
|
||||
}
|
||||
hr{
|
||||
background-color: rgba(255,0,0,0)!important;
|
||||
}
|
||||
|
||||
hr.hr15 {
|
||||
height: 15px;
|
||||
border: none;
|
||||
margin: 0px;
|
||||
padding: 0px;
|
||||
width: 100%;
|
||||
}
|
||||
hr.hr20 {
|
||||
height: 20px;
|
||||
border: none;
|
||||
margin: 0px;
|
||||
padding: 0px;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.copyright{
|
||||
font-size:14px;
|
||||
color:rgba(255,255,255,0.85);
|
||||
display:block;
|
||||
position:absolute;
|
||||
bottom:15px;
|
||||
right:15px;
|
||||
}
|
||||
|
||||
#qrCode{
|
||||
position: absolute;
|
||||
width: 80px;
|
||||
left: 69.6%;
|
||||
bottom: 17.5%;
|
||||
}
|
||||
#qrCodeDiv{
|
||||
display: none;
|
||||
}
|
||||
#qrCodeTips{
|
||||
margin-left: 25%;
|
||||
float: left;
|
||||
margin-top: 5%;
|
||||
text-align: center;
|
||||
color: red;
|
||||
}
|
||||
#qrCodeImg{
|
||||
float: left;
|
||||
margin-left: 27%;
|
||||
margin-top: -5%;
|
||||
}
|
||||
#qrCodeBtn{
|
||||
width: 41%;
|
||||
height: 8%;
|
||||
float: left;
|
||||
margin-top: 5%;
|
||||
margin-left: 38%;
|
||||
}
|
||||
Binary file not shown.
|
After Width: | Height: | Size: 810 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 21 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 1.2 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 1.3 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 2.4 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 1.2 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 981 B |
|
|
@ -0,0 +1,65 @@
|
|||
!function(t,n){"object"==typeof exports?module.exports=exports=n():"function"==typeof define&&define.amd?define([],n):t.CryptoJS=n()}(this,function(){var t=t||function(t,n){var i=Object.create||function(){function t(){}return function(n){var i;return t.prototype=n,i=new t,t.prototype=null,i}}(),e={},r=e.lib={},o=r.Base=function(){return{extend:function(t){var n=i(this);return t&&n.mixIn(t),n.hasOwnProperty("init")&&this.init!==n.init||(n.init=function(){n.$super.init.apply(this,arguments)}),n.init.prototype=n,n.$super=this,n},create:function(){var t=this.extend();return t.init.apply(t,arguments),t},init:function(){},mixIn:function(t){for(var n in t)t.hasOwnProperty(n)&&(this[n]=t[n]);t.hasOwnProperty("toString")&&(this.toString=t.toString)},clone:function(){return this.init.prototype.extend(this)}}}(),s=r.WordArray=o.extend({init:function(t,i){t=this.words=t||[],i!=n?this.sigBytes=i:this.sigBytes=4*t.length},toString:function(t){return(t||c).stringify(this)},concat:function(t){var n=this.words,i=t.words,e=this.sigBytes,r=t.sigBytes;if(this.clamp(),e%4)for(var o=0;o<r;o++){var s=i[o>>>2]>>>24-o%4*8&255;n[e+o>>>2]|=s<<24-(e+o)%4*8}else for(var o=0;o<r;o+=4)n[e+o>>>2]=i[o>>>2];return this.sigBytes+=r,this},clamp:function(){var n=this.words,i=this.sigBytes;n[i>>>2]&=4294967295<<32-i%4*8,n.length=t.ceil(i/4)},clone:function(){var t=o.clone.call(this);return t.words=this.words.slice(0),t},random:function(n){for(var i,e=[],r=function(n){var n=n,i=987654321,e=4294967295;return function(){i=36969*(65535&i)+(i>>16)&e,n=18e3*(65535&n)+(n>>16)&e;var r=(i<<16)+n&e;return r/=4294967296,r+=.5,r*(t.random()>.5?1:-1)}},o=0;o<n;o+=4){var a=r(4294967296*(i||t.random()));i=987654071*a(),e.push(4294967296*a()|0)}return new s.init(e,n)}}),a=e.enc={},c=a.Hex={stringify:function(t){for(var n=t.words,i=t.sigBytes,e=[],r=0;r<i;r++){var o=n[r>>>2]>>>24-r%4*8&255;e.push((o>>>4).toString(16)),e.push((15&o).toString(16))}return e.join("")},parse:function(t){for(var n=t.length,i=[],e=0;e<n;e+=2)i[e>>>3]|=parseInt(t.substr(e,2),16)<<24-e%8*4;return new s.init(i,n/2)}},u=a.Latin1={stringify:function(t){for(var n=t.words,i=t.sigBytes,e=[],r=0;r<i;r++){var o=n[r>>>2]>>>24-r%4*8&255;e.push(String.fromCharCode(o))}return e.join("")},parse:function(t){for(var n=t.length,i=[],e=0;e<n;e++)i[e>>>2]|=(255&t.charCodeAt(e))<<24-e%4*8;return new s.init(i,n)}},f=a.Utf8={stringify:function(t){try{return decodeURIComponent(escape(u.stringify(t)))}catch(t){throw new Error("Malformed UTF-8 data")}},parse:function(t){return u.parse(unescape(encodeURIComponent(t)))}},h=r.BufferedBlockAlgorithm=o.extend({reset:function(){this._data=new s.init,this._nDataBytes=0},_append:function(t){"string"==typeof t&&(t=f.parse(t)),this._data.concat(t),this._nDataBytes+=t.sigBytes},_process:function(n){var i=this._data,e=i.words,r=i.sigBytes,o=this.blockSize,a=4*o,c=r/a;c=n?t.ceil(c):t.max((0|c)-this._minBufferSize,0);var u=c*o,f=t.min(4*u,r);if(u){for(var h=0;h<u;h+=o)this._doProcessBlock(e,h);var p=e.splice(0,u);i.sigBytes-=f}return new s.init(p,f)},clone:function(){var t=o.clone.call(this);return t._data=this._data.clone(),t},_minBufferSize:0}),p=(r.Hasher=h.extend({cfg:o.extend(),init:function(t){this.cfg=this.cfg.extend(t),this.reset()},reset:function(){h.reset.call(this),this._doReset()},update:function(t){return this._append(t),this._process(),this},finalize:function(t){t&&this._append(t);var n=this._doFinalize();return n},blockSize:16,_createHelper:function(t){return function(n,i){return new t.init(i).finalize(n)}},_createHmacHelper:function(t){return function(n,i){return new p.HMAC.init(t,i).finalize(n)}}}),e.algo={});return e}(Math);return t});
|
||||
//# sourceMappingURL=core.min.js.map
|
||||
!function(e,t,i){"object"==typeof exports?module.exports=exports=t(require("./core.min"),require("./sha1.min"),require("./hmac.min")):"function"==typeof define&&define.amd?define(["./core.min","./sha1.min","./hmac.min"],t):t(e.CryptoJS)}(this,function(e){return function(){var t=e,i=t.lib,r=i.Base,n=i.WordArray,o=t.algo,a=o.MD5,c=o.EvpKDF=r.extend({cfg:r.extend({keySize:4,hasher:a,iterations:1}),init:function(e){this.cfg=this.cfg.extend(e)},compute:function(e,t){for(var i=this.cfg,r=i.hasher.create(),o=n.create(),a=o.words,c=i.keySize,f=i.iterations;a.length<c;){s&&r.update(s);var s=r.update(e).finalize(t);r.reset();for(var u=1;u<f;u++)s=r.finalize(s),r.reset();o.concat(s)}return o.sigBytes=4*c,o}});t.EvpKDF=function(e,t,i){return c.create(i).compute(e,t)}}(),e.EvpKDF});
|
||||
//# sourceMappingURL=evpkdf.min.js.map
|
||||
!function(r,e){"object"==typeof exports?module.exports=exports=e(require("./core.min")):"function"==typeof define&&define.amd?define(["./core.min"],e):e(r.CryptoJS)}(this,function(r){return function(){function e(r,e,t){for(var n=[],i=0,o=0;o<e;o++)if(o%4){var f=t[r.charCodeAt(o-1)]<<o%4*2,c=t[r.charCodeAt(o)]>>>6-o%4*2;n[i>>>2]|=(f|c)<<24-i%4*8,i++}return a.create(n,i)}var t=r,n=t.lib,a=n.WordArray,i=t.enc;i.Base64={stringify:function(r){var e=r.words,t=r.sigBytes,n=this._map;r.clamp();for(var a=[],i=0;i<t;i+=3)for(var o=e[i>>>2]>>>24-i%4*8&255,f=e[i+1>>>2]>>>24-(i+1)%4*8&255,c=e[i+2>>>2]>>>24-(i+2)%4*8&255,s=o<<16|f<<8|c,h=0;h<4&&i+.75*h<t;h++)a.push(n.charAt(s>>>6*(3-h)&63));var p=n.charAt(64);if(p)for(;a.length%4;)a.push(p);return a.join("")},parse:function(r){var t=r.length,n=this._map,a=this._reverseMap;if(!a){a=this._reverseMap=[];for(var i=0;i<n.length;i++)a[n.charCodeAt(i)]=i}var o=n.charAt(64);if(o){var f=r.indexOf(o);f!==-1&&(t=f)}return e(r,t,a)},_map:"ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789+/="}}(),r.enc.Base64});
|
||||
//# sourceMappingURL=enc-base64.min.js.map
|
||||
!function(e,t,r){"object"==typeof exports?module.exports=exports=t(require("./core.min"),require("./evpkdf.min")):"function"==typeof define&&define.amd?define(["./core.min","./evpkdf.min"],t):t(e.CryptoJS)}(this,function(e){e.lib.Cipher||function(t){var r=e,i=r.lib,n=i.Base,c=i.WordArray,o=i.BufferedBlockAlgorithm,s=r.enc,a=(s.Utf8,s.Base64),f=r.algo,p=f.EvpKDF,d=i.Cipher=o.extend({cfg:n.extend(),createEncryptor:function(e,t){return this.create(this._ENC_XFORM_MODE,e,t)},createDecryptor:function(e,t){return this.create(this._DEC_XFORM_MODE,e,t)},init:function(e,t,r){this.cfg=this.cfg.extend(r),this._xformMode=e,this._key=t,this.reset()},reset:function(){o.reset.call(this),this._doReset()},process:function(e){return this._append(e),this._process()},finalize:function(e){e&&this._append(e);var t=this._doFinalize();return t},keySize:4,ivSize:4,_ENC_XFORM_MODE:1,_DEC_XFORM_MODE:2,_createHelper:function(){function e(e){return"string"==typeof e?B:x}return function(t){return{encrypt:function(r,i,n){return e(i).encrypt(t,r,i,n)},decrypt:function(r,i,n){return e(i).decrypt(t,r,i,n)}}}}()}),h=(i.StreamCipher=d.extend({_doFinalize:function(){var e=this._process(!0);return e},blockSize:1}),r.mode={}),u=i.BlockCipherMode=n.extend({createEncryptor:function(e,t){return this.Encryptor.create(e,t)},createDecryptor:function(e,t){return this.Decryptor.create(e,t)},init:function(e,t){this._cipher=e,this._iv=t}}),l=h.CBC=function(){function e(e,r,i){var n=this._iv;if(n){var c=n;this._iv=t}else var c=this._prevBlock;for(var o=0;o<i;o++)e[r+o]^=c[o]}var r=u.extend();return r.Encryptor=r.extend({processBlock:function(t,r){var i=this._cipher,n=i.blockSize;e.call(this,t,r,n),i.encryptBlock(t,r),this._prevBlock=t.slice(r,r+n)}}),r.Decryptor=r.extend({processBlock:function(t,r){var i=this._cipher,n=i.blockSize,c=t.slice(r,r+n);i.decryptBlock(t,r),e.call(this,t,r,n),this._prevBlock=c}}),r}(),_=r.pad={},v=_.Pkcs7={pad:function(e,t){for(var r=4*t,i=r-e.sigBytes%r,n=i<<24|i<<16|i<<8|i,o=[],s=0;s<i;s+=4)o.push(n);var a=c.create(o,i);e.concat(a)},unpad:function(e){var t=255&e.words[e.sigBytes-1>>>2];e.sigBytes-=t}},y=(i.BlockCipher=d.extend({cfg:d.cfg.extend({mode:l,padding:v}),reset:function(){d.reset.call(this);var e=this.cfg,t=e.iv,r=e.mode;if(this._xformMode==this._ENC_XFORM_MODE)var i=r.createEncryptor;else{var i=r.createDecryptor;this._minBufferSize=1}this._mode&&this._mode.__creator==i?this._mode.init(this,t&&t.words):(this._mode=i.call(r,this,t&&t.words),this._mode.__creator=i)},_doProcessBlock:function(e,t){this._mode.processBlock(e,t)},_doFinalize:function(){var e=this.cfg.padding;if(this._xformMode==this._ENC_XFORM_MODE){e.pad(this._data,this.blockSize);var t=this._process(!0)}else{var t=this._process(!0);e.unpad(t)}return t},blockSize:4}),i.CipherParams=n.extend({init:function(e){this.mixIn(e)},toString:function(e){return(e||this.formatter).stringify(this)}})),m=r.format={},k=m.OpenSSL={stringify:function(e){var t=e.ciphertext,r=e.salt;if(r)var i=c.create([1398893684,1701076831]).concat(r).concat(t);else var i=t;return i.toString(a)},parse:function(e){var t=a.parse(e),r=t.words;if(1398893684==r[0]&&1701076831==r[1]){var i=c.create(r.slice(2,4));r.splice(0,4),t.sigBytes-=16}return y.create({ciphertext:t,salt:i})}},x=i.SerializableCipher=n.extend({cfg:n.extend({format:k}),encrypt:function(e,t,r,i){i=this.cfg.extend(i);var n=e.createEncryptor(r,i),c=n.finalize(t),o=n.cfg;return y.create({ciphertext:c,key:r,iv:o.iv,algorithm:e,mode:o.mode,padding:o.padding,blockSize:e.blockSize,formatter:i.format})},decrypt:function(e,t,r,i){i=this.cfg.extend(i),t=this._parse(t,i.format);var n=e.createDecryptor(r,i).finalize(t.ciphertext);return n},_parse:function(e,t){return"string"==typeof e?t.parse(e,this):e}}),g=r.kdf={},S=g.OpenSSL={execute:function(e,t,r,i){i||(i=c.random(8));var n=p.create({keySize:t+r}).compute(e,i),o=c.create(n.words.slice(t),4*r);return n.sigBytes=4*t,y.create({key:n,iv:o,salt:i})}},B=i.PasswordBasedCipher=x.extend({cfg:x.cfg.extend({kdf:S}),encrypt:function(e,t,r,i){i=this.cfg.extend(i);var n=i.kdf.execute(r,e.keySize,e.ivSize);i.iv=n.iv;var c=x.encrypt.call(this,e,t,n.key,i);return c.mixIn(n),c},decrypt:function(e,t,r,i){i=this.cfg.extend(i),t=this._parse(t,i.format);var n=i.kdf.execute(r,e.keySize,e.ivSize,t.salt);i.iv=n.iv;var c=x.decrypt.call(this,e,t,n.key,i);return c}})}()});
|
||||
//# sourceMappingURL=cipher-core.min.js.map
|
||||
!function(e,i){"object"==typeof exports?module.exports=exports=i(require("./core.min")):"function"==typeof define&&define.amd?define(["./core.min"],i):i(e.CryptoJS)}(this,function(e){!function(){var i=e,t=i.lib,n=t.Base,s=i.enc,r=s.Utf8,o=i.algo;o.HMAC=n.extend({init:function(e,i){e=this._hasher=new e.init,"string"==typeof i&&(i=r.parse(i));var t=e.blockSize,n=4*t;i.sigBytes>n&&(i=e.finalize(i)),i.clamp();for(var s=this._oKey=i.clone(),o=this._iKey=i.clone(),a=s.words,f=o.words,c=0;c<t;c++)a[c]^=1549556828,f[c]^=909522486;s.sigBytes=o.sigBytes=n,this.reset()},reset:function(){var e=this._hasher;e.reset(),e.update(this._iKey)},update:function(e){return this._hasher.update(e),this},finalize:function(e){var i=this._hasher,t=i.finalize(e);i.reset();var n=i.finalize(this._oKey.clone().concat(t));return n}})}()});
|
||||
//# sourceMappingURL=hmac.min.js.map
|
||||
!function(e,o,r){"object"==typeof exports?module.exports=exports=o(require("./core.min"),require("./cipher-core.min")):"function"==typeof define&&define.amd?define(["./core.min","./cipher-core.min"],o):o(e.CryptoJS)}(this,function(e){return e.mode.ECB=function(){var o=e.lib.BlockCipherMode.extend();return o.Encryptor=o.extend({processBlock:function(e,o){this._cipher.encryptBlock(e,o)}}),o.Decryptor=o.extend({processBlock:function(e,o){this._cipher.decryptBlock(e,o)}}),o}(),e.mode.ECB});
|
||||
//# sourceMappingURL=mode-ecb.min.js.map
|
||||
!function(e,r,i){"object"==typeof exports?module.exports=exports=r(require("./core.min"),require("./cipher-core.min")):"function"==typeof define&&define.amd?define(["./core.min","./cipher-core.min"],r):r(e.CryptoJS)}(this,function(e){return e.pad.Pkcs7});
|
||||
//# sourceMappingURL=pad-pkcs7.min.js.map
|
||||
!function(e,r,i){"object"==typeof exports?module.exports=exports=r(require("./core.min"),require("./enc-base64.min"),require("./md5.min"),require("./evpkdf.min"),require("./cipher-core.min")):"function"==typeof define&&define.amd?define(["./core.min","./enc-base64.min","./md5.min","./evpkdf.min","./cipher-core.min"],r):r(e.CryptoJS)}(this,function(e){return function(){var r=e,i=r.lib,n=i.BlockCipher,o=r.algo,t=[],c=[],s=[],f=[],a=[],d=[],u=[],v=[],h=[],y=[];!function(){for(var e=[],r=0;r<256;r++)r<128?e[r]=r<<1:e[r]=r<<1^283;for(var i=0,n=0,r=0;r<256;r++){var o=n^n<<1^n<<2^n<<3^n<<4;o=o>>>8^255&o^99,t[i]=o,c[o]=i;var p=e[i],l=e[p],_=e[l],k=257*e[o]^16843008*o;s[i]=k<<24|k>>>8,f[i]=k<<16|k>>>16,a[i]=k<<8|k>>>24,d[i]=k;var k=16843009*_^65537*l^257*p^16843008*i;u[o]=k<<24|k>>>8,v[o]=k<<16|k>>>16,h[o]=k<<8|k>>>24,y[o]=k,i?(i=p^e[e[e[_^p]]],n^=e[e[n]]):i=n=1}}();var p=[0,1,2,4,8,16,32,64,128,27,54],l=o.AES=n.extend({_doReset:function(){if(!this._nRounds||this._keyPriorReset!==this._key){for(var e=this._keyPriorReset=this._key,r=e.words,i=e.sigBytes/4,n=this._nRounds=i+6,o=4*(n+1),c=this._keySchedule=[],s=0;s<o;s++)if(s<i)c[s]=r[s];else{var f=c[s-1];s%i?i>6&&s%i==4&&(f=t[f>>>24]<<24|t[f>>>16&255]<<16|t[f>>>8&255]<<8|t[255&f]):(f=f<<8|f>>>24,f=t[f>>>24]<<24|t[f>>>16&255]<<16|t[f>>>8&255]<<8|t[255&f],f^=p[s/i|0]<<24),c[s]=c[s-i]^f}for(var a=this._invKeySchedule=[],d=0;d<o;d++){var s=o-d;if(d%4)var f=c[s];else var f=c[s-4];d<4||s<=4?a[d]=f:a[d]=u[t[f>>>24]]^v[t[f>>>16&255]]^h[t[f>>>8&255]]^y[t[255&f]]}}},encryptBlock:function(e,r){this._doCryptBlock(e,r,this._keySchedule,s,f,a,d,t)},decryptBlock:function(e,r){var i=e[r+1];e[r+1]=e[r+3],e[r+3]=i,this._doCryptBlock(e,r,this._invKeySchedule,u,v,h,y,c);var i=e[r+1];e[r+1]=e[r+3],e[r+3]=i},_doCryptBlock:function(e,r,i,n,o,t,c,s){for(var f=this._nRounds,a=e[r]^i[0],d=e[r+1]^i[1],u=e[r+2]^i[2],v=e[r+3]^i[3],h=4,y=1;y<f;y++){var p=n[a>>>24]^o[d>>>16&255]^t[u>>>8&255]^c[255&v]^i[h++],l=n[d>>>24]^o[u>>>16&255]^t[v>>>8&255]^c[255&a]^i[h++],_=n[u>>>24]^o[v>>>16&255]^t[a>>>8&255]^c[255&d]^i[h++],k=n[v>>>24]^o[a>>>16&255]^t[d>>>8&255]^c[255&u]^i[h++];a=p,d=l,u=_,v=k}var p=(s[a>>>24]<<24|s[d>>>16&255]<<16|s[u>>>8&255]<<8|s[255&v])^i[h++],l=(s[d>>>24]<<24|s[u>>>16&255]<<16|s[v>>>8&255]<<8|s[255&a])^i[h++],_=(s[u>>>24]<<24|s[v>>>16&255]<<16|s[a>>>8&255]<<8|s[255&d])^i[h++],k=(s[v>>>24]<<24|s[a>>>16&255]<<16|s[d>>>8&255]<<8|s[255&u])^i[h++];e[r]=p,e[r+1]=l,e[r+2]=_,e[r+3]=k},keySize:8});r.AES=n._createHelper(l)}(),e.AES});
|
||||
//# sourceMappingURL=aes.min.js.map
|
||||
!function(e,n){"object"==typeof exports?module.exports=exports=n(require("./core.min")):"function"==typeof define&&define.amd?define(["./core.min"],n):n(e.CryptoJS)}(this,function(e){return e.enc.Utf8});
|
||||
//# sourceMappingURL=enc-utf8.min.js.map
|
||||
var cbc_key = CryptoJS.enc.Utf8.parse("zhst@bonus@zhst@");
|
||||
var cbc_iv = CryptoJS.enc.Utf8.parse("1234567812345678");
|
||||
function encryptCBC(word){
|
||||
var srcs = CryptoJS.enc.Utf8.parse(word)
|
||||
var encrypted = CryptoJS.AES.encrypt(srcs, cbc_key, {
|
||||
iv: cbc_iv,
|
||||
mode: CryptoJS.mode.CBC,
|
||||
padding: CryptoJS.pad.Pkcs7
|
||||
});
|
||||
return encrypted.toString();
|
||||
}
|
||||
/**
|
||||
* 解密
|
||||
* @param word
|
||||
* @returns {*}
|
||||
*/
|
||||
function decryptCBC(word){
|
||||
var encrypted = CryptoJS.AES.decrypt(word, cbc_key, {
|
||||
iv: cbc_iv,
|
||||
mode: CryptoJS.mode.CBC,
|
||||
padding: CryptoJS.pad.Pkcs7
|
||||
});
|
||||
return encrypted.toString(CryptoJS.enc.Utf8);
|
||||
}
|
||||
|
||||
|
||||
/**
|
||||
* @param {Object} fmt
|
||||
* @param {Object} date时间格式化工具类
|
||||
*/
|
||||
function dateFtt(fmt, date) { //author: meizz
|
||||
var o = {
|
||||
"M+": date.getMonth() + 1, //月份
|
||||
"d+": date.getDate(), //日
|
||||
"h+": date.getHours(), //小时
|
||||
"m+": date.getMinutes(), //分
|
||||
"s+": date.getSeconds(), //秒
|
||||
"q+": Math.floor((date.getMonth() + 3) / 3), //季度
|
||||
"S": date.getMilliseconds() //毫秒
|
||||
};
|
||||
if(/(y+)/.test(fmt))
|
||||
fmt = fmt.replace(RegExp.$1, (date.getFullYear() + "").substr(4 - RegExp.$1.length));
|
||||
for(var k in o)
|
||||
if(new RegExp("(" + k + ")").test(fmt))
|
||||
fmt = fmt.replace(RegExp.$1, (RegExp.$1.length == 1) ? (o[k]) : (("00" + o[k]).substr(("" + o[k]).length)));
|
||||
return fmt;
|
||||
}
|
||||
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
|
|
@ -0,0 +1,2 @@
|
|||
let IP_ADDRESS='http://192.168.0.38:42880';
|
||||
let contentPath="/hn_cloud_web/";
|
||||
|
|
@ -1,5 +1,7 @@
|
|||
var dataUrl ="http://127.0.0.1:1917/hnMw/";//本地
|
||||
var imgUrld="http://127.0.0.1:1918/hnBmw/";//本地 用于图片展示 使用后台系统图片路径
|
||||
var dataUrl ="http://192.168.0.38:42880/realnameweb/";//本地
|
||||
var imgUrld="http://192.168.0.38:42880/realname/";
|
||||
let content_path="smz_screen"
|
||||
//本地 用于图片展示 使用后台系统图片路径
|
||||
// var dataUrl ="http://116.63.172.211:1917/hnMw/";//线上
|
||||
// var imgUrld="http://116.63.172.211:1918/hnBmw/";//线上 用于图片展示 使用后台系统图片路径
|
||||
// var dataUrl ="http://140.210.195.210:1917/gzrmw/";//部署
|
||||
|
|
@ -26,7 +28,7 @@ $(function() {
|
|||
// Token无效或过期，跳转登录页
|
||||
localStorage.removeItem('token');
|
||||
sessionStorage.removeItem('token');
|
||||
window.location.href = '/login.html';
|
||||
window.location.href =contant_path+ '/login.html';
|
||||
}
|
||||
}
|
||||
});
|
||||
|
|
@ -36,9 +38,8 @@ $(function() {
|
|||
headHTML += '<link rel="icon" href="../../img/favicon.ico" type="image/x-icon"/>';
|
||||
document.getElementsByTagName('head')[0].innerHTML = headHTML;
|
||||
if(token=="" || token==null){
|
||||
window.location.href = "http://116.63.172.211:2010/HnRealNameScreen/login.html";//线上
|
||||
// window.location.href = "http://127.0.0.1:8848/HnRealNameScreen/login.html";//本地
|
||||
// window.location.href = "http://140.210.195.210:1916/gzRealName_cs/login.html";
|
||||
window.location.href =contant_path+"/login.html";//线上
|
||||
|
||||
}
|
||||
})
|
||||
function isNull(str) {
|
||||
|
|
|
|||
|
|
@ -1,6 +1,5 @@
|
|||
var dataUrl ="http://127.0.0.1:1917/hnMw/";//本地
|
||||
// var dataUrl ="http://116.63.172.211:1917/hnMw/";//线上
|
||||
// var dataUrl ="http://140.210.195.210:1921/gzrmw/";//CS部署
|
||||
var dataUrl ="http://192.168.0.38:42880/realnameweb/";//本地
|
||||
|
||||
|
||||
var uuid=null;
|
||||
var interval=null;
|
||||
|
|
|
|||
Loading…
Reference in New Issue