Skip to content

Commit

Permalink
upd
Browse files Browse the repository at this point in the history
  • Loading branch information
Дмитрий Мартынов authored and Дмитрий Мартынов committed Jan 11, 2025
1 parent 699047f commit ef352a1
Show file tree
Hide file tree
Showing 12 changed files with 270 additions and 84 deletions.
4 changes: 3 additions & 1 deletion src/App.vue
Original file line number Diff line number Diff line change
Expand Up @@ -13,6 +13,7 @@ import Footer from './components/Footer.vue'
import Scales from './components/Scales.vue'
import TimeLine from './components/TimeLine.vue'
import LineChart from './components/LineChart.vue'
import Settings from './components/Settings.vue'
import { ref, watch } from 'vue';
loginStore.getInfo()
Expand All @@ -27,7 +28,7 @@ watch(hiddenStore, () => {
function blurEdit() {
if (hiddenStore.login === true || hiddenStore.add === true || hiddenStore.scales === true) {
if (hiddenStore.login === true || hiddenStore.add === true || hiddenStore.scales === true || hiddenStore.settings === true) {
blur.value = true
}
else {
Expand Down Expand Up @@ -69,6 +70,7 @@ function blurEdit() {
<Scales />
<Login />
<Add />
<Settings />
</template>

<style scoped>
Expand Down
2 changes: 2 additions & 0 deletions src/components/Add.vue
Original file line number Diff line number Diff line change
Expand Up @@ -75,6 +75,7 @@ const regOrLogin = ref('register')
right: 0;
left: 0;
z-index: 1050;
}
.x{
float: right;
Expand All @@ -83,6 +84,7 @@ const regOrLogin = ref('register')
}
.nameLogin {
margin-bottom: 10px;
}
.login {
Expand Down
4 changes: 2 additions & 2 deletions src/components/Footer.vue
Original file line number Diff line number Diff line change
Expand Up @@ -21,10 +21,10 @@
</svg>
</div>

<div class="blockItem"><svg class="icon1" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" width="30" height="30" fill="none" viewBox="0 0 24 24">
<div class="blockItem" @click="hiddenStore.showSettings()"><svg class="icon1" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" width="30" height="30" fill="none" viewBox="0 0 24 24">
<path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" d="M12 21a9 9 0 1 0 0-18 9 9 0 0 0 0 18Zm0 0a8.949 8.949 0 0 0 4.951-1.488A3.987 3.987 0 0 0 13 16h-2a3.987 3.987 0 0 0-3.951 3.512A8.948 8.948 0 0 0 12 21Zm3-11a3 3 0 1 1-6 0 3 3 0 0 1 6 0Z"/>
</svg>
<div class="textUnderIcon">Тест</div>
<div class="textUnderIcon">Настройки</div>
</div>

<div class="blockItem"><svg class="icon1" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" width="30" height="30" fill="none" viewBox="0 0 24 24">
Expand Down
15 changes: 15 additions & 0 deletions src/components/LeftBar.vue
Original file line number Diff line number Diff line change
Expand Up @@ -28,7 +28,22 @@
d="M5 12h14m-7 7V5" />
</svg>
Добавить</div>


<div class="section" @click="hiddenStore.showSettings()"><svg aria-hidden="true" xmlns="http://www.w3.org/2000/svg" width="22" height="22" fill="none" viewBox="0 0 24 24">
<path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M21 13v-2a1 1 0 0 0-1-1h-.757l-.707-1.707.535-.536a1 1 0 0 0 0-1.414l-1.414-1.414a1 1 0 0 0-1.414 0l-.536.535L14 4.757V4a1 1 0 0 0-1-1h-2a1 1 0 0 0-1 1v.757l-1.707.707-.536-.535a1 1 0 0 0-1.414 0L4.929 6.343a1 1 0 0 0 0 1.414l.536.536L4.757 10H4a1 1 0 0 0-1 1v2a1 1 0 0 0 1 1h.757l.707 1.707-.535.536a1 1 0 0 0 0 1.414l1.414 1.414a1 1 0 0 0 1.414 0l.536-.535 1.707.707V20a1 1 0 0 0 1 1h2a1 1 0 0 0 1-1v-.757l1.707-.708.536.536a1 1 0 0 0 1.414 0l1.414-1.414a1 1 0 0 0 0-1.414l-.535-.536.707-1.707H20a1 1 0 0 0 1-1Z"/>
<path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 15a3 3 0 1 0 0-6 3 3 0 0 0 0 6Z"/>
</svg>

<a>Настройки</a>
</div>


</div>




</template>


Expand Down
75 changes: 55 additions & 20 deletions src/components/LineChart.vue
Original file line number Diff line number Diff line change
@@ -1,15 +1,14 @@
<template>

<div class="mainBlockLineChart">

<LineChart class="lineChart" :chartData="lineData" :options="options" />
</div>

{{ loginStore.weightList }}

{{ loginStore.getStoreWeights }}
<div class="mainBlockLineChart">

<LineChart class="lineChart" :chartData="lineData" :options="options" />
</div>


<button @click="console.log(loginStore.getStoreWeights)">11</button>

</template>
<script setup>
Expand All @@ -29,15 +28,51 @@ defineProps({
const page = ref([true, false, false])
const info = ref([1, 2 ,3]) //значения в графике
const date = ref([3, 4, 5]) //даты в графике
const info = ref([]) //значения в графике
const date = ref([]) //даты в графике
const total = ref('загрузка...') //среднее значение
const label = ref('загрузка...') //название графика
const selectedRange = ref(false)
function updateData() {
if (loginStore.weightList !== 'loading') {
info.value = loginStore.weightList.reduce(function (accumulator, item) {
accumulator.unshift(Number(item[2]))
return accumulator
}, [])
date.value = loginStore.weightList.reduce(function (accumulator, item) {
accumulator.unshift(item[0])
return accumulator
}, [])
if(info.value[0] === 0){
info.value.splice(0,1)
date.value.splice(0, 1)
}
total.value = 'Текущий вес: ' + info.value[info.value.length -1] + ' кг'
}
}
watch(loginStore, () => {
updateData()
})
const options = reactive({
responsive: true,
scales: {
Expand Down Expand Up @@ -71,7 +106,7 @@ const options = reactive({
align: 'end',
display: true,
text: total,
color: 'rgb(199, 206, 223)',
color: 'rgb(199, 220, 223)',
font: {
size: 16,
weight: 'bold',
Expand All @@ -87,10 +122,8 @@ const lineData = computed(() => ({
boxWidth: 0,
datasets: [
{
// data: info.value,
data: loginStore.getStoreWeights,
label: loginStore.getStoreDates,
data: info.value,
label: 'Вес, кг',
borderColor: 'rgb(255, 255, 255)', //цвет линии
borderWidth: 2, // толщина линии
backgroundColor: 'rgba(255, 255, 255)', //точки
Expand All @@ -104,17 +137,19 @@ console.log(loginStore.getStoreWeights)

<style scope>
.mainBlockLineChart{
margin-top: 20px;
margin-left: 10px;
margin-right: 10px;
.mainBlockLineChart {
background-color: #007aff;
height: 120px;
border-radius: 15px;
padding: 20px;
padding: 10px 20px 20px 20px;
}
.lineChart{
.lineChart {
height: 120px;
}
</style>
5 changes: 4 additions & 1 deletion src/components/Name.vue
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
<template>
<div class="blockName">{{ loginStore.login }}<a><svg aria-hidden="true" xmlns="http://www.w3.org/2000/svg" width="22" height="22" fill="none" viewBox="0 0 24 24">
<div class="blockName">{{ loginStore.login }}<a><svg @click="hiddenStore.showSettings()" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" width="22" height="22" fill="none" viewBox="0 0 24 24">
<path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M21 13v-2a1 1 0 0 0-1-1h-.757l-.707-1.707.535-.536a1 1 0 0 0 0-1.414l-1.414-1.414a1 1 0 0 0-1.414 0l-.536.535L14 4.757V4a1 1 0 0 0-1-1h-2a1 1 0 0 0-1 1v.757l-1.707.707-.536-.535a1 1 0 0 0-1.414 0L4.929 6.343a1 1 0 0 0 0 1.414l.536.536L4.757 10H4a1 1 0 0 0-1 1v2a1 1 0 0 0 1 1h.757l.707 1.707-.535.536a1 1 0 0 0 0 1.414l1.414 1.414a1 1 0 0 0 1.414 0l.536-.535 1.707.707V20a1 1 0 0 0 1 1h2a1 1 0 0 0 1-1v-.757l1.707-.708.536.536a1 1 0 0 0 1.414 0l1.414-1.414a1 1 0 0 0 0-1.414l-.535-.536.707-1.707H20a1 1 0 0 0 1-1Z"/>
<path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 15a3 3 0 1 0 0-6 3 3 0 0 0 0 6Z"/>
</svg>
Expand All @@ -11,6 +11,9 @@
<script setup>
import { useLogin } from '../store/Login';
const loginStore = useLogin();
import { useComponents } from '../store/ComponentsHidden';
const hiddenStore = useComponents();
import { ref } from 'vue'
defineProps({
Expand Down
5 changes: 3 additions & 2 deletions src/components/Now.vue
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,7 @@
<div class="blockNow">
<a class="now">Калорий сегодня</a>
<a class="update">обновлено 10 минут назад</a>
<div class="ccal">{{ loginStore.getSumCcalToday }} <svg
<div class="ccal">{{ loginStore.getSumCcalToday }} ккал<svg
aria-hidden="true" xmlns="http://www.w3.org/2000/svg" width="20" height="20" fill="none" viewBox="0 0 24 24">
<path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.4"
d="M18 5V4a1 1 0 0 0-1-1H8.914a1 1 0 0 0-.707.293L4.293 7.207A1 1 0 0 0 4 7.914V20a1 1 0 0 0 1 1h12a1 1 0 0 0 1-1v-5M9 3v4a1 1 0 0 1-1 1H4m11.383.772 2.745 2.746m1.215-3.906a2.089 2.089 0 0 1 0 2.953l-6.65 6.646L9 17.95l.739-3.692 6.646-6.646a2.087 2.087 0 0 1 2.958 0Z" />
Expand Down Expand Up @@ -61,7 +61,8 @@ defineProps({
.ccal {
margin-left: 15px;
margin-top: 7px;
font-size: 20px;
font-size: 24px;
font-weight: 600;
}
svg {
Expand Down
121 changes: 121 additions & 0 deletions src/components/Settings.vue
Original file line number Diff line number Diff line change
@@ -0,0 +1,121 @@
<template>

<div v-if="hiddenStore.settings" class="mainBlockSettings">

<div class="close" @click="hiddenStore.settings = !hiddenStore.settings"><svg aria-hidden="true" xmlns="http://www.w3.org/2000/svg" width="22" height="22" fill="none" viewBox="0 0 24 24">
<path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18 17.94 6M18 18 6.06 6"/>
</svg>
</div>



<div class="login" >
<div class="nameLogin">Желаемый вес</div>
<div> <input v-model="weight" placeholder="Вес кг"></div>
<div> <button @click="loginStore.editDesiredWeight(weight)" class="buttonGo">Изменить</button></div>
</div>

<div class="login" >
<div class="nameLogin">Лимит калорий</div>
<div> <input v-model="ccal" placeholder="Ккал"></div>
<div> <button @click="loginStore.editLimitCcal(ccal)" class="buttonGo">Изменить</button></div>
</div>

</div>
</template>



<script setup>
import { ref } from 'vue'
import { useComponents } from '../store/ComponentsHidden';
const hiddenStore = useComponents();
import { useLogin } from '../store/Login';
const loginStore = useLogin();
const weight = ref('')
const ccal = ref('')
defineProps({
msg: String,
})
const regOrLogin = ref('register')
</script>



<style scoped>
.mainBlockSettings {
background-color: white;
border-radius: 5px;
max-width: 400px;
margin-left: auto;
margin-right: auto;
width: 100%;
position: fixed; /* фиксированное положение */
top: 0;
right: 0;
left: 0;
z-index: 1050;
}
.close{
float: right;
margin: 10px;
color: #666666;
}
.nameLogin {
margin-bottom: 10px;
}
.login {
margin: 30px
}
.register {
margin: 30px
}
input{
width: 100%;
margin-top: 20px;
height: 40px;
border: solid;
border-radius: 7px;
border-width: 1px;
border-color: #c7c7c7;
background-color: #f9fafb;
display: block;
}
::placeholder{
padding-left: 7px;
font-size: 14px;
}
.buttonGo{
width: 100%;
margin-top: 20px;
height: 40px;
border-radius: 7px;
border: none;
background-color: #007aff;
color: white;
font-size: 15px;
font-weight: 500;
}
</style>
Loading

0 comments on commit ef352a1

Please sign in to comment.