@nixweb/nixloc-ui 1.16.0 → 1.19.0

package/src/components/modules/rental/moviment/MovimentList.vue

@@ -1,374 +0,0 @@
-<template>
-  <div>
-    <div>
-      <Loading type="line" :center="false" v-show="loading" />
-      <b-row>
-        <b-col sm="12">
-          <TableTotalRecords :totalRecords="content.totalRecords" />
-        </b-col>
-      </b-row>
-    </div>
-    <ScrollBar id="items-rent" :minHeight="400" :maxHeight="800">
-      <table class="table table-responsive-xs">
-        <thead>
-          <tr>
-            <th>
-              <span class="title-header">Gerado</span>
-            </th>
-            <th class="text-center">
-              <span class="title-header">Tipo</span>
-            </th>
-            <th class="text-center">
-              <span class="title-header">Usuário</span>
-            </th>
-            <th class="text-center">
-              <span class="title-header">Origem</span>
-            </th>
-            <th></th>
-          </tr>
-        </thead>
-        <tbody v-for="item in content.data">
-          <tr>
-            <td>{{ item.generationDate }}</td>
-            <td class="text-center">
-              <div class="badge badge-rent td-margin" v-if="item.statusMovimentName == 'Saída'">
-                Saída
-              </div>
-              <div class="badge badge-returned td-margin" v-if="item.statusMovimentName == 'Retorno'">
-                Retorno
-              </div>
-            </td>
-            <td class="text-center td-margin">{{ item.generationUser }}</td>
-            <td class="text-center td-margin">
-              <span v-if="item.description">
-                {{ item.description }}
-              </span>
-              <span v-else>N/I</span>
-            </td>
-            <td class="text-right">
-              <b-row>
-                <b-col sm="9">
-                  <Button _key="btnPrint" type="info" classIcon="fa-light fa-share-nodes" size="small" :params="item"
-                    :clicked="executePrint" />
-
-                  <Button _key="btnAttachment" type="primary" classIcon="fa-solid fa-paperclip" size="small"
-                    :params="item" :clicked="executeAttachment" />
-                </b-col>
-                <b-col sm="2">
-                  <ButtonSub :itemId="item.id" urlGet="/api/v1/stock/items-moviment/get-all"
-                    eventNameShow="showItemsMoviment" eventNameHide="hideItemsMoviment"
-                    :propsParam="{ any: item.id, noPaginated: true }" v-model="buttonSub" />
-                </b-col>
-              </b-row>
-            </td>
-          </tr>
-          <td colspan="8" v-if="buttonSub.itemId == item.id">
-            <Loading type="line" :center="false" />
-          </td>
-          <td colspan="8" v-if="isShowTableSub(item.id)">
-            <table class="table-sub table table-responsive-xs">
-              <thead>
-                <tr>
-                  <th>
-                    <span class="title-header">Produto</span>
-                  </th>
-                  <th class="text-center">
-                    <span class="title-header">Quantidade</span>
-                  </th>
-                  <th class="text-center" v-if="manageByPatrimony">
-                    <span class="title-header">Patrimônio(s)</span>
-                  </th>
-                  <th class="text-center">
-                    <span class="title-header">Período</span>
-                  </th>
-                </tr>
-              </thead>
-              <tbody v-for="itemMoviment in itensMovimentByMovimentId(item.id)">
-                <tr>
-                  <td>{{ itemMoviment.productFullName }}</td>
-                  <td class="text-center">{{ itemMoviment.quantity }}</td>
-                  <td class="text-center" v-if="manageByPatrimony">
-                    {{ itemMoviment.patrimony }}
-                  </td>
-                  <td class="text-center td-description">
-                    {{ itemMoviment.periodRentName }}
-                  </td>
-                </tr>
-              </tbody>
-              <tbody v-show="itensMovimentByMovimentId(item.id).length == 0">
-                <tr>
-                  <td colspan="8">
-                    <span class="title">Nenhum registro encontrado!</span>
-                  </td>
-                </tr>
-              </tbody>
-            </table>
-          </td>
-        </tbody>
-        <tbody v-show="content.totalRecords == 0">
-          <tr>
-            <td colspan="8">
-              <span class="title">Nenhum registro encontrado!</span>
-            </td>
-          </tr>
-        </tbody>
-      </table>
-    </ScrollBar>
-
-    <Modal title="Anexo" :width="950" :height="750" v-if="showModal('attachment')" :onHideModal="onHideModal">
-      <FileManager v-if="showFile" :showInModal="false" source="moviment" :genericId="movimentId" />
-    </Modal>
-  </div>
-</template>
-
-<script>
-
-import Button from "@nixweb/nixloc-ui/src/component/forms/Button";
-import Loading from "@nixweb/nixloc-ui/src/component/shared/Loading.vue";
-import ScrollBar from "@nixweb/nixloc-ui/src/component/layout/ScrollBar.vue";
-import ButtonSub from "@nixweb/nixloc-ui/src/component/forms/ButtonSub.vue";
-import TableTotalRecords from "@nixweb/nixloc-ui/src/component/shared/TableTotalRecords.vue";
-import Modal from "@nixweb/nixloc-ui/src/component/forms/Modal";
-import FileManager from "@nixweb/nixloc-ui/src/component/shared/file-manager/FileManager";
-
-import { mapGetters, mapState, mapActions, mapMutations } from "vuex";
-
-export default {
-  name: "ItemsLista",
-  components: {
-    Button,
-    Loading,
-    ScrollBar,
-    TableTotalRecords,
-    Modal,
-    FileManager,
-    ButtonSub,
-  },
-  props: {
-    rent: Object,
-  },
-  data() {
-    return {
-      urlGetApi: "/api/v1/stock/moviment/get-all",
-      data: [],
-      loading: true,
-      movimentId: "",
-      print: false,
-      showFile: false,
-      content: {
-        data: [],
-        totalRecords: 0,
-      },
-      baseParams: {
-        search: undefined,
-        filter: "contains",
-        currentPage: 1,
-        totalPerPage: 20,
-      },
-      itensMoviment: {
-        ids: [],
-        data: [],
-      },
-      buttonSub: {},
-    };
-  },
-  mounted() {
-    this.getAll();
-  },
-  computed: {
-    ...mapGetters("generic", ["showModal"]),
-    ...mapState("generic", ["event"]),
-    ...mapState("user", ["userLogged"]),
-    manageByPatrimony() {
-      return this.userLogged.parameterStock.manageByPatrimony;
-    },
-  },
-  methods: {
-    ...mapActions("generic", ["getApi"]),
-    ...mapMutations("generic", ["openModal", "addEvent", "removeLoading"]),
-    getAll() {
-      this.loading = true;
-      let params = {
-        url: this.urlGetApi,
-        obj: {
-          ...this.baseParams,
-          rentId: this.rent.id,
-          noPaginated: true,
-        },
-      };
-      this.getApi(params).then((response) => {
-        this.content.data = response.content.data;
-        this.content.totalRecords = response.content.totalRecords;
-        this.loading = false;
-      });
-    },
-    isShowTableSub(itemId) {
-      return this.itensMoviment.ids.includes(itemId);
-    },
-    itensMovimentByMovimentId(movimentId) {
-      let filter = this.itensMoviment.data.filter(
-        (x) => x.movimentId == movimentId
-      );
-      return filter;
-    },
-    executePrint(params) {
-      this.addEvent({ name: "printMoviment", data: params.id });
-      this.removeLoading(["btnPrint"]);
-    },
-    executeAttachment(params) {
-      this.movimentId = params.id;
-      this.showFile = true;
-      this.openModal("attachment");
-      this.removeLoading(["btnAttachment"]);
-    },
-    onHideModal() {
-      this.print = false;
-      this.showFile = false;
-    },
-  },
-  watch: {
-    event: {
-      handler(event) {
-        if (event.name == "showItemsMoviment") {
-          let self = this;
-
-          setTimeout(function () {
-            self.itensMoviment.ids.push(event.data.itemId);
-          }, 400);
-
-          event.data.data.forEach((item) => {
-            self.itensMoviment.data.push(item);
-          });
-        }
-
-        if (event.name == "hideItemsMoviment") {
-          let filterData = this.itensMoviment.data.filter(
-            (x) => x.movimentId != event.data.itemId
-          );
-
-          this.itensMoviment.data = filterData;
-
-          let filter = this.itensMoviment.ids.filter(
-            (x) => x != event.data.itemId
-          );
-          this.itensMoviment.ids = filter;
-        }
-      },
-      deep: true,
-    },
-  },
-};
-</script>
-<style scoped>
-.table th,
-.table td {
-  height: 10px !important;
-  padding-left: 5px !important;
-  padding-top: 7px !important;
-  padding-bottom: 5px !important;
-  padding-right: 5px !important;
-  padding-left: 10px !important;
-  border-bottom: 0px !important;
-}
-
-.table-sub {
-  background-color: #f3f3f3;
-}
-
-.td-description {
-  max-width: 300px !important;
-  word-wrap: break-word !important;
-  font-size: 14px;
-  color: #757d8c;
-  font-style: italic;
-}
-
-.title-header {
-  font-size: 14px;
-  color: #757d8c;
-  font-weight: 400;
-  text-transform: uppercase;
-}
-
-.td-dropdown {
-  overflow: visible;
-}
-
-.group {
-  background-color: #fafafc;
-  font-size: 14px;
-  font-weight: 400;
-}
-
-.title-group {
-  font-size: 14px;
-  margin-left: 10px;
-}
-
-.div-warning {
-  margin-bottom: 20px;
-}
-
-.td-product {
-  width: 500px;
-  background-color: #f1f4f9;
-  cursor: pointer;
-}
-
-.td-quantity {
-  width: 150px;
-}
-
-.description {
-  font-weight: 400;
-  color: grey;
-}
-
-.without-group {
-  font-size: 13px;
-  font-style: italic;
-  color: grey;
-}
-
-.icon-cursor {
-  cursor: pointer;
-}
-
-.icon-order-group {
-  color: #779cb3;
-}
-
-.text-order {
-  font-size: 13px;
-  margin-left: 10px;
-  font-style: italic;
-}
-
-.td-checkbox {
-  width: 30px;
-}
-
-.td-margin {
-  margin-top: 10px;
-}
-
-.badge {
-  font-size: 13px !important;
-  margin-left: 5px;
-  border-radius: 10px !important;
-  padding: 8px;
-  color: white;
-}
-
-.badge-rent {
-  background-color: #009183;
-}
-
-.badge-returned {
-  background-color: #b8860b;
-}
-
-.badge-renewed {
-  background-color: #577696;
-}
-</style>

