+
+
编辑器模式
location.reload()
+
+
+
@@ -100,14 +109,16 @@ const handleRefreshPage = () => location.reload()
.editor-height-title {
display: flex;
justify-content: space-between;
+ align-items: center;
margin-bottom: 10px;
font-size: 17px;
}
- .editor-advance-title {
+ .editor-advance {
display: flex;
justify-content: space-between;
- margin-bottom: 10px;
+ align-items: center;
+ margin-bottom: 20px;
font-size: 17px;
}
}
@@ -116,9 +127,10 @@ const handleRefreshPage = () => location.reload()
margin-bottom: 20px;
display: flex;
justify-content: space-between;
+ align-items: center;
}
-.editor-advance {
+.editor-advance-title {
display: flex;
flex-direction: column;
.refresh {
@@ -149,6 +161,14 @@ const handleRefreshPage = () => location.reload()
}
}
+// 是否显示热门关键词
+.keywords {
+ display: flex;
+ justify-content: space-between;
+ align-items: center;
+ font-size: 17px;
+}
+
.slide-up-enter-active,
.slide-up-leave-active {
transition: all 0.25s ease-out;
diff --git a/src/components/quill-editor/SwitchButton.vue b/src/components/quill-editor/SwitchButton.vue
new file mode 100644
index 00000000..431c5d6b
--- /dev/null
+++ b/src/components/quill-editor/SwitchButton.vue
@@ -0,0 +1,72 @@
+
+
+
+
+
+
+
+
+
diff --git a/src/components/top-bar/KUNGalgameTopBar.vue b/src/components/top-bar/KUNGalgameTopBar.vue
index b8c0ee67..e367da52 100644
--- a/src/components/top-bar/KUNGalgameTopBar.vue
+++ b/src/components/top-bar/KUNGalgameTopBar.vue
@@ -185,11 +185,6 @@ $navNumber: v-bind(navItemNum);
font-weight: bold;
line-height: 58px;
width: 100%;
- &:hover {
- background-color: var(--kungalgame-blue-0);
- border-radius: 2px;
- transition: 0.5s;
- }
&:nth-child(1):hover ~ .box {
background-color: var(--kungalgame-red-3);
left: calc(100% / $navNumber * 0);
diff --git a/src/store/modules/edit.ts b/src/store/modules/edit.ts
index efd29957..92fda9f8 100644
--- a/src/store/modules/edit.ts
+++ b/src/store/modules/edit.ts
@@ -33,6 +33,8 @@ interface Topic {
tags: Array
// 话题分区
category: Array
+ // 是否显示热门关键词
+ isShowHotKeywords: boolean
// 是否保存
isSave: boolean
}
@@ -41,15 +43,16 @@ export const useKUNGalgameEditStore = defineStore({
id: 'edit',
persist: true,
state: (): Topic => ({
- isSave: false,
+ editorHeight: 300,
mode: '',
theme: 'snow',
- editorHeight: 300,
title: '',
content: '',
tags: [],
category: [],
+ isSave: false,
+ isShowHotKeywords: true,
}),
getters: {},
actions: {
diff --git a/src/views/edit/components/Tags.vue b/src/views/edit/components/Tags.vue
index d14f7618..70ef8ad8 100644
--- a/src/views/edit/components/Tags.vue
+++ b/src/views/edit/components/Tags.vue
@@ -4,10 +4,12 @@ import { ref, computed, watch, onBeforeMount } from 'vue'
import { useKUNGalgameEditStore } from '@/store/modules/edit'
import { storeToRefs } from 'pinia'
-const topicData = storeToRefs(useKUNGalgameEditStore())
+const { tags, isSave, isShowHotKeywords } = storeToRefs(
+ useKUNGalgameEditStore()
+)
// 临时数据,将会从后端返回 7 个热门 tag
-const tags = [
+const hotTags = [
'啊这可海星',
'啊这可海星',
'啊这',
@@ -22,8 +24,8 @@ const selectedTags = ref([])
// 组件挂载之前载入 store 里的数据
onBeforeMount(() => {
// 如果用户保存了草稿则载入
- if (topicData.isSave.value) {
- selectedTags.value = topicData.tags.value
+ if (isSave.value) {
+ selectedTags.value = tags.value
}
})
@@ -42,7 +44,7 @@ const handleTagClose = (tag: string) => {
// 被选中后还留下的 tag
const remainingTags = computed(() => {
- return tags.filter((tag) => !selectedTags.value.includes(tag))
+ return hotTags.filter((tag) => !selectedTags.value.includes(tag))
})
// 输入框事件,按下 enter 创建 tag,创建 tag 时长度不超过 17,个数不超过 7
@@ -85,7 +87,7 @@ const validateTagName = (tagName: string) => {
// 监测 selectedTags 的变化,保存用户选中的 tag
watch(selectedTags.value, () => {
- topicData.tags.value = selectedTags.value
+ tags.value = selectedTags.value
})
@@ -113,13 +115,17 @@ watch(selectedTags.value, () => {
提示:(单个关键词 14 个字符以内,至少选择一个、最多 7 个),
您可以输入文字按下 ' Enter ' 创建关键词