@nixweb/nixloc-ui 1.14.0 → 1.16.0

package/src/components/modules/stock/shared/TimeLineAvailability.vue

@@ -0,0 +1,239 @@
+<template>
+  <div class="timeline-wrap">
+    <Loading
+      type="line"
+      :center="false"
+      v-show="loading"
+    />
+
+    <div
+      class="panel-header"
+      v-if="!loading"
+    >
+      <b-row class="align-center">
+        <b-col sm="10">
+          <div class="title">
+            <span class="product">{{ data.productName }}</span>
+            <span class="sep">•</span>
+            <span class="muted">Estoque</span>
+            <span class="stock">{{ data.totalStock }}</span>
+          </div>
+        </b-col>
+        <b-col sm="2">
+          <div
+            class="text-right"
+            v-show="showButtonBack"
+          >
+            <Button
+              _key="btnBackTimeLineAvailability"
+              type="info"
+              classIcon="fa-solid fa-arrow-left"
+              size="small"
+              eventName="btnBackTimeLineAvailability"
+            />
+          </div>
+        </b-col>
+      </b-row>
+      <hr class="hr" />
+    </div>
+
+    <div v-if="!loading">
+      <div class="div-legend">
+        <div class="legend-chip">
+          <span class="box-time dot-maintenance"></span>
+          <span class="legend-text title">Manutenção</span>
+        </div>
+        <div class="legend-chip">
+          <span class="box-time dot-rented"></span>
+          <span class="legend-text title">Locado</span>
+        </div>
+        <div class="legend-chip">
+          <span class="box-time dot-reserved"></span>
+          <span class="legend-text title">Reservado</span>
+        </div>
+      </div>
+    </div>
+
+    <Gantt
+      v-if="!loading"
+      initialOption="Dia"
+      :options="options"
+      :tasks="data.tasks"
+    />
+  </div>
+</template>
+
+<script>
+import Button from "@nixweb/nixloc-ui/src/component/forms/Button";
+import Gantt from "@nixweb/nixloc-ui/src/component/layout/Gantt";
+import Loading from "@nixweb/nixloc-ui/src/component/shared/Loading.vue";
+
+import { mapMutations, mapState, mapActions } from "vuex";
+
+export default {
+  name: "TimeLineAvailability",
+  props: { item: Object },
+  components: { Button, Gantt, Loading },
+  data() {
+    return {
+      urlGet: "/api/v1/stock/search-product/list-items-timeline",
+      options: [
+        { title: "Dia", eventName: "demoViewMode" },
+        { title: "Semana", eventName: "demoViewMode" },
+        { title: "Mês", eventName: "demoViewMode" },
+      ],
+      data: {},
+      loading: true,
+      showDisplay: true,
+      showButtonBack: false,
+    };
+  },
+  computed: { ...mapState("generic", ["event"]) },
+  methods: {
+    ...mapActions("generic", ["getApi"]),
+    ...mapMutations("generic", ["removeLoading"]),
+    get(item) {
+      let params = {
+        url: this.urlGet,
+        obj: {
+          productId: item?.productId,
+          productFullName: item?.productFullName,
+          totalStock: item?.totalStock,
+        },
+      };
+      this.getApi(params).then((response) => {
+        this.data = response.content;
+        let self = this;
+        setTimeout(function () {
+          self.loading = false;
+        }, 500);
+        this.removeLoading(["btnPanelReserved"]);
+      });
+    },
+  },
+  watch: {
+    event: {
+      handler(event) {
+        if (event.name == "timeLineAvailability") {
+          this.loading = true;
+          this.showButtonBack = event.data.showButtonBack;
+          this.get(event.data.item);
+        }
+      },
+      deep: true,
+    },
+  },
+};
+</script>
+
+<style scoped>
+:root {
+  --text: #111827;
+  --muted: #6b7280;
+  --border: #e5e7eb;
+  --bg-soft: #fafafa;
+}
+
+.timeline-wrap {
+  border-radius: 12px;
+}
+
+.panel-header {
+  background: var(--bg-soft);
+  border: 1px solid var(--border);
+  border-radius: 10px;
+  margin-bottom: 12px;
+}
+
+.title {
+  display: flex;
+  align-items: baseline;
+  gap: 8px;
+  font-size: 16px;
+  color: var(--text);
+  font-weight: 600;
+  line-height: 1.3;
+}
+
+.title .product {
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.title .sep {
+  color: var(--muted);
+  font-weight: 400;
+}
+
+.title .muted {
+  color: var(--muted);
+  font-weight: 500;
+}
+
+.title .stock {
+  background: #eef2ff;
+  border: 1px solid #e0e7ff;
+  padding: 2px 8px;
+  border-radius: 9999px;
+  font-size: 13px;
+  line-height: 18px;
+}
+
+.hr {
+  border: none;
+  height: 1px;
+  background: var(--border);
+  margin: 12px 0 0;
+}
+
+.div-legend {
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  gap: 14px;
+  padding: 6px 0 12px;
+  flex-wrap: wrap;
+}
+
+.legend-chip {
+  display: inline-flex;
+  align-items: center;
+  gap: 8px;
+  border: 1px solid var(--border);
+  border-radius: 9999px;
+}
+
+.legend-text {
+  font-size: 14px;
+  color: var(--text);
+  font-weight: 400;
+}
+
+.box-time {
+  width: 10px;
+  height: 10px;
+  border-radius: 50%;
+}
+
+.dot-maintenance {
+  background-color: #ffc106;
+}
+
+.dot-reserved {
+  background-color: #018b8b;
+}
+
+.dot-rented {
+  background-color: #00058b;
+}
+
+.align-center {
+  display: flex;
+  align-items: center;
+}
+
+.text-right {
+  text-align: right;
+}
+</style>

package/src/components/modules/stock/type-product/TypeProduct.js

@@ -0,0 +1,12 @@
+export default class TypeProduct {
+    constructor() {
+        this.id = "";
+        this.name = "";
+        this.type = 1;
+    }
+    update(data) {
+        this.id = data.id;
+        this.name = data.name;
+        this.type = data.type;
+    }
+}

package/src/components/modules/stock/type-product/TypeProductCreateUpdate.vue

@@ -0,0 +1,108 @@
+<template>
+  <div>
+    <b-row>
+      <b-col sm="12">
+        <InputText title="Nome" field="name" :formName="formName" :required="true" :maxLength="100"
+          v-model="typeProduct.name" :markFormDirty="false" />
+      </b-col>
+    </b-row>
+    <b-row>
+      <b-col sm="12">
+        <RadioGroup title="Tipo" field="type" :formName="formName" :options="[
+          { text: 'Produto', value: 1 },
+          { text: 'Acessório', value: 2 },
+          { text: 'Material', value: 5 },
+          { text: 'Serviço', value: 3 },
+        ]" v-model="typeProduct.type" />
+      </b-col>
+    </b-row>
+    <b-row>
+      <b-col sm="12">
+        <div class="text-right">
+          <Button _key="btnSaveProductType" type="success" title="Salvar" :disabled="!isFormValid(formName)"
+            classIcon="fas fa-save" size="medium" :clicked="saveTypeProduct" />
+        </div>
+      </b-col>
+    </b-row>
+  </div>
+</template>
+
+<script>
+import InputText from "@nixweb/nixloc-ui/src/component/forms/InputText";
+import RadioGroup from "@nixweb/nixloc-ui/src/component/forms/RadioGroup.vue";
+import Button from "@nixweb/nixloc-ui/src/component/forms/Button";
+
+import TypeProduct from "@/components/modules/stock/type-product/TypeProduct.js";
+
+import { mapGetters, mapActions, mapMutations } from "vuex";
+
+export default {
+  name: "TypeProductCreateUpdate",
+  props: {
+    registerInSelect: Boolean,
+    value: Object,
+  },
+  components: { InputText, RadioGroup, Button },
+  data() {
+    return {
+      formName: "typeProductCreateUpdate",
+      typeProduct: new TypeProduct(),
+      urlCreate: "/api/v1/stock/type-product/create",
+      urlUpdate: "/api/v1/stock/type-product/update",
+    };
+  },
+  computed: {
+    ...mapGetters("validation", ["isFormValid"]),
+    ...mapGetters("generic", ["event"]),
+  },
+  methods: {
+    ...mapActions("generic", ["postApi", "putApi"]),
+    ...mapMutations("generic", [
+      "removeLoading",
+      "removeEvent",
+      "hideModal",
+      "hideVodal",
+    ]),
+    ...mapMutations("validation", ["resetValidation"]),
+    saveTypeProduct() {
+      if (this.typeProduct.id) {
+        let params = { url: this.urlUpdate, obj: this.typeProduct };
+        this.putApi(params).then((response) => {
+          if (response.success && !this.registerInSelect) this.hideModal();
+          this.removeLoading(["btnSaveProductType"]);
+        });
+      } else {
+        let params = { url: this.urlCreate, obj: this.typeProduct };
+        this.postApi(params).then((response) => {
+          if (response.success && !this.registerInSelect) this.hideModal();
+          if (response.success && this.registerInSelect) {
+            this.$emit("input", {
+              id: response.content.id,
+              content: response.content.name,
+            });
+            this.hideVodal(this.formName);
+          }
+          this.removeLoading(["btnSaveProductType"]);
+        });
+      }
+    },
+    update(data) {
+      this.typeProduct = new TypeProduct();
+      this.typeProduct.update(data);
+      this.removeLoading([data.id]);
+    },
+  },
+  watch: {
+    event: {
+      handler(event) {
+        if (event.name == "productTypeCreate") {
+          this.resetValidation(this.formName);
+          this.typeProduct = new TypeProduct();
+        }
+        if (event.name == "productTypeUpdate") this.update(event.data);
+      },
+      deep: true,
+    },
+  },
+};
+</script>