package/src/components/modules/rental/new-items-rent/ApplyDiscount.vue

@@ -1,131 +0,0 @@
-<template>
-    <div class="div-discount">
-        <Alert type="info">
-            <span>
-                Não será aplicado desconto em produto <b>Faturado</b>!
-            </span>
-        </Alert>
-        <div class="sd-wrap">
-            <div class="sd-mode">
-                <button type="button" class="sd-chip" :class="{ active: mode === 'money' }"
-                    @click="mode = 'money'">R$</button>
-                <button type="button" class="sd-chip" :class="{ active: mode === 'percent' }" @click="mode = 'percent'">
-                    <span>
-                        <i class="fa-solid fa-percent"></i>
-                    </span>
-                </button>
-            </div>
-
-            <InputSmartValue v-model="discountValue" :mode="mode" @enter="tryApply" />
-        </div>
-
-        <div class="div-apply text-center">
-            <Button _key="btnApplyDiscount" title="Aplicar" color="white" backGroundColor="#EF4444" size="medium"
-                :clicked="update" :disabled="isSubmitting || !isValid" />
-        </div>
-    </div>
-</template>
-
-<script>
-import Alert from "@nixweb/nixloc-ui/src/component/layout/Alert";
-import Button from "@nixweb/nixloc-ui/src/component/forms/Button";
-import InputSmartValue from "./InputSmartValue.vue";
-
-import { mapActions, mapMutations } from "vuex";
-
-export default {
-    name: "ApplyDiscount",
-    props: ["rentId", "item", "selected"],
-    components: { Alert, Button, InputSmartValue },
-    data() {
-        return {
-            urlUpdate: "/api/v1/rental/items-rent/apply-discount",
-            mode: "money",
-            discountValue: 0,
-            isSubmitting: false
-        };
-    },
-    computed: {
-        isValid() {
-            if (this.mode === "percent") return this.discountValue >= 0 && this.discountValue <= 100;
-            return this.discountValue >= 0;
-        }
-    },
-    methods: {
-        ...mapActions("generic", ["putApi"]),
-        ...mapMutations("generic", ["addSelected", "addEvent", "removeLoading", "hideModal"]),
-        tryApply() {
-            if (this.isValid && !this.isSubmitting) this.update();
-        },
-        update() {
-            const payload = {
-                url: this.urlUpdate,
-                obj: {
-                    listIds: this.selected.length > 0 ? this.selected : [this.item.id],
-                    rentId: this.rentId,
-                    discountByPercentage: this.mode === "percent",
-                    unitDiscount: this.discountValue
-                }
-            };
-
-            this.isSubmitting = true;
-            this.putApi(payload)
-                .then((r) => {
-                    if (r?.success) {
-                        this.addEvent({ name: "updateTotalizationRent" });
-                        this.hideModal();
-                    }
-                    this.addSelected([]);
-                    this.removeLoading(["btnApplyDiscount"]);
-                    this.isSubmitting = false;
-                })
-                .catch(() => {
-                    this.removeLoading(["btnApplyDiscount"]);
-                    this.isSubmitting = false;
-                });
-        }
-    }
-};
-</script>
-
-<style scoped>
-.div-apply {
-    margin-top: 15px;
-}
-
-.div-discount {
-    display: grid;
-    gap: 10px;
-}
-
-.sd-wrap {
-    display: grid;
-    grid-template-columns: auto 1fr;
-    gap: 8px;
-    align-items: center;
-}
-
-.sd-mode {
-    display: inline-flex;
-    border: 1px solid #e5e7eb;
-    border-radius: 10px;
-    overflow: hidden;
-}
-
-.sd-chip {
-    padding: 6px 12px;
-    border: none;
-    background: #fff;
-    cursor: pointer;
-    font-weight: 700;
-}
-
-.sd-chip+.sd-chip {
-    border-left: 1px solid #e5e7eb;
-}
-
-.sd-chip.active {
-    background: #ef4444;
-    color: #fff;
-}
-</style>

