表示を調整

traPtitech · Dec 3, 2023 · 70adb1d · 70adb1d
1 parent 11a6df1
commit 70adb1d
Show file tree

Hide file tree

Showing 8 changed files with 10 additions and 12 deletions.
diff --git a/src/components/Modal/Common/ModalFrame.vue b/src/components/Modal/Common/ModalFrame.vue
@@ -28,7 +28,7 @@ import { useModalStore } from '/@/store/ui/modal'
 withDefaults(
   defineProps<{
     iconMdi?: boolean
-    iconName: string
+    iconName?: string
     title: string
     subtitle?: string
     returnButton?: boolean

diff --git a/src/components/Modal/Common/ModalHeader.vue b/src/components/Modal/Common/ModalHeader.vue
@@ -3,7 +3,7 @@
     <modal-return-button v-if="returnButton" :class="$style.returnButton" />
     <div :class="$style.content">
       <h1 :class="$style.title">
-        <a-icon :class="$style.icon" :name="iconName" :mdi="iconMdi" />{{
+        <a-icon v-if="iconName" :class="$style.icon" :name="iconName" :mdi="iconMdi" />{{
           title
         }}
       </h1>
@@ -19,7 +19,7 @@ import ModalReturnButton from './ModalReturnButton.vue'
 withDefaults(
   defineProps<{
     iconMdi?: boolean
-    iconName: string
+    iconName?: string
     title: string
     subtitle?: string
     returnButton?: boolean

diff --git a/src/components/Modal/StampCreateModal/StampCreateModal.vue b/src/components/Modal/StampCreateModal/StampCreateModal.vue
@@ -1,5 +1,5 @@
 <template>
-  <modal-frame title="新規スタンプ登録" icon-name="">
+  <modal-frame title="新規スタンプ登録">
     <div :class="$style.container">
       <div :class="$style.leftContainer">
         <button :class="$style.imgButton" @click="selectImage">

diff --git a/src/components/Modal/StampEditModal/StampEditModal.vue b/src/components/Modal/StampEditModal/StampEditModal.vue
@@ -1,5 +1,5 @@
 <template>
-  <modal-frame title="スタンプ編集" icon-name="">
+  <modal-frame title="スタンプ編集">
     <div :class="$style.container">
       <div :class="$style.leftContainer">
         <button :class="$style.imgButton" @click="selectImage">

diff --git a/src/components/Modal/StampImageEditModal/StampImageEditModal.vue b/src/components/Modal/StampImageEditModal/StampImageEditModal.vue
@@ -2,7 +2,6 @@
   <modal-frame
     title="スタンプ画像の編集"
     subtitle="画像の位置・サイズを編集できます"
-    icon-name=""
   >
     <div :class="$style.container">
       <image-upload v-model="stampImage" />

diff --git a/src/components/Settings/StampTab/StampContextMenu.vue b/src/components/Settings/StampTab/StampContextMenu.vue
@@ -1,7 +1,7 @@
 <template>
   <context-menu-container :position="position" @close="close">
     <div :class="$style.container">
-      <button :class="$style.button" @click="withClose(updateStampImage)">
+      <button :class="$style.button" @click="updateStampImage">
         <a-icon name="file-image" mdi />
         スタンプ画像を更新する
       </button>
@@ -53,12 +53,12 @@ const withClose = async (func: () => void | Promise<void>) => {
 }
 
 const { selectImage } = useFileSelect({ accept: acceptImageType }, files => {
-  //FIXME: 先にclose()してinput要素が消えちゃうから実行されない
   if (!files[0]) return
   pushModal({
     type: 'settings-stamp-image-edit',
     file: files[0]
   })
+  close()
 })
 
 const updateStampImage = () => {

diff --git a/src/components/Settings/StampTab/StampManagement.vue b/src/components/Settings/StampTab/StampManagement.vue
@@ -28,10 +28,10 @@
       />
     </div>
     <div
+      v-if="currentTab === 'myStamp'"
       :id="myStampPanelId"
       :class="$style.content"
       role="tabpanel"
-      :hidden="currentTab !== 'myStamp'"
     >
       <p v-if="myStamps.length === 0">所有しているスタンプはありません</p>
       <stamp-item
@@ -42,11 +42,10 @@
       />
     </div>
     <div
-      v-if="hasChannelEditPermission"
+      v-if="hasChannelEditPermission && currentTab === 'otherStamp'"
       :id="otherStampPanelId"
       :class="$style.content"
       role="tabpanel"
-      :hidden="currentTab !== 'otherStamp'"
     >
       <stamp-item
         v-for="stamp in otherStamps"

diff --git a/src/components/UI/FormButton.vue b/src/components/UI/FormButton.vue
@@ -106,7 +106,7 @@ const spinnerColor = computed(() => {
 .label {
   display: flex;
   align-items: center;
-  gap: 12px;
+  gap: 8px;
   margin: 8px 32px;
   .container[data-is-loading] & {
     visibility: hidden;