This commit is contained in:
2023-11-21 19:32:12 +01:00
parent 9c37d49668
commit f76f277cd3
2 changed files with 53 additions and 56 deletions

View File

@@ -94,5 +94,6 @@
"mac 10.15": "Mac 10.15", "mac 10.15": "Mac 10.15",
"are you want to try again": "are you want to try again", "are you want to try again": "are you want to try again",
"referenceerror: ccount is not defined": "ReferenceError: ccount is not defined", "referenceerror: ccount is not defined": "ReferenceError: ccount is not defined",
"referenceerror: currency_code is not defined": "ReferenceError: currency_code is not defined" "referenceerror: currency_code is not defined": "ReferenceError: currency_code is not defined",
"referenceerror: assignment to undeclared variable acntry": "ReferenceError: assignment to undeclared variable aCntry"
} }

View File

@@ -17,19 +17,11 @@ import axios from 'axios';
import IkeaLogo from './Ikea/IkeaLogo.vue'; import IkeaLogo from './Ikea/IkeaLogo.vue';
const type = 'GeoChart'; const type = 'GeoChart';
const ccountry = ref([]); const ccountry = ref([]);
const ccountry_filter = ref([['Country'],]); const ccountry_filter = ref([['Country'],]);
const ccountry_list = ref(['TEST']); const ccountry_list = ref(['TEST']);
const selected = ref(null); const selected = ref(null);
const data = [
['Country', 'Popularity'],
['Germany', 200],
['France', 600],
['RU', 700],
];
const options = { const options = {
region: 150, region: 150,
@@ -46,7 +38,9 @@ const fetch = async () => {
try { try {
const response = await axios.get(route('ccountry.active')) const response = await axios.get(route('ccountry.active'))
ccountry.value = response.data ccountry.value = response.data
ccountry_filter.value = ccountry.value.map((country) => [ country.country_name ]); let aCntry = ccountry.value.map((country) => [country.country_name]);
ccountry_filter.value.push(...aCntry);
ccountry_list.value = ccountry.value.map((country) => country.country_name); ccountry_list.value = ccountry.value.map((country) => country.country_name);
console.log("TEST=", ccountry_filter.value, ccountry_list.value); console.log("TEST=", ccountry_filter.value, ccountry_list.value);
@@ -62,12 +56,17 @@ const fetch = async () => {
response.isConfirmed && fetch() response.isConfirmed && fetch()
} }
} }
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); onMounted(fetch);
</script> </script>
<template> <template>
<fwb-navbar> <fwb-navbar>
<template #logo> <template #logo>
<fwb-navbar-logo alt="IKEA Price Craweler" :image-url="LogoIkea" link="#"> <fwb-navbar-logo alt="IKEA Price Craweler" :image-url="LogoIkea" link="#">
@@ -91,19 +90,16 @@ onMounted(fetch);
</fwb-navbar-collapse> </fwb-navbar-collapse>
</template> </template>
</fwb-navbar> </fwb-navbar>
<div class="m-3">
<GChart <div class="grid gap-2">
:type="type" <div class="justify-center rounded-md border-black border-8 max-w-fit">
:data="ccountry_filter" <GChart :type="type" :data="ccountry_filter" :options="options" :settings="chart_settings" />
:options="options" </div>
:settings="chart_settings" <div class="max-">
/> <multiselect :multiple="true" v-model="selected" :options="ccountry_list" @select="selectCountry">
<multiselect
:multiple="true"
v-model="selected"
:options="ccountry_list">
</multiselect> </multiselect>
</div>
</div>
</div>
</template> </template>
<style src="vue-multiselect/dist/vue-multiselect.css"></style> <style src="vue-multiselect/dist/vue-multiselect.css"></style>