package/src/components/modules/stock/unit-of-measurement/UnitOfMeasurement.js

@@ -0,0 +1,12 @@
+export default class UnitOfMeasurement {
+    constructor() {
+        this.id = "";
+        this.name = "";
+        this.type = 1;
+    }
+    update(data) {
+        this.id = data.id;
+        this.name = data.name;
+        this.type = data.type;
+    }
+}

package/src/components/modules/stock/unit-of-measurement/UnitOfMeasurementCreateUpdate.vue

@@ -0,0 +1,124 @@
+<template>
+  <div>
+    <b-row>
+      <b-col sm="6">
+        <InputText
+          title="Nome"
+          field="name"
+          :formName="formName"
+          :required="true"
+          :maxLength="40"
+          v-model="unitOfMeasurement.name"
+          :markFormDirty="false"
+        />
+      </b-col>
+      <b-col sm="6">
+        <RadioGroup
+          title="Tipo"
+          field="type"
+          :formName="formName"
+          :options="[
+            { text: 'Inteiro', value: 1 },
+            { text: 'Fracionado', value: 2 },
+          ]"
+          v-model="unitOfMeasurement.type"
+        />
+      </b-col>
+    </b-row>
+    <b-row>
+      <b-col sm="12">
+        <div class="text-right">
+          <Button
+            _key="btnSaveProductUnitOfMeasurement"
+            type="success"
+            title="Salvar"
+            :disabled="!isFormValid(formName)"
+            classIcon="fas fa-save"
+            size="medium"
+            :clicked="saveProductUnitOfMeasurement"
+          />
+        </div>
+      </b-col>
+    </b-row>
+  </div>
+</template>
+
+<script>
+import InputText from "@nixweb/nixloc-ui/src/component/forms/InputText";
+import RadioGroup from "@nixweb/nixloc-ui/src/component/forms/RadioGroup.vue";
+import Button from "@nixweb/nixloc-ui/src/component/forms/Button";
+
+import UnitOfMeasurement from "@/components/modules/stock/unit-of-measurement/UnitOfMeasurement.js";
+
+import { mapGetters, mapActions, mapMutations } from "vuex";
+
+export default {
+  name: "UnitOfMeasurementCreateUpdate",
+  props: {
+    registerInSelect: Boolean,
+    value: Object,
+  },
+  components: { Button, RadioGroup, InputText },
+  data() {
+    return {
+      formName: "unitOfMeasurementCreateUpdate",
+      unitOfMeasurement: new UnitOfMeasurement(),
+      urlCreate: "/api/v1/stock/unit-of-measurement/create",
+      urlUpdate: "/api/v1/stock/unit-of-measurement/update",
+    };
+  },
+  computed: {
+    ...mapGetters("validation", ["isFormValid"]),
+    ...mapGetters("generic", ["event"]),
+  },
+  methods: {
+    ...mapActions("generic", ["postApi", "putApi"]),
+    ...mapMutations("generic", [
+      "removeLoading",
+      "removeEvent",
+      "hideModal",
+      "hideVodal",
+    ]),
+    ...mapMutations("validation", ["resetValidation"]),
+    saveProductUnitOfMeasurement() {
+      if (this.unitOfMeasurement.id) {
+        let params = { url: this.urlUpdate, obj: this.unitOfMeasurement };
+        this.putApi(params).then((response) => {
+          if (response.success && !this.registerInSelect) this.hideModal();
+          this.removeLoading(["btnSaveProductUnitOfMeasurement"]);
+        });
+      } else {
+        let params = { url: this.urlCreate, obj: this.unitOfMeasurement };
+        this.postApi(params).then((response) => {
+          if (response.success && !this.registerInSelect) this.hideModal();
+          if (response.success && this.registerInSelect) {
+            this.$emit("input", {
+              id: response.content.id,
+              content: response.content.name,
+            });
+           this.hideVodal(this.formName);;
+          }
+          this.removeLoading(["btnSaveProductUnitOfMeasurement"]);
+        });
+      }
+    },
+    update(data) {
+      this.unitOfMeasurement = new UnitOfMeasurement();
+      this.unitOfMeasurement.update(data);
+      this.removeLoading([data.id]);
+    },
+  },
+  watch: {
+    event: {
+      handler(event) {
+        if (event.name == "productUnitOfMeasurementCreate") {
+          this.resetValidation(this.formName);
+          this.unitOfMeasurement = new UnitOfMeasurement();
+        }
+        if (event.name == "productUnitOfMeasurementUpdate") this.update(event.data);
+      },
+      deep: true,
+    },
+  },
+};
+</script>

