mirror of
https://github.com/mealie-recipes/mealie.git
synced 2025-07-23 15:19:41 +02:00
Feature/shopping lists second try (#927)
* generate types * use generated types * ui updates * init button link for common styles * add links * setup label views * add delete confirmation * reset when not saved * link label to foods and auto set when adding to shopping list * generate types * use inheritence to manage exception handling * fix schema generation and add test for open_api generation * add header to api docs * move list consilidation to service * split list and list items controller * shopping list/list item tests - PARTIAL * enable recipe add/remove in shopping lists * generate types * linting * init global utility components * update types and add list item api * fix import cycle and database error * add container and border classes * new recipe list component * fix tests * breakout item editor * refactor item editor * update bulk actions * update input / color contrast * type generation * refactor controller dependencies * include food/unit editor * remove console.logs * fix and update type generation * fix incorrect type for column * fix postgres error * fix delete by variable * auto remove refs * fix typo
This commit is contained in:
parent
f794208862
commit
92cf97e401
66 changed files with 2556 additions and 685 deletions
66
frontend/components/global/InputColor.vue
Normal file
66
frontend/components/global/InputColor.vue
Normal file
|
@ -0,0 +1,66 @@
|
|||
<template>
|
||||
<v-text-field v-model="inputVal" label="Color">
|
||||
<template #prepend>
|
||||
<v-btn class="elevation-0" small height="30px" width="30px" :color="inputVal || 'grey'" @click="setRandomHex">
|
||||
<v-icon color="white">
|
||||
{{ $globals.icons.refreshCircle }}
|
||||
</v-icon>
|
||||
</v-btn>
|
||||
</template>
|
||||
<template #append>
|
||||
<v-menu v-model="menu" left nudge-left="30" nudge-top="20" :close-on-content-click="false">
|
||||
<template #activator="{ on }">
|
||||
<v-icon v-on="on">
|
||||
{{ $globals.icons.formatColorFill }}
|
||||
</v-icon>
|
||||
</template>
|
||||
<v-card>
|
||||
<v-card-text class="pa-0">
|
||||
<v-color-picker v-model="inputVal" flat hide-inputs show-swatches swatches-max-height="200" />
|
||||
</v-card-text>
|
||||
</v-card>
|
||||
</v-menu>
|
||||
</template>
|
||||
</v-text-field>
|
||||
</template>
|
||||
|
||||
<script lang="ts">
|
||||
import { defineComponent, computed, ref } from "@nuxtjs/composition-api";
|
||||
|
||||
export default defineComponent({
|
||||
props: {
|
||||
value: {
|
||||
type: String,
|
||||
required: true,
|
||||
},
|
||||
},
|
||||
setup(props, context) {
|
||||
const menu = ref(false);
|
||||
|
||||
const inputVal = computed({
|
||||
get: () => {
|
||||
return props.value;
|
||||
},
|
||||
set: (val) => {
|
||||
context.emit("input", val);
|
||||
},
|
||||
});
|
||||
|
||||
function getRandomHex() {
|
||||
return "#000000".replace(/0/g, function () {
|
||||
return (~~(Math.random() * 16)).toString(16);
|
||||
});
|
||||
}
|
||||
|
||||
function setRandomHex() {
|
||||
inputVal.value = getRandomHex();
|
||||
}
|
||||
|
||||
return {
|
||||
menu,
|
||||
setRandomHex,
|
||||
inputVal,
|
||||
};
|
||||
},
|
||||
});
|
||||
</script>
|
Loading…
Add table
Add a link
Reference in a new issue