package/src/components/modules/rental/new-items-rent/BadgeAvailabilityStock.vue

@@ -1,110 +0,0 @@
-<template>
-  <Tooltip :title="tooltip">
-    <div
-      class="badge-availability-stock"
-      :class="colorClass"
-      @click="onBadgeClick(available)"
-    >
-      <span class="bas-text">{{ `${avail} ${available.unitOfMeasurementName || ""}`.trim() }}</span>
-    </div>
-  </Tooltip>
-</template>
-
-<script>
-import Tooltip from "@nixweb/nixloc-ui/src/component/layout/Tooltip";
-
-import { mapMutations } from "vuex";
-
-export default {
-  name: "BadgeAvailabilityStock",
-  components: {
-    Tooltip,
-  },
-  props: {
-    itemRent: {
-      type: Object,
-      required: true,
-    },
-    available: {
-      type: Object,
-      default: () => ({
-        date: "2025-10-11T15:34:00",
-        productId: null,
-        totalStock: 6,
-        reserved: 1,
-        rent: 1,
-        maintenance: 0,
-        available: 4,
-        unitOfMeasurementName: "Pça",
-      }),
-    },
-  },
-  computed: {
-    avail() {
-      const v = Number(this.available?.available ?? 0);
-      return Number.isNaN(v) ? 0 : v;
-    },
-    colorClass() {
-      if (this.avail === 0) return "is-zero";
-      if (this.avail > 0) return "is-positive";
-      return "is-negative";
-    },
-    tooltip() {
-      return `Disponível: ${this.avail} ${
-        this.available?.unitOfMeasurementName || ""
-      }`.trim();
-    },
-  },
-  methods: {
-    ...mapMutations("generic", ["addEvent"]),
-    onBadgeClick(payload) {
-      this.addEvent({
-        name: "timeLineAvailability",
-        data: { item: this.itemRent, showButtonBack: false },
-      });
-    },
-  },
-};
-</script>
-
-<style scoped>
-.badge-availability-stock {
-  display: inline-block;
-  max-width: 10ch;
-  padding: 4px 8px;
-  border-radius: 10px;
-  line-height: 1;
-  font-weight: 500;
-  user-select: none;
-  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.06);
-  border: 1px solid transparent;
-  cursor: pointer;
-  transition: transform 0.12s ease;
-  font-size: 12px;
-  white-space: nowrap;
-  overflow: hidden;
-  text-overflow: ellipsis;
-}
-
-.bas-text {
-  font-size: 12px;
-}
-
-.is-zero {
-  background: #f3f4f6;
-  color: #6b7280;
-  border-color: #e5e7eb;
-}
-
-.is-positive {
-  background: #d1fae5;
-  color: #065f46;
-  border-color: #a7f3d0;
-}
-
-.is-negative {
-  background: #fee2e2;
-  color: #991b1b;
-  border-color: #fecaca;
-}
-</style>

