Merge pull request #416 from beyond-sw-camp/refactor/notification/#412

refactor: 알림 디자인 수정
beyond-sw-camp · Jan 2, 2025 · 12f76ef · 12f76ef
2 parents 22bbc27 + a62767e
commit 12f76ef
Show file tree

Hide file tree

Showing 7 changed files with 23 additions and 13 deletions.
diff --git a/SCM/frontend/src/components/common/Header.vue b/SCM/frontend/src/components/common/Header.vue
@@ -168,20 +168,23 @@ function chatbotOn() {
     <PurchaseOrderPrintPreviewModal
         :isVisible="isModalVisible"
         :purchaseOrder="selectedData"
+        :isList=false
         @close="closePrintPreview"
     />
   </template>
   <template v-else-if="selectedNotificationType === 'shipping-instruction'">
     <ShippingInstructionPrintPreview
         :isVisible="isModalVisible"
         :shippingInstruction="selectedData"
+        :isList=false
         @close="closePrintPreview"
     />
   </template>
   <template v-else-if="selectedNotificationType === 'shipping-slip'">
     <ShippingSlipPrintPreview
         :isVisible="isModalVisible"
         :shippingSlip="selectedData"
+        :isList=false
         @close="closePrintPreview"
     />
   </template>

diff --git a/SCM/frontend/src/components/purchaseOrder/PurchaseOrderList.vue b/SCM/frontend/src/components/purchaseOrder/PurchaseOrderList.vue
@@ -323,6 +323,7 @@ const itemDelete = async (seq) => {
   <PrintPreviewModal
       :isVisible="isModalVisible"
       :purchaseOrder="selectedPurchaseOrder"
+      :isList=true
       @close="closePrintPreview"
   />
 

diff --git a/SCM/frontend/src/components/purchaseOrder/PurchaseOrderPrintPreview.vue b/SCM/frontend/src/components/purchaseOrder/PurchaseOrderPrintPreview.vue
@@ -7,6 +7,7 @@ import Swal from "sweetalert2";
 const props = defineProps({
   isVisible: Boolean,
   purchaseOrder: Object,
+  isList: Boolean,
 });
 
 // 부모에서 넘어오는 발주서 시퀀스로 이미지를 가져옴
@@ -146,7 +147,7 @@ const clearCanvas = () => {
         <div class="modal-body" id="print-area-purchaseOrder">
           <div class="d-flex justify-content-between">
             <button class="btn-print" @click="printPage">출력</button>
-            <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close" @click="closePrintModal" ></button>
+            <button type="button" class="btn-close btn-print" data-bs-dismiss="modal" aria-label="Close" @click="closePrintModal" ></button>
           </div>
 
           <div class="container mt-4">
@@ -181,7 +182,9 @@ const clearCanvas = () => {
                   <img class="image-item" v-if="notification.notificationImageUrl != undefined" :src="notification.notificationImageUrl" alt="승인자 서명" style="width: 100px; height: auto;" />
                   <span v-else>
                     (서명 또는 인)
+                    <template v-if="!isList">
                      <input type="button" class="btn-print" @click="openModal(notification)" value="결재하기">
+                    </template>
                   </span>
 
 
@@ -324,8 +327,7 @@ const clearCanvas = () => {
   width: 100%;
   height: 100%;
   background-color: rgba(0, 0, 0, 0.7);
-  align-items: center;
-  justify-content: center;
+  overflow-y: scroll;
   z-index: 1000;
 }
 

diff --git a/SCM/frontend/src/components/shippingInstruction/ShippingInstructionList.vue b/SCM/frontend/src/components/shippingInstruction/ShippingInstructionList.vue
@@ -1,5 +1,5 @@
 <script setup>
-import {computed, defineProps, ref, watch} from 'vue';
+import {defineProps, ref, watch} from 'vue';
 import searchIcon from "@/assets/searchIcon.svg";
 import trashIcon from "@/assets/trashIcon.svg";
 import editIcon from "@/assets/editIcon.svg";
@@ -277,6 +277,7 @@ function numberThree(number) {
   <ShippingInstructionPrintPreview
       :isVisible="isModalVisible"
       :shippingInstruction="selectedShippingInstruction"
+      :isList=true
       @close="closePrintPreview"
   />
 </template>

diff --git a/SCM/frontend/src/components/shippingInstruction/ShippingInstructionPrintPreview.vue b/SCM/frontend/src/components/shippingInstruction/ShippingInstructionPrintPreview.vue
@@ -7,6 +7,7 @@ import Swal from "sweetalert2";
 const props = defineProps({
   isVisible: Boolean,
   shippingInstruction: Object,
+  isList: Boolean,
 });
 
 const seq = ref(null);
@@ -173,7 +174,7 @@ const clearCanvas = () => {
         <div class="modal-body" id="print-area">
           <div class="d-flex justify-content-between">
             <button class="btn-print" @click="printPage">출력</button>
-            <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close" @click="closePrintModal" ></button>
+            <button type="button" class="btn-close btn-print" data-bs-dismiss="modal" aria-label="Close" @click="closePrintModal" ></button>
           </div>
 
           <div class="container mt-4">
@@ -208,7 +209,9 @@ const clearCanvas = () => {
                   <img class="image-item" v-if="notification.notificationImageUrl != undefined" :src="notification.notificationImageUrl" alt="승인자 서명" style="width: 100px; height: auto;" />
                   <span v-else>
                     (서명 또는 인)
+                    <template v-if="!isList">
                      <input type="button" class="btn-print" @click="openModal(notification)" value="결재하기">
+                    </template>
                   </span>
 
 
@@ -345,8 +348,7 @@ const clearCanvas = () => {
   width: 100%;
   height: 100%;
   background-color: rgba(0, 0, 0, 0.7);
-  align-items: center;
-  justify-content: center;
+  overflow-y: scroll;
   z-index: 1000;
 }
 

diff --git a/SCM/frontend/src/components/shippingSlip/ShippingSlipList.vue b/SCM/frontend/src/components/shippingSlip/ShippingSlipList.vue
@@ -1,8 +1,6 @@
 <script setup>
-import {computed, defineProps, ref, watch} from 'vue';
+import {defineProps, ref, watch} from 'vue';
 import searchIcon from "@/assets/searchIcon.svg";
-import trashIcon from "@/assets/trashIcon.svg";
-import editIcon from "@/assets/editIcon.svg";
 import printIcon from "@/assets/printIcon.svg";
 import dayjs from "dayjs";
 import ShippingSlipPrintPreview from "@/components/shippingSlip/ShippingSlipPrintPreview.vue";
@@ -216,6 +214,7 @@ function numberThree(number) {
   <ShippingSlipPrintPreview
       :isVisible="isModalVisible"
       :shippingSlip="selectedShippingSlip"
+      :isList=true
       @close="closePrintPreview"
   />
 </template>

diff --git a/SCM/frontend/src/components/shippingSlip/ShippingSlipPrintPreview.vue b/SCM/frontend/src/components/shippingSlip/ShippingSlipPrintPreview.vue
@@ -7,6 +7,7 @@ import Swal from "sweetalert2";
 const props = defineProps({
   isVisible: Boolean,
   shippingSlip: Object,
+  isList: Boolean,
 });
 
 const seq = ref(null);
@@ -173,7 +174,7 @@ const clearCanvas = () => {
         <div class="modal-body" id="print-area">
           <div class="d-flex justify-content-between">
             <button class="btn-print" @click="printPage">출력</button>
-            <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close" @click="closePrintModal" ></button>
+            <button type="button" class="btn-close btn-print" data-bs-dismiss="modal" aria-label="Close" @click="closePrintModal" ></button>
           </div>
 
           <div class="container mt-4">
@@ -208,7 +209,9 @@ const clearCanvas = () => {
                   <img class="image-item" v-if="notification.notificationImageUrl != undefined" :src="notification.notificationImageUrl" alt="승인자 서명" style="width: 100px; height: auto;" />
                   <span v-else>
                     (서명 또는 인)
+                    <template v-if="!isList">
                      <input type="button" class="btn-print" @click="openModal(notification)" value="결재하기">
+                    </template>
                   </span>
 
 
@@ -345,8 +348,7 @@ const clearCanvas = () => {
   width: 100%;
   height: 100%;
   background-color: rgba(0, 0, 0, 0.7);
-  align-items: center;
-  justify-content: center;
+  overflow-y: scroll;
   z-index: 1000;
 }