[色子游戏]底注配置

saiadmin-artd/src/views/plugin/dice/ante_config/index/index.vue

@@ -0,0 +1,139 @@
+<template>
+  <div class="art-full-height">
+    <TableSearch v-model="searchForm" @search="handleSearch" @reset="resetSearchParams" />
+
+    <ElCard class="art-table-card" shadow="never">
+      <ArtTableHeader v-model:columns="columnChecks" :loading="loading" @refresh="refreshData">
+        <template #left>
+          <ElSpace wrap>
+            <ElButton v-permission="'dice:ante_config:index:save'" @click="showDialog('add')" v-ripple>
+              <template #icon>
+                <ArtSvgIcon icon="ri:add-fill" />
+              </template>
+              {{ $t('table.actions.add') }}
+            </ElButton>
+            <ElButton
+              v-permission="'dice:ante_config:index:destroy'"
+              :disabled="selectedRows.length === 0"
+              @click="deleteSelectedRows(api.delete, refreshData)"
+              v-ripple
+            >
+              <template #icon>
+                <ArtSvgIcon icon="ri:delete-bin-5-line" />
+              </template>
+              {{ $t('table.actions.delete') }}
+            </ElButton>
+          </ElSpace>
+        </template>
+      </ArtTableHeader>
+
+      <ArtTable
+        ref="tableRef"
+        rowKey="id"
+        :loading="loading"
+        :data="data"
+        :columns="columns"
+        :pagination="pagination"
+        @sort-change="handleSortChange"
+        @selection-change="handleSelectionChange"
+        @pagination:size-change="handleSizeChange"
+        @pagination:current-change="handleCurrentChange"
+      >
+        <template #is_default="{ row }">
+          <ElTag :type="row.is_default === 1 ? 'success' : 'info'" size="small">
+            {{ row.is_default === 1 ? $t('page.table.defaultYes') : $t('page.table.defaultNo') }}
+          </ElTag>
+        </template>
+
+        <template #operation="{ row }">
+          <div class="flex gap-2">
+            <SaButton
+              v-permission="'dice:ante_config:index:update'"
+              type="secondary"
+              @click="showDialog('edit', row)"
+            />
+            <SaButton
+              v-permission="'dice:ante_config:index:destroy'"
+              type="error"
+              @click="deleteRow(row, api.delete, refreshData)"
+            />
+          </div>
+        </template>
+      </ArtTable>
+    </ElCard>
+
+    <EditDialog
+      v-model="dialogVisible"
+      :dialog-type="dialogType"
+      :data="dialogData"
+      @success="refreshData"
+    />
+  </div>
+</template>
+
+<script setup lang="ts">
+  import { useTable } from '@/hooks/core/useTable'
+  import { useSaiAdmin } from '@/composables/useSaiAdmin'
+  import api from '../../api/ante_config/index'
+  import TableSearch from './modules/table-search.vue'
+  import EditDialog from './modules/edit-dialog.vue'
+
+  const searchForm = ref({
+    name: undefined,
+    title: undefined,
+    is_default: undefined
+  })
+
+  const handleSearch = (params: Record<string, unknown>) => {
+    Object.assign(searchParams, params)
+    getData()
+  }
+
+  const {
+    columns,
+    columnChecks,
+    data,
+    loading,
+    getData,
+    searchParams,
+    pagination,
+    resetSearchParams,
+    handleSortChange,
+    handleSizeChange,
+    handleCurrentChange,
+    refreshData
+  } = useTable({
+    core: {
+      apiFn: api.list,
+      columnsFactory: () => [
+        { type: 'selection' },
+        { prop: 'id', label: 'page.table.id', width: 80, align: 'center' },
+        { prop: 'name', label: 'page.table.name', align: 'center' },
+        { prop: 'title', label: 'page.table.title', align: 'center' },
+        { prop: 'mult', label: 'page.table.mult', align: 'center' },
+        { prop: 'is_default', label: 'page.table.isDefault', width: 110, align: 'center', useSlot: true },
+        { prop: 'create_time', label: 'page.table.createTime', width: 170, align: 'center' },
+        { prop: 'update_time', label: 'page.table.updateTime', width: 170, align: 'center' },
+        {
+          prop: 'operation',
+          label: 'table.actions.operation',
+          width: 100,
+          align: 'center',
+          fixed: 'right',
+          useSlot: true
+        }
+      ]
+    }
+  })
+
+  const {
+    dialogType,
+    dialogVisible,
+    dialogData,
+    showDialog,
+    deleteRow,
+    deleteSelectedRows,
+    handleSelectionChange,
+    selectedRows
+  } = useSaiAdmin()
+</script>