change chronology table

This commit is contained in:
Dmitriy Pleshevskiy 2024-07-25 15:23:02 +03:00
parent 7a393c6c2d
commit 0322d162d0
Signed by: pleshevskiy
GPG key ID: 17041163DA10A9A2
3 changed files with 34 additions and 26 deletions

View file

@ -43,8 +43,8 @@ export default defineUserConfig({
description: "Описание",
role: "Роль",
technologies: "Технологии",
start: "Начало",
statusOrEnd: "Статус/Окончание",
status: "Статус",
dates: "Даты",
},
},
"/eng/": {
@ -64,8 +64,8 @@ export default defineUserConfig({
description: "Description",
role: "Role",
technologies: "Technologies",
start: "Start",
statusOrEnd: "Status/End",
status: "Status",
dates: "Dates",
},
},
},

View file

@ -1,21 +1,20 @@
<script lang="ts">
export default {
name: 'WorksPage',
name: "WorksPage",
computed: {
tableTheme() {
return this.$themeLocale.worksTable ?? {};
},
},
}
};
</script>
<script lang="ts" setup>
import { CHRONOLOGICAL_WORKS } from '../data.ts'
import { renderDate } from '../../../global.ts'
import { work as w } from '../domain'
import { CHRONOLOGICAL_WORKS } from "../data.ts";
import { renderDate } from "../../../global.ts";
import { work as w } from "../domain";
</script>
<template>
<table>
<thead>
@ -24,21 +23,37 @@ import { work as w } from '../domain'
<th>{{ tableTheme.description }}</th>
<th>{{ tableTheme.role }}</th>
<th>{{ tableTheme.technologies }}</th>
<th>{{ tableTheme.start }}</th>
<th>{{ tableTheme.statusOrEnd }}</th>
<th>{{ tableTheme.status }}</th>
<th>{{ tableTheme.dates }}</th>
</tr>
</thead>
<tbody>
<tr v-for="work in CHRONOLOGICAL_WORKS">
<td><a rel="nofollow noopener" :href="w.getExternalLink(work)">{{ work.name }}</a></td>
<td>
<a rel="nofollow noopener" :href="w.getExternalLink(work)">{{
work.name
}}</a>
</td>
<td>{{ work.description }}</td>
<td v-html="work.roles.join(', ')"></td>
<td>{{ work.technologies.join(', ') }}</td>
<td>{{ renderDate(work.startDate) }}</td>
<td>{{ work.endDate ? renderDate(work.endDate) : work.status }}</td>
<td>{{ work.technologies.join(", ") }}</td>
<td>{{ work.status }}</td>
<td>
<div>
<small :class="{ grey: work.endDate }">{{ renderDate(work.startDate) }}</small>
</div>
<div v-if="work.endDate">
<small>{{ renderDate(work.endDate) }}</small>
</div>
</td>
</tr>
</tbody>
</table>
</template>
<style lang="css">
.grey {
color: rgba(0,0,0,0.4);
}
</style>

View file

@ -1,7 +0,0 @@
import { NonEmptyArray } from "../../../global.ts";
import { Technology } from "../domain/mod.ts";
import { AnyNode, TextNode } from "ren/node.ts";
export const TechnologyList: (techs: NonEmptyArray<Technology>) => AnyNode = (
techs,
) => new TextNode(techs.join(", "));