// 主要JavaScript功能 // DOM加载完成后执行 document.addEventListener('DOMContentLoaded', function() { // 初始化工具提示 var tooltipTriggerList = [].slice.call(document.querySelectorAll('[data-bs-toggle="tooltip"]')); var tooltipList = tooltipTriggerList.map(function (tooltipTriggerEl) { return new bootstrap.Tooltip(tooltipTriggerEl); }); // 初始化弹出框 var popoverTriggerList = [].slice.call(document.querySelectorAll('[data-bs-toggle="popover"]')); var popoverList = popoverTriggerList.map(function (popoverTriggerEl) { return new bootstrap.Popover(popoverTriggerEl); }); }); // API请求封装 const API = { // 基础URL baseURL: '/api/v1', // 获取认证令牌 getAuthToken: function() { return localStorage.getItem('authToken'); }, // 设置认证令牌 setAuthToken: function(token) { localStorage.setItem('authToken', token); }, // 清除认证令牌 clearAuthToken: function() { localStorage.removeItem('authToken'); }, // 通用请求方法 request: function(method, url, data = null) { const options = { method: method, headers: { 'Content-Type': 'application/json', }, }; // 添加认证头 const token = this.getAuthToken(); if (token) { options.headers['Authorization'] = `Bearer ${token}`; } // 添加请求体 if (data) { options.body = JSON.stringify(data); } return fetch(this.baseURL + url, options) .then(response => { if (!response.ok) { throw new Error(`HTTP error! status: ${response.status}`); } return response.json(); }); }, // GET请求 get: function(url) { return this.request('GET', url); }, // POST请求 post: function(url, data) { return this.request('POST', url, data); }, // PUT请求 put: function(url, data) { return this.request('PUT', url, data); }, // DELETE请求 delete: function(url) { return this.request('DELETE', url); } }; // 用户认证相关功能 const Auth = { // 登录 login: function(username, password) { return API.post('/login', { username, password }) .then(response => { if (response.code === 200) { API.setAuthToken(response.data.token); localStorage.setItem('user', JSON.stringify(response.data.user)); return response.data; } else { throw new Error(response.message); } }); }, // 注册 register: function(userData) { return API.post('/register', userData) .then(response => { if (response.code === 201) { return response.data; } else { throw new Error(response.message); } }); }, // 登出 logout: function() { API.clearAuthToken(); localStorage.removeItem('user'); window.location.href = '/login'; }, // 获取当前用户 getCurrentUser: function() { const userStr = localStorage.getItem('user'); return userStr ? JSON.parse(userStr) : null; }, // 检查是否已登录 isLoggedIn: function() { return !!API.getAuthToken(); } }; // 商品相关功能 const Products = { // 获取商品列表 getList: function(page = 1, pageSize = 10, search = '') { let url = `/products?page=${page}&page_size=${pageSize}`; if (search) { url += `&search=${search}`; } return API.get(url); }, // 获取商品详情 getDetail: function(id) { return API.get(`/products/${id}`); }, // 创建商品 create: function(productData) { return API.post('/products', productData); }, // 更新商品 update: function(id, productData) { return API.put(`/products/${id}`, productData); }, // 删除商品 delete: function(id) { return API.delete(`/products/${id}`); } }; // 购物车相关功能 const Cart = { // 获取购物车内容 getItems: function() { return API.get('/cart'); }, // 添加商品到购物车 addItem: function(productId, quantity = 1) { return API.post('/cart/items', { product_id: productId, quantity }); }, // 更新购物车商品数量 updateItem: function(itemId, quantity) { return API.put(`/cart/items/${itemId}`, { quantity }); }, // 删除购物车商品 removeItem: function(itemId) { return API.delete(`/cart/items/${itemId}`); }, // 清空购物车 clear: function() { return API.delete('/cart'); } }; // 订单相关功能 const Orders = { // 获取订单列表 getList: function(page = 1, pageSize = 10) { return API.get(`/orders?page=${page}&page_size=${pageSize}`); }, // 获取订单详情 getDetail: function(id) { return API.get(`/orders/${id}`); }, // 创建订单 create: function(orderData) { return API.post('/orders', orderData); }, // 更新订单状态 updateStatus: function(id, status) { return API.put(`/orders/${id}`, { status }); } }; // 工具函数 const Utils = { // 显示提示消息 showAlert: function(message, type = 'info') { const alertDiv = document.createElement('div'); alertDiv.className = `alert alert-${type} alert-dismissible fade show`; alertDiv.innerHTML = ` ${message} `; const container = document.querySelector('.container'); container.insertBefore(alertDiv, container.firstChild); // 5秒后自动关闭 setTimeout(() => { alertDiv.remove(); }, 5000); }, // 格式化价格 formatPrice: function(price) { return `¥${parseFloat(price).toFixed(2)}`; }, // 格式化日期 formatDate: function(dateString) { const date = new Date(dateString); return date.toLocaleDateString('zh-CN', { year: 'numeric', month: 'long', day: 'numeric', hour: '2-digit', minute: '2-digit' }); }, // 显示加载状态 showLoading: function(element) { element.innerHTML = ' 加载中...'; element.disabled = true; }, // 隐藏加载状态 hideLoading: function(element, originalText) { element.innerHTML = originalText; element.disabled = false; }, // 确认对话框 confirm: function(message, callback) { if (confirm(message)) { callback(); } } }; // 页面初始化 document.addEventListener('DOMContentLoaded', function() { // 检查登录状态 if (Auth.isLoggedIn()) { const user = Auth.getCurrentUser(); // 更新导航栏显示用户信息 const navbar = document.querySelector('.navbar-nav'); if (navbar) { // 隐藏登录/注册链接 const loginLink = navbar.querySelector('a[href="/login"]'); const registerLink = navbar.querySelector('a[href="/register"]'); if (loginLink) loginLink.style.display = 'none'; if (registerLink) registerLink.style.display = 'none'; // 添加用户信息 const userItem = document.createElement('li'); userItem.className = 'nav-item dropdown'; userItem.innerHTML = ` ${user.username}
`; navbar.appendChild(userItem); } } }); // 导出对象供其他脚本使用 window.API = API; window.Auth = Auth; window.Products = Products; window.Cart = Cart; window.Orders = Orders; window.Utils = Utils;