@nixweb/nixloc-ui 1.16.0 → 1.17.0

package/src/components/modules/operational/ReservationPanel.vue

@@ -1,224 +0,0 @@
-<template>
-    <div>
-        <Molded>
-            <b-row>
-                <b-col xs="12" sm="12" md="12" lg="3" xl="3">
-                    <DateTime title="Período" fieldTarget="period" format="DD/MM/YYYY" type="date" :range="true"
-                        :confirm="true" confirmText="Filtrar" placeholder :required="true" v-model="selectedPeriod" />
-                </b-col>
-                <b-col xs="12" sm="12" md="12" lg="6" xl="6">
-                    <div class="side-by-side">
-                        <RadioGroup title="Status" fieldTarget="status" :options="[
-                            { text: 'Reservado', value: 2 },
-                            { text: 'Locado', value: 3 },
-                            { text: 'Todos', value: 0 },
-                        ]" v-model="status" />
-                    </div>
-                    <div class="side-by-side">
-                        <Button _key="btnGetAll" :disabled="disabled" title="Buscar" type="info"
-                            classIcon="title fas fa-search" size="medium" :clicked="getAll" />
-                    </div>
-                </b-col>
-            </b-row>
-        </Molded>
-        <br>
-        <div v-if="data.length == 0 && dirty">
-            <span class="title">Nenhum registro encontrado!</span>
-        </div>
-        <vue-pivottable-ui aggregatorName="Sum" :renderers="renderers" :renderer-name="rendererName" :data="data"
-            :rows="['produto']" :cols="['ano', 'mes', 'data']" :vals="['total']" :disabledFromDragDrop="['ano', 'mes']"
-            :hiddenFromDragDrop="['total', '_Data']" :showAggregators="false" :locales="locales" :locale="locale">
-            <template v-slot:colGroup>
-                <colGroup :width="170"></colGroup>
-                <colGroup></colGroup>
-            </template>
-            <template v-slot:output v-if="loading">
-                <Loading type="line" :center="false" v-show="loading" />
-            </template>
-            <template v-slot:pvtAttr="{ name }">
-                <i class="fas fa-filter"></i>
-                {{ name[0].toUpperCase() + name.substring(1) }}
-            </template>
-        </vue-pivottable-ui>
-    </div>
-</template>
-<script>
-
-import DateTime from "@nixweb/nixloc-ui/src/component/forms/DateTime";
-import Select from "@nixweb/nixloc-ui/src/component/forms/Select";
-import Loading from "@nixweb/nixloc-ui/src/component/shared/Loading.vue";
-import RadioGroup from "@nixweb/nixloc-ui/src/component/forms/RadioGroup.vue";
-import Button from "@nixweb/nixloc-ui/src/component/forms/Button";
-import Molded from "@nixweb/nixloc-ui/src/component/layout/Molded";
-
-import { VuePivottableUi, PivotUtilities } from 'vue-pivottable'
-import ScrollRenderer from '@vue-pivottable/scroll-renderer'
-import 'vue-pivottable/dist/vue-pivottable.css'
-
-
-import { mapActions, mapMutations } from "vuex";
-
-export default {
-    name: "ReservationPanel",
-    components: {
-        VuePivottableUi, DateTime, Select, Loading, RadioGroup, Button, Molded
-    },
-    data() {
-        return {
-            data: [],
-            locale: "pt",
-            locales: {
-                pt: {
-                    aggregators: PivotUtilities.aggregators,
-                    localeStrings: {
-                        totals: "Total",
-                        selectAll: "Selecionar Todos",
-                        selectNone: "Nenhum",
-                        renderError: 'Ocorreu um erro ao renderizar os resultados da tabela dinâmica.',
-                        computeError: 'Ocorreu um erro ao renderizar os resultados da tabela dinâmica.',
-                        uiRenderError: 'Ocorreu um erro ao renderizar os resultados da tabela dinâmica.',
-                    },
-                },
-            },
-            urlGet: "/api/v1/operational/get-all-reservation-panel",
-            rendererName: 'Normal',
-            loading: false,
-            selectedPeriod: "",
-            status: 0,
-            disabled: true,
-            dirty: false,
-
-        }
-    },
-    mounted() {
-        this.removeLoading(["panel"]);
-    },
-    computed: {
-        renderers() {
-            return (() => ({
-                Normal: ScrollRenderer.Table,
-            }))()
-        },
-    },
-    methods: {
-        ...mapMutations("generic", ["removeLoading"]),
-        ...mapActions("generic", ["getApi"]),
-        getAll() {
-            this.loading = true;
-            this.dirty = false;
-            this.data = [];
-            let params = {
-                url: this.urlGet,
-                obj: {
-                    start: this.selectedPeriod[0],
-                    end: this.selectedPeriod[1],
-                    status: this.status,
-                },
-            };
-            this.getApi(params).then((response) => {
-                if (response.success) {
-                    this.data = response.content;
-                    let self = this;
-                    setTimeout(function () {
-                        self.dirty = true;
-                        self.loading = false;
-                        self.removeLoading(["panel"]);
-                        self.removeLoading(["btnGetAll"]);
-                        self.disabled = true;
-                    }, 500);
-                }
-            });
-        },
-        cleanProduct() {
-            this.product = {};
-        },
-    },
-    watch: {
-        selectedPeriod: {
-            handler(selectedPeriod) {
-                if (selectedPeriod[0] != "") this.disabled = false;
-            },
-            deep: true,
-        },
-        status: {
-            handler() {
-                this.disabled = false;
-            },
-            deep: true,
-        },
-    },
-}
-
-</script>
-<style>
-table {
-    font-family: 'Poppins', sans-serif !important;
-}
-
-.pvtUi td.pvtOutput {
-    padding-top: 40px !important;
-    padding-left: 15px !important;
-    padding-right: 15px !important;
-    padding-bottom: 40px !important;
-}
-
-.pvtUi {
-    color: #424344;
-}
-
-.pvtVals {
-    visibility: hidden;
-}
-
-
-table.pvtTable thead tr th,
-table.pvtTable tbody tr th {
-    min-width: 160px;
-    background-color: #FAFAFC !important;
-    border: 1px solid #DEE2E6;
-    font-size: 13px !important;
-    padding: 5px !important;
-    border-radius: 0px !important;
-}
-
-.pvtAxisContainer li span.pvtAttr {
-    -webkit-text-size-adjust: 100%;
-    background: #EEEEEE !important;
-    border: 0px solid #c8d4e3 !important;
-    ;
-    border-radius: 20px !important;
-    ;
-}
-
-.pvtAxisContainer,
-.pvtVals {
-    border: 1px solid #E8EAED !important;
-    background: #fff;
-    padding: 5px;
-    min-width: 20px;
-    min-height: 20px;
-}
-
-.pvVal {
-    font-size: 13px !important;
-    margin: auto !important;
-    font-family: 'Poppins', sans-serif !important;
-}
-
-.pvtTotal {
-    font-size: 13px !important;
-    margin: auto !important;
-}
-
-.pvtGrandTotal {
-    font-size: 13px !important;
-}
-
-.pvtRenderers {
-    border: 1px solid #E8EAED !important;
-}
-
-.pvtOutput {
-    border: 1px solid #E8EAED !important;
-}
-</style>

