quasar-factory-lib 0.0.37 → 0.0.38

package/package.json

@@ -97,6 +97,6 @@
     "release": "standard-version"
   },
   "type": "module",
-  "version": "0.0.37",
+  "version": "0.0.38",
   "author": ""
 }

package/src/components/Table/components/TableFilter.vue

@@ -9,7 +9,7 @@
     placeholder="Search"
     outlined
     @update:model-value="setFilterValue"
-  >{{localStore.filterValue  }}
+  >
     <template #append>
       <q-icon
         v-if="localStore.filterValue === ''"

package/src/components/Table/components/TableSlotBody.vue

@@ -17,9 +17,9 @@
       :key="col.name"
       :class="tableProps.row.rowBgColor || 'bg-main-color'"
       :props="tableProps"
-      :style="tablePropsData.row.tdStyle"
     >
       <span
+        :style="tablePropsData.row.tdStyle"
         v-if="getColumnValue(col)"
         v-html="tableProps.row[col.name]"
       />

package/src/components/Table/components/TableSlotGrid.vue

@@ -39,6 +39,7 @@
             <q-item-label
               v-if="getColumnValue(col)"
               class="itemsFontSize text-almost-black"
+              :style="tablePropsData.row.tdStyle"
             >
               <q-icon
                 v-if="col.editable"

package/src/components/Table/components/TableSlotHeader.vue

@@ -9,6 +9,7 @@
         v-if="selectionType == 'multiple'"
         v-model="tablePropsData.selected"
         size="sm"
+        class="float-left"
       />
     </q-th>
     <q-th

package/src/components/Table/utils/infiniteScroll.ts

