edit workout
Gitea Actions Demo / build_and_push (push) Successful in 2m29s
Details
Gitea Actions Demo / build_and_push (push) Successful in 2m29s
Details
This commit is contained in:
parent
432dc9caf1
commit
24010da987
|
|
@ -11,8 +11,8 @@ import axios from 'axios';
|
||||||
import { AxiosResponse } from "axios";
|
import { AxiosResponse } from "axios";
|
||||||
import { createYmaps } from 'vue-yandex-maps';
|
import { createYmaps } from 'vue-yandex-maps';
|
||||||
|
|
||||||
const HOST = "https://cycle-rider.ru";
|
// const HOST = "https://cycle-rider.ru";
|
||||||
// const HOST = "http://localhost:8000";
|
const HOST = "http://localhost:8000";
|
||||||
|
|
||||||
axios.defaults.baseURL = HOST;
|
axios.defaults.baseURL = HOST;
|
||||||
|
|
||||||
|
|
|
||||||
|
|
@ -3,6 +3,10 @@
|
||||||
export type Attachment = {
|
export type Attachment = {
|
||||||
url: string;
|
url: string;
|
||||||
}
|
}
|
||||||
|
export type WorkoutLink = {
|
||||||
|
type: string;
|
||||||
|
value: string;
|
||||||
|
}
|
||||||
export type WorkoutItem = {
|
export type WorkoutItem = {
|
||||||
id: string;
|
id: string;
|
||||||
name: string;
|
name: string;
|
||||||
|
|
@ -24,6 +28,8 @@
|
||||||
attachment: Attachment;
|
attachment: Attachment;
|
||||||
latitude: number;
|
latitude: number;
|
||||||
longitude: number;
|
longitude: number;
|
||||||
|
is_public: boolean;
|
||||||
|
external_links: Array<WorkoutLink>;
|
||||||
}
|
}
|
||||||
export const secondsToDuration = (seconds: number) => {
|
export const secondsToDuration = (seconds: number) => {
|
||||||
let hours = Math.floor(seconds / 3600);
|
let hours = Math.floor(seconds / 3600);
|
||||||
|
|
|
||||||
|
|
@ -16,6 +16,7 @@
|
||||||
<li v-if="item.distantion"><span>Расстояние:</span> {{ distConvert(item.distantion) }} км</li>
|
<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.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.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>
|
</ul>
|
||||||
<div v-if="item.attachment"
|
<div v-if="item.attachment"
|
||||||
class="image-container"
|
class="image-container"
|
||||||
|
|
@ -31,7 +32,7 @@
|
||||||
import { ref, inject } from 'vue';
|
import { ref, inject } from 'vue';
|
||||||
import { useToast } from "vuestic-ui/web-components";
|
import { useToast } from "vuestic-ui/web-components";
|
||||||
import { useRouter } from "vue-router";
|
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();
|
const { push } = useRouter();
|
||||||
|
|
|
||||||
|
|
@ -26,7 +26,10 @@
|
||||||
</yandex-map>
|
</yandex-map>
|
||||||
</div>
|
</div>
|
||||||
<div id="workout-short-data">
|
<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" v-if="workoutItem.power">
|
||||||
<div class="workout-item-params-name">Средняя мощность:</div>
|
<div class="workout-item-params-name">Средняя мощность:</div>
|
||||||
<div class="workout-item-params-value">{{ Math.floor(workoutItem.power) }} Вт</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-name">Максимальная скорость:</div>
|
||||||
<div class="workout-item-params-value">{{ speedConvert(workoutItem.max_speed || 0) }} км / ч</div>
|
<div class="workout-item-params-value">{{ speedConvert(workoutItem.max_speed || 0) }} км / ч</div>
|
||||||
</div>
|
</div>
|
||||||
|
<div class="workout-item-params" >
|
||||||
|
<div class="workout-item-params-name">Сделать публичной: </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>
|
||||||
</div>
|
</div>
|
||||||
|
|
@ -83,6 +95,23 @@
|
||||||
>
|
>
|
||||||
</VaInnerLoading>
|
</VaInnerLoading>
|
||||||
</div>
|
</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>
|
</template>
|
||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
import VaZoomOut from "../../components/icons/VaZoomOut.vue";
|
import VaZoomOut from "../../components/icons/VaZoomOut.vue";
|
||||||
|
|
@ -90,7 +119,7 @@ import VaZoomOut from "../../components/icons/VaZoomOut.vue";
|
||||||
|
|
||||||
import { useRoute } from 'vue-router'
|
import { useRoute } from 'vue-router'
|
||||||
import 'chartjs-adapter-moment';
|
import 'chartjs-adapter-moment';
|
||||||
import { AxiosResponse, AxiosInstance } from "axios";
|
import { AxiosResponse, AxiosInstance, AxiosError } from "axios";
|
||||||
import { ref, inject, shallowRef } from 'vue'
|
import { ref, inject, shallowRef } from 'vue'
|
||||||
import { useToast } from "vuestic-ui/web-components";
|
import { useToast } from "vuestic-ui/web-components";
|
||||||
import zoomPlugin, { resetZoom } from 'chartjs-plugin-zoom';
|
import zoomPlugin, { resetZoom } from 'chartjs-plugin-zoom';
|
||||||
|
|
@ -109,7 +138,8 @@ import {
|
||||||
import LineWithLineChart from './components/LineWithLineChart.js'
|
import LineWithLineChart from './components/LineWithLineChart.js'
|
||||||
import type { YMap } from '@yandex/ymaps3-types';
|
import type { YMap } from '@yandex/ymaps3-types';
|
||||||
import { YandexMap, YandexMapDefaultSchemeLayer, YandexMapFeature, YandexMapDefaultFeaturesLayer, YandexMapDefaultMarker } from 'vue-yandex-maps';
|
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);
|
const map = shallowRef<null | YMap>(null);
|
||||||
|
|
@ -117,6 +147,9 @@ const chart = ref();
|
||||||
let mapCenter = ref<Array<number>>([37.617644, 55.755819]);
|
let mapCenter = ref<Array<number>>([37.617644, 55.755819]);
|
||||||
let lineCoordinates = ref<Array<Array<number>>>([]);
|
let lineCoordinates = ref<Array<Array<number>>>([]);
|
||||||
let currentCoordinates = ref<Array<number> | null>([]);
|
let currentCoordinates = ref<Array<number> | null>([]);
|
||||||
|
let showModalTitle = ref(false);
|
||||||
|
const showModalLink = ref(false);
|
||||||
|
const dzenLink = ref("");
|
||||||
ChartJS.register(
|
ChartJS.register(
|
||||||
Title,
|
Title,
|
||||||
Tooltip,
|
Tooltip,
|
||||||
|
|
@ -227,6 +260,52 @@ const chartOptions = {
|
||||||
}
|
}
|
||||||
const msToKmh = (ms: number) => ms * 3.6;
|
const msToKmh = (ms: number) => ms * 3.6;
|
||||||
const axiosAuth = inject('axiosAuth') as AxiosInstance;
|
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 = () => {
|
const resetChartZoom = () => {
|
||||||
resetZoom(chart.value.chart);
|
resetZoom(chart.value.chart);
|
||||||
|
|
@ -279,8 +358,12 @@ const initWorkout = (id: string) => {
|
||||||
datasets: datasets
|
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);
|
console.log(error);
|
||||||
init({
|
init({
|
||||||
message: "Что-то пошло не так.",
|
message: "Что-то пошло не так.",
|
||||||
|
|
@ -335,4 +418,19 @@ h3 {
|
||||||
.workout-item-params-value {
|
.workout-item-params-value {
|
||||||
padding: 0 0 0 5px
|
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>
|
</style>
|
||||||
|
|
@ -19,6 +19,7 @@
|
||||||
<li v-if="item.distantion"><span>Расстояние:</span> {{ distConvert(item.distantion) }} км</li>
|
<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.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.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>
|
</ul>
|
||||||
<div v-if="item.attachment"
|
<div v-if="item.attachment"
|
||||||
class="image-container"
|
class="image-container"
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue