vifo
82a19101a8
- 创建 rui-frontend 前端仓库 - 迁移 admin-ui 管理后台 - 创建 cashier-mobile 和 customer-mobile 占位项目 - 配置 pnpm workspace
67 lines
1.4 KiB
Vue
67 lines
1.4 KiB
Vue
<script setup lang="ts">
|
|
import { ref } from 'vue'
|
|
|
|
interface Props {
|
|
title: string
|
|
columns: any[]
|
|
loading?: boolean
|
|
}
|
|
|
|
const props = defineProps<Props>()
|
|
const emit = defineEmits<{
|
|
(e: 'add'): void
|
|
(e: 'refresh'): void
|
|
}>()
|
|
|
|
const searchForm = ref({})
|
|
</script>
|
|
|
|
<template>
|
|
<div class="page-container">
|
|
<h2 class="text-xl font-bold mb-4">{{ title }}</h2>
|
|
|
|
<div class="toolbar mb-4">
|
|
<el-button type="primary" @click="emit('add')">
|
|
新增
|
|
</el-button>
|
|
<el-button @click="emit('refresh')">
|
|
刷新
|
|
</el-button>
|
|
</div>
|
|
|
|
<el-table
|
|
v-loading="loading"
|
|
:data="[]"
|
|
stripe
|
|
border
|
|
style="width: 100%"
|
|
>
|
|
<el-table-column
|
|
v-for="col in columns"
|
|
:key="col.prop"
|
|
:prop="col.prop"
|
|
:label="col.label"
|
|
:width="col.width"
|
|
:min-width="col.minWidth"
|
|
:align="col.align || 'left'"
|
|
/>
|
|
<el-table-column label="操作" width="180" align="center" fixed="right">
|
|
<template #default="{ row }">
|
|
<el-button link type="primary" size="small">编辑</el-button>
|
|
<el-button link type="danger" size="small">删除</el-button>
|
|
</template>
|
|
</el-table-column>
|
|
</el-table>
|
|
</div>
|
|
</template>
|
|
|
|
<style scoped>
|
|
.page-container {
|
|
padding: 20px;
|
|
}
|
|
.toolbar {
|
|
display: flex;
|
|
gap: 8px;
|
|
}
|
|
</style>
|