Merge pull request 'test' (#11) from test into main

Reviewed-on: #11

package-lock.json

@@ -11,7 +11,6 @@
         "core-js": "^3.6.5",
         "vue": "^2.6.11",
         "vue-router": "^3.2.0",
-        "vue-show-more-text": "^2.0.2",
         "vue2-datepicker": "^3.11.1",
         "vue2-editor": "^2.10.3",
         "vue2-timepicker": "^1.1.6",
@@ -14489,15 +14488,6 @@
       "resolved": "https://registry.npmjs.org/vue-router/-/vue-router-3.5.3.tgz",
       "integrity": "sha512-FUlILrW3DGitS2h+Xaw8aRNvGTwtuaxrRkNSHWTizOfLUie7wuYwezeZ50iflRn8YPV5kxmU2LQuu3nM/b3Zsg=="
     },
-    "node_modules/vue-show-more-text": {
-      "version": "2.0.2",
-      "resolved": "https://registry.npmjs.org/vue-show-more-text/-/vue-show-more-text-2.0.2.tgz",
-      "integrity": "sha512-x/WuikWAx8Hm4gpZx6KHtJYiXDordGdSoXrd34lTiJeAnlT8Y7Yc0FfGBNdUv6mXncuET3LiRwwNz+X5gI+oiw==",
-      "dependencies": {
-        "core-js": "^3.6.5",
-        "vue": "^2.6.11"
-      }
-    },
     "node_modules/vue-style-loader": {
       "version": "4.1.3",
       "resolved": "https://registry.npmjs.org/vue-style-loader/-/vue-style-loader-4.1.3.tgz",
@@ -27262,15 +27252,6 @@
       "resolved": "https://registry.npmjs.org/vue-router/-/vue-router-3.5.3.tgz",
       "integrity": "sha512-FUlILrW3DGitS2h+Xaw8aRNvGTwtuaxrRkNSHWTizOfLUie7wuYwezeZ50iflRn8YPV5kxmU2LQuu3nM/b3Zsg=="
     },
-    "vue-show-more-text": {
-      "version": "2.0.2",
-      "resolved": "https://registry.npmjs.org/vue-show-more-text/-/vue-show-more-text-2.0.2.tgz",
-      "integrity": "sha512-x/WuikWAx8Hm4gpZx6KHtJYiXDordGdSoXrd34lTiJeAnlT8Y7Yc0FfGBNdUv6mXncuET3LiRwwNz+X5gI+oiw==",
-      "requires": {
-        "core-js": "^3.6.5",
-        "vue": "^2.6.11"
-      }
-    },
     "vue-style-loader": {
       "version": "4.1.3",
       "resolved": "https://registry.npmjs.org/vue-style-loader/-/vue-style-loader-4.1.3.tgz",

package.json

@@ -13,7 +13,6 @@
     "core-js": "^3.6.5",
     "vue": "^2.6.11",
     "vue-router": "^3.2.0",
-    "vue-show-more-text": "^2.0.2",
     "vue2-datepicker": "^3.11.1",
     "vue2-editor": "^2.10.3",
     "vue2-timepicker": "^1.1.6",

public/index.html

@@ -5,7 +5,7 @@
     <meta http-equiv="X-UA-Compatible" content="IE=edge">
     <meta name="viewport" content="width=device-width,initial-scale=1.0">
     <link rel="icon" href="<%= BASE_URL %>favicon.ico">
-    <title>보이스온 크리에이터 관리자</title>
+    <title>소다라이브</title>
     <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Roboto:100,300,400,500,700,900">
     <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@mdi/font@latest/css/materialdesignicons.min.css">
   </head>

src/App.vue

@@ -7,7 +7,7 @@
       dark
     >
       <v-spacer />
-      <v-toolbar-title>보이스온 크리에이터 관리자</v-toolbar-title>
+      <v-toolbar-title>소다라이브 크리에이터</v-toolbar-title>
       <v-spacer />
     </v-app-bar>
 
@@ -38,13 +38,4 @@
     }
   }
 }
-
-.noscroll {
-  overflow-y: hidden;
-}
-
-.noscroll::-webkit-scrollbar {
-  overflow-y: hidden;
-  display: none;
-}
 </style>

src/api/audio_content_series.js

@@ -1,76 +0,0 @@
-import Vue from 'vue';
-
-async function getGenreList() {
-    return Vue.axios.get("/creator-admin/audio-content/series/genre");
-}
-
-async function getSeriesList(page) {
-    return Vue.axios.get("/creator-admin/audio-content/series?page=" + (page - 1) + "&size=20");
-}
-
-async function createSeries(formData) {
-    return Vue.axios.post("/creator-admin/audio-content/series", formData, {
-        headers: {
-            "Content-Type": "multipart/form-data",
-        },
-    });
-}
-
-async function modifySeries(formData) {
-    return Vue.axios.put("/creator-admin/audio-content/series", formData, {
-        headers: {
-            "Content-Type": "multipart/form-data",
-        },
-    });
-}
-
-async function getSeriesDetail(seriesId) {
-    return Vue.axios.get("/creator-admin/audio-content/series/" + seriesId);
-}
-
-async function getSeriesContent(seriesId, page) {
-    return Vue.axios.get(
-        "/creator-admin/audio-content/series/" + seriesId + "/content?page=" + (page - 1) + "&size=10"
-    );
-}
-
-async function searchContentNotInSeries(seriesId, searchWord) {
-    return Vue.axios.get(
-        "/creator-admin/audio-content/series/content/search?series_id=" + seriesId +
-        "&search_word=" + searchWord
-    )
-}
-
-async function addingContentToTheSeries(seriesId, contentIdList) {
-    return Vue.axios.post(
-        "/creator-admin/audio-content/series/add/content",
-        {seriesId: seriesId, contentIdList: contentIdList}
-    )
-}
-
-async function removeContentInTheSeries(seriesId, contentId) {
-    return Vue.axios.put(
-        "/creator-admin/audio-content/series/remove/content",
-        {seriesId: seriesId, contentId: contentId}
-    )
-}
-
-async function updateSeriesOrders(ids) {
-    return Vue.axios.put(
-        "/creator-admin/audio-content/series/orders",
-        {ids: ids}
-    )
-}
-
-export {
-    getGenreList,
-    getSeriesList,
-    createSeries,
-    modifySeries,
-    getSeriesDetail,
-    getSeriesContent,
-    updateSeriesOrders,
-    addingContentToTheSeries,
-    removeContentInTheSeries,
-    searchContentNotInSeries
-}

src/api/calculate.js

@@ -22,17 +22,4 @@ async function getCalculateContentDonation(startDate, endDate, page, size) {
     );
 }
 
-async function getCalculateCommunityPost(startDate, endDate, page, size) {
+export {getCalculateLive, getCalculateContent, getCumulativeSalesByContent, getCalculateContentDonation}
-    return Vue.axios.get(
-        '/creator-admin/calculate/community-post?startDateStr=' +
-        startDate + '&endDateStr=' + endDate + "&page=" + (page - 1) + "&size=" + size
-    );
-}
-
-export {
-    getCalculateLive,
-    getCalculateContent,
-    getCumulativeSalesByContent,
-    getCalculateContentDonation,
-    getCalculateCommunityPost
-}

src/api/signature.js

@@ -1,23 +0,0 @@
-import Vue from 'vue'
-
-async function getSignatureList(page, sort) {
-    return Vue.axios.get('/creator-admin/signature?page=' + (page - 1) + "&size=20" + "&sort-type=" + sort);
-}
-
-async function createSignature(formData) {
-    return Vue.axios.post('/creator-admin/signature', formData, {
-        headers: {
-            "Content-Type": "multipart/form-data",
-        },
-    });
-}
-
-async function modifySignature(formData) {
-    return Vue.axios.put('/creator-admin/signature', formData, {
-        headers: {
-            "Content-Type": "multipart/form-data",
-        },
-    });
-}
-
-export { getSignatureList, createSignature, modifySignature }

src/components/SideMenu.vue

@@ -20,10 +20,11 @@
             :to="item.route"
             active-class="blue white--text"
           >
-            <v-list-item-title>{{ item.title }}</v-list-item-title>
             <v-list-item-icon>
-              <v-icon>mdi-chevron-right</v-icon>
+              <v-icon>{{ item.icon }}</v-icon>
             </v-list-item-icon>
+
+            <v-list-item-title>{{ item.title }}</v-list-item-title>
           </v-list-item>
         </div>
 

src/router/index.js

@@ -25,16 +25,6 @@ const routes = [
                 name: 'ContentCategoryList',
                 component: () => import(/* webpackChunkName: "content" */ '../views/Content/ContentCategoryList.vue')
             },
