表格优化

This commit is contained in:
仲么了
2023-12-27 10:39:40 +08:00
parent e1299a5520
commit d42936398e
6 changed files with 232 additions and 61 deletions

View File

@@ -1,53 +1,24 @@
<template>
<TableHeader>
<template v-slot:select>
<el-form-item label="Activity name">
<el-input />
</el-form-item>
<el-form-item label="Activity name">
<el-input />
</el-form-item>
<el-form-item label="Activity name">
<el-input />
</el-form-item>
<el-form-item label="Activity name">
<el-input />
</el-form-item>
<el-form-item label="Activity name">
<el-input />
</el-form-item>
<el-form-item label="Activity name">
<el-input />
</el-form-item>
<el-form-item label="Activity name">
<el-input />
</el-form-item>
<el-form-item label="Activity name">
<el-input />
</el-form-item>
<el-form-item label="Activity name">
<el-input />
</el-form-item>
<el-form-item label="Activity name">
<el-input />
</el-form-item>
</template>
<template v-slot:operation>
<el-button type="primary">新增</el-button>
<el-button type='primary' @click='addMenu'>新增</el-button>
</template>
</TableHeader>
<Table ref="tableRef" :pagination="false" />
<Table ref='tableRef' :pagination='false' />
<popupForm ref='popupRef'></popupForm>
</template>
<script setup lang="ts">
<script setup lang='ts'>
import { ref, onMounted, provide } from 'vue'
import TableStore from '@/utils/tableStore'
import Table from '@/components/table/index.vue'
import TableHeader from '@/components/table/header/index.vue'
import popupForm from './popupForm.vue'
defineOptions({
name: 'auth/menu'
})
const tableRef = ref()
const popupRef = ref()
const tableStore = new TableStore({
url: '/user-boot/function/functionTree',
column: [
@@ -71,7 +42,26 @@ const tableStore = new TableStore({
title: '编辑',
type: 'primary',
icon: 'el-icon-EditPen',
render: 'tipButton'
render: 'tipButton',
click: (row) => {
popupRef.value.open('编辑菜单', row)
}
},
{
name: 'del',
title: '删除',
type: 'danger',
icon: 'el-icon-Delete',
render: 'confirmButton',
popconfirm: {
confirmButtonText:'确认',
cancelButtonText: '取消',
confirmButtonType: 'danger',
title: '确定删除该菜单吗?',
},
click: (row) => {
popupRef.value.open('编辑菜单', row)
}
}
]
}
@@ -83,4 +73,8 @@ onMounted(() => {
tableStore.table.ref = tableRef.value
tableStore.index()
})
const addMenu = () => {
console.log(popupRef)
popupRef.value.open('新增菜单')
}
</script>

View File

@@ -0,0 +1,34 @@
<template>
<el-dialog
class='ba-operate-dialog'
v-model='dialogVisible'
:title='title'
>
<span>This is a message</span>
<template #footer>
<span class='dialog-footer'>
<el-button @click='dialogVisible = false'>取消</el-button>
<el-button type='primary' @click='submit'>
确认
</el-button>
</span>
</template>
</el-dialog>
</template>
<script lang='ts' setup>
import { ref } from 'vue'
const dialogVisible = ref(false)
const title = ref('新增菜单')
const open = (text: string, data?: anyObj) => {
title.value = text
dialogVisible.value = true
}
const submit = () => {
dialogVisible.value = false
}
defineExpose({ open })
</script>