@nixweb/nixloc-ui 1.17.0 → 1.20.0

package/@nixweb/nixloc-ui/src/component/shared/FullCalendar.vue

@@ -1,174 +1,174 @@
-<template>
-  <div>
-    <Loading type="line" :center="false" v-show="loading" />
-    <FullCalendar :options="calendarOptions" />
-  </div>
-</template>
-
-<script>
-import "@fullcalendar/core/vdom"; // solves problem with Vite
-import FullCalendar from "@fullcalendar/vue";
-import dayGridPlugin from "@fullcalendar/daygrid";
-import timeGridPlugin from "@fullcalendar/timegrid";
-import listPlugin from "@fullcalendar/list";
-
-import interactionPlugin from "@fullcalendar/interaction";
-import Loading from "@nixweb/nixloc-ui/src/component/shared/Loading.vue";
-
-import { mapGetters } from "vuex";
-
-export default {
-  components: {
-    FullCalendar,
-    Loading,
-  },
-  props: {
-    changedCalendar: Function,
-    clickedCalendar: Function,
-    clickedEvent: Function,
-    loading: Boolean,
-  },
-  data() {
-    return {
-      calendarOptions: {
-        plugins: [dayGridPlugin, timeGridPlugin, listPlugin, interactionPlugin],
-        initialView: "dayGridMonth",
-        locale: "pt-br",
-        allDayText: "Dia inteiro",
-        headerToolbar: {
-          start: "today prev,next",
-          center: "title",
-          end: "timeGridDay,dayGridWeek,dayGridMonth,listYear",
-        },
-        buttonText: {
-          today: "Hoje",
-          month: "Mês",
-          week: "Semana",
-          day: "Dia",
-          list: "Ano",
-        },
-        dateClick: this.handleDateClick,
-        eventClick: this.handleEventClick,
-        viewDidMount: this.handleEventRender,
-        datesSet: this.handleChange,
-        events: [],
-      },
-    };
-  },
-  computed: {
-    ...mapGetters("generic", ["event"]),
-  },
-  methods: {
-    handleChange(arg) {
-      if (this.changedCalendar) this.changedCalendar(arg);
-    },
-    handleEventRender(arg) { },
-    handleDateClick: function (arg) {
-      if (this.clickedCalendar) this.clickedCalendar(arg);
-    },
-    handleEventClick: function (arg) {
-      if (this.clickedEvent) this.clickedEvent(arg.event._def);
-    },
-  },
-  watch: {
-    event: {
-      handler(event) {
-        if (event.name == "updateCalendar")
-          event.data.forEach(item => {
-            this.calendarOptions.events.push(item);
-          });
-
-        if (event.name == "cleanCalendar")
-          this.calendarOptions.events = [];
-      },
-      deep: true,
-    },
-  },
-};
-</script>
-<style>
-.fc .fc-daygrid-day.fc-day-today {
-  background-color: #f1f3f4;
-}
-
-.fc-button-primary {
-  background-color: #4bb4e2 !important;
-  border-color: white !important;
-  border: 0px !important;
-  margin-left: 5px !important;
-  border-radius: 15px !important;
-  font-size: 13px !important;
-  cursor: pointer !important;
-  border: none !important;
-  min-width: 33px !important;
-  font-weight: normal !important;
-  font-style: normal !important;
-  letter-spacing: 1px !important;
-  -webkit-box-shadow: 0px 10px 20px -6px rgb(0 0 0 / 12%) !important;
-  -moz-box-shadow: 0px 10px 20px -6px rgba(0, 0, 0, 0.12) !important;
-  box-shadow: 0px 10px 20px -6px rgb(0 0 0 / 12%) !important;
-}
-
-.fc-timeGridDay-button {
-  background-color: #577696 !important;
-  border-color: white !important;
-}
-
-.fc-dayGridWeek-button {
-  background-color: #577696 !important;
-  border-color: white !important;
-}
-
-.fc-dayGridMonth-button {
-  background-color: #577696 !important;
-  border-color: white !important;
-}
-
-.fc-listYear-button {
-  background-color: #577696 !important;
-  border-color: white !important;
-}
-
-.fc .fc-daygrid-day-number {
-  font-size: 16px !important;
-}
-
-.fc-button-active {
-  background-color: #89ceeb !important;
-}
-
-.fc-event-title {
-  color: black !important;
-  cursor: pointer !important;
-}
-
-.fc-event-time {
-  color: black !important;
-  font-weight: normal !important;
-}
-
-.fc-list-day-side-text {
-  color: black !important;
-}
-
-.fc-list-day-text {
-  color: black !important;
-}
-
-.fc-col-header-cell-cushion {
-  color: black !important;
-}
-
-.fc-daygrid-day-number {
-  color: black !important;
-}
-
-.fc-list-event-title {
-  cursor: pointer !important;
-}
-
-.fc-button-primary:hover {
-  background: #3e90b3 !important;
-}
-
+<template>
+  <div>
+    <Loading type="line" :center="false" v-show="loading" />
+    <FullCalendar :options="calendarOptions" />
+  </div>
+</template>
+
+<script>
+import "@fullcalendar/core/vdom"; // solves problem with Vite
+import FullCalendar from "@fullcalendar/vue";
+import dayGridPlugin from "@fullcalendar/daygrid";
+import timeGridPlugin from "@fullcalendar/timegrid";
+import listPlugin from "@fullcalendar/list";
+
+import interactionPlugin from "@fullcalendar/interaction";
+import Loading from "@nixweb/nixloc-ui/src/component/shared/Loading.vue";
+
+import { mapGetters } from "vuex";
+
+export default {
+  components: {
+    FullCalendar,
+    Loading,
+  },
+  props: {
+    changedCalendar: Function,
+    clickedCalendar: Function,
+    clickedEvent: Function,
+    loading: Boolean,
+  },
+  data() {
+    return {
+      calendarOptions: {
+        plugins: [dayGridPlugin, timeGridPlugin, listPlugin, interactionPlugin],
+        initialView: "dayGridMonth",
+        locale: "pt-br",
+        allDayText: "Dia inteiro",
+        headerToolbar: {
+          start: "today prev,next",
+          center: "title",
+          end: "timeGridDay,dayGridWeek,dayGridMonth,listYear",
+        },
+        buttonText: {
+          today: "Hoje",
+          month: "Mês",
+          week: "Semana",
+          day: "Dia",
+          list: "Ano",
+        },
+        dateClick: this.handleDateClick,
+        eventClick: this.handleEventClick,
+        viewDidMount: this.handleEventRender,
+        datesSet: this.handleChange,
+        events: [],
+      },
+    };
+  },
+  computed: {
+    ...mapGetters("generic", ["event"]),
+  },
+  methods: {
+    handleChange(arg) {
+      if (this.changedCalendar) this.changedCalendar(arg);
+    },
+    handleEventRender(arg) { },
+    handleDateClick: function (arg) {
+      if (this.clickedCalendar) this.clickedCalendar(arg);
+    },
+    handleEventClick: function (arg) {
+      if (this.clickedEvent) this.clickedEvent(arg.event._def);
+    },
+  },
+  watch: {
+    event: {
+      handler(event) {
+        if (event.name == "updateCalendar")
+          event.data.forEach(item => {
+            this.calendarOptions.events.push(item);
+          });
+
+        if (event.name == "cleanCalendar")
+          this.calendarOptions.events = [];
+      },
+      deep: true,
+    },
+  },
+};
+</script>
+<style>
+.fc .fc-daygrid-day.fc-day-today {
+  background-color: #f1f3f4;
+}
+
+.fc-button-primary {
+  background-color: #4bb4e2 !important;
+  border-color: white !important;
+  border: 0px !important;
+  margin-left: 5px !important;
+  border-radius: 15px !important;
+  font-size: 13px !important;
+  cursor: pointer !important;
+  border: none !important;
+  min-width: 33px !important;
+  font-weight: normal !important;
+  font-style: normal !important;
+  letter-spacing: 1px !important;
+  -webkit-box-shadow: 0px 10px 20px -6px rgb(0 0 0 / 12%) !important;
+  -moz-box-shadow: 0px 10px 20px -6px rgba(0, 0, 0, 0.12) !important;
+  box-shadow: 0px 10px 20px -6px rgb(0 0 0 / 12%) !important;
+}
+
+.fc-timeGridDay-button {
+  background-color: #577696 !important;
+  border-color: white !important;
+}
+
+.fc-dayGridWeek-button {
+  background-color: #577696 !important;
+  border-color: white !important;
+}
+
+.fc-dayGridMonth-button {
+  background-color: #577696 !important;
+  border-color: white !important;
+}
+
+.fc-listYear-button {
+  background-color: #577696 !important;
+  border-color: white !important;
+}
+
+.fc .fc-daygrid-day-number {
+  font-size: 16px !important;
+}
+
+.fc-button-active {
+  background-color: #89ceeb !important;
+}
+
+.fc-event-title {
+  color: black !important;
+  cursor: pointer !important;
+}
+
+.fc-event-time {
+  color: black !important;
+  font-weight: normal !important;
+}
+
+.fc-list-day-side-text {
+  color: black !important;
+}
+
+.fc-list-day-text {
+  color: black !important;
+}
+
+.fc-col-header-cell-cushion {
+  color: black !important;
+}
+
+.fc-daygrid-day-number {
+  color: black !important;
+}
+
+.fc-list-event-title {
+  cursor: pointer !important;
+}
+
+.fc-button-primary:hover {
+  background: #3e90b3 !important;
+}
+
 </style>

