@nixweb/nixloc-ui 0.0.125 → 0.0.128

package/src/component/shared/TableItem.vue

@@ -0,0 +1,177 @@
+<template>
+  <div>
+    <div
+      v-if="obj.type === 'period-rent'"
+      class="period-rent"
+      @click="navegateTo(obj, row)"
+      :class="convertClass(row[obj.fieldComparison], obj.classCssBody)"
+    >
+      <DisplayPeriodRent :periodRent="row[obj.field]" :fontSize="14" :showDeliveryDevolution="true" />
+    </div>
+    <div
+      v-if="obj.type === 'text'"
+      :class="convertClass(row[obj.fieldComparison], obj.classCssBody)"
+    >
+      {{ row[obj.field] }}
+      <div>{{ row[obj.fieldSecond] }}</div>
+    </div>
+    <div v-if="obj.type === 'image'">
+      <img
+        :class="convertClass(row[obj.fieldComparison], obj.classCssBody)"
+        class="img"
+        :src="urlImage + obj.container + '/' + row[obj.field]"
+      />
+    </div>
+    <div v-if="obj.type === 'class'" class="text-center">
+      <div :class="convertClass(row[obj.fieldComparison], obj.classCssBody)">
+        {{ row[obj.field] }}
+      </div>
+    </div>
+    <div
+      v-if="obj.type === 'html'"
+      :class="convertClass(row[obj.fieldComparison], obj.classCssBody)"
+    >
+      <div v-if="row[obj.field]" v-html="row[obj.field]"></div>
+      <div v-else v-html="obj.html"></div>
+    </div>
+    <div
+      v-if="obj.type === 'select'"
+      :class="convertClass(row[obj.fieldComparison], obj.classCssBody)"
+    >
+      {{ row[obj.field].content }}
+    </div>
+    <div
+      v-if="obj.type === 'date'"
+      :class="convertClass(row[obj.fieldComparison], obj.classCssBody)"
+    >
+      {{ row[obj.field] | moment("DD/MM/YYYY") }}
+    </div>
+    <div
+      v-if="obj.type === 'dateTime'"
+      :class="convertClass(row[obj.fieldComparison], obj.classCssBody)"
+    >
+      {{ row[obj.field] | moment("DD/MM/YYYY HH:mm") }}
+    </div>
+    <div
+      v-if="obj.type === 'currency'"
+      :class="convertClass(row[obj.fieldComparison], obj.classCssBody)"
+    >
+      {{ row[obj.field] | currency }}
+    </div>
+    <div
+      v-if="obj.type === 'button'"
+      :class="convertClass(row[obj.fieldComparison], obj.classCssBody)"
+    >
+      <TableButton :obj="obj" :row="row" />
+    </div>
+    <div
+      v-if="obj.type === 'link'"
+      class="link"
+      :class="convertClass(row[obj.fieldComparison], obj.classCssBody)"
+      @click="navegateTo(obj, row)"
+    >
+      <span> {{ row[obj.field] }}</span>
+      <div class="field-second">{{ row[obj.fieldSecond] }}</div>
+    </div>
+  </div>
+</template>
+<script>
+import TableButton from "@nixweb/nixloc-ui/src/component/shared/TableButton.vue";
+import DisplayPeriodRent from "@nixweb/nixloc-ui/src/component/rental/DisplayPeriodRent";
+
+import { mapMutations } from "vuex";
+
+export default {
+  name: "TableItem",
+  components: { TableButton, DisplayPeriodRent },
+  props: {
+    obj: Object,
+    row: Object,
+  },
+  data() {
+    return {};
+  },
+  computed: {
+    urlImage() {
+      return "https://espaco.blob.core.windows.net/";
+    },
+  },
+  methods: {
+    ...mapMutations("generic", ["addSelected", "addEvent"]),
+    convertClass(fieldComparison, classCssBody) {
+      if (Array.isArray(classCssBody)) {
+        let ret = [];
+        classCssBody.forEach(function (value) {
+          let classCss = value.classCss;
+          let condition = value.fieldComparison == fieldComparison;
+          let obj = { [classCss]: condition };
+          ret.push(obj);
+        });
+        return ret;
+      } else {
+        return classCssBody;
+      }
+    },
+    navegateTo(obj, row) {
+      if (obj.routeName) {
+        this.$router.push({
+          name: obj.routeName,
+          params: { id: row.id, type: row.type },
+        });
+      } else {
+        this.addEvent({
+          name: obj.eventName,
+          data: row,
+        });
+      }
+    },
+  },
+};
+</script>
+<style scoped>
+.field-second {
+  color: rgb(83, 82, 82) !important;
+}
+
+.table-currency {
+  font-size: 14px;
+  min-width: 100px;
+}
+
+.link {
+  color: #3f529b;
+  font-size: 14px;
+  font-weight: 400;
+  cursor: pointer;
+}
+
+.link:hover {
+  text-decoration: underline;
+  transition: 0.1s;
+}
+
+.icon-link:hover {
+  font-size: 12.5px;
+}
+
+.center-vertical {
+  padding-top: 10px;
+}
+
+.badge-center {
+  margin: auto !important;
+}
+
+.img {
+  width: 50px;
+  height: 50px;
+}
+
+.img-round {
+  border-radius: 30px;
+}
+
+.period-rent {
+  cursor: pointer;
+}
+</style>

