src/views/Can/CanSignature.vue

@@ -52,32 +52,8 @@
                 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>
@@ -99,7 +75,10 @@
         persistent
       >
         <v-card>
-          <v-card-title>
+          <v-card-title v-if="selected_signature_can !== null">
+            시그니처 캔 수정
+          </v-card-title>
+          <v-card-title v-else>
             시그니처 캔 등록
           </v-card-title>
 
@@ -167,109 +146,20 @@
               취소
             </v-btn>
             <v-btn
-              color="blue darken-1"
+              v-if="selected_signature_can !== null"
-              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">
-                {{ selected_signature_can.can }} 캔
-              </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"
-                    @change="imageAdd"
-                  />
-                </div>
-                <img
-                  v-if="image_url"
-                  :src="image_url"
-                  alt=""
-                  class="image-preview"
-                >
-              </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
+              v-else
               color="blue darken-1"
               text
-              @click="cancel"
+              @click="validate"
             >
-              취소
+              등록
-            </v-btn>
-            <v-btn
-              color="blue darken-1"
-              text
-              @click="deleteSignature"
-            >
-              확인
             </v-btn>
           </v-card-actions>
         </v-card>
@@ -287,9 +177,8 @@ export default {
   data() {
     return {
       is_loading: false,
+      is_modify: false,
       show_write_dialog: false,
-      show_modify_dialog: false,
-      show_delete_confirm_dialog: false,
 
       signature_list: [],
 
@@ -301,7 +190,7 @@ export default {
       image_url: null,
       creator_id: null,
       is_active: null,
-      selected_signature_can: {},
+      selected_signature_can: null,
 
       headers: [
         {
@@ -328,12 +217,6 @@ export default {
           sortable: false,
           value: 'image',
         },
-        {
-          text: '관리',
-          align: 'center',
-          sortable: false,
-          value: 'management',
-        },
       ],
     }
   },
@@ -366,14 +249,10 @@ export default {
     },
 
     showModifyDialog(item) {
+      this.selected_signature_can = item
+      this.is_active = item.is_active
       this.image_url = item.image;
-      this.selected_signature_can = item
+      this.show_write_dialog = true
-      this.show_modify_dialog = true
-    },
-
-    showDeleteConfirm(item) {
-      this.selected_signature_can = item
-      this.show_delete_confirm_dialog = true
     },
 
     validate() {
@@ -390,13 +269,12 @@ export default {
 
     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.creator_id = null
       this.can = 0
       this.is_active = null
-      this.selected_signature_can = {}
+      this.selected_signature_can = null
     },
 
     async getSignatureList() {
@@ -454,11 +332,6 @@ export default {
     },
 
     async modifySignatureCan() {
-      if (this.image === null) {
-        this.notifyError('수정사항이 없습니다.')
-        return;
-      }
-
       if (this.is_loading) return;
 
       this.is_loading = true
@@ -466,7 +339,14 @@ export default {
       try {
         const formData = new FormData()
         formData.append("id", this.selected_signature_can.id)
-        formData.append("image", this.image)
+
+        if (this.image !== null) {
+          formData.append("image", this.image)
+        }
+
+        if (this.selected_signature_can.isActive !== this.is_active) {
+          formData.append("isActive", this.is_active)
+        }
 
         const res = await api.modifySignature(formData)
         if (res.status === 200 && res.data.success === true) {
@@ -486,35 +366,6 @@ export default {
       }
     },
 
-    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();
     }
@@ -563,8 +414,8 @@ export default {
 
 }
 
-.center-image {
+td img {
   display: block;
-  margin: 0 auto;
+  margin: 10px auto;
 }
 </style>