From af77632da56deb4c911a8c6aa79079c6ad4d3e55 Mon Sep 17 00:00:00 2001
From: xue jiahao <hsuehchiahao@gmail.com>
Date: Mon, 25 Nov 2024 12:53:02 +0800
Subject: [PATCH] Some ts interface fix

---
 frontend/src/components/DomainSelector.vue | 14 ++--
 frontend/src/pages/TenantDomain.vue        | 81 +++++++---------------
 frontend/src/stores/useAuthStore.ts        |  2 +-
 frontend/src/stores/useDomainStore.ts      | 23 ++++++
 frontend/src/types/ActionTypes.ts          |  5 --
 frontend/src/types/AppTypes.ts             |  6 +-
 frontend/src/types/DomainTypes.ts          | 35 ++++++++++
 frontend/src/types/UserTypes.ts            |  8 +++
 8 files changed, 101 insertions(+), 73 deletions(-)
 create mode 100644 frontend/src/stores/useDomainStore.ts
 create mode 100644 frontend/src/types/DomainTypes.ts
 create mode 100644 frontend/src/types/UserTypes.ts

diff --git a/frontend/src/components/DomainSelector.vue b/frontend/src/components/DomainSelector.vue
index d6fcf91..1369480 100644
--- a/frontend/src/components/DomainSelector.vue
+++ b/frontend/src/components/DomainSelector.vue
@@ -27,15 +27,19 @@
 
 </template>
 <script setup lang="ts" >
-import { IDomainInfo } from 'src/types/ActionTypes';
-import { useAuthStore,IUserState } from 'stores/useAuthStore';
-import { ref, computed } from 'vue';
+import { IDomainInfo } from 'src/types/DomainTypes';
+import { useAuthStore } from 'stores/useAuthStore';
+import { useDomainStore } from 'src/stores/useDomainStore';
+import { computed } from 'vue';
 import { useRoute } from 'vue-router';
+
 const userStore = useAuthStore();
+const domainStore = useDomainStore();
 const route = useRoute()
