Commit @64935c733b56926fa6b03bec01fe27af207675d3

kimgkdud898 2023-11-21

231121김하영

@64935c733b56926fa6b03bec01fe27af207675d3

24c78cd

64935c7

client/resources/css/Main.css

--- client/resources/css/Main.css

+++ client/resources/css/Main.css


 .main-notice h2 i {
   margin-right: 1rem;
 }
-
+.m-p-table table tr td p:nth-child(1) {
+  text-align: left;
+}
 .modal-content iframe {
   height: 300px;
 }

 .modal-content-box > p {
   margin-bottom: 1.5rem;
 }
-
+.main-popup {
+  position: fixed;
+  top: 20%;
+  right: 40%;
+  width: 300px;
+  /* height: 200px; */
+  margin: 0 auto;
+  text-align: center;
+  z-index: 1;
+  border-radius: 2rem;
+  box-shadow: 1px 1px 10px #3a3a3a;
+}
+.main-popup-div {
+  background-color: white;
+  border-radius: 2rem;
+}
+.main-popup img {
+  width: 100%;
+  /* margin: 2rem; */
+  border-top-right-radius: 2rem;
+  border-top-left-radius: 2rem;
+}
+.main-popup-div div:nth-child(2) {
+  text-align: right;
+  padding: 2rem;
+}
 .modal-news-title {
   font-size: 2rem;
   font-weight: 600;

24c78cd

64935c7

client/views/pages/user/main/Main.vue

--- client/views/pages/user/main/Main.vue

+++ client/views/pages/user/main/Main.vue


 
         </div>
     </div>
+
+
+
+    <div class="main-popup" v-if="showPopup">
+        <div class="main-popup-div">
+
+            <div><img src="../../../../resources/jpg/main-popup-img.jpg" alt=""></div>
+            <div>
+                <input type="checkbox" v-model="doNotShow">오늘 하루동안 열지 않기
+
+            </div>
+        </div>
+    </div>
 </template>
 
 <script>

             noticeList: [],
             noticeListForBanner: [],
             swiper: null,
+            showPopup: true,
+            doNotShow: false
         }
     },
     methods: {
+        openWindow() {
+            window.open('', '팝업창', 'width=300, height=200, left=0, top=0, toolbar=no, menubar=no, scrollbars=yes, resizable=no');
+        },
         showAlert: function () {
             alert('페이지 준비중입니다.');
         },

 
     },
     watch: {
-
+        doNotShow(newValue) {
+            if (newValue) {
+                this.showPopup = false;
+                localStorage.setItem('doNotShow', true);
+            }
+        }
     },
     computed: {
 

         this.noticeListForMain();
         this.noticeBannerListForMain();
         this.initSwiper();
+        if (localStorage.getItem('doNotShow')) {
+            this.showPopup = false;
+        }
     }
 }
 </script>

Add a comment

Open 0
Closed 0

List

...	...	@@ -323,6 +323,19 @@
323	323
324	324	</div>
325	325	</div>
	326	+
	327	+
	328	+
	329	+ <div class="main-popup" v-if="showPopup">
	330	+ <div class="main-popup-div">
	331	+
	332	+ <div><img src="../../../../resources/jpg/main-popup-img.jpg" alt=""></div>
	333	+ <div>
	334	+ <input type="checkbox" v-model="doNotShow">오늘 하루동안 열지 않기
	335	+
	336	+ </div>
	337	+ </div>
	338	+ </div>
326	339	</template>
327	340
328	341	<script>
...	...	@@ -355,9 +368,14 @@
355	368	noticeList: [],
356	369	noticeListForBanner: [],
357	370	swiper: null,
	371	+ showPopup: true,
	372	+ doNotShow: false
358	373	}
359	374	},
360	375	methods: {
	376	+ openWindow() {
	377	+ window.open('', '팝업창', 'width=300, height=200, left=0, top=0, toolbar=no, menubar=no, scrollbars=yes, resizable=no');
	378	+ },
361	379	showAlert: function () {
362	380	alert('페이지 준비중입니다.');
363	381	},
...	...	@@ -469,7 +487,12 @@
469	487
470	488	},
471	489	watch: {
472		-
	490	+ doNotShow(newValue) {
	491	+ if (newValue) {
	492	+ this.showPopup = false;
	493	+ localStorage.setItem('doNotShow', true);
	494	+ }
	495	+ }
473	496	},
474	497	computed: {
475	498
...	...	@@ -489,6 +512,9 @@
489	512	this.noticeListForMain();
490	513	this.noticeBannerListForMain();
491	514	this.initSwiper();
	515	+ if (localStorage.getItem('doNotShow')) {
	516	+ this.showPopup = false;
	517	+ }
492	518	}
493	519	}
494	520	</script>

...	...	@@ -69,7 +69,9 @@
69	69	.main-notice h2 i {
70	70	margin-right: 1rem;
71	71	}
72		-
	72	+.m-p-table table tr td p:nth-child(1) {
	73	+ text-align: left;
	74	+}
73	75	.modal-content iframe {
74	76	height: 300px;
75	77	}
...	...	@@ -82,7 +84,32 @@
82	84	.modal-content-box > p {
83	85	margin-bottom: 1.5rem;
84	86	}
85		-
	87	+.main-popup {
	88	+ position: fixed;
	89	+ top: 20%;
	90	+ right: 40%;
	91	+ width: 300px;
	92	+ /* height: 200px; */
	93	+ margin: 0 auto;
	94	+ text-align: center;
	95	+ z-index: 1;
	96	+ border-radius: 2rem;
	97	+ box-shadow: 1px 1px 10px #3a3a3a;
	98	+}
	99	+.main-popup-div {
	100	+ background-color: white;
	101	+ border-radius: 2rem;
	102	+}
	103	+.main-popup img {
	104	+ width: 100%;
	105	+ /* margin: 2rem; */
	106	+ border-top-right-radius: 2rem;
	107	+ border-top-left-radius: 2rem;
	108	+}
	109	+.main-popup-div div:nth-child(2) {
	110	+ text-align: right;
	111	+ padding: 2rem;
	112	+}
86	113	.modal-news-title {
87	114	font-size: 2rem;
88	115	font-weight: 600;

Delete comment