flameresttable 1.0.60 → 1.0.62

package/package.json

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

package/src/Table/Table.vue

@@ -24,29 +24,32 @@
       <!--<div>-->
 
       <!-- ЧЕКБОКСЫ -->
-      <div class="w-[21px] align-middle col-span-1">
+      <div class="w-[21px] align-middle col-span-1" :style="'grid-column:' + 0">
         <label class="checkbox" v-if="Table.opts.rowSelectors">
           <input type='checkbox' @change="CheckboxSelectionChanged($event, true)">
           <span class='indicator'></span>
         </label>
       </div>
 
-      <template v-for="column in Table.columns">
+
+      <template v-for="(column, key, index) in Table.columns">
         <div v-if="column.Table.isShow" :key="'cheader_' + column.name"
           :class="' defaultHeader ' + column.Table.classesHeader"
-          class="  col-span-1 align-middle border-r border-r-slate-100 px-2">
+          class="  col-span-1 align-middle border-r border-r-slate-100 px-2" :style="'grid-column:' + (index + 2)">
           <span>{{ column.Table.titleCustom !== null ? (column as any).Table.titleCustom(column) : column.Table.title !==
             '' ?
             column.Table.title : column.title !== '' ? column.title :
               column.name }}</span>
         </div>
       </template>
-      <div v-if="opts.Edit.can" class=" col-span-1 border-r border-r-slate-100 px-2">
-        <button class="bg-green-600 invisible">
+      <div v-if="opts.Edit.can" class=" col-span-1 border-r border-r-slate-100 px-2"
+        :style="'grid-column:' + (columnCount() - 1)">
+        <button class=" bg-green-600 invisible">
 
         </button>
       </div>
-      <div v-if="opts.Remove.can" class=" col-span-1 border-r border-r-slate-100 px-2">
+      <div v-if="opts.Remove.can" class=" col-span-1 border-r border-r-slate-100 px-2"
+        :style="'grid-column:' + (columnCount())">
         <button class="bg-green-600 invisible">
 
         </button>
@@ -54,7 +57,7 @@
       <!--</div>-->
 
       <!-- СТРОКИ-->
-      <template v-for="(row) in (Table.Rows.rows)">
+      <template v-for="(  row  ) in   (Table.Rows.rows)  ">
         <template v-if="true">
 
           <!-- ЧЕКБОКСЫ -->
@@ -67,7 +70,7 @@
             </label>
           </div>
 
-          <template v-for="column in Table.columns">
+          <template v-for="  column   in   Table.columns  ">
             <div v-if="column.Table.isShow" :key="'tc_' + column.name + '_row_' + (row as any).id"
               :class="' defaultCell ' + column.Table.classes"
               class=" col-span-1 align-middle border-r border-r-slate-100 px-2 last:border-r-0 last:pr-0"
@@ -122,7 +125,7 @@
         <slot name="header" />
 
         <!-- КОЛОНКИ ТАБЛИЦЫ-->
-        <label v-for="column in ColumnNames" v-show="Table.columns[column].Popup.isShow" :key="'c' + column"
+        <label v-for="  column   in   ColumnNames  " v-show="Table.columns[column].Popup.isShow" :key="'c' + column"
           class="flex items-stretch justify-center w-full my-1 ml-2">
 
           <!-- Заголовок -->
@@ -149,7 +152,7 @@
           <div v-if="Table.columns[column].Popup.popupType === 'selector'"
             class="flex-1 mr-5 w-full flex flex-col self-stretch"><select v-model="Table.columns[column].Popup.model"
               class="h-full self-stretch py-1 px-2 w-full outline-none border border-slate-100">
-              <option v-for="(selectorVal, selectorKey) in Table.columns[column].Popup.Selector.values"
+              <option v-for="(  selectorVal, selectorKey  ) in   Table.columns[column].Popup.Selector.values  "
                 :key="'sel_' + selectorKey"
                 :value="getSelector(Table.columns[column].Popup.Selector.values, selectorKey, selectorVal)[1]">{{
                   getSelector(Table.columns[column].Popup.Selector.values, selectorKey, selectorVal)[0] }}</option>
@@ -454,7 +457,6 @@ export default defineComponent({
 <style scoped lang="scss">
 .grid-container {
   display: grid;
-  grid-template-columns: repeat(var(--column-count), 1fr);
 }
 
 .no-wrap-cell {