refactor(frontend): 非推奨となったReactivity Transformを使わないように (#12539)
* refactor(frontend): 非推奨となったReactivity Transformを使わないように * refactor: 不要な括弧を除去 * fix: 不要なアノテーションを除去 * fix: Refの配列をrefしている部分の対応 * refactor: 不要な括弧を除去 * fix: lint * refactor: Ref、ShallowRef、ComputedRefの変数の宣言をletからconstに置換 * fix: type error * chore: drop reactivity transform from eslint configuration * refactor: remove unnecessary import * fix: 対応漏れ
This commit is contained in:
zyoshoka
@@ -61,7 +61,7 @@ SPDX-License-Identifier: AGPL-3.0-only
|
||||
</template>
|
||||
|
||||
<script lang="ts" setup>
|
||||
import { computed, provide, watch } from 'vue';
|
||||
import { computed, provide, watch, ref } from 'vue';
|
||||
import { v4 as uuid } from 'uuid';
|
||||
import XBlocks from './page-editor.blocks.vue';
|
||||
import MkButton from '@/components/MkButton.vue';
|
||||
@@ -82,47 +82,47 @@ const props = defineProps<{
|
||||
initUser?: string;
|
||||
}>();
|
||||
|
||||
let tab = $ref('settings');
|
||||
let author = $ref($i);
|
||||
let readonly = $ref(false);
|
||||
let page = $ref(null);
|
||||
let pageId = $ref(null);
|
||||
let currentName = $ref(null);
|
||||
let title = $ref('');
|
||||
let summary = $ref(null);
|
||||
let name = $ref(Date.now().toString());
|
||||
let eyeCatchingImage = $ref(null);
|
||||
let eyeCatchingImageId = $ref(null);
|
||||
let font = $ref('sans-serif');
|
||||
let content = $ref([]);
|
||||
let alignCenter = $ref(false);
|
||||
let hideTitleWhenPinned = $ref(false);
|
||||
const tab = ref('settings');
|
||||
const author = ref($i);
|
||||
const readonly = ref(false);
|
||||
const page = ref(null);
|
||||
const pageId = ref(null);
|
||||
const currentName = ref(null);
|
||||
const title = ref('');
|
||||
const summary = ref(null);
|
||||
const name = ref(Date.now().toString());
|
||||
const eyeCatchingImage = ref(null);
|
||||
const eyeCatchingImageId = ref(null);
|
||||
const font = ref('sans-serif');
|
||||
const content = ref([]);
|
||||
const alignCenter = ref(false);
|
||||
const hideTitleWhenPinned = ref(false);
|
||||
|
||||
provide('readonly', readonly);
|
||||
provide('readonly', readonly.value);
|
||||
provide('getPageBlockList', getPageBlockList);
|
||||
|
||||
watch($$(eyeCatchingImageId), async () => {
|
||||
if (eyeCatchingImageId == null) {
|
||||
eyeCatchingImage = null;
|
||||
watch(eyeCatchingImageId, async () => {
|
||||
if (eyeCatchingImageId.value == null) {
|
||||
eyeCatchingImage.value = null;
|
||||
} else {
|
||||
eyeCatchingImage = await os.api('drive/files/show', {
|
||||
fileId: eyeCatchingImageId,
|
||||
eyeCatchingImage.value = await os.api('drive/files/show', {
|
||||
fileId: eyeCatchingImageId.value,
|
||||
});
|
||||
}
|
||||
});
|
||||
|
||||
function getSaveOptions() {
|
||||
return {
|
||||
title: title.trim(),
|
||||
name: name.trim(),
|
||||
summary: summary,
|
||||
font: font,
|
||||
title: title.value.trim(),
|
||||
name: name.value.trim(),
|
||||
summary: summary.value,
|
||||
font: font.value,
|
||||
script: '',
|
||||
hideTitleWhenPinned: hideTitleWhenPinned,
|
||||
alignCenter: alignCenter,
|
||||
content: content,
|
||||
hideTitleWhenPinned: hideTitleWhenPinned.value,
|
||||
alignCenter: alignCenter.value,
|
||||
content: content.value,
|
||||
variables: [],
|
||||
eyeCatchingImageId: eyeCatchingImageId,
|
||||
eyeCatchingImageId: eyeCatchingImageId.value,
|
||||
};
|
||||
}
|
||||
|
||||
@@ -146,11 +146,11 @@ function save() {
|
||||
}
|
||||
};
|
||||
|
||||
if (pageId) {
|
||||
options.pageId = pageId;
|
||||
if (pageId.value) {
|
||||
options.pageId = pageId.value;
|
||||
os.api('pages/update', options)
|
||||
.then(page => {
|
||||
currentName = name.trim();
|
||||
currentName.value = name.value.trim();
|
||||
os.alert({
|
||||
type: 'success',
|
||||
text: i18n.ts._pages.updated,
|
||||
@@ -159,13 +159,13 @@ function save() {
|
||||
} else {
|
||||
os.api('pages/create', options)
|
||||
.then(created => {
|
||||
pageId = created.id;
|
||||
currentName = name.trim();
|
||||
pageId.value = created.id;
|
||||
currentName.value = name.value.trim();
|
||||
os.alert({
|
||||
type: 'success',
|
||||
text: i18n.ts._pages.created,
|
||||
});
|
||||
mainRouter.push(`/pages/edit/${pageId}`);
|
||||
mainRouter.push(`/pages/edit/${pageId.value}`);
|
||||
}).catch(onError);
|
||||
}
|
||||
}
|
||||
@@ -173,11 +173,11 @@ function save() {
|
||||
function del() {
|
||||
os.confirm({
|
||||
type: 'warning',
|
||||
text: i18n.t('removeAreYouSure', { x: title.trim() }),
|
||||
text: i18n.t('removeAreYouSure', { x: title.value.trim() }),
|
||||
}).then(({ canceled }) => {
|
||||
if (canceled) return;
|
||||
os.api('pages/delete', {
|
||||
pageId: pageId,
|
||||
pageId: pageId.value,
|
||||
}).then(() => {
|
||||
os.alert({
|
||||
type: 'success',
|
||||
@@ -189,16 +189,16 @@ function del() {
|
||||
}
|
||||
|
||||
function duplicate() {
|
||||
title = title + ' - copy';
|
||||
name = name + '-copy';
|
||||
title.value = title.value + ' - copy';
|
||||
name.value = name.value + '-copy';
|
||||
os.api('pages/create', getSaveOptions()).then(created => {
|
||||
pageId = created.id;
|
||||
currentName = name.trim();
|
||||
pageId.value = created.id;
|
||||
currentName.value = name.value.trim();
|
||||
os.alert({
|
||||
type: 'success',
|
||||
text: i18n.ts._pages.created,
|
||||
});
|
||||
mainRouter.push(`/pages/edit/${pageId}`);
|
||||
mainRouter.push(`/pages/edit/${pageId.value}`);
|
||||
});
|
||||
}
|
||||
|
||||
@@ -211,7 +211,7 @@ async function add() {
|
||||
if (canceled) return;
|
||||
|
||||
const id = uuid();
|
||||
content.push({ id, type });
|
||||
content.value.push({ id, type });
|
||||
}
|
||||
|
||||
function getPageBlockList() {
|
||||
@@ -225,42 +225,42 @@ function getPageBlockList() {
|
||||
|
||||
function setEyeCatchingImage(img) {
|
||||
selectFile(img.currentTarget ?? img.target, null).then(file => {
|
||||
eyeCatchingImageId = file.id;
|
||||
eyeCatchingImageId.value = file.id;
|
||||
});
|
||||
}
|
||||
|
||||
function removeEyeCatchingImage() {
|
||||
eyeCatchingImageId = null;
|
||||
eyeCatchingImageId.value = null;
|
||||
}
|
||||
|
||||
async function init() {
|
||||
if (props.initPageId) {
|
||||
page = await os.api('pages/show', {
|
||||
page.value = await os.api('pages/show', {
|
||||
pageId: props.initPageId,
|
||||
});
|
||||
} else if (props.initPageName && props.initUser) {
|
||||
page = await os.api('pages/show', {
|
||||
page.value = await os.api('pages/show', {
|
||||
name: props.initPageName,
|
||||
username: props.initUser,
|
||||
});
|
||||
readonly = true;
|
||||
readonly.value = true;
|
||||
}
|
||||
|
||||
if (page) {
|
||||
author = page.user;
|
||||
pageId = page.id;
|
||||
title = page.title;
|
||||
name = page.name;
|
||||
currentName = page.name;
|
||||
summary = page.summary;
|
||||
font = page.font;
|
||||
hideTitleWhenPinned = page.hideTitleWhenPinned;
|
||||
alignCenter = page.alignCenter;
|
||||
content = page.content;
|
||||
eyeCatchingImageId = page.eyeCatchingImageId;
|
||||
if (page.value) {
|
||||
author.value = page.value.user;
|
||||
pageId.value = page.value.id;
|
||||
title.value = page.value.title;
|
||||
name.value = page.value.name;
|
||||
currentName.value = page.value.name;
|
||||
summary.value = page.value.summary;
|
||||
font.value = page.value.font;
|
||||
hideTitleWhenPinned.value = page.value.hideTitleWhenPinned;
|
||||
alignCenter.value = page.value.alignCenter;
|
||||
content.value = page.value.content;
|
||||
eyeCatchingImageId.value = page.value.eyeCatchingImageId;
|
||||
} else {
|
||||
const id = uuid();
|
||||
content = [{
|
||||
content.value = [{
|
||||
id,
|
||||
type: 'text',
|
||||
text: 'Hello World!',
|
||||
@@ -270,9 +270,9 @@ async function init() {
|
||||
|
||||
init();
|
||||
|
||||
const headerActions = $computed(() => []);
|
||||
const headerActions = computed(() => []);
|
||||
|
||||
const headerTabs = $computed(() => [{
|
||||
const headerTabs = computed(() => [{
|
||||
key: 'settings',
|
||||
title: i18n.ts._pages.pageSetting,
|
||||
icon: 'ti ti-settings',
|
||||
|
||||
Reference in New Issue
Block a user