package/src/components/modules/operational/SearchByFilter.vue

@@ -1,121 +0,0 @@
-<template>
-  <div class="main">
-    <div class="div-search">
-      <b-row>
-        <b-col xs="12" sm="12" md="12" lg="3" xl="3">
-          <div class="molded">
-            <div class="div-select">
-              <SelectStatic fieldTarget="filter" classCss="select-search" :onlyQuery="true" :initialValue="{
-                content: 'Número da Locação',
-                id: 'rentNumber',
-              }" v-model="filter" :showBorder="false" :data="[
-                { content: 'Número da Locação', id: 'rentNumber' },
-                { content: 'Nome do Cliente', id: 'customerName' },
-                { content: 'CNPJ/CPF', id: 'customerDocument' },
-                { content: 'Nome do Produto', id: 'productName' },
-                { content: 'Número do Patrimônio', id: 'patrimonyBarCode' },
-              ]" />
-            </div>
-          </div>
-        </b-col>
-        <b-col xs="12" sm="12" md="12" lg="6" xl="6">
-          <div class="molded">
-            <input type="text" class="input-search" name="search" placeholder="Pesquisar ..."
-              @keyup.enter.prevent="execute()" v-model="search" />
-          </div>
-        </b-col>
-        <b-col xs="12" sm="12" md="12" lg="3" xl="3">
-          <div class="div-btn">
-            <Button _key="btnSearchPdv" color="white" type="info" title="Buscar"
-              classIcon="fa-solid fa-magnifying-glass" size="medium" :clicked="execute" />
-            <Button _key="btnClean" color="white" type="info" title="Limpar" classIcon="fa-solid fa-broom" size="medium"
-              :clicked="clean" />
-          </div>
-        </b-col>
-      </b-row>
-    </div>
-  </div>
-</template>
-<script>
-import Button from "@nixweb/nixloc-ui/src/component/forms/Button";
-import Search from "@nixweb/nixloc-ui/src/component/shared/Search.vue";
-import SelectStatic from "@nixweb/nixloc-ui/src/component/forms/SelectStatic.vue";
-
-import { mapMutations } from "vuex";
-
-export default {
-  name: "SearchByFilter",
-  props: ["value"],
-  components: {
-    Button,
-    Search,
-    SelectStatic,
-  },
-  data() {
-    return {
-      filter: { id: "rentNumber" },
-      search: "",
-    };
-  },
-  mounted() {
-    this.removeLoading(["panel"]);
-  },
-  methods: {
-    ...mapMutations("generic", ["removeLoading", "btnPdvSearch"]),
-    execute() {
-      this.$emit("input", { filter: this.filter.id, search: this.search });
-    },
-    clean() {
-      this.$emit("input", { filter: this.filter.id, search: "" });
-      this.search = "";
-      this.removeLoading(["btnClean"]);
-    },
-  },
-};
-</script>
-
-<style scoped>
-.molded {
-  max-width: 900px;
-  height: 52px;
-  font-size: 14px;
-  padding: 5px 8px 6px 15px;
-  margin-bottom: 20px;
-  background-color: white;
-  border: 1px solid #e5e4e8;
-  border-radius: 40px;
-  box-sizing: border-box;
-  box-shadow: none;
-  color: rgb(38, 41, 44);
-  opacity: 1;
-  transition: background-color 0.1s ease-in 0s, border 0.1s ease-in 0s;
-}
-
-input[type="text"] {
-  width: 90%;
-  height: 40px;
-  font-size: 17px;
-  border: 0px solid white;
-  background-color: rgb(255, 255, 255);
-  margin-bottom: 50px;
-  margin-left: 20px;
-}
-
-input[type="text"]:focus {
-  outline: none;
-}
-
-.div-select {
-  margin-top: -25px;
-  margin-right: 5px;
-  width: 100%;
-}
-
-.div-search {
-  margin: 0 auto;
-}
-
-.div-btn {
-  margin-top: 5px;
-}
-</style>

