fix(frontend): ロール作成画面で設定できるアイコンデコレーションの最大値を16にする (#15352)
* fix(frontend): アイコンデコレーションの17以上の数値が入力された際16にしてAPIリクエストを送信するように * Update CHANGELOG --------- Co-authored-by: Esurio <esurio@esurio1673.net>
This commit is contained in:
		@@ -582,7 +582,7 @@ SPDX-License-Identifier: AGPL-3.0-only
 | 
			
		||||
					<MkSwitch v-model="role.policies.avatarDecorationLimit.useDefault" :readonly="readonly">
 | 
			
		||||
						<template #label>{{ i18n.ts._role.useBaseValue }}</template>
 | 
			
		||||
					</MkSwitch>
 | 
			
		||||
					<MkInput v-model="role.policies.avatarDecorationLimit.value" type="number" :min="0">
 | 
			
		||||
					<MkInput v-model="role.policies.avatarDecorationLimit.value" type="number" :min="0" :max="16" @update:modelValue="updateAvatarDecorationLimit">
 | 
			
		||||
						<template #label>{{ i18n.ts._role._options.avatarDecorationLimit }}</template>
 | 
			
		||||
					</MkInput>
 | 
			
		||||
					<MkRange v-model="role.policies.avatarDecorationLimit.priority" :min="0" :max="2" :step="1" easing :textConverter="(v) => v === 0 ? i18n.ts._role._priority.low : v === 1 ? i18n.ts._role._priority.middle : v === 2 ? i18n.ts._role._priority.high : ''">
 | 
			
		||||
@@ -698,6 +698,7 @@ SPDX-License-Identifier: AGPL-3.0-only
 | 
			
		||||
<script lang="ts" setup>
 | 
			
		||||
import { watch, ref, computed } from 'vue';
 | 
			
		||||
import { throttle } from 'throttle-debounce';
 | 
			
		||||
import { ROLE_POLICIES } from '@@/js/const.js';
 | 
			
		||||
import RolesEditorFormula from './RolesEditorFormula.vue';
 | 
			
		||||
import MkInput from '@/components/MkInput.vue';
 | 
			
		||||
import MkColorInput from '@/components/MkColorInput.vue';
 | 
			
		||||
@@ -708,7 +709,6 @@ import MkSwitch from '@/components/MkSwitch.vue';
 | 
			
		||||
import MkRange from '@/components/MkRange.vue';
 | 
			
		||||
import FormSlot from '@/components/form/slot.vue';
 | 
			
		||||
import { i18n } from '@/i18n.js';
 | 
			
		||||
import { ROLE_POLICIES } from '@@/js/const.js';
 | 
			
		||||
import { instance } from '@/instance.js';
 | 
			
		||||
import { deepClone } from '@/scripts/clone.js';
 | 
			
		||||
 | 
			
		||||
@@ -734,6 +734,12 @@ for (const ROLE_POLICY of ROLE_POLICIES) {
 | 
			
		||||
	}
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
function updateAvatarDecorationLimit(value: string | number) {
 | 
			
		||||
	const numValue = Number(value);
 | 
			
		||||
	const limited = Math.min(16, Math.max(0, numValue));
 | 
			
		||||
	role.value.policies.avatarDecorationLimit.value = limited;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
const rolePermission = computed({
 | 
			
		||||
	get: () => role.value.isAdministrator ? 'administrator' : role.value.isModerator ? 'moderator' : 'normal',
 | 
			
		||||
	set: (val) => {
 | 
			
		||||
 
 | 
			
		||||
@@ -213,7 +213,7 @@ SPDX-License-Identifier: AGPL-3.0-only
 | 
			
		||||
						<MkFolder v-if="matchQuery([i18n.ts._role._options.avatarDecorationLimit, 'avatarDecorationLimit'])">
 | 
			
		||||
							<template #label>{{ i18n.ts._role._options.avatarDecorationLimit }}</template>
 | 
			
		||||
							<template #suffix>{{ policies.avatarDecorationLimit }}</template>
 | 
			
		||||
							<MkInput v-model="policies.avatarDecorationLimit" type="number" :min="0">
 | 
			
		||||
							<MkInput v-model="avatarDecorationLimit" type="number" :min="0" :max="16" @update:modelValue="updateAvatarDecorationLimit">
 | 
			
		||||
							</MkInput>
 | 
			
		||||
						</MkFolder>
 | 
			
		||||
 | 
			
		||||
@@ -307,6 +307,17 @@ for (const ROLE_POLICY of ROLE_POLICIES) {
 | 
			
		||||
	policies[ROLE_POLICY] = instance.policies[ROLE_POLICY];
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
const avatarDecorationLimit = computed({
 | 
			
		||||
	get: () => Math.min(16, Math.max(0, policies.avatarDecorationLimit)),
 | 
			
		||||
	set: (value) => {
 | 
			
		||||
		policies.avatarDecorationLimit = Math.min(Number(value), 16);
 | 
			
		||||
	},
 | 
			
		||||
});
 | 
			
		||||
 | 
			
		||||
function updateAvatarDecorationLimit(value: string | number) {
 | 
			
		||||
	avatarDecorationLimit.value = Number(value);
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
function matchQuery(keywords: string[]): boolean {
 | 
			
		||||
	if (baseRoleQ.value.trim().length === 0) return true;
 | 
			
		||||
	return keywords.some(keyword => keyword.toLowerCase().includes(baseRoleQ.value.toLowerCase()));
 | 
			
		||||
 
 | 
			
		||||
		Reference in New Issue
	
	Block a user