enhance(frontend): リアクションの取り消し/変更時に確認ダイアログを出すように
This commit is contained in:
parent
a3423bad60
commit
527a13b77d
|
@ -21,6 +21,7 @@
|
|||
- 今後はAPI呼び出し時およびストリーミング接続時に設定するようになります
|
||||
|
||||
### Client
|
||||
- リアクションの取り消し/変更時に確認ダイアログを出すように
|
||||
- 開発者モードを追加
|
||||
- AiScriptを0.13.3に更新
|
||||
- Fix: URLプレビューで情報が取得できなかった際の挙動を修正
|
||||
|
|
|
@ -1053,6 +1053,8 @@ update: "更新"
|
|||
rolesThatCanBeUsedThisEmojiAsReaction: "リアクションとして使えるロール"
|
||||
rolesThatCanBeUsedThisEmojiAsReactionEmptyDescription: "ロールの指定が一つもない場合、誰でもリアクションとして使えます。"
|
||||
rolesThatCanBeUsedThisEmojiAsReactionPublicRoleWarn: "ロールは公開ロールである必要があります。"
|
||||
cancelReactionConfirm: "リアクションを取り消しますか?"
|
||||
changeReactionConfirm: "リアクションを変更しますか?"
|
||||
|
||||
_initialAccountSetting:
|
||||
accountCreated: "アカウントの作成が完了しました!"
|
||||
|
|
|
@ -6,7 +6,7 @@
|
|||
:class="[$style.root, { [$style.reacted]: note.myReaction == reaction, [$style.canToggle]: canToggle, [$style.large]: defaultStore.state.largeNoteReactions }]"
|
||||
@click="toggleReaction()"
|
||||
>
|
||||
<MkReactionIcon :class="$style.icon" :reaction="reaction" :emoji-url="note.reactionEmojis[reaction.substr(1, reaction.length - 2)]"/>
|
||||
<MkReactionIcon :class="$style.icon" :reaction="reaction" :emojiUrl="note.reactionEmojis[reaction.substr(1, reaction.length - 2)]"/>
|
||||
<span :class="$style.count">{{ count }}</span>
|
||||
</button>
|
||||
</template>
|
||||
|
@ -22,6 +22,7 @@ import { $i } from '@/account';
|
|||
import MkReactionEffect from '@/components/MkReactionEffect.vue';
|
||||
import { claimAchievement } from '@/scripts/achievements';
|
||||
import { defaultStore } from '@/store';
|
||||
import { i18n } from '@/i18n';
|
||||
|
||||
const props = defineProps<{
|
||||
reaction: string;
|
||||
|
@ -34,11 +35,17 @@ const buttonEl = shallowRef<HTMLElement>();
|
|||
|
||||
const canToggle = computed(() => !props.reaction.match(/@\w/) && $i);
|
||||
|
||||
const toggleReaction = () => {
|
||||
async function toggleReaction() {
|
||||
if (!canToggle.value) return;
|
||||
|
||||
const oldReaction = props.note.myReaction;
|
||||
if (oldReaction) {
|
||||
const confirm = await os.confirm({
|
||||
type: 'warning',
|
||||
text: oldReaction !== props.reaction ? i18n.ts.changeReactionConfirm : i18n.ts.cancelReactionConfirm,
|
||||
});
|
||||
if (confirm.canceled) return;
|
||||
|
||||
os.api('notes/reactions/delete', {
|
||||
noteId: props.note.id,
|
||||
}).then(() => {
|
||||
|
@ -58,9 +65,9 @@ const toggleReaction = () => {
|
|||
claimAchievement('reactWithoutRead');
|
||||
}
|
||||
}
|
||||
};
|
||||
}
|
||||
|
||||
const anime = () => {
|
||||
function anime() {
|
||||
if (document.hidden) return;
|
||||
if (!defaultStore.state.animation) return;
|
||||
|
||||
|
@ -68,7 +75,7 @@ const anime = () => {
|
|||
const x = rect.left + 16;
|
||||
const y = rect.top + (buttonEl.value.offsetHeight / 2);
|
||||
os.popup(MkReactionEffect, { reaction: props.reaction, x, y }, {}, 'end');
|
||||
};
|
||||
}
|
||||
|
||||
watch(() => props.count, (newCount, oldCount) => {
|
||||
if (oldCount < newCount) anime();
|
||||
|
|
Loading…
Reference in New Issue