-const domains = ref<IDomainInfo[]>([]);
+const domains = computed(() => domainStore.userDomains);
+
 (async ()=>{
-  domains.value = await userStore.getUserDomains();
+  await domainStore.loadUserDomains();
 })();
 
 const isUnclickable = computed(()=>{
diff --git a/frontend/src/pages/TenantDomain.vue b/frontend/src/pages/TenantDomain.vue
index 7af3320..6d663a8 100644
--- a/frontend/src/pages/TenantDomain.vue
+++ b/frontend/src/pages/TenantDomain.vue
@@ -18,10 +18,10 @@
       </template>
 
       <template v-slot:body-cell-name="p">
-        <q-td :props="p">
+        <q-td class="flex justify-between items-center" :props="p">
           {{ p.row.name }}
           <q-badge v-if="!p.row.domainActive" color="grey">未启用</q-badge>
-          <q-badge v-if="p.row.id == tenantid" color="primary">現在</q-badge>
+          <q-badge v-if="p.row.id == currendDomainId" color="primary">現在</q-badge>
         </q-td>
       </template>
 
@@ -129,34 +129,14 @@
 </template>
 
 <script setup lang="ts">
-import { ref, onMounted, reactive } from 'vue';
+import { ref, onMounted, computed } from 'vue';
 import { api } from 'boot/axios';
 import { useAuthStore } from 'stores/useAuthStore';
-
-type IManagedDomain = {
-  id: number;
-  tenantid: string;
-  name: string;
-  url: string;
-  kintoneuser: string,
-  kintonepwd: string,
-  create_time: string;
-  update_time: string;
-  is_active: boolean;
-  owner: object
-}
-
-type IDomainDisplay = {
-  id: number;
-  tenantid: string;
-  name: string;
-  url: string;
-  user: string;
-  password: string;
-  domainActive: boolean;
-}
+import { useDomainStore } from 'stores/useDomainStore';
+import { IDomain, IDomainDisplay, IDomainSubmit } from '../types/DomainTypes';
 
 const authStore = useAuthStore();
+const domainStore = useDomainStore();
 const inactiveRowClass = (row: IDomainDisplay) => row.domainActive ? '' : 'inactive-row';
 
 const columns = [
@@ -185,6 +165,7 @@ const show = ref(false);
 const confirm = ref(false);
 const resetPsw = ref(false);
 
+const currendDomainId = computed(() => authStore.currentDomain.id);
 const tenantid = ref(authStore.currentDomain.id);
 const name = ref('');
 const url = ref('');
@@ -195,11 +176,12 @@ const kintonepwdBK = ref('');
 const domainActive = ref(true);
 const isCreate = ref(true);
 let editId = ref(0);
+let ownerid = ref('');
 
 const getDomain = async () => {
   loading.value = true;
   const userId = authStore.userId;
-  const result = await api.get<IManagedDomain[]>(`api/domain?userId=${userId}`);
+  const result = await api.get<IDomain[]>(`api/domain?userId=${userId}`);
   rows.value = result.data.map((item) => {
     return {
       id: item.id,
@@ -208,7 +190,7 @@ const getDomain = async () => {
       name: item.name,
       url: item.url,
       user: item.kintoneuser,
-      password: item.kintonepwd
+      password: item.kintonepwd,
     }
   });
   loading.value = false;
@@ -266,39 +248,23 @@ const closeDg = () => {
 }
 
 const onSubmit = () => {
-  if (!isCreate.value && editId.value !== 0) {
-    api.put(`api/domain`, {
-      'id': editId.value,
-      'tenantid': tenantid.value,
-      'name': name.value,
-      'url': url.value,
-      'kintoneuser': kintoneuser.value,
-      'kintonepwd': isCreate.value || resetPsw.value ? kintonepwd.value : '',
-      'is_active': domainActive.value,
-      'ownerid': authStore.userId,
-    }).then(() => {
+  const method = editId.value !== 0 ? 'put' : 'post';
+  const param: IDomainSubmit = {
+    'id': editId.value,
+    'tenantid': tenantid.value,
+    'name': name.value,
+    'url': url.value,
+    'kintoneuser': kintoneuser.value,
+    'kintonepwd': ((isCreate.value && editId.value == 0) || resetPsw.value) ? kintonepwd.value : '',
+    'is_active': domainActive.value,
+    'ownerid': authStore.userId || ''
+  }
+  api[method].apply(api, [`api/domain`, param]).then(() => {
       getDomain();
+      domainStore.loadUserDomains();
       closeDg();
       onReset();
     })
-  }
-  else {
-    api.post(`api/domain`, {
-      'id': 0,
-      'tenantid': tenantid.value,
-      'name': name.value,
-      'url': url.value,
-      'kintoneuser': kintoneuser.value,
-      'kintonepwd': kintonepwd.value,
-      'is_active': domainActive.value,
-      'ownerid': authStore.userId,
-    }).then(() => {
-      getDomain();
-      closeDg();
-      onReset();
-    })
-  }
-
 }
 
 const onReset = () => {
@@ -308,6 +274,7 @@ const onReset = () => {
   kintonepwd.value = '';
   isPwd.value = true;
   editId.value = 0;
+  ownerid.value = '';
   isCreate.value = true;
   domainActive.value = true;
   resetPsw.value = false
diff --git a/frontend/src/stores/useAuthStore.ts b/frontend/src/stores/useAuthStore.ts
index 1d8aff4..b7631bc 100644
--- a/frontend/src/stores/useAuthStore.ts
+++ b/frontend/src/stores/useAuthStore.ts
@@ -1,7 +1,7 @@
 import { defineStore } from 'pinia';
 import { api } from 'boot/axios';
 import { router } from 'src/router';
-import { IDomainInfo } from '../types/ActionTypes';
+import { IDomainInfo } from '../types/DomainTypes';
 import { jwtDecode } from 'jwt-decode';
 interface UserInfo {
   firstName: string;
diff --git a/frontend/src/stores/useDomainStore.ts b/frontend/src/stores/useDomainStore.ts
new file mode 100644
index 0000000..d5c64fa
--- /dev/null
+++ b/frontend/src/stores/useDomainStore.ts
@@ -0,0 +1,23 @@
+import { defineStore } from 'pinia';
+import { api } from 'boot/axios';
+import { IDomainInfo, IDomain } from '../types/DomainTypes';
+
+export const useDomainStore = defineStore('domain', {
+  state: () => ({
+    userDomains: [] as IDomainInfo[],
+  }),
+  actions: {
+    async loadUserDomains(): Promise<IDomainInfo[]> {
+      const resp = await api.get(`api/domain`);
+      const domains = resp.data as IDomain[];
+      this.userDomains = domains
+        .filter(data => data.is_active)
+        .map((data) => ({
+          id: data.id,
+          domainName: data.name,
+          kintoneUrl: data.url,
+        }));
+      return this.userDomains;
+    },
+  },
+});
diff --git a/frontend/src/types/ActionTypes.ts b/frontend/src/types/ActionTypes.ts
index 942a25d..3ccdce1 100644
--- a/frontend/src/types/ActionTypes.ts
+++ b/frontend/src/types/ActionTypes.ts
@@ -1,9 +1,4 @@
 import { v4 as uuidv4 } from 'uuid';
-export interface IDomainInfo{
-  id:number;
-  domainName:string;
-  kintoneUrl:string;
-}
 
 /**
  * アプリ情報
diff --git a/frontend/src/types/AppTypes.ts b/frontend/src/types/AppTypes.ts
index 4606f0d..496165c 100644
--- a/frontend/src/types/AppTypes.ts
+++ b/frontend/src/types/AppTypes.ts
@@ -1,8 +1,4 @@
-interface IUser {
-  first_name: string;
-  last_name: string;
-  email: string;
-}
+import { IUser } from './UserTypes';
 
 export interface IManagedApp {
   appid: string;
diff --git a/frontend/src/types/DomainTypes.ts b/frontend/src/types/DomainTypes.ts
new file mode 100644
index 0000000..380081f
--- /dev/null
+++ b/frontend/src/types/DomainTypes.ts
@@ -0,0 +1,35 @@
+import { IDomain } from './ActionTypes';
+import { IUser } from './UserTypes';
+
+export interface IDomainInfo {
+  id: number;
+  domainName: string;
+  kintoneUrl: string;
+}
+
+export interface IDomain {
+  id: number;
+  tenantid: string;
+  name: string;
+  url: string;
+  kintoneuser: string,
+  kintonepwd: string,
+  create_time: string;
+  update_time: string;
+  is_active: boolean;
+  owner: IUser
+}
+
+export interface IDomainSubmit extends Omit<IDomain, 'create_time' | 'update_time' | 'owner'> {
+  ownerid: string;
+}
+
+export interface IDomainDisplay {
+  id: number;
+  tenantid: string;
+  name: string;
+  url: string;
+  user: string;
+  password: string;
+  domainActive: boolean;
+}
\ No newline at end of file
diff --git a/frontend/src/types/UserTypes.ts b/frontend/src/types/UserTypes.ts
new file mode 100644
index 0000000..54250b2
--- /dev/null
+++ b/frontend/src/types/UserTypes.ts
@@ -0,0 +1,8 @@
+export interface IUser {
+  first_name: string;
+  last_name: string;
+  email: string;
+  is_active: boolean,
+  is_superuser: boolean,
+  roles: string[]
+}