Docker/mealie
Docker/mealie
1
0
Fork 0
mirror of https://github.com/mealie-recipes/mealie.git synced 2025-07-21 14:19:41 +02:00
Code Issues Releases Activity

Add Web Share api to ContextMenu.vue (#462)

Browse source 
* Add Web Share api to ContextMenu.vue. Copy to clipboard is the fallback

* Add Web Share api to ContextMenu.vue. Copy to clipboard is the fallback

* Add translation
This commit is contained in:
zierbeek 2021-06-07 20:54:34 +02:00 • committed by GitHub
parent 59f8b74460
commit f7f5c97f07
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
5 changed files with 15308 additions and 19 deletions
Download patch file Download diff file Expand all files Collapse all files

29
frontend/src/components/Recipe/ContextMenu.vue
View file

@ -33,6 +33,7 @@
<script>
import ConfirmationDialog from "@/components/UI/Dialogs/ConfirmationDialog.vue";
import { api } from "@/api";
import { utils } from "@/utils";
export default {
components: {
ConfirmationDialog,
@ -44,6 +45,9 @@ export default {
menuIcon: {
default: "mdi-dots-vertical",
},
name: {
type: String,
},
},
computed: {
loggedIn() {
@ -64,8 +68,8 @@ export default {
action: "print",
},
{
title: this.$t("general.link"),
icon: "mdi-content-copy",
title: this.$t("general.share"),
icon: "mdi-share-variant",
color: "accent",
action: "share",
},
@ -88,6 +92,9 @@ export default {
...this.defaultMenu,
];
},
recipeText() {
return this.$t("recipe.share-recipe-message", [this.name]);
},
},
data() {
return {
@ -103,7 +110,15 @@ export default {
this.$refs.deleteRecipieConfirm.open();
break;
case "share":
this.updateClipboard();
if (navigator.share){
navigator.share({
title: this.name,
text: this.recipeText,
url: this.recipeURL,
})
.then(() => console.log('Successful share'))
.catch((error) => console.log('WebShareAPI not supported', error))
} else this.updateClipboard();
break;
case "edit":
this.$router.push(`/recipe/${this.slug}` + "?edit=true");
@ -123,10 +138,10 @@ export default {
updateClipboard() {
const copyText = this.recipeURL;
navigator.clipboard.writeText(copyText).then(
() => console.log("Copied", copyText),
() => console.log("Copied Failed", copyText)
);
() => { console.log("Copied to Clipboard", copyText);
utils.notify.success("Copied to Clipboard");},
() => console.log("Copied Failed", copyText));
},
},
};
}
</script>