up

src/api/generated/crabs/evening_detective_server/index.ts

@@ -749,6 +749,10 @@ export type GetGameReviewsReq = {
   gameId: number | undefined;
 };
 
+export type GetScenarioReviewsReq = {
+  scenarioId: number | undefined;
+};
+
 export type GetReviewsForModerationReq = {
 };
 
@@ -1014,6 +1018,7 @@ export interface EveningDetectiveServer {
   GetGameResults(request: GetGameResultsReq): Promise<GetGameResultsRsp>;
   CreateGameReview(request: CreateGameReviewReq): Promise<CreateGameReviewRsp>;
   GetGameReviews(request: GetGameReviewsReq): Promise<GetGameReviewsRsp>;
+  GetScenarioReviews(request: GetScenarioReviewsReq): Promise<GetGameReviewsRsp>;
   GetGameReviewsForModeration(request: GetGameReviewsReq): Promise<GetGameReviewsRsp>;
   GetReviewsForModeration(request: GetReviewsForModerationReq): Promise<GetGameReviewsRsp>;
   ModerateGameReview(request: ModerateGameReviewReq): Promise<ModerateGameReviewRsp>;
@@ -2194,6 +2199,26 @@ export function createEveningDetectiveServerClient(
         method: "GetGameReviews",
       }) as Promise<GetGameReviewsRsp>;
     },
+    GetScenarioReviews(request) { // eslint-disable-line @typescript-eslint/no-unused-vars
+      if (!request.scenarioId) {
+        throw new Error("missing required field request.scenarioId");
+      }
+      const path = `api/scenarios/${request.scenarioId}/reviews`; // eslint-disable-line quotes
+      const body = null;
+      const queryParams: string[] = [];
+      let uri = path;
+      if (queryParams.length > 0) {
+        uri += `?${queryParams.join("&")}`
+      }
+      return handler({
+        path: uri,
+        method: "GET",
+        body,
+      }, {
+        service: "EveningDetectiveServer",
+        method: "GetScenarioReviews",
+      }) as Promise<GetGameReviewsRsp>;
+    },
     GetGameReviewsForModeration(request) { // eslint-disable-line @typescript-eslint/no-unused-vars
       if (!request.gameId) {
         throw new Error("missing required field request.gameId");

src/components/CatalogPage.vue

@@ -132,8 +132,8 @@ getScenarios()
 }
 
 .scenario-label {
-  margin-top: auto;
-  padding-top: 12px;
+  margin-top: 0;
+  padding-top: 4px;
 }
 
 .scenario-rating {
@@ -141,7 +141,8 @@ getScenarios()
   color: #aaa;
   display: flex;
   gap: 8px;
-  margin-top: 12px;
+  margin-top: auto;
+  padding-top: 8px;
 }
 
 .status-block {

src/components/ScenarioPage.vue

@@ -4,7 +4,7 @@ import { ref } from 'vue'
 import { useRoute } from 'vue-router'
 
 import { getAuthClient } from '@/api/auth_client'
-import type { Scenario } from '@/api/generated/crabs/evening_detective_server'
+import type { GameReview, Scenario } from '@/api/generated/crabs/evening_detective_server'
 import HeaderMenu from '@/components/HeaderMenu.vue'
 
 const message = useMessage()
@@ -12,6 +12,7 @@ const client = getAuthClient()
 const route = useRoute()
 
 const scenarioId = route.params.id
+const reviews = ref<GameReview[]>([])
 
 const scenario = ref<Scenario>({
   id: undefined,
@@ -35,6 +36,16 @@ async function getScenario(id: number) {
   scenario.value = res.scenario!
 }
 getScenario(Number(scenarioId))
+
+async function getReviews(id: number) {
+  const res = await client.GetScenarioReviews({ scenarioId: id })
+  if (res.error != '') {
+    message.error(res.error!)
+    return
+  }
+  reviews.value = res.reviews || []
+}
+getReviews(Number(scenarioId))
 </script>
 
 <template>
@@ -66,6 +77,17 @@ getScenario(Number(scenarioId))
               Автор: {{ scenario.author?.username }}
             </n-tag>
           </div>
+          <section v-if="reviews.length" class="reviews-section">
+            <h2 class="reviews-title">Отзывы команд</h2>
+            <article v-for="review in reviews" :key="review.id" class="review-card">
+              <div class="review-heading">
+                <strong>{{ review.teamName }}</strong>
+                <n-rate :value="review.rating" readonly size="small" />
+              </div>
+              <div class="review-game">{{ review.gameName }}</div>
+              <p class="review-text">{{ review.text }}</p>
+            </article>
+          </section>
         </div>
       </section>
     </div>
@@ -136,6 +158,40 @@ getScenario(Number(scenarioId))
   margin-top: 12px;
 }
 
+.reviews-section {
+  margin-top: 24px;
+}
+
+.reviews-title {
+  color: #eee;
+  font-size: 20px;
+  margin-bottom: 12px;
+}
+
+.review-card {
+  border-top: 1px solid #777;
+  padding: 14px 0;
+}
+
+.review-heading {
+  align-items: center;
+  display: flex;
+  gap: 12px;
+  justify-content: space-between;
+}
+
+.review-game {
+  color: #777;
+  font-size: 13px;
+  margin-top: 4px;
+}
+
+.review-text {
+  color: #aaa;
+  margin-top: 8px;
+  white-space: pre-wrap;
+}
+
 .scenario-rating {
   align-items: center;
   color: #aaa;