From deada6d9b20c07d170444bb9dc68059060c5a436 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=EA=B9=80=ED=95=9C=EC=A3=BC?= <rlagkswn37@naver.com>
Date: Mon, 22 Jul 2024 10:59:51 +0900
Subject: [PATCH] =?UTF-8?q?[feat]=20=EB=AA=A8=EB=B0=94=EC=9D=BC=20?=
 =?UTF-8?q?=EA=B3=B5=ED=86=B5=20=EC=BB=B4=ED=8F=AC=EB=84=8C=ED=8A=B8=20?=
 =?UTF-8?q?=EA=B5=AC=ED=98=84?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/assets/scss/common.scss                |  6 +++
 src/components/common/btn/ThemeBtn.vue     | 28 +++++++++++
 src/components/common/info/NoTitleInfo.vue | 26 ++++++++++
 src/components/common/input/InfoInput.vue  | 57 ++++++++++++++++++++++
 src/utils/axios.js                         | 20 +++++++-
 src/views/MobileView.vue                   |  4 +-
 6 files changed, 138 insertions(+), 3 deletions(-)
 create mode 100644 src/components/common/btn/ThemeBtn.vue
 create mode 100644 src/components/common/info/NoTitleInfo.vue
 create mode 100644 src/components/common/input/InfoInput.vue

diff --git a/src/assets/scss/common.scss b/src/assets/scss/common.scss
index 800018b..65d0fcb 100644
--- a/src/assets/scss/common.scss
+++ b/src/assets/scss/common.scss
@@ -56,6 +56,12 @@ $mobile-header-height : 100px;
   }
 }
 
+@mixin white-text($font-size) {
+  color: white;
+  font-weight: bold;
+  font-size: $font-size;
+}
+
 
 
 
diff --git a/src/components/common/btn/ThemeBtn.vue b/src/components/common/btn/ThemeBtn.vue
new file mode 100644
index 0000000..6ef6f6f
--- /dev/null
+++ b/src/components/common/btn/ThemeBtn.vue
@@ -0,0 +1,28 @@
+<template>
+  <Button class="theme-btn" @click="func">
+    <span>{{ title }}</span>
+  </Button>
+</template>
+
+<script>
+export default {
+  name: 'ThmemBtnVue',
+  props: {
+    title: String,
+    func: Function
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+  .theme-btn {
+    @include flex-box(row, center, 10px);
+    @include base-button();
+    padding: 10px 20px;
+    background-color: $theme-color;
+    color: white;
+    border: none;
+    font-size: 18px;
+    font-weight: bold;
+  }
+</style>
\ No newline at end of file
diff --git a/src/components/common/info/NoTitleInfo.vue b/src/components/common/info/NoTitleInfo.vue
new file mode 100644
index 0000000..4550506
--- /dev/null
+++ b/src/components/common/info/NoTitleInfo.vue
@@ -0,0 +1,26 @@
+<template>
+  <div class="no-title-input">
+    {{ infoValue }}
+  </div>
+</template>
+
+<script>
+export default {
+  name: 'NoTitleInfoVue',
+  props: {
+    infoValue: String,
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+  .no-title-input {
+    @include flex-box(row, center, 0px);
+    width: 100%;
+    height: 40px;
+    border-radius: 5px;
+    border: $theme-color solid 3px;
+    font-size: 18px;
+    font-weight: bold;
+  }
+</style>
diff --git a/src/components/common/input/InfoInput.vue b/src/components/common/input/InfoInput.vue
new file mode 100644
index 0000000..1faa5f6
--- /dev/null
+++ b/src/components/common/input/InfoInput.vue
@@ -0,0 +1,57 @@
+<template>
+  <div class="info-input">
+    <div class="title-box">
+      {{ title }}
+    </div>
+    <input 
+      type="text" 
+      :value="modelValue" 
+      @input="$emit('update:modelValue', $event.target.value)">
+  </div>
+</template>
+
+<script>
+export default {
+  name: 'InfoInputtVue',
+  props: {
+    'title' : String,
+    'modelValue': String,
+  },
+  emits: ['update:modelValue']
+
+}
+</script>
+
+<style lang='scss' scoped>
+  .info-input {
+    @include flex-box(row, center, 0px);
+    background-color: white;
+    width: 100%;
+    height: 40px;
+
+    .title-box {
+      @include flex-box(row, center, 0px);
+      @include white-text(16px);
+      background: $theme-color;
+      width: 140px;
+      height: 100%;
+      border-top-left-radius: 5px;
+      border-bottom-left-radius: 5px;
+    }
+
+    input {
+      width: 100%;
+      height: 100%;
+      padding: 0px 10px;
+      font-weight: bold;
+      font-size: 14px;
+      border: $theme-color solid;
+      border-top-right-radius: 5px;
+      border-bottom-right-radius: 5px;
+      &:focus {
+        outline: none;
+      }
+    }
+
+  }
+</style>
\ No newline at end of file
diff --git a/src/utils/axios.js b/src/utils/axios.js
index 7374bae..35b1479 100644
--- a/src/utils/axios.js
+++ b/src/utils/axios.js
@@ -48,4 +48,22 @@ mainAxios.interceptors.response.use(
   }
 );
 
-export { authAxios, mainAxios }
\ No newline at end of file
+// 회원 관련 axios
+const memberAxios = axios.create({
+  baseURL: `${import.meta.env.VITE_API_URL}`, 
+  headers: {
+    'Content-Type': 'application/json',
+  },
+  withCredentials: true
+});
+
+authAxios.interceptors.response.use(
+  (response) => {
+    return response.data;
+  },
+  (error) => {
+    return error.response.data;
+  }
+);
+
+export { authAxios, mainAxios, memberAxios }
\ No newline at end of file
diff --git a/src/views/MobileView.vue b/src/views/MobileView.vue
index c695c8b..fd5bce0 100644
--- a/src/views/MobileView.vue
+++ b/src/views/MobileView.vue
@@ -33,8 +33,8 @@ export default {
     width: 100%;
     margin: auto;
     position: relative;
-    @media (min-width: 501px) {
-      max-width: 500px;
+    @media (min-width: 801px) {
+      max-width: 800px;
     }
   }