jbourdon/social-media
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Added images

Browse Source
This commit is contained in:
Dominic Villemure
2024-06-30 23:39:56 -04:00
parent 169e2cc160
commit 5f54b69e00
7 changed files with 160 additions and 82 deletions
Download Patch File Download Diff File Expand all files Collapse all files

51
src/views/main/SocialLinks.vue
View File

@@ -2,12 +2,36 @@
<div ref="container">
<div class="text-center text-2xl py-4 border-t-4">Liens des réseaux sociaux et de votre site</div>
<div class="px-5 py-2 flex flex-col space-y-4">
<div v-for="network in socialNetworks" :key="network.field">
<div class="flex justify-between items-center mb-2">
<label class="text-lg">{{ network.label }}</label>
</div>
<v-text-field v-model="network.value" :label="network.label" variant="outlined"></v-text-field>
<div class="flex justify-between items-center mb-2">
<label class="text-lg">Instagram</label>
</div>
<v-text-field v-model="props.user.socialNetworks.instagramUrl" label="Instagram" variant="outlined"></v-text-field>
<div class="flex justify-between items-center mb-2">
<label class="text-lg">TikTok</label>
</div>
<v-text-field v-model="props.user.socialNetworks.tikTokUrl" label="TikTok" variant="outlined"></v-text-field>
<div class="flex justify-between items-center mb-2">
<label class="text-lg">Facebook</label>
</div>
<v-text-field v-model="props.user.socialNetworks.facebookUrl" label="Facebook" variant="outlined"></v-text-field>
<div class="flex justify-between items-center mb-2">
<label class="text-lg">X</label>
</div>
<v-text-field v-model="props.user.socialNetworks.xUrl" label="X" variant="outlined"></v-text-field>
<div class="flex justify-between items-center mb-2">
<label class="text-lg">LinkedIn</label>
</div>
<v-text-field v-model="props.user.socialNetworks.linkedInUrl" label="LinkedIn" variant="outlined"></v-text-field>
<div class="flex justify-between items-center mb-2">
<label class="text-lg">Site Web</label>
</div>
<v-text-field v-model="props.user.socialNetworks.yourWebsiteUrl" label="Site Web" variant="outlined"></v-text-field>
<div class="flex flex-col space-y-4">
<div class="flex items-center mb-2">
<label class="text-lg mr-4">Icône pour votre site web *svg</label>
@@ -22,22 +46,16 @@
</template>
<script setup>
import {defineProps, ref} from 'vue';
import { defineProps, ref } from 'vue';
import MyUserModel from "@/models/myUserModel.js";
const props = defineProps({
socialNetworks: { type: Object },
user: { type: MyUserModel },
});
const socialNetworks = ref([
{ label: 'Instagram', field: 'instagram', value: props.socialNetworks.instagramUrl },
{ label: 'TikTok', field: 'tiktok', value: props.socialNetworks.tikTokUrl },
{ label: 'Facebook', field: 'facebook', value: props.socialNetworks.facebookUrl },
{ label: 'X', field: 'X', value: props.socialNetworks.xUrl },
{ label: 'LinkedIn', field: 'linkedin', value: props.socialNetworks.linkedInUrl },
{ label: 'Site Web', field: 'website', value: props.socialNetworks.yourWebsiteUrl }
]);
const emit = defineEmits(["updateWebsiteIcon"]);
const iconUrl = ref('');
const iconUrl = ref(props.user.storedDataUrls.websiteIconUrl);
const iconFile = ref(null);
const onFileChange = (event) => {
@@ -48,6 +66,7 @@ const onFileChange = (event) => {
iconUrl.value = e.target.result;
};
reader.readAsDataURL(file);
emit("updateWebsiteIcon", file)
}
};
</script>