Commit b9a78cf5 authored by MARCO Jonathan's avatar MARCO Jonathan
Browse files

Update the color for the condition chips

parent f5b18849
......@@ -2,26 +2,26 @@
<v-chip-group column>
<draggable :value="items" class="draggableContainer" @change="onMoveItem" v-if="!readOnly">
<v-chip
draggable
outlined
color="primary"
v-for="(item, i) in items"
:key="`${item.id}_${i}`"
class="draggableItem"
close-icon="mdi-close"
close
@click:close="onDeleteItem(item)"
draggable
outlined
:color="getColor(item)"
v-for="(item, i) in items"
:key="`${item.id}_${i}`"
class="draggableItem"
close-icon="mdi-close"
close
@click:close="onDeleteItem(item)"
>
{{ displayItem(item) }}
</v-chip>
</draggable>
<div v-else>
<v-chip
:ripple="false"
outlined
color="primary"
v-for="(item, i) in items"
:key="`${item.id}_${i}-readonly`"
:ripple="false"
outlined
:color="getColor(item)"
v-for="(item, i) in items"
:key="`${item.id}_${i}-readonly`"
>
{{ displayItem(item) }}
</v-chip>
......@@ -60,6 +60,18 @@ export default vue.extend({
},
methods: {
getColor(item: FieldCondition): '#afbb00' | '#0060ab' | '#ff4d00' | '#9800ff' {
if (item.type === 'field') {
return '#ff4d00';
} else if (item.type === 'item') {
if (item.value === '&&' || item.value === '||') {
return '#0060ab';
}
return '#afbb00';
}
return '#9800ff';
},
displayItem(item: FieldCondition): string {
switch (item.type) {
case 'field':
......@@ -80,10 +92,10 @@ export default vue.extend({
},
onDeleteItem(itemDeleted: FieldCondition): void {
this.items.splice(
this.items.findIndex(
(item: FieldCondition) => (item.id === itemDeleted.id && item.value === itemDeleted.value),
),
1,
this.items.findIndex(
(item: FieldCondition) => (item.id === itemDeleted.id && item.value === itemDeleted.value),
),
1,
);
},
......
Supports Markdown
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment