You cannot select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

348 lines
12 KiB
Vue

This file contains ambiguous Unicode characters!

This file contains ambiguous Unicode characters that may be confused with others in your current locale. If your use case is intentional and legitimate, you can safely ignore this warning. Use the Escape button to highlight these characters.

<template>
<div class="app-container">
<el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="90px">
<el-form-item label="自定义功能" prop="customFunction">
<el-input
v-model="queryParams.customFunction"
placeholder="请输入自定义功能"
clearable
@keyup.enter.native="handleQuery"
/>
</el-form-item>
<el-form-item label="自定义编号" prop="customCode">
<el-input
v-model="queryParams.customCode"
placeholder="请输入自定义编号"
clearable
@keyup.enter.native="handleQuery"
/>
</el-form-item>
<el-form-item>
<el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
<el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
</el-form-item>
</el-form>
<el-row :gutter="10" class="mb8">
<el-col :span="1.5">
<el-button
type="primary"
plain
icon="el-icon-plus"
size="mini"
@click="handleAdd"
v-hasPermi="['base:customData:add']"
>新增
</el-button>
</el-col>
<el-col :span="1.5">
<el-button
type="success"
plain
icon="el-icon-edit"
size="mini"
:disabled="single"
@click="handleUpdate"
v-hasPermi="['base:customData:edit']"
>修改
</el-button>
</el-col>
<el-col :span="1.5">
<el-button
type="danger"
plain
icon="el-icon-delete"
size="mini"
:disabled="multiple"
@click="handleDelete"
v-hasPermi="['base:customData:remove']"
>删除
</el-button>
</el-col>
<el-col :span="1.5">
<el-button
type="warning"
plain
icon="el-icon-download"
size="mini"
@click="handleExport"
v-hasPermi="['base:customData:export']"
>导出
</el-button>
</el-col>
<right-toolbar :showSearch.sync="showSearch" @queryTable="getList" :columns="columns"></right-toolbar>
</el-row>
<el-table v-loading="loading" :data="customDataList" @selection-change="handleSelectionChange">
<el-table-column type="selection" width="55" align="center"/>
<el-table-column label="主键标识" align="center" prop="objId" v-if="columns[0].visible"/>
<el-table-column label="自定义数据类型" align="center" prop="customType" v-if="columns[1].visible"/>
<el-table-column label="自定义功能" align="center" prop="customFunction" v-if="columns[2].visible"/>
<el-table-column label="自定义编号" align="center" prop="customCode" v-if="columns[3].visible"/>
<el-table-column label="自定义数据" align="center" prop="customData" v-if="columns[4].visible"
:show-overflow-tooltip="true"
/>
<el-table-column label="排序" align="center" prop="customSort" v-if="columns[5].visible"/>
<el-table-column label="备注" align="center" prop="remark" v-if="columns[6].visible"/>
<el-table-column label="是否启用" align="center" prop="isFlag" v-if="columns[7].visible">
<template slot-scope="scope">
<dict-tag :options="dict.type.is_flag" :value="scope.row.isFlag"/>
</template>
</el-table-column>
<el-table-column label="创建人" align="center" prop="createdBy" v-if="columns[8].visible"/>
<el-table-column label="创建时间" align="center" prop="createdTime" width="180" v-if="columns[9].visible">
<template slot-scope="scope">
<span>{{ parseTime(scope.row.createdTime, '{y}-{m}-{d} {h}:{i}:{s}') }}</span>
</template>
</el-table-column>
<el-table-column label="更新人" align="center" prop="updatedBy" v-if="columns[10].visible"/>
<el-table-column label="更新时间" align="center" prop="updatedTime" width="180" v-if="columns[11].visible">
<template slot-scope="scope">
<span>{{ parseTime(scope.row.updatedTime, '{y}-{m}-{d} {h}:{i}:{s}') }}</span>
</template>
</el-table-column>
<el-table-column label="操作" align="center" class-name="small-padding fixed-width">
<template slot-scope="scope">
<el-button
size="mini"
type="text"
icon="el-icon-edit"
@click="handleUpdate(scope.row)"
v-hasPermi="['base:customData:edit']"
>修改
</el-button>
<!-- <el-button-->
<!-- size="mini"-->
<!-- type="text"-->
<!-- icon="el-icon-delete"-->
<!-- @click="handleDelete(scope.row)"-->
<!-- v-hasPermi="['base:customData:remove']"-->
<!-- >删除-->
<!-- </el-button>-->
</template>
</el-table-column>
</el-table>
<pagination
v-show="total>0"
:total="total"
:page.sync="queryParams.pageNum"
:limit.sync="queryParams.pageSize"
@pagination="getList"
/>
<!-- 添加或修改自定义数据维护对话框 -->
<el-dialog :title="title" :visible.sync="open" width="500px" append-to-body>
<el-form ref="form" :model="form" :rules="rules" label-width="100px">
<el-form-item label="自定义功能" prop="customFunction">
<el-input v-model="form.customFunction" placeholder="请输入自定义功能" :disabled="editDisabled"/>
</el-form-item>
<el-form-item label="自定义编号" prop="customCode">
<el-input v-model="form.customCode" placeholder="请输入自定义编号" />
</el-form-item>
<el-form-item label="自定义数据" prop="customData">
<el-input v-model="form.customData" type="textarea" placeholder="请输入内容"/>
</el-form-item>
<el-form-item label="排序" prop="customSort">
<el-input v-model="form.customSort" placeholder="请输入排序"/>
</el-form-item>
<el-form-item label="备注" prop="remark">
<el-input v-model="form.remark" placeholder="请输入备注"/>
</el-form-item>
<el-form-item label="是否启用" prop="isFlag">
<el-radio-group v-model="form.isFlag">
<el-radio
v-for="dict in dict.type.is_flag"
:key="dict.value"
:label="parseInt(dict.value)"
>{{ dict.label }}
</el-radio>
</el-radio-group>
</el-form-item>
</el-form>
<div slot="footer" class="dialog-footer">
<el-button type="primary" @click="submitForm">确 定</el-button>
<el-button @click="cancel"> </el-button>
</div>
</el-dialog>
</div>
</template>
<script>
import { listCustomData, getCustomData, delCustomData, addCustomData, updateCustomData } from '@/api/base/customData'
export default {
name: 'CustomData',
dicts: ['is_flag'],
data() {
return {
// 遮罩层
loading: true,
// 选中数组
ids: [],
// 非单个禁用
single: true,
// 非多个禁用
multiple: true,
// 显示搜索条件
showSearch: true,
// 不可修改列
editDisabled: false,
// 总条数
total: 0,
// 自定义数据维护表格数据
customDataList: [],
// 弹出层标题
title: '',
// 是否显示弹出层
open: false,
// 查询参数
queryParams: {
pageNum: 1,
pageSize: 10,
customType: 1,
customFunction: null,
customCode: null,
customData: null,
customSort: null,
isFlag: null,
createdBy: null,
createdTime: null,
updatedBy: null,
updatedTime: null
},
// 表单参数
form: {},
// 表单校验
rules: {},
columns: [
{ key: 0, label: `主键标识`, visible: false },
{ key: 1, label: `自定义数据类型`, visible: false },
{ key: 2, label: `自定义功能`, visible: true },
{ key: 3, label: `自定义编号`, visible: true },
{ key: 4, label: `自定义数据`, visible: true },
{ key: 5, label: `排序`, visible: true },
{ key: 6, label: `备注`, visible: true },
{ key: 7, label: `是否启用`, visible: true },
{ key: 8, label: `创建人`, visible: false },
{ key: 9, label: `创建时间`, visible: false },
{ key: 10, label: `更新人`, visible: false },
{ key: 11, label: `更新时间`, visible: true }
]
}
},
created() {
this.getList()
},
methods: {
/** 查询自定义数据维护列表 */
getList() {
this.loading = true
this.editDisabled = false
listCustomData(this.queryParams).then(response => {
this.customDataList = response.rows
this.total = response.total
this.loading = false
})
},
// 取消按钮
cancel() {
this.open = false
this.editDisabled = false
this.reset()
},
// 表单重置
reset() {
this.form = {
objId: null,
customType: 1,
customFunction: null,
customCode: null,
customData: null,
customSort: null,
remark: null,
isFlag: 0,
createdBy: null,
createdTime: null,
updatedBy: null,
updatedTime: null
}
this.editDisabled = false
this.resetForm('form')
},
/** 搜索按钮操作 */
handleQuery() {
this.queryParams.pageNum = 1
this.getList()
},
/** 重置按钮操作 */
resetQuery() {
this.resetForm('queryForm')
this.handleQuery()
},
// 多选框选中数据
handleSelectionChange(selection) {
this.ids = selection.map(item => item.objId)
this.single = selection.length !== 1
this.multiple = !selection.length
},
/** 新增按钮操作 */
handleAdd() {
this.reset()
this.open = true
this.title = '添加自定义数据维护'
},
/** 修改按钮操作 */
handleUpdate(row) {
this.reset()
const objId = row.objId || this.ids
getCustomData(objId).then(response => {
this.form = response.data
this.editDisabled = true
this.open = true
this.title = '修改自定义数据维护'
})
},
/** 提交按钮 */
submitForm() {
this.$refs['form'].validate(valid => {
if (valid) {
//自定义数据类型0-MES数据1-看板数据2-大屏数据)
this.form.customType = 1
if (this.form.objId != null) {
updateCustomData(this.form).then(response => {
this.$modal.msgSuccess('修改成功')
this.open = false
this.getList()
})
} else {
addCustomData(this.form).then(response => {
this.$modal.msgSuccess('新增成功')
this.open = false
this.getList()
})
}
}
})
},
/** 删除按钮操作 */
handleDelete(row) {
const objIds = row.objId || this.ids
this.$modal.confirm('是否确认删除自定义数据维护编号为"' + objIds + '"的数据项?').then(function() {
return delCustomData(objIds)
}).then(() => {
this.getList()
this.$modal.msgSuccess('删除成功')
}).catch(() => {
})
},
/** 导出按钮操作 */
handleExport() {
this.download('base/customData/export', {
...this.queryParams
}, `customData_${new Date().getTime()}.xlsx`)
}
}
}
</script>