mirror of
https://github.com/Dvorinka/swingmusic-extended.git
synced 2026-06-04 04:23:01 +00:00
blacken search component
This commit is contained in:
geoffrey45
+32
-7
@@ -11,12 +11,15 @@
|
||||
<Navigation :collapsed="collapsed" />
|
||||
<PinnedStuff :collapsed="collapsed" />
|
||||
</div>
|
||||
<div class="content">
|
||||
<Search
|
||||
v-model:search="search"
|
||||
@expandSearch="expandSearch"
|
||||
@collapseSearch="collapseSearch"
|
||||
/>
|
||||
<div class="content" :class="{ isMagicFlag: isMagicFlag }">
|
||||
<div class="search-box">
|
||||
<Search
|
||||
v-model:search="search"
|
||||
@expandSearch="expandSearch"
|
||||
@collapseSearch="collapseSearch"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div class="separator" style="border: none"></div>
|
||||
<router-view />
|
||||
</div>
|
||||
@@ -31,7 +34,7 @@
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { ref } from "@vue/reactivity";
|
||||
import { computed, ref } from "@vue/reactivity";
|
||||
|
||||
import Navigation from "./components/LeftSidebar/Navigation.vue";
|
||||
import PinnedStuff from "./components/LeftSidebar/PinnedStuff.vue";
|
||||
@@ -41,6 +44,7 @@ import NowPlaying from "./components/RightSideBar/NowPlaying.vue";
|
||||
import UpNext from "./components/RightSideBar/UpNext.vue";
|
||||
import RecommendedArtist from "./components/RightSideBar/Recommendation.vue";
|
||||
|
||||
import state from "@/composables/state.js";
|
||||
import perks from "@/composables/perks.js";
|
||||
|
||||
export default {
|
||||
@@ -58,6 +62,10 @@ export default {
|
||||
|
||||
perks.readQueue();
|
||||
|
||||
const isMagicFlag = computed(() => {
|
||||
return state.magic_flag.value;
|
||||
});
|
||||
|
||||
function toggleNav() {
|
||||
collapsed.value = !collapsed.value;
|
||||
}
|
||||
@@ -87,6 +95,7 @@ export default {
|
||||
expandSearch,
|
||||
collapseSearch,
|
||||
search,
|
||||
isMagicFlag,
|
||||
};
|
||||
},
|
||||
};
|
||||
@@ -130,4 +139,20 @@ export default {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
.content {
|
||||
position: relative;
|
||||
padding: 0.5rem;
|
||||
padding-top: 4.5rem;
|
||||
|
||||
.search-box {
|
||||
width: calc(100% - 1rem);
|
||||
position: absolute;
|
||||
top: 0;
|
||||
z-index: 1;
|
||||
}
|
||||
}
|
||||
.isMagicFlag {
|
||||
padding-top: 7.5rem;
|
||||
}
|
||||
</style>
|
||||
|
||||
@@ -116,7 +116,6 @@ a {
|
||||
.content {
|
||||
grid-area: content;
|
||||
border-radius: 0.25rem;
|
||||
padding: 0.5rem;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
|
||||
@@ -0,0 +1 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 48 48"><path fill="#199be2" d="M35.983,32.448l-3.536,3.536l7.87,7.87c0.195,0.195,0.512,0.195,0.707,0l2.828-2.828 c0.195-0.195,0.195-0.512,0-0.707L35.983,32.448z"></path><radialGradient id="eRNmcsAyqJzyQtK0oJ_Tda" cx="20.024" cy="233.904" r="19.604" gradientTransform="matrix(1 0 0 -1 0 254)" gradientUnits="userSpaceOnUse"><stop offset=".693" stop-color="#006185"></stop><stop offset=".921" stop-color="#35c1f1"></stop></radialGradient><polygon fill="url(#eRNmcsAyqJzyQtK0oJ_Tda)" points="31.601,28.065 28.065,31.601 32.448,35.983 35.983,32.448"></polygon><linearGradient id="eRNmcsAyqJzyQtK0oJ_Tdb" x1="8.911" x2="31.339" y1="245.089" y2="222.661" gradientTransform="matrix(1 0 0 -1 0 254)" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#a3ffff"></stop><stop offset=".223" stop-color="#9dfbff"></stop><stop offset=".53" stop-color="#8bf1ff"></stop><stop offset=".885" stop-color="#6ee0ff"></stop><stop offset="1" stop-color="#63daff"></stop></linearGradient><circle cx="20" cy="20" r="16" fill="url(#eRNmcsAyqJzyQtK0oJ_Tdb)"></circle><path fill="#1b9de2" d="M12.5,26.75c0-0.414,3-3.75,7.5-3.75s7.5,3.336,7.5,3.75s-0.336,0.75-0.75,0.75 c-0.067,0-3.408-1.75-6.75-1.75c-3.338,0-6.677,1.75-6.75,1.75C12.836,27.5,12.5,27.164,12.5,26.75z M24.858,18.642 c1.144,1.144,2.998,1.144,4.142,0L24.858,14.5C23.714,15.644,23.714,17.498,24.858,18.642z M15.142,18.642 c1.144-1.144,1.144-2.998,0-4.142L11,18.642C12.144,19.786,13.998,19.786,15.142,18.642z"></path></svg>
|
||||
|
After Width: | Height: | Size: 1.5 KiB |
@@ -1,6 +1,6 @@
|
||||
<template>
|
||||
<div class="folder">
|
||||
<div class="table rounded" ref="songtitle" v-if="songs.length">
|
||||
<div class="table rounded" ref="songtitle" v-if="searchSongs.length">
|
||||
<table>
|
||||
<thead>
|
||||
<tr>
|
||||
@@ -12,7 +12,7 @@
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr
|
||||
v-for="song in songs"
|
||||
v-for="song in searchSongs"
|
||||
:key="song"
|
||||
:class="{ current: current._id.$oid == song._id.$oid }"
|
||||
>
|
||||
@@ -64,16 +64,23 @@
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
<div ref="songtitle" v-else-if="searchSongs.length === 0 && search_query">
|
||||
<div class="no-results">
|
||||
<div class="icon"></div>
|
||||
<div class="text">❗ Track not found!</div>
|
||||
</div>
|
||||
</div>
|
||||
<div v-else ref="songtitle"></div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { ref, toRefs } from "@vue/reactivity";
|
||||
import { computed, ref, toRefs } from "@vue/reactivity";
|
||||
import { onMounted, onUnmounted } from "@vue/runtime-core";
|
||||
|
||||
import audio from "@/composables/playAudio.js";
|
||||
import perks from "@/composables/perks.js";
|
||||
import state from "@/composables/state.js";
|
||||
|
||||
export default {
|
||||
props: ["songs"],
|
||||
@@ -86,13 +93,13 @@ export default {
|
||||
const putCommas = perks.putCommas;
|
||||
|
||||
const updateQueue = async (song) => {
|
||||
if (perks.queue.value[0]._id.$oid !== song_list.value[0]._id.$oid) {
|
||||
const queue = song_list.value;
|
||||
localStorage.setItem("queue", JSON.stringify(queue));
|
||||
perks.queue.value = queue;
|
||||
if (state.queue.value[0]._id.$oid !== song_list.value[0]._id.$oid) {
|
||||
const new_queue = song_list.value;
|
||||
localStorage.setItem("queue", JSON.stringify(new_queue));
|
||||
state.queue.value = new_queue;
|
||||
}
|
||||
|
||||
perks.current.value = song;
|
||||
state.current.value = song;
|
||||
localStorage.setItem("current", JSON.stringify(song));
|
||||
};
|
||||
|
||||
@@ -122,8 +129,18 @@ export default {
|
||||
|
||||
const playAudio = audio.playAudio;
|
||||
const current = ref(perks.current);
|
||||
const search_query = ref(state.search_query)
|
||||
|
||||
const searchSongs = computed(() => {
|
||||
return song_list.value.filter((song) => {
|
||||
return song.title
|
||||
.toLowerCase()
|
||||
.includes(state.search_query.value.toLowerCase());
|
||||
});
|
||||
});
|
||||
|
||||
return {
|
||||
searchSongs,
|
||||
songtitle,
|
||||
songTitleWidth,
|
||||
minWidth,
|
||||
@@ -131,12 +148,20 @@ export default {
|
||||
updateQueue,
|
||||
putCommas,
|
||||
current,
|
||||
search_query,
|
||||
};
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
.no-results {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
padding: 1rem;
|
||||
}
|
||||
|
||||
.table {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
|
||||
+66
-43
@@ -1,5 +1,8 @@
|
||||
<template>
|
||||
<div class="right-search" ref="searchComponent">
|
||||
<div
|
||||
class="right-search"
|
||||
ref="searchComponent"
|
||||
>
|
||||
<div class="input">
|
||||
<div class="search-icon image"></div>
|
||||
<div class="filter">
|
||||
@@ -15,28 +18,25 @@
|
||||
<input
|
||||
type="search"
|
||||
id="search"
|
||||
@focus="toggleMagicFlag"
|
||||
@blur="toggleMagicFlag"
|
||||
@focus="activateMagicFlag"
|
||||
@blur="removeMagicFlag"
|
||||
@keyup.backspace="removeLastFilter"
|
||||
placeholder="find your music"
|
||||
v-model="query"
|
||||
/>
|
||||
<div
|
||||
class="suggestions"
|
||||
class="suggestions v00"
|
||||
:class="{
|
||||
v00: !filters.length && !query,
|
||||
v11: filters.length || query,
|
||||
}"
|
||||
>
|
||||
<div class="item">Kenny Rogers</div>
|
||||
<div class="item">Jim Reeves</div>
|
||||
<div class="item">Juice Wrld</div>
|
||||
<div class="item">Dolly Parton</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="separator no-border"></div>
|
||||
<div class="options" v-if="magic_flag || query || filters.length">
|
||||
<div class="item info">I'm looking for:</div>
|
||||
<div class="options" v-if="magic_flag">
|
||||
<div class="item info">Filter by:</div>
|
||||
<div
|
||||
class="item"
|
||||
v-for="option in options"
|
||||
@@ -85,9 +85,13 @@
|
||||
|
||||
<script>
|
||||
import { ref, toRefs } from "@vue/reactivity";
|
||||
|
||||
import { watch } from "@vue/runtime-core";
|
||||
import state from "@/composables/state.js";
|
||||
|
||||
export default {
|
||||
|
||||
emits: ["expandSearch", "collapseSearch"],
|
||||
props: ["search"],
|
||||
setup(props, { emit }) {
|
||||
const songs = [
|
||||
@@ -121,13 +125,9 @@ export default {
|
||||
title: "📁 Folder",
|
||||
icon: "📁",
|
||||
},
|
||||
{
|
||||
title: "🈁 ここ",
|
||||
icon: "🈁",
|
||||
},
|
||||
];
|
||||
const searchComponent = ref(null);
|
||||
const filters = ref([]);
|
||||
const filters = ref(state.filters);
|
||||
const albums = [
|
||||
"Smooth Criminal like wtf ... and im serious",
|
||||
"Xscape",
|
||||
@@ -135,40 +135,52 @@ export default {
|
||||
];
|
||||
|
||||
const artists = ["Michael Jackson waihenya", "Jackson 5"];
|
||||
const query = ref(null);
|
||||
const magic_flag = ref(false);
|
||||
const query = ref(state.searh_query);
|
||||
const magic_flag = ref(state.magic_flag);
|
||||
const is_hidden = toRefs(props).search;
|
||||
|
||||
function addFilter(filter) {
|
||||
if (!filters.value.includes(filter)) {
|
||||
filters.value.push(filter);
|
||||
state.filters.value.push(filter);
|
||||
}
|
||||
}
|
||||
|
||||
function removeFilter(filter) {
|
||||
filters.value = filters.value.filter((f) => f !== filter);
|
||||
state.filters.value = filters.value.filter((f) => f !== filter);
|
||||
}
|
||||
|
||||
let counter = 0;
|
||||
|
||||
function removeLastFilter() {
|
||||
console.log("removeLastFilter");
|
||||
if (query.value === "" || query.value === null) {
|
||||
counter ++;
|
||||
counter++;
|
||||
|
||||
if (counter > 1 || query.value === null){
|
||||
filters.value.pop();
|
||||
if (counter > 1 || query.value === null) {
|
||||
state.filters.value.pop();
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
function toggleMagicFlag() {
|
||||
function activateMagicFlag() {
|
||||
setTimeout(() => {
|
||||
magic_flag.value = !magic_flag.value;
|
||||
state.magic_flag.value = true;
|
||||
}, 300);
|
||||
}
|
||||
|
||||
function removeMagicFlag() {
|
||||
setTimeout(() => {
|
||||
if (
|
||||
(!filters.value.length && query.value == null) ||
|
||||
query.value == ""
|
||||
) {
|
||||
console.log(query.value);
|
||||
state.magic_flag.value = false;
|
||||
}
|
||||
}, 300);
|
||||
}
|
||||
|
||||
watch(query, (new_query) => {
|
||||
state.search_query.value = new_query;
|
||||
if (new_query !== "") {
|
||||
counter = 0;
|
||||
emit("expandSearch");
|
||||
@@ -177,11 +189,18 @@ export default {
|
||||
}
|
||||
});
|
||||
|
||||
function hideScrollable() {
|
||||
document.querySelector(".scrollable").classList.remove("v1");
|
||||
document.querySelector(".scrollable").classList.add("v0");
|
||||
}
|
||||
|
||||
return {
|
||||
addFilter,
|
||||
toggleMagicFlag,
|
||||
activateMagicFlag,
|
||||
removeMagicFlag,
|
||||
removeFilter,
|
||||
removeLastFilter,
|
||||
hideScrollable,
|
||||
songs,
|
||||
albums,
|
||||
artists,
|
||||
@@ -212,7 +231,7 @@ export default {
|
||||
border-radius: 1rem;
|
||||
margin: 0.5rem 0 0 0;
|
||||
padding: $small $small 0 0;
|
||||
background-color: #131313b2;
|
||||
background-color: #000000;
|
||||
overflow: hidden;
|
||||
|
||||
.item {
|
||||
@@ -299,9 +318,10 @@ export default {
|
||||
|
||||
.right-search .scrollable {
|
||||
height: 26rem;
|
||||
overflow-y: scroll;
|
||||
overflow-y: auto;
|
||||
scroll-behavior: smooth;
|
||||
padding: 0 $small 0 0;
|
||||
margin-bottom: 0.5rem;
|
||||
}
|
||||
|
||||
.right-search .heading {
|
||||
@@ -310,20 +330,20 @@ export default {
|
||||
padding: 1rem;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
.more {
|
||||
position: absolute;
|
||||
right: 1rem;
|
||||
padding: 0.5rem;
|
||||
user-select: none;
|
||||
}
|
||||
|
||||
.more:hover {
|
||||
background: $blue;
|
||||
border-radius: 0.5rem;
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
|
||||
.right-search .heading .more {
|
||||
position: absolute;
|
||||
right: 1rem;
|
||||
padding: 0.5rem;
|
||||
user-select: none;
|
||||
}
|
||||
|
||||
.right-search .heading .more:hover {
|
||||
background: $blue;
|
||||
border-radius: 0.5rem;
|
||||
cursor: pointer;
|
||||
}
|
||||
.right-search input {
|
||||
width: 100%;
|
||||
height: 2.5rem;
|
||||
@@ -350,7 +370,8 @@ export default {
|
||||
|
||||
.right-search .tracks-results {
|
||||
border-radius: 0.5rem;
|
||||
background-color: rgba(8, 3, 1, 0.274);
|
||||
background-color: rgb(27, 26, 26);
|
||||
margin-left: $small;
|
||||
padding: $small;
|
||||
|
||||
.result-item {
|
||||
@@ -394,8 +415,9 @@ export default {
|
||||
|
||||
.right-search .albums-results {
|
||||
border-radius: 0.5rem;
|
||||
background-color: rgba(8, 3, 1, 0.274);
|
||||
margin-top: 1rem;
|
||||
background-color: rgb(27, 26, 26);
|
||||
margin-left: $small;
|
||||
margin-top: $small;
|
||||
|
||||
.grid {
|
||||
display: flex;
|
||||
@@ -435,7 +457,8 @@ export default {
|
||||
|
||||
.right-search .artists-results {
|
||||
border-radius: 0.5rem;
|
||||
background-color: rgba(8, 3, 1, 0.274);
|
||||
background-color: rgb(27, 26, 26);
|
||||
margin: 0 0 0 $small;
|
||||
|
||||
.grid {
|
||||
padding: 0 0 0 $small;
|
||||
|
||||
+52
-64
@@ -2,14 +2,9 @@ import { ref } from "@vue/reactivity";
|
||||
import { watch } from "@vue/runtime-core";
|
||||
|
||||
import media from "./mediaNotification.js";
|
||||
import state from "./state.js";
|
||||
|
||||
const current = ref({
|
||||
title: "Nothing played yet",
|
||||
artists: ["... blah blah blah"],
|
||||
_id: {
|
||||
$oid: "",
|
||||
},
|
||||
});
|
||||
const current = ref(state.current);
|
||||
|
||||
const next = ref({
|
||||
title: "The next song",
|
||||
@@ -19,23 +14,11 @@ const next = ref({
|
||||
},
|
||||
});
|
||||
|
||||
const prev = ref({
|
||||
title: "The previous song",
|
||||
artists: ["... blah blah blah"],
|
||||
_id: {
|
||||
$oid: "",
|
||||
},
|
||||
});
|
||||
const prev = ref(state.prev);
|
||||
|
||||
const queue = ref([
|
||||
{
|
||||
title: "Nothing played yet",
|
||||
artists: ["... blah blah blah"],
|
||||
_id: {
|
||||
$oid: "",
|
||||
},
|
||||
},
|
||||
]);
|
||||
const queue = ref(state.queue);
|
||||
|
||||
const search = ref("");
|
||||
|
||||
const putCommas = (artists) => {
|
||||
let result = [];
|
||||
@@ -51,33 +34,48 @@ const putCommas = (artists) => {
|
||||
return result;
|
||||
};
|
||||
|
||||
const doThat = (songs, current) => {
|
||||
queue.value = songs;
|
||||
current.value = current;
|
||||
function updateNext(song_) {
|
||||
const index = state.queue.value.findIndex(
|
||||
(item) => item._id.$oid === song_._id.$oid
|
||||
);
|
||||
|
||||
console.log(queue.value);
|
||||
};
|
||||
if (index == queue.value.length - 1) {
|
||||
next.value = queue.value[0];
|
||||
state.prev.value = queue.value[queue.value.length - 2];
|
||||
} else if (index == 0) {
|
||||
next.value = queue.value[1];
|
||||
} else {
|
||||
next.value = queue.value[index + 1];
|
||||
}
|
||||
}
|
||||
|
||||
function updatePrev(song) {
|
||||
const index = state.queue.value.findIndex(
|
||||
(item) => item._id.$oid === song._id.$oid
|
||||
);
|
||||
|
||||
if (index == 0) {
|
||||
prev.value = queue.value[queue.value.length - 1];
|
||||
} else if (index == queue.value.length - 1) {
|
||||
prev.value = queue.value[index - 1];
|
||||
} else {
|
||||
prev.value = queue.value[index - 1];
|
||||
}
|
||||
}
|
||||
|
||||
const readQueue = () => {
|
||||
const prev_queue = JSON.parse(localStorage.getItem("queue"));
|
||||
const last_played = JSON.parse(localStorage.getItem("current"));
|
||||
const next_ = JSON.parse(localStorage.getItem("next"));
|
||||
const prev_ = JSON.parse(localStorage.getItem("prev"));
|
||||
|
||||
if (last_played) {
|
||||
current.value = last_played;
|
||||
state.current.value = last_played;
|
||||
}
|
||||
|
||||
if (prev_queue) {
|
||||
queue.value = prev_queue;
|
||||
}
|
||||
|
||||
if (next_) {
|
||||
next.value = next_;
|
||||
}
|
||||
|
||||
if (prev_) {
|
||||
prev.value = prev_;
|
||||
state.queue.value = prev_queue;
|
||||
|
||||
updateNext(state.current.value);
|
||||
updatePrev(state.current.value);
|
||||
}
|
||||
};
|
||||
|
||||
@@ -93,40 +91,30 @@ function focusCurrent() {
|
||||
}
|
||||
}
|
||||
|
||||
watch(current, (new_current, old_current) => {
|
||||
media.showMediaNotif();
|
||||
setTimeout(() => {
|
||||
watch(current, (new_current) => {
|
||||
media.showMediaNotif();
|
||||
|
||||
new Promise((resolve) => {
|
||||
const index = queue.value.findIndex(
|
||||
(item) => item._id.$oid === new_current._id.$oid
|
||||
);
|
||||
new Promise((resolve) => {
|
||||
updateNext(new_current);
|
||||
updatePrev(new_current);
|
||||
resolve();
|
||||
}).then(() => {
|
||||
focusCurrent();
|
||||
});
|
||||
|
||||
if (index == queue.value.length - 1) {
|
||||
next.value = queue.value[0];
|
||||
prev.value = queue.value[queue.value.length - 2];
|
||||
} else if (index == 0) {
|
||||
next.value = queue.value[1];
|
||||
} else {
|
||||
next.value = queue.value[index + 1];
|
||||
}
|
||||
|
||||
prev.value = old_current;
|
||||
resolve();
|
||||
}).then(() => {
|
||||
focusCurrent();
|
||||
localStorage.setItem("current", JSON.stringify(new_current));
|
||||
// localStorage.setItem("prev", JSON.stringify(old_current));
|
||||
});
|
||||
|
||||
localStorage.setItem("current", JSON.stringify(new_current));
|
||||
localStorage.setItem("prev", JSON.stringify(prev.value));
|
||||
});
|
||||
}, 1000);
|
||||
|
||||
export default {
|
||||
putCommas,
|
||||
doThat,
|
||||
readQueue,
|
||||
focusCurrent,
|
||||
current,
|
||||
queue,
|
||||
next,
|
||||
prev,
|
||||
search,
|
||||
};
|
||||
|
||||
@@ -0,0 +1,42 @@
|
||||
import { ref } from "@vue/reactivity";
|
||||
|
||||
const search_query = ref("");
|
||||
|
||||
const queue = ref([
|
||||
{
|
||||
title: "Nothing played yet",
|
||||
artists: ["... blah blah blah"],
|
||||
_id: {
|
||||
$oid: "",
|
||||
},
|
||||
},
|
||||
]);
|
||||
|
||||
const current = ref({
|
||||
title: "Nothing played yet",
|
||||
artists: ["... blah blah blah"],
|
||||
_id: {
|
||||
$oid: "",
|
||||
},
|
||||
});
|
||||
|
||||
const prev = ref({
|
||||
title: "The previous song",
|
||||
artists: ["... blah blah blah"],
|
||||
_id: {
|
||||
$oid: "",
|
||||
},
|
||||
});
|
||||
|
||||
const filters = ref([]);
|
||||
const magic_flag = ref(false);
|
||||
|
||||
|
||||
export default {
|
||||
search_query,
|
||||
queue,
|
||||
current,
|
||||
prev,
|
||||
filters,
|
||||
magic_flag,
|
||||
};
|
||||
@@ -20,6 +20,7 @@ import SearchBox from "@/components/FolderView/SearchBox.vue";
|
||||
|
||||
import getData from "../composables/getFiles.js";
|
||||
import { onMounted, watch } from "@vue/runtime-core";
|
||||
import perks from "@/composables/perks.js";
|
||||
|
||||
export default {
|
||||
components: {
|
||||
@@ -53,6 +54,7 @@ export default {
|
||||
getPathFolders(path.value);
|
||||
|
||||
watch(route, (new_route) => {
|
||||
perks.search.value = "";
|
||||
path.value = new_route.params.path;
|
||||
getPathFolders(path.value);
|
||||
});
|
||||
|
||||
Reference in New Issue
Block a user