Misaka Mikoto
a0690a6afc
* - 为插件管理页面中，删除插件提供一致的二次确认（原本只有卡片视图有二次确认）
- 二次确认时可选删除插件配置和持久化数据
- 添加对应的i18n支持
* ruff
* 移除未使用的
const $confirm = inject('$confirm');
136 lines
3.3 KiB
Vue
136 lines
3.3 KiB
Vue
<template>
|
|
<v-dialog
|
|
v-model="show"
|
|
max-width="500"
|
|
@click:outside="handleCancel"
|
|
@keydown.esc="handleCancel"
|
|
>
|
|
<v-card>
|
|
<v-card-title class="text-h5">
|
|
{{ tm('dialogs.uninstall.title') }}
|
|
</v-card-title>
|
|
|
|
<v-card-text>
|
|
<div class="mb-4">
|
|
{{ tm('dialogs.uninstall.message') }}
|
|
</div>
|
|
|
|
<v-divider class="my-4"></v-divider>
|
|
|
|
<div class="text-subtitle-2 mb-3">{{ t('core.common.actions') }}:</div>
|
|
|
|
<v-checkbox
|
|
v-model="deleteConfig"
|
|
:label="tm('dialogs.uninstall.deleteConfig')"
|
|
color="warning"
|
|
hide-details
|
|
class="mb-2"
|
|
>
|
|
<template v-slot:append>
|
|
<v-tooltip location="top">
|
|
<template v-slot:activator="{ props }">
|
|
<v-icon v-bind="props" size="small" color="grey">mdi-information-outline</v-icon>
|
|
</template>
|
|
<span>{{ tm('dialogs.uninstall.configHint') }}</span>
|
|
</v-tooltip>
|
|
</template>
|
|
</v-checkbox>
|
|
|
|
<v-checkbox
|
|
v-model="deleteData"
|
|
:label="tm('dialogs.uninstall.deleteData')"
|
|
color="error"
|
|
hide-details
|
|
>
|
|
<template v-slot:append>
|
|
<v-tooltip location="top">
|
|
<template v-slot:activator="{ props }">
|
|
<v-icon v-bind="props" size="small" color="grey">mdi-information-outline</v-icon>
|
|
</template>
|
|
<span>{{ tm('dialogs.uninstall.dataHint') }}</span>
|
|
</v-tooltip>
|
|
</template>
|
|
</v-checkbox>
|
|
|
|
<v-alert
|
|
v-if="deleteConfig || deleteData"
|
|
type="warning"
|
|
variant="tonal"
|
|
density="compact"
|
|
class="mt-4"
|
|
>
|
|
<template v-slot:prepend>
|
|
<v-icon>mdi-alert</v-icon>
|
|
</template>
|
|
{{ t('messages.validation.operation_cannot_be_undone') }}
|
|
</v-alert>
|
|
</v-card-text>
|
|
|
|
<v-card-actions>
|
|
<v-spacer></v-spacer>
|
|
<v-btn
|
|
color="grey"
|
|
variant="text"
|
|
@click="handleCancel"
|
|
>
|
|
{{ t('core.common.cancel') }}
|
|
</v-btn>
|
|
<v-btn
|
|
color="error"
|
|
variant="elevated"
|
|
@click="handleConfirm"
|
|
>
|
|
{{ t('core.common.confirm') }}
|
|
</v-btn>
|
|
</v-card-actions>
|
|
</v-card>
|
|
</v-dialog>
|
|
</template>
|
|
|
|
<script setup lang="ts">
|
|
import { ref, watch } from 'vue';
|
|
import { useI18n, useModuleI18n } from '@/i18n/composables';
|
|
|
|
const props = defineProps({
|
|
modelValue: {
|
|
type: Boolean,
|
|
default: false,
|
|
},
|
|
});
|
|
|
|
const emit = defineEmits(['update:modelValue', 'confirm', 'cancel']);
|
|
|
|
const { t } = useI18n();
|
|
const { tm } = useModuleI18n('features/extension');
|
|
|
|
const show = ref(props.modelValue);
|
|
const deleteConfig = ref(false);
|
|
const deleteData = ref(false);
|
|
|
|
watch(() => props.modelValue, (val) => {
|
|
show.value = val;
|
|
if (val) {
|
|
// 重置选项
|
|
deleteConfig.value = false;
|
|
deleteData.value = false;
|
|
}
|
|
});
|
|
|
|
watch(show, (val) => {
|
|
emit('update:modelValue', val);
|
|
});
|
|
|
|
const handleConfirm = () => {
|
|
emit('confirm', {
|
|
deleteConfig: deleteConfig.value,
|
|
deleteData: deleteData.value,
|
|
});
|
|
show.value = false;
|
|
};
|
|
|
|
const handleCancel = () => {
|
|
emit('cancel');
|
|
show.value = false;
|
|
};
|
|
</script>
|