-            {
-                path: '/content/series/list',
-                name: 'ContentSeriesList',
-                component: () => import(/* webpackChunkName: "content" */ '../views/Content/ContentSeriesList.vue')
-            },
-            {
-                path: '/content/series/detail',
-                name: 'ContentSeriesDetail',
-                component: () => import(/* webpackChunkName: "content" */ '../views/Content/ContentSeriesDetail.vue')
-            },
             {
                 path: '/calculate/live',
                 name: 'CalculateLive',
@@ -55,16 +45,6 @@ const routes = [
                 name: 'CalculateContentDonation',
                 component: () => import(/* webpackChunkName: "calculate" */ '../views/Calculate/CalculateContentDonation.vue')
             },
-            {
-                path: '/calculate/community-post',
-                name: 'CalculateCommunityPost',
-                component: () => import(/* webpackChunkName: "calculate" */ '../views/Calculate/CalculateCommunityPost.vue')
-            },
-            {
-                path: '/signature',
-                name: 'SignatureManagement',
-                component: () => import(/* webpackChunkName: "signature" */ '../views/Signature/SignatureManagement.vue')
-            }
         ]
     },
     {
@@ -82,12 +62,6 @@ const router = new VueRouter({
 
 router.beforeEach((to, from, next) => {
     if (to.path !== '/login') {
-        if (to.path === '/content/series/list') {
-            document.documentElement.classList.add('noscroll'); // html에 클래스 추가
-        } else {
-            document.documentElement.classList.remove('noscroll');
-        }
-
         const isAuthenticated = store.getters['accountStore/isAuthenticated']
         if (isAuthenticated) {
             next();

src/views/Calculate/CalculateCommunityPost.vue

@@ -1,261 +0,0 @@
-<template>
-  <div>
-    <v-toolbar dark>
-      <v-spacer />
-      <v-toolbar-title>커뮤니티 정산</v-toolbar-title>
-      <v-spacer />
-    </v-toolbar>
-
-    <br>
-
-    <v-container>
-      <v-row>
-        <v-col cols="2">
-          <datetime
-            v-model="start_date"
-            class="datepicker"
-            format="YYYY-MM-DD"
-          />
-        </v-col>
-
-        <v-col cols="1">
-          ~
-        </v-col>
-
-        <v-col cols="2">
-          <datetime
-            v-model="end_date"
-            class="datepicker"
-            format="YYYY-MM-DD"
-          />
-        </v-col>
-
-        <v-col cols="1" />
-
-        <v-col cols="2">
-          <v-btn
-            block
-            color="#9970ff"
-            dark
-            depressed
-            @click="getCalculateCommunityPost"
-          >
-            조회
-          </v-btn>
-        </v-col>
-        <v-spacer />
-      </v-row>
-      <v-row>
-        <v-col>
-          <v-data-table
-            :headers="headers"
-            :items="items"
-            :loading="is_loading"
-            :items-per-page="-1"
-            class="elevation-1"
-            hide-default-footer
-          >
-            <template slot="body.prepend">
-              <tr>
-                <td colspan="4">
-                  합계
-                </td>
-                <td>{{ sumField('totalCan').toLocaleString() }} 캔</td>
-                <td>{{ sumField('totalKrw').toLocaleString() }} 원</td>
-                <td>{{ sumField('paymentFee').toLocaleString() }} 원</td>
-                <td>{{ sumField('settlementAmount').toLocaleString() }} 원</td>
-                <td>{{ sumField('tax').toLocaleString() }} 원</td>
-                <td>{{ sumField('depositAmount').toLocaleString() }} 원</td>
-              </tr>
-            </template>
-
-            <template v-slot:item.title="{ item }">
-              {{ item.title }}...
-            </template>
-
-            <template v-slot:item.totalCan="{ item }">
-              {{ item.totalCan.toLocaleString() }} 캔
-            </template>
-
-            <template v-slot:item.totalKrw="{ item }">
-              {{ item.totalKrw.toLocaleString() }} 원
-            </template>
-
-            <template v-slot:item.paymentFee="{ item }">
-              {{ item.paymentFee.toLocaleString() }} 원
-            </template>
-
-            <template v-slot:item.settlementAmount="{ item }">
-              {{ item.settlementAmount.toLocaleString() }} 원
-            </template>
-
-            <template v-slot:item.tax="{ item }">
-              {{ item.tax.toLocaleString() }} 원
-            </template>
-
-            <template v-slot:item.depositAmount="{ item }">
-              {{ item.depositAmount.toLocaleString() }} 원
-            </template>
-          </v-data-table>
-        </v-col>
-      </v-row>
-      <v-row class="text-center">
-        <v-col>
-          <v-pagination
-            v-model="page"
-            :length="total_page"
-            circle
-            @input="next"
-          />
-        </v-col>
-      </v-row>
-    </v-container>
-  </div>
-</template>
-
-<script>
-import datetime from "vuejs-datetimepicker";
-import * as api from "@/api/calculate";
-
-export default {
-  name: "CalculateCommunityPost",
-  components: {datetime},
-
-  data() {
-    return {
-      is_loading: false,
-      start_date: null,
-      end_date: null,
-      page: 1,
-      page_size: 20,
-      total_page: 0,
-      items: [],
-      headers: [
-        {
-          text: '날짜',
-          align: 'center',
-          sortable: false,
-          value: 'date',
-        },
-        {
-          text: '내용(앞 10글자)',
-          sortable: false,
-          value: 'title',
-          align: 'center',
-          width: "300px"
-        },
-        {
-          text: '판매금액(캔)',
-          align: 'center',
-          sortable: false,
-          value: 'can',
-        },
-        {
-          text: '구매유저수',
-          align: 'center',
-          sortable: false,
-          value: 'numberOfPurchase',
-        },
-        {
-          text: '합계(캔)',
-          align: 'center',
-          sortable: false,
-          value: 'totalCan',
-        },
-        {
-          text: '원화',
-          align: 'center',
-          sortable: false,
-          value: 'totalKrw',
-        },
-        {
-          text: '수수료\n(6.6%)',
-          align: 'center',
-          sortable: false,
-          value: 'paymentFee',
-        },
-        {
-          text: '정산금액',
-          align: 'center',
-          sortable: false,
-          value: 'settlementAmount',
-        },
-        {
-          text: '원천세\n(3.3%)',
-          align: 'center',
-          sortable: false,
-          value: 'tax',
-        },
-        {
-          text: '입금액',
-          align: 'center',
-          sortable: false,
-          value: 'depositAmount',
-        }
-      ],
-    }
-  },
-
-  async created() {
-    const date = new Date();
-    const firstDate = new Date(date.getFullYear(), date.getMonth(), 1);
-    const lastDate = new Date(date.getFullYear(), date.getMonth() + 1, 0);
-
-    let firstDateMonth = (firstDate.getMonth() + 1).toString()
-    if (firstDateMonth.length < 2) {
-      firstDateMonth = '0' + firstDateMonth
-    }
-
-
-    let lastDateMonth = (lastDate.getMonth() + 1).toString()
-    if (lastDateMonth.length < 2) {
-      lastDateMonth = '0' + lastDateMonth
-    }
-
-    this.start_date = firstDate.getFullYear() + '-' + firstDateMonth + '-0' + firstDate.getDate()
-    this.end_date = lastDate.getFullYear() + '-' + lastDateMonth + '-' + lastDate.getDate()
-
-    await this.getCalculateCommunityPost();
-  },
-
-  methods: {
-    notifyError(message) {
-      this.$dialog.notify.error(message)
-    },
-
-    sumField(key) {
-      return this.items.reduce((a, b) => a + (b[key] || 0), 0)
-    },
-
-    async next() {
-      await this.getCalculateCommunityPost()
-    },
-
-    async getCalculateCommunityPost() {
-      this.is_loading = true
-
-      try {
-        const res = await api.getCalculateCommunityPost(this.start_date, this.end_date, this.page, this.page_size)
-        if (res.status === 200 && res.data.success === true) {
-          const data = res.data.data
-
-          const totalPage = Math.ceil(data.totalCount / this.page_size)
-          this.items = data.items
-
-          if (totalPage <= 0)
-            this.total_page = 1
-          else
-            this.total_page = totalPage
-        } else {
-          this.notifyError(res.data.message || '알 수 없는 오류가 발생했습니다. 다시 시도해 주세요.')
-        }
-
-        this.is_loading = false
-      } catch (e) {
-        this.notifyError('알 수 없는 오류가 발생했습니다. 다시 시도해 주세요.')
-        this.is_loading = false
-      }
-    }
-  }
-}
-</script>

src/views/Content/ContentCategoryList.vue

@@ -339,6 +339,33 @@ export default {
 
       page: 1,
       total_page: 0,
+
+      headers: [
+        {
+          text: '커버이미지',
+          align: 'center',
+          sortable: false,
+          value: 'image',
+        },
+        {
+          text: '제목',
+          align: 'center',
+          sortable: false,
+          value: 'title',
+        },
+        {
+          text: '19금',
+          align: 'center',
+          sortable: false,
+          value: 'isAdult',
+        },
+        {
+          text: '관리',
+          align: 'center',
+          sortable: false,
+          value: 'management'
+        },
+      ]
     }
   },
 

src/views/Content/ContentList.vue

@@ -14,7 +14,7 @@
         <v-col>
           <v-btn
             block
-            color="#3bb9f1"
+            color="#9970ff"
             dark
             depressed
             @click="showWriteDialog"
@@ -50,9 +50,6 @@
                   <th class="text-center">
                     가격
                   </th>
-                  <th class="text-center">
-                    한정판
-                  </th>
                   <th class="text-center">
                     19금
                   </th>
@@ -100,21 +97,6 @@
                   <td v-else>
                     무료
                   </td>
-                  <td
-                    v-if="item.totalContentCount > 0 && item.remainingContentCount > 0"
-                    style="min-width: 100px !important; word-break:break-all; height: auto;"
-                  >
-                    {{ item.totalContentCount - item.remainingContentCount }} / {{ item.totalContentCount }}
-                  </td>
-                  <td
-                    v-else-if="item.totalContentCount > 0 && item.remainingContentCount <= 0"
-                    style="min-width: 100px !important; word-break:break-all; height: auto;"
-                  >
-                    Sold Out
-                  </td>
-                  <td v-else>
-                    X
-                  </td>
                   <td>
                     <div v-if="item.isAdult">
                       O
@@ -227,34 +209,6 @@
               </v-col>
             </v-row>
           </v-card-text>
-          <v-card-text>
-            <v-row align="center">
-              <v-col cols="4">
-                태그
-              </v-col>
-              <v-col cols="8">
-                <v-text-field
-                  v-model="audio_content.tags"
-                  label="예 : #연애 #커버곡 #태그"
-                  required
-                />
-              </v-col>
-            </v-row>
-          </v-card-text>
-          <v-card-text>
-            <v-row align="center">
-              <v-col cols="4">
-                가격
-              </v-col>
-              <v-col cols="8">
-                <v-text-field
-                  v-model="audio_content.price"
-                  label="가격"
-                  required
-                />
-              </v-col>
-            </v-row>
-          </v-card-text>
           <v-card-text>
             <v-row>
               <v-col cols="4">
@@ -287,22 +241,6 @@
               </v-col>
             </v-row>
           </v-card-text>
-          <v-card-text>
-            <v-row>
-              <v-col cols="4">
-                포인트 사용 가능
-              </v-col>
-              <v-col
-                cols="8"
-                align="left"
-              >
-                <input
-                  v-model="audio_content.is_point_available"
-                  type="checkbox"
-                >
-              </v-col>
-            </v-row>
-          </v-card-text>
           <v-card-actions v-show="!is_loading">
             <v-spacer />
             <v-btn
@@ -433,7 +371,7 @@
               </v-col>
             </v-row>
           </v-card-text>
-          <v-card-text v-show="is_limited_edition === false">
+          <v-card-text>
             <v-row align="center">
               <v-col cols="4">
                 예약 공개
@@ -484,7 +422,7 @@
                   label="가격"
                   required
                 />
-                ※ 유료 콘텐츠 가격을 입력하면 해당 콘텐츠의 미리듣기 시간을 설정할 수 있습니다.<br>미리듣기 시간은 최소 15초 이상 설정해야 합니다.
+                ※ 유료 콘텐츠 가격을 입력하면 해당 콘텐츠의 미리듣기 시간을 설정할 수 있습니다.<br>미리듣기 시간은 최소 30초 이상 설정해야 합니다.
               </v-col>
             </v-row>
           </v-card-text>
@@ -531,87 +469,20 @@
             </v-row>
           </v-card-text>
           <v-card-text v-show="audio_content.price > 0">
-            <v-row align="center">
+            <v-row>
               <v-col cols="4">
-                한정판
+                대여만 가능
               </v-col>
               <v-col
                 cols="8"
                 align="left"
               >
                 <input
-                  v-model="is_limited_edition"
+                  v-model="audio_content.is_only_rental"
                   type="checkbox"
                 >
               </v-col>
             </v-row>
-            <v-row
-              v-if="is_limited_edition"
-              align="center"
-            >
-              <v-col cols="4">
-                판매할 콘텐츠 개수
-              </v-col>
-              <v-col
-                cols="8"
-                align="left"
-              >
-                <v-text-field
-                  v-model="audio_content.limited"
-                  label="판매할 콘텐츠 개수"
-                />
-              </v-col>
-            </v-row>
-          </v-card-text>
-          <v-card-text v-show="audio_content.price > 0 && is_limited_edition === false">
-            <v-row align="center">
-              <v-col cols="4">
-                소장 설정
-              </v-col>
-              <v-col cols="8">
-                <v-radio-group
-                  v-model="audio_content.purchase_option"
-                  row
-                >
-                  <v-radio
-                    value="BOTH"
-                    label="소장/대여"
-                  />
-                  <v-radio
-                    value="BUY_ONLY"
-                    label="소장만"
-                  />
-                  <v-radio
-                    value="RENT_ONLY"
-                    label="대여만"
-                  />
-                  <v-spacer />
-                </v-radio-group>
-              </v-col>
-            </v-row>
-          </v-card-text>
-          <v-card-text v-show="audio_content.price >= 50">
-            <v-row align="center">
-              <v-col cols="4">
-                콘텐츠 내용 전체 오픈 설정
-              </v-col>
-              <v-col cols="8">
-                <v-radio-group
-                  v-model="audio_content.is_full_detail_visible"
-                  row
-                >
-                  <v-radio
-                    :value="false"
-                    label="구매한 사람만"
-                  />
-                  <v-radio
-                    :value="true"
-                    label="전체"
-                  />
-                  <v-spacer />
-                </v-radio-group>
-              </v-col>
-            </v-row>
           </v-card-text>
           <v-card-text>
             <v-row>
@@ -645,22 +516,6 @@
               </v-col>
             </v-row>
           </v-card-text>
-          <v-card-text>
-            <v-row>
-              <v-col cols="4">
-                포인트 사용 가능
-              </v-col>
-              <v-col
-                cols="8"
-                align="left"
-              >
-                <input
-                  v-model="audio_content.is_point_available"
-                  type="checkbox"
-                >
-              </v-col>
-            </v-row>
-          </v-card-text>
           <v-card-actions v-show="!is_loading">
             <v-spacer />
             <v-btn
@@ -711,6 +566,20 @@
         </v-card-actions>
       </v-card>
     </v-dialog>
+
+    <v-dialog
+      v-model="is_loading"
+      max-width="400px"
+      persistent
+    >
+      <v-card>
+        <v-card-text>
+          <v-progress-circular
+            indeterminate
+          />
+        </v-card-text>
+      </v-card>
+    </v-dialog>
   </div>
 </template>
 
@@ -734,7 +603,6 @@ export default {
     return {
       is_loading: false,
       is_active_reservation: false,
-      is_limited_edition: false,
       reservation_date: '',
       reservation_time: '',
       show_create_dialog: false,
@@ -746,15 +614,15 @@ export default {
       audio_content: {
         price: 0,
         is_adult: false,
-        is_point_available: false,
+        is_generate_preview: true,
-        is_generate_preview: false,
         is_comment_available: true,
-        is_full_detail_visible: true,
-        purchase_option: 'BOTH',
       },
       audio_contents: [],
       themeList: [],
       selected_audio_content: {},
+      utm_source: '',
+      utm_medium: '',
+      utm_campaign: '',
     }
   },
 
@@ -793,12 +661,9 @@ export default {
       this.audio_content.id = item.audioContentId
       this.audio_content.title = item.title
       this.audio_content.detail = item.detail
-      this.audio_content.price = item.price
       this.audio_content.is_adult = item.isAdult
-      this.audio_content.is_point_available = item.isPointAvailable
       this.audio_content.is_comment_available = item.isCommentAvailable
       this.audio_content.cover_image_url = item.coverImageUrl
-      this.audio_content.tags = item.tags
       this.show_modify_dialog = true
     },
 
@@ -807,15 +672,11 @@ export default {
       this.audio_content = {
         price: 0,
         is_adult: false,
-        is_point_available: false,
         is_comment_available: true,
-        is_full_detail_visible: true,
-        purchase_option: 'BOTH',
       }
       this.reservation_time = ''
       this.reservation_time = ''
       this.is_active_reservation = false
-      this.is_limited_edition = false
       this.show_create_dialog = false
       this.show_modify_dialog = false
       this.show_delete_confirm_dialog = false
@@ -894,16 +755,6 @@ export default {
         return
       }
 
-      if (this.is_limited_edition === true) {
-        if (isNaN(parseInt(this.audio_content.limited))) {
-          this.notifyError("한정판 개수는 숫자만 입력가능합니다.")
-          return
-        } else if (this.audio_content.limited < 1) {
-          this.notifyError("한정판 개수를 1 이상 입력해 주세요.")
-          return
-        }
-      }
-
       if (this.is_loading) return;
 
       this.is_loading = true
@@ -918,21 +769,11 @@ export default {
           themeId: this.audio_content.theme_id,
           isAdult: this.audio_content.is_adult,
           isGeneratePreview: this.audio_content.price > 0 ? this.audio_content.is_generate_preview : false,
-          purchaseOption: this.audio_content.purchase_option,
+          isOnlyRental: this.audio_content.is_only_rental,
-          isPointAvailable: this.audio_content.is_point_available,
+          isCommentAvailable: this.audio_content.is_comment_available
-          isCommentAvailable: this.audio_content.is_comment_available,
-          isFullDetailVisible: this.audio_content.is_full_detail_visible
         }
 
-        if (this.audio_content.limited > 0) {
+        if (this.is_active_reservation === true) {
-          request.purchaseOption = 'BUY_ONLY'
-        }
-
-        if (this.audio_content.price > 0 && this.is_limited_edition === true) {
-          request.limited = this.audio_content.limited
-        }
-
-        if (this.is_limited_edition === false && this.is_active_reservation === true) {
           if (this.reservation_date.trim() === '' || this.reservation_time.trim() === '') {
             this.notifyError("오픈 예정 날짜와 시간을 선택해 주세요.")
             this.is_loading = false
@@ -957,7 +798,7 @@ export default {
             !this.isValidTimeFormat(previewStartTime) ||
             !this.isValidTimeFormat(previewEndTime)
           ) {
-            this.notifyError("미리 듣기 시간 형식은 00:00:15 과 같아야 합니다")
+            this.notifyError("미리 듣기 시간 형식은 00:30:00 과 같아야 합니다")
             this.is_loading = false
             return
           }
@@ -969,8 +810,8 @@ export default {
           const totalSeconds2 = h2 * 3600 + m2 * 60 + s2;
           const timeDifference = totalSeconds2 - totalSeconds1;
 
-          if (timeDifference < 15) {
+          if (timeDifference < 30) {
-            this.notifyError("미리 듣기의 최소 시간은 15초 입니다.")
+            this.notifyError("미리 듣기의 최소 시간은 30초 입니다.")
             this.is_loading = false
             return
           }
@@ -1061,22 +902,10 @@ export default {
           request.isAdult = this.audio_content.is_adult
         }
 
-        if (this.selected_audio_content.isPointAvailable !== this.audio_content.is_point_available) {
-          request.isPointAvailable = this.audio_content.is_point_available
-        }
-
         if (this.selected_audio_content.isCommentAvailable !== this.audio_content.is_comment_available) {
           request.isCommentAvailable = this.audio_content.is_comment_available
         }
 
-        if (this.audio_content.price !== this.selected_audio_content.price) {
-          request.price = this.audio_content.price
-        }
-
-        if (this.audio_content.tags !== this.selected_audio_content.tags) {
-          request.tags = this.audio_content.tags
-        }
-
         if (this.audio_content.cover_image !== null) {
           formData.append("coverImage", this.audio_content.cover_image)
         }

src/views/Content/ContentSeriesDetail.vue

@@ -1,517 +0,0 @@
-<template>
-  <div>
-    <v-container>
-      <v-row>
-        <v-col cols="4">
-          <v-card>
-            <v-img
-              :src="series_detail.coverImageUrl"
-              class="cover-image"
-            />
-            <v-card-text>
-              제목 : {{ series_detail.title }}
-            </v-card-text>
-            <v-card-text>
-              소개 :
-              <vue-show-more-text
-                :text="series_detail.introduction"
-                :lines="2"
-              />
-            </v-card-text>
-            <v-card-text>
-              연재요일 : {{ series_detail.publishedDaysOfWeek }}
-            </v-card-text>
-            <v-card-text>
-              장르 : {{ series_detail.genre }}
-            </v-card-text>
-            <v-card-text>
-              키워드 : {{ series_detail.keywords }}
-            </v-card-text>
-            <v-card-text>
-              연령제한 : <span v-if="series_detail.isAdult">19세이상</span><span v-else>전체이용가</span>
-            </v-card-text>
-            <v-card-text>
-              완결여부 : {{ series_detail.state }}
-            </v-card-text>
-            <v-card-text v-show="series_detail.writer !== undefined && series_detail.writer !== null">
-              작가 : {{ series_detail.writer }}
-            </v-card-text>
-            <v-card-text v-show="series_detail.studio !== undefined && series_detail.studio !== null">
-              제작사 : {{ series_detail.studio }}
-            </v-card-text>
-          </v-card>
-        </v-col>
-        <v-col cols="8">
-          <v-row>
-            <v-col cols="8" />
-            <v-col cols="4">
-              <v-btn
-                block
-                color="#3bb9f1"
-                dark
-                depressed
-                @click="showAddContent"
-              >
-                콘텐츠 추가
-              </v-btn>
-            </v-col>
-          </v-row>
-          <v-row>
-            <v-col v-if="series_content_list.length > 0">
-              <v-simple-table>
-                <template>
-                  <thead>
-                    <tr>
-                      <th class="text-center">
-                        썸네일
-                      </th>
-                      <th class="text-center">
-                        제목
-                      </th>
-                      <th class="text-center">
-                        19금
-                      </th>
-                      <th class="text-center">
-                        관리
-                      </th>
-                    </tr>
-                  </thead>
-                  <tbody>
-                    <tr
-                      v-for="content in series_content_list"
-                      :key="content.contentId"
-                    >
-                      <td align="center">
-                        <v-img
-                          :src="content.coverImage"
-                          max-width="100"
-                          class="content-cover-image"
-                        />
-                      </td>
-                      <td align="center">
-                        {{ content.title }}
-                      </td>
-                      <td align="center">
-                        <div v-if="content.isAdult">
-                          O
-                        </div>
-                        <div v-else>
-                          X
-                        </div>
-                      </td>
-                      <td align="center">
-                        <v-btn
-                          color="#3bb9f1"
-                          @click="deleteConfirm(content)"
-                        >
-                          삭제
-                        </v-btn>
-                      </td>
-                    </tr>
-                  </tbody>
-                </template>
-              </v-simple-table>
-              <br><br>
-              <v-row
-                v-if="total_page > 0"
-                class="text-center"
-              >
-                <v-col>
-                  <v-pagination
-                    v-model="page"
-                    :length="total_page"
-                    circle
-                    @input="next"
-                  />
-                </v-col>
-              </v-row>
-            </v-col>
-            <v-col
-              v-else
-              class="no-series-content"
-            >
-              등록된 콘텐츠가 없습니다.
-            </v-col>
-          </v-row>
-        </v-col>
-      </v-row>
-    </v-container>
-
-    <v-dialog
-      v-model="show_add_series_content"
-      max-width="1000px"
-      persistent
-    >
-      <v-card>
-        <v-card-title>
-          콘텐츠 추가
-        </v-card-title>
-        <v-card-text>
-          <v-text-field
-            v-model="search_word"
-            label="콘텐츠 제목"
-            @keyup.enter="searchContentNotInSeries"
-          >
-            <v-btn
-              slot="append"
-              color="#3bb9f1"
-              dark
-              @click="searchContentNotInSeries"
-            >
-              검색
-            </v-btn>
-          </v-text-field>
-        </v-card-text>
-        <v-card-text v-if="search_content_list.length > 0 || add_content_list.length > 0">
-          <v-row>
-            <v-col>
-              검색결과
-              <v-simple-table>
-                <template v-slot:default>
-                  <thead>
-                    <tr>
-                      <th class="text-center">
-                        제목
-                      </th>
-                      <th />
-                    </tr>
-                  </thead>
-                  <tbody>
-                    <tr
-                      v-for="content in search_content_list"
-                      :key="content.contentId"
-                    >
-                      <td>{{ content.title }}</td>
-                      <td>
-                        <v-btn
-                          color="#3bb9f1"
-                          @click="addContent(content)"
-                        >
-                          추가
-                        </v-btn>
-                      </td>
-                    </tr>
-                  </tbody>
-                </template>
-              </v-simple-table>
-            </v-col>
-            <v-col v-if="add_content_list.length > 0">
-              추가할 콘텐츠
-              <v-simple-table>
-                <template>
-                  <thead>
-                    <tr>
-                      <th class="text-center">
-                        제목
-                      </th>
-                      <th />
-                    </tr>
-                  </thead>
-                  <tbody>
-                    <tr
-                      v-for="content in add_content_list"
-                      :key="content.contentId"
-                    >
-                      <td>{{ content.title }}</td>
-                      <td>
-                        <v-btn
-                          color="#3bb9f1"
-                          @click="removeContent(content)"
-                        >
-                          제거
-                        </v-btn>
-                      </td>
-                    </tr>
-                  </tbody>
-                </template>
-              </v-simple-table>
-            </v-col>
-          </v-row>
-        </v-card-text>
-        <v-card-actions v-show="!is_loading">
-          <v-spacer />
-          <v-btn
-            color="blue darken-1"
-            text
-            @click="cancel"
-          >
-            취소
-          </v-btn>
-          <v-btn
-            color="blue darken-1"
-            text
-            @click="addContentInSeries"
-          >
-            추가
-          </v-btn>
-        </v-card-actions>
-      </v-card>
-    </v-dialog>
-
-    <v-dialog
-      v-model="show_delete_confirm_dialog"
-      max-width="400px"
-      persistent
-    >
-      <v-card>
-        <v-card-text />
-        <v-card-text v-if="selected_series_content !== null">
-          {{ selected_series_content.title }} 삭제하시겠습니까?
-        </v-card-text>
-        <v-card-text v-else>
-          삭제하시겠습니까?
-        </v-card-text>
-        <v-card-actions v-show="!is_loading">
-          <v-spacer />
-          <v-btn
-            color="blue darken-1"
-            text
-            @click="deleteCancel"
-          >
-            취소
-          </v-btn>
-          <v-btn
-            color="blue darken-1"
-            text
-            @click="removeContentInSeries"
-          >
-            확인
-          </v-btn>
-        </v-card-actions>
-      </v-card>
-    </v-dialog>
-
-    <v-dialog
-      v-model="is_loading"
-      max-width="400px"
-      persistent
-    >
-      <v-card>
-        <v-card-text>
-          <v-progress-circular
-            indeterminate
-          />
-        </v-card-text>
-      </v-card>
-    </v-dialog>
-  </div>
-</template>
-
-<script>
-import * as api from '@/api/audio_content_series';
-
-import VueShowMoreText from 'vue-show-more-text'
-
-export default {
-  name: "ContentSeriesDetail",
-
-  components: {VueShowMoreText},
-
-  data() {
-    return {
-      is_loading: false,
-      series_id: 0,
-      series_detail: {},
-      series_content_list: [],
-      selected_series_content: null,
-      page: 1,
-      total_page: 0,
-
-      search_word: '',
-      add_content_list: [],
-      search_content_list: [],
-      show_add_series_content: false,
-
-      show_delete_confirm_dialog: false,
-    }
-  },
-
-  async created() {
-    this.series_id = this.$route.params.seriesId
-    if (this.series_id !== undefined && this.series_id > 0) {
-      await this.getSeriesDetail()
-      await this.getSeriesContentList()
-    } else {
-      this.$router.go(-1);
-    }
-  },
-
-  methods: {
-    notifyError(message) {
-      this.$dialog.notify.error(message)
-    },
-
-    notifySuccess(message) {
-      this.$dialog.notify.success(message)
-    },
-
-    cancel() {
-      this.search_word = ''
-      this.add_content_list = []
-      this.search_content_list = []
-      this.selected_series_content = null
-      this.show_add_series_content = false
-      this.show_delete_confirm_dialog = false
-    },
-
-    deleteConfirm(series_content) {
-      this.selected_series_content = series_content
-      this.show_delete_confirm_dialog = true
-    },
-
-    deleteCancel() {
-      this.cancel();
-    },
-
-    showAddContent() {
-      this.show_add_series_content = true
-    },
-
-    addContent(content) {
-      this.search_content_list = this.search_content_list.filter((item) => {
-        return item.contentId !== content.contentId
-      });
-      this.add_content_list.push(content)
-    },
-
-    removeContent(content) {
-      this.add_content_list = this.add_content_list.filter((item) => {
-        return item.contentId !== content.contentId
-      });
-      this.search_content_list.push(content)
-    },
-
-    async searchContentNotInSeries() {
-      if (this.search_word.length < 2) {
-        this.notifyError('검색어를 2글자 이상 입력하세요.')
-        return
-      }
-
-      this.is_loading = true
-
-      try {
-        const res = await api.searchContentNotInSeries(this.series_id, this.search_word)
-
-        if (res.data.success === true) {
-          this.search_content_list = res.data.data
-          if (res.data.data.length <= 0) {
-            this.notifyError('검색결과가 없습니다.')
-          }
-        } else {
-          this.notifyError(res.data.message || '알 수 없는 오류가 발생했습니다. 다시 시도해 주세요.')
-        }
-      } catch (e) {
-        this.notifyError('알 수 없는 오류가 발생했습니다. 다시 시도해 주세요.')
-      } finally {
-        this.is_loading = false
-      }
-    },
-
-    async addContentInSeries() {
-      this.is_loading = true
-      const contentIdList = this.add_content_list.map((item) => {
-        return item.contentId
-      })
-
-      try {
-        const res = await api.addingContentToTheSeries(this.series_id, contentIdList)
-        if (res.status === 200 && res.data.success === true) {
-          this.cancel()
-          this.page = 1
-          this.total_page = 0
-          await this.getSeriesContentList()
-        } else {
-          this.notifyError('알 수 없는 오류가 발생했습니다. 다시 시도해 주세요.')
-        }
-      } catch (e) {
-        this.notifyError('알 수 없는 오류가 발생했습니다. 다시 시도해 주세요.')
-      } finally {
-        this.is_loading = false
-      }
-    },
-
-    async getSeriesDetail() {
-      this.is_loading = true
-
-      try {
-        const res = await api.getSeriesDetail(this.series_id)
-        if (res.status === 200 && res.data.success === true) {
-          this.series_detail = res.data.data
-        } else {
-          this.notifyError(res.data.message || '알 수 없는 오류가 발생했습니다. 다시 시도해 주세요.')
-        }
-      } catch (e) {
-        this.notifyError('알 수 없는 오류가 발생했습니다. 다시 시도해 주세요.')
-      } finally {
-        this.is_loading = false
-      }
-    },
-
-    async next() {
-      await this.getSeriesContentList()
-    },
-
-    async getSeriesContentList() {
-      try {
-        const res = await api.getSeriesContent(this.series_id, this.page)
-        if (res.status === 200 && res.data.success === true) {
-          const data = res.data.data
-          this.series_content_list = data.items
-
-          const total_page = Math.ceil(data.totalCount / 10)
-          if (total_page <= 0)
-            this.total_page = 1
-          else
-            this.total_page = total_page
-        } else {
-          this.notifyError(res.data.message || '콘텐츠를 불러오지 못했습니다. 다시 시도해 주세요.')
-        }
-      } catch (e) {
-        this.notifyError('알 수 없는 오류가 발생했습니다. 다시 시도해 주세요.')
-      }
-    },
-
-    async removeContentInSeries() {
-      this.is_loading = true
-
-      try {
-        const res = await api.removeContentInTheSeries(this.series_id, this.selected_series_content.contentId)
-
-        if (res.status === 200 && res.data.success === true) {
-          this.page = 1
-          this.total_page = 0
-          this.series_content_list = []
-          this.cancel()
-          this.notifySuccess('삭제되었습니다.')
-          await this.getSeriesContentList()
-        } else {
-          this.notifyError('콘텐츠를 삭제하지 못했습니다. 다시 시도해 주세요.')
-        }
-      } catch (e) {
-        this.notifyError('콘텐츠를 삭제하지 못했습니다. 다시 시도해 주세요.')
-      } finally {
-        this.is_loading = false
-      }
-    },
-  },
-}
-</script>
-
-<style scoped>
-.v-card__text {
-  text-align: left;
-}
-
-.cover-image {
-  aspect-ratio: 1/1.4;
-}
-
-.content-cover-image {
-  aspect-ratio: 1;
-}
-
-.no-series-content {
-  height: 50vh;
-  margin-top: 100px;
-}
-</style>

src/views/Content/ContentSeriesList.vue

@@ -1,747 +0,0 @@
-<template>
-  <div>
-    <v-toolbar dark>
-      <v-spacer />
-      <v-toolbar-title>시리즈 관리</v-toolbar-title>
-      <v-spacer />
-    </v-toolbar>
-
-    <br>
-    <v-container>
-      <v-row>
-        <v-col cols="10" />
-        <v-col>
-          <v-btn
-            block
-            color="#3bb9f1"
-            dark
-            depressed
-            @click="showWriteDialog"
-          >
-            시리즈 등록
-          </v-btn>
-        </v-col>
-      </v-row>
-      <div
-        ref="scroll_container"
-        class="scroll_container"
-        @scroll="onScroll"
-      >
-        <draggable
-          v-model="series_list"
-          class="row"
-          @end="onDropCallback(series_list)"
-        >
-          <v-col
-            v-for="(item, i) in series_list"
-            :key="i"
-            cols="2"
-          >
-            <v-card>
-              <v-card-title>
-                <v-spacer />
-                <v-img
-                  :src="item.coverImageUrl"
-                  class="cover-image"
-                  @click="selectSeries(item)"
-                />
-                <v-spacer />
-              </v-card-title>
-              <v-card-text class="series-title-container">
-                {{ item.title }}
-              </v-card-text>
-              <v-card-actions>
-                <v-spacer />
-                <v-btn
-                  text
-                  @click="showModifyDialog(item)"
-                >
-                  수정
-                </v-btn>
-                <v-btn
-                  text
-                  @click="deleteConfirm(item)"
-                >
-                  삭제
-                </v-btn>
-                <v-spacer />
-              </v-card-actions>
-            </v-card>
-          </v-col>
-        </draggable>
-      </div>
-    </v-container>
-
-    <v-dialog
-      v-model="show_write_dialog"
-      max-width="1000px"
-      persistent
-    >
-      <v-card>
-        <v-card-title>
-          시리즈 등록
-        </v-card-title>
-
-        <div class="image-select">
-          <label for="image">
-            커버 이미지 등록
-          </label>
-          <v-file-input
-            id="image"
-            v-model="series.cover_image"
-            accept="image/*"
-            @change="imageAdd"
-          />
-        </div>
-        <img
-          v-if="series.cover_image_url"
-          :src="series.cover_image_url"
-          alt=""
-          class="image-preview"
-        >
-        <v-card-text>
-          <v-row align="center">
-            <v-col cols="4">
-              제목*
-            </v-col>
-            <v-col cols="8">
-              <v-text-field
-                v-model="series.title"
-                label="제목"
-                required
-              />
-            </v-col>
-          </v-row>
-        </v-card-text>
-        <v-card-text>
-          <v-row align="center">
-            <v-col cols="4">
-              소개*
-            </v-col>
-            <v-col cols="8">
-              <v-textarea
-                v-model="series.introduction"
-                label="소개"
-                required
-              />
-            </v-col>
-          </v-row>
-        </v-card-text>
-        <v-card-text>
-          <v-row>
-            <v-col cols="4">
-              연재요일*
-            </v-col>
-            <v-col
-              cols="8"
-              align="left"
-            >
-              <v-row>
-                <v-col
-                  v-for="(day, index) in days_of_week"
-                  :key="index"
-                >
-                  <input
-                    :id="'checkbox_' + day.value"
-                    v-model="series.published_days_of_week"
-                    type="checkbox"
-                    :value="day.value"
-                    @change="handleCheckboxChange(day.value, $event)"
-                  >
-                  <label :for="'checkbox_' + day.value"> {{ day.str }}</label><br>
-                </v-col>
-              </v-row>
-
-              <input
-                id="checkbox_random"
-                v-model="series.published_days_of_week"
-                type="checkbox"
-                value="RANDOM"
-                @change="handleCheckboxChange('RANDOM', $event)"
-              >
-              <label for="checkbox_random"> 랜덤</label>
-            </v-col>
-          </v-row>
-        </v-card-text>
-        <v-card-text>
-          <v-row align="center">
-            <v-col cols="4">
-              장르
-            </v-col>
-            <v-col cols="8">
-              <v-select
-                v-model="series.genre_id"
-                :items="series_genre_list"
-                item-text="name"
-                item-value="value"
-                label="장르 선택"
-              />
-            </v-col>
-          </v-row>
-        </v-card-text>
-        <v-card-text v-show="selected_series === undefined || selected_series === null">
-          <v-row align="center">
-            <v-col cols="4">
-              키워드*
-            </v-col>
-            <v-col cols="8">
-              <v-text-field
-                v-model="series.keyword"
-                label="키워드 예 : #달달 #장기연애 #첫사랑"
-                required
-              />
-            </v-col>
-          </v-row>
-        </v-card-text>
-        <v-card-text>
-          <v-row>
-            <v-col cols="4">
-              연령제한
-            </v-col>
-            <v-col
-              cols="8"
-              align="left"
-            >
-              <input
-                v-model="series.is_adult"
-                type="checkbox"
-              >
-            </v-col>
-          </v-row>
-        </v-card-text>
-        <v-card-text v-show="selected_series !== undefined && selected_series !== null">
-          <v-row>
-            <v-col cols="4">
-              완결여부*
-            </v-col>
-            <v-col
-              cols="8"
-              align="left"
-            >
-              <v-row>
-                <v-col>
-                  <input
-                    id="radio_proceeding"
-                    v-model="series.state"
-                    type="radio"
-                    value="PROCEEDING"
-                  >
-                  <label for="radio_proceeding"> 연재중</label>
-                </v-col>
-                <v-col>
-                  <input
-                    id="radio_suspend"
-                    v-model="series.state"
-                    type="radio"
-                    value="SUSPEND"
-                  >
-                  <label for="radio_suspend"> 휴재중</label>
-                </v-col>
-                <v-col>
-                  <input
-                    id="radio_complete"
-                    v-model="series.state"
-                    type="radio"
-                    value="COMPLETE"
-                  >
-                  <label for="radio_complete"> 완결</label>
-                </v-col>
-              </v-row>
-            </v-col>
-          </v-row>
-        </v-card-text>
-        <v-card-text>
-          <v-row align="center">
-            <v-col cols="4">
-              작가
-            </v-col>
-            <v-col cols="8">
-              <v-text-field
-                v-model="series.writer"
-                label="작가"
-                required
-              />
-            </v-col>
-          </v-row>
-        </v-card-text>
-        <v-card-text>
-          <v-row align="center">
-            <v-col cols="4">
-              제작사
-            </v-col>
-            <v-col cols="8">
-              <v-text-field
-                v-model="series.studio"
-                label="제작사"
-                required
-              />
-            </v-col>
-          </v-row>
-        </v-card-text>
-        <v-card-actions v-show="!is_loading">
-          <v-spacer />
-          <v-btn
-            color="blue darken-1"
-            text
-            @click="cancel"
-          >
-            취소
-          </v-btn>
-          <v-btn
-            v-if="selected_series !== undefined && selected_series !== null"
-            color="blue darken-1"
-            text
-            @click="modify"
-          >
-            수정
-          </v-btn>
-          <v-btn
-            v-else
-            color="blue darken-1"
-            text
-            @click="validate"
-          >
-            등록
-          </v-btn>
-        </v-card-actions>
-      </v-card>
-    </v-dialog>
-
-    <v-dialog
-      v-model="show_delete_confirm_dialog"
-      max-width="400px"
-      persistent
-    >
-      <v-card>
-        <v-card-text />
-        <v-card-text>
-          삭제하시겠습니까?
-        </v-card-text>
-        <v-card-actions v-show="!is_loading">
-          <v-spacer />
-          <v-btn
-            color="blue darken-1"
-            text
-            @click="deleteCancel"
-          >
-            취소
-          </v-btn>
-          <v-btn
-            color="blue darken-1"
-            text
-            @click="deleteSeries"
-          >
-            확인
-          </v-btn>
-        </v-card-actions>
-      </v-card>
-    </v-dialog>
-
-    <v-dialog
-      v-model="is_loading"
-      max-width="400px"
-      persistent
-    >
-      <v-card>
-        <v-card-text>
-          <v-progress-circular
-            indeterminate
-          />
-        </v-card-text>
-      </v-card>
-    </v-dialog>
-  </div>
-</template>
-
-<script>
-import * as api from '@/api/audio_content_series';
-import Draggable from "vuedraggable";
-
-export default {
-  name: "ContentSeriesList",
-  components: {Draggable},
-  data() {
-    return {
-      is_loading: false,
-      show_write_dialog: false,
-      show_delete_confirm_dialog: false,
-      series: {is_adult: false, published_days_of_week: []},
-      series_list: [],
-      selected_series: null,
-      series_genre_list: [],
-      page: 1,
-      total_page: 0,
-      days_of_week: [
-        {value: 'SUN', str: '일'},
-        {value: 'MON', str: '월'},
-        {value: 'TUE', str: '화'},
-        {value: 'WED', str: '수'},
-        {value: 'THU', str: '목'},
-        {value: 'FRI', str: '금'},
-        {value: 'SAT', str: '토'},
-      ],
-    }
-  },
-
-  async created() {
-    await this.getSeriesGenreList();
-    await this.getSeriesList();
-  },
-
-  methods: {
-    async onScroll() {
-      const scrollContainer = this.$refs.scroll_container;
-      const threshold = scrollContainer.scrollHeight - scrollContainer.clientHeight;
-      if (scrollContainer.scrollTop >= threshold - 10 && this.total_page >= this.page) {
-        await this.getSeriesList();
-      }
-    },
-
-    imageAdd(payload) {
-      const file = payload;
-      if (file) {
-        this.series.cover_image_url = URL.createObjectURL(file)
-        URL.revokeObjectURL(file)
-      } else {
-        this.series.cover_image_url = null
-      }
-    },
-
-    notifyError(message) {
-      this.$dialog.notify.error(message)
-    },
-
-    notifySuccess(message) {
-      this.$dialog.notify.success(message)
-    },
-
-    showWriteDialog() {
-      this.show_write_dialog = true
-    },
-
-    showModifyDialog(series) {
-      this.series = {
-        title: series.title,
-        introduction: series.introduction,
-        published_days_of_week: series.publishedDaysOfWeek,
-        genre_id: series.genreId,
-        is_adult: series.isAdult,
-        state: series.state,
-        cover_image_url: series.coverImageUrl
-      }
-
-      if (series.writer !== undefined && series.writer !== null) {
-        this.series.writer = series.writer
-      }
-
-      if (series.studio !== undefined && series.studio !== null) {
-        this.series.studio = series.studio
-      }
-
-      this.selected_series = series
-      this.show_write_dialog = true
-    },
-
-    cancel() {
-      this.series = {is_adult: false, published_days_of_week: []}
-      this.selected_series = null
-      this.show_write_dialog = false
-      this.show_delete_confirm_dialog = false
-    },
-
-    deleteConfirm(series) {
-      this.selected_series = series
-      this.show_delete_confirm_dialog = true
-    },
-
-    deleteCancel() {
-      this.cancel();
-    },
-
-    handleCheckboxChange(checked_days_of_week, event) {
-      if (checked_days_of_week === 'RANDOM' && event.target.checked) {
-        this.series.published_days_of_week = ['RANDOM'];
-      } else {
-        this.series.published_days_of_week = this.series.published_days_of_week.filter(item => item !== 'RANDOM');
-      }
-    },
-
-    validate() {
-      if (this.series.cover_image === undefined || this.series.cover_image === null) {
-        this.notifyError('커버 이미지를 선택하세요')
-        return
-      }
-
-      if (this.series.title === undefined || this.series.title === null || this.series.title.trim().length <= 0) {
-        this.notifyError('시리즈 제목을 입력하세요')
-        return
-      }
-
-      if (this.series.introduction === undefined || this.series.introduction === null || this.series.introduction.trim().length <= 0) {
-        this.notifyError('시리즈 소개를 입력하세요')
-        return
-      }
-
-      if (this.series.published_days_of_week === undefined || this.series.published_days_of_week === null || this.series.published_days_of_week.length <= 0) {
-        this.notifyError('시리즈 연재요일을 선택하세요')
-        return
-      }
-
-      if (this.series.keyword === undefined || this.series.keyword === null || this.series.keyword.replaceAll('#', '').trim().length <= 0) {
-        this.notifyError('시리즈를 설명할 수 있는 키워드를 입력하세요')
-        return
-      }
-
-      if (this.series.genre_id === undefined || this.series.genre_id === null || this.series.genre_id <= 0) {
-        this.notifyError('올바른 장르를 선택하세요')
-        return
-      }
-
-      this.submit();
-    },
-
-    selectSeries(series) {
-      this.$router.push({name: 'ContentSeriesDetail', params: {seriesId: series.seriesId}})
-    },
-
-    async onDropCallback(items) {
-      const ids = items.map((item) => {
-        return item.seriesId
-      })
-
-      const res = await api.updateSeriesOrders(ids)
-      if (res.status === 200 && res.data.success === true) {
-        this.notifySuccess(res.data.message)
-      }
-    },
-
-    async getSeriesGenreList() {
-      try {
-        const res = await api.getGenreList()
-        if (res.status === 200 && res.data.success === true) {
-          this.series_genre_list = res.data.data.map((item) => {
-            return {name: item.genre, value: item.id}
-          })
-        } else {
-          this.notifyError(res.data.message || '알 수 없는 오류가 발생했습니다. 다시 시도해 주세요.')
-        }
-      } catch (e) {
-        this.notifyError('알 수 없는 오류가 발생했습니다. 다시 시도해 주세요.')
-      }
-    },
-
-    async getSeriesList() {
-      if (this.is_loading) return;
-
-      this.is_loading = true
-      try {
-        const res = await api.getSeriesList(this.page)
-        if (res.status === 200 && res.data.success === true) {
-          const data = res.data.data
-          const total_page = Math.ceil(data.totalCount / 10)
-
-          if (this.page === 1) this.series_list.length = 0;
-          this.page += 1;
-          this.series_list.push(...data.items);
-
-          if (total_page <= 0)
-            this.total_page = 1
-          else
-            this.total_page = total_page
-        } else {
-          this.notifyError(res.data.message || '알 수 없는 오류가 발생했습니다. 다시 시도해 주세요.')
-        }
-
-        this.is_loading = false
-      } catch (e) {
-        this.notifyError('알 수 없는 오류가 발생했습니다. 다시 시도해 주세요.')
-        this.is_loading = false
-      }
-    },
-
-    async submit() {
-      if (this.is_loading) return;
-      this.is_loading = true
-
-      try {
-        const request = {
-          title: this.series.title,
-          introduction: this.series.introduction,
-          publishedDaysOfWeek: this.series.published_days_of_week,
-          keyword: this.series.keyword,
-          genreId: this.series.genre_id,
-          isAdult: this.series.is_adult,
-          writer: this.series.writer || null,
-          studio: this.series.studio || null
-        }
-
-        const formData = new FormData()
-        formData.append("image", this.series.cover_image);
-        formData.append("request", JSON.stringify(request))
-
-        const res = await api.createSeries(formData);
-        if (res.status === 200 && res.data.success === true) {
-          this.cancel();
-          this.notifySuccess(res.data.message || '등록되었습니다.')
-          this.page = 1
-          await this.getSeriesList()
-        } else {
-          this.is_loading = false
-          this.notifyError(res.data.message || '알 수 없는 오류가 발생했습니다. 다시 시도해 주세요.')
-          this.is_loading = false
-        }
-      } catch (e) {
-        this.notifyError('알 수 없는 오류가 발생했습니다. 다시 시도해 주세요.')
-      } finally {
-        this.is_loading = false
-      }
-    },
-
-    async modify() {
-      if (this.is_loading) return;
-      this.is_loading = true
-
-      try {
-        const request = {seriesId: this.selected_series.seriesId}
-        if (this.selected_series.title !== this.series.title) {
-          request.title = this.series.title
-        }
-
-        if (this.selected_series.introduction !== this.series.introduction) {
-          request.introduction = this.series.introduction
-        }
-
-        if (this.selected_series.publishedDaysOfWeek !== this.series.published_days_of_week) {
-          request.publishedDaysOfWeek = this.series.published_days_of_week
-        }
-
-        if (this.selected_series.genreId !== this.series.genre_id) {
-          request.genreId = this.series.genre_id
-        }
-
-        if (this.selected_series.isAdult !== this.series.is_adult) {
-          request.isAdult = this.series.is_adult
-        }
-
-        if (this.selected_series.state !== this.series.state) {
-          request.state = this.series.state
-        }
-
-        if (this.selected_series.state !== this.series.state) {
-          request.state = this.series.state
-        }
-
-        if (this.selected_series.writer !== this.series.writer) {
-          request.writer = this.series.writer
-        }
-
-        if (this.selected_series.studio !== this.series.studio) {
-          request.studio = this.series.studio
-        }
-
-        const formData = new FormData()
-        formData.append("request", JSON.stringify(request))
-
-        if (this.series.cover_image !== undefined && this.series.cover_image !== null) {
-          formData.append("image", this.series.cover_image);
-        }
-
-        const res = await api.modifySeries(formData);
-        if (res.status === 200 && res.data.success === true) {
-          this.cancel();
-          this.notifySuccess(res.data.message || '등록되었습니다.')
-          this.page = 1
-          await this.getSeriesList()
-        } else {
-          this.is_loading = false
-          this.notifyError(res.data.message || '알 수 없는 오류가 발생했습니다. 다시 시도해 주세요.')
-          this.is_loading = false
-        }
-      } catch (e) {
-        this.notifyError('알 수 없는 오류가 발생했습니다. 다시 시도해 주세요.')
-      } finally {
-        this.is_loading = false
-      }
-    },
-
-    async deleteSeries() {
-      if (this.is_loading) return;
-      this.is_loading = true
-
-      try {
-        const request = {seriesId: this.selected_series.seriesId, isActive: false}
-        const formData = new FormData()
-        formData.append("request", JSON.stringify(request))
-
-        const res = await api.modifySeries(formData)
-        if (res.status === 200 && res.data.success === true) {
-          this.cancel();
-          this.notifySuccess('시리즈가 삭제되었습니다.')
-          this.page = 1
-          await this.getSeriesList()
-        } else {
-          this.is_loading = false
-          this.notifyError(res.data.message || '알 수 없는 오류가 발생했습니다. 다시 시도해 주세요.')
-          this.is_loading = false
-        }
-      } catch (e) {
-        this.notifyError('알 수 없는 오류가 발생했습니다. 다시 시도해 주세요.')
-      } finally {
-        this.is_loading = false
-      }
-    }
-  },
-}
-</script>
-
-<style scoped>
-.scroll_container {
-  margin-top: 30px;
-  height: 100vh;
-  overflow-y: auto;
-}
-
-.scroll_container > .row {
-  padding-bottom: 280px;
-}
-
-.image-select label {
-  display: inline-block;
-  padding: 10px 20px;
-  background-color: #232d4a;
-  color: #fff;
-  vertical-align: middle;
-  font-size: 15px;
-  cursor: pointer;
-  border-radius: 5px;
-}
-
-.v-file-input {
-  position: absolute;
-  width: 0;
-  height: 0;
-  padding: 0;
-  overflow: hidden;
-  border: 0;
-}
-
-.image-preview {
-  max-width: 100%;
-  width: 250px;
-  object-fit: cover;
-  margin-top: 10px;
-}
-
-.series-title-container {
-  display: -webkit-box;
-  -webkit-box-orient: vertical;
-  overflow: hidden;
-  text-overflow: ellipsis;
-  -webkit-line-clamp: 2;
-  max-height: 2em;
-}
-
-.cover-image {
-  aspect-ratio: 1/1.3;
-}
-</style>

src/views/Signature/SignatureManagement.vue

@@ -1,716 +0,0 @@
-<template>
-  <div>
-    <v-toolbar dark>
-      <v-spacer />
-      <v-toolbar-title>시그니처 관리</v-toolbar-title>
-      <v-spacer />
-    </v-toolbar>
-    <v-container>
-      <v-row>
-        <v-col cols="10" />
-        <v-col>
-          <v-btn
-            block
-            color="#3bb9f1"
-            dark
-            depressed
-            @click="showWriteDialog"
-          >
-            시그니처 등록
-          </v-btn>
-        </v-col>
-      </v-row>
-      <v-row class="row-sort">
-        <v-col>
-          <input
-            id="sort-newest"
-            v-model="sort_type"
-            type="radio"
-            value="NEWEST"
-            class="radio-sort"
-            @change="changeSortType"
-          >
-          <label
-            for="sort-newest"
-            class="radio-label-sort"
-          >
-            최신순
-          </label>
-        </v-col>
-        <v-col>
-          <input
-            id="sort-can-high"
-            v-model="sort_type"
-            type="radio"
-            value="CAN_HIGH"
-            class="radio-sort"
-            @change="changeSortType"
-          >
-          <label
-            for="sort-can-high"
-            class="radio-label-sort"
-          >
-            높은캔순
-          </label>
-        </v-col>
-        <v-col>
-          <input
-            id="sort-can-low"
-            v-model="sort_type"
-            type="radio"
-            value="CAN_LOW"
-            class="radio-sort"
-            @change="changeSortType"
-          >
-          <label
-            for="sort-can-low"
-            class="radio-label-sort"
-          >
-            낮은캔순
-          </label>
-        </v-col>
-        <v-col cols="10" />
-      </v-row>
-      <v-row>
-        <v-col>
-          <v-data-table
-            :headers="headers"
-            :items="signature_list"
-            :loading="is_loading"
-            :items-per-page="-1"
-            item-key="id"
-            class="elevation-1"
-            hide-default-footer
-          >
-            <template v-slot:item.can="{ item }">
-              {{ item.can }}
-            </template>
-
-            <template v-slot:item.isAdult="{ item }">
-              <h3 v-if="item.isAdult">
-                O
-              </h3>
-              <h3 v-else>
-                X
-              </h3>
-            </template>
-
-            <template v-slot:item.image="{ item }">
-              <v-img
-                :src="item.image"
-                max-width="200"
-                max-height="200"
-                align="center"
-                class="center-image"
-              />
-            </template>
-            <template v-slot:item.management="{ item }">
-              <v-row>
-                <v-col />
-                <v-col>
-                  <v-btn
-                    :disabled="is_loading"
-                    @click="showModifyDialog(item)"
-                  >
-                    수정
-                  </v-btn>
-                </v-col>
-                <v-col>
-                  <v-btn
-                    :disabled="is_loading"
-                    @click="showDeleteConfirm(item)"
-                  >
-                    삭제
-                  </v-btn>
-                </v-col>
-                <v-col />
-              </v-row>
-            </template>
-          </v-data-table>
-        </v-col>
-      </v-row>
-      <v-row class="text-center">
-        <v-col>
-          <v-pagination
-            v-model="page"
-            :length="total_page"
-            circle
-            @input="next"
-          />
-        </v-col>
-      </v-row>
-    </v-container>
-    <v-row>
-      <v-dialog
-        v-model="show_write_dialog"
-        max-width="1000px"
-        persistent
-      >
-        <v-card>
-          <v-card-title>
-            시그니처 캔 등록
-          </v-card-title>
-          <v-card-text>
-            <v-row align="center">
-              <v-col cols="4">
-                캔
-              </v-col>
-              <v-col cols="8">
-                <v-text-field
-                  v-model="can"
-                  label="캔"
-                />
-              </v-col>
-            </v-row>
-          </v-card-text>
-
-          <v-card-text>
-            <v-row>
-              <v-col cols="4">
-                19금
-              </v-col>
-              <v-col cols="8">
-                <input
-                  v-model="is_adult"
-                  type="checkbox"
-                >
-              </v-col>
-            </v-row>
-          </v-card-text>
-
-          <v-card-text>
-            <v-row align="center">
-              <v-col cols="4">
-                이미지
-              </v-col>
-              <v-col cols="8">
-                <div class="image-select">
-                  <label for="image">
-                    이미지 불러오기
-                  </label>
-                  <v-file-input
-                    id="image"
-                    v-model="image"
-                    accept="image/*"
-                    @change="imageAdd"
-                  />
-                </div>
-                <img
-                  v-if="image_url"
-                  :src="image_url"
-                  alt=""
-                  class="image-preview"
-                >
-              </v-col>
-            </v-row>
-          </v-card-text>
-
-          <v-card-text>
-            <v-row align="center">
-              <v-col cols="4">
-                시간(초)
-              </v-col>
-              <v-col cols="8">
-                <v-text-field
-                  v-model="time"
-                  label="시간(초)"
-                />
-              </v-col>
-            </v-row>
-          </v-card-text>
-
-          <v-card-actions v-show="!is_loading">
-            <v-spacer />
-            <v-btn
-              color="blue darken-1"
-              text
-              @click="cancel"
-            >
-              취소
-            </v-btn>
-            <v-btn
-              color="blue darken-1"
-              text
-              @click="validate"
-            >
-              등록
-            </v-btn>
-          </v-card-actions>
-        </v-card>
-      </v-dialog>
-    </v-row>
-    <v-row>
-      <v-dialog
-        v-model="show_modify_dialog"
-        max-width="1000px"
-        persistent
-      >
-        <v-card>
-          <v-card-title>
-            시그니처 캔 수정
-          </v-card-title>
-          <v-card-text>
-            <v-row align="center">
-              <v-col cols="4">
-                캔
-              </v-col>
-              <v-col cols="8">
-                <v-text-field
-                  v-model="can"
-                  label="캔"
-                />
-              </v-col>
-            </v-row>
-          </v-card-text>
-
-          <v-card-text>
-            <v-row>
-              <v-col cols="4">
-                19금
-              </v-col>
-              <v-col cols="8">
-                <input
-                  v-model="is_adult"
-                  type="checkbox"
-                >
-              </v-col>
-            </v-row>
-          </v-card-text>
-
-          <v-card-text>
-            <v-row align="center">
-              <v-col cols="4">
-                이미지
-              </v-col>
-              <v-col cols="8">
-                <div class="image-select">
-                  <label for="image">
-                    이미지 불러오기
-                  </label>
-                  <v-file-input
-                    id="image"
-                    v-model="image"
-                    accept="image/*"
-                    @change="imageAdd"
-                  />
-                </div>
-                <img
-                  v-if="image_url"
-                  :src="image_url"
-                  alt=""
-                  class="image-preview"
-                >
-              </v-col>
-            </v-row>
-          </v-card-text>
-
-          <v-card-text>
-            <v-row align="center">
-              <v-col cols="4">
-                시간(초)
-              </v-col>
-              <v-col cols="8">
-                <v-text-field
-                  v-model="time"
-                  label="시간(초)"
-                />
-              </v-col>
-            </v-row>
-          </v-card-text>
-
-          <v-card-actions v-show="!is_loading">
-            <v-spacer />
-            <v-btn
-              color="blue darken-1"
-              text
-              @click="cancel"
-            >
-              취소
-            </v-btn>
-            <v-btn
-              color="blue darken-1"
-              text
-              @click="modifySignatureCan"
-            >
-              수정
-            </v-btn>
-          </v-card-actions>
-        </v-card>
-      </v-dialog>
-    </v-row>
-    <v-row>
-      <v-dialog
-        v-model="show_delete_confirm_dialog"
-        max-width="400px"
-        persistent
-      >
-        <v-card>
-          <v-card-text />
-          <v-card-text>
-            삭제하시겠습니까?
-          </v-card-text>
-          <v-card-actions v-show="!is_loading">
-            <v-spacer />
-            <v-btn
-              color="blue darken-1"
-              text
-              @click="cancel"
-            >
-              취소
-            </v-btn>
-            <v-btn
-              color="blue darken-1"
-              text
-              @click="deleteSignature"
-            >
-              확인
-            </v-btn>
-          </v-card-actions>
-        </v-card>
-      </v-dialog>
-    </v-row>
-  </div>
-</template>
-
-<script>
-import * as api from "@/api/signature";
-
-export default {
-  name: "SignatureManagement",
-
-  data() {
-    return {
-      is_loading: false,
-      show_write_dialog: false,
-      show_modify_dialog: false,
-      show_delete_confirm_dialog: false,
-
-      signature_list: [],
-
-      page: 1,
-      total_page: 0,
-
-      can: 0,
-      time: 7,
-      image: null,
-      is_adult: false,
-      image_url: null,
-      is_active: null,
-      selected_signature_can: {},
-      sort_type: 'NEWEST',
-
-      headers: [
-        {
-          text: '캔',
-          align: 'center',
-          sortable: false,
-          value: 'can',
-        },
-        {
-          text: '19금',
-          align: 'center',
-          sortable: false,
-          value: 'isAdult',
-        },
-        {
-          text: '이미지',
-          align: 'center',
-          sortable: false,
-          value: 'image',
-        },
-        {
-          text: '시간(초)',
-          align: 'center',
-          sortable: false,
-          value: 'time',
-        },
-        {
-          text: '관리',
-          align: 'center',
-          sortable: false,
-          value: 'management',
-        },
-      ],
-    }
-  },
-
-  async created() {
-    await this.getSignatureList();
-  },
-
-  methods: {
-    notifyError(message) {
-      this.$dialog.notify.error(message)
-    },
-
-    notifySuccess(message) {
-      this.$dialog.notify.success(message)
-    },
-
-    imageAdd(payload) {
-      const file = payload;
-      if (file) {
-        this.image_url = URL.createObjectURL(file)
-        URL.revokeObjectURL(file)
-      } else {
-        this.image_url = null
-      }
-    },
-
-    showWriteDialog() {
-      this.show_write_dialog = true
-    },
-
-    validate() {
-      if (
-        this.can === 0 ||
-        this.image === null
-      ) {
-        this.notifyError('내용을 입력하세요')
-      } else if (this.time < 3 || this.time > 20) {
-        this.notifyError('시간은 3초 이상 20초 이하를 입력하세요.')
-      } else {
-        this.submit()
-      }
-    },
-
-    cancel() {
-      this.show_write_dialog = false
-      this.show_modify_dialog = false
-      this.show_delete_confirm_dialog = false
-      this.image = null
-      this.image_url = null
-      this.can = 0
-      this.time = 7
-      this.is_adult = false
-      this.is_active = null
-      this.selected_signature_can = {}
-    },
-
-    showDeleteConfirm(item) {
-      this.selected_signature_can = item
-      this.show_delete_confirm_dialog = true
-    },
-
-    showModifyDialog(item) {
-      this.can = item.can;
-      this.time = item.time;
-      this.is_adult = item.isAdult
-      this.image_url = item.image
-      this.selected_signature_can = item
-      this.show_modify_dialog = true
-    },
-
-    async changeSortType() {
-      await this.getSignatureList();
-    },
-
-    async getSignatureList() {
-      this.is_loading = true
-
-      try {
-        let res = await api.getSignatureList(this.page, this.sort_type);
-
-        if (res.status === 200 && res.data.success === true) {
-          const data = res.data.data
-
-          const total_page = Math.ceil(data.totalCount / 20)
-          this.signature_list = data.items
-
-          if (total_page <= 0)
-            this.total_page = 1
-          else
-            this.total_page = total_page
-        }
-      } catch (e) {
-        this.notifyError("알 수 없는 오류가 발생했습니다. 다시 시도해 주세요.")
-      } finally {
-        this.is_loading = false
-      }
-    },
-
-    async submit() {
-      if (this.is_loading) return;
-
-      this.is_loading = true
-
-      try {
-        const formData = new FormData()
-        formData.append("can", this.can)
-        formData.append("time", this.time)
-        formData.append("image", this.image)
-        formData.append("isAdult", this.is_adult)
-
-        const res = await api.createSignature(formData)
-        if (res.status === 200 && res.data.success === true) {
-          this.cancel()
-          this.notifySuccess(res.data.message || '등록되었습니다.')
-
-          this.page = 1
-          await this.getSignatureList()
-        } else {
-          this.is_loading = false
-          this.notifyError(res.data.message || '알 수 없는 오류가 발생했습니다. 다시 시도해 주세요.')
-        }
-      } catch (e) {
-        this.notifyError('알 수 없는 오류가 발생했습니다. 다시 시도해 주세요.')
-        this.is_loading = false
-      } finally {
-        this.is_loading = false
-      }
-    },
-
-    async modifySignatureCan() {
-      if (
-        this.image === null &&
-        this.is_adult === this.selected_signature_can.isAdult &&
-        this.can === this.selected_signature_can.can &&
-        this.time === this.selected_signature_can.time
-      ) {
-        this.notifyError('변경사항이 없습니다.')
-        return;
-      }
-
-      if (this.is_loading) return;
-
-      this.is_loading = true
-
-      try {
-        const formData = new FormData()
-        formData.append("id", this.selected_signature_can.id)
-
-        if (this.image !== null) {
-          formData.append("image", this.image)
-        }
-
-        if (this.is_adult !== this.selected_signature_can.isAdult) {
-          formData.append("isAdult", this.is_adult)
-        }
-
-        if (this.can !== this.selected_signature_can.can) {
-          formData.append("can", this.can)
-        }
-
-        if (this.time !== this.selected_signature_can.time) {
-          formData.append("time", this.time)
-        }
-
-        const res = await api.modifySignature(formData)
-        if (res.status === 200 && res.data.success === true) {
-          this.cancel()
-          this.notifySuccess(res.data.message || '수정되었습니다.')
-
-          this.page = 1
-          await this.getSignatureList()
-        } else {
-          this.is_loading = false
-          this.notifyError(res.data.message || '알 수 없는 오류가 발생했습니다. 다시 시도해 주세요.')
-        }
-      } catch (e) {
-        this.notifyError('알 수 없는 오류가 발생했습니다. 다시 시도해 주세요.')
-        this.is_loading = false
-      } finally {
-        this.is_loading = false
-      }
-    },
-
-    async deleteSignature() {
-      if (this.is_loading) return;
-
-      this.is_loading = true
-
-      try {
-        const formData = new FormData()
-        formData.append("id", this.selected_signature_can.id)
-        formData.append("isActive", false)
-
-        const res = await api.modifySignature(formData)
-        if (res.status === 200 && res.data.success === true) {
-          this.cancel()
-          this.notifySuccess(res.data.message || '등록되었습니다.')
-
-          this.page = 1
-          await this.getSignatureList()
-        } else {
-          this.is_loading = false
-          this.notifyError(res.data.message || '알 수 없는 오류가 발생했습니다. 다시 시도해 주세요.')
-        }
-      } catch (e) {
-        this.notifyError('알 수 없는 오류가 발생했습니다. 다시 시도해 주세요.')
-        this.is_loading = false
-      } finally {
-        this.is_loading = false
-      }
-    },
-
-    async next() {
-      await this.getSignatureList();
-    }
-  }
-}
-</script>
-
-<style scoped>
-.image-select label {
-  display: inline-block;
-  padding: 10px 20px;
-  background-color: #232d4a;
-  color: #fff;
-  vertical-align: middle;
-  font-size: 15px;
-  cursor: pointer;
-  border-radius: 5px;
-}
-
-.v-file-input {
-  position: absolute;
-  width: 0;
-  height: 0;
-  padding: 0;
-  overflow: hidden;
-  border: 0;
-}
-
-.image-preview {
-  max-width: 100%;
-  width: 250px;
-  object-fit: cover;
-  margin-top: 10px;
-}
-
-.v-card__text {
-  margin-top: 20px;
-}
-
-.v-card__actions {
-  margin-top: 100px;
-}
-
-.v-card__actions > .v-btn {
-  font-size: 20px;
-
-}
-
-.center-image {
-  display: block;
-  margin: 0 auto;
-}
-
-.row-sort {
-  margin-top: 40px;
-}
-
-.radio-sort {
-  display: none;
-}
-
-.radio-label-sort {
-  font-weight: normal;
-  color: black;
-}
-
-.radio-sort:checked + .radio-label-sort {
-  font-weight: bold;
-  color: #3bb9f1;
-}
-</style>