next.js搭建路由01

crop-x/src/app/central-config/user-management/page.tsx

@@ -0,0 +1,178 @@
+import Link from 'next/link'
+import { Metadata } from 'next'
+
+export const metadata: Metadata = {
+  title: '用户管理 - Crop-X 智慧农业管理系统',
+  description: '用户管理页面',
+}
+
+export default function UserManagementPage() {
+  return (
+    <div className="space-y-6">
+      <div className="bg-white rounded-lg shadow p-6">
+        <h2 className="text-xl font-semibold text-gray-800 mb-4">
+          用户管理
+        </h2>
+        <p className="text-gray-600 mb-6">
+          管理用户账号、角色权限和行为跟踪
+        </p>
+
+        <div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6">
+          <Link
+            href="/central-config/user-management/user-account-management"
+            className="block p-4 bg-green-50 rounded-lg hover:bg-green-100 transition-colors"
+          >
+            <h3 className="font-semibold text-green-900 mb-2">
+              👤 用户账号管理
+            </h3>
+            <p className="text-green-700 text-sm">
+              创建、编辑和管理用户账号
+            </p>
+          </Link>
+
+          <Link
+            href="/central-config/user-management/role-permission-management"
+            className="block p-4 bg-blue-50 rounded-lg hover:bg-blue-100 transition-colors"
+          >
+            <h3 className="font-semibold text-blue-900 mb-2">
+              🔐 角色权限管理
+            </h3>
+            <p className="text-blue-700 text-sm">
+              配置用户角色和权限设置
+            </p>
+          </Link>
+
+          <Link
+            href="/central-config/user-management/user-behavior-tracking"
+            className="block p-4 bg-purple-50 rounded-lg hover:bg-purple-100 transition-colors"
+          >
+            <h3 className="font-semibold text-purple-900 mb-2">
+              📊 用户行为跟踪
+            </h3>
+            <p className="text-purple-700 text-sm">
+              监控用户操作行为和数据
+            </p>
+          </Link>
+        </div>
+      </div>
+
+      <div className="grid grid-cols-1 md:grid-cols-2 gap-6">
+        <div className="bg-white rounded-lg shadow p-6">
+          <h3 className="text-lg font-semibold text-gray-800 mb-4">
+            📊 用户统计概览
+          </h3>
+          <div className="space-y-2">
+            <div className="flex justify-between items-center">
+              <span className="text-gray-600">总用户数</span>
+              <span className="text-green-600 font-semibold">248 人</span>
+            </div>
+            <div className="flex justify-between items-center">
+              <span className="text-gray-600">活跃用户</span>
+              <span className="text-blue-600 font-semibold">186 人</span>
+            </div>
+            <div className="flex justify-between items-center">
+              <span className="text-gray-600">新注册用户</span>
+              <span className="text-purple-600 font-semibold">12 人</span>
+            </div>
+            <div className="flex justify-between items-center">
+              <span className="text-gray-600">待审核用户</span>
+              <span className="text-orange-600 font-semibold">5 人</span>
+            </div>
+          </div>
+        </div>
+
+        <div className="bg-white rounded-lg shadow p-6">
+          <h3 className="text-lg font-semibold text-gray-800 mb-4">
+            🔧 快速操作
+          </h3>
+          <div className="space-y-2">
+            <button className="w-full px-4 py-2 bg-green-600 text-white rounded hover:bg-green-700 transition-colors">
+              创建新用户
+            </button>
+            <button className="w-full px-4 py-2 bg-blue-600 text-white rounded hover:bg-blue-700 transition-colors">
+              批量导入用户
+            </button>
+            <button className="w-full px-4 py-2 bg-purple-600 text-white rounded hover:bg-purple-700 transition-colors">
+              用户权限配置
+            </button>
+          </div>
+        </div>
+      </div>
+
+      <div className="bg-white rounded-lg shadow p-6">
+        <h3 className="text-lg font-semibold text-gray-800 mb-4">
+          📋 最近登录用户
+        </h3>
+        <div className="overflow-x-auto">
+          <table className="min-w-full divide-y divide-gray-200">
+            <thead className="bg-gray-50">
+              <tr>
+                <th className="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">
+                  用户名
+                </th>
+                <th className="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">
+                  姓名
+                </th>
+                <th className="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">
+                  角色
+                </th>
+                <th className="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">
+                  租户
+                </th>
+                <th className="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">
+                  最后登录
+                </th>
+                <th className="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">
+                  状态
+                </th>
+                <th className="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">
+                  操作
+                </th>
+              </tr>
+            </thead>
+            <tbody className="bg-white divide-y divide-gray-200">
+              {[
+                { username: 'admin', name: '系统管理员', role: '超级管理员', tenant: '系统', lastLogin: '2024-10-20 15:30', status: 'active' },
+                { username: 'zhangsan', name: '张三', role: '农场管理员', tenant: '绿色农业合作社', lastLogin: '2024-10-20 14:15', status: 'active' },
+                { username: 'lisi', name: '李四', role: '农机操作员', tenant: '丰收农场', lastLogin: '2024-10-20 12:45', status: 'active' },
+                { username: 'wangwu', name: '王五', role: '技术员', tenant: '智慧农业科技', lastLogin: '2024-10-19 16:20', status: 'inactive' },
+                { username: 'zhaoliu', name: '赵六', role: '观察员', tenant: '现代农业示范园', lastLogin: '2024-10-18 09:30', status: 'pending' },
+              ].map((user, index) => (
+                <tr key={index}>
+                  <td className="px-6 py-4 whitespace-nowrap text-sm font-medium text-gray-900">
+                    {user.username}
+                  </td>
+                  <td className="px-6 py-4 whitespace-nowrap text-sm text-gray-500">
+                    {user.name}
+                  </td>
+                  <td className="px-6 py-4 whitespace-nowrap text-sm text-gray-500">
+                    {user.role}
+                  </td>
+                  <td className="px-6 py-4 whitespace-nowrap text-sm text-gray-500">
+                    {user.tenant}
+                  </td>
+                  <td className="px-6 py-4 whitespace-nowrap text-sm text-gray-500">
+                    {user.lastLogin}
+                  </td>
+                  <td className="px-6 py-4 whitespace-nowrap">
+                    <span className={`px-2 py-1 text-xs font-medium rounded-full ${
+                      user.status === 'active' ? 'bg-green-100 text-green-800' :
+                      user.status === 'inactive' ? 'bg-gray-100 text-gray-800' :
+                      'bg-yellow-100 text-yellow-800'
+                    }`}>
+                      {user.status === 'active' ? '活跃' : user.status === 'inactive' ? '未激活' : '待审核'}
+                    </span>
+                  </td>
+                  <td className="px-6 py-4 whitespace-nowrap text-sm font-medium">
+                    <button className="text-blue-600 hover:text-blue-900 mr-3">编辑</button>
+                    <button className="text-red-600 hover:text-red-900">删除</button>
+                  </td>
+                </tr>
+              ))}
+            </tbody>
+          </table>
+        </div>
+      </div>
+    </div>
+  )
+}