flameresttable 1.0.21 → 1.0.22

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "flameresttable",
-  "version": "1.0.21",
+  "version": "1.0.22",
   "main": "./src/plugin.ts",
   "repository": {
     "type": "git",

package/src/App.vue

@@ -38,6 +38,7 @@ opts.set("name", {
 
 
 opts.addVirtual('test', { title: 'test title', Table: { isShow: true, } })
+opts.addVirtual('date', { title: 'dt', Filter: { isShow: true, type: 'daterange' }, Table: { isShow: true, } })
 
 opts.Add.can = true;
 opts.Remove.can = true;
@@ -51,7 +52,7 @@ opts.LoadParams.sort = ['-dt1'];
 <template lang="pug">
 Table(:model="Model", :opts="opts")
   template(v-slot:RowSubSlot="params")
-    | {{ params.row.name }}
+    | {{ params.row.name + ' dfg df dfg dfgdg dgdf gdfgd gdf gdgd fgdf gdf gdf gdfgdfg dfgdf gdg' }}
 </template>
 
 <style>

package/src/Table/Columns.ts

@@ -102,7 +102,7 @@ export class Column implements IColumn {
 
     // Значение
     valueString: "",
-    valueRange: { from: '', to: '' },
+    valueRange: [],
 
     // Тип фильтра
     type: 'text' as "text" | "fixed" | "fulltext" | "number" | "date" | "daterange" | "selector",
@@ -267,7 +267,7 @@ export interface IColumn {
 
     // Значение
     valueString?: string,
-    valueRange?: { from: string, to: string },
+    valueRange?: Array<string>,
 
     // Минимальное число символов в строке фильтра, после которого будет произведён запрос
     filterMinSymbolsRequest?: number,

package/src/Table/Table.vue

@@ -30,7 +30,7 @@
     </div>
 
     <!-- ТАБЛИЦА-->
-    <div class="mt-2 table w-full ">
+    <div class="mt-2 table table-fixed w-full ">
 
       <!-- ЗАГОЛОВКИ СТОЛБЦОВ-->
       <div class="table-header-group">
@@ -75,7 +75,9 @@
             </div>
           </div>
           <div :key="'row_slot_' + (row as any).id" v-if="opts.onRowClickOpenSlot && !isRowCollapsed(row)">
-            <slot name="RowSubSlot" :row="row" />
+            <div class="table-cell no-wrap-cell">
+              <slot name="RowSubSlot" :row="row" />
+            </div>
           </div>
         </template>
       </div>
@@ -402,4 +404,8 @@ export default defineComponent({
 
 </script>
 
-<style scoped lang="scss"></style>
+<style scoped lang="scss">
+.no-wrap-cell {
+  white-space: nowrap !important;
+}
+</style>

package/src/Table/TableFilters.vue

@@ -12,11 +12,17 @@
         <div v-if="col.Filter.type === 'selector'">
           <select class="outline-none border border-slate-500 px-2 py-1 mx-2" :placeholder="col.title ?? col.name"
             @change="update()" v-model="col.Filter.valueString">
-            <option v-for="item in col.Selector.values" :key="item[0]">
-              
+            <option v-for="item in col.Selector.values" :key="item[0]" value="">
+              {{ item[1] }}
             </option>
           </select>
         </div>
+        <div v-if="col.Filter.type === 'date' || col.Filter.type === 'daterange'">
+          <Datepicker v-if="col.Filter.type === 'date'" v-model="col.Filter.valueString" :auto-apply="true"
+            @update:model-value="update()" :teleport="true"></Datepicker>
+          <Datepicker v-if="col.Filter.type === 'daterange'" v-model="col.Filter.valueRange" :range="true"
+            :auto-apply="true" @update:model-value="update()" :teleport="true" style="z-index: 99999;"></Datepicker>
+        </div>
       </div>
 
     </div>
@@ -32,6 +38,7 @@ import TableOpts from './TableOpts';
 import { Column } from './Columns';
 //import { TableFilter } from './TableOpts.js';
 import FlameTable from './FlameTable';
+import Datepicker from '@vuepic/vue-datepicker';
 
 // Глобальное хранилище и роуты
 const store = storeFile(), router = useRouter(), route = useRoute();