Skip to content

Commit

Permalink
Merge branch 'contest-announce' into stg
Browse files Browse the repository at this point in the history
  • Loading branch information
Shion1305 committed Nov 3, 2023
2 parents 4c1d53e + 3b5e10c commit 8949439
Show file tree
Hide file tree
Showing 3 changed files with 141 additions and 52 deletions.
23 changes: 13 additions & 10 deletions components/ProjectCardCompact.vue
Original file line number Diff line number Diff line change
Expand Up @@ -3,14 +3,17 @@ import { Genre, genreToString, getTagColor } from "~/model/genre";
import { Area, placeToString } from "~/model/area";
const props = defineProps<{
eventData: {
id: number;
e_name: string;
e_genre: Genre;
o_name: string;
area: Area;
p_name: string;
};
eventData:
| {
id: number;
e_name: string;
e_genre: Genre;
o_name: string;
area: Area;
p_name: string;
}
| null
| undefined;
}>();
const showNoImage = function (e: any) {
e.target.src =
Expand All @@ -27,7 +30,7 @@ const eventTagStyle = (genre: Genre) => {
</script>

<template>
<div class="project-card">
<div class="project-card" v-if="props.eventData">
<div class="incline-card">
<img
:src="iconURL"
Expand All @@ -39,7 +42,7 @@ const eventTagStyle = (genre: Genre) => {
<p class="event-name">{{ props.eventData.e_name }}</p>
<hr class="line" />
<p class="org-name">{{ props.eventData.o_name }}</p>
<p class="genre" :style="eventTagStyle(props.eventData.e_genre)">
<p :style="eventTagStyle(props.eventData.e_genre)" class="genre">
{{ genreToString(props.eventData.e_genre) }}
</p>
<p class="place">
Expand Down
149 changes: 108 additions & 41 deletions pages/sp/contest.vue
Original file line number Diff line number Diff line change
@@ -1,20 +1,29 @@
<script lang="ts" setup>
import ProjectCardCompact from "~/components/ProjectCardCompact.vue";
import events from "~/assets/data/events.json";
import type { EventSummary } from "~/model/event";
// idに対応するcardを表示
interface RankingData {
FOOD: number[];
EXHIBITION: number[];
PERFORMANCE: number[];
DRINK: number[];
VISUAL: number[];
UPDATED: string;
}
// const rankingData = await useFetch("/api/contest").then((res) => {
// if (
// res.data.value.FOOD &&
// res.data.value.EXHIBITION &&
// res.data.value.PERFORMANCE
// ) {
// return res.data.value as RankingData;
// }
// return null;
// });
const rankingData = await useFetch("/api/contest").then((res) => {
if (
res.data.value.FOOD &&
res.data.value.EXHIBITION &&
res.data.value.PERFORMANCE
) {
return res.data.value as RankingData;
}
return null;
});
useHead({
title: "企画コンテスト | 23常盤祭公式HP~未来航路~",
Expand Down Expand Up @@ -70,28 +79,63 @@ gtag("event", "screen_view", {
</ul>
全企画が対象で見た目を観点に投票します。Xを用いて投票をお願いします。写真をたくさん撮ろう!
</div>
<SectionTitle text="結果発表" />
<div class="result-description">中間発表はこれから!!お楽しみに!!</div>
<!-- <table class="result-table">-->
<!-- <tr>-->
<!-- <td>順位</td>-->
<!-- <td>飲食部門</td>-->
<!-- <td></td>-->
<!-- <td>縦方向のセルの並び</td>-->
<!-- </tr>-->
<!-- <tr>-->
<!-- <td>第1位</td>-->
<!-- <td>意味</td>-->
<!-- </tr>-->
<!-- <tr>-->
<!-- <td>第2位</td>-->
<!-- <td>表の中の1つ1つの項目</td>-->
<!-- </tr>-->
<!-- <tr>-->
<!-- <td>第3位</td>-->
<!-- <td>横方向のセルの並び</td>-->
<!-- </tr>-->
<!-- </table>-->
<SponsorsListTitle text="中間結果発表" />
<div v-if="rankingData" class="result-table-section">
<h2>{{ rankingData.UPDATED }} 更新</h2>
<div class="result-table-holder">
<table class="result-table">
<tr>
<td>順位</td>
<td>第1位</td>
<td>第2位</td>
<td>第3位</td>
</tr>
<tr>
<td>飲食</td>
<td v-for="(e, index) in rankingData.FOOD" :key="index">
<ProjectCardCompact
:event-data="events.find((s: EventSummary) => s.id === e)"
/>
</td>
</tr>
<tr>
<td>展示・物販</td>
<td v-for="(e, index) in rankingData.EXHIBITION" :key="index">
<ProjectCardCompact
:event-data="events.find((s: EventSummary) => s.id === e)"
/>
</td>
</tr>
<tr>
<td>パフォーマンス</td>
<td v-for="(e, index) in rankingData.PERFORMANCE" :key="index">
<ProjectCardCompact
:event-data="events.find((s: EventSummary) => s.id === e)"
/>
</td>
</tr>
<tr>
<td>オリジナルドリンク</td>
<td v-for="(e, index) in rankingData.DRINK" :key="index">
<ProjectCardCompact
:event-data="events.find((s: EventSummary) => s.id === e)"
/>
</td>
</tr>
<tr>
<td>ビジュアル</td>
<td v-for="(e, index) in rankingData.VISUAL" :key="index">
<ProjectCardCompact
:event-data="events.find((s: EventSummary) => s.id === e)"
/>
</td>
</tr>
</table>
</div>
</div>
<div v-else class="result-description">
中間発表はこれから!!お楽しみに!!
</div>
</div>
<BackToHome />
</div>
Expand Down Expand Up @@ -157,21 +201,44 @@ gtag("event", "screen_view", {
}
}
.section-title {
align-self: center;
width: 500px !important;
font-size: 2em !important;
@include md {
align-self: flex-start;
.result-description {
font-size: 1.3em;
text-align: center;
}
.result-table-section {
text-align: center;
> h2 {
font-size: 1.5em;
margin: 1em 0;
}
}
.result-description {
font-size: 1.3em;
.result-table-holder {
text-align: center;
overflow-x: scroll;
}
.result-table {
tr {
td {
padding: 0.5em 1.5em 1.5em 0.5em;
border: 2px solid var(--thick-font-color);
&:first-child {
padding: 0;
vertical-align: middle;
min-width: 10em;
}
}
&:first-child {
td {
padding: 0;
vertical-align: middle;
line-height: 2em;
}
}
}
.back-button {
Expand Down
21 changes: 20 additions & 1 deletion server/contest.js
Original file line number Diff line number Diff line change
Expand Up @@ -15,6 +15,14 @@ function doGet(e) {
C[0] = sheet[4][1];
C[1] = sheet[4][2];
C[2] = sheet[4][3];
const D = [];
D[0] = sheet[5][1];
D[1] = sheet[5][2];
D[2] = sheet[5][3];
const E = [];
E[0] = sheet[6][1];
E[1] = sheet[6][2];
E[2] = sheet[6][3];
// check validity
if (
!A[0] ||
Expand All @@ -25,7 +33,13 @@ function doGet(e) {
!B[2] ||
!C[0] ||
!C[1] ||
!C[2]
!C[2] ||
!D[0] ||
!D[1] ||
!D[2] ||
!E[0] ||
!E[1] ||
!E[2]
) {
return respond({});
}
Expand All @@ -35,11 +49,16 @@ function doGet(e) {
A[i] = resolveEventNum(A[i]);
B[i] = resolveEventNum(B[i]);
C[i] = resolveEventNum(C[i]);
D[i] = resolveEventNum(D[i]);
E[i] = resolveEventNum(E[i]);
}
return respond({
FOOD: A,
EXHIBITION: B,
PERFORMANCE: C,
DRINK: D,
VISUAL: E,
UPDATED: sheet[7][1],
});
}

Expand Down

0 comments on commit 8949439

Please sign in to comment.