yjryu / 3D_AI_System star
박현정 박현정 07-21
250721 박현정 프로젝트 저장 및 목록 조회 기능 추가
@6902b0f447e9f2e8112c6073f32ae64269f73fd9
 
6902b0f
client/resources/api/asset.js (added)
+++ client/resources/api/asset.js
@@ -0,0 +1,12 @@
+import apiClient from "./index";
+
+// 자산(프로젝트) 목록 조회 기능
+export const findAllProjectsProc = (data) => {
+    return apiClient.post('/project/findAllProjects.json', data);
+}
+
+// 자산(프로젝트) 생성 기능
+export const saveProjectProc = (data) => {
+    return apiClient.post('/project/saveProject.json', data);
+}
+
30ebe7c
6902b0f
client/views/pages/subPage/Asset.vue
--- client/views/pages/subPage/Asset.vue
+++ client/views/pages/subPage/Asset.vue
@@ -16,7 +16,7 @@
 
     </div>
 
     <div class="bottom-zone">
 
       <!-- 새 카드 -->
 
-      <div class="card new-card">
 
+      <div class="card new-card" @click="goToModeling()">
 
         <div class="new-symbol">
 
           <img src="../../../resources/img/content/ico_digital_asset.svg" alt="">
 
         </div>
@@ -62,16 +62,18 @@
 
 </template>
 
 
 <script>
 
+import { findAllProjectsProc } from '../../../resources/api/asset';
 
+import { mapGetters } from 'vuex';
 
 
 export default {
 
     data() {
 
         return {
 
             projects: [
 
-                { name: '프로젝트A', date: '2025.05.12', img: require('../../../resources/img/content/sample1.png'),isFavorite: false },
 
-                { name: '프로젝트B', date: '2025.05.12', img: require('../../../resources/img/content/sample1.png'),isFavorite: true },
 
-                { name: '프로젝트C', date: '2025.05.12', img: require('../../../resources/img/content/sample1.png'),isFavorite: false },
 
-                { name: '프로젝트D', date: '2025.05.12', img: require('../../../resources/img/content/sample1.png'),isFavorite: true },
 
-                { name: '프로젝트E', date: '2025.05.12', img: require('../../../resources/img/content/sample1.png'),isFavorite: false },
 
+                // { name: '프로젝트A', date: '2025.05.12', img: require('../../../resources/img/content/sample1.png'),isFavorite: false },
 
+                // { name: '프로젝트B', date: '2025.05.12', img: require('../../../resources/img/content/sample1.png'),isFavorite: true },
 
+                // { name: '프로젝트C', date: '2025.05.12', img: require('../../../resources/img/content/sample1.png'),isFavorite: false },
 
+                // { name: '프로젝트D', date: '2025.05.12', img: require('../../../resources/img/content/sample1.png'),isFavorite: true },
 
+                // { name: '프로젝트E', date: '2025.05.12', img: require('../../../resources/img/content/sample1.png'),isFavorite: false },
 
             ],
 
              openMenuIndex: null,
 
             dropdownDirection: 'right' // 또는 'left'
@@ -99,13 +101,43 @@
 
             this.dropdownDirection = (windowWidth - rect.right < 200) ? 'left' : 'right';
 
             this.openMenuIndex = index;
 
           });
 
-  }
 
+        },
 
+        loadProjects() {
 
+          findAllProjectsProc({
 
+            memberId: this.getMemId,
 
+            isMain: "Y" // 대표 프로젝트만 화면 목록에 뜨게 함.
 
+          })
 
+            .then(response => {
 
+              const projectList = response.data.result.projects;
 
+
 
+              this.projects = projectList.map(project => ({
 
+                name: project.projectName,
 
+                date: project.createdAt,
 
+                img: require('../../../resources/img/content/sample1.png'), // 백엔드 - 썸네일 기능 추가 후 수정
 
+                isFavorite: false // 백엔드 - 즐겨찾기 기능 추가 후 수정
 
+              }));
 
+            })
 
+            .catch(error => {console.error('자산 목록 조회 실패: ', error);})
 
+        },
 
+        goToModeling() {
 
+          console.log("모델링 페이지로 이동");
 
+          this.$router.push('/modeling.page');
 
+        },
 
     },
 
     watch: {},
 
-    computed: {},
 
+    computed: {
 
+    ...mapGetters([
 
+      'getMemId',
 
+      'getMemNm',
 
+      'getMemLoginId'
 
+    ])
 
+    },
 
     components: {},
 
     created() {},
 
-    mounted() {},
 
+    mounted() {
 
+      console.log("로그인한 사용자:", this.getMemId);
 
+      this.loadProjects();
 
+    },
 
     beforeUnmount() {},
 
 };
30ebe7c
6902b0f
client/views/pages/subPage/Modeling.vue
--- client/views/pages/subPage/Modeling.vue
+++ client/views/pages/subPage/Modeling.vue
@@ -65,7 +65,9 @@
 
                             v-for="tool in subTolls.slice(0, 3)"
 
                             :key="tool.id"
 
                         >
 
-                            <button :title="tool.title" @click="toggleTool(tool)">
 
+                            <button
 
+                                :title="tool.title" 
+                                @click=" tool.title === '저장' ? saveProject() : toggleTool(tool)">
 
                                 <img :src="tool.icon" :alt="tool.title + ' 아이콘'" style="vertical-align: middle;"/>
 
                             </button>
 
                         </li>
@@ -166,6 +168,8 @@
 
 </template>
 
 
 <script>
 
+import { saveProjectProc } from '../../../resources/api/asset';
 
+import { mapGetters } from 'vuex';
 
 
 export default {
 
     data() {
@@ -393,6 +397,20 @@
 
         closeModal() {
 
             this.activeModalTool = null;
 
         },
 
+        saveProject() {
 
+            console.log('프로젝트(자산) 저장');
 
+            saveProjectProc({ 
+                memberId: this.getMemId, 
+                imageFileName: null,
 
+                imageFileUrl : null,
 
+                summary: "요약",
 
+                comment: "주석"})
 
+            .then(response => {
 
+                console.log('프로젝트(자산) 페이지로 이동');
 
+                this.$router.push('/asset.page');
 
+            })
 
+            .catch(error => {console.error('자산 생성 실패: ', error);})
 
+        }
 
     },
 
     watch: {},
 
     computed: {
@@ -404,7 +422,13 @@
 
             }
 
             return tool.icon;
 
             };
 
-        }
 
+        },
 
+        ...mapGetters([
 
+            'getMemId',
 
+            'getMemNm',
 
+            'getMemLoginId'
 
+        ])
 
+        
     },
 
     components: {},
 
     created() {},
Add a comment
List