package/@nixweb/nixloc-ui/src/component/shared/HeaderReport.vue

@@ -1,47 +1,47 @@
-<template>
-  <div class="div-header">
-    <div class="title-report-header">
-      <span v-if="!title">
-        Relatório
-        <span>{{ $route.params.name }}</span>
-      </span>
-      <span v-else>
-        <span>{{ title }}</span>
-      </span>
-    </div>
-    <div v-if="!title" class="side-by-side div-tag" v-for="tag in tags" :key="tag.id">
-      <span>{{ tag.title }}</span> <span>{{ tag.value }}</span>
-      <span>,</span>
-    </div>
-  </div>
-</template>
-
-<script>
-import { mapGetters } from "vuex";
-
-export default {
-  name: "HeaderReport",
-  props: {
-    title: String
-  },
-  computed: {
-    ...mapGetters("report", ["tags"]),
-    fileName() {
-      return this.$route.matched[0].props.default.report;
-    },
-  },
-};
-</script>
-<style scoped>
-.div-header {
-  margin-bottom: 20px;
-}
-
-.div-tag {
-  margin-right: 10px;
-}
-
-.title-report-header {
-  font-size: 18px;
-}
-</style>
+<template>
+  <div class="div-header">
+    <div class="title-report-header">
+      <span v-if="!title">
+        Relatório
+        <span>{{ $route.params.name }}</span>
+      </span>
+      <span v-else>
+        <span>{{ title }}</span>
+      </span>
+    </div>
+    <div v-if="!title" class="side-by-side div-tag" v-for="tag in tags" :key="tag.id">
+      <span>{{ tag.title }}</span> <span>{{ tag.value }}</span>
+      <span>,</span>
+    </div>
+  </div>
+</template>
+
+<script>
+import { mapGetters } from "vuex";
+
+export default {
+  name: "HeaderReport",
+  props: {
+    title: String
+  },
+  computed: {
+    ...mapGetters("report", ["tags"]),
+    fileName() {
+      return this.$route.matched[0].props.default.report;
+    },
+  },
+};
+</script>
+<style scoped>
+.div-header {
+  margin-bottom: 20px;
+}
+
+.div-tag {
+  margin-right: 10px;
+}
+
+.title-report-header {
+  font-size: 18px;
+}
+</style>

