From 67df507a2eefeebbef4aafcfbd25f20af645d071 Mon Sep 17 00:00:00 2001
From: Hironsan <light.tree.1.13@gmail.com>
Date: Mon, 21 Feb 2022 10:47:48 +0900
Subject: [PATCH] Move the feature of importing label types to import page

---
 frontend/components/label/FormUpload.vue     | 91 --------------------
 frontend/pages/projects/_id/labels/index.vue | 33 +------
 2 files changed, 1 insertion(+), 123 deletions(-)
 delete mode 100644 frontend/components/label/FormUpload.vue

diff --git a/frontend/components/label/FormUpload.vue b/frontend/components/label/FormUpload.vue
deleted file mode 100644
index ab56c1dc..00000000
--- a/frontend/components/label/FormUpload.vue
+++ /dev/null
@@ -1,91 +0,0 @@
-<template>
-  <base-card
-    :disabled="!valid"
-    :title="$t('labels.importTitle')"
-    :agree-text="$t('generic.upload')"
-    :cancel-text="$t('generic.cancel')"
-    @agree="$emit('upload', file)"
-    @cancel="cancel"
-  >
-    <template #content>
-      <v-form
-        ref="form"
-        v-model="valid"
-      >
-        <h2>{{ $t('labels.importMessage1') }}</h2>
-        <v-sheet
-          v-if="exampleFormat"
-          :dark="!$vuetify.theme.dark"
-          :light="$vuetify.theme.dark"
-          class="mb-5 pa-5"
-        >
-          <pre>{{ exampleFormat }}</pre>
-        </v-sheet>
-        <h2>{{ $t('labels.importMessage2') }}</h2>
-        <v-file-input
-          v-model="file"
-          accept=".json"
-          :error-messages="errorMessage"
-          :label="$t('labels.filePlaceholder')"
-          :rules="uploadSingleFileRules($t('rules.uploadFileRules'))"
-          @change="$emit('clear')"
-          @click:clear="$emit('clear')"
-        />
-      </v-form>
-    </template>
-  </base-card>
-</template>
-
-<script lang="ts">
-import Vue from 'vue'
-import BaseCard from '@/components/utils/BaseCard.vue'
-import { uploadSingleFileRules } from '@/rules/index'
-
-export default Vue.extend({
-  components: {
-    BaseCard
-  },
-
-  props: {
-    errorMessage: {
-      type: String,
-      default: ''
-    }
-  },
-
-  data() {
-    return {
-      file: null,
-      valid: false,
-      uploadSingleFileRules,
-    }
-  },
-
-  computed: {
-    exampleFormat() {
-      const data = [
-        {
-          text: 'Dog',
-          suffix_key: 'a',
-          background_color: '#FF0000',
-          text_color: '#ffffff'
-        },
-        {
-          text: 'Cat',
-          suffix_key: 'c',
-          background_color: '#FF0000',
-          text_color: '#ffffff'
-        }
-      ]
-      return JSON.stringify(data, null, 4)
-    }
-  },
-
-  methods: {
-    cancel() {
-      (this.$refs.form as HTMLFormElement).reset()
-      this.$emit('cancel')
-    }
-  }
-})
-</script>
diff --git a/frontend/pages/projects/_id/labels/index.vue b/frontend/pages/projects/_id/labels/index.vue
index 3db16231..e15f59bb 100644
--- a/frontend/pages/projects/_id/labels/index.vue
+++ b/frontend/pages/projects/_id/labels/index.vue
@@ -7,7 +7,7 @@
     <v-card-title>
       <action-menu
         @create="$router.push('labels/add?type=' + labelType)"
-        @upload="dialogUpload=true"
+        @upload="$router.push('labels/import?type=' + labelType)"
         @download="download"
       />
       <v-btn
@@ -18,14 +18,6 @@
       >
         {{ $t('generic.delete') }}
       </v-btn>
-      <v-dialog v-model="dialogUpload">
-        <form-upload
-          :error-message="errorMessage"
-          @cancel="closeUpload"
-          @clear="clearErrorMessage"
-          @upload="upload"
-        />
-      </v-dialog>
       <v-dialog v-model="dialogDelete">
         <form-delete
           :selected="selected"
@@ -47,7 +39,6 @@
 import Vue from 'vue'
 import ActionMenu from '@/components/label/ActionMenu.vue'
 import FormDelete from '@/components/label/FormDelete.vue'
-import FormUpload from '@/components/label/FormUpload.vue'
 import LabelList from '@/components/label/LabelList.vue'
 import { LabelDTO } from '~/services/application/label/labelData'
 import { ProjectDTO } from '~/services/application/project/projectData'
@@ -57,7 +48,6 @@ export default Vue.extend({
   components: {
     ActionMenu,
     FormDelete,
-    FormUpload,
     LabelList
   },
   layout: 'project',
@@ -75,11 +65,9 @@ export default Vue.extend({
   data() {
     return {
       dialogDelete: false,
-      dialogUpload: false,
       items: [] as LabelDTO[],
       selected: [] as LabelDTO[],
       isLoading: false,
-      errorMessage: '',
       tab: null,
       project: {} as ProjectDTO,
     }
@@ -163,25 +151,6 @@ export default Vue.extend({
       await this.service.export(this.projectId)
     },
 
-    async upload(file: File) {
-      try {
-        await this.service.upload(this.projectId, file)
-        this.list()
-        this.closeUpload()
-      } catch(e) {
-        this.errorMessage = e.message
-      }
-    },
-
-    closeUpload() {
-      this.clearErrorMessage()
-      this.dialogUpload = false
-    },
-
-    clearErrorMessage() {
-      this.errorMessage = ''
-    },
-
     editItem(item: LabelDTO) {
       this.$router.push(`labels/${item.id}/edit?type=${this.labelType}`)
     }