webart
/
strava-frontend
1
0
Fork 0
Code Issues 10 Pull Requests Actions Packages Projects Releases Wiki Activity

edit workout
Gitea Actions Demo / build_and_push (push) Successful in 2m29s Details

This commit is contained in:
artem 2024-12-30 11:26:53 +03:00
parent 432dc9caf1
commit 24010da987
5 changed files with 113 additions and 7 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
src/main.ts
View File

@ -11,8 +11,8 @@ import axios from 'axios';
import { AxiosResponse } from "axios";
import { createYmaps } from 'vue-yandex-maps';
const HOST = "https://cycle-rider.ru";
// const HOST = "http://localhost:8000";
// const HOST = "https://cycle-rider.ru";
const HOST = "http://localhost:8000";
axios.defaults.baseURL = HOST;

6
src/pages/workouts/Definitions.vue
View File

@ -3,6 +3,10 @@
export type Attachment = {
url: string;
}
export type WorkoutLink = {
type: string;
value: string;
}
export type WorkoutItem = {
id: string;
name: string;
@ -24,6 +28,8 @@
attachment: Attachment;
latitude: number;
longitude: number;
is_public: boolean;
external_links: Array<WorkoutLink>;
}
export const secondsToDuration = (seconds: number) => {
let hours = Math.floor(seconds / 3600);

3
src/pages/workouts/Feed.vue
View File

@ -16,6 +16,7 @@
<li v-if="item.distantion"><span>Расстояние:</span> {{ distConvert(item.distantion) }} км</li>
<li v-if="item.duraion_sec"><span>Продолжительность:</span> {{ secondsToDuration(item.duraion_sec) }} </li>
<li v-if="item.power"><span>Мощность:</span> {{ Math.round(item.power) }} Вт</li>
<li v-if="item.external_links"><span>Ссылки:</span> <a :href="item.external_links[0].value" target="_blank">Дзен</a></li>
</ul>
<div v-if="item.attachment"
class="image-container"
@ -31,7 +32,7 @@
import { ref, inject } from 'vue';
import { useToast } from "vuestic-ui/web-components";
import { useRouter } from "vue-router";
import { WorkoutItem, Attachment, secondsToDuration, distConvert, speedConvert } from "./Definitions.vue";
import { WorkoutItem, secondsToDuration, distConvert, speedConvert } from "./Definitions.vue";
const { push } = useRouter();

106
src/pages/workouts/WorkoutItem.vue
View File

@ -26,7 +26,10 @@
</yandex-map>
</div>
<div id="workout-short-data">
<h3>{{ workoutItem.name }}</h3>
<div class="workout-item-editable-title">
<h3>{{ workoutItem.name }}</h3>
<VaIcon name="edit" @click="showModalTitle = !showModalTitle"/>
</div>
<div class="workout-item-params" v-if="workoutItem.power">
<div class="workout-item-params-name">Средняя мощность:</div>
<div class="workout-item-params-value">{{ Math.floor(workoutItem.power) }} Вт</div>
@ -59,6 +62,15 @@
<div class="workout-item-params-name">Максимальная скорость:</div>
<div class="workout-item-params-value">{{ speedConvert(workoutItem.max_speed || 0) }} км / ч</div>
</div>
<div class="workout-item-params" >
<div class="workout-item-params-name">Сделать публичной:&nbsp;</div>
<input type="checkbox" v-model="workoutItem.is_public" v-on:change="changePublic(workoutItem.is_public)">
</div>
<div class="workout-item-params" >
<div class="workout-item-params-name">Ссылки на описание:</div>
<div v-if="dzenLink"><a :href="dzenLink" target="_blank">Дзен</a></div>
<div v-else><a @click="showModalLink = !showModalLink">Добавить</a> </div>
</div>
</div>
</div>
@ -83,6 +95,23 @@
>
</VaInnerLoading>
</div>
<VaModal
v-model="showModalTitle"
ok-text="OK"
:beforeOk="saveName"
>
<h3>Редактирование названия</h3>
<input v-if="workoutItem" v-model="workoutItem.name" type="text" placeholder="Название" class="workout-item-input" />
<div v-else>Тренировка не найдена</div>
</VaModal>
<VaModal
v-model="showModalLink"
ok-text="OK"
:beforeOk="saveLink"
>
<h3>Редактирование ссылок</h3>
<input v-model="dzenLink" type="text" placeholder="Название" class="workout-item-input" />
</VaModal>
</template>
<script setup lang="ts">
import VaZoomOut from "../../components/icons/VaZoomOut.vue";
@ -90,7 +119,7 @@ import VaZoomOut from "../../components/icons/VaZoomOut.vue";
import { useRoute } from 'vue-router'
import 'chartjs-adapter-moment';
import { AxiosResponse, AxiosInstance } from "axios";
import { AxiosResponse, AxiosInstance, AxiosError } from "axios";
import { ref, inject, shallowRef } from 'vue'
import { useToast } from "vuestic-ui/web-components";
import zoomPlugin, { resetZoom } from 'chartjs-plugin-zoom';
@ -109,7 +138,8 @@ import {
import LineWithLineChart from './components/LineWithLineChart.js'
import type { YMap } from '@yandex/ymaps3-types';
import { YandexMap, YandexMapDefaultSchemeLayer, YandexMapFeature, YandexMapDefaultFeaturesLayer, YandexMapDefaultMarker } from 'vue-yandex-maps';
import { WorkoutItem, distConvert, speedConvert } from "./Definitions.vue";
import { WorkoutItem, distConvert, speedConvert, WorkoutLink } from "./Definitions.vue";
//Можно использовать для различных преобразований
const map = shallowRef<null | YMap>(null);
@ -117,6 +147,9 @@ const chart = ref();
let mapCenter = ref<Array<number>>([37.617644, 55.755819]);
let lineCoordinates = ref<Array<Array<number>>>([]);
let currentCoordinates = ref<Array<number> | null>([]);
let showModalTitle = ref(false);
const showModalLink = ref(false);
const dzenLink = ref("");
ChartJS.register(
Title,
Tooltip,
@ -227,6 +260,52 @@ const chartOptions = {
}
const msToKmh = (ms: number) => ms * 3.6;
const axiosAuth = inject('axiosAuth') as AxiosInstance;
const saveLink = (hide: any) => {
if (!dzenLink.value.includes("https://dzen.ru/")) {
init({
message: "Неверный формат ссылки",
color: "error",
});
return;
}
axiosAuth
.patch(`/api/v0/workouts/${workoutItem.value?.id}`,{ links: [{"value": dzenLink.value, "type": "dzen"}] })
.then((response: AxiosResponse) => {
hide();
}).catch((error: AxiosError) => {
console.log(error);
init({
message: "Что-то пошло не так.",
color: "error",
});
});
};
const saveName = (hide: any) => {
axiosAuth
.patch(`/api/v0/workouts/${workoutItem.value?.id}`,{ name: workoutItem.value?.name })
.then((response: AxiosResponse) => {
hide();
}).catch((error: AxiosError) => {
console.log(error);
init({
message: "Что-то пошло не так.",
color: "error",
});
});
};
const changePublic = (value: boolean) => {
axiosAuth
.patch(`/api/v0/workouts/${workoutItem.value?.id}`,{ is_public: value })
.then((response: AxiosResponse) => {
}).catch((error: AxiosError) => {
console.log(error);
init({
message: "Что-то пошло не так.",
color: "error",
});
});
};
const resetChartZoom = () => {
resetZoom(chart.value.chart);
@ -279,8 +358,12 @@ const initWorkout = (id: string) => {
datasets: datasets
}
console.log(response.data.workout.external_links);
if (response.data.workout.external_links) {
dzenLink.value = response.data.workout.external_links[0].value;
}
})
.catch((error: any) => {
.catch((error: AxiosError) => {
console.log(error);
init({
message: "Что-то пошло не так.",
@ -335,4 +418,19 @@ h3 {
.workout-item-params-value {
padding: 0 0 0 5px
}
.workout-item-editable-title {
display: flex;
width: 100%;
justify-self: start;
}
.workout-item-editable-title h3 {
padding-right: 5px;
}
.workout-item-editable-title i {
cursor: pointer;
}
.workout-item-input {
border: #333 1px solid;
padding-left: 5px;
}
</style>

1
src/pages/workouts/WorkoutList.vue
View File

@ -19,6 +19,7 @@
<li v-if="item.distantion"><span>Расстояние:</span> {{ distConvert(item.distantion) }} км</li>
<li v-if="item.duraion_sec"><span>Продолжительность:</span> {{ secondsToDuration(item.duraion_sec) }} </li>
<li v-if="item.power"><span>Мощность:</span> {{ Math.round(item.power) }} Вт</li>
<li v-if="item.external_links"><span>Ссылки:</span> <a :href="item.external_links[0].value" target="_blank">Дзен</a></li>
</ul>
<div v-if="item.attachment"
class="image-container"