package/src/components/modules/supplier/items-supplier-order/ItemsSupplierOrder.js

@@ -0,0 +1,22 @@
+export default class ItemsSupplierOrder {
+    constructor() {
+        this.id = "";
+        this.typeProduct = { id: "", content: "" };
+        this.productFullName = "";
+        this.product = { id: "", content: "" };
+        this.productId = "";
+        this.description = "";
+        this.quantity = 1;
+        this.unitValue = 0;
+        this.supplierOrderId = "";
+    }
+    update(data) {
+        this.id = data.id;
+        this.typeProduct = { id: data.typeProductId, content: data.typeProductName };
+        this.product = { id: data.productId, content: data.productName };
+        this.description = data.description;
+        this.quantity = data.quantity;
+        this.unitValue = data.unitValue;
+        this.supplierOrderId = data.supplierOrderId;
+    }
+}

package/src/components/modules/supplier/items-supplier-order/ItemsSupplierOrderCreate.vue

@@ -0,0 +1,78 @@
+<template>
+  <div>
+    <div>
+      <Button _key="btnCreate" title="Produto" classIcon="fas fa-plus-circle" type="primary" size="small"
+        :clicked="create" />
+    </div>
+    <Modal title="Produtos" :width="1200" :height="750" v-show="showModal('addProduct')"
+      :onHideModal="hideSearchProduct">
+      <SearchProduct v-if="showSearchProduct" :types="'1,2,3,4,5'" :status="1" :showPrice="true"
+        :showAvailability="false" :addProduct="addProduct">
+      </SearchProduct>
+    </Modal>
+  </div>
+</template>
+
+<script>
+
+import Button from "@nixweb/nixloc-ui/src/component/forms/Button";
+import Modal from "@nixweb/nixloc-ui/src/component/forms/Modal";
+
+import SearchProduct from '../../stock/search-product/SearchProduct.vue';
+
+import ItemsSupplierOrder from "./ItemsSupplierOrder.js";
+
+import { mapMutations, mapGetters, mapActions } from "vuex";
+
+export default {
+  name: "ItemsSupplierOrderCreate",
+  components: {
+    Button,
+    Modal,
+    SearchProduct,
+  },
+  props: {
+    supplierOrder: Object,
+  },
+  data() {
+    return {
+      itemsSupplierOrder: new ItemsSupplierOrder(),
+      urlCreate: "/api/v1/supplier/items-supplier-order/create",
+      showSearchProduct: false,
+    };
+  },
+  computed: {
+    ...mapGetters("generic", ["showModal", "event"]),
+  },
+  methods: {
+    ...mapMutations("generic", ["addEvent", "openModal", "removeLoading"]),
+    ...mapActions("generic", ["postApi"]),
+    create() {
+      this.openModal("addProduct");
+      this.removeLoading(["btnCreate"]);
+      this.showSearchProduct = true;
+    },
+    addProduct(product) {
+      this.updateClassItemSupplierOrder(product);
+      let params = { url: this.urlCreate, obj: this.itemsSupplierOrder };
+      this.postApi(params).then(() => {
+        this.addEvent({
+          name: "addedProduct",
+        });
+        this.removeLoading([product.id]);
+      });
+    },
+    hideSearchProduct() {
+      this.showSearchProduct = false;
+    },
+    updateClassItemSupplierOrder(data) {
+      this.itemsSupplierOrder.productId = data.id;
+      this.itemsSupplierOrder.productFullName = data.productFullName;
+      this.itemsSupplierOrder.description = data.description;
+      this.itemsSupplierOrder.quantity = data.quantity;
+      this.itemsSupplierOrder.unitValue = data.value;
+      this.itemsSupplierOrder.supplierOrderId = this.supplierOrder.id;
+    },
+  },
+};
+</script>