fix api call result & some UI improve

frontend/src/components/DomainSelect.vue

@@ -11,7 +11,10 @@ export default {
   name: 'DomainSelect',
   props: {
     name: String,
-    type: String
+    type: String,
+    filterInitRowsFunc: {
+      type: Function,
+    },
   },
   setup() {
   const columns = [
@@ -26,6 +29,9 @@ export default {
       api.get(`api/domains`).then(res =>{
          res.data.data.forEach((item) =>
         {
+          if (props.filterInitRowsFunc && !props.filterInitRowsFunc(item)) {
+            return;
+          }
           rows.push({id:item.id,tenantid:item.tenantid,name:item.name,url:item.url,kintoneuser:item.kintoneuser});
         }
         )

frontend/src/pages/UserDomain.vue

@@ -14,14 +14,14 @@
 
         <q-space />
         <div class="row q-gutter-md">
-          <q-item v-if="authStore.permissions === 'admin'" tag="label" dense @click="clickSwitchUser()">
+          <!-- <q-item v-if="authStore.permissions === 'admin'" tag="label" dense @click="clickSwitchUser()">
             <q-item-section>
               <q-item-label>適用するユーザ : </q-item-label>
             </q-item-section>
             <q-item-section avatar>
               {{ currentUserName }}
             </q-item-section>
-          </q-item>
+          </q-item> -->
 
           <q-input borderless dense filled debounce="300" v-model="userDomainTableFilter" placeholder="Search">
             <template v-slot:append>
@@ -74,7 +74,7 @@
     </q-table>
 
     <show-dialog v-model:visible="showAddDomainDg" name="ドメイン" @close="addUserDomainFinished">
-      <domain-select ref="addDomainRef" name="ドメイン" type="multiple"></domain-select>
+      <domain-select ref="addDomainRef" name="ドメイン" type="single" :filterInitRowsFunc="filterInitRows"></domain-select>
     </show-dialog>
 
     <show-dialog v-model:visible="showSwitchUserDd" name="ドメイン" minWidth="35vw" @close="switchUserFinished">
@@ -131,6 +131,7 @@ import UserList from 'components/UserList.vue';
 const authStore = useAuthStore();
 const pagination = ref({ sortBy: 'id', rowsPerPage: 0 });
 const rows = ref([] as any[]);
+const rowIds = new Set<string>();
 const loading = ref(true);
 
 const columns = [
@@ -152,19 +153,19 @@ let editId = ref(0);
 const showAddDomainDg = ref(false);
 const addDomainRef = ref();
 
+const filterInitRows = (row: {id: string}) => {
+  return !rowIds.has(row.id);
+}
+
 const clickAddDomain = () => {
   editId.value = 0;
   showAddDomainDg.value = true;
 };
 
 const addUserDomainFinished = (val: string) => {
-  if (val == 'OK') {
+  const selected = addDomainRef.value.selected;
-    let dodmainids = [];
+  if (val == 'OK' && selected.length > 0) {
-    let domains = JSON.parse(JSON.stringify(addDomainRef.value.selected));
+    api.post(`api/domain/${useOtherUser.value ? otherUserId.value : authStore.userId}?domainid=${selected[0].id}`)
-    for (var key in domains) {
-      dodmainids.push(domains[key].id);
-    }
-    api.post(`api/domain/${useOtherUser.value ? otherUserId.value : authStore.userId}`, dodmainids)
       .then(() => { getDomain(useOtherUser.value ? otherUserId.value : undefined); });
   }
 };
@@ -221,11 +222,13 @@ const switchUserFinished = async (val: string) => {
 
 const getDomain = async (userId? : string) => {
   loading.value = true;
+  rowIds.clear();
   const resp = await api.get(`api/activedomain${useOtherUser.value ? `?userId=${otherUserId.value}` : ''}`);
   activeDomainId.value = resp?.data?.data?.id;
   const domainResult = userId ? await api.get(`api/domain?userId=${userId}`) : await api.get(`api/domain`);
   const domains = domainResult.data as any[];
   rows.value = domains.map((item) => {
+    rowIds.add(item.id);
     return { id: item.id, name: item.name, url: item.url, kintoneuser: item.kintoneuser, kintonepwd: item.kintonepwd }
   });
   loading.value = false;