From 35bccd6c87fb2a2849965c648b9f64ba3cef3805 Mon Sep 17 00:00:00 2001 From: limseohyeon <104908845+limseohyeon@users.noreply.github.com> Date: Sun, 5 Jan 2025 19:43:49 +0900 Subject: [PATCH 1/2] =?UTF-8?q?feat:=20=EA=B4=80=EB=A6=AC=EC=9E=90=20?= =?UTF-8?q?=ED=9A=8C=EC=9B=90=20=EA=B4=80=EB=A6=AC=ED=94=84=EB=A1=A0?= =?UTF-8?q?=ED=8A=B8=20=EC=88=98=EC=A0=95?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../admin/controller/AdminWebController.java | 4 +- .../resources/static/css/admin/detail.css | 462 +++++++++++++++ src/main/resources/static/css/admin/list.css | 422 +++++--------- .../resources/static/css/admin/withdrawal.css | 525 ++++++++++++++++++ .../resources/templates/admin/detail.html | 72 ++- src/main/resources/templates/admin/list.html | 75 ++- src/main/resources/templates/admin/main.html | 6 + .../resources/templates/admin/withdrawal.html | 112 ++-- .../templates/fragments/adminHeader.html | 38 ++ 9 files changed, 1348 insertions(+), 368 deletions(-) create mode 100644 src/main/resources/static/css/admin/detail.css create mode 100644 src/main/resources/static/css/admin/withdrawal.css create mode 100644 src/main/resources/templates/fragments/adminHeader.html diff --git a/src/main/java/org/programmers/signalbuddy/domain/admin/controller/AdminWebController.java b/src/main/java/org/programmers/signalbuddy/domain/admin/controller/AdminWebController.java index 4b4e82af..8b5e76be 100644 --- a/src/main/java/org/programmers/signalbuddy/domain/admin/controller/AdminWebController.java +++ b/src/main/java/org/programmers/signalbuddy/domain/admin/controller/AdminWebController.java @@ -1,6 +1,7 @@ package org.programmers.signalbuddy.domain.admin.controller; import lombok.RequiredArgsConstructor; +import lombok.extern.slf4j.Slf4j; import org.programmers.signalbuddy.domain.admin.dto.AdminMemberResponse; import org.programmers.signalbuddy.domain.admin.dto.WithdrawalMemberResponse; import org.programmers.signalbuddy.domain.admin.service.AdminService; @@ -13,6 +14,7 @@ import org.springframework.web.bind.annotation.RequestMapping; import org.springframework.web.servlet.ModelAndView; +@Slf4j @Controller @RequiredArgsConstructor @RequestMapping("/admins") @@ -37,7 +39,7 @@ public ModelAndView getAllMembers(@PageableDefault(page = 0, size = 10, sort = " public ModelAndView getMember(@PathVariable Long id, ModelAndView mv) { final AdminMemberResponse member = adminService.getMember(id); mv.setViewName("admin/detail"); - mv.addObject("member", member); + mv.addObject("m", member); return mv; } diff --git a/src/main/resources/static/css/admin/detail.css b/src/main/resources/static/css/admin/detail.css new file mode 100644 index 00000000..a9d4a1df --- /dev/null +++ b/src/main/resources/static/css/admin/detail.css @@ -0,0 +1,462 @@ +@import url(https://fonts.googleapis.com/css2?family=Lato&display=swap); + +@import url(https://fonts.googleapis.com/css2?family=Open+Sans&display=swap); + +/*! tailwindcss v3.4.11 | MIT License | https://tailwindcss.com*/ +*, +:after, +:before { + border: 0 solid #e5e7eb; + box-sizing: border-box; +} +:after, +:before { + --tw-content: ""; +} +:host, +html { + line-height: 1.5; + -webkit-text-size-adjust: 100%; + font-family: + Open Sans, + ui-sans-serif, + system-ui, + sans-serif, + Apple Color Emoji, + Segoe UI Emoji, + Segoe UI Symbol, + Noto Color Emoji; + font-feature-settings: normal; + font-variation-settings: normal; + -moz-tab-size: 4; + tab-size: 4; + -webkit-tap-highlight-color: transparent; +} +body { + line-height: inherit; + margin: 0; +} +hr { + border-top-width: 1px; + color: inherit; + height: 0; +} +abbr:where([title]) { + text-decoration: underline dotted; +} +h1, +h2, +h3, +h4, +h5, +h6 { + font-size: inherit; + font-weight: inherit; +} +a { + color: inherit; + text-decoration: inherit; +} +b, +strong { + font-weight: bolder; +} +code, +kbd, +pre, +samp { + font-family: + ui-monospace, + SFMono-Regular, + Menlo, + Monaco, + Consolas, + Liberation Mono, + Courier New, + monospace; + font-feature-settings: normal; + font-size: 1em; + font-variation-settings: normal; +} +small { + font-size: 80%; +} +sub, +sup { + font-size: 75%; + line-height: 0; + position: relative; + vertical-align: baseline; +} +sub { + bottom: -0.25em; +} +sup { + top: -0.5em; +} +table { + border-collapse: collapse; + border-color: inherit; + text-indent: 0; +} +button, +input, +optgroup, +select, +textarea { + color: inherit; + font-family: inherit; + font-feature-settings: inherit; + font-size: 100%; + font-variation-settings: inherit; + font-weight: inherit; + letter-spacing: inherit; + line-height: inherit; + margin: 0; + padding: 0; +} +button, +select { + text-transform: none; +} +button, +input:where([type="button"]), +input:where([type="reset"]), +input:where([type="submit"]) { + -webkit-appearance: button; + background-color: transparent; + background-image: none; +} +:-moz-focusring { + outline: auto; +} +:-moz-ui-invalid { + box-shadow: none; +} +progress { + vertical-align: baseline; +} +::-webkit-inner-spin-button, +::-webkit-outer-spin-button { + height: auto; +} +[type="search"] { + -webkit-appearance: textfield; + outline-offset: -2px; +} +::-webkit-search-decoration { + -webkit-appearance: none; +} +::-webkit-file-upload-button { + -webkit-appearance: button; + font: inherit; +} +summary { + display: list-item; +} +blockquote, +dd, +dl, +figure, +h1, +h2, +h3, +h4, +h5, +h6, +hr, +p, +pre { + margin: 0; +} +fieldset { + margin: 0; +} +fieldset, +legend { + padding: 0; +} +menu, +ol, +ul { + list-style: none; + margin: 0; + padding: 0; +} +dialog { + padding: 0; +} +textarea { + resize: vertical; +} +input::placeholder, +textarea::placeholder { + color: #9ca3af; + opacity: 1; +} +[role="button"], +button { + cursor: pointer; +} +:disabled { + cursor: default; +} +audio, +canvas, +embed, +iframe, +img, +object, +svg, +video { + display: block; + vertical-align: middle; +} +img, +video { + height: auto; + max-width: 100%; +} +[hidden] { + display: none; +} +*, +:after, +:before { + --tw-border-spacing-x: 0; + --tw-border-spacing-y: 0; + --tw-translate-x: 0; + --tw-translate-y: 0; + --tw-rotate: 0; + --tw-skew-x: 0; + --tw-skew-y: 0; + --tw-scale-x: 1; + --tw-scale-y: 1; + --tw-pan-x: ; + --tw-pan-y: ; + --tw-pinch-zoom: ; + --tw-scroll-snap-strictness: proximity; + --tw-gradient-from-position: ; + --tw-gradient-via-position: ; + --tw-gradient-to-position: ; + --tw-ordinal: ; + --tw-slashed-zero: ; + --tw-numeric-figure: ; + --tw-numeric-spacing: ; + --tw-numeric-fraction: ; + --tw-ring-inset: ; + --tw-ring-offset-width: 0px; + --tw-ring-offset-color: #fff; + --tw-ring-color: rgba(59, 130, 246, 0.5); + --tw-ring-offset-shadow: 0 0 #0000; + --tw-ring-shadow: 0 0 #0000; + --tw-shadow: 0 0 #0000; + --tw-shadow-colored: 0 0 #0000; + --tw-blur: ; + --tw-brightness: ; + --tw-contrast: ; + --tw-grayscale: ; + --tw-hue-rotate: ; + --tw-invert: ; + --tw-saturate: ; + --tw-sepia: ; + --tw-drop-shadow: ; + --tw-backdrop-blur: ; + --tw-backdrop-brightness: ; + --tw-backdrop-contrast: ; + --tw-backdrop-grayscale: ; + --tw-backdrop-hue-rotate: ; + --tw-backdrop-invert: ; + --tw-backdrop-opacity: ; + --tw-backdrop-saturate: ; + --tw-backdrop-sepia: ; + --tw-contain-size: ; + --tw-contain-layout: ; + --tw-contain-paint: ; + --tw-contain-style: ; +} +::backdrop { + --tw-border-spacing-x: 0; + --tw-border-spacing-y: 0; + --tw-translate-x: 0; + --tw-translate-y: 0; + --tw-rotate: 0; + --tw-skew-x: 0; + --tw-skew-y: 0; + --tw-scale-x: 1; + --tw-scale-y: 1; + --tw-pan-x: ; + --tw-pan-y: ; + --tw-pinch-zoom: ; + --tw-scroll-snap-strictness: proximity; + --tw-gradient-from-position: ; + --tw-gradient-via-position: ; + --tw-gradient-to-position: ; + --tw-ordinal: ; + --tw-slashed-zero: ; + --tw-numeric-figure: ; + --tw-numeric-spacing: ; + --tw-numeric-fraction: ; + --tw-ring-inset: ; + --tw-ring-offset-width: 0px; + --tw-ring-offset-color: #fff; + --tw-ring-color: rgba(59, 130, 246, 0.5); + --tw-ring-offset-shadow: 0 0 #0000; + --tw-ring-shadow: 0 0 #0000; + --tw-shadow: 0 0 #0000; + --tw-shadow-colored: 0 0 #0000; + --tw-blur: ; + --tw-brightness: ; + --tw-contrast: ; + --tw-grayscale: ; + --tw-hue-rotate: ; + --tw-invert: ; + --tw-saturate: ; + --tw-sepia: ; + --tw-drop-shadow: ; + --tw-backdrop-blur: ; + --tw-backdrop-brightness: ; + --tw-backdrop-contrast: ; + --tw-backdrop-grayscale: ; + --tw-backdrop-hue-rotate: ; + --tw-backdrop-invert: ; + --tw-backdrop-opacity: ; + --tw-backdrop-saturate: ; + --tw-backdrop-sepia: ; + --tw-contain-size: ; + --tw-contain-layout: ; + --tw-contain-paint: ; + --tw-contain-style: ; +} +#webcrumbs .mt-2 { + margin-top: 8px; +} +#webcrumbs .mt-4 { + margin-top: 16px; +} +#webcrumbs .mt-6 { + margin-top: 24px; +} +#webcrumbs .flex { + display: flex; +} +#webcrumbs .h-\[120px\] { + height: 120px; +} +#webcrumbs .w-\[120px\] { + width: 120px; +} +#webcrumbs .w-\[200px\] { + width: 200px; +} +#webcrumbs .w-\[500px\] { + width: 500px; +} +#webcrumbs .flex-1 { + flex: 1 1 0%; +} +#webcrumbs .flex-row { + flex-direction: row; +} +#webcrumbs .flex-col { + flex-direction: column; +} +#webcrumbs .items-center { + align-items: center; +} +#webcrumbs .justify-between { + justify-content: space-between; +} +#webcrumbs .gap-2 { + gap: 8px; +} +#webcrumbs .gap-4 { + gap: 16px; +} +#webcrumbs .rounded-full { + border-radius: 9999px; +} +#webcrumbs .rounded-lg { + border-radius: 24px; +} +#webcrumbs .border-b { + border-bottom-width: 1px; +} +#webcrumbs .border-neutral-300 { + --tw-border-opacity: 1; + border-color: rgb(202 202 202 / var(--tw-border-opacity)); +} +#webcrumbs .bg-neutral-200 { + --tw-bg-opacity: 1; + background-color: rgb(224 224 224 / var(--tw-bg-opacity)); +} +#webcrumbs .bg-white { + --tw-bg-opacity: 1; + background-color: rgb(255 255 255 / var(--tw-bg-opacity)); +} +#webcrumbs .object-cover { + object-fit: cover; +} +#webcrumbs .p-4 { + padding: 16px; +} +#webcrumbs .p-6 { + padding: 24px; +} +#webcrumbs .py-2 { + padding-bottom: 8px; + padding-top: 8px; +} +#webcrumbs .text-center { + text-align: center; +} +#webcrumbs .font-title { + font-family: + Lato, + ui-sans-serif, + system-ui, + sans-serif, + Apple Color Emoji, + Segoe UI Emoji, + Segoe UI Symbol, + Noto Color Emoji; +} +#webcrumbs .text-lg { + font-size: 18px; + line-height: 27px; +} +#webcrumbs .text-sm { + font-size: 14px; + line-height: 21px; +} +#webcrumbs .text-neutral-950 { + --tw-text-opacity: 1; + color: rgb(40 40 40 / var(--tw-text-opacity)); +} +#webcrumbs .shadow-lg { + --tw-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), + 0 4px 6px -4px rgba(0, 0, 0, 0.1); + --tw-shadow-colored: 0 10px 15px -3px var(--tw-shadow-color), + 0 4px 6px -4px var(--tw-shadow-color); + box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), + var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow); +} +#webcrumbs { + font-family: Open Sans !important; + font-size: 16px !important; +} +#webcrumbs :is(.bg-neutral-200) { + color: rgba(0, 0, 0, 0.9) !important; +} + +#user { + line-height: inherit; + padding: 24px; + display: flex; + flex-direction: column; + min-width: 80vw; + min-height: 100vh; + align-items: center; + justify-content: center; + background: linear-gradient(135deg, #ffffff, #d4d4d4); +} \ No newline at end of file diff --git a/src/main/resources/static/css/admin/list.css b/src/main/resources/static/css/admin/list.css index f890baf4..13c0433e 100644 --- a/src/main/resources/static/css/admin/list.css +++ b/src/main/resources/static/css/admin/list.css @@ -1,6 +1,4 @@ -@import url(https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:opsz,wght,FILL,GRAD@20..48,100..700,0..1,-50..200); - -@import url(https://fonts.googleapis.com/css2?family=Nunito&display=swap); +@import url(https://fonts.googleapis.com/css2?family=Lato&display=swap); @import url(https://fonts.googleapis.com/css2?family=Open+Sans&display=swap); @@ -11,53 +9,41 @@ border: 0 solid #e5e7eb; box-sizing: border-box; } - :after, :before { --tw-content: ""; } - :host, html { line-height: 1.5; -webkit-text-size-adjust: 100%; - font-family: Nunito, - ui-sans-serif, - system-ui, - sans-serif, - Apple Color Emoji, - Segoe UI Emoji, - Segoe UI Symbol, - Noto Color Emoji; + font-family: + Open Sans, + ui-sans-serif, + system-ui, + sans-serif, + Apple Color Emoji, + Segoe UI Emoji, + Segoe UI Symbol, + Noto Color Emoji; font-feature-settings: normal; font-variation-settings: normal; -moz-tab-size: 4; tab-size: 4; -webkit-tap-highlight-color: transparent; - --tw-shadow-color: rgba(0, 0, 0, 0.5); } - body { line-height: inherit; margin: 0; } - -main { - width: 100%; - justify-self: center; - gap: 70px; -} - hr { border-top-width: 1px; color: inherit; height: 0; } - abbr:where([title]) { text-decoration: underline dotted; } - h1, h2, h3, @@ -67,38 +53,34 @@ h6 { font-size: inherit; font-weight: inherit; } - a { color: inherit; text-decoration: inherit; } - b, strong { font-weight: bolder; } - code, kbd, pre, samp { - font-family: ui-monospace, - SFMono-Regular, - Menlo, - Monaco, - Consolas, - Liberation Mono, - Courier New, - monospace; + font-family: + ui-monospace, + SFMono-Regular, + Menlo, + Monaco, + Consolas, + Liberation Mono, + Courier New, + monospace; font-feature-settings: normal; font-size: 1em; font-variation-settings: normal; } - small { font-size: 80%; } - sub, sup { font-size: 75%; @@ -106,21 +88,17 @@ sup { position: relative; vertical-align: baseline; } - sub { bottom: -0.25em; } - sup { top: -0.5em; } - table { border-collapse: collapse; border-color: inherit; text-indent: 0; } - button, input, optgroup, @@ -137,12 +115,10 @@ textarea { margin: 0; padding: 0; } - button, select { text-transform: none; } - button, input:where([type="button"]), input:where([type="reset"]), @@ -151,42 +127,33 @@ input:where([type="submit"]) { background-color: transparent; background-image: none; } - :-moz-focusring { outline: auto; } - :-moz-ui-invalid { box-shadow: none; } - progress { vertical-align: baseline; } - ::-webkit-inner-spin-button, ::-webkit-outer-spin-button { height: auto; } - [type="search"] { -webkit-appearance: textfield; outline-offset: -2px; } - ::-webkit-search-decoration { -webkit-appearance: none; } - ::-webkit-file-upload-button { -webkit-appearance: button; font: inherit; } - summary { display: list-item; } - blockquote, dd, dl, @@ -202,16 +169,13 @@ p, pre { margin: 0; } - fieldset { margin: 0; } - fieldset, legend { padding: 0; } - menu, ol, ul { @@ -219,30 +183,24 @@ ul { margin: 0; padding: 0; } - dialog { padding: 0; } - textarea { resize: vertical; } - input::placeholder, textarea::placeholder { color: #9ca3af; opacity: 1; } - [role="button"], button { cursor: pointer; } - :disabled { cursor: default; } - audio, canvas, embed, @@ -254,17 +212,14 @@ video { display: block; vertical-align: middle; } - img, video { height: auto; max-width: 100%; } - [hidden] { display: none; } - *, :after, :before { @@ -320,7 +275,6 @@ video { --tw-contain-paint: ; --tw-contain-style: ; } - ::backdrop { --tw-border-spacing-x: 0; --tw-border-spacing-y: 0; @@ -374,299 +328,197 @@ video { --tw-contain-paint: ; --tw-contain-style: ; } - -.mx-2 { - margin-left: 8px; - margin-right: 8px; -} - -.mx-auto { - margin-left: auto; - margin-right: auto; -} - -.mb-1 { - margin-bottom: 4px; -} - -.mb-4 { - margin-bottom: 16px; -} - -.mb-6 { +#webcrumbs .mb-6 { margin-bottom: 24px; } - -.mb-8 { - margin-bottom: 32px; -} - -.ml-6 { - margin-left: 24px; -} - -.mt-6 { - margin-top: 24px; -} -.mt-7 { - margin-top: 15px; -} - -.flex { +#webcrumbs .flex { display: flex; } - -.h-4 { - height: 16px; -} - -.h-\[100px\] { - height: 100px; -} - -.min-h-\[800px\] { - min-height: 800px; +#webcrumbs .w-\[1200px\] { + width: 1200px; } - -.w-\[100px\] { - width: 100px; +#webcrumbs .w-\[300px\] { + width: 300px; } - -.w-\[1200px\] { - width: 1200px; +#webcrumbs .w-full { + width: 100%; } - -.w-\[1440px\] { - width: 1440px; +#webcrumbs .w-max { + width: 100vw; } - -.w-\[250px\] { - width: 250px; +#webcrumbs .w-img{ + width: 10px; } - -.w-full { - width: 100%; +#webcrumbs .h-img{ + width: 10px; } -.flex-1 { +#webcrumbs .flex-1 { flex: 1 1 0%; } - -.flex-row { +#webcrumbs .flex-row { flex-direction: row; } - -.flex-col { +#webcrumbs .flex-col { flex-direction: column; } - -.items-center { +#webcrumbs .items-center { align-items: center; } - -.justify-center { - justify-content: center; -} - -.justify-between { +#webcrumbs .justify-between { justify-content: space-between; } - -.gap-4 { +#webcrumbs .gap-4 { gap: 16px; } - -:is(.space-x-2 > :not([hidden]) ~ :not([hidden])) { - --tw-space-x-reverse: 0; - margin-left: calc(8px * (1 - var(--tw-space-x-reverse))); - margin-right: calc(8px * var(--tw-space-x-reverse)); +#webcrumbs .gap-6 { + gap: 24px; } - -:is(.space-x-4 > :not([hidden]) ~ :not([hidden])) { - --tw-space-x-reverse: 0; - margin-left: calc(16px * (1 - var(--tw-space-x-reverse))); - margin-right: calc(16px * var(--tw-space-x-reverse)); -} - -:is(.space-y-4 > :not([hidden]) ~ :not([hidden])) { - --tw-space-y-reverse: 0; - margin-bottom: calc(16px * var(--tw-space-y-reverse)); - margin-top: calc(16px * (1 - var(--tw-space-y-reverse))); -} - -.rounded-full { - border-radius: 9999px; -} - -.rounded-lg { - border-radius: 16px; +#webcrumbs .overflow-x-auto { + overflow-x: auto; } - -.rounded-md { - border-radius: 12px; +#webcrumbs .rounded-lg { + border-radius: 24px; } - -.border { - border-width: 1px; +#webcrumbs .rounded-md { + border-radius: 18px; } - -.border-l { - border-left-width: 1px; +#webcrumbs .bg-black { + --tw-bg-opacity: 1; + background-color: rgb(0 0 0 / var(--tw-bg-opacity)); } - -.border-neutral-300 { - --tw-border-opacity: 1; - border-color: rgb(117 138 170 / var(--tw-border-opacity)); +#webcrumbs .bg-neutral-200 { + --tw-bg-opacity: 1; + background-color: rgb(224 224 224 / var(--tw-bg-opacity)); } - -.bg-neutral-100 { +#webcrumbs .bg-neutral-50 { --tw-bg-opacity: 1; - background-color: rgb(243 242 242 / var(--tw-bg-opacity)); + background-color: rgb(247 247 247 / var(--tw-bg-opacity)); } - -.bg-neutral-200 { +#webcrumbs .bg-neutral-800 { --tw-bg-opacity: 1; - background-color: rgb(235 234 234 / var(--tw-bg-opacity)); + background-color: rgb(84 84 84 / var(--tw-bg-opacity)); } - -.bg-neutral-300 { +#webcrumbs .bg-neutral-950 { --tw-bg-opacity: 1; - background-color: rgb(228 227 227 / var(--tw-bg-opacity)); + background-color: rgb(40 40 40 / var(--tw-bg-opacity)); } - -.bg-neutral-950 { +#webcrumbs .bg-primary-500 { --tw-bg-opacity: 1; - background-color: #486284; + background-color: rgb(115 65 255 / var(--tw-bg-opacity)); } - -.bg-white { +#webcrumbs .bg-white { --tw-bg-opacity: 1; background-color: rgb(255 255 255 / var(--tw-bg-opacity)); } - -.p-2 { - padding: 8px; +#webcrumbs .p-4 { + padding: 16px; } - -.p-5 { - padding: 20px; +#webcrumbs .p-6 { + padding: 24px; } - -.p-8 { - padding: 32px; -} - -.px-4 { +#webcrumbs .px-4 { padding-left: 16px; padding-right: 16px; } - -.px-6 { +#webcrumbs .px-6 { padding-left: 24px; padding-right: 24px; } - -.py-1 { - padding-bottom: 4px; - padding-top: 4px; -} - -.py-10 { - padding-bottom: 40px; - padding-top: 40px; -} - -.py-2 { +#webcrumbs .py-2 { padding-bottom: 8px; padding-top: 8px; } - -.py-4 { +#webcrumbs .py-4 { padding-bottom: 16px; padding-top: 16px; } - -.font-title { - font-family: Nunito, - ui-sans-serif, - system-ui, - sans-serif, - Apple Color Emoji, - Segoe UI Emoji, - Segoe UI Symbol, - Noto Color Emoji; -} - -.text-lg { +#webcrumbs .text-left { + text-align: left; +} +#webcrumbs .font-title { + font-family: + Lato, + ui-sans-serif, + system-ui, + sans-serif, + Apple Color Emoji, + Segoe UI Emoji, + Segoe UI Symbol, + Noto Color Emoji; +} +#webcrumbs .text-lg { font-size: 18px; line-height: 27px; } - -.text-sm { - font-size: 14px; - line-height: 21px; -} - -.text-xl { +#webcrumbs .text-xl { font-size: 20px; line-height: 28px; } - -.text-neutral-50 { +#webcrumbs .text-neutral-300 { --tw-text-opacity: 1; - color: rgb(250 249 249 / var(--tw-text-opacity)); + color: rgb(202 202 202 / var(--tw-text-opacity)); } - -.text-neutral-600 { +#webcrumbs .text-neutral-50 { --tw-text-opacity: 1; - color: rgb(100 100 100 / var(--tw-text-opacity)); + color: rgb(247 247 247 / var(--tw-text-opacity)); } - -.text-neutral-950 { +#webcrumbs .text-neutral-950 { --tw-text-opacity: 1; - color: #486284; - /*color: rgb(10 10 10 / var(--tw-text-opacity));*/ + color: rgb(40 40 40 / var(--tw-text-opacity)); } - -.shadow { - --tw-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px -1px rgba(0, 0, 0, 0.1); - --tw-shadow-colored: 0 1px 3px 0 var(--tw-shadow-color), - 0 1px 2px -1px var(--tw-shadow-color); +#webcrumbs .text-primary-50 { + --tw-text-opacity: 1; + color: rgb(243 241 255 / var(--tw-text-opacity)); +} +#webcrumbs .text-white { + --tw-text-opacity: 1; + color: rgb(255 255 255 / var(--tw-text-opacity)); +} +#webcrumbs .shadow-lg { + --tw-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), + 0 4px 6px -4px rgba(0, 0, 0, 0.1); + --tw-shadow-colored: 0 10px 15px -3px var(--tw-shadow-color), + 0 4px 6px -4px var(--tw-shadow-color); box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow); } - -:is(.bg-neutral-100) { - color: rgba(0, 0, 0, 0.9) !important; +#webcrumbs { + font-family: Open Sans !important; + font-size: 16px !important; } - -:is(.bg-neutral-200) { +#webcrumbs :is(.bg-neutral-50) { color: rgba(0, 0, 0, 0.9) !important; } - -:is(.bg-neutral-300) { +#webcrumbs :is(.bg-neutral-200) { color: rgba(0, 0, 0, 0.9) !important; } - -.text-white { - color: #ffffff; -} -.sidebar { - width: 250px; - height: 150vh; - background-color: #f8f9fa; - position: fixed; - top: 80px; - left: 0; - padding-top: 20px; -} -.sidebar a { - padding: 10px 15px; - text-decoration: none; - display: block; - color: #333; +#webcrumbs :is(.bg-neutral-800) { + color: hsla(0, 0%, 100%, 0.9) !important; +} +#webcrumbs :is(.bg-neutral-950) { + color: hsla(0, 0%, 100%, 0.9) !important; +} +#webcrumbs :is(.bg-primary-500) { + color: hsla(0, 0%, 100%, 0.9) !important; } -.sidebar a:hover { - background-color: #e9ecef; - color: #000; +#webcrumbs .hover\:bg-neutral-100:hover { + --tw-bg-opacity: -800; + background-color: rgb(245 245 245 / var(--tw-bg-opacity)); +} +#webcrumbs .hover\:bg-neutral-200:hover { + --tw-bg-opacity: 1; + background-color: rgb(150 150 150 / var(--tw-bg-opacity)); +} +body { + line-height: inherit; + padding: 24px; + display: flex; + flex-direction: column; + min-width: 100vw; + min-height: 100vh; + height: 300px; + align-items: center; + justify-content: center; + background: linear-gradient(135deg, #ffffff, #d4d4d4); } \ No newline at end of file diff --git a/src/main/resources/static/css/admin/withdrawal.css b/src/main/resources/static/css/admin/withdrawal.css new file mode 100644 index 00000000..d9966eff --- /dev/null +++ b/src/main/resources/static/css/admin/withdrawal.css @@ -0,0 +1,525 @@ +@import url(https://fonts.googleapis.com/css2?family=Lato&display=swap); + +@import url(https://fonts.googleapis.com/css2?family=Open+Sans&display=swap); + +/*! tailwindcss v3.4.11 | MIT License | https://tailwindcss.com*/ +*, +:after, +:before { + border: 0 solid #e5e7eb; + box-sizing: border-box; +} +:after, +:before { + --tw-content: ""; +} +:host, +html { + line-height: 1.5; + -webkit-text-size-adjust: 100%; + font-family: + Open Sans, + ui-sans-serif, + system-ui, + sans-serif, + Apple Color Emoji, + Segoe UI Emoji, + Segoe UI Symbol, + Noto Color Emoji; + font-feature-settings: normal; + font-variation-settings: normal; + -moz-tab-size: 4; + tab-size: 4; + -webkit-tap-highlight-color: transparent; +} +body { + line-height: inherit; + margin: 0; +} +hr { + border-top-width: 1px; + color: inherit; + height: 0; +} +abbr:where([title]) { + text-decoration: underline dotted; +} +h1, +h2, +h3, +h4, +h5, +h6 { + font-size: inherit; + font-weight: inherit; +} +a { + color: inherit; + text-decoration: inherit; +} +b, +strong { + font-weight: bolder; +} +code, +kbd, +pre, +samp { + font-family: + ui-monospace, + SFMono-Regular, + Menlo, + Monaco, + Consolas, + Liberation Mono, + Courier New, + monospace; + font-feature-settings: normal; + font-size: 1em; + font-variation-settings: normal; +} +small { + font-size: 80%; +} +sub, +sup { + font-size: 75%; + line-height: 0; + position: relative; + vertical-align: baseline; +} +sub { + bottom: -0.25em; +} +sup { + top: -0.5em; +} +table { + border-collapse: collapse; + border-color: inherit; + text-indent: 0; +} +button, +input, +optgroup, +select, +textarea { + color: inherit; + font-family: inherit; + font-feature-settings: inherit; + font-size: 100%; + font-variation-settings: inherit; + font-weight: inherit; + letter-spacing: inherit; + line-height: inherit; + margin: 0; + padding: 0; +} +button, +select { + text-transform: none; +} +button, +input:where([type="button"]), +input:where([type="reset"]), +input:where([type="submit"]) { + -webkit-appearance: button; + background-color: transparent; + background-image: none; +} +:-moz-focusring { + outline: auto; +} +:-moz-ui-invalid { + box-shadow: none; +} +progress { + vertical-align: baseline; +} +::-webkit-inner-spin-button, +::-webkit-outer-spin-button { + height: auto; +} +[type="search"] { + -webkit-appearance: textfield; + outline-offset: -2px; +} +::-webkit-search-decoration { + -webkit-appearance: none; +} +::-webkit-file-upload-button { + -webkit-appearance: button; + font: inherit; +} +summary { + display: list-item; +} +blockquote, +dd, +dl, +figure, +h1, +h2, +h3, +h4, +h5, +h6, +hr, +p, +pre { + margin: 0; +} +fieldset { + margin: 0; +} +fieldset, +legend { + padding: 0; +} +menu, +ol, +ul { + list-style: none; + margin: 0; + padding: 0; +} +dialog { + padding: 0; +} +textarea { + resize: vertical; +} +input::placeholder, +textarea::placeholder { + color: #9ca3af; + opacity: 1; +} +[role="button"], +button { + cursor: pointer; +} +:disabled { + cursor: default; +} +audio, +canvas, +embed, +iframe, +img, +object, +svg, +video { + display: block; + vertical-align: middle; +} +img, +video { + height: auto; + max-width: 100%; +} +[hidden] { + display: none; +} +*, +:after, +:before { + --tw-border-spacing-x: 0; + --tw-border-spacing-y: 0; + --tw-translate-x: 0; + --tw-translate-y: 0; + --tw-rotate: 0; + --tw-skew-x: 0; + --tw-skew-y: 0; + --tw-scale-x: 1; + --tw-scale-y: 1; + --tw-pan-x: ; + --tw-pan-y: ; + --tw-pinch-zoom: ; + --tw-scroll-snap-strictness: proximity; + --tw-gradient-from-position: ; + --tw-gradient-via-position: ; + --tw-gradient-to-position: ; + --tw-ordinal: ; + --tw-slashed-zero: ; + --tw-numeric-figure: ; + --tw-numeric-spacing: ; + --tw-numeric-fraction: ; + --tw-ring-inset: ; + --tw-ring-offset-width: 0px; + --tw-ring-offset-color: #fff; + --tw-ring-color: rgba(59, 130, 246, 0.5); + --tw-ring-offset-shadow: 0 0 #0000; + --tw-ring-shadow: 0 0 #0000; + --tw-shadow: 0 0 #0000; + --tw-shadow-colored: 0 0 #0000; + --tw-blur: ; + --tw-brightness: ; + --tw-contrast: ; + --tw-grayscale: ; + --tw-hue-rotate: ; + --tw-invert: ; + --tw-saturate: ; + --tw-sepia: ; + --tw-drop-shadow: ; + --tw-backdrop-blur: ; + --tw-backdrop-brightness: ; + --tw-backdrop-contrast: ; + --tw-backdrop-grayscale: ; + --tw-backdrop-hue-rotate: ; + --tw-backdrop-invert: ; + --tw-backdrop-opacity: ; + --tw-backdrop-saturate: ; + --tw-backdrop-sepia: ; + --tw-contain-size: ; + --tw-contain-layout: ; + --tw-contain-paint: ; + --tw-contain-style: ; +} +::backdrop { + --tw-border-spacing-x: 0; + --tw-border-spacing-y: 0; + --tw-translate-x: 0; + --tw-translate-y: 0; + --tw-rotate: 0; + --tw-skew-x: 0; + --tw-skew-y: 0; + --tw-scale-x: 1; + --tw-scale-y: 1; + --tw-pan-x: ; + --tw-pan-y: ; + --tw-pinch-zoom: ; + --tw-scroll-snap-strictness: proximity; + --tw-gradient-from-position: ; + --tw-gradient-via-position: ; + --tw-gradient-to-position: ; + --tw-ordinal: ; + --tw-slashed-zero: ; + --tw-numeric-figure: ; + --tw-numeric-spacing: ; + --tw-numeric-fraction: ; + --tw-ring-inset: ; + --tw-ring-offset-width: 0px; + --tw-ring-offset-color: #fff; + --tw-ring-color: rgba(59, 130, 246, 0.5); + --tw-ring-offset-shadow: 0 0 #0000; + --tw-ring-shadow: 0 0 #0000; + --tw-shadow: 0 0 #0000; + --tw-shadow-colored: 0 0 #0000; + --tw-blur: ; + --tw-brightness: ; + --tw-contrast: ; + --tw-grayscale: ; + --tw-hue-rotate: ; + --tw-invert: ; + --tw-saturate: ; + --tw-sepia: ; + --tw-drop-shadow: ; + --tw-backdrop-blur: ; + --tw-backdrop-brightness: ; + --tw-backdrop-contrast: ; + --tw-backdrop-grayscale: ; + --tw-backdrop-hue-rotate: ; + --tw-backdrop-invert: ; + --tw-backdrop-opacity: ; + --tw-backdrop-saturate: ; + --tw-backdrop-sepia: ; + --tw-contain-size: ; + --tw-contain-layout: ; + --tw-contain-paint: ; + --tw-contain-style: ; +} +#webcrumbs .mb-6 { + margin-bottom: 24px; +} +#webcrumbs .flex { + display: flex; +} +#webcrumbs .w-\[1200px\] { + width: 1200px; +} +#webcrumbs .w-\[300px\] { + width: 300px; +} +#webcrumbs .w-full { + width: 100%; +} +#webcrumbs .w-max { + width: 100vw; +} +#webcrumbs .w-img{ + width: 10px; +} +#webcrumbs .h-img{ + width: 10px; +} +#webcrumbs .h-max{ + height: 800px; +} +#webcrumbs .flex-1 { + flex: 1 1 0%; +} +#webcrumbs .flex-row { + flex-direction: row; +} +#webcrumbs .flex-col { + flex-direction: column; +} +#webcrumbs .items-center { + align-items: center; +} +#webcrumbs .justify-between { + justify-content: space-between; +} +#webcrumbs .gap-4 { + gap: 16px; +} +#webcrumbs .gap-6 { + gap: 24px; +} +#webcrumbs .overflow-x-auto { + overflow-x: auto; +} +#webcrumbs .rounded-lg { + border-radius: 24px; +} +#webcrumbs .rounded-md { + border-radius: 18px; +} +#webcrumbs .bg-black { + --tw-bg-opacity: 1; + background-color: rgb(0 0 0 / var(--tw-bg-opacity)); +} +#webcrumbs .bg-neutral-200 { + --tw-bg-opacity: 1; + background-color: rgb(224 224 224 / var(--tw-bg-opacity)); +} +#webcrumbs .bg-neutral-50 { + --tw-bg-opacity: 1; + background-color: rgb(247 247 247 / var(--tw-bg-opacity)); +} +#webcrumbs .bg-neutral-800 { + --tw-bg-opacity: 1; + background-color: rgb(84 84 84 / var(--tw-bg-opacity)); +} +#webcrumbs .bg-neutral-950 { + --tw-bg-opacity: 1; + background-color: rgb(40 40 40 / var(--tw-bg-opacity)); +} +#webcrumbs .bg-primary-500 { + --tw-bg-opacity: 1; + background-color: rgb(115 65 255 / var(--tw-bg-opacity)); +} +#webcrumbs .bg-white { + --tw-bg-opacity: 1; + background-color: rgb(255 255 255 / var(--tw-bg-opacity)); +} +#webcrumbs .p-4 { + padding: 16px; +} +#webcrumbs .p-6 { + padding: 24px; +} +#webcrumbs .px-4 { + padding-left: 16px; + padding-right: 16px; +} +#webcrumbs .px-6 { + padding-left: 24px; + padding-right: 24px; +} +#webcrumbs .py-2 { + padding-bottom: 8px; + padding-top: 8px; +} +#webcrumbs .py-4 { + padding-bottom: 16px; + padding-top: 16px; +} +#webcrumbs .text-left { + text-align: left; +} +#webcrumbs .font-title { + font-family: + Lato, + ui-sans-serif, + system-ui, + sans-serif, + Apple Color Emoji, + Segoe UI Emoji, + Segoe UI Symbol, + Noto Color Emoji; +} +#webcrumbs .text-lg { + font-size: 18px; + line-height: 27px; +} +#webcrumbs .text-xl { + font-size: 20px; + line-height: 28px; +} +#webcrumbs .text-neutral-300 { + --tw-text-opacity: 1; + color: rgb(202 202 202 / var(--tw-text-opacity)); +} +#webcrumbs .text-neutral-50 { + --tw-text-opacity: 1; + color: rgb(247 247 247 / var(--tw-text-opacity)); +} +#webcrumbs .text-neutral-950 { + --tw-text-opacity: 1; + color: rgb(40 40 40 / var(--tw-text-opacity)); +} +#webcrumbs .text-primary-50 { + --tw-text-opacity: 1; + color: rgb(243 241 255 / var(--tw-text-opacity)); +} +#webcrumbs .text-white { + --tw-text-opacity: 1; + color: rgb(255 255 255 / var(--tw-text-opacity)); +} +#webcrumbs .shadow-lg { + --tw-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), + 0 4px 6px -4px rgba(0, 0, 0, 0.1); + --tw-shadow-colored: 0 10px 15px -3px var(--tw-shadow-color), + 0 4px 6px -4px var(--tw-shadow-color); + box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), + var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow); +} +#webcrumbs { + font-family: Open Sans !important; + font-size: 16px !important; +} +#webcrumbs :is(.bg-neutral-50) { + color: rgba(0, 0, 0, 0.9) !important; +} +#webcrumbs :is(.bg-neutral-200) { + color: rgba(0, 0, 0, 0.9) !important; +} +#webcrumbs :is(.bg-neutral-800) { + color: hsla(0, 0%, 100%, 0.9) !important; +} +#webcrumbs :is(.bg-neutral-950) { + color: hsla(0, 0%, 100%, 0.9) !important; +} +#webcrumbs :is(.bg-primary-500) { + color: hsla(0, 0%, 100%, 0.9) !important; +} +#webcrumbs .hover\:bg-neutral-100:hover { + --tw-bg-opacity: -800; + background-color: rgb(245 245 245 / var(--tw-bg-opacity)); +} +#webcrumbs .hover\:bg-neutral-200:hover { + --tw-bg-opacity: 1; + background-color: rgb(150 150 150 / var(--tw-bg-opacity)); +} +body { + line-height: inherit; + padding: 24px; + display: flex; + flex-direction: column; + min-width: 100vw; + height: 100vh; + align-items: center; + justify-content: center; + background: linear-gradient(135deg, #ffffff, #d4d4d4); +} \ No newline at end of file diff --git a/src/main/resources/templates/admin/detail.html b/src/main/resources/templates/admin/detail.html index f18cbcc8..863a3bf1 100644 --- a/src/main/resources/templates/admin/detail.html +++ b/src/main/resources/templates/admin/detail.html @@ -2,27 +2,67 @@ + 사용자 상세 조회 - - + + + + +
+
+
+ + +
Signal Buddy
+
+ +
+
+ +
+
+
+ Profile +

+

+

-
-
- -

-

-

-
-
- - - - -
+
+
+

+ 즐겨찾기 목록 +

+
+
+
+
+ +
+
+
+
+
diff --git a/src/main/resources/templates/admin/list.html b/src/main/resources/templates/admin/list.html index 1e97d9ec..c03be989 100644 --- a/src/main/resources/templates/admin/list.html +++ b/src/main/resources/templates/admin/list.html @@ -1,19 +1,68 @@ - + - - - 전체 사용자 조회 - - - - - - - + + + My Webcrumbs Plugin + + + - + +
+
+
+ + +
Signal Buddy
+
+ +
+
+ +
+
+ + + + + + + + + + + + + + + + + +
프로필이름회원 지역즐겨찾기 개수
+ Avatar +
+
+
+
+
+
- + \ No newline at end of file diff --git a/src/main/resources/templates/admin/main.html b/src/main/resources/templates/admin/main.html index 90640fa4..d9fbbcc4 100644 --- a/src/main/resources/templates/admin/main.html +++ b/src/main/resources/templates/admin/main.html @@ -50,5 +50,11 @@

회원 정보 관리

+======= + Title + + +

main.html

+>>>>>>> Stashed changes \ No newline at end of file diff --git a/src/main/resources/templates/admin/withdrawal.html b/src/main/resources/templates/admin/withdrawal.html index 316d435b..1a9b1b09 100644 --- a/src/main/resources/templates/admin/withdrawal.html +++ b/src/main/resources/templates/admin/withdrawal.html @@ -1,62 +1,68 @@ - + - - - 탈퇴 사용자 조회 - - - - - - - - + + + 탈퇴 회원 관리 + + - - - + +
+
+
+ + +
Signal Buddy
+
+ +
+
+ +
+
+ + + + + + + + + - + + + + + + -
-
프로필이름요청 날짜삭제 요청
+ Avatar +
- - - - - - - - - -
- -
- - - - - + + +
프로필이름요청 날짜삭제 요청
- -
+
+
- - - - +
+
- + \ No newline at end of file diff --git a/src/main/resources/templates/fragments/adminHeader.html b/src/main/resources/templates/fragments/adminHeader.html new file mode 100644 index 00000000..ee7d00b5 --- /dev/null +++ b/src/main/resources/templates/fragments/adminHeader.html @@ -0,0 +1,38 @@ + + + + + + + + +
+
+ + +
Signal Buddy
+
+ +
+
From 2b57e39a177da2a2b2c4cc86ab7e2f52d4ee433b Mon Sep 17 00:00:00 2001 From: limseohyeon <104908845+limseohyeon@users.noreply.github.com> Date: Sun, 5 Jan 2025 22:00:30 +0900 Subject: [PATCH 2/2] =?UTF-8?q?refactor:=20=EB=B0=98=ED=99=98=20=EC=A1=B0?= =?UTF-8?q?=EA=B1=B4=20=EC=88=98=EC=A0=95?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../domain/admin/service/AdminService.java | 2 +- .../repository/CustomMemberRepository.java | 2 ++ .../CustomMemberRepositoryImpl.java | 23 +++++++++++++++++++ 3 files changed, 26 insertions(+), 1 deletion(-) diff --git a/src/main/java/org/programmers/signalbuddy/domain/admin/service/AdminService.java b/src/main/java/org/programmers/signalbuddy/domain/admin/service/AdminService.java index 44a6f77d..678129d2 100644 --- a/src/main/java/org/programmers/signalbuddy/domain/admin/service/AdminService.java +++ b/src/main/java/org/programmers/signalbuddy/domain/admin/service/AdminService.java @@ -33,7 +33,7 @@ public class AdminService { private BCryptPasswordEncoder bCryptPasswordEncoder = new BCryptPasswordEncoder(); public Page getAllMembers(Pageable pageable) { - Page membersPage = memberRepository.findAll(pageable); + Page membersPage = memberRepository.findAllMembers(pageable); Page adminMemberResponses = membersPage.map(member -> { diff --git a/src/main/java/org/programmers/signalbuddy/domain/member/repository/CustomMemberRepository.java b/src/main/java/org/programmers/signalbuddy/domain/member/repository/CustomMemberRepository.java index 97d636ce..a2ec6e5c 100644 --- a/src/main/java/org/programmers/signalbuddy/domain/member/repository/CustomMemberRepository.java +++ b/src/main/java/org/programmers/signalbuddy/domain/member/repository/CustomMemberRepository.java @@ -1,9 +1,11 @@ package org.programmers.signalbuddy.domain.member.repository; import org.programmers.signalbuddy.domain.admin.dto.WithdrawalMemberResponse; +import org.programmers.signalbuddy.domain.member.entity.Member; import org.springframework.data.domain.Page; import org.springframework.data.domain.Pageable; public interface CustomMemberRepository { + Page findAllMembers(Pageable pageable); Page findAllWithdrawMembers(Pageable pageable); } diff --git a/src/main/java/org/programmers/signalbuddy/domain/member/repository/CustomMemberRepositoryImpl.java b/src/main/java/org/programmers/signalbuddy/domain/member/repository/CustomMemberRepositoryImpl.java index b10250f4..91fd4104 100644 --- a/src/main/java/org/programmers/signalbuddy/domain/member/repository/CustomMemberRepositoryImpl.java +++ b/src/main/java/org/programmers/signalbuddy/domain/member/repository/CustomMemberRepositoryImpl.java @@ -8,6 +8,9 @@ import java.util.List; import lombok.RequiredArgsConstructor; import org.programmers.signalbuddy.domain.admin.dto.WithdrawalMemberResponse; +import org.programmers.signalbuddy.domain.member.entity.Member; +import org.programmers.signalbuddy.domain.member.entity.QMember; +import org.programmers.signalbuddy.domain.member.entity.enums.MemberRole; import org.programmers.signalbuddy.domain.member.entity.enums.MemberStatus; import org.springframework.data.domain.Page; import org.springframework.data.domain.PageImpl; @@ -22,8 +25,28 @@ public class CustomMemberRepositoryImpl implements CustomMemberRepository { WithdrawalMemberResponse.class, member.memberId, member.email, member.nickname, member.profileImageUrl, member.role, member.memberStatus, member.createdAt, member.updatedAt); + private static final QMember qmember= QMember.member; + private final JPAQueryFactory jpaQueryFactory; + @Override + public Page findAllMembers(Pageable pageable) { + List members = jpaQueryFactory + .select(qmember) + .from(member) + .where(member.role.eq(MemberRole.USER)) + .offset(pageable.getOffset()) + .limit(pageable.getPageSize()) + .fetch(); + + long total = jpaQueryFactory + .select(qmember) + .from(member) + .where(member.role.eq(MemberRole.USER)) + .fetchCount(); + + return new PageImpl<>(members, pageable, total); + } @Override public Page findAllWithdrawMembers(Pageable pageable) {