added online and trigger

This commit is contained in:
2026-07-22 18:12:45 +03:30
parent a759cf7251
commit 090dbbe239
21 changed files with 1463 additions and 286 deletions
+47 -29
View File
@@ -86,6 +86,7 @@
:columns="_columns"
:data-source="data"
v-bind="_props"
:scroll="tableScroll"
:pagination="false"
@resizeColumn="handleResizeColumn"
>
@@ -289,24 +290,9 @@ import {
availableFilterType,
MapFilterOpToFaString
} from '@core/components/BaseTable/hooks/filterOperator'
//import { mapColumnTypeFilterToFilterType } from '@core/type/baseTable'
//import { useElementSize } from '@vueuse/core'
//import { ContentLoader } from 'vue-content-loader'
//skeleton
//const skeletonWidth = ref(null)
/*const skeletonWidthSize = reactive(
useElementSize(skeletonWidth, { width: 0, height: 0 }, { box: 'border-box' })
)*/
//const skeletonHeight = 357
/*const skeletonHeight = ref(null)
const skeletonHeightSize = reactive(
useElementSize(skeletonHeight, { width: 0, height: 0 }, { box: 'border-box' })
)*/
/*
watch(skeletonHeightSize, (v) => {
console.log('ttt', v)
})
*/
/** Wide enough for dense action icon rows (e.g. customers); too-narrow fixed cells bleed into neighbors. */
const DEFAULT_ACTION_WIDTH = 280
interface Props {
bordered?: boolean
@@ -328,7 +314,7 @@ const props = withDefaults(defineProps<Props>(), {
driver: 'laravel-sql',
mode: 'pro',
columns: () => [],
scroll: () => ({ x: true }), //y: '100%' //y: 600
scroll: () => ({ x: true }),
pageSize: () => [5, 10, 20, 50, 100],
defaultPageLimit: 10,
showPaginate: true,
@@ -345,13 +331,30 @@ const filters = ref<Filter[]>([])
const order = ref<'asc' | 'desc'>('asc')
const orderColumnKey = ref<string | null>(null)
const containerRef = ref()
//const route = useRoute()
const loading = ref<boolean>(false)
const tableReady = ref(false)
let callApiPromise: Promise<void> | null = null
const _props = computed(() => {
return omit(props, ['columns', 'pagination', 'dataSource'])
return omit(props, ['columns', 'pagination', 'dataSource', 'scroll'])
})
const tableScroll = computed(() => ({
x: props.scroll?.x ?? true,
...(props.scroll?.y != null ? { y: props.scroll.y } : {})
}))
function isActionColumn(column: BaseTableColumn) {
const rawIndex = column.dataIndex
const dataIndex = Array.isArray(rawIndex) ? rawIndex.join('.') : String(rawIndex ?? '')
const key = column.key != null ? String(column.key) : ''
return (
column.slot === 'action' ||
key === 'action' ||
key === 'row_action' ||
dataIndex === 'action' ||
dataIndex === 'row_action'
)
}
const emit = defineEmits<{
(e: 'register', data: BaseTableEmit): void
}>()
@@ -469,15 +472,17 @@ const _columns = computed(() => {
if (!Object.hasOwn(column, 'align')) {
column.align = 'center'
}
if (isActionColumn(column)) {
if (!Object.hasOwn(column, 'fixed') || column.fixed == null) {
column.fixed = 'right'
}
const w = Number(column.width)
if (!Object.hasOwn(column, 'width') || column.width == null || !Number.isFinite(w) || w < 200) {
column.width = DEFAULT_ACTION_WIDTH
}
}
//@ts-ignore
column.dataIndex = column.dataIndex.split('.')
//if(isArray(column.dataIndex))
/*if(!isArray(column.dataIndex)){
}*/
//column.dataIndex = column.dataIndex.split('.')
/*if(){
column.dataIndex=
}*/
column.dataIndex = String(column.dataIndex ?? '').split('.')
})
return cols
})
@@ -699,6 +704,19 @@ defineExpose({
overflow: auto;
}
/* Fixed ops column must fully cover neighbors (RTL left / fixed-right) */
.ant-table-cell-fix-right,
.ant-table-cell-fix-right.ant-table-cell-fix-last-right {
background: var(--admin-bg-elevated, var(--admin-bg-surface, #141414)) !important;
}
html.is-dark & {
.ant-table-cell-fix-right,
.ant-table-cell-fix-right.ant-table-cell-fix-last-right {
background: var(--admin-bg-elevated, #1f1f1f) !important;
}
}
.table-footer {
flex-shrink: 0;
}
@@ -7,6 +7,7 @@
<!-- relative h-full-->
<div class="scrollable-container" id="components-affix-demo-target" ref="containerRef">
<!--- TODO remove AFFix -->
<div class="table-toolbar shrink-0 mb-2">
<AAffix :target="() => containerRef">
<div class="flex items-center justify-between mb-2">
<div class="flex items-center gap-1">
@@ -84,10 +85,13 @@
</div>
</div>
</AAffix>
</div>
<div class="table-body min-h-0 min-w-0 flex-1 overflow-auto">
<ATable
:columns="_columns"
:data-source="data"
v-bind="_props"
:scroll="tableScroll"
:pagination="false"
@resizeColumn="handleResizeColumn"
>
@@ -100,9 +104,10 @@
</template>
<!-- <template #loading> sdfsdfsdfsd </template>-->
</ATable>
</div>
<!-- absolute bottom-0 w-full-->
<!-- absolute bottom-0-->
<div class="flex items-center justify-between mt-5 w-full">
<div class="table-footer flex items-center justify-between mt-5 w-full shrink-0">
<span> {{ totalRecord }} مورد یافت شد </span>
<div class="flex items-center gap-2 justify-between">
<APagination
@@ -296,24 +301,9 @@ import {
availableFilterType,
MapFilterOpToFaString
} from '@core/components/BaseTableOld/hooks/filterOperator'
//import { mapColumnTypeFilterToFilterType } from '@core/type/baseTable'
//import { useElementSize } from '@vueuse/core'
//import { ContentLoader } from 'vue-content-loader'
//skeleton
//const skeletonWidth = ref(null)
/*const skeletonWidthSize = reactive(
useElementSize(skeletonWidth, { width: 0, height: 0 }, { box: 'border-box' })
)*/
//const skeletonHeight = 357
/*const skeletonHeight = ref(null)
const skeletonHeightSize = reactive(
useElementSize(skeletonHeight, { width: 0, height: 0 }, { box: 'border-box' })
)*/
/*
watch(skeletonHeightSize, (v) => {
console.log('ttt', v)
})
*/
/** Wide enough for dense action icon rows; too-narrow fixed cells bleed into neighbors. */
const DEFAULT_ACTION_WIDTH = 280
interface Props {
bordered?: boolean
@@ -331,7 +321,7 @@ const props = withDefaults(defineProps<Props>(), {
driver: 'laravel-sql',
mode: 'pro',
columns: () => [],
scroll: () => ({ x: true }), //y: '100%' //y: 600
scroll: () => ({ x: true }),
pageSize: () => [5, 10, 20, 50, 100],
defaultPageLimit: 10
})
@@ -345,11 +335,28 @@ const filters = ref<Filter[]>([])
const order = ref<'asc' | 'desc'>('asc')
const orderColumnKey = ref<string | null>(null)
const containerRef = ref()
//const route = useRoute()
const loading = ref<boolean>(false)
const _props = computed(() => {
return omit(props, ['columns', 'pagination', 'dataSource'])
return omit(props, ['columns', 'pagination', 'dataSource', 'scroll'])
})
const tableScroll = computed(() => ({
x: props.scroll?.x ?? true,
...(props.scroll?.y != null ? { y: props.scroll.y } : {})
}))
function isActionColumn(column: BaseTableColumn) {
const rawIndex = column.dataIndex
const dataIndex = Array.isArray(rawIndex) ? rawIndex.join('.') : String(rawIndex ?? '')
const key = column.key != null ? String(column.key) : ''
return (
column.slot === 'action' ||
key === 'action' ||
key === 'row_action' ||
dataIndex === 'action' ||
dataIndex === 'row_action'
)
}
const emit = defineEmits<{
(e: 'register', data: BaseTableEmit): void
}>()
@@ -468,15 +475,17 @@ const _columns = computed(() => {
if (!Object.hasOwn(column, 'align')) {
column.align = 'center'
}
if (isActionColumn(column)) {
if (!Object.hasOwn(column, 'fixed') || column.fixed == null) {
column.fixed = 'right'
}
const w = Number(column.width)
if (!Object.hasOwn(column, 'width') || column.width == null || !Number.isFinite(w) || w < 200) {
column.width = DEFAULT_ACTION_WIDTH
}
}
//@ts-ignore
column.dataIndex = column.dataIndex.split('.')
//if(isArray(column.dataIndex))
/*if(!isArray(column.dataIndex)){
}*/
//column.dataIndex = column.dataIndex.split('.')
/*if(){
column.dataIndex=
}*/
column.dataIndex = String(column.dataIndex ?? '').split('.')
})
return cols
})
@@ -652,7 +661,6 @@ async function callApi() {
onMounted(async () => {
await callApi()
emit('register', { reload })
//console.log('router', route.query)
})
defineExpose({
@@ -666,11 +674,26 @@ defineExpose({
.@{prefix} {
@apply h-full max-w-full flex flex-col min-h-0;
.scrollable-container {
display: flex;
flex: 1;
flex-direction: column;
max-width: 100%;
min-height: 0;
min-width: 0;
overflow: hidden;
}
.table-body {
flex: 1;
min-height: 0;
overflow-x: auto;
overflow-y: auto;
min-width: 0;
overflow: auto;
}
.table-footer {
flex-shrink: 0;
}
.ant-table-cell-fix-right,
.ant-table-cell-fix-right.ant-table-cell-fix-last-right {
background: var(--admin-bg-elevated, var(--admin-bg-surface, #141414)) !important;
}
.ant-table-wrapper {
border: 1px solid var(--admin-border);