feat: add slug generation rules to post saving feature in the post editing page (#6205)

#### What type of PR is this?

/area ui
/kind feature
/milestone 2.17.x

#### What this PR does / why we need it:

支持在文章编辑页面创建文章时,也应用别名生成规则

#### Which issue(s) this PR fixes:

Fixes https://github.com/halo-dev/halo/issues/5118
Fixes https://github.com/halo-dev/halo/issues/6155

#### Special notes for your reviewer:

#### Does this PR introduce a user-facing change?

```release-note
支持在文章编辑页面创建文章时,也应用别名生成规则
```
pull/6220/head
Ryan Wang 2024-06-30 00:37:20 +08:00 committed by GitHub
parent bae53f59ea
commit c1ca8d14b7
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
2 changed files with 34 additions and 0 deletions

View File

@ -6,10 +6,12 @@ import { useContentCache } from "@/composables/use-content-cache";
import { useEditorExtensionPoints } from "@/composables/use-editor-extension-points";
import { useSessionKeepAlive } from "@/composables/use-session-keep-alive";
import { contentAnnotations } from "@/constants/annotations";
import { FormType } from "@/types/slug";
import { randomUUID } from "@/utils/id";
import { usePermission } from "@/utils/permission";
import { useContentSnapshot } from "@console/composables/use-content-snapshot";
import { useSaveKeybinding } from "@console/composables/use-save-keybinding";
import useSlugify from "@console/composables/use-slugify";
import type { Post, PostRequest } from "@halo-dev/api-client";
import {
consoleApiClient,
@ -468,6 +470,21 @@ async function handleUploadImage(file: File, options?: AxiosRequestConfig) {
);
return data;
}
// Slug generation
useSlugify(
computed(() => formState.value.post.spec.title),
computed({
get() {
return formState.value.post.spec.slug;
},
set(value) {
formState.value.post.spec.slug = value;
},
}),
computed(() => !isUpdateMode.value),
FormType.POST
);
</script>
<template>

View File

@ -6,9 +6,11 @@ import { useContentCache } from "@/composables/use-content-cache";
import { useEditorExtensionPoints } from "@/composables/use-editor-extension-points";
import { useSessionKeepAlive } from "@/composables/use-session-keep-alive";
import { contentAnnotations } from "@/constants/annotations";
import { FormType } from "@/types/slug";
import { randomUUID } from "@/utils/id";
import { usePermission } from "@/utils/permission";
import { useSaveKeybinding } from "@console/composables/use-save-keybinding";
import useSlugify from "@console/composables/use-slugify";
import type { Content, Post, Snapshot } from "@halo-dev/api-client";
import { ucApiClient } from "@halo-dev/api-client";
import {
@ -437,6 +439,21 @@ async function handleUploadImage(file: File, options?: AxiosRequestConfig) {
// Keep session alive
useSessionKeepAlive();
// Slug generation
useSlugify(
computed(() => formState.value.spec.title),
computed({
get() {
return formState.value.spec.slug;
},
set(value) {
formState.value.spec.slug = value;
},
}),
computed(() => !isUpdateMode.value),
FormType.POST
);
</script>
<template>