You cannot select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

620 lines
35 KiB
HTML

This file contains ambiguous Unicode characters!

This file contains ambiguous Unicode characters that may be confused with others in your current locale. If your use case is intentional and legitimate, you can safely ignore this warning. Use the Escape button to highlight these characters.

<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>人力资源管理系统 - 人员详情</title>
<script src="https://cdn.tailwindcss.com"></script>
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Pacifico&display=swap" rel="stylesheet">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">
<script>
tailwind.config = {
theme: {
extend: {
colors: {
primary: '#2D5CF6',
secondary: '#F5F6FA',
},
borderRadius: {
'none': '0px',
'sm': '2px',
DEFAULT: '4px',
'md': '8px',
'lg': '12px',
'xl': '16px',
'2xl': '20px',
'3xl': '24px',
'full': '9999px',
'button': '4px'
}
}
}
}
</script>
<style>
.font-pacifico {
font-family: "Pacifico", serif;
}
.fa-icon {
display: flex;
justify-content: center;
align-items: center;
}
.scroll-container {
overflow: hidden;
white-space: nowrap;
}
.scroll-content {
display: inline-block;
animation: scroll 20s linear infinite;
}
@keyframes scroll {
0% {
transform: translateX(0);
}
100% {
transform: translateX(-50%);
}
}
</style>
</head>
<body class="bg-secondary min-h-[1024px] flex flex-col">
<!-- 顶部导航 -->
<!-- <header class="bg-primary text-white w-full fixed top-0 z-50 shadow-md">
<div class="container mx-auto px-4 h-[60px] flex items-center justify-between">
<div class="flex items-center">
<span class="font-pacifico text-2xl mr-10">人力</span>
</div>
<nav class="hidden md:flex space-x-6">
<a href="#" class="text-sm hover:text-gray-200 transition">多维统计</a>
<a href="#" class="text-sm hover:text-gray-200 transition">人员管理</a>
<a href="#" class="text-sm hover:text-gray-200 transition">组织管理</a>
<a href="#" class="text-sm hover:text-gray-200 transition">考勤管理</a>
<a href="#" class="text-sm hover:text-gray-200 transition">绩效管理</a>
<a href="#" class="text-sm hover:text-gray-200 transition">薪酬管理</a>
<a href="#" class="text-sm hover:text-gray-200 transition">知识库</a>
<a href="#" class="text-sm hover:text-gray-200 transition">后台管理</a>
</nav>
<div class="flex items-center space-x-4">
<div class="relative hidden lg:block">
<input type="text" placeholder="搜索..."
class="bg-white/20 text-sm py-1 px-3 pl-8 rounded-button text-white placeholder-white/70 focus:outline-none focus:ring-1 focus:ring-white w-40">
<i
class="fas fa-search fa-icon absolute left-2 top-1/2 transform -translate-y-1/2 text-sm text-white/70"></i>
</div>
<button
class="bg-white/10 hover:bg-white/20 text-sm px-3 py-1 rounded-button flex items-center space-x-1 transition">
<i class="fas fa-robot fa-icon text-sm"></i>
<span>AI助手</span>
</button>
<div class="relative">
<img src="https://mastergo.com/ai/api/search-image?query=professional20business20portrait20of20a20asian20male20executive20in20suit20with20clean20background20high20quality20photo20realistic20detailed20face20corporate20style&width=100&height=100&orientation=squarish&flag=3efee3725d19ed6e79a0117bb8d09db5"
alt="用户头像" class="w-8 h-8 rounded-full object-cover border-2 border-white/30">
</div>
</div>
</div>
</header> -->
<!-- 公告栏 -->
<div class="bg-white py-2 px-4 shadow-sm">
<div class="container mx-auto">
<div class="scroll-container">
<div class="scroll-content text-sm text-gray-600">
<span class="font-medium text-primary mr-4">公告:</span>
<span class="mr-8">2023年度绩效考核工作将于12月1日正式启动</span>
<span class="mr-8">公司年度旅游活动报名截止日期延长至11月30日</span>
<span class="mr-8">新员工入职培训将于下周一上午9点在3楼会议室举行</span>
<span class="mr-8">公司福利政策更新:新增子女教育补贴项目</span>
<span class="mr-8">IT部门提醒请及时更新您的电脑系统至最新版本</span>
</div>
</div>
</div>
</div>
<!-- 主内容区 -->
<main class="flex-1 container mx-auto px-4 py-6 mt-4">
<!-- 面包屑导航 -->
<div class="flex items-center text-sm text-gray-500 mb-4">
<a href="#" class="hover:text-primary">首页</a>
<i class="fas fa-chevron-right mx-2 text-xs"></i>
<a href="#" class="hover:text-primary">人员管理</a>
<i class="fas fa-chevron-right mx-2 text-xs"></i>
<span class="text-gray-700">人员详情</span>
</div>
<!-- 个人信息卡片 -->
<div class="bg-white rounded-lg shadow-md p-6 mb-6">
<div class="flex flex-col">
<!-- 头像区域 -->
<div class="flex-shrink-0 mb-4">
<img src="https://mastergo.com/ai/api/search-image?query=professional20business20portrait20of20a20asian20female20executive20in20suit20with20clean20background20high20quality20photo20realistic20detailed20face20corporate20style&width=80&height=80&orientation=squarish&flag=5ebb2186f7537b5a7e434d5cf8384120"
alt="员工头像" class="w-20 h-20 rounded-lg object-cover border border-gray-200">
</div>
<!-- 基本信息 -->
<div class="flex-1">
<div class="flex flex-col md:flex-row md:items-center md:justify-between mb-4">
<div>
<h1 class="text-2xl font-bold text-gray-800">林晓梅</h1>
<p class="text-gray-500">高级产品经理 | 产品研发中心</p>
</div>
<div class="flex space-x-2 mt-2 md:mt-0">
<button
class="bg-primary hover:bg-blue-700 text-white text-sm px-3 py-1 rounded-button flex items-center space-x-1 transition">
<i class="fas fa-edit fa-icon text-xs"></i>
<span>编辑</span>
</button>
<button
class="bg-white border border-gray-300 hover:bg-gray-50 text-gray-700 text-sm px-3 py-1 rounded-button flex items-center space-x-1 transition">
<i class="fas fa-print fa-icon text-xs"></i>
<span>打印</span>
</button>
</div>
</div>
<div class="grid grid-cols-2 md:grid-cols-4 gap-4">
<div>
<p class="text-xs text-gray-500">员工编号</p>
<p class="text-sm font-medium">EMP20230085</p>
</div>
<div>
<p class="text-xs text-gray-500">入职日期</p>
<p class="text-sm font-medium">2018-06-15</p>
</div>
<div>
<p class="text-xs text-gray-500">工作年限</p>
<p class="text-sm font-medium">5年4个月</p>
</div>
<div>
<p class="text-xs text-gray-500">员工状态</p>
<p class="text-sm font-medium text-green-600">在职</p>
</div>
</div>
</div>
</div>
</div>
<!-- 移除标签页导航 -->
<!-- 基本信息内容 -->
<div class="space-y-6 mb-6">
<!-- 个人信息 -->
<div class="bg-white rounded-lg shadow-md p-6">
<h2 class="text-lg font-medium text-gray-800 mb-4 flex items-center">
<i class="fas fa-user-circle fa-icon text-primary mr-2"></i>
<span>个人信息</span>
</h2>
<div class="space-y-4">
<div class="grid grid-cols-2 gap-4">
<div>
<p class="text-xs text-gray-500">姓名</p>
<p class="text-sm font-medium">林晓梅</p>
</div>
<div>
<p class="text-xs text-gray-500">性别</p>
<p class="text-sm font-medium"></p>
</div>
</div>
<div class="grid grid-cols-2 gap-4">
<div>
<p class="text-xs text-gray-500">出生日期</p>
<p class="text-sm font-medium">1990-08-23</p>
</div>
<div>
<p class="text-xs text-gray-500">年龄</p>
<p class="text-sm font-medium">33岁</p>
</div>
</div>
<div>
<p class="text-xs text-gray-500">身份证号</p>
<p class="text-sm font-medium">310******19900823****</p>
</div>
<div>
<p class="text-xs text-gray-500">婚姻状况</p>
<p class="text-sm font-medium">已婚</p>
</div>
<div>
<p class="text-xs text-gray-500">联系电话</p>
<p class="text-sm font-medium">138****5678</p>
</div>
<div>
<p class="text-xs text-gray-500">电子邮箱</p>
<p class="text-sm font-medium">linxiaomei@company.com</p>
</div>
<div>
<p class="text-xs text-gray-500">现居住地</p>
<p class="text-sm font-medium">上海市浦东新区张江高科技园区科苑路88号</p>
</div>
</div>
</div>
<!-- 工作信息 -->
<div class="bg-white rounded-lg shadow-md p-6">
<h2 class="text-lg font-medium text-gray-800 mb-4 flex items-center">
<i class="fas fa-briefcase fa-icon text-primary mr-2"></i>
<span>工作信息</span>
</h2>
<div class="space-y-4">
<div>
<p class="text-xs text-gray-500">所属部门</p>
<p class="text-sm font-medium">产品研发中心 - 产品设计部</p>
</div>
<div>
<p class="text-xs text-gray-500">直接上级</p>
<p class="text-sm font-medium">张伟(产品研发中心总监)</p>
</div>
<div class="grid grid-cols-2 gap-4">
<div>
<p class="text-xs text-gray-500">职位</p>
<p class="text-sm font-medium">高级产品经理</p>
</div>
<div>
<p class="text-xs text-gray-500">职级</p>
<p class="text-sm font-medium">P7</p>
</div>
</div>
<div class="grid grid-cols-2 gap-4">
<div>
<p class="text-xs text-gray-500">员工类型</p>
<p class="text-sm font-medium">正式员工</p>
</div>
<div>
<p class="text-xs text-gray-500">工作地点</p>
<p class="text-sm font-medium">上海总部</p>
</div>
</div>
<div>
<p class="text-xs text-gray-500">工作职责</p>
<p class="text-sm font-medium">负责公司核心产品线的规划与设计,主导产品全生命周期管理,协调跨部门资源推动产品落地</p>
</div>
</div>
</div>
<!-- 职业履历 -->
<div class="bg-white rounded-lg shadow-md p-6">
<h2 class="text-lg font-medium text-gray-800 mb-4 flex items-center">
<i class="fas fa-history fa-icon text-primary mr-2"></i>
<span>职业履历</span>
</h2>
<div class="overflow-x-auto">
<table class="min-w-full divide-y divide-gray-200">
<thead class="bg-gray-50">
<tr>
<th scope="col"
class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">
公司名称</th>
<th scope="col"
class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">
职位</th>
<th scope="col"
class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">
时间段</th>
<th scope="col"
class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">
工作内容</th>
<th scope="col"
class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">
状态</th>
</tr>
</thead>
<tbody class="bg-white divide-y divide-gray-200">
<tr>
<td class="px-6 py-4 whitespace-nowrap">
<div class="font-medium text-gray-800">上海科技有限公司</div>
</td>
<td class="px-6 py-4 whitespace-nowrap">
<div class="text-sm text-gray-600">高级产品经理</div>
</td>
<td class="px-6 py-4 whitespace-nowrap">
<div class="text-xs text-gray-500">2018-06-15 至今 · 5年4个月</div>
</td>
<td class="px-6 py-4">
<div class="text-sm text-gray-700">主导公司核心产品线的规划与设计带领5人产品团队成功推出3款市场领先产品用户增长300%
</div>
</td>
<td class="px-6 py-4 whitespace-nowrap">
<span class="px-2 py-1 text-xs rounded bg-primary/10 text-primary">当前公司</span>
</td>
</tr>
<tr>
<td class="px-6 py-4 whitespace-nowrap">
<div class="font-medium text-gray-800">北京创新科技有限公司</div>
</td>
<td class="px-6 py-4 whitespace-nowrap">
<div class="text-sm text-gray-600">产品经理</div>
</td>
<td class="px-6 py-4 whitespace-nowrap">
<div class="text-xs text-gray-500">2015-07-01 至 2018-05-30 · 2年11个月</div>
</td>
<td class="px-6 py-4">
<div class="text-sm text-gray-700">负责企业级SaaS产品的设计与迭代成功将产品NPS从35提升至72客户续费率提升至85%
</div>
</td>
<td class="px-6 py-4 whitespace-nowrap"></td>
</tr>
<tr>
<td class="px-6 py-4 whitespace-nowrap">
<div class="font-medium text-gray-800">深圳科技发展有限公司</div>
</td>
<td class="px-6 py-4 whitespace-nowrap">
<div class="text-sm text-gray-600">产品助理</div>
</td>
<td class="px-6 py-4 whitespace-nowrap">
<div class="text-xs text-gray-500">2013-09-01 至 2015-06-30 · 1年10个月</div>
</td>
<td class="px-6 py-4">
<div class="text-sm text-gray-700">协助产品经理完成需求分析、原型设计参与3个移动端项目从0到1的全过程</div>
</td>
<td class="px-6 py-4 whitespace-nowrap"></td>
</tr>
</tbody>
</table>
</div>
</div>
<!-- 教育经历 -->
<div class="bg-white rounded-lg shadow-md p-6">
<h2 class="text-lg font-medium text-gray-800 mb-4 flex items-center">
<i class="fas fa-graduation-cap fa-icon text-primary mr-2"></i>
<span>教育经历</span>
</h2>
<div class="overflow-x-auto">
<table class="min-w-full divide-y divide-gray-200">
<thead class="bg-gray-50">
<tr>
<th scope="col"
class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">
学校名称</th>
<th scope="col"
class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">
学历/专业</th>
<th scope="col"
class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">
时间段</th>
<th scope="col"
class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">
成绩/荣誉</th>
<th scope="col"
class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">
状态</th>
</tr>
</thead>
<tbody class="bg-white divide-y divide-gray-200">
<tr>
<td class="px-6 py-4 whitespace-nowrap">
<div class="font-medium text-gray-800">复旦大学</div>
</td>
<td class="px-6 py-4 whitespace-nowrap">
<div class="text-sm text-gray-600">计算机科学与技术 · 硕士</div>
</td>
<td class="px-6 py-4 whitespace-nowrap">
<div class="text-xs text-gray-500">2010-09-01 至 2013-06-30</div>
</td>
<td class="px-6 py-4">
<div class="text-sm text-gray-700">GPA 3.8/4.0,获得校级优秀毕业生称号,研究方向为人机交互与用户体验</div>
</td>
<td class="px-6 py-4 whitespace-nowrap">
<span class="px-2 py-1 text-xs rounded bg-primary/10 text-primary">最高学历</span>
</td>
</tr>
<tr>
<td class="px-6 py-4 whitespace-nowrap">
<div class="font-medium text-gray-800">南京大学</div>
</td>
<td class="px-6 py-4 whitespace-nowrap">
<div class="text-sm text-gray-600">软件工程 · 学士</div>
</td>
<td class="px-6 py-4 whitespace-nowrap">
<div class="text-xs text-gray-500">2006-09-01 至 2010-06-30</div>
</td>
<td class="px-6 py-4">
<div class="text-sm text-gray-700">GPA 3.6/4.0获得国家奖学金参与2项校级科研项目</div>
</td>
<td class="px-6 py-4 whitespace-nowrap"></td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
<!-- 组织架构图 -->
<div class="bg-white rounded-lg shadow-md p-6 mb-6">
<h2 class="text-lg font-medium text-gray-800 mb-4 flex items-center">
<i class="fas fa-sitemap fa-icon text-primary mr-2"></i>
<span>组织架构</span>
</h2>
<div class="bg-gray-100 rounded-lg p-4 h-64 flex items-center justify-center">
<img src="https://ai-public.mastergo.com/gen_page/map_placeholder_1280x720.png" alt="组织架构图"
class="max-w-full max-h-full object-contain">
</div>
</div>
<!-- 职业履历 -->
<div class="bg-white rounded-lg shadow-md p-6 mb-6">
<h2 class="text-lg font-medium text-gray-800 mb-4 flex items-center">
<i class="fas fa-history fa-icon text-primary mr-2"></i>
<span>职业履历</span>
</h2>
<div class="space-y-4">
<!-- 当前公司经历 -->
<div class="border-l-2 border-primary pl-4 py-2">
<div class="flex justify-between items-start">
<div>
<h3 class="font-medium text-gray-800">上海科技有限公司</h3>
<p class="text-sm text-gray-600">高级产品经理</p>
</div>
<span class="text-xs bg-primary/10 text-primary px-2 py-1 rounded">当前公司</span>
</div>
<p class="text-xs text-gray-500 mt-1">2018-06-15 至今 · 5年4个月</p>
<p class="text-sm text-gray-700 mt-2">主导公司核心产品线的规划与设计带领5人产品团队成功推出3款市场领先产品用户增长300%</p>
</div>
<!-- 过往经历1 -->
<div class="border-l-2 border-gray-200 pl-4 py-2">
<div class="flex justify-between items-start">
<div>
<h3 class="font-medium text-gray-800">北京创新科技有限公司</h3>
<p class="text-sm text-gray-600">产品经理</p>
</div>
</div>
<p class="text-xs text-gray-500 mt-1">2015-07-01 至 2018-05-30 · 2年11个月</p>
<p class="text-sm text-gray-700 mt-2">负责企业级SaaS产品的设计与迭代成功将产品NPS从35提升至72客户续费率提升至85%</p>
</div>
<!-- 过往经历2 -->
<div class="border-l-2 border-gray-200 pl-4 py-2">
<div class="flex justify-between items-start">
<div>
<h3 class="font-medium text-gray-800">深圳科技发展有限公司</h3>
<p class="text-sm text-gray-600">产品助理</p>
</div>
</div>
<p class="text-xs text-gray-500 mt-1">2013-09-01 至 2015-06-30 · 1年10个月</p>
<p class="text-sm text-gray-700 mt-2">协助产品经理完成需求分析、原型设计参与3个移动端项目从0到1的全过程</p>
</div>
</div>
</div>
<!-- 教育经历 -->
<div class="bg-white rounded-lg shadow-md p-6">
<h2 class="text-lg font-medium text-gray-800 mb-4 flex items-center">
<i class="fas fa-graduation-cap fa-icon text-primary mr-2"></i>
<span>教育经历</span>
</h2>
<div class="overflow-x-auto">
<table class="min-w-full divide-y divide-gray-200">
<thead class="bg-gray-50">
<tr>
<th scope="col"
class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">
学校名称</th>
<th scope="col"
class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">
学历/专业</th>
<th scope="col"
class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">
时间段</th>
<th scope="col"
class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">
成绩/荣誉</th>
<th scope="col"
class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">
状态</th>
</tr>
</thead>
<tbody class="bg-white divide-y divide-gray-200">
<tr>
<td class="px-6 py-4 whitespace-nowrap">
<div class="font-medium text-gray-800">复旦大学</div>
</td>
<td class="px-6 py-4 whitespace-nowrap">
<div class="text-sm text-gray-600">计算机科学与技术 · 硕士</div>
</td>
<td class="px-6 py-4 whitespace-nowrap">
<div class="text-xs text-gray-500">2010-09-01 至 2013-06-30</div>
</td>
<td class="px-6 py-4">
<div class="text-sm text-gray-700">GPA 3.8/4.0,获得校级优秀毕业生称号,研究方向为人机交互与用户体验</div>
</td>
<td class="px-6 py-4 whitespace-nowrap">
<span class="px-2 py-1 text-xs rounded bg-primary/10 text-primary">最高学历</span>
</td>
</tr>
<tr>
<td class="px-6 py-4 whitespace-nowrap">
<div class="font-medium text-gray-800">南京大学</div>
</td>
<td class="px-6 py-4 whitespace-nowrap">
<div class="text-sm text-gray-600">软件工程 · 学士</div>
</td>
<td class="px-6 py-4 whitespace-nowrap">
<div class="text-xs text-gray-500">2006-09-01 至 2010-06-30</div>
</td>
<td class="px-6 py-4">
<div class="text-sm text-gray-700">GPA 3.6/4.0获得国家奖学金参与2项校级科研项目</div>
</td>
<td class="px-6 py-4 whitespace-nowrap"></td>
</tr>
</tbody>
</table>
</div>
</div>
</main>
<!-- 底部通栏 -->
<footer class="bg-gray-800 text-white w-full py-8">
<div class="container mx-auto px-4">
<div class="grid grid-cols-1 md:grid-cols-4 gap-8 mb-6">
<div>
<h3 class="text-sm font-medium mb-4">关于我们</h3>
<ul class="space-y-2 text-xs text-gray-300">
<li><a href="#" class="hover:text-white transition">公司简介</a></li>
<li><a href="#" class="hover:text-white transition">发展历程</a></li>
<li><a href="#" class="hover:text-white transition">企业文化</a></li>
<li><a href="#" class="hover:text-white transition">管理团队</a></li>
<li><a href="#" class="hover:text-white transition">加入我们</a></li>
</ul>
</div>
<div>
<h3 class="text-sm font-medium mb-4">产品服务</h3>
<ul class="space-y-2 text-xs text-gray-300">
<li><a href="#" class="hover:text-white transition">人力资源系统</a></li>
<li><a href="#" class="hover:text-white transition">薪酬管理系统</a></li>
<li><a href="#" class="hover:text-white transition">绩效管理系统</a></li>
<li><a href="#" class="hover:text-white transition">考勤管理系统</a></li>
<li><a href="#" class="hover:text-white transition">培训管理系统</a></li>
</ul>
</div>
<div>
<h3 class="text-sm font-medium mb-4">帮助中心</h3>
<ul class="space-y-2 text-xs text-gray-300">
<li><a href="#" class="hover:text-white transition">使用文档</a></li>
<li><a href="#" class="hover:text-white transition">视频教程</a></li>
<li><a href="#" class="hover:text-white transition">常见问题</a></li>
<li><a href="#" class="hover:text-white transition">API接口</a></li>
<li><a href="#" class="hover:text-white transition">联系我们</a></li>
</ul>
</div>
<div>
<h3 class="text-sm font-medium mb-4">联系我们</h3>
<ul class="space-y-2 text-xs text-gray-300">
<li class="flex items-start">
<i class="fas fa-map-marker-alt fa-icon mr-2 mt-0.5"></i>
<span>上海市浦东新区张江高科技园区科苑路88号</span>
</li>
<li class="flex items-center">
<i class="fas fa-phone fa-icon mr-2"></i>
<span>400-888-8888</span>
</li>
<li class="flex items-center">
<i class="fas fa-envelope fa-icon mr-2"></i>
<span>service@hrsystem.com</span>
</li>
<li class="flex items-center space-x-3 mt-4">
<a href="#"
class="w-6 h-6 rounded-full bg-gray-700 flex items-center justify-center hover:bg-primary transition">
<i class="fab fa-weixin fa-icon text-xs"></i>
</a>
<a href="#"
class="w-6 h-6 rounded-full bg-gray-700 flex items-center justify-center hover:bg-primary transition">
<i class="fab fa-weibo fa-icon text-xs"></i>
</a>
<a href="#"
class="w-6 h-6 rounded-full bg-gray-700 flex items-center justify-center hover:bg-primary transition">
<i class="fab fa-linkedin-in fa-icon text-xs"></i>
</a>
</li>
</ul>
</div>
</div>
<div class="border-t border-gray-700 pt-6">
<div class="flex flex-col md:flex-row justify-between items-center">
<p class="text-xs text-gray-400 mb-2 md:mb-0">© 2023 人力资源管理系统 版权所有</p>
<div class="flex space-x-4">
<a href="#" class="text-xs text-gray-400 hover:text-white transition">隐私政策</a>
<a href="#" class="text-xs text-gray-400 hover:text-white transition">服务条款</a>
<a href="#" class="text-xs text-gray-400 hover:text-white transition">法律声明</a>
<a href="#" class="text-xs text-gray-400 hover:text-white transition">沪ICP备12345678号-1</a>
</div>
</div>
</div>
</div>
</footer>
</body>
</html>