<template>
<sv-card>
<sv-form ref="SvForm" :form.sync="form" :fieldList="fieldList" :formDisabled="formDisabled"> </sv-form>
<!-- 按钮 -->
<div style="margin-top: 10px; text-align: center">
<el-button v-if="butHidden" type="primary" class="filter-item" @click="handleSave">提交</el-button>
<el-button type="primary" class="filter-item" @click="handleClose">取消</el-button>
</div>
</sv-card>
</template>
<script>
import { addObj,
getObj, putObj } from '@/views/server/bdBacklogInfo/api/index'
export default {
name: 'bdBacklogInfoDetails',
data() {
return {
form: {},
// 表单是否禁用
formDisabled: true,
fieldList: [
{
type: 'text',
label: '错误类型',
prop: 'error',
tooltip: '<li></li>'
},
{
type: 'text',
label: '待办人账号',
prop: 'userId',
tooltip: '<li></li>'
},
{
type: 'text',
label: '待办人',
prop: 'userName',
tooltip: '<li></li>'
},
{
type: 'text',
label: '待办状态',
prop: 'backlogStatus',
tooltip: '<li></li>'
},
{
type: 'text',
label: '待办完成时间',
prop: 'backlogCompleteTime',
tooltip: '<li></li>'
},
{
type: 'text',
label: '周期',
prop: 'cycle',
tooltip: '<li></li>'
},
{
type: 'text',
label: '租户Id',
prop: 'tenantId',
tooltip: '<li></li>'
},
{
type: 'text',
label: '激活标识',
prop: 'isActive',
tooltip: '<li></li>'
},
{
type: 'text',
label: '乐观锁标识',
prop: 'version',
tooltip: '<li></li>'
},
{
type: 'text',
label: '扩张字段1',
prop: 'ref1',
tooltip: '<li></li>'
},
{
type: 'text',
label: '扩张字段2',
prop: 'ref2',
tooltip: '<li></li>'
},
{
type: 'text',
label: '扩张字段3',
prop: 'ref3',
tooltip: '<li></li>'
},
{
type: 'text',
label: '扩张字段4',
prop: 'ref4',
tooltip: '<li></li>'
},
{
type: 'text',
label: '扩张字段5',
prop: 'ref5',
tooltip: '<li></li>'
},
{
type: 'text',
label: '扩张字段6',
prop: 'ref6',
tooltip: '<li></li>'
},
{
type: 'text',
label: '扩张字段7',
prop: 'ref7',
tooltip: '<li></li>'
},
{
type: 'text',
label: '扩张字段8',
prop: 'ref8',
tooltip: '<li></li>'
},
{
type: 'text',
label: '创建人',
prop: 'crtUserName',
tooltip: '<li></li>'
},
{
type: 'text',
label: '创建人ID',
prop: 'crtUserId',
tooltip: '<li></li>'
},
{
type: 'text',
label: '创建时间',
prop: 'crtTime',
tooltip: '<li></li>'
},
{
type: 'text',
label: '最后更新人',
prop: 'updUserName',
tooltip: '<li></li>'
},
{
type: 'text',
label: '最后更新人ID',
prop: 'updUserId',
tooltip: '<li></li>'
},
{
type: 'text',
label: '最后更新时间',
prop: 'updTime',
tooltip: '<li></li>'
}
],
// 是否显示功能按钮
butHidden: true
}
},
props: {
// 父页面数据
// 数据id
id: {
type: String
},
// 明细页面操作标识：新增-create、修改-update、查看-view
dialogDetailsStatus: {
type: String
},
// 弹出框打开关闭标识
dialogDetailsVisible: {
type: Boolean
}
},
computed: {},
watch: {},
created() {
this.initData()
},
methods: {
// 初始化
async initData() {
// 获取表单数据
if (this.dialogDetailsStatus !== 'create') {
if (this.id) {
getObj(this.id).then(res => {
this.form = res.data
})
}
}
// 控制表单禁用
if (this.dialogDetailsStatus !== 'view') {
// 查看页面禁用所有标签
this.formDisabled = false
this.butHidden = true
}
// 创建初始默认值设定
if (this.dialogDetailsStatus === 'create') {
this.form.isActive = '1'
this.form.status = '1'
}
},
// 保存
async handleSave() {
// 校验表单
if (!this.$refs.SvForm.validate()) return
if (this.dialogDetailsStatus === 'update') {
const response = await putObj(this.id, this.form)
if (response.success) {
this.$notify({
title: '提示',
message: '修改成功',
type: 'success',
duration: 2000
})
// 关闭弹窗
this.$emit('handleCloseDetailsDialog')
}
} else if (this.dialogDetailsStatus === 'create') {
const response = await addObj(this.form)
if (response.success) {
this.$notify({
title: '提示',
message: '创建成功',
type: 'success',
duration: 2000
})
// 关闭弹窗
this.$emit('handleCloseDetailsDialog')
}
}
},
// 关闭页面
handleClose() {
// 调用父组件方法
this.$emit('handleCloseDetailsDialog')
}
}
}
</script>
<style lang="scss" scoped>
::v-deep .text-type-class .el-input__inner {
background-color: pink;
}
</style>
<template>
<div class="app-container">
<sv-search-table
ref="SvSearchTable"
:tableIndex="true"
:singleSelect="true"
:api="customPage"
:data.sync="tableInfo.data"
:field-list="tableInfo.fieldList"
moduleName="bdBacklogInfo"
module="bdBacklogInfo"
@selection-change="selectionChange"
>
<!-- 自定义按钮 -->
<el-button type="primary" class="filter-item" @click="columnsSettings">列设置</el-button>
<el-button type="primary" class="filter-item" @click="resetColumnSettings">重置列设置</el-button>
<el-button type="primary" class="filter-item" @click="exportCurrentPage">导出本页</el-button>
<el-button type="primary" class="filter-item" @click="exportExcel">导出全部</el-button>
<el-button type="primary" v-for="item in btList" :key="item.event" @click="handleClick(item.event)"
>{{ item.label }}
</el-button>
</sv-search-table>
<!-- 详情信息弹窗 -->
<el-dialog :title="dialogTitle" :visible.sync="dialogDetailsVisible" :close-on-click-modal="false">
<details-pop
v-if="dialogDetailsVisible"
:id="id"
:dialogDetailsStatus="dialogDetailsStatus"
:dialogDetailsVisible="dialogDetailsVisible"
@cancel="dialogDetailsVisible = false"
@handleCloseDetailsDialog="handleCloseDetailsDialog"
></details-pop>
</el-dialog>
</div>
</template>
<script>
import { delObj, customPage, efficient, invalid } from '@/views/server/bdBacklogInfo/api/index'
import { mapGetters } from 'vuex'
export default {
name: 'bdBacklogInfo',
components: {
// 加载子组件
'details-pop': () => import('../bdBacklogInfo/details.vue')
},
data() {
return {
customPage,
tableInfo: {
data: [],
fieldList: [
{
inputType: 'input',
prop: 'id',
label: 'Id',
hidden: true,
inputHidden: true
},
{
inputType: 'input',
prop: 'cuowuxinxi',
label: '错误类型',
hidden: false
},
{
inputType: 'input',
prop: 'userId',
label: '待办人账号',
hidden: false
},
{
inputType: 'input',
prop: 'userName',
label: '待办人',
hidden: false
},
{
inputType: 'input',
prop: 'backlogStatus',
label: '待办状态',
hidden: false
},
{
inputType: 'input',
prop: 'backlogCompleteTime',
label: '待办完成时间',
hidden: false
},
{
inputType: 'input',
prop: 'cycle',
label: '周期',
hidden: false
},
{
inputType: 'input',
prop: 'crtUserName',
label: '创建人',
hidden: false
}
]
},
// 页面操作按钮
btList: [
// {
// label: '新增',
// event: 'create'
// },
// {
// label: '修改',
// event: 'update'
// },
// {
// label: '查看',
// event: 'view'
// },
// {
// label: '启用',
// event: 'efficient'
// },
// {
// label: '停用',
// event: 'invalid'
// },
// {
// label: '删除',
// event: 'del'
// }
],
// 选中行数据
currentRow: undefined,
// 跳转详情数据的id
id: '',
// 详情页面标题
dialogTitle: '',
// 详情页面的操作类型
dialogDetailsStatus: 'view',
// 详情页面打开控制
dialogDetailsVisible: false
}
},
created() {
// 加载按钮权限
// this.btList = this.btList.filter(item =>
// if (item.event === 'create') {
// return this.elements['ewModel:btn_create']
// }
// true
// )
return true
},
computed: {
...mapGetters(['elements'])
},
methods: {
getList() {
// 获取表格数据
this.$refs.SvSearchTable.getList()
},
// 选中行
selectionChange(row) {
this.currentRow = row
},
// 校验选择行数据:event-操作类型 chooseOne-是否控制只能选择一条
handleCheckSelect(event) {
if (this.currentRow ===
null || this.currentRow === undefined || this.currentRow.length === 0) {
if (event === 'create') return false
if (event === 'update' || event === 'view' || event === 'efficient' || event === 'invalid' || event === 'del') {
this.$notify({
title: this.$t('common.message.error'),
message: '最少选择一条数据进行操作',
type: 'error',
duration: 2000
})
}
return true
}
return false
},
// 操作列按钮，event事件，data行数据
handleClick(event) {
if (this.handleCheckSelect(event)) return
switch (event) {
case 'create':
this.handleDetails(event)
break
case 'update':
this.handleDetails(event)
break
case 'view':
this.handleDetails(event)
break
case 'efficient':
this.handlEefficient(event)
break
case 'invalid':
this.handlInvalid(event)
break
case 'del':
this.handlDel(event)
break
default:
break
}
},
handleDetails(event) {
// 详情页面
if (event === 'view') {
this.dialogTitle = '查看'
this.dialogDetailsStatus = 'view'
} else if (event === 'update') {
this.dialogDetailsStatus = 'update'
this.dialogTitle = '修改'
} else if (event === 'create') {
this.dialogDetailsStatus = 'create'
this.dialogTitle = '创建'
}
// 传递选中的列表数据主键id
this.id = this.currentRow ? this.currentRow.id :
null
// 打开明细页面
this.dialogDetailsVisible = true
},
// 关闭详情页面
handleCloseDetailsDialog() {
this.dialogDetailsVisible = false
if (this.dialogDetailsStatus !== 'view') {
this.getList()
}
},
async handlEefficient() {
// 生效
const response = await efficient(this.currentRow.id)
if (response.success) {
this.$notify({
title: '提示',
message: '操作成功',
type: 'success',
duration: 2000
})
this.getList()
}
},
async handlInvalid() {
// 失效
const response = await invalid(this.currentRow.id)
if (response.success) {
this.$notify({
title: '提示',
message: '操作成功',
type: 'success',
duration: 2000
})
this.getList()
}
},
async handlDel() {
// 删除
this.$confirm('此操作将永久删除, 是否继续?', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
delObj(this.currentRow.id).then(response => {
if (response.success) {
this.$notify({
title: '提示',
message: '操作成功',
type: 'success',
duration: 2000
})
this.getList()
}
})
})
},
// 打开列设置，需要和module一起使用
columnsSettings() {
this.$refs.SvSearchTable.columnsSettings()
},
// 重置列设置
resetColumnSettings() {
this.$refs.SvSearchTable.resetColumnSettings()
},
// 导出全部数据，需要传maxExportRows，默认是10000条，如果数据过多建议后台导出。
// 默认用的是分页方法，如果有自定义导出方法用exportApi传入
exportExcel() {
this.$refs.SvSearchTable.exportExcel()
},
// 导出当前页数据
exportCurrentPage() {
this.$refs.SvSearchTable.exportCurrentPage()
}
}
}
</script>import request from '@/utils/request'
export
function page(query) {
return request({
url: '/api/server/bdBacklogInfo/page',
method: 'get',
params: query
})
}
export
function customPage(query, queryList) {
return request({
url: '/api/server/bdBacklogInfo/customPage',
method: 'post',
params: query,
data: queryList
})
}
export
function addObj(obj) {
return request({
url: '/api/server/bdBacklogInfo',
method: 'post',
data: obj
})
}
export
function getObj(id) {
return request({
url: '/api/server/bdBacklogInfo/' + id,
method: 'get'
})
}
export
function delObj(id) {
return request({
url: '/api/server/bdBacklogInfo/' + id,
method: 'delete'
})
}
export
function putObj(id, obj) {
return request({
url: '/api/server/bdBacklogInfo/' + id,
method: 'put',
data: obj
})
}
export
function efficient(id, obj) {
return request({
url: '/api/server/bdBacklogInfo/efficient/' + id,
method: 'put',
data: obj
})
}
export
function invalid(id, obj) {
return request({
url: '/api/server/bdBacklogInfo/invalid/' + id,
method: 'put',
data: obj
})
}
哪里做了增删改查的那些操作，讲一下
扫一扫
718
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
