feat: update post edit page

This commit is contained in:
yanghao05
2025-04-09 21:16:55 +08:00
parent 1f27611dc7
commit 500e3e199a
6 changed files with 117 additions and 29 deletions

View File

@@ -75,7 +75,46 @@ func (ctl *posts) Create(ctx fiber.Ctx, form *PostForm) error {
// @Router /v1/admin/posts/:id [put]
// @Bind id path
// @Bind form body
func (ctl *posts) Update(ctx fiber.Ctx, id int64, form *model.Posts) error {
func (ctl *posts) Update(ctx fiber.Ctx, id int64, form *PostForm) error {
oldPost, err := models.Posts.GetByID(ctx.Context(), id)
if err != nil {
return err
}
post := &model.Posts{
Title: form.Title,
Price: form.Price,
Discount: form.Discount,
Description: form.Introduction,
Status: form.Status,
Content: "",
Tags: fields.Json[[]string]{},
Assets: fields.Json[[]fields.MediaAsset]{},
CreatedAt: oldPost.CreatedAt,
UpdatedAt: oldPost.UpdatedAt,
DeletedAt: oldPost.DeletedAt,
Views: oldPost.Views,
Likes: oldPost.Likes,
}
if form.Medias != nil {
medias, err := models.Medias.GetByIds(ctx.Context(), form.Medias)
if err != nil {
return err
}
assets := lo.Map(medias, func(media *model.Medias, _ int) fields.MediaAsset {
return fields.MediaAsset{
Type: models.Medias.ConvertFileTypeByMimeType(media.MimeType),
Media: media.ID,
Mark: nil,
}
})
post.Assets = fields.ToJson(assets)
}
if err := models.Posts.Update(ctx.Context(), id, post); err != nil {
return err
}
return nil
}

View File

@@ -10,7 +10,6 @@ import (
. "go.ipao.vip/atom/fen"
"mime/multipart"
"quyun/app/requests"
"quyun/database/schemas/public/model"
)
// @provider contracts.HttpRoute atom.GroupRoutes
@@ -53,7 +52,7 @@ func (r *Routes) Register(router fiber.Router) {
router.Put("/v1/admin/posts/:id", Func2(
r.posts.Update,
PathParam[int64]("id"),
Body[model.Posts]("form"),
Body[PostForm]("form"),
))
router.Delete("/v1/admin/posts/:id", Func1(

View File

@@ -90,7 +90,7 @@ func (m *postsModel) Update(ctx context.Context, id int64, model *model.Posts) e
model.UpdatedAt = time.Now()
tbl := table.Posts
stmt := tbl.UPDATE(tbl.MutableColumns).SET(model).WHERE(tbl.ID.EQ(Int64(id)))
stmt := tbl.UPDATE(tbl.MutableColumns).MODEL(model).WHERE(tbl.ID.EQ(Int64(id)))
m.log.Infof("sql: %s", stmt.DebugSql())
_, err := stmt.ExecContext(ctx, db)

View File

@@ -102,6 +102,7 @@ require (
github.com/jcmturner/gofork v1.7.6 // indirect
github.com/jcmturner/gokrb5/v8 v8.4.4 // indirect
github.com/jcmturner/rpc/v2 v2.0.3 // indirect
github.com/jinzhu/copier v0.4.0 // indirect
github.com/josharian/intern v1.0.0 // indirect
github.com/json-iterator/go v1.1.12 // indirect
github.com/jtolds/gls v4.20.0+incompatible // indirect

View File

@@ -168,6 +168,8 @@ github.com/jcmturner/gokrb5/v8 v8.4.4 h1:x1Sv4HaTpepFkXbt2IkL29DXRf8sOfZXo8eRKh6
github.com/jcmturner/gokrb5/v8 v8.4.4/go.mod h1:1btQEpgT6k+unzCwX1KdWMEwPPkkgBtP+F6aCACiMrs=
github.com/jcmturner/rpc/v2 v2.0.3 h1:7FXXj8Ti1IaVFpSAziCZWNzbNuZmnvw/i6CqLNdWfZY=
github.com/jcmturner/rpc/v2 v2.0.3/go.mod h1:VUJYCIDm3PVOEHw8sgt091/20OJjskO/YJki3ELg/Hc=
github.com/jinzhu/copier v0.4.0 h1:w3ciUoD19shMCRargcpm0cm91ytaBhDvuRpz1ODO/U8=
github.com/jinzhu/copier v0.4.0/go.mod h1:DfbEm0FYsaqBcKcFuvmOZb218JkPGtvSHsKg8S8hyyg=
github.com/josharian/intern v1.0.0 h1:vlS4z54oSdjm0bgjRigI+G1HpF+tI+9rE5LLzOg8HmY=
github.com/josharian/intern v1.0.0/go.mod h1:5DoeVV0s6jJacbCEi61lwdGj/aVlrQvzHFFd8Hwg//Y=
github.com/json-iterator/go v1.1.12 h1:PV8peI4a0ysnczrg+LtxykD8LfKY9ML6u2jnxaEnrnM=

View File

@@ -1,7 +1,8 @@
<script setup>
import { mediaService } from '@/api/mediaService';
import { postService } from '@/api/postService';
import { useToast } from 'primevue/usetoast';
import { onMounted, reactive, ref } from 'vue';
import { computed, onMounted, reactive, ref } from 'vue';
import { useRoute, useRouter } from 'vue-router';
// PrimeVue components
@@ -13,6 +14,7 @@ import Dialog from 'primevue/dialog';
import InputNumber from 'primevue/inputnumber';
import InputText from 'primevue/inputtext';
import ProgressSpinner from 'primevue/progressspinner';
import RadioButton from 'primevue/radiobutton';
import Textarea from 'primevue/textarea';
import Toast from 'primevue/toast';
@@ -53,6 +55,16 @@ const selectedMediaItems = ref([]);
const mediaLoading = ref(false);
const mediaGlobalFilter = ref('');
// Add pagination state for media dialog
const mediaFirst = ref(0);
const mediaRows = ref(10);
const mediaTotalRecords = ref(0);
const mediaCurrentPage = ref(1);
const mediaTotalPages = computed(() => {
return Math.ceil(mediaTotalRecords.value / mediaRows.value);
});
// Sample media data - in a real app, this would come from an API
const mediaItems = ref([
{
@@ -113,7 +125,7 @@ const fetchPost = async (id) => {
post.title = postData.title;
post.price = postData.price;
post.discount = postData.discount || 100;
post.introduction = postData.introduction;
post.introduction = postData.description;
post.status = postData.status;
post.selectedMedia = postData.medias || [];
post.medias = postData.medias?.map(media => media.id) || [];
@@ -128,6 +140,8 @@ const fetchPost = async (id) => {
// Open media selection dialog
const openMediaDialog = () => {
mediaDialogVisible.value = true;
mediaCurrentPage.value = 1;
mediaFirst.value = 0;
loadMediaItems();
};
@@ -135,13 +149,12 @@ const openMediaDialog = () => {
const loadMediaItems = async () => {
mediaLoading.value = true;
try {
// In a real app, this would be an API call
// const response = await mediaApi.getMediaFiles();
// mediaItems.value = response.data;
// Simulate API delay
await new Promise(resolve => setTimeout(resolve, 500));
// Using sample data already defined above
const response = await mediaService.getMedias({
page: mediaCurrentPage.value,
limit: mediaRows.value
});
mediaItems.value = response.data.items;
mediaTotalRecords.value = response.data.total;
} catch (error) {
toast.add({ severity: 'error', summary: '错误', detail: '加载媒体文件失败', life: 3000 });
} finally {
@@ -249,6 +262,27 @@ const getFileIcon = (file) => {
return `pi ${map[file.fileType] || 'pi-file'}`;
};
// Add pagination handler
const onMediaPage = (event) => {
mediaFirst.value = event.first;
mediaRows.value = event.rows;
mediaCurrentPage.value = Math.floor(event.first / event.rows) + 1;
loadMediaItems();
};
// Add format file size helper
const formatFileSize = (bytes) => {
if (!bytes && bytes !== 0) return '0 B';
const sizes = ['B', 'KB', 'MB', 'GB', 'TB', 'PB', 'EB', 'ZB', 'YB'];
const base = 1024;
let size = Number(bytes);
if (isNaN(size)) return '0 B';
const i = Math.floor(Math.log(size) / Math.log(base));
size = size / Math.pow(base, i);
return `${size.toFixed(2)} ${sizes[i]}`;
};
onMounted(() => {
// Get post ID from route params
const postId = route.params.id;
@@ -373,9 +407,22 @@ onMounted(() => {
</div>
<DataTable v-model:selection="selectedMediaItems" :value="mediaItems" :loading="mediaLoading" dataKey="id"
selectionMode="multiple" :globalFilterFields="['fileName', 'fileType']"
:filters="{ global: { value: mediaGlobalFilter, matchMode: 'contains' } }" stripedRows
responsiveLayout="scroll">
:paginator="true" v-model:first="mediaFirst" v-model:rows="mediaRows" :totalRecords="mediaTotalRecords"
@page="onMediaPage" selectionMode="multiple"
paginatorTemplate="FirstPageLink PrevPageLink PageLinks NextPageLink LastPageLink CurrentPageReport"
:rows-per-page-options="[10, 25, 50]" currentPageReportTemplate="第 {first} 到 {last} 条,共 {totalRecords} 条"
:lazy="true" :showCurrentPageReport="true">
<template #paginatorLeft>
<div class="flex items-center">
每页: {{ mediaRows }}
</div>
</template>
<template #paginatorRight>
<div class="flex items-center">
{{ mediaCurrentPage }} {{ mediaTotalPages }}
</div>
</template>
<template #empty>
<div class="text-center p-4">没有可用的媒体文件</div>
@@ -392,27 +439,27 @@ onMounted(() => {
<Column field="fileName" header="文件名">
<template #body="{ data }">
<div class="flex items-center">
<div v-if="data.thumbnailUrl" class="flex-shrink-0 h-10 w-10 mr-3">
<img class="h-10 w-10 object-cover rounded" :src="data.thumbnailUrl" :alt="data.fileName">
</div>
<div v-else
class="flex-shrink-0 h-10 w-10 mr-3 bg-gray-100 rounded flex items-center justify-center">
<i :class="getFileIcon(data)" class="text-2xl"></i>
</div>
<div class="text-sm font-medium text-gray-900">{{ data.fileName }}</div>
</div>
<div class="text-sm font-medium text-gray-900">{{ data.name }}</div>
</template>
</Column>
<Column field="fileType" header="文件类型">
<template #body="{ data }">
<Badge :value="data.fileType" :severity="getBadgeSeverity(data.fileType)" />
<Badge :value="data.file_type" :severity="getBadgeSeverity(data.file_type)" />
</template>
</Column>
<Column field="fileSize" header="文件大小"></Column>
<Column field="uploadTime" header="上传时间"></Column>
<Column field="fileSize" header="文件大小">
<template #body="{ data }">
{{ formatFileSize(data.file_size) }}
</template>
</Column>
<Column field="createdAt" header="上传时间">
<template #body="{ data }">
{{ new Date(data.upload_time).toLocaleString('zh-CN') }}
</template>
</Column>
</DataTable>
<template #footer>