132 lines
4.1 KiB
Plaintext

<template>
<a-card :bordered="false">
<div class="table-page-search-wrapper" v-if="hasPerm('${className}:page')">
<a-form layout="inline">
<a-row :gutter="48">
#foreach ($column in $tableField)
<a-col :md="8" :sm="24">
<a-form-item label="${column.columnComment}" >
<a-input v-model="queryParam.${column.columnName}" allow-clear placeholder="请输入${column.columnComment}"/>
</a-form-item>
</a-col>
#end
<a-col :md="!advanced && 8 || 24" :sm="24">
<span class="table-page-search-submitButtons" :style="advanced && { float: 'right', overflow: 'hidden' } || {} ">
<a-button type="primary" @click="$refs.table.refresh(true)">查询</a-button>
<a-button style="margin-left: 8px" @click="() => queryParam = {}">重置</a-button>
</span>
</a-col>
</a-row>
</a-form>
</div>
<div class="table-operator" v-if="hasPerm('${className}:add')" >
<a-button type="primary" v-if="hasPerm('${className}:add')" icon="plus" @click="$refs.addForm.add()">新增${functionName}</a-button>
</div>
<s-table
ref="table"
size="default"
:columns="columns"
:data="loadData"
:alert="true"
#foreach ($column in $tableField)
#if (${column.primaryKeyFlag})
:rowKey="(record) => record.${column.columnName}"
#end
#end
:rowSelection="{ selectedRowKeys: selectedRowKeys, onChange: onSelectChange }"
>
<span slot="action" slot-scope="text, record">
<a v-if="hasPerm('${className}:edit')" @click="$refs.editForm.edit(record)">编辑</a>
<a-divider type="vertical" v-if="hasPerm('${className}:edit') & hasPerm('${className}:delete')"/>
<a-popconfirm v-if="hasPerm('${className}:delete')" placement="topRight" title="确认删除?" @confirm="() => ${className}Delete(record)">
<a>删除</a>
</a-popconfirm>
</span>
</s-table>
<add-form ref="addForm" @ok="handleOk" />
<edit-form ref="editForm" @ok="handleOk" />
</a-card>
</template>
<script>
import { STable } from '@/components'
import { ${className}Page, ${className}Delete } from '@/api/modular/main/${busName}/${className}Manage'
import addForm from './addForm.vue'
import editForm from './editForm.vue'
export default {
components: {
STable,
addForm,
editForm
},
data () {
return {
// 高级搜索 展开/关闭
advanced: false,
// 查询参数
queryParam: {},
// 表头
columns: [
#foreach ($column in $tableField)
#if (!${column.primaryKeyFlag})
{
title: '${column.columnComment}',
dataIndex: '${column.columnName}'
}#if($foreach.hasNext),
#end
#end
#end
],
// 加载数据方法 必须为 Promise 对象
loadData: parameter => {
return ${className}Page(Object.assign(parameter, this.queryParam)).then((res) => {
return res.data
})
},
selectedRowKeys: [],
selectedRows: []
}
},
created () {
if (this.hasPerm('${className}:edit') || this.hasPerm('${className}:delete')) {
this.columns.push({
title: '操作',
width: '150px',
dataIndex: 'action',
scopedSlots: { customRender: 'action' }
})
}
},
methods: {
${className}Delete (record) {
${className}Delete(record).then((res) => {
if (res.success) {
this.$message.success('删除成功')
this.$refs.table.refresh()
} else {
this.$message.error('删除失败') // + res.message
}
})
},
toggleAdvanced () {
this.advanced = !this.advanced
},
handleOk () {
this.$refs.table.refresh()
},
onSelectChange (selectedRowKeys, selectedRows) {
this.selectedRowKeys = selectedRowKeys
this.selectedRows = selectedRows
}
}
}
</script>
<style lang="less">
.table-operator {
margin-bottom: 18px;
}
button {
margin-right: 8px;
}
</style>