@@ -3,7 +3,6 @@
 const infiniteScroll = {
   handleInfiniteScrollNewTable (self: { $nextTick: (arg0: () => void) => void; totalPageModal: number; smallDevice: boolean, totalPage: number }): void {
     self.$nextTick(() => {
-      // console.log('aqui')
       const elemClass = self.smallDevice ? 'q-table__grid-content' : 'q-table__middle scroll'
       const tableType = self.smallDevice ? 'Grid' : 'Table'
       const qtableScrollElem = document.getElementsByClassName(elemClass) as HTMLCollectionOf<HTMLElement>

package/src/components/TaskNavBar/TaskNavBar.vue

@@ -2,12 +2,12 @@
   <div id="taskNavBar">
     <q-toolbar class="q-toolbar-unset-height">
       <div class="row full-width">
-        <div class="col-6">
+        <div class="col-7">
           <img :src="logo" class="logo">
+          <span id="mobile-title">{{ title }}</span>
         </div>
-        <div class="col-6 text-right" id="buttons">
-          <q-btn v-if="showBtnBack" flat round size="lg" @click="onClickBtnBack">
-            <q-icon>
+        <div class="col-5 text-right">
+            <q-icon v-if="showBtnBack" size="md" class="cursor-pointer" @click="onClickBtnBack">
               <svg class="text-h4" xmlns="http://www.w3.org/2000/svg" width="30" height="30"
                 viewBox="0 0 23.648 22.836">
                 <g id="Arrow_brand" data-name="Arrow brand" transform="translate(0 22.836) rotate(-90)">
@@ -17,10 +17,15 @@
                 </g>
               </svg>
             </q-icon>
-          </q-btn>
-          <q-btn v-if="showBtnSearch" color="primary" flat round icon="search" size="lg" @click="onClickBtnSearch" />
-          <q-btn flat round size="lg" @click="onClickBtnMenu">
-            <q-icon id="menu">
+            <q-icon 
+              v-if="showBtnSearch"
+              color="primary" 
+              :name="showIconSearch ?'search' : 'search_off'" 
+              size="md" 
+              class="q-ml-md cursor-pointer"
+              @click="onClickBtnSearch">
+            </q-icon>
+            <q-icon id="iconMenu" size="md" @click="onClickBtnMenu" class="q-ml-md cursor-pointer">
               <svg xmlns="http://www.w3.org/2000/svg" width="30.448" height="28.247" viewBox="0 0 30.448 28.247">
                 <g id="Componente_11_3" data-name="Componente 11 – 3" transform="translate(0 1)">
                   <path id="Caminho_702" data-name="Caminho 702" d="M38.053,40.174H24"
@@ -35,7 +40,7 @@
                 </g>
               </svg>
             </q-icon>
-          </q-btn>
+
         </div>
       </div>
     </q-toolbar>
@@ -53,6 +58,7 @@ export default defineComponent({
   data() {
     return {
       date,
+      showIconSearch: true,
       rightDrawerOpen: false
     }
   },
@@ -81,6 +87,7 @@ export default defineComponent({
       console.log('menu')
     },
     onClickBtnSearch() {
+      this.showIconSearch = !this.showIconSearch
       this.$emit('onClickBtnSearch')
       console.log('search')
     },

package/src/components/TaskNavBar/css/taskNavBar.css

@@ -1,20 +1,21 @@
 #taskNavBar .logo {
   display: block;
   width: 125px;
-  height: 50px;
+  height: auto;
   background-position: center;
   background-repeat: no-repeat;
   background-size: contain;
   margin-bottom: 10px;
 }
-#taskNavBar #buttons .q-img {
-margin-left: 20px;
-}
 
 #taskNavBar .q-toolbar__title {
-font-family: "SangBleuKingdom-Light, sans-serif";
-font-size: 25px;
-margin: 0;
+  font-family: "SangBleuKingdom-Light, sans-serif";
+  font-size: 25px;
+  margin: 0;
+}
+
+#mobile-title {
+  display: none;
 }
 
 @media only screen and (max-width: 1100px) {
@@ -24,9 +25,14 @@ margin: 0;
 }
 
 @media only screen and (max-width: 375px) {
-#taskNavBar .logo {
+#taskNavBar .logo, #taskNavBar .q-toolbar__title {
   display: none;
 }
+#mobile-title {
+  display: block;
+  font-family: "SangBleuKingdom-Light, sans-serif";
+  font-size: 20px;
+}
 #taskNavBar .q-toolbar__title {
   font-size: 18px;
 } 

package/src/css/app.css

@@ -37,4 +37,8 @@
 .q-toolbar-unset-height .q-toolbar {
   min-height: unset;
   padding: 0;
+}
+
+.text-color-positive {
+  color: var(--positive);
 }

package/src/pages/TablePage.vue

@@ -23,30 +23,12 @@
           @on-update-customized-checkbox-value="onUpdateCustomizedCheckboxValue"
           @on-click-button="setItemNotFound"
         />
-        <q-dialog v-model="showDialog" >
-          <div>
-            <q-btn @click="close">Close</q-btn>
-          <Table
-          :rows="rows"
-          :columns="columns"
-          :visible-columns="visibleColumns"
-          :small-device="false"
-          :store="store"
-          :table-style="tableStyle"
-          :show-skeleton="false"
-          :selection-type="'multiple'"
-          :filter-method="filterMethod"
-          :filter-computed="filter"
-        />
-          </div>
-        </q-dialog>
       </div>
     </q-page>
   </q-page-container>
 </template>
 <script lang="ts">
 import Table from '../components/Table/Table.vue'
-// import rows from '../testData.js'
 import setTableHeight from '../components/Table/utils/setTableHeight'
 import infiniteScroll from '../components/Table/utils/infiniteScroll'
 import FilterMethod from '../components/Table/utils/filterMethod'
@@ -162,6 +144,7 @@ export default {
       rows: [],
       rowsData: [
         {
+          tdStyle: "color: #597765 !important; font-weight: bold;",
           name: 'Frozen Yogurt',
           booleanIcon: true,
           available: true,
@@ -329,12 +312,6 @@ export default {
     },
     setItemNotFound (rows: object []) {
       console.log(rows, 'onClickButton')
-      this.showDialog = true
-      this.store.lastFilterValue = this.store.filterValue 
-    },
-    close () {
-      this.showDialog= false
-      this.store.filterValue = this.store.lastFilterValue
     }
   }
 }

package/src/utils/infiniteScroll.ts

@@ -3,7 +3,6 @@
 const infiniteScroll = {
   handleInfiniteScrollNewTable (self: { $nextTick: (arg0: () => void) => void; totalPageModal: number; smallDevice: boolean, totalPage: number }): void {
     self.$nextTick(() => {
-      console.log('aqui')
       const elemClass = self.smallDevice ? 'q-table__grid-content' : 'q-table__middle scroll'
       const tableType = self.smallDevice ? 'Grid' : 'Table'
       const qtableScrollElem = document.getElementsByClassName(elemClass) as HTMLCollectionOf<HTMLElement>