Rename some files
This commit is contained in:
parent
549f0ce6f7
commit
3296aad479
|
@ -1,6 +1,6 @@
|
||||||
import categories from "./data";
|
import categories from "./components";
|
||||||
|
|
||||||
export default class Component {
|
export default class Filter {
|
||||||
|
|
||||||
constructor() {
|
constructor() {
|
||||||
this.categories = categories;
|
this.categories = categories;
|
|
@ -5,8 +5,8 @@
|
||||||
|
|
||||||
<div class="max-w-2xl mx-auto">
|
<div class="max-w-2xl mx-auto">
|
||||||
<div class="mt-4">
|
<div class="mt-4">
|
||||||
<span v-for="category in categories" :key="category.name">
|
<span v-for="i in categories" :key="i.name">
|
||||||
<button @click="searchText = category.name" class="ml-2 mt-2 px-3 py-1 cursor-pointer hover:bg-gray-700 hover:text-gray-200 rounded text-sm focus:outline-none" :class="category.name === searchText? 'bg-gray-700 text-gray-200' : 'bg-gray-200 text-gray-700'">{{ category.name }}</button>
|
<button @click="category = i.name" class="ml-2 mt-2 px-3 py-1 cursor-pointer hover:bg-gray-700 hover:text-gray-200 rounded text-sm focus:outline-none" :class="i.name === category? 'bg-gray-700 text-gray-200' : 'bg-gray-200 text-gray-700'">{{ i.name }}</button>
|
||||||
</span>
|
</span>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
@ -77,7 +77,7 @@ import SimpleFooter from "./UI/Footers/SimpleFooter";
|
||||||
import FooterWithSubscribeForm from "./UI/Footers/FooterWithSubscribeForm";
|
import FooterWithSubscribeForm from "./UI/Footers/FooterWithSubscribeForm";
|
||||||
|
|
||||||
import BackToTop from 'vue-backtotop';
|
import BackToTop from 'vue-backtotop';
|
||||||
import Component from "../Models/Component";
|
import Filter from "../Models/Filter";
|
||||||
import ViewComponent from "./Utilities/ViewComponent";
|
import ViewComponent from "./Utilities/ViewComponent";
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
|
@ -123,17 +123,19 @@ export default {
|
||||||
},
|
},
|
||||||
data() {
|
data() {
|
||||||
return {
|
return {
|
||||||
|
category: 'Alert',
|
||||||
categories: [],
|
categories: [],
|
||||||
searchText: 'Alert',
|
component: new Filter(),
|
||||||
component: new Component(),
|
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
|
||||||
created() {
|
created() {
|
||||||
this.categories = this.component.all();
|
this.categories = this.component.all();
|
||||||
},
|
},
|
||||||
|
|
||||||
computed: {
|
computed: {
|
||||||
list() {
|
list() {
|
||||||
return this.component.whereCategory(this.searchText);
|
return this.component.whereCategory(this.category);
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
}
|
}
|
||||||
|
|
Loading…
Reference in a new issue