/admin/content/list 페이징 처리와 검색 조건 기능 추가

nuxt/components/common/DefaultSelectCode.vue

@@ -0,0 +1,40 @@
+<script setup lang="ts">
+import type { GridCodeType } from '~/types';
+
+const value = defineModel<string>({ default: '' });
+
+const props = defineProps<{
+  options: GridCodeType[];
+  className?: string;
+  selectType?: 'SELECT' | 'ALL';
+  isLoading?: boolean;
+}>();
+
+const selectOptions = computed(() => {
+  if (props.selectType === 'REQUIRED') {
+    return [{ label: '선택', value: '' }, ...props.options];
+  }
+
+  if (props.selectType === 'ALL') {
+    return [{ label: '전체', value: '' }, ...props.options];
+  }
+
+  return props.options;
+});
+
+const emit = defineEmits(['change']);
+
+const change = () => {
+  emit('change');
+};
+</script>
+
+<template>
+  <a-select
+    :class="className"
+    :options="selectOptions"
+    :loading="isLoading"
+    v-model:value="value"
+    @change="change"
+  />
+</template>

nuxt/components/common/InstCodeSelect.vue

@@ -0,0 +1,29 @@
+<script setup lang="ts">
+const props = defineProps<{
+  className?: string;
+  selectType?: 'SELECT' | 'ALL';
+}>();
+
+const commonCodeStore = useCommonCodeStore();
+const value = defineModel<string>('');
+
+const { data, isLoading } = useQuery({
+  queryKey: ['INST_CODE_LIST'],
+  queryFn: async () => {
+    return await commonCodeStore.searchInstCodeList();
+  },
+  staleTime: 60 * 1000,
+  refetchOnWindowFocus: false,
+  refetchOnMount: false
+});
+</script>
+
+<template>
+  <common-default-select-code
+    v-if="!isLoading"
+    :class-name="className"
+    :select-type="selectType"
+    :options="data"
+    v-model="value"
+  />
+</template>