feat: add association category setting

assets/association.type.options.js

@@ -0,0 +1,37 @@
+export const AssociationTypeOptions = [
+  { key: 'executive', text: '집행기구', value: 'executive' },
+  { key: 'autonomous', text: '자치기구', value: 'autonomous' },
+  { key: 'media', text: '언론기구', value: 'media' },
+  { key: 'specialized', text: '전문기구', value: 'specialized' },
+];
+
+export const AssociationTypeDisplayName = {
+  executive: '집행기구',
+  autonomous: '자치기구',
+  media: '언론기구',
+  specialized: '전문기구',
+  집행기구: '집행기구',
+  자치기구: '자치기구',
+  언론기구: '언론기구',
+  전문기구: '전문기구',
+};
+
+export function getAssociationTypeValue(associationType) {
+  if (!associationType) {
+    return '';
+  }
+
+  const associationTypeEntry = Object.entries(AssociationTypeDisplayName).find(
+    ([key, value]) => key === associationType || value === associationType,
+  );
+
+  return associationTypeEntry ? associationTypeEntry[0] : '';
+}
+
+export function getAssociationTypeDisplayName(associationType) {
+  if (!associationType) {
+    return '-';
+  }
+
+  return AssociationTypeDisplayName[associationType] ?? associationType;
+}

components/introduce/association.table.jsx

@@ -1,6 +1,7 @@
 import moment from 'moment';
 import Link from 'next/link';
 import { Icon, Table } from 'semantic-ui-react';
+import { getAssociationTypeDisplayName } from '@/assets/association.type.options';
 
 const AssociationTable = (props) => {
   const associations = props.associations;
@@ -11,6 +12,7 @@ const AssociationTable = (props) => {
         <Table.Row>
           <Table.HeaderCell>idx.</Table.HeaderCell>
           <Table.HeaderCell>단체명</Table.HeaderCell>
+          <Table.HeaderCell>분류</Table.HeaderCell>
           <Table.HeaderCell>위치</Table.HeaderCell>
           <Table.HeaderCell>단체장</Table.HeaderCell>
           <Table.HeaderCell>연락처</Table.HeaderCell>
@@ -24,6 +26,9 @@ const AssociationTable = (props) => {
           <Table.Row key={association.uuid}>
             <Table.Cell>{idx + 1}</Table.Cell>
             <Table.Cell>{association.name}</Table.Cell>
+            <Table.Cell>
+              {getAssociationTypeDisplayName(association.associationType)}
+            </Table.Cell>
             <Table.Cell>{association.location}</Table.Cell>
             <Table.Cell>{association.representative}</Table.Cell>
             <Table.Cell>{association.contact}</Table.Cell>

pages/introduce/association/create.jsx

@@ -4,19 +4,27 @@ import { Form, Message } from 'semantic-ui-react';
 
 import { PoPoAxios } from '@/utils/axios.instance';
 import IntroduceLayout from '@/components/introduce/introduce.layout';
+import { AssociationTypeOptions } from '@/assets/association.type.options';
 
 const AssociationIntroduceCreatePage = () => {
   const router = useRouter();
 
   const [name, setName] = useState('');
+  const [associationType, setAssociationType] = useState('');
   const [content, setContent] = useState('');
   const [location, setLocation] = useState('');
   const [representative, setRepresentative] = useState('');
   const [contact, setContact] = useState('');
 
   async function handleSubmit() {
+    if (!associationType) {
+      alert('자치단체 분류를 선택해주세요.');
+      return;
+    }
+
     const body = {
       name: name,
+      associationType: associationType,
       content: content,
       location: location,
       representative: representative,
@@ -44,6 +52,13 @@ const AssociationIntroduceCreatePage = () => {
           label={'자치단체 이름'}
           onChange={(e) => setName(e.target.value)}
         />
+        <Form.Select
+          required
+          label={'자치단체 분류'}
+          options={AssociationTypeOptions}
+          placeholder={'자치단체 분류를 선택하세요.'}
+          onChange={(e, { value }) => setAssociationType(value)}
+        />
         <Form.TextArea
           required
           label={'소개글'}

pages/introduce/association/update/[uuid].jsx

@@ -6,12 +6,19 @@ import { PoPoAxios } from '@/utils/axios.instance';
 import IntroduceLayout from '@/components/introduce/introduce.layout';
 import DeleteConfirmModal from '@/components/common/delete.confirm.modal';
 import ImageUploadForm from '@/components/common/image-upload.form';
+import {
+  AssociationTypeOptions,
+  getAssociationTypeValue,
+} from '@/assets/association.type.options';
 
 const AssociationUpdatePage = ({ associationInfo }) => {
   const router = useRouter();
   const [deleteModalOpen, setDeleteModalOpen] = useState(false);
 
   const [name, setName] = useState(associationInfo.name);
+  const [associationType, setAssociationType] = useState(
+    getAssociationTypeValue(associationInfo.associationType),
+  );
   const [content, setContent] = useState(associationInfo.content);
   const [location, setLocation] = useState(associationInfo.location);
   const [representative, setRepresentative] = useState(
@@ -25,8 +32,14 @@ const AssociationUpdatePage = ({ associationInfo }) => {
   );
 
   async function handleSubmit() {
+    if (!associationType) {
+      alert('자치단체 분류를 선택해주세요.');
+      return;
+    }
+
     const body = {
       name: name,
+      associationType: associationType,
       content: content,
       location: location,
       representative: representative,
@@ -59,6 +72,14 @@ const AssociationUpdatePage = ({ associationInfo }) => {
             onChange={(e) => setName(e.target.value)}
           />
         </Form.Group>
+        <Form.Select
+          required
+          label={'자치단체 분류'}
+          options={AssociationTypeOptions}
+          placeholder={'자치단체 분류를 선택하세요.'}
+          value={associationType}
+          onChange={(e, { value }) => setAssociationType(value)}
+        />
         <Form.TextArea
           required
           label={'소개글'}