Add share manage dialog

frontend/src/components/ShareDomain/ShareUsageDialog.vue

@@ -0,0 +1,56 @@
+<template>
+  <share-domain-dialog
+    :dialogTitle="`「${domain.name}」のドメイン利用権限設定`"
+    userListTitle="ドメイン利用権限を持つユーザー"
+    :domain="domain"
+    :share-api="shareApi"
+    :remove-shared-api="removeSharedApi"
+    :get-shared-api="getSharedApi"
+    :model-value="modelValue"
+    @update:modelValue="updateModelValue"
+    @close="close"
+  />
+</template>
+
+<script setup lang="ts">
+import { defineProps, defineEmits } from 'vue';
+import ShareDomainDialog from 'components/ShareDomain/ShareDomainDialog.vue';
+import { IUserDisplay } from '../../types/UserTypes';
+import { IDomainOwnerDisplay } from '../../types/DomainTypes';
+import { api } from 'boot/axios';
+
+interface Props {
+  modelValue: boolean;
+  domain: IDomainOwnerDisplay;
+}
+
+const props = defineProps<Props>();
+
+async function shareApi(user: IUserDisplay, domain: IDomainOwnerDisplay) {
+  return api.post(`api/userdomain`, {
+    userid: user.id,
+    domainid: domain.id,
+  });
+}
+
+async function removeSharedApi(user: IUserDisplay, domain: IDomainOwnerDisplay) {
+  return api.delete(`api/domain/${domain.id}/${user.id}`);
+}
+
+async function getSharedApi(domain: IDomainOwnerDisplay) {
+  return api.get(`/api/domainshareduser/${domain.id}`);
+}
+
+const emit = defineEmits<{
+  (e: 'update:modelValue', value: boolean): void;
+  (e: 'close'): void;
+}>();
+
+const updateModelValue = (value: boolean) => {
+  emit('update:modelValue', value);
+};
+
+const close = () => {
+  emit('close');
+};
+</script>