Skip to content

Instantly share code, notes, and snippets.

Avatar
🏠
Working from home

Erik Isidore iErik

🏠
Working from home
View GitHub Profile
View AvatarList.vue
<template>
<div class="avatar-list" :style="rootStyle">
<f-avatar
v-for="(avatar, index) in displayAvatars"
:key="index"
:src="avatar.image || fallbackAvatar"
:size="avatarSize"
class="avatar-list__avatar"
/>
View GivenFeedbacks.vue
<template>
<f-card class="chart-given-feedbacks">
<f-card-title>
<card-title :separator="false">
<template v-slot:title>
Quantidade de feedbacks dados por destino
</template>
</card-title>
</f-card-title>
<f-card-body>
View BasicInput.vue
<template>
<input-container v-bind="$attrs" :is-active="!!value || hasFocus">
<template v-for="slotName in fieldSlots" :slot="slotName">
<slot :name="slotName" />
</template>
<component
:is="componentIs"
:type="type"
:class="classes"
View DropZone.vue
<template>
<div class="drop-zone">
<div class="drop-zone__box" @click="$refs['fileInput'].click()">
<p class="drop-zone__text">
Arraste aqui seu arquivo ou clique
<span class="drop-zone__textHighlight">
para abrir os documentos
</span>
para fazer upload do arquivo
</p>
View central.vue
<template>
<page-template title="Central de Notificações">
<notification-center
:notification-types="notificationTypes"
:pagination="pagination"
:items="notifications"
@paginate="paginate"
/>
<div v-if="!isLoading" v-observe-visibility="observePagination" />
View notificationService.js
export default ({ http }) => ({
getAll: () =>
http
.get('users/notifications')
.then(res => res.data)
.catch(err => console.error('notifications.getAll: ', err)),
paginate: ({ perPage, archived, types }) =>
http
.get(
View NotificationItem.vue
<template>
<div class="NotificationItem">
<div class="NotificationItem__avatar">
<f-avatar :src="item.avatar || ''" />
</div>
<f-item class="NotificationItem__wrapper">
<div class="NotificationItem__content">
<p class="NotificationItem__content__msg" v-html="item.message" />
<p class="NotificationItem__content__time">{{ itemTime }}</p>
View DisplayPerPageExample.vue
<template>
<f-display-per-page :options="options" :change="updateSelected" />
</template>
<script>
export default {
data: () => ({ selected: 10 }),
computed: {
options() {
View CrudBuilder.js
import { mapActions } from 'vuex'
export default ({
createFn = '',
deleteFn = '',
updateFn = '',
paginationFn = '',
clearFn = ''
}) => ({
data: () => ({
View FMenuButton.vue
<template>
<div class="FMenuButton" :class="btnClass">
<div :class="btnContainerClass" @click="emitClick">
<div class="FMenuButton__icon">
<div
v-for="(line, index) in 3"
:key="index"
class="FMenuButton__line"
></div>
</div>