项目相关功能完善

This commit is contained in:
2025-05-08 14:12:27 +08:00
parent 7cd1a58cac
commit ba19bdd984
6 changed files with 221 additions and 84 deletions

View File

@@ -6,7 +6,7 @@ import {message, Upload, Select} from "ant-design-vue"
import {labelOptionApi} from "@/api/request/label.js";
import {categoryOptionApi} from "@/api/request/category.js";
import {
changeContentProjectApi,
changeContentProjectApi, changeTypeProjectApi,
createProjectApi,
deleteProjectApi,
projectDetailApi,
@@ -562,6 +562,17 @@ const handleMdImageUpload = async (
callback(urls);
};
const changeTypeProject = (id, type, index, feild) => {
changeTypeProjectApi({
id: id,
type: type
}).then((res) => {
message.success("操作成功")
console.log(paginatedData.value[index][feild])
paginatedData.value[index][feild] = paginatedData.value[index][feild] === 1 ? 0 : 1
})
}
</script>
<template>
@@ -604,6 +615,18 @@ const handleMdImageUpload = async (
class="px-6 py-3 text-left text-xs font-medium text-gray-700 dark:text-gray-300 uppercase tracking-wider">
价格
</th>
<th scope="col"
class="px-6 py-3 text-left text-xs font-medium text-gray-700 dark:text-gray-300 uppercase tracking-wider">
出售
</th>
<th scope="col"
class="px-6 py-3 text-left text-xs font-medium text-gray-700 dark:text-gray-300 uppercase tracking-wider">
精选
</th>
<th scope="col"
class="px-6 py-3 text-left text-xs font-medium text-gray-700 dark:text-gray-300 uppercase tracking-wider">
轮播图
</th>
<th scope="col"
class="px-6 py-3 text-left text-xs font-medium text-gray-700 dark:text-gray-300 uppercase tracking-wider">
状态
@@ -625,7 +648,7 @@ const handleMdImageUpload = async (
<!-- 表格内容 -->
<tbody class="bg-white dark:bg-gray-800 divide-y divide-gray-200 dark:divide-gray-700">
<tr v-for="item in paginatedData" :key="item.id"
<tr v-for="(item, index) in paginatedData" :key="item.id"
class="hover:bg-gray-50 dark:hover:bg-gray-700/50 transition-colors">
<td class="px-6 py-4 whitespace-nowrap text-sm font-medium text-gray-900 dark:text-white">
<div class="flex items-center space-x-3">
@@ -654,6 +677,45 @@ const handleMdImageUpload = async (
<td class="px-6 py-4 whitespace-nowrap text-sm font-medium text-gray-900 dark:text-white">
{{ formatPrice(item.price) }}
</td>
<!-- 是否出售 -->
<td class="px-6 py-4 whitespace-nowrap">
<span
@click="changeTypeProject(item.id, 1, index, 'is_sold')"
:class="`px-2 py-1 text-xs font-medium rounded-full ${
item.is_sold === 1
? 'bg-green-100 text-green-800 dark:bg-green-900/30 dark:text-green-300'
: 'bg-red-100 text-red-800 dark:bg-red-900/30 dark:text-red-300'
} cursor-pointer`"
>
{{ item.is_sold === 0 ? '非卖品' : '出售' }}
</span>
</td>
<!-- 是否精选 -->
<td class="px-6 py-4 whitespace-nowrap">
<span
@click="changeTypeProject(item.id, 2, index, 'is_selected')"
:class="`px-2 py-1 text-xs font-medium rounded-full ${
item.is_selected === 1
? 'bg-green-100 text-green-800 dark:bg-green-900/30 dark:text-green-300'
: 'bg-red-100 text-red-800 dark:bg-red-900/30 dark:text-red-300'
} cursor-pointer`"
>
{{ item.is_selected === 0 ? '否' : '是' }}
</span>
</td>
<!-- 是否为轮播图 -->
<td class="px-6 py-4 whitespace-nowrap">
<span
@click="changeTypeProject(item.id, 3, index, 'is_carousel')"
:class="`px-2 py-1 text-xs font-medium rounded-full ${
item.is_carousel === 1
? 'bg-green-100 text-green-800 dark:bg-green-900/30 dark:text-green-300'
: 'bg-red-100 text-red-800 dark:bg-red-900/30 dark:text-red-300'
} cursor-pointer`"
>
{{ item.is_carousel === 0 ? '否' : '是' }}
</span>
</td>
<td class="px-6 py-4 whitespace-nowrap">
<span
:class="`px-2 py-1 text-xs font-medium rounded-full ${
@@ -662,7 +724,7 @@ const handleMdImageUpload = async (
: item.status === 2
? 'bg-red-100 text-red-800 dark:bg-red-900/30 dark:text-red-300'
: 'bg-gray-100 text-gray-800 dark:bg-gray-700 dark:text-gray-300'
}`"
} cursor-pointer`"
>
{{ item.status_text }}
</span>
@@ -1251,6 +1313,7 @@ const handleMdImageUpload = async (
</div>
</div>
</div>
<!-- 项目表单模态框 -->
<div v-if="showContentModal" class="fixed inset-0 z-50 overflow-y-scroll" aria-labelledby="modal-title" role="dialog"
aria-modal="true">