package/src/components/modules/rental/new-items-rent/BadgeStatusInvoice.vue

@@ -1,73 +0,0 @@
-<template>
-    <div v-if="rent.statusRental == 2" class="badge-status-invoice" @click="onBadgeClick(itemRent)">
-        <div v-if="itemRent.statusInvoiceItemsRent === 1" class="badge-status-invoice-warning">Não Faturado</div>
-        <div v-else-if="itemRent.statusInvoiceItemsRent === 2" class="badge-status-invoice-success">Faturado</div>
-        <div v-else-if="itemRent.statusInvoiceItemsRent === 3" class="badge-status-invoice-info">Não Fatura</div>
-        <div v-else-if="itemRent.statusInvoiceItemsRent === 4" class="badge-status-invoice-danger">Cancelado</div>
-        <div v-else-if="itemRent.statusInvoiceItemsRent === 5" class="badge-status-invoice-info">Parcial</div>
-        <div v-else class="badge-status-invoice-info">Não Fatura</div>
-    </div>
-</template>
-
-<script>
-export default {
-    name: "BadgeStatusInvoice",
-    props: {
-        rent: { type: Object, required: false },
-        itemRent: {
-            type: Object,
-            default: () => ({
-                statusInvoiceItemsRent: 3
-            })
-        }
-    },
-    methods: {
-        onBadgeClick(payload) {
-            console.log("BadgeStatusInvoice clicado:", payload);
-        }
-    }
-};
-</script>
-
-<style scoped>
-.badge-status-invoice {
-    display: inline-flex;
-    align-items: center;
-    justify-content: center;
-    user-select: none;
-    width: 90px;
-}
-
-.badge-status-invoice>div {
-    display: inline-flex;
-    align-items: center;
-    justify-content: center;
-    padding: 3px 8px;
-    border-radius: 50px;
-    font-size: 10px;
-    font-weight: 600;
-    color: #fff;
-    white-space: nowrap;
-    transition: transform 0.12s ease, background-color 0.15s ease;
-}
-
-.badge-status-invoice-warning {
-    background-color: #e0ac06;
-}
-
-.badge-status-invoice-success {
-    background-color: #2f855a;
-}
-
-.badge-status-invoice-info {
-    background-color: #5bbff7;
-}
-
-.badge-status-invoice-danger {
-    background-color: #b91c1c;
-}
-
-.badge-status-invoice-default {
-    background-color: #6b7280;
-}
-</style>