课程模块部分bug修复
This commit is contained in:
@ -58,7 +58,7 @@ const columns = [
|
||||
}
|
||||
];
|
||||
|
||||
// 接口数据类型
|
||||
|
||||
interface PromoCode {
|
||||
id: number;
|
||||
promoCodeInfoKey: string;
|
||||
@ -70,14 +70,14 @@ interface PromoCode {
|
||||
|
||||
const route = useRoute();
|
||||
const projectId = ref<string | number>("");
|
||||
const originalTableData = ref<PromoCode[]>([]); // 存储所有原始数据
|
||||
const displayData = ref<PromoCode[]>([]); // 实际显示的数据
|
||||
const originalTableData = ref<PromoCode[]>([]);
|
||||
const displayData = ref<PromoCode[]>([]);
|
||||
const loading = ref(false);
|
||||
const searchId = ref("");
|
||||
const previewVisible = ref(false);
|
||||
const previewImage = ref("");
|
||||
|
||||
// 主查询方法 - 获取项目所有推广码
|
||||
|
||||
const getPromoCodes = async (id: string | number) => {
|
||||
const storedToken = localStorage.getItem('token');
|
||||
try {
|
||||
@ -95,10 +95,9 @@ const getPromoCodes = async (id: string | number) => {
|
||||
console.log(response);
|
||||
|
||||
if (response.code === 1) {
|
||||
// 确保data是数组，即使为null也转为空数组
|
||||
const data = Array.isArray(response.data) ? response.data : [];
|
||||
originalTableData.value = data;
|
||||
displayData.value = data; // 初始显示所有数据
|
||||
displayData.value = data;
|
||||
} else {
|
||||
message.error(response.message || "获取数据失败");
|
||||
originalTableData.value = [];
|
||||
@ -114,7 +113,7 @@ const getPromoCodes = async (id: string | number) => {
|
||||
}
|
||||
};
|
||||
|
||||
// 初始化逻辑
|
||||
|
||||
if (typeof route.query.id === "string") {
|
||||
projectId.value = route.query.id;
|
||||
}
|
||||
@ -125,7 +124,7 @@ onMounted(() => {
|
||||
}
|
||||
});
|
||||
|
||||
// 修改搜索处理 - 前端过滤
|
||||
|
||||
const handleIdSearch = () => {
|
||||
const value = searchId.value.trim();
|
||||
|
||||
@ -140,18 +139,18 @@ const handleIdSearch = () => {
|
||||
return;
|
||||
}
|
||||
|
||||
// 在前端原始数据中过滤
|
||||
|
||||
const result = originalTableData.value.filter(item => item.id === id);
|
||||
|
||||
if (result.length === 0) {
|
||||
message.warning("未找到匹配的推广码ID");
|
||||
}
|
||||
|
||||
// 更新显示数据
|
||||
|
||||
displayData.value = result;
|
||||
};
|
||||
|
||||
// 重置搜索 - 显示所有数据
|
||||
// 重置搜索
|
||||
const reset = () => {
|
||||
searchId.value = "";
|
||||
displayData.value = originalTableData.value;
|
||||
@ -181,14 +180,13 @@ const openAddDrawer = () => {
|
||||
|
||||
// 提交新增请求
|
||||
const handleAddSubmit = async () => {
|
||||
// 如果有文件需要上传
|
||||
|
||||
if (fileList.value.length > 0) {
|
||||
const imageUrl = await handleUpload();
|
||||
if (!imageUrl) {
|
||||
message.error('图片上传失败，无法提交');
|
||||
return;
|
||||
}
|
||||
// 更新表单中的图片URL
|
||||
addFormState.promoCodeImage = imageUrl;
|
||||
}
|
||||
|
||||
@ -215,7 +213,7 @@ const handleAddSubmit = async () => {
|
||||
message.success('新增成功');
|
||||
addDrawerVisible.value = false;
|
||||
await getPromoCodes(projectId.value);
|
||||
// 重置表单和文件列表
|
||||
|
||||
Object.assign(addFormState, {
|
||||
promoCodeInfoKey: '',
|
||||
promoCodeLink: '',
|
||||
@ -309,14 +307,14 @@ const handleEdit = async (id: number) => {
|
||||
};
|
||||
|
||||
const handleEditSubmit = async () => {
|
||||
// 如果有文件需要上传
|
||||
|
||||
if (fileList.value.length > 0) {
|
||||
const imageUrl = await handleUpload();
|
||||
if (!imageUrl) {
|
||||
message.error('图片上传失败，无法提交');
|
||||
return;
|
||||
}
|
||||
// 更新表单中的图片URL
|
||||
|
||||
editFormState.promoCodeImage = imageUrl;
|
||||
}
|
||||
|
||||
@ -343,7 +341,7 @@ const handleEditSubmit = async () => {
|
||||
message.success('编辑成功');
|
||||
editDrawerVisible.value = false;
|
||||
await getPromoCodes(projectId.value);
|
||||
// 重置文件列表
|
||||
|
||||
fileList.value = [];
|
||||
} else {
|
||||
message.error(res.message || '编辑失败');
|
||||
@ -353,19 +351,19 @@ const handleEditSubmit = async () => {
|
||||
}
|
||||
};
|
||||
|
||||
//返回上一级
|
||||
|
||||
const router = useRouter();
|
||||
|
||||
// 返回上一级方法
|
||||
|
||||
const goBack = () => {
|
||||
router.go(-1); // 返回上一页
|
||||
router.go(-1);
|
||||
};
|
||||
|
||||
// 添加文件上传相关状态
|
||||
|
||||
const fileList = ref<any[]>([]);
|
||||
const uploading = ref(false);
|
||||
|
||||
// 图片上传处理
|
||||
|
||||
const handleUpload = async () => {
|
||||
const formData = new FormData();
|
||||
fileList.value.forEach(file => {
|
||||
@ -382,7 +380,7 @@ const handleUpload = async () => {
|
||||
{
|
||||
headers: {
|
||||
'Authorization': storedToken,
|
||||
'AflatScript': 'required', // 添加AflatScript头部
|
||||
'AflatScript': 'required',
|
||||
'Content-Type': 'multipart/form-data'
|
||||
}
|
||||
}
|
||||
@ -390,7 +388,7 @@ const handleUpload = async () => {
|
||||
|
||||
if (res.code === 1) {
|
||||
message.success('上传成功');
|
||||
// 将返回的文件路径保存到表单中
|
||||
|
||||
addFormState.promoCodeImage = res.data;
|
||||
return res.data;
|
||||
} else {
|
||||
@ -405,23 +403,23 @@ const handleUpload = async () => {
|
||||
uploading.value = false;
|
||||
}
|
||||
};
|
||||
// 文件上传前的处理
|
||||
|
||||
const beforeUpload = (file: any) => {
|
||||
// 检查文件类型
|
||||
|
||||
const isImage = file.type.includes('image');
|
||||
if (!isImage) {
|
||||
message.error('只能上传图片文件!');
|
||||
return false;
|
||||
}
|
||||
|
||||
// 检查文件大小 (限制为5MB)
|
||||
|
||||
const isLt5M = file.size / 1024 / 1024 < 5;
|
||||
if (!isLt5M) {
|
||||
message.error('图片大小不能超过5MB!');
|
||||
return false;
|
||||
}
|
||||
|
||||
// 添加到文件列表
|
||||
|
||||
fileList.value = [file];
|
||||
return false; // 手动上传
|
||||
};
|
||||
@ -466,9 +464,9 @@ const batchDelete = async () => {
|
||||
|
||||
if (res.code === 1) {
|
||||
message.success(`成功删除 ${selectedRowKeys.value.length} 条记录`);
|
||||
// 刷新数据
|
||||
|
||||
await getPromoCodes(projectId.value);
|
||||
// 清空选择
|
||||
|
||||
selectedRowKeys.value = [];
|
||||
} else {
|
||||
message.error(res.message || '批量删除失败');
|
||||
@ -750,26 +748,13 @@ const batchDelete = async () => {
|
||||
background-color: #fafafa !important;
|
||||
}
|
||||
|
||||
/* 新增表格页脚样式 */
|
||||
.table-footer {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
padding: 8px 0;
|
||||
}
|
||||
|
||||
.back-button {
|
||||
margin-right: 16px;
|
||||
}
|
||||
|
||||
/* 调整分页器位置 */
|
||||
:deep(.ant-table-pagination.ant-pagination) {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
|
||||
|
||||
/*橙色按钮*/
|
||||
|
||||
.custom-button {
|
||||
background-color: #ffa940;
|
||||
@ -791,7 +776,7 @@ const batchDelete = async () => {
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
/* 危险按钮样式 */
|
||||
|
||||
.custom-button.ant-btn-dangerous {
|
||||
background-color: #ff4d4f;
|
||||
border-color: #ff4d4f;
|
||||
@ -803,7 +788,7 @@ const batchDelete = async () => {
|
||||
border-color: #ff7875;
|
||||
}
|
||||
|
||||
/* 保持原有的其他样式不变 */
|
||||
|
||||
.search-box {
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
@ -819,7 +804,6 @@ const batchDelete = async () => {
|
||||
border-color: #fa8c16;
|
||||
}
|
||||
|
||||
/* 保持输入框原有样式不变 */
|
||||
.custom-search :deep(.ant-input) {
|
||||
border-right-color: #ffa940;
|
||||
}
|
||||
@ -834,23 +818,5 @@ const batchDelete = async () => {
|
||||
color: #666;
|
||||
}
|
||||
|
||||
/*批量删除按钮操作*/
|
||||
.batch-delete-button {
|
||||
margin-left: 10px;
|
||||
background-color: #ff4d4f;
|
||||
border-color: #ff4d4f;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.batch-delete-button:hover {
|
||||
background-color: #ff7875;
|
||||
border-color: #ff7875;
|
||||
}
|
||||
|
||||
/* 添加选择计数样式 */
|
||||
.selection-count {
|
||||
margin-left: 10px;
|
||||
font-size: 14px;
|
||||
color: #ff4d4f;
|
||||
}
|
||||
</style>
|
||||
Reference in New Issue
Block a user