package/src/components/modules/operational/SearchList.vue

@@ -1,198 +0,0 @@
-<template>
-  <div>
-    <SearchByFilter v-model="search" />
-    <Loading type="line" :center="false" v-show="loading" />
-    <Alert type="warning" v-if="list.length == 0 && showAlert">
-      <span> Nenhuma <b>Locação</b> com <b>Retorno </b>pendente encontrada! </span>
-    </Alert>
-    <div v-if="list.length > 0">
-      <div v-if="list[0].productFullName">
-        <i class="fa-solid fa-magnifying-glass"></i>
-        <b> {{ list[0].productFullName }}</b> com patrimonio nº <b>{{ list[0].patrimonyBarCode }}</b>
-      </div>
-    </div>
-    <div v-for="rent in list" :key="rent.id">
-      <div class="div-rent">
-        <div class="div-item">
-          <Molded :borderRadius="12">
-            <div>
-              <b-row>
-                <b-col xs="12" sm="12" md="12" lg="2" xl="2">
-                  <div class="side-by-side number">
-                    <span class="title"> {{ rent.numberAndDate }}</span>
-                  </div>
-                </b-col>
-                <b-col xs="12" sm="12" md="12" lg="3" xl="3">
-                  <div class="identification max-identification text-center">
-                    <span v-if="rent.identification">
-                      {{ rent.identification }}</span>
-                    <span v-else>Sem identificação</span>
-                  </div>
-                </b-col>
-                <b-col xs="12" sm="12" md="12" lg="4" xl="4">
-                  <div class="title max-title">
-                    <span class="icon-customer"><i class="fa-duotone fa-user-tie"></i></span>
-                    {{ rent.customerFullName }}
-                  </div>
-                </b-col>
-                <b-col xs="12" sm="12" md="12" lg="3" xl="3">
-                  <div class="text-right">
-                    <div class="side-by-side">
-                      <ButtonMovimentStock :showTitleButton="false" :keyButton="rent.id" :rentId="rent.id"
-                        :periodRentId="null" />
-                    </div>
-                    <div class="side-by-side">
-                      <Button :_key="rent.id + 'eye'" tooltip="Visualizar" type="primary" classIcon="fa-solid fa-eye"
-                        size="small" :clicked="executeOpenModal" :params="rent" />
-                    </div>
-                    <div class="side-by-side">
-                      <Button :_key="rent.id + 'share'" tooltip="Compartilhar" type="info"
-                        classIcon="fa-sharp fa-regular fa-share-nodes" size="small" :clicked="printRent"
-                        :params="rent" />
-                    </div>
-                  </div>
-                </b-col>
-              </b-row>
-            </div>
-          </Molded>
-        </div>
-      </div>
-    </div>
-    <Modal :title="'Locação'" :width="900" :height="750" v-if="showModal('operationRent')">
-      <OperationRent module="Operational" :rentId="rentId" />
-    </Modal>
-    <PrintPreview v-if="print" module="Operational" :rentId="rentId" :periodRentId="periodRentId"
-      :onHideModal="closeModal" />
-  </div>
-</template>
-<script>
-
-
-import Button from "@nixweb/nixloc-ui/src/component/forms/Button";
-import SearchByFilter from "./SearchByFilter.vue";
-import Loading from "@nixweb/nixloc-ui/src/component/shared/Loading.vue";
-import Alert from "@nixweb/nixloc-ui/src/component/layout/Alert";
-import Molded from "@nixweb/nixloc-ui/src/component/layout/Molded";
-import Modal from "@nixweb/nixloc-ui/src/component/forms/Modal";
-import ButtonMovimentStock from './ButtonMovimentStock.vue'
-import PrintPreview from '../adm/document/PrintPreview.vue'
-import OperationRent from './OperationRent.vue'
-
-import { mapActions, mapMutations, mapGetters, mapState } from "vuex";
-
-export default {
-  name: "SearchList",
-  props: ["filter"],
-  components: { SearchByFilter, Loading, Alert, Molded, ButtonMovimentStock, Button, Modal, OperationRent, PrintPreview },
-  data() {
-    return {
-      search: {},
-      list: [],
-      urlGetAll: "/api/v1/operational/search",
-      loading: false,
-      showAlert: false,
-      rentId: "",
-      print: false,
-    };
-  },
-  mounted() {
-    this.list = this.searchRent;
-  },
-  computed: {
-    ...mapState("pdv", ["searchRent"]),
-    ...mapGetters("generic", ["showModal", "event"]),
-  },
-  methods: {
-    ...mapActions("generic", ["getApi"]),
-    ...mapMutations("generic", ["openModal", "removeLoading"]),
-    ...mapMutations("pdv", ["updateSearchRent"]),
-    getAll(filter, search) {
-      this.loading = true;
-      let params = {
-        url: this.urlGetAll,
-        obj: {
-          filter: filter,
-          search: search,
-        },
-      };
-      this.getApi(params).then((response) => {
-        this.loading = false;
-        this.list = response.content;
-        this.updateSearchRent(this.list);
-        this.showAlert = true;
-        this.removeLoading(["btnSearchPdv"]);
-      });
-    },
-    executeOpenModal(rent) {
-      this.rentId = rent.id;
-      this.openModal("operationRent");
-      this.removeLoading([rent.id + 'eye']);
-    },
-    printRent(rent) {
-      this.print = true;
-      this.rentId = rent.rentId;
-      this.removeLoading([rent.id + 'share']);
-    },
-  },
-  watch: {
-    search: {
-      handler(search) {
-        this.getAll(search.filter, search.search);
-      },
-      deep: true,
-    },
-  },
-};
-</script>
-<style scoped>
-.div-rent {
-  margin-top: 10px;
-  margin: auto;
-}
-
-.div-item {
-  margin-top: 10px;
-}
-
-.number {
-  font-size: 14px;
-  margin-left: 20px;
-}
-
-.title {
-  font-size: 15px;
-}
-
-.identification {
-  font-size: 13px;
-  background-color: #F1F3F4;
-  border-radius: 20px;
-  padding: 3px;
-}
-
-.icon-customer {
-  margin-right: 10px;
-}
-
-
-.max-title {
-  max-width: 450px;
-  white-space: nowrap;
-  overflow: hidden;
-  text-overflow: ellipsis;
-}
-
-.max-identification {
-  max-width: 250px;
-  white-space: nowrap;
-  overflow: hidden;
-  text-overflow: ellipsis;
-}
-
-
-
-.icon-default {
-  font-size: 20px;
-  color: #dde3ea;
-}
-</style>

