replace el-checkbox with Checkbox component

This commit is contained in:
pa
2026-01-11 22:25:54 +09:00
committed by Natsumi
parent 6222becd3d
commit 3ed266089a
26 changed files with 341 additions and 191 deletions

View File

@@ -120,11 +120,9 @@
<el-table-column width="55" prop="$selected">
<template #default="scope">
<el-button text size="small" @click.stop>
<el-checkbox
<Checkbox
v-model="scope.row.$selected"
@change="
groupMemberModerationTableSelectionChange(scope.row)
"></el-checkbox>
@update:modelValue="groupMemberModerationTableSelectionChange(scope.row)" />
</el-button>
</template>
</el-table-column>
@@ -237,11 +235,9 @@
<el-table-column width="55" prop="$selected">
<template #default="scope">
<el-button text size="small" @click.stop>
<el-checkbox
<Checkbox
v-model="scope.row.$selected"
@change="
groupMemberModerationTableSelectionChange(scope.row)
"></el-checkbox>
@update:modelValue="groupMemberModerationTableSelectionChange(scope.row)" />
</el-button>
</template>
</el-table-column>
@@ -353,11 +349,11 @@
<el-table-column width="55" prop="$selected">
<template #default="scope">
<el-button text size="small" @click.stop>
<el-checkbox
<Checkbox
v-model="scope.row.$selected"
@change="
@update:modelValue="
groupMemberModerationTableSelectionChange(scope.row)
"></el-checkbox>
" />
</el-button>
</template>
</el-table-column>
@@ -435,11 +431,11 @@
<el-table-column width="55" prop="$selected">
<template #default="scope">
<el-button text size="small" @click.stop>
<el-checkbox
<Checkbox
v-model="scope.row.$selected"
@change="
@update:modelValue="
groupMemberModerationTableSelectionChange(scope.row)
"></el-checkbox>
" />
</el-button>
</template>
</el-table-column>
@@ -537,11 +533,11 @@
<el-table-column width="55" prop="$selected">
<template #default="scope">
<el-button text size="small" @click.stop>
<el-checkbox
<Checkbox
v-model="scope.row.$selected"
@change="
@update:modelValue="
groupMemberModerationTableSelectionChange(scope.row)
"></el-checkbox>
" />
</el-button>
</template>
</el-table-column>
@@ -871,6 +867,7 @@
import { groupDialogFilterOptions, groupDialogSortingOptions } from '../../../shared/constants';
import { groupRequest, userRequest } from '../../../api';
import { Badge } from '../../ui/badge';
import { Checkbox } from '../../ui/checkbox';
import GroupMemberModerationExportDialog from './GroupMemberModerationExportDialog.vue';

View File

@@ -6,16 +6,17 @@
width="650px"
append-to-body
@close="setIsGroupLogsExportDialogVisible">
<el-checkbox-group
v-model="checkedGroupLogsExportLogsOptions"
style="margin-bottom: 10px"
@change="updateGroupLogsExportContent">
<template v-for="option in checkGroupsLogsExportLogsOptions" :key="option.label">
<el-checkbox :label="option.label">
{{ t(option.text) }}
</el-checkbox>
</template>
</el-checkbox-group>
<div style="margin-bottom: 10px" class="flex flex-col gap-2">
<label
v-for="option in checkGroupsLogsExportLogsOptions"
:key="option.label"
class="inline-flex items-center gap-2">
<Checkbox
:model-value="checkedGroupLogsExportLogsOptions.includes(option.label)"
@update:modelValue="(val) => toggleGroupLogsExportOption(option.label, val)" />
<span>{{ t(option.text) }}</span>
</label>
</div>
<br />
<el-input
v-model="groupLogsExportContent"
@@ -31,6 +32,7 @@
<script setup>
import { ref, watch } from 'vue';
import { Checkbox } from '@/components/ui/checkbox';
import { useI18n } from 'vue-i18n';
import { copyToClipboard } from '../../../shared/utils';
@@ -75,6 +77,17 @@
'data'
]);
function toggleGroupLogsExportOption(label, checked) {
const selection = checkedGroupLogsExportLogsOptions.value;
const index = selection.indexOf(label);
if (checked && index === -1) {
selection.push(label);
} else if (!checked && index !== -1) {
selection.splice(index, 1);
}
updateGroupLogsExportContent();
}
function updateGroupLogsExportContent() {
const formatter = (str) => (/[\x00-\x1f,"]/.test(str) ? `"${str.replace(/"/g, '""')}"` : str);

View File

@@ -20,12 +20,10 @@
resize="none"></el-input>
</el-form-item>
<el-form-item>
<el-checkbox
v-if="!groupPostEditDialog.postId"
v-model="groupPostEditDialog.sendNotification"
size="small">
{{ t('dialog.group_post_edit.send_notification') }}
</el-checkbox>
<label v-if="!groupPostEditDialog.postId" class="inline-flex items-center gap-2">
<Checkbox v-model="groupPostEditDialog.sendNotification" />
<span>{{ t('dialog.group_post_edit.send_notification') }}</span>
</label>
</el-form-item>
<el-form-item :label="t('dialog.group_post_edit.post_visibility')">
<RadioGroup v-model="groupPostEditDialog.visibility" class="flex items-center gap-4">
@@ -113,6 +111,7 @@
<script setup>
import { computed, ref } from 'vue';
import { Button } from '@/components/ui/button';
import { Checkbox } from '@/components/ui/checkbox';
import { toast } from 'vue-sonner';
import { useI18n } from 'vue-i18n';