79 lines
2.6 KiB
Vue
79 lines
2.6 KiB
Vue
<template>
|
|
<multi-select
|
|
placeholder="control.project_selected"
|
|
:inputHandler="selectedProjects"
|
|
:selected="selectedProjectIds"
|
|
:service="projectService"
|
|
name="projects"
|
|
:size="size"
|
|
@onOptionsLoad="onLoad"
|
|
>
|
|
</multi-select>
|
|
</template>
|
|
|
|
<script>
|
|
import MultiSelect from '@/components/MultiSelect';
|
|
import ProjectService from '@/services/resource/project.service';
|
|
|
|
const localStorageKey = 'amazingcat.local.storage.project_select';
|
|
|
|
export default {
|
|
name: 'ProjectSelect',
|
|
components: {
|
|
MultiSelect,
|
|
},
|
|
props: {
|
|
size: {
|
|
type: String,
|
|
default: 'normal',
|
|
},
|
|
value: {
|
|
type: Array,
|
|
default: null,
|
|
},
|
|
},
|
|
data() {
|
|
const selectedProjectIds =
|
|
this.value !== null ? this.value : JSON.parse(localStorage.getItem(localStorageKey));
|
|
|
|
return {
|
|
projectService: new ProjectService(),
|
|
selectedProjectIds,
|
|
ids: [],
|
|
};
|
|
},
|
|
methods: {
|
|
onLoad(allSelectOptions) {
|
|
const allProjectIds = allSelectOptions.map(option => option.id);
|
|
this.ids = allProjectIds;
|
|
// Select all options if storage is empty
|
|
if (!localStorage.getItem(localStorageKey)) {
|
|
this.selectedProjectIds = allProjectIds;
|
|
localStorage.setItem(localStorageKey, JSON.stringify(this.selectedProjectIds));
|
|
this.$emit('change', this.selectedProjectIds);
|
|
this.$nextTick(() => this.$emit('loaded'));
|
|
return;
|
|
}
|
|
|
|
// Remove options that no longer exists
|
|
const existingProjectIds = this.selectedProjectIds.filter(projectId =>
|
|
allProjectIds.includes(projectId),
|
|
);
|
|
|
|
if (this.selectedProjectIds.length > existingProjectIds.length) {
|
|
this.selectedProjectIds = existingProjectIds;
|
|
localStorage.setItem(localStorageKey, JSON.stringify(this.selectedProjectIds));
|
|
}
|
|
|
|
this.$emit('change', this.selectedProjectIds);
|
|
this.$nextTick(() => this.$emit('loaded'));
|
|
},
|
|
selectedProjects(values) {
|
|
this.selectedProjectIds = values;
|
|
localStorage.setItem(localStorageKey, JSON.stringify(this.selectedProjectIds));
|
|
this.$emit('change', values);
|
|
},
|
|
},
|
|
};
|
|
</script>
|