keep alive prev instance dialog

This commit is contained in:
pa
2026-01-22 16:10:18 +09:00
parent a1f4a22609
commit ab4dde0836
5 changed files with 40 additions and 12 deletions

View File

@@ -21,12 +21,12 @@
import AvatarDialog from './AvatarDialog/AvatarDialog.vue';
import GroupDialog from './GroupDialog/GroupDialog.vue';
import UserDialog from './UserDialog/UserDialog.vue';
import WorldDialog from './WorldDialog/WorldDialog.vue';
import PreviousInstancesGroupDialog from './PreviousInstancesDialog/PreviousInstancesGroupDialog.vue';
import PreviousInstancesInfoDialog from './PreviousInstancesDialog/PreviousInstancesInfoDialog.vue';
import PreviousInstancesUserDialog from './UserDialog/PreviousInstancesUserDialog.vue';
import PreviousInstancesWorldDialog from './PreviousInstancesDialog/PreviousInstancesWorldDialog.vue';
import UserDialog from './UserDialog/UserDialog.vue';
import WorldDialog from './WorldDialog/WorldDialog.vue';
const avatarStore = useAvatarStore();
const groupStore = useGroupStore();
@@ -137,6 +137,13 @@
}
});
const keepAliveInclude = [
'PreviousInstancesInfoDialog',
'PreviousInstancesUserDialog',
'PreviousInstancesWorldDialog',
'PreviousInstancesGroupDialog'
];
const shouldShowBreadcrumbs = computed(() => dialogCrumbs.value.length > 1);
const shouldCollapseBreadcrumbs = computed(() => dialogCrumbs.value.length > 5);
const middleBreadcrumbs = computed(() => {
@@ -267,7 +274,9 @@
</BreadcrumbList>
</Breadcrumb>
<component :is="activeComponent" v-if="activeComponent" />
<KeepAlive :include="keepAliveInclude">
<component :is="activeComponent" v-if="activeComponent" />
</KeepAlive>
</DialogContent>
</Dialog>
</template>

View File

@@ -27,8 +27,10 @@
</template>
<script setup>
import { DialogHeader, DialogTitle } from '@/components/ui/dialog';
defineOptions({ name: 'PreviousInstancesGroupDialog' });
import { computed, ref, watch } from 'vue';
import { DialogHeader, DialogTitle } from '@/components/ui/dialog';
import { InputGroupField } from '@/components/ui/input-group';
import { storeToRefs } from 'pinia';
import { useI18n } from 'vue-i18n';
@@ -59,10 +61,10 @@
const vrcxStore = useVrcxStore();
const rawRows = ref([]);
const search = ref('');
const pageSizes = [10, 25, 50, 100];
const pageSize = ref(10);
const tableStyle = { maxHeight: '400px' };
const search = ref('');
const displayRows = computed(() => {
const q = String(search.value ?? '')
@@ -97,6 +99,9 @@
initialPagination: {
pageIndex: 0,
pageSize: pageSize.value
},
tableOptions: {
autoResetPageIndex: false
}
});

View File

@@ -27,8 +27,10 @@
</template>
<script setup>
import { DialogHeader, DialogTitle } from '@/components/ui/dialog';
defineOptions({ name: 'PreviousInstancesInfoDialog' });
import { computed, nextTick, ref, watch } from 'vue';
import { DialogHeader, DialogTitle } from '@/components/ui/dialog';
import { storeToRefs } from 'pinia';
import { useI18n } from 'vue-i18n';
@@ -48,7 +50,6 @@
const loading = ref(false);
const rawRows = ref([]);
const search = ref('');
const pageSizes = [10, 25, 50, 100];
const pageSize = ref(10);
const tableStyle = { maxHeight: '400px' };
@@ -80,6 +81,7 @@
const { stringComparer } = storeToRefs(useSearchStore());
const vrcxStore = useVrcxStore();
const search = ref('');
const displayRows = computed(() => {
const q = String(search.value ?? '')
@@ -105,6 +107,9 @@
initialPagination: {
pageIndex: 0,
pageSize: pageSize.value
},
tableOptions: {
autoResetPageIndex: false
}
});
@@ -161,5 +166,4 @@
loading.value = false;
});
}
</script>

View File

@@ -28,8 +28,10 @@
</template>
<script setup>
import { DialogHeader, DialogTitle } from '@/components/ui/dialog';
defineOptions({ name: 'PreviousInstancesWorldDialog' });
import { computed, ref, watch } from 'vue';
import { DialogHeader, DialogTitle } from '@/components/ui/dialog';
import { InputGroupField } from '@/components/ui/input-group';
import { storeToRefs } from 'pinia';
import { useI18n } from 'vue-i18n';
@@ -67,11 +69,11 @@
const vrcxStore = useVrcxStore();
const rawRows = ref([]);
const search = ref('');
const pageSizes = [10, 25, 50, 100];
const pageSize = ref(10);
const tableStyle = { maxHeight: '400px' };
const loading = ref(false);
const search = ref('');
const displayRows = computed(() => {
const q = String(search.value ?? '')
@@ -108,6 +110,9 @@
initialPagination: {
pageIndex: 0,
pageSize: pageSize.value
},
tableOptions: {
autoResetPageIndex: false
}
});

View File

@@ -28,8 +28,10 @@
</template>
<script setup>
import { DialogHeader, DialogTitle } from '@/components/ui/dialog';
defineOptions({ name: 'PreviousInstancesUserDialog' });
import { computed, ref, watch } from 'vue';
import { DialogHeader, DialogTitle } from '@/components/ui/dialog';
import { InputGroupField } from '@/components/ui/input-group';
import { storeToRefs } from 'pinia';
import { useI18n } from 'vue-i18n';
@@ -57,7 +59,6 @@
const modalStore = useModalStore();
const loading = ref(false);
const rawRows = ref([]);
const search = ref('');
const pageSizes = [10, 25, 50, 100];
const pageSize = ref(10);
const tableStyle = { maxHeight: '400px' };
@@ -70,6 +71,7 @@
const { stringComparer } = storeToRefs(useSearchStore());
const vrcxStore = useVrcxStore();
const { t } = useI18n();
const search = ref('');
const displayRows = computed(() => {
const q = String(search.value ?? '')
@@ -105,6 +107,9 @@
initialPagination: {
pageIndex: 0,
pageSize: pageSize.value
},
tableOptions: {
autoResetPageIndex: false
}
});