add delete hint

frontend/src/pages/TenantDomain.vue

@@ -113,14 +113,23 @@
 
     <q-dialog v-model="confirm" persistent>
       <q-card>
-        <q-card-section class="row items-center">
+        <q-card-section v-if="deleteLoadingState == -1" class="row items-center">
+          <q-spinner color="primary" size="2em"/>
+          <span class="q-ml-sm">共有ユーザーのチェック</span>
+        </q-card-section>
+        <q-card-section v-else-if="deleteLoadingState == 0" class="row items-center">
           <q-icon name="warning" color="warning" size="2em" />
           <span class="q-ml-sm">削除してもよろしいですか？</span>
         </q-card-section>
+        <q-card-section v-else class="row items-center">
+          <q-icon name="error" color="negative" size="2em" />
+          <span class="q-ml-sm">共有ユーザーが存在し、キャンセルする必要がある</span>
+        </q-card-section>
 
         <q-card-actions align="right">
           <q-btn flat label="Cancel" color="primary" v-close-popup />
-          <q-btn flat label="OK" color="primary" v-close-popup @click="deleteDomain()" />
+          <q-btn v-if="deleteLoadingState > 0" label="処理に行く" color="primary" v-close-popup @click="openShareDg(editId)" />
+          <q-btn flat v-else label="OK" :disabled="deleteLoadingState" color="primary" v-close-popup @click="deleteDomain()" />
         </q-card-actions>
       </q-card>
     </q-dialog>
@@ -163,6 +172,8 @@ const columns = [
 const pagination = ref({ sortBy: 'id', descending: true, rowsPerPage: 20 });
 const loading = ref(false);
 const addEditLoading = ref(false);
+const deleteLoadingState = ref<number>(-1); // -1: loading, 0: allow, > 0: user count
+
 const filter = ref('');
 const rows = ref<IDomainDisplay[]>([]);
 const show = ref(false);
@@ -212,9 +223,13 @@ const addRow = () => {
   show.value = true;
 }
 
-const removeRow = (row: IDomainDisplay) => {
+const removeRow = async (row: IDomainDisplay) => {
   confirm.value = true;
+  deleteLoadingState.value = -1;
   editId.value = row.id;
+
+  const { data } = await api.get(`/api/domainshareduser/${row.id}`);
+  deleteLoadingState.value = data.data.length;
 }
 
 const deleteDomain = () => {
@@ -226,6 +241,7 @@ const deleteDomain = () => {
     // authStore.setCurrentDomain();
   })
   editId.value = 0; // set in removeRow()
+  deleteLoadingState.value = -1;
 };
 
 const editRow = (row) => {
@@ -278,8 +294,11 @@ const onSubmit = () => {
     })
 }
 
-const openShareDg = (row: IDomainDisplay) => {
-  shareDomain.value = row;
+const openShareDg = (row: IDomainDisplay|number) => {
+  if (typeof row === 'number') {
+    row = rows.value.find(item => item.id === row) as IDomainDisplay;
+  }
+  shareDomain.value = row ;
   shareDg.value = true;
 };