- ListTableContent Action sütunu eklendi.

- DialogStore id elle girilebilecek

src/components/global/DataTable.vue

@@ -7,12 +7,12 @@
             <div class="table-head-content">Sıra No</div>
           </th>
           <template v-for="(headCell, h) in tableHeader">
-            <th :style="headCell.style || ''">
+            <th :style="[headCell.style || '']">
               <div
                 :class="[
                   'table-head-content',
                   headCell.sort !== undefined && headCell.sort ? 'clickable' : ''
-                ]"                
+                ]"
                 @click="SortColumn(headCell)">
                 <span>{{ headCell.title }}</span>
                 <template
@@ -47,13 +47,16 @@
               </div>
             </th>
           </template>
+          <th
+            :style="[rowActionStyle || '']"
+            v-if="rowActions !== undefined && rowActions.length > 0">
+            <div class="table-head-content">İşlemler</div>
+          </th>
         </tr>
       </thead>
       <tbody>
         <tr v-if="tableData.length === 0 && !isPreview">
-          <td :colspan="rowNumber ? tableHeader.length + 1 : tableHeader.length">
-            Veri bulunamadı
-          </td>
+          <td :colspan="ColSpan">Veri bulunamadı</td>
         </tr>
         <tr
           v-else
@@ -87,6 +90,25 @@
               <td v-else v-html="dataCell.computeHtml(dataRow)"></td>
             </template>
           </slot>
+          <td
+            v-if="rowActions !== undefined && rowActions.length > 0"
+            :class="[actionFixed ? 'action-fixed' : '']">
+            <template v-for="(action, ai) in rowActions">
+              <button
+                :class="[
+                  'button-c button-icon button-export',
+                  action.class !== undefined ? 'back-grad back-grad-' + action.class : ''
+                ]"
+                @click="LocalRowDataAction($event, action.action, dataRow, i)">
+                <i class="ico-c" v-if="action.icon !== undefined">
+                  <svg>
+                    <use :href="icourl + '#' + action.icon"></use>
+                  </svg>
+                </i>
+                <span class="panel-date">{{ action.text }}</span>
+              </button>
+            </template>
+          </td>
         </tr>
         <template
           v-if="
@@ -120,6 +142,7 @@
   import { ref, reactive, computed, watch } from 'vue'
   import type { Ref } from 'vue'
   import { useGlobalStore } from '@/stores/globalStore'
+  import icourl from '@/assets/images/icons.svg'
   const globalStore = useGlobalStore()
 
   interface ITableHead {
@@ -150,11 +173,15 @@
     rowNumber?: boolean
     totalValues?: Record<string, any>
     isPreview?: boolean
+    rowActions?: Record<string, any>[]
+    actionFixed?: boolean
+    rowActionStyle?: string
   }
   const props = withDefaults(defineProps<Props>(), {
     tableData: () => [],
     rowNumber: false,
-    isPreview: false
+    isPreview: false,
+    actionFixed: false
   })
 
   const emit = defineEmits(['update:sortData', 'update:pagination'])
@@ -186,9 +213,27 @@
     }
   })
 
+  const ColSpan = computed<number>(() => {
+    var span = props.tableHeader.length
+    if (props.rowNumber) span++
+    if (props.rowActions) span++
+    return span
+  })
   const LocalRowAction = (d: Record<string, any>) => {
     if (props.rowAction !== undefined) {
-      (props.rowAction! as Function)(d)
+      ;(props.rowAction! as Function)(d)
+    }
+  }
+
+  const LocalRowDataAction = (
+    e: Event,
+    action: Function | undefined,
+    dataRow: Record<string, any>,
+    i: number | string
+  ) => {
+    if (action !== undefined) {
+      e.stopImmediatePropagation()
+      action(dataRow, i)
     }
   }
 
@@ -223,3 +268,11 @@
     { deep: true }
   )
 </script>
+<style scoped>
+  .action-fixed {
+    position: absolute;
+    z-index: 9;
+    top: 0;
+    right: 0;
+  }
+</style>