package/src/components/modules/operational/TeamRent.vue

@@ -1,152 +0,0 @@
-<template>
-    <div>
-        <Loading type="line" :center="false" v-show="loading" />
-        <ScrollBar id="items-rent" :minHeight="300" :maxHeight="300">
-            <div v-for="item in content.data">
-                <div class="div-molded">
-                    <Molded>
-                        <b-row>
-                            <b-col sm="1">
-                                <img :src="'https://espaco.blob.core.windows.net/nixloc-photo-collaborator/' + item.photo"
-                                    class="user-photo">
-                            </b-col>
-                            <b-col sm="6">
-                                <b>
-                                    <span class="title"> {{ item.fullName }}</span>
-                                </b>
-                                <div>
-                                    <span class="title title-description" v-html="item.description"></span>
-                                </div>
-                            </b-col>
-                            <b-col sm="5">
-                                <div class="title div-period">
-                                    <i class="fa-solid fa-calendars"></i>
-                                    {{ item.fullPeriod }}
-                                </div>
-                            </b-col>
-                        </b-row>
-                    </Molded>
-                </div>
-            </div>
-            <div v-if="content.data.length == 0">
-                Nenhum registro encontrado!
-            </div>
-        </ScrollBar>
-    </div>
-</template>
-
-<script>
-
-import ScrollBar from "@nixweb/nixloc-ui/src/component/layout/ScrollBar.vue";
-import TableTotalRecords from "@nixweb/nixloc-ui/src/component/shared/TableTotalRecords.vue";
-import Loading from "@nixweb/nixloc-ui/src/component/shared/Loading.vue";
-import Molded from "@nixweb/nixloc-ui/src/component/layout/Molded";
-
-import { mapActions } from "vuex";
-
-export default {
-    name: "TeamRentList",
-    props: {
-        rentId: String,
-    },
-    components: {
-        ScrollBar,
-        TableTotalRecords,
-        Loading,
-        Molded
-    },
-    data() {
-        return {
-            urlGetApi: "/api/v1/human-resources/team/get-all",
-            data: [],
-            item: {},
-            loading: true,
-            content: {
-                data: [],
-                totalRecords: 0,
-            },
-            baseParams: {
-                search: undefined,
-                filter: "contains",
-                currentPage: 1,
-                totalPerPage: 200,
-            },
-        };
-    },
-    mounted() {
-        this.getAll(this.rentId);
-    },
-    methods: {
-        ...mapActions("generic", ["getApi"]),
-        getAll(rentId) {
-            this.loading = true;
-            let params = {
-                url: this.urlGetApi,
-                obj: {
-                    ...this.baseParams,
-                    any: rentId,
-                    noPaginated: true,
-                },
-            };
-            this.getApi(params).then((response) => {
-                this.content.data = response.content.data;
-                this.content.totalRecords = response.content.totalRecords;
-                this.loading = false;
-            });
-        },
-    },
-    watch: {
-        rentId: {
-            handler() {
-                this.getAll(this.rentId);
-            },
-            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;
-}
-
-.title-header {
-    font-size: 14px;
-    color: #757d8c;
-    font-weight: 400;
-    text-transform: uppercase;
-}
-
-.div-description {
-    margin-left: 10px;
-}
-
-.user-photo {
-    width: 45px;
-    height: 45px;
-    border-radius: 50px;
-    margin-bottom: 3px;
-    margin-top: 4px;
-}
-
-.div-period {
-    font-size: 14px;
-}
-
-.title-description {
-    font-size: 12px;
-}
-
-.div-molded {
-    margin-bottom: 12px;
-}
-</style>