package/src/component/shared/TableTotalRecords.vue

@@ -3,10 +3,10 @@
     <div class="col-sm-12 text-right">
       <span class="c-title">
         Total de
-        <b-badge variant="warning">
-          <span class="c-total">{{ totalRecords }}</span>
-        </b-badge>
-        <span class="records">registros</span>
+        <div class="badge">
+          <span class="total-records">{{ totalRecords }}</span>
+        </div>
+        <span class="records">registro(s)</span>
       </span>
     </div>
   </div>
@@ -33,13 +33,12 @@ export default {
   font-size: 14px;
 }
 
-.c-total {
-  color: white;
-  font-size: 14px;
+.total-records {
+  font-size: 16px;
+  font-weight: 600;
 }
 
-.records{
+.records {
   margin-left: 5px;
 }
-
-</style>
+</style>

package/src/component/shared/TableTotalization.vue

@@ -1,47 +1,47 @@
-<template>
-  <div>
-    <div
-      class="badge-side-by-side text-center"
-      v-for="item in totalization"
-      :key="item.title"
-    >
-      <div class="badge-totalization" :class="item.classCss">
-        <span>{{ item.title }}</span>
-        <span>{{ item.value }}</span>
-      </div>
-    </div>
-  </div>
-</template>
-
-<script>
-export default {
-  name: "TableTotalization",
-  props: {
-    totalization: Array,
-  },
-};
-</script>
-
-<style scoped>
-.badge-side-by-side {
-  display: inline-block;
-  margin-right: 3px;
-  margin-bottom: 10px;
-}
-
-.badge-totalization {
-  border: 1px solid #dbdee0;
-  padding-left: 5px;
-  padding-right: 5px;
-  border-radius: 30px;
-  font-size: 15px;
-}
-
-.receita {
-  color: darkblue;
-}
-
-.despesa {
-  color: red;
-}
-</style>
+<template>
+  <div>
+    <div
+      class="badge-side-by-side text-center"
+      v-for="item in totalization"
+      :key="item.title"
+    >
+      <div class="badge-totalization" :class="item.classCss">
+        <span>{{ item.title }}</span>
+        <span>{{ item.value }}</span>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+export default {
+  name: "TableTotalization",
+  props: {
+    totalization: Array,
+  },
+};
+</script>
+
+<style scoped>
+.badge-side-by-side {
+  display: inline-block;
+  margin-right: 3px;
+  margin-bottom: 10px;
+}
+
+.badge-totalization {
+  border: 1px solid #dbdee0;
+  padding-left: 5px;
+  padding-right: 5px;
+  border-radius: 30px;
+  font-size: 15px;
+}
+
+.receita {
+  color: darkblue;
+}
+
+.despesa {
+  color: red;
+}
+</style>

package/src/component/shared/Tip.vue

@@ -1,42 +1,42 @@
-<template>
-  <span class="tip" v-if="title">
-    <i
-      class="fal fa-exclamation-circle"
-      :title="title"
-      v-b-popover.hover.top="description"
-    ></i>
-  </span>
-</template>
-<script>
-import { mapGetters } from "vuex";
-
-export default {
-  name: "Tip",
-  props: {
-    field: String,
-    formName: String,
-  },
-  data() {
-    return {
-      title: "",
-      description: "",
-    };
-  },
-  mounted() {
-    let tip = this.tip({ field: this.field, formName: this.formName });
-    if (tip) {
-      this.title = tip.title;
-      this.description = tip.description;
-    }
-  },
-  computed: {
-    ...mapGetters("generic", ["tip"]),
-  },
-};
-</script>
-
-<style scoped>
-.tip {
-  cursor: pointer;
-}
-</style>
+<template>
+  <span class="tip" v-if="title">
+    <i
+      class="fal fa-exclamation-circle"
+      :title="title"
+      v-b-popover.hover.top="description"
+    ></i>
+  </span>
+</template>
+<script>
+import { mapGetters } from "vuex";
+
+export default {
+  name: "Tip",
+  props: {
+    field: String,
+    formName: String,
+  },
+  data() {
+    return {
+      title: "",
+      description: "",
+    };
+  },
+  mounted() {
+    let tip = this.tip({ field: this.field, formName: this.formName });
+    if (tip) {
+      this.title = tip.title;
+      this.description = tip.description;
+    }
+  },
+  computed: {
+    ...mapGetters("generic", ["tip"]),
+  },
+};
+</script>
+
+<style scoped>
+.tip {
+  cursor: pointer;
+}
+</style>

package/src/component/shared/Toast.vue

@@ -1,54 +1,54 @@
-<template></template>
-
-<script>
-import { mapState } from "vuex";
-
-export default {
-  name: "Notificacao",
-  computed: {
-    ...mapState("generic", ["toast"]),
-  },
-  watch: {
-    toast: {
-      handler(value) {
-        this.notifica(value);
-      },
-      deep: true,
-    },
-  },
-  methods: {
-    notifica(value) {
-      if (value.type == "postApi" || value.type == "putApi")
-        this.$toasted.show("Salvo com success", {
-          type: "success",
-        });
-      if (value.type == "postApiError" || value.type == "putApiErro") {
-        this.$toasted.show("Ops! Algo deu errado", {
-          type: "error",
-        });
-        this.voltarParaTopo();
-      }
-
-      if (value.type == "removerTodosApiSucesso")
-        this.$toasted.show("Removido com success", {
-          type: "success",
-        });
-      if (value.type == "removerTodosApiErro") {
-        this.$toasted.show("Ops! Algo deu errado", {
-          type: "error",
-        });
-        this.voltarParaTopo();
-      }
-      if (value.type == "falhaGenerica") {
-        this.$toasted.show("Ops! Algo deu errado", {
-          type: "error",
-        });
-        this.voltarParaTopo();
-      }
-    },
-    voltarParaTopo() {
-      window.scrollTo(0, 0);
-    },
-  },
-};
-</script>
+<template></template>
+
+<script>
+import { mapState } from "vuex";
+
+export default {
+  name: "Notificacao",
+  computed: {
+    ...mapState("generic", ["toast"]),
+  },
+  watch: {
+    toast: {
+      handler(value) {
+        this.notifica(value);
+      },
+      deep: true,
+    },
+  },
+  methods: {
+    notifica(value) {
+      if (value.type == "postApi" || value.type == "putApi")
+        this.$toasted.show("Salvo com sucesso", {
+          type: "success",
+        });
+      if (value.type == "postApiError" || value.type == "putApiErro") {
+        this.$toasted.show("Ops! Algo deu errado", {
+          type: "error",
+        });
+        this.voltarParaTopo();
+      }
+
+      if (value.type == "removerTodosApiSucesso")
+        this.$toasted.show("Removido com sucesso", {
+          type: "success",
+        });
+      if (value.type == "removerTodosApiErro") {
+        this.$toasted.show("Ops! Algo deu errado", {
+          type: "error",
+        });
+        this.voltarParaTopo();
+      }
+      if (value.type == "falhaGenerica") {
+        this.$toasted.show("Ops! Algo deu errado", {
+          type: "error",
+        });
+        this.voltarParaTopo();
+      }
+    },
+    voltarParaTopo() {
+      window.scrollTo(0, 0);
+    },
+  },
+};
+</script>

package/src/component/shared/TotalizationReport.vue

@@ -0,0 +1,59 @@
+<template>
+  <div>
+    <hr class="hr-report" />
+    <div class="text-right">
+      <span class="title"> Total de Registro(s) </span>
+      <span class="title value"> {{ totalRecords }} </span>
+    </div>
+    <div class="text-right" v-for="item in totalization" :key="item.title">
+      <span :class="convertName(item[0]).classCss">
+        <span class="title">
+          {{ convertName(item[0]).title }}
+          <span class="title value">
+            <span v-if="convertName(item[0]).type == 'currency'">
+              {{ item[1] | currency }}
+            </span>
+            <span v-if="convertName(item[0]).type == 'numeric'">
+              {{ Math.round(item[1]) }}
+            </span>
+          </span>
+        </span>
+      </span>
+    </div>
+  </div>
+</template>
+<script>
+import { mapState, mapGetters, mapActions, mapMutations } from "vuex";
+
+export default {
+  name: "TotalizationReport",
+  props: ["totalization", "totalRecords"],
+  computed: {
+    ...mapState("report", ["finalQueryFormatOData"]),
+  },
+  methods: {
+    convertName(value) {
+      var filter = this.finalQueryFormatOData.totalization.filter((item) => {
+        return item.value == value;
+      });
+      return Object.assign(filter[0]);
+    },
+  },
+};
+</script>
+
+<style scoped>
+.title {
+  font-size: 15px;
+  font-weight: 400;
+}
+
+.value {
+  margin-left: 50px;
+}
+
+.hr-report {
+  background: black !important;
+  height: 0px !important;
+}
+</style>