Skip to content

Commit

Permalink
Feat : Add result connection
Browse files Browse the repository at this point in the history 
- #8
  • Loading branch information
carboxaminoo committed Mar 7, 2024
1 parent 72d905e commit d67e184
Show file tree
Hide file tree
Showing 3 changed files with 92 additions and 24 deletions.
14 changes: 13 additions & 1 deletion mz_v1_front/src/components/button/moving_filled.svelte
View file
Original file line number Diff line number Diff line change
Expand Up @@ -8,12 +8,24 @@
export let name = "Do something";
export let type = "button";
export let targetPath = "/";
export let id;
export let latest_id;
async function handleClick() {
// id와 latest_id를 sessionStorage에 저장
sessionStorage.setItem('id', id);
sessionStorage.setItem('latest_id', latest_id);
alert(id, latest_id);
// targetPath로 페이지 이동
goto(targetPath);
}
</script>

<button
type = {type}
on:click={goto(targetPath)}
on:click={handleClick}
style="{'background: var(--neutral-10, #486284);border-radius: 50px; border-style: solid; border-color: var(--neutral-10, #486284); border-width: 1px; padding: 12px 20px 12px 20px; display: flex; flex-direction: row; gap: 10px; align-items: center; justify-content: center; position: relative; overflow: hidden;' + style}"
>
<div
Expand Down
46 changes: 41 additions & 5 deletions mz_v1_front/src/routes/result/+page.svelte
View file
Original file line number Diff line number Diff line change
Expand Up @@ -4,6 +4,7 @@
import Header from "../../components/header_login.svelte";
import StarRating from "../../components/rating/StarRating.svelte";
import SaveImage from "../../components/button/result_save.svelte";
import { onMount } from 'svelte';
let className = "";
export { className as class };
export let style;
Expand All @@ -13,6 +14,41 @@
let voice_stretch_path = "https://blog.teamtailor.com/hs-fs/hubfs/giphy%20(3).gif?width=500&height=245&name=giphy%20(3).gif";
let condition_stretch_path = "https://social-phinf.pstatic.net/20211122_62/1637573927058bhdFb_GIF/23ee09341fb3d26c2b57efc4dd3b928ea3364f68.gif";
let results = [];
let id = sessionStorage.getItem('id'); // 수정된 부분
let latest_id = sessionStorage.getItem('latest_id'); // 수정된 부분
onMount(async () => {
const token = sessionStorage.getItem('auth_token'); // sessionStorage에서 토큰 가져오기
const response = await fetch(`http://175.45.194.59:5050/api/v1/mz-request/${id}/mz-result/${latest_id}`, {
method: 'GET',
headers: {
'Token': token,
},
});
if (response.ok) {
const data = await response.json();
results = data.mz_result; // 서버로부터 받은 데이터로 items 업데이트
console.log(results.voice_image_url)
console.log(results.condition_image_url)
} else if(response.status === 400) {
alert("데이터베이스 에러");
}else {
console.error('데이터를 가져오는 데 실패했습니다.');
alert("요청 중 에러가 발생했습니다.")
}
});
async function handleSubmit(event) {
event.preventDefault();
}
</script>
<div
style="{'background: var(--neutral-0, #ffffff);padding: 0px 0px 120px 0px; display: flex; flex-direction: column; gap: 30px; align-items: center; justify-content: flex-start; position: relative; ' + style}"
Expand Down Expand Up @@ -119,8 +155,8 @@
</div>
</div>
<PlaceholderImage
style="flex-shrink: 0; width: 393px; height: 393px";
filename={voice_face_path}
style="flex-shrink: 0; width: 390px; height: 390px"
targetPath={results.voice_image_url}
></PlaceholderImage>
</div>
<div
Expand Down Expand Up @@ -156,7 +192,7 @@
"
>
<StarRating />
<SaveImage targetImage= {voice_face_path}/>
<SaveImage targetImage= {results.voice_image_url}/>

</div>

Expand Down Expand Up @@ -233,7 +269,7 @@
</div>
<PlaceholderImage
style="flex-shrink: 0; width: 390px; height: 390px"
targetPath={condition_face_path}
targetPath={results.condition_image_url}
></PlaceholderImage>
</div>
<div
Expand Down Expand Up @@ -269,7 +305,7 @@
"
>
<StarRating />
<SaveImage saveImage={condition_face_path} />
<SaveImage saveImage={results.condition_image_url} />