package/@nixweb/nixloc-ui/src/component/shared/HorizontalFilter.vue

@@ -1,64 +1,64 @@
-<template>
-  <div class="filter-horizontal">
-    <Collapse :buttonShow="{
-      title: 'Mais filtros',
-      icon: 'fas fa-arrow-alt-circle-down',
-      type: 'info',
-    }" :buttonHide="{
-      title: 'Menos filtros',
-      icon: 'fas fa-arrow-alt-circle-up',
-      type: 'warning',
-    }">
-      <slot name="content-filter-horizontal"></slot>
-    </Collapse>
-  </div>
-</template>
-
-<script>
-import Collapse from "./Collapse.vue";
-import SelectStatic from "../forms/SelectStatic.vue";
-import Select from "../forms/Select";
-
-import { mapMutations, mapState } from "vuex";
-
-export default {
-  name: "ListViewWithHandlerData",
-  components: { Select, SelectStatic, Collapse },
-  props: {
-    showTotalPerPage: {
-      type: Boolean,
-      default: true,
-    },
-  },
-  data() {
-    return {
-      initialValue: {}
-    }
-  },
-  created() {
-    this.initialValue = { content: this.paginations.totalPerPage, id: this.paginations.totalPerPage }
-  },
-  computed: {
-    ...mapState("generic", ["paginations"]),
-    totalPerPage: {
-      get() {
-        return this.$store.state.generic.paginations.totalPerPage;
-      },
-      set(value) {
-        this.updateTotalPerPage(value);
-      },
-    },
-  },
-  methods: {
-    ...mapMutations("generic", [
-      "updateTotalPerPage",
-    ]),
-  }
-};
-</script>
-
-<style scoped>
-.filter-horizontal {
-  margin-bottom: 5px;
-}
-</style>
+<template>
+  <div class="filter-horizontal">
+    <Collapse :buttonShow="{
+      title: 'Mais filtros',
+      icon: 'fas fa-arrow-alt-circle-down',
+      type: 'info',
+    }" :buttonHide="{
+      title: 'Menos filtros',
+      icon: 'fas fa-arrow-alt-circle-up',
+      type: 'warning',
+    }">
+      <slot name="content-filter-horizontal"></slot>
+    </Collapse>
+  </div>
+</template>
+
+<script>
+import Collapse from "./Collapse.vue";
+import SelectStatic from "../forms/SelectStatic.vue";
+import Select from "../forms/Select";
+
+import { mapMutations, mapState } from "vuex";
+
+export default {
+  name: "ListViewWithHandlerData",
+  components: { Select, SelectStatic, Collapse },
+  props: {
+    showTotalPerPage: {
+      type: Boolean,
+      default: true,
+    },
+  },
+  data() {
+    return {
+      initialValue: {}
+    }
+  },
+  created() {
+    this.initialValue = { content: this.paginations.totalPerPage, id: this.paginations.totalPerPage }
+  },
+  computed: {
+    ...mapState("generic", ["paginations"]),
+    totalPerPage: {
+      get() {
+        return this.$store.state.generic.paginations.totalPerPage;
+      },
+      set(value) {
+        this.updateTotalPerPage(value);
+      },
+    },
+  },
+  methods: {
+    ...mapMutations("generic", [
+      "updateTotalPerPage",
+    ]),
+  }
+};
+</script>
+
+<style scoped>
+.filter-horizontal {
+  margin-bottom: 5px;
+}
+</style>