实现了管理员用户登录校验，完成了用户管理界面和商品管理界面
This commit is contained in:
puzvv
@@ -5,6 +5,10 @@
|
||||
<link rel="icon" type="image/svg+xml" href="/logo.png" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||
<title>Hucky</title>
|
||||
<link
|
||||
rel="stylesheet"
|
||||
href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css"
|
||||
/>
|
||||
</head>
|
||||
<body>
|
||||
<div id="app"></div>
|
||||
|
||||
@@ -3,6 +3,7 @@ import type {
|
||||
// ProductListItem,
|
||||
ProductCategory,
|
||||
ProductDetail,
|
||||
ProductDTO,
|
||||
ProductPageParams,
|
||||
ProductPageResponse,
|
||||
} from "@/types/product";
|
||||
@@ -39,3 +40,29 @@ export const getProductDetail = (id: number) => {
|
||||
method: "get",
|
||||
});
|
||||
};
|
||||
|
||||
// 新增商品
|
||||
export const saveProduct = (data: ProductDTO) => {
|
||||
return http({
|
||||
url: "/product",
|
||||
method: "post",
|
||||
data,
|
||||
});
|
||||
};
|
||||
|
||||
// 更新商品
|
||||
export const updateProduct = (data: ProductDTO) => {
|
||||
return http({
|
||||
url: "/product",
|
||||
method: "put",
|
||||
data,
|
||||
});
|
||||
};
|
||||
|
||||
// 更新商品状态（上下架）
|
||||
export const updateProductStatus = (id: number, status: number) => {
|
||||
return http({
|
||||
url: `/product/status/${id}/${status}`,
|
||||
method: "put",
|
||||
});
|
||||
};
|
||||
|
||||
@@ -4,6 +4,7 @@ import {
|
||||
LoginResponse,
|
||||
RegisterRequest,
|
||||
UserInfo,
|
||||
UserDTO,
|
||||
} from "@/types/user.ts";
|
||||
import { UserAddress, UserAddressForm } from "@/types/address.ts";
|
||||
|
||||
@@ -51,6 +52,14 @@ export const getUserProfile = (id: number) => {
|
||||
});
|
||||
};
|
||||
|
||||
// 获取用户列表（管理员）
|
||||
export const getUserList = () => {
|
||||
return http<UserDTO[]>({
|
||||
url: "/user/admin",
|
||||
method: "get",
|
||||
});
|
||||
};
|
||||
|
||||
// 更新用户信息
|
||||
export const updateUserProfile = (data: Partial<UserInfo>) => {
|
||||
return http({
|
||||
|
||||
@@ -1,4 +1,3 @@
|
||||
NEW_FILE_CODE
|
||||
<script lang="ts" setup>
|
||||
// import { useRouter } from "vue-router";
|
||||
|
||||
|
||||
135
src/layouts/ManageLayout.vue
Normal file
135
src/layouts/ManageLayout.vue
Normal file
@@ -0,0 +1,135 @@
|
||||
<template>
|
||||
<div class="admin-layout flex h-screen bg-gray-100">
|
||||
<!-- 侧边栏 -->
|
||||
<aside class="w-64 bg-gray-800 text-white flex flex-col">
|
||||
<div class="p-4 border-b border-gray-700">
|
||||
<h1 class="text-xl font-bold">管理员面板</h1>
|
||||
</div>
|
||||
|
||||
<nav class="flex-1 p-2">
|
||||
<ul class="space-y-1">
|
||||
<li>
|
||||
<router-link
|
||||
to="/admin/user"
|
||||
class="flex items-center p-3 rounded-lg hover:bg-gray-700 transition-colors"
|
||||
>
|
||||
<i class="fa-solid fa-users mr-3"></i>
|
||||
<span>用户管理</span>
|
||||
</router-link>
|
||||
</li>
|
||||
|
||||
<li>
|
||||
<router-link
|
||||
to="/admin/category"
|
||||
class="flex items-center p-3 rounded-lg hover:bg-gray-700 transition-colors"
|
||||
>
|
||||
<i class="fa-solid fa-tags mr-3"></i>
|
||||
<span>分类管理</span>
|
||||
</router-link>
|
||||
</li>
|
||||
|
||||
<li>
|
||||
<router-link
|
||||
to="/admin/product"
|
||||
class="flex items-center p-3 rounded-lg hover:bg-gray-700 transition-colors"
|
||||
>
|
||||
<i class="fa-solid fa-box mr-3"></i>
|
||||
<span>商品管理</span>
|
||||
</router-link>
|
||||
</li>
|
||||
|
||||
<li>
|
||||
<router-link
|
||||
to="/admin/orders"
|
||||
class="flex items-center p-3 rounded-lg hover:bg-gray-700 transition-colors"
|
||||
>
|
||||
<i class="fa-solid fa-file-invoice mr-3"></i>
|
||||
<span>订单管理</span>
|
||||
</router-link>
|
||||
</li>
|
||||
</ul>
|
||||
</nav>
|
||||
|
||||
<div class="p-4 border-t border-gray-700">
|
||||
<div class="flex items-center">
|
||||
<div class="mr-3">
|
||||
<div
|
||||
class="w-10 h-10 rounded-full bg-gray-600 flex items-center justify-center"
|
||||
>
|
||||
<i class="fa-solid fa-user-gear"></i>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<p class="text-sm font-medium">{{ userNickname }}</p>
|
||||
<p class="text-xs text-gray-400">管理员</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</aside>
|
||||
|
||||
<!-- 主内容区域 -->
|
||||
<main class="flex-1 overflow-auto">
|
||||
<header class="bg-white shadow-sm p-4 flex justify-between items-center">
|
||||
<h2 class="text-lg font-semibold text-gray-800">
|
||||
{{ getCurrentPageTitle }}
|
||||
</h2>
|
||||
<div class="flex items-center space-x-4">
|
||||
<button class="p-2 rounded-full hover:bg-gray-100">
|
||||
<i class="fa-solid fa-bell text-gray-600"></i>
|
||||
</button>
|
||||
<button
|
||||
@click="handleLogout"
|
||||
class="px-4 py-2 bg-red-500 text-white rounded-lg hover:bg-red-600 transition-colors"
|
||||
>
|
||||
退出登录
|
||||
</button>
|
||||
</div>
|
||||
</header>
|
||||
|
||||
<div class="p-6">
|
||||
<slot />
|
||||
</div>
|
||||
</main>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script lang="ts" setup>
|
||||
import { computed } from "vue";
|
||||
import { useRouter, useRoute } from "vue-router";
|
||||
import { useUserStore } from "@/stores/UserStore";
|
||||
import { ElMessage } from "element-plus";
|
||||
|
||||
const router = useRouter();
|
||||
const route = useRoute();
|
||||
const userStore = useUserStore();
|
||||
|
||||
// 计算属性：获取用户昵称
|
||||
const userNickname = computed(() => {
|
||||
return (
|
||||
userStore.userInfo?.nickname || userStore.userInfo?.username || "管理员"
|
||||
);
|
||||
});
|
||||
|
||||
// 计算属性：获取当前页面标题
|
||||
const getCurrentPageTitle = computed(() => {
|
||||
const path = route.path;
|
||||
if (path.includes("/admin/user")) return "用户管理";
|
||||
if (path.includes("/admin/category")) return "分类管理";
|
||||
if (path.includes("/admin/product")) return "商品管理";
|
||||
if (path.includes("/admin/order")) return "订单管理";
|
||||
return "管理员面板";
|
||||
});
|
||||
|
||||
// 用户退出登录
|
||||
const handleLogout = () => {
|
||||
userStore.clearUserInfo();
|
||||
ElMessage.success("退出登录成功");
|
||||
router.push("/user/login");
|
||||
};
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.admin-layout {
|
||||
font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;
|
||||
}
|
||||
</style>
|
||||
470
src/pages/admin/ProductPage.vue
Normal file
470
src/pages/admin/ProductPage.vue
Normal file
@@ -0,0 +1,470 @@
|
||||
<template>
|
||||
<ManageLayout>
|
||||
<div class="product-manage-page">
|
||||
<!-- 搜索和操作按钮 -->
|
||||
<div class="mb-6 flex justify-between items-center">
|
||||
<div class="flex items-center">
|
||||
<el-input
|
||||
v-model="searchKeyword"
|
||||
placeholder="搜索商品名称或分类"
|
||||
style="width: 300px; margin-right: 16px"
|
||||
@keyup.enter="handleSearch"
|
||||
>
|
||||
<template #prefix>
|
||||
<i class="fa fa-search"></i>
|
||||
</template>
|
||||
</el-input>
|
||||
<el-button type="primary" @click="handleSearch">搜索</el-button>
|
||||
</div>
|
||||
<el-button type="success" @click="showAddProductDialog = true">
|
||||
<i class="fa fa-plus mr-1"></i> 添加商品
|
||||
</el-button>
|
||||
</div>
|
||||
|
||||
<!-- 商品表格 -->
|
||||
<el-table
|
||||
:data="paginatedProducts"
|
||||
style="width: 100%"
|
||||
v-loading="loading"
|
||||
border
|
||||
>
|
||||
<el-table-column prop="id" label="ID" width="80" />
|
||||
<el-table-column prop="name" label="商品名称" />
|
||||
<el-table-column prop="categoryName" label="分类" />
|
||||
<el-table-column prop="price" label="价格" width="100">
|
||||
<template #default="{ row }"> ¥{{ row.price }} </template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="stock" label="库存" width="100" />
|
||||
<el-table-column prop="sales" label="销量" width="100" />
|
||||
<el-table-column prop="userId" label="商家ID" width="100">
|
||||
<template #default="{ row }">
|
||||
{{ row.userId }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="商家名称" width="120">
|
||||
<template #default="{ row }">
|
||||
{{ getUserById(row.userId || 0)?.username || "未知商家" }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="status" label="状态" width="100">
|
||||
<template #default="{ row }">
|
||||
<el-tag :type="row.status === 1 ? 'success' : 'danger'">
|
||||
{{ row.status === 1 ? "上架" : "下架" }}
|
||||
</el-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="操作" width="380">
|
||||
<template #default="{ row }">
|
||||
<el-button size="small" @click="editProduct(row)">编辑</el-button>
|
||||
<el-button
|
||||
size="small"
|
||||
:type="row.status === 1 ? 'warning' : 'success'"
|
||||
@click="toggleProductStatus(row)"
|
||||
>
|
||||
{{ row.status === 1 ? "下架" : "上架" }}
|
||||
</el-button>
|
||||
<el-button size="small" type="danger" @click="deleteProduct(row)">
|
||||
删除
|
||||
</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
|
||||
<!-- 分页 -->
|
||||
<div class="mt-6 flex justify-center">
|
||||
<el-pagination
|
||||
@size-change="handleSizeChange"
|
||||
@current-change="handleCurrentChange"
|
||||
:current-page="currentPage"
|
||||
:page-sizes="[5, 10, 20, 50]"
|
||||
:page-size="pageSize"
|
||||
layout="total, sizes, prev, pager, next, jumper"
|
||||
:total="filteredProducts.length"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<!-- 添加/编辑商品对话框 -->
|
||||
<el-dialog
|
||||
:title="isEditing ? '编辑商品' : '添加商品'"
|
||||
v-model="showAddProductDialog"
|
||||
width="600px"
|
||||
>
|
||||
<el-form
|
||||
:model="productForm"
|
||||
:rules="productFormRules"
|
||||
ref="productFormRef"
|
||||
label-width="100px"
|
||||
>
|
||||
<el-form-item label="商品名称" prop="name">
|
||||
<el-input v-model="productForm.name" />
|
||||
</el-form-item>
|
||||
<el-form-item label="分类" prop="categoryId">
|
||||
<el-select
|
||||
v-model="productForm.categoryId"
|
||||
placeholder="请选择分类"
|
||||
>
|
||||
<el-option
|
||||
v-for="category in categories"
|
||||
:key="category.id"
|
||||
:label="category.name"
|
||||
:value="category.id"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="副标题" prop="subtitle">
|
||||
<el-input v-model="productForm.subtitle" />
|
||||
</el-form-item>
|
||||
<el-form-item label="主图" prop="mainImage">
|
||||
<el-input v-model="productForm.mainImage" placeholder="图片URL" />
|
||||
</el-form-item>
|
||||
<el-form-item label="价格" prop="price">
|
||||
<el-input-number
|
||||
v-model="productForm.price"
|
||||
:precision="2"
|
||||
:min="0"
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item label="库存" prop="stock">
|
||||
<el-input-number v-model="productForm.stock" :min="0" />
|
||||
</el-form-item>
|
||||
<el-form-item label="描述" prop="description">
|
||||
<el-input
|
||||
v-model="productForm.description"
|
||||
type="textarea"
|
||||
:rows="3"
|
||||
placeholder="商品描述"
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item label="排序" prop="sort">
|
||||
<el-input-number v-model="productForm.sort" :min="0" />
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<template #footer>
|
||||
<div class="dialog-footer">
|
||||
<el-button @click="showAddProductDialog = false">取消</el-button>
|
||||
<el-button type="primary" @click="submitProductForm"
|
||||
>确定</el-button
|
||||
>
|
||||
</div>
|
||||
</template>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</ManageLayout>
|
||||
</template>
|
||||
|
||||
<script lang="ts" setup>
|
||||
import { ref, reactive, computed, onMounted } from "vue";
|
||||
import { ElMessage, ElMessageBox } from "element-plus";
|
||||
import {
|
||||
getProductList,
|
||||
getProductCategories,
|
||||
saveProduct,
|
||||
updateProduct,
|
||||
updateProductStatus,
|
||||
} from "@/apis/product";
|
||||
import { getUserList } from "@/apis/user"; // 导入获取用户列表的API
|
||||
import { ProductListItem, ProductCategory, ProductDTO } from "@/types/product";
|
||||
import { UserDTO } from "@/types/user"; // 导入用户类型
|
||||
import ManageLayout from "@/layouts/ManageLayout.vue";
|
||||
import { useRouter } from "vue-router";
|
||||
import { useUserStore } from "@/stores/UserStore";
|
||||
|
||||
// 获取用户存储和路由
|
||||
const userStore = useUserStore();
|
||||
const router = useRouter();
|
||||
|
||||
// 响应式数据
|
||||
const loading = ref(false);
|
||||
const searchKeyword = ref("");
|
||||
const showAddProductDialog = ref(false);
|
||||
const isEditing = ref(false);
|
||||
const productFormRef = ref();
|
||||
|
||||
// 分页数据
|
||||
const currentPage = ref(1);
|
||||
const pageSize = ref(10);
|
||||
|
||||
// 商品表单
|
||||
const productForm = ref<ProductDTO>({
|
||||
id: undefined,
|
||||
categoryId: 0, // 设置默认值为0
|
||||
name: "",
|
||||
subtitle: "",
|
||||
mainImage: "",
|
||||
description: "",
|
||||
price: 0,
|
||||
stock: 0,
|
||||
sort: 0,
|
||||
});
|
||||
|
||||
// 所有商品数据
|
||||
const products = ref<ProductListItem[]>([]);
|
||||
|
||||
// 商品分类
|
||||
const categories = ref<ProductCategory[]>([]);
|
||||
|
||||
// 所有用户数据（用于获取商家名称）
|
||||
const users = ref<UserDTO[]>([]);
|
||||
|
||||
// 商品表单验证规则
|
||||
const productFormRules = reactive({
|
||||
name: [
|
||||
{ required: true, message: "请输入商品名称", trigger: "blur" },
|
||||
{
|
||||
min: 2,
|
||||
max: 50,
|
||||
message: "商品名称长度应在2-50个字符之间",
|
||||
trigger: "blur",
|
||||
},
|
||||
],
|
||||
categoryId: [{ required: true, message: "请选择分类", trigger: "change" }],
|
||||
price: [
|
||||
{ required: true, message: "请输入价格", trigger: "blur" },
|
||||
{ type: "number", min: 0, message: "价格不能小于0", trigger: "blur" },
|
||||
],
|
||||
stock: [
|
||||
{ required: true, message: "请输入库存", trigger: "blur" },
|
||||
{ type: "number", min: 0, message: "库存不能小于0", trigger: "blur" },
|
||||
],
|
||||
});
|
||||
|
||||
// 计算属性：根据搜索关键词过滤商品
|
||||
const filteredProducts = computed(() => {
|
||||
if (!searchKeyword.value) return products.value;
|
||||
|
||||
return products.value.filter(
|
||||
(product) =>
|
||||
product.name?.includes(searchKeyword.value) ||
|
||||
product.categoryName?.includes(searchKeyword.value),
|
||||
);
|
||||
});
|
||||
|
||||
// 计算属性：当前页的商品数据
|
||||
const paginatedProducts = computed(() => {
|
||||
const start = (currentPage.value - 1) * pageSize.value;
|
||||
const end = start + pageSize.value;
|
||||
return filteredProducts.value.slice(start, end);
|
||||
});
|
||||
|
||||
// 根据用户ID获取用户信息
|
||||
const getUserById = (userId: number) => {
|
||||
return users.value.find((user) => user.id === userId);
|
||||
};
|
||||
|
||||
// 获取商品列表
|
||||
const fetchProducts = async () => {
|
||||
loading.value = true;
|
||||
try {
|
||||
const response = await getProductList({
|
||||
page: 1,
|
||||
size: 1000, // 获取所有商品
|
||||
});
|
||||
products.value = response.data.list || [];
|
||||
} catch (error) {
|
||||
console.error("获取商品列表错误:", error);
|
||||
ElMessage.error("获取商品列表失败");
|
||||
} finally {
|
||||
loading.value = false;
|
||||
}
|
||||
};
|
||||
|
||||
// 获取商品分类
|
||||
const fetchCategories = async () => {
|
||||
try {
|
||||
const response = await getProductCategories();
|
||||
if (response.code === 200) {
|
||||
categories.value = response.data || [];
|
||||
}
|
||||
} catch (error) {
|
||||
console.error("获取商品分类错误:", error);
|
||||
ElMessage.error("获取商品分类失败");
|
||||
}
|
||||
};
|
||||
|
||||
// 获取用户列表（用于显示商家名称）
|
||||
const fetchUsers = async () => {
|
||||
try {
|
||||
const response = await getUserList();
|
||||
if (response.code === 200) {
|
||||
users.value = response.data || [];
|
||||
}
|
||||
} catch (error) {
|
||||
console.error("获取用户列表错误:", error);
|
||||
ElMessage.error("获取用户列表失败");
|
||||
}
|
||||
};
|
||||
|
||||
// 搜索处理
|
||||
const handleSearch = () => {
|
||||
currentPage.value = 1; // 重置到第一页
|
||||
};
|
||||
|
||||
// 分页大小改变
|
||||
const handleSizeChange = (size: number) => {
|
||||
pageSize.value = size;
|
||||
currentPage.value = 1;
|
||||
};
|
||||
|
||||
// 当前页改变
|
||||
const handleCurrentChange = (page: number) => {
|
||||
currentPage.value = page;
|
||||
};
|
||||
|
||||
// 编辑商品
|
||||
const editProduct = (product: ProductListItem) => {
|
||||
isEditing.value = true;
|
||||
// 复制商品数据，处理可能的undefined值
|
||||
productForm.value = {
|
||||
id: product.id,
|
||||
categoryId: product.categoryId || 0, // 确保是number类型
|
||||
name: product.name,
|
||||
mainImage: product.mainImage,
|
||||
price: product.price,
|
||||
stock: product.stock || 0,
|
||||
};
|
||||
showAddProductDialog.value = true;
|
||||
};
|
||||
|
||||
// 切换商品状态（上下架）
|
||||
const toggleProductStatus = async (product: ProductListItem) => {
|
||||
try {
|
||||
await ElMessageBox.confirm(
|
||||
`确定要${product.status === 1 ? "下架" : "上架"}商品 "${product.name}" 吗？`,
|
||||
"确认操作",
|
||||
{
|
||||
confirmButtonText: "确定",
|
||||
cancelButtonText: "取消",
|
||||
type: "warning",
|
||||
},
|
||||
);
|
||||
|
||||
// 调用更新商品状态API
|
||||
const response = await updateProductStatus(
|
||||
product.id,
|
||||
product.status === 1 ? 0 : 1,
|
||||
);
|
||||
|
||||
if (response.code === 200) {
|
||||
// 更新本地数据
|
||||
const index = products.value.findIndex((p) => p.id === product.id);
|
||||
if (index !== -1) {
|
||||
products.value[index] = {
|
||||
...product,
|
||||
status: product.status === 1 ? 0 : 1,
|
||||
};
|
||||
}
|
||||
ElMessage.success(`${product.status === 1 ? "下架" : "上架"}成功`);
|
||||
} else {
|
||||
ElMessage.error(response.message || "操作失败");
|
||||
}
|
||||
} catch (error) {
|
||||
console.error("切换商品状态错误:", error);
|
||||
if (error !== "cancel") {
|
||||
ElMessage.error("操作失败");
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
// 删除商品（这里我们暂时用下架代替删除）
|
||||
const deleteProduct = async (product: ProductListItem) => {
|
||||
try {
|
||||
await ElMessageBox.confirm(
|
||||
`确定要删除商品 "${product.name}" 吗？此操作不可恢复！`,
|
||||
"警告",
|
||||
{
|
||||
confirmButtonText: "确定",
|
||||
cancelButtonText: "取消",
|
||||
type: "warning",
|
||||
},
|
||||
);
|
||||
|
||||
// 实际应用中应该调用删除API，这里我们使用下架来代替
|
||||
const response = await updateProductStatus(product.id, 0);
|
||||
|
||||
if (response.code === 200) {
|
||||
// 从本地数据中过滤掉已下架的商品
|
||||
products.value = products.value.filter((p) => p.id !== product.id);
|
||||
ElMessage.success("操作成功");
|
||||
} else {
|
||||
ElMessage.error(response.message || "操作失败");
|
||||
}
|
||||
} catch (error) {
|
||||
console.error("删除商品错误:", error);
|
||||
if (error !== "cancel") {
|
||||
ElMessage.error("操作失败");
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
// 提交商品表单
|
||||
const submitProductForm = async () => {
|
||||
try {
|
||||
// 验证表单
|
||||
const form = productFormRef.value;
|
||||
if (!form) return;
|
||||
|
||||
await form.validate();
|
||||
|
||||
if (isEditing.value) {
|
||||
// 更新商品
|
||||
const response = await updateProduct(productForm.value);
|
||||
|
||||
if (response.code === 200) {
|
||||
// 更新本地数据 - 重新获取商品列表以确保数据同步
|
||||
fetchProducts();
|
||||
ElMessage.success("更新成功");
|
||||
} else {
|
||||
ElMessage.error(response.message || "更新失败");
|
||||
return;
|
||||
}
|
||||
} else {
|
||||
// 添加新商品
|
||||
const response = await saveProduct({
|
||||
...productForm.value,
|
||||
userId: userStore.userInfo?.id, // 假设当前用户为商家
|
||||
});
|
||||
|
||||
if (response.code === 200) {
|
||||
ElMessage.success("添加成功");
|
||||
} else {
|
||||
ElMessage.error(response.message || "添加失败");
|
||||
return;
|
||||
}
|
||||
}
|
||||
|
||||
showAddProductDialog.value = false;
|
||||
fetchProducts(); // 重新获取商品列表
|
||||
} catch (error) {
|
||||
console.error("提交商品表单错误:", error);
|
||||
if (error) {
|
||||
console.log(error);
|
||||
} else {
|
||||
ElMessage.error("提交失败");
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
// 初始化
|
||||
onMounted(() => {
|
||||
if (userStore.userInfo?.isAdmin !== 1) {
|
||||
ElMessage.error("您没有管理员权限！");
|
||||
router.push("/");
|
||||
}
|
||||
fetchProducts();
|
||||
fetchCategories();
|
||||
fetchUsers(); // 获取用户列表
|
||||
});
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.product-manage-page {
|
||||
background: white;
|
||||
padding: 20px;
|
||||
border-radius: 8px;
|
||||
box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
|
||||
}
|
||||
|
||||
.dialog-footer {
|
||||
text-align: right;
|
||||
}
|
||||
</style>
|
||||
471
src/pages/admin/UserPage.vue
Normal file
471
src/pages/admin/UserPage.vue
Normal file
@@ -0,0 +1,471 @@
|
||||
<template>
|
||||
<ManageLayout>
|
||||
<div class="user-manage-page">
|
||||
<!-- 搜索和操作按钮 -->
|
||||
<div class="mb-6 flex justify-between items-center">
|
||||
<div class="flex items-center">
|
||||
<el-input
|
||||
v-model="searchKeyword"
|
||||
placeholder="搜索用户名、邮箱或手机号"
|
||||
style="width: 300px; margin-right: 16px"
|
||||
@keyup.enter="handleSearch"
|
||||
>
|
||||
<template #prefix>
|
||||
<i class="fa fa-search"></i>
|
||||
</template>
|
||||
</el-input>
|
||||
<el-button type="primary" @click="handleSearch">搜索</el-button>
|
||||
</div>
|
||||
<el-button type="success" @click="showAddUserDialog = true">
|
||||
<i class="fa fa-plus mr-1"></i> 添加用户
|
||||
</el-button>
|
||||
</div>
|
||||
|
||||
<!-- 用户表格 -->
|
||||
<el-table
|
||||
:data="paginatedUsers"
|
||||
style="width: 100%"
|
||||
v-loading="loading"
|
||||
border
|
||||
>
|
||||
<el-table-column prop="id" label="ID" width="80" />
|
||||
<el-table-column prop="username" label="用户名" />
|
||||
<el-table-column prop="nickname" label="昵称" />
|
||||
<el-table-column prop="phone" label="手机号" />
|
||||
<el-table-column prop="email" label="邮箱" />
|
||||
<el-table-column prop="gender" label="性别" width="80">
|
||||
<template #default="{ row }">
|
||||
{{ row.gender === 1 ? "男" : row.gender === 0 ? "女" : "未知" }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="status" label="状态" width="100">
|
||||
<template #default="{ row }">
|
||||
<el-tag :type="row.status === 1 ? 'success' : 'danger'">
|
||||
{{ row.status === 1 ? "启用" : "禁用" }}
|
||||
</el-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="isAdmin" label="管理员" width="100">
|
||||
<template #default="{ row }">
|
||||
<el-tag :type="row.isAdmin === 1 ? 'warning' : 'info'">
|
||||
{{ row.isAdmin === 1 ? "是" : "否" }}
|
||||
</el-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="操作" width="380">
|
||||
<template #default="{ row }">
|
||||
<el-button size="small" @click="editUser(row)">编辑</el-button>
|
||||
<el-button
|
||||
size="small"
|
||||
:type="row.status === 1 ? 'warning' : 'success'"
|
||||
@click="toggleUserStatus(row)"
|
||||
>
|
||||
{{ row.status === 1 ? "禁用" : "启用" }}
|
||||
</el-button>
|
||||
<el-button
|
||||
size="small"
|
||||
:type="row.isAdmin === 1 ? 'info' : 'primary'"
|
||||
@click="toggleAdminStatus(row)"
|
||||
>
|
||||
{{ row.isAdmin === 1 ? "取消管理员" : "设为管理员" }}
|
||||
</el-button>
|
||||
<el-button size="small" type="danger" @click="deleteUser(row)"
|
||||
>删除</el-button
|
||||
>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
|
||||
<!-- 分页 -->
|
||||
<div class="mt-6 flex justify-center">
|
||||
<el-pagination
|
||||
@size-change="handleSizeChange"
|
||||
@current-change="handleCurrentChange"
|
||||
:current-page="currentPage"
|
||||
:page-sizes="[5, 10, 20, 50]"
|
||||
:page-size="pageSize"
|
||||
layout="total, sizes, prev, pager, next, jumper"
|
||||
:total="filteredUsers.length"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<!-- 添加/编辑用户对话框 -->
|
||||
<el-dialog
|
||||
:title="isEditing ? '编辑用户' : '添加用户'"
|
||||
v-model="showAddUserDialog"
|
||||
width="500px"
|
||||
>
|
||||
<el-form
|
||||
:model="userForm"
|
||||
:rules="userFormRules"
|
||||
ref="userFormRef"
|
||||
label-width="80px"
|
||||
>
|
||||
<el-form-item label="用户名" prop="username">
|
||||
<el-input v-model="userForm.username" :disabled="isEditing" />
|
||||
</el-form-item>
|
||||
<el-form-item label="昵称" prop="nickname">
|
||||
<el-input v-model="userForm.nickname" />
|
||||
</el-form-item>
|
||||
<el-form-item label="手机号" prop="phone">
|
||||
<el-input v-model="userForm.phone" />
|
||||
</el-form-item>
|
||||
<el-form-item label="邮箱" prop="email">
|
||||
<el-input v-model="userForm.email" />
|
||||
</el-form-item>
|
||||
<el-form-item label="性别" prop="gender">
|
||||
<el-radio-group v-model="userForm.gender">
|
||||
<el-radio :label="1">男</el-radio>
|
||||
<el-radio :label="0">女</el-radio>
|
||||
<el-radio :label="2">未知</el-radio>
|
||||
</el-radio-group>
|
||||
</el-form-item>
|
||||
<el-form-item label="密码" prop="password" :required="!isEditing">
|
||||
<el-input
|
||||
v-model="userForm.password"
|
||||
type="password"
|
||||
:placeholder="isEditing ? '不填写则不修改密码' : '请输入密码'"
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item label="头像">
|
||||
<el-input v-model="userForm.avatar" placeholder="头像URL" />
|
||||
</el-form-item>
|
||||
<el-form-item label="管理员">
|
||||
<el-switch
|
||||
v-model="userForm.isAdmin"
|
||||
:active-value="1"
|
||||
:inactive-value="0"
|
||||
/>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<template #footer>
|
||||
<div class="dialog-footer">
|
||||
<el-button @click="showAddUserDialog = false">取消</el-button>
|
||||
<el-button type="primary" @click="submitUserForm">确定</el-button>
|
||||
</div>
|
||||
</template>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</ManageLayout>
|
||||
</template>
|
||||
|
||||
<script lang="ts" setup>
|
||||
import { ref, reactive, computed, onMounted } from "vue";
|
||||
import { ElMessage, ElMessageBox } from "element-plus";
|
||||
import { getUserList, updateUserProfile, userRegister } from "@/apis/user";
|
||||
import { UserDTO } from "@/types/user";
|
||||
import ManageLayout from "@/layouts/ManageLayout.vue";
|
||||
import { useRouter } from "vue-router";
|
||||
import { useUserStore } from "@/stores/UserStore";
|
||||
|
||||
// 获取用户存储和路由
|
||||
const userStore = useUserStore();
|
||||
const router = useRouter();
|
||||
|
||||
// 响应式数据
|
||||
const loading = ref(false);
|
||||
const searchKeyword = ref("");
|
||||
const showAddUserDialog = ref(false);
|
||||
const isEditing = ref(false);
|
||||
const userFormRef = ref();
|
||||
|
||||
// 分页数据
|
||||
const currentPage = ref(1);
|
||||
const pageSize = ref(10);
|
||||
|
||||
// 用户表单
|
||||
const userForm = ref<UserDTO>({
|
||||
id: undefined,
|
||||
username: "",
|
||||
password: "",
|
||||
phone: "",
|
||||
email: "",
|
||||
avatar: "",
|
||||
nickname: "",
|
||||
gender: 2,
|
||||
status: 1,
|
||||
isAdmin: 0,
|
||||
});
|
||||
|
||||
// 所有用户数据
|
||||
const users = ref<UserDTO[]>([]);
|
||||
|
||||
// 用户表单验证规则
|
||||
const userFormRules = reactive({
|
||||
username: [
|
||||
{ required: true, message: "请输入用户名", trigger: "blur" },
|
||||
{
|
||||
min: 3,
|
||||
max: 20,
|
||||
message: "用户名长度应在3-20个字符之间",
|
||||
trigger: "blur",
|
||||
},
|
||||
],
|
||||
password: [
|
||||
{ required: !isEditing.value, message: "请输入密码", trigger: "blur" },
|
||||
{ min: 6, max: 20, message: "密码长度应在6-20个字符之间", trigger: "blur" },
|
||||
],
|
||||
phone: [
|
||||
{ required: true, message: "请输入手机号", trigger: "blur" },
|
||||
{
|
||||
pattern: /^1[3-9]\d{9}$/,
|
||||
message: "请输入正确的手机号格式",
|
||||
trigger: "blur",
|
||||
},
|
||||
],
|
||||
email: [
|
||||
{ required: true, message: "请输入邮箱", trigger: "blur" },
|
||||
{ type: "email", message: "请输入正确的邮箱格式", trigger: "blur" },
|
||||
],
|
||||
});
|
||||
|
||||
// 计算属性：根据搜索关键词过滤用户
|
||||
const filteredUsers = computed(() => {
|
||||
if (!searchKeyword.value) return users.value;
|
||||
|
||||
return users.value.filter(
|
||||
(user) =>
|
||||
user.username?.includes(searchKeyword.value) ||
|
||||
user.email?.includes(searchKeyword.value) ||
|
||||
user.phone?.includes(searchKeyword.value) ||
|
||||
user.nickname?.includes(searchKeyword.value),
|
||||
);
|
||||
});
|
||||
|
||||
// 计算属性：当前页的用户数据
|
||||
const paginatedUsers = computed(() => {
|
||||
const start = (currentPage.value - 1) * pageSize.value;
|
||||
const end = start + pageSize.value;
|
||||
return filteredUsers.value.slice(start, end);
|
||||
});
|
||||
|
||||
// 获取用户列表
|
||||
const fetchUsers = async () => {
|
||||
loading.value = true;
|
||||
try {
|
||||
const response = await getUserList();
|
||||
users.value = response.data || [];
|
||||
} catch (error) {
|
||||
console.error("获取用户列表错误:", error);
|
||||
ElMessage.error("获取用户列表失败");
|
||||
} finally {
|
||||
loading.value = false;
|
||||
}
|
||||
};
|
||||
|
||||
// 搜索处理
|
||||
const handleSearch = () => {
|
||||
currentPage.value = 1; // 重置到第一页
|
||||
};
|
||||
|
||||
// 分页大小改变
|
||||
const handleSizeChange = (size: number) => {
|
||||
pageSize.value = size;
|
||||
currentPage.value = 1;
|
||||
};
|
||||
|
||||
// 当前页改变
|
||||
const handleCurrentChange = (page: number) => {
|
||||
currentPage.value = page;
|
||||
};
|
||||
|
||||
// 编辑用户
|
||||
const editUser = (user: UserDTO) => {
|
||||
isEditing.value = true;
|
||||
// 复制用户数据，但不包含密码字段（编辑时不需要密码）
|
||||
userForm.value = {
|
||||
...user,
|
||||
password: "", // 编辑时不显示密码，需要时重新输入
|
||||
};
|
||||
showAddUserDialog.value = true;
|
||||
};
|
||||
|
||||
// 切换用户状态（启用/禁用）
|
||||
const toggleUserStatus = async (user: UserDTO) => {
|
||||
try {
|
||||
await ElMessageBox.confirm(
|
||||
`确定要${user.status === 1 ? "禁用" : "启用"}用户 "${user.username}" 吗？`,
|
||||
"确认操作",
|
||||
{
|
||||
confirmButtonText: "确定",
|
||||
cancelButtonText: "取消",
|
||||
type: "warning",
|
||||
},
|
||||
);
|
||||
|
||||
// 准备更新数据，只更新状态
|
||||
const updateData = {
|
||||
...user,
|
||||
status: user.status === 1 ? 0 : 1,
|
||||
};
|
||||
|
||||
// 调用更新用户信息API
|
||||
await updateUserProfile(updateData);
|
||||
|
||||
// 更新本地数据
|
||||
const index = users.value.findIndex((u) => u.id === user.id);
|
||||
if (index !== -1) {
|
||||
users.value[index] = { ...updateData };
|
||||
}
|
||||
ElMessage.success(`${user.status === 1 ? "禁用" : "启用"}成功`);
|
||||
} catch (error) {
|
||||
console.error("切换用户状态错误:", error);
|
||||
if (error !== "cancel") {
|
||||
ElMessage.error("操作失败");
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
// 切换管理员状态
|
||||
const toggleAdminStatus = async (user: UserDTO) => {
|
||||
try {
|
||||
await ElMessageBox.confirm(
|
||||
`确定要${user.isAdmin === 1 ? "取消" : "设置"}用户 "${user.username}" 为管理员吗？`,
|
||||
"确认操作",
|
||||
{
|
||||
confirmButtonText: "确定",
|
||||
cancelButtonText: "取消",
|
||||
type: user.isAdmin === 1 ? "warning" : "primary",
|
||||
},
|
||||
);
|
||||
|
||||
// 准备更新数据，只更新管理员状态
|
||||
const updateData = {
|
||||
...user,
|
||||
isAdmin: user.isAdmin === 1 ? 0 : 1,
|
||||
};
|
||||
|
||||
// 调用更新用户信息API
|
||||
await updateUserProfile(updateData);
|
||||
|
||||
// 更新本地数据
|
||||
const index = users.value.findIndex((u) => u.id === user.id);
|
||||
if (index !== -1) {
|
||||
users.value[index] = { ...updateData };
|
||||
}
|
||||
ElMessage.success(
|
||||
`${user.isAdmin === 1 ? "取消管理员" : "设为管理员"}成功`,
|
||||
);
|
||||
} catch (error) {
|
||||
console.error("切换管理员状态错误:", error);
|
||||
if (error !== "cancel") {
|
||||
ElMessage.error("操作失败");
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
// 删除用户
|
||||
const deleteUser = async (user: UserDTO) => {
|
||||
try {
|
||||
await ElMessageBox.confirm(
|
||||
`确定要删除用户 "${user.username}" 吗？此操作不可恢复！`,
|
||||
"警告",
|
||||
{
|
||||
confirmButtonText: "确定",
|
||||
cancelButtonText: "取消",
|
||||
type: "warning",
|
||||
},
|
||||
);
|
||||
|
||||
// 在实际应用中，这里应该调用删除API
|
||||
// 但根据后端设计，我们使用更新状态的方式
|
||||
const updateData = {
|
||||
...user,
|
||||
status: 0, // 设置为禁用状态
|
||||
};
|
||||
|
||||
await updateUserProfile(updateData);
|
||||
|
||||
// 从本地数据中过滤掉已禁用的用户（如果需要完全隐藏的话）
|
||||
users.value = users.value.filter((u) => u.id !== user.id);
|
||||
ElMessage.success("操作成功");
|
||||
} catch (error) {
|
||||
console.error("删除用户错误:", error);
|
||||
if (error !== "cancel") {
|
||||
ElMessage.error("操作失败");
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
// 提交用户表单
|
||||
const submitUserForm = async () => {
|
||||
try {
|
||||
// 验证表单
|
||||
const form = userFormRef.value;
|
||||
if (!form) return;
|
||||
|
||||
await form.validate();
|
||||
|
||||
if (isEditing.value) {
|
||||
// 更新用户
|
||||
await updateUserProfile(userForm.value);
|
||||
|
||||
// 更新本地数据
|
||||
const index = users.value.findIndex((u) => u.id === userForm.value.id);
|
||||
if (index !== -1) {
|
||||
users.value[index] = { ...userForm.value };
|
||||
}
|
||||
ElMessage.success("更新成功");
|
||||
} else {
|
||||
// 添加新用户 - 使用专门的管理员添加用户API
|
||||
// 如果后端没有专门的API，我们使用注册API，但需要确保密码字段存在
|
||||
if (!userForm.value.password) {
|
||||
ElMessage.error("添加用户时必须设置密码");
|
||||
return;
|
||||
}
|
||||
|
||||
// 调用注册API来添加新用户
|
||||
const response = await userRegister({
|
||||
username: userForm.value.username,
|
||||
password: userForm.value.password,
|
||||
phone: userForm.value.phone,
|
||||
email: userForm.value.email,
|
||||
nickname: userForm.value.nickname || undefined,
|
||||
gender: userForm.value.gender,
|
||||
avatar: userForm.value.avatar || undefined,
|
||||
isAdmin: userForm.value.isAdmin,
|
||||
});
|
||||
|
||||
// 检查响应
|
||||
if (response.code === 200) {
|
||||
ElMessage.success("添加成功");
|
||||
} else {
|
||||
ElMessage.error(response.message || "添加失败");
|
||||
return;
|
||||
}
|
||||
}
|
||||
|
||||
showAddUserDialog.value = false;
|
||||
fetchUsers(); // 重新获取用户列表
|
||||
} catch (error) {
|
||||
console.error("提交用户表单错误:", error);
|
||||
if (error) {
|
||||
console.log(error);
|
||||
} else {
|
||||
ElMessage.error("提交失败");
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
// 初始化
|
||||
onMounted(() => {
|
||||
if (userStore.userInfo?.isAdmin !== 1) {
|
||||
ElMessage.error("您没有管理员权限！");
|
||||
router.push("/");
|
||||
}
|
||||
fetchUsers();
|
||||
});
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.user-manage-page {
|
||||
background: white;
|
||||
padding: 20px;
|
||||
border-radius: 8px;
|
||||
box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
|
||||
}
|
||||
|
||||
.dialog-footer {
|
||||
text-align: right;
|
||||
}
|
||||
</style>
|
||||
@@ -24,6 +24,7 @@ import {
|
||||
setDefaultAddress,
|
||||
} from "@/apis/user";
|
||||
import type { UserAddress, UserAddressForm } from "@/types/address";
|
||||
import MainLayout from "@/layouts/MainLayout.vue";
|
||||
|
||||
const userStore = useUserStore();
|
||||
const addressList = ref<UserAddress[]>([]);
|
||||
@@ -203,6 +204,7 @@ onMounted(() => {
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<MainLayout>
|
||||
<div class="address-page">
|
||||
<div class="container mx-auto px-4 py-8">
|
||||
<el-card class="address-card">
|
||||
@@ -333,6 +335,7 @@ onMounted(() => {
|
||||
</template>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</MainLayout>
|
||||
</template>
|
||||
|
||||
<style scoped>
|
||||
|
||||
@@ -56,6 +56,7 @@ const handleLogin = async () => {
|
||||
id: response.data.id,
|
||||
username: response.data.username,
|
||||
nickname: response.data.nickname,
|
||||
isAdmin: response.data.isAdmin,
|
||||
});
|
||||
|
||||
ElMessage.success("登录成功");
|
||||
|
||||
@@ -4,6 +4,8 @@ import {
|
||||
type RouteRecordRaw,
|
||||
} from "vue-router";
|
||||
|
||||
import { useUserStore } from "@/stores/UserStore.ts";
|
||||
|
||||
/**
|
||||
* Convert PascalCase to kebab-case and remove 'Page' suffix
|
||||
* @param name PascalCase name (e.g., AboutMePage)
|
||||
@@ -104,6 +106,34 @@ const extraRoutes: RouteRecordRaw[] = [
|
||||
name: "ProductDetail",
|
||||
component: () => import("@/pages/product/DetailPage.vue"),
|
||||
},
|
||||
{
|
||||
path: "/admin",
|
||||
redirect: "/admin/userManage",
|
||||
},
|
||||
{
|
||||
path: "/admin/userManage",
|
||||
name: "UserManage",
|
||||
component: () => import("@/pages/admin/UserPage.vue"),
|
||||
meta: { requiresAdmin: true }, // 添加管理员权限要求
|
||||
},
|
||||
{
|
||||
path: "/admin/category",
|
||||
name: "Categories",
|
||||
component: () => import("@/pages/admin/CategoryPage.vue"),
|
||||
meta: { requiresAdmin: true }, // 添加管理员权限要求
|
||||
},
|
||||
{
|
||||
path: "/admin/product",
|
||||
name: "Products",
|
||||
component: () => import("@/pages/admin/ProductPage.vue"),
|
||||
meta: { requiresAdmin: true }, // 添加管理员权限要求
|
||||
},
|
||||
{
|
||||
path: "/admin/order",
|
||||
name: "Orders",
|
||||
component: () => import("@/pages/admin/OrderPage.vue"),
|
||||
meta: { requiresAdmin: true }, // 添加管理员权限要求
|
||||
},
|
||||
// 可以在这里添加其他需要特殊配置的路由
|
||||
];
|
||||
|
||||
@@ -113,7 +143,7 @@ const allRoutes = [...routes, ...extraRoutes];
|
||||
const router = createRouter({
|
||||
history: createWebHashHistory(),
|
||||
routes: allRoutes,
|
||||
scrollBehavior(to, from, savedPosition) {
|
||||
scrollBehavior(_to, _from, savedPosition) {
|
||||
// 如果有保存的位置（浏览器前进/后退），则使用保存的位置
|
||||
if (savedPosition) {
|
||||
return savedPosition;
|
||||
@@ -123,4 +153,32 @@ const router = createRouter({
|
||||
},
|
||||
});
|
||||
|
||||
// 全局路由守卫 - 检查管理员权限
|
||||
router.beforeEach((to, _from, next) => {
|
||||
// 检查是否需要管理员权限
|
||||
if (to.meta.requiresAdmin) {
|
||||
const userStore = useUserStore();
|
||||
|
||||
// 检查用户是否已登录
|
||||
if (!userStore.token || !userStore.userInfo) {
|
||||
// 未登录，跳转到登录页面
|
||||
next({
|
||||
name: "Login",
|
||||
query: { redirect: to.fullPath }, // 保存重定向路径
|
||||
});
|
||||
return;
|
||||
}
|
||||
|
||||
// 检查用户是否为管理员
|
||||
if (userStore.userInfo.isAdmin !== 1) {
|
||||
// 不是管理员，跳转到首页或其他页面
|
||||
alert("您没有管理员权限！");
|
||||
next({ name: "Home" });
|
||||
return;
|
||||
}
|
||||
}
|
||||
|
||||
next(); // 继续导航
|
||||
});
|
||||
|
||||
export default router;
|
||||
|
||||
@@ -7,11 +7,15 @@ export interface ProductListItem {
|
||||
sales: number;
|
||||
status: number;
|
||||
categoryName: string;
|
||||
categoryId?: number;
|
||||
userId?: number;
|
||||
stock?: number;
|
||||
}
|
||||
|
||||
// 商品详情
|
||||
export interface ProductDetail {
|
||||
id: number;
|
||||
userId?: number;
|
||||
categoryId: number;
|
||||
categoryName: string;
|
||||
name: string;
|
||||
@@ -68,3 +72,20 @@ export interface ProductPageResponse {
|
||||
page: number;
|
||||
size: number;
|
||||
}
|
||||
|
||||
// 商品DTO (用于创建和更新)
|
||||
export interface ProductDTO {
|
||||
id?: number; // 商品ID（修改时使用）
|
||||
categoryId: number; // 分类ID
|
||||
userId?: number; // 商家ID
|
||||
name: string; // 商品名称
|
||||
subtitle?: string; // 副标题
|
||||
mainImage?: string; // 主图URL
|
||||
subImages?: string; // 子图URL（逗号分隔）
|
||||
description?: string; // 商品描述
|
||||
price: number; // 价格
|
||||
stock: number; // 库存
|
||||
status?: number; // 状态 0-下架 1-上架
|
||||
sort?: number; // 排序
|
||||
skuList?: ProductSku[]; // 规格列表
|
||||
}
|
||||
|
||||
@@ -11,10 +11,15 @@ export interface RegisterRequest {
|
||||
password: string;
|
||||
phone: string;
|
||||
email: string;
|
||||
avatar?: string;
|
||||
gender?: number;
|
||||
nickname?: string;
|
||||
isAdmin?: number;
|
||||
}
|
||||
|
||||
// 登录响应数据类型
|
||||
export interface LoginResponse {
|
||||
isAdmin: number;
|
||||
id: number;
|
||||
username: string;
|
||||
nickname: string;
|
||||
@@ -35,4 +40,19 @@ export interface UserInfo {
|
||||
oldPassword?: string;
|
||||
createTime?: string;
|
||||
updateTime?: string;
|
||||
isAdmin?: number;
|
||||
}
|
||||
|
||||
// 用户DTO类型（用于管理员操作）
|
||||
export interface UserDTO {
|
||||
id?: number;
|
||||
username: string;
|
||||
password?: string;
|
||||
phone: string;
|
||||
email: string;
|
||||
avatar?: string;
|
||||
nickname?: string;
|
||||
gender?: number;
|
||||
status?: number;
|
||||
isAdmin?: number;
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user