</div>

Expand Down
56 changes: 38 additions & 18 deletions mz_v1_front/src/routes/resultlist/+page.svelte
View file
Original file line number Diff line number Diff line change
@@ -1,17 +1,35 @@
<script>
import ButtonStyleFilled from "../../components/button/basic_filled.svelte";
import MovingFilled from "../../components/button/moving_filled.svelte";
import Header from "../../components/header_login.svelte";
import { onMount } from 'svelte';
let className = "";
export { className as class };
export let style;
import { Table, TableBody, TableBodyCell, TableBodyRow, TableHead, TableHeadCell, Checkbox} from 'flowbite-svelte';
import { Table, TableBody, TableBodyCell, TableBodyRow, TableHead, TableHeadCell} from 'flowbite-svelte';
let items = [
{ id: 1, request_date: 'Toyota', end_date: 'ABC', result_gender: 1 , result_age:1, make:1, result_audio: "url"},
];
let items = [];
// [id, user_id, age, gender, voice_url, created_at, latest_mz_result_id, statuss, updated_at]
onMount(async () => {
const token = sessionStorage.getItem('auth_token'); // sessionStorage에서 토큰 가져오기
const response = await fetch('http://175.45.194.59:5050/api/v1/mz-request', {
method: 'GET',
headers: {
'Token': token,
},
});
if (response.ok) {
const data = await response.json();
items = data.mz_request_list; // 서버로부터 받은 데이터로 items 업데이트
console.log(items[0]);
} else if(response.status === 400) {
alert("데이터베이스 에러");
}else {
console.error('데이터를 가져오는 데 실패했습니다.');
alert("요청 중 에러가 발생했습니다.")
}
});
</script>


Expand Down Expand Up @@ -80,24 +98,26 @@ style="{'background: var(--neutral-0, #ffffff);padding: 0px 0px 120px 0px; displ
{#each items as item}
<TableBodyRow>
<TableBodyCell>{item.id}</TableBodyCell>
<TableBodyCell>{item.request_date}</TableBodyCell>
<TableBodyCell>{item.end_date}</TableBodyCell>
<TableBodyCell>{item.result_gender}</TableBodyCell>
<TableBodyCell>{item.result_age}</TableBodyCell>
<TableBodyCell>{item.created_at}</TableBodyCell>
<TableBodyCell>
{#if item.updated_at != null} {item.updated_at}{/if}
</TableBodyCell>
<TableBodyCell>{item.gender}</TableBodyCell>
<TableBodyCell>{item.age}</TableBodyCell>

<TableBodyCell>
{#if item.make == 0}<img src = "/resultlist/생성중.png" style="width: 100%; height: 45%; max-width: 100%; max-height: 100%; " alt="생성 중"/>
{:else if item.make == 1}<img src = "/resultlist/생성완료.png" style="width: 100%; height: 45%; max-width: 100%; max-height: 100%;" alt="생성 완료"/>
{:else if item.make == 2}<img src = "/resultlist/생성실패.png "style="width: 100%; height: 45%; max-width: 100%; max-height: 100%;" alt="생성 실패"/>
{#if item.status == null}<img src = "/resultlist/생성중.png" style="width: 100%; height: 45%; max-width: 100%; max-height: 100%; " alt="생성 중"/>
{:else if item.status == "Success"}<img src = "/resultlist/생성완료.png" style="width: 100%; height: 45%; max-width: 100%; max-height: 100%;" alt="생성 완료"/>
{:else}<img src = "/resultlist/생성실패.png "style="width: 100%; height: 45%; max-width: 100%; max-height: 100%;" alt="생성 실패"/>
{/if}
</TableBodyCell>
<TableBodyCell>
<audio src={`/a4d0-472e-bb6d-d11ccac43e21`} controls></audio>
<audio src={item.voice_url} controls></audio>
</TableBodyCell>
<TableBodyCell>
{#if item.make ==1}
<MovingFilled targetPath='/result' name="결과 확인"> </MovingFilled>
{:else if item.make ==2}
{#if item.status =="Success"}
<MovingFilled targetPath='/result' name="결과 확인" id = {item.id} latest_id = {item.latest_mz_result_id}> </MovingFilled>
{:else if item.status == "Failed"}
Error
{/if}
</TableBodyCell>
Expand Down

0 comments on commit d67e184

Please sign in to comment.