jaro/ikea
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Compare contoller, commands for search articles from command line

Browse Source
This commit is contained in:
Jaroslav Drzik
2023-11-27 18:45:38 +01:00
parent eb3ed24204
commit 3e3bcce806
9 changed files with 573 additions and 27 deletions
Download Patch File Download Diff File Expand all files Collapse all files

70
resources/js/Pages/IkeaRoot.vue
View File

@@ -1,6 +1,4 @@
<script setup>
// import { defineComponent, h } from 'vue';
import { getCurrentInstance, ref, onMounted, onUnmounted, nextTick } from 'vue';
import Swal from 'sweetalert2';
import LogoIkea from '@/assets/Ikea_logo.svg';
@@ -8,6 +6,7 @@ import Multiselect from 'vue-multiselect';
import { GChart } from 'vue-google-charts';
import { FwbDropdown, FwbListGroup, FwbListGroupItem } from 'flowbite-vue';
import EasyTable from "vue3-easy-data-table";
//import autocomplete from '@trevoreyre/autocomplete-vue';
import {
@@ -37,16 +36,26 @@ const chart_settings = {
mapsApiKey: "AIzaSyAJaLArHgTmQPMOSogitG-umhZilVIgdNU",
};
const gchartEvents = ref({
regionClick: () => {
const selection = getSelection()
console.log(selection);
console.log("T");
}
},);
const fetch = async () => {
try {
const response = await axios.get(route('ccountry.active'))
ccountry.value = response.data
let aCntry = ccountry.value.map((country) => [country.country_name]);
ccountry_filter.value.push(...aCntry);
ccountry_list.value = ccountry.value.map((country) => country.country_name);
var i=1;
items.value = ccountry.value.map((country) => { return {"country": country.country_name, "currency": country.currency_code, "id": i++ } });
var i = 1;
items.value = ccountry.value.map((country) => { return { "country": country.country_name, "currency": country.currency_code, "id": i++ } });
console.log("TEST=", ccountry_filter.value, ccountry_list.value);
} catch (e) {
const response = await Swal.fire({
@@ -62,19 +71,20 @@ const fetch = async () => {
}
const headers = ref([
{ text: "Id", value: "id", sortable: true },
{ text: "Country", value: "country",sortable: true},
{ text: "Currency", value: "currency"},
]);
{ text: "Id", value: "id", sortable: true },
{ text: "Country", value: "country", sortable: true },
{ text: "Currency", value: "currency" },
]);
const items = ref([]);
function selectCountry(item,id) {
let cCntry = [ ['Country'], ];
function selectCountry(item, id) {
let cCntry = [['Country'],];
let aCntry = selected.value.map((country) => [country]);
ccountry_filter.value = cCntry;
ccountry_filter.value.push(...aCntry);
}
onMounted(fetch);
</script>
@@ -103,25 +113,35 @@ onMounted(fetch);
</template>
</fwb-navbar>
<div class="m-3">
<div class="flex flex-wrap gap-2 justify-center align-middle ">
<div class="justify-center rounded-md border-black border-8 max-h-[518px]" >
<GChart :type="type" :data="ccountry_filter" :options="options" :settings="chart_settings" />
</div>
<div class="mr-auto">
<div class="flex flex-col start-0">
<span class="font-extrabold font-mono">Zadaj krajiny v ktorych chces vyhadavat</span>
</div>
<div>
<multiselect :close-on-select="false" :multiple="true" v-model="selected" :options="ccountry_list" @select="selectCountry" @remove="selectCountry">
</multiselect>
<div class="flex flex-wrap gap-2 justify-center align-middle ">
<div class="justify-center rounded-md border-black border-8 max-h-[518px]">
<GChart :events="gchartEvents" :type="type" :data="ccountry_filter" :options="options"
:settings="chart_settings" />
</div>
<div class="mr-auto">
<div class="flex flex-col start-0">
<span class="font-extrabold font-mono">Zadaj krajiny v ktorych chces vyhadavat</span>
</div>
<div>
<multiselect :close-on-select="false" :multiple="true" v-model="selected" :options="ccountry_list"
@select="selectCountry" @remove="selectCountry">
</multiselect>
</div>
<div>
<span class="font-extrabold font-mono">Zadaj polozku</span>
</div>
<div>
<multiselect :multiple="false" :options="[]">
</multiselect>
</div>
<div class="mt-5">
<EasyTable rows-per-page=10 :headers="headers" :items="items"></EasyTable>
<EasyTable :rows-per-page=10 :headers="headers" :items="items"></EasyTable>
</div>
</div>
</div>
</div>
</div>
</template>
<style>
@import 'vue3-easy-data-table/dist/style.css';