@@ -1,227 +1,343 @@
< template >
< div class = "app-container" >
< div class = "app-container" >
<!-- 搜索工作栏 -- >
< SearchBar
:formConfigs = "searchBarFormConfig"
ref = "search-bar"
@headBtnClick ="handleSearchBarBtnClick" / >
<!-- 搜索工作栏 -- >
< el-form :model = "queryParams" ref = "queryForm" size = "small" :inline = "true" v-show = "showSearch" label-width="68px" >
< el -form -item >
< el-button type = "primary" icon = "el-icon-search" @click ="handleQuery" > 搜索 < / el -button >
< el-button icon = "el-icon-refresh" @click ="resetQuery" > 重置 < / el -button >
< / el-form-item >
< / el-form >
<!-- 列表 -- >
< base-table
:table-props = "tableProps"
:page = "queryParams.pageNo"
:limit = "queryParams.pageSize"
:table-data = "list"
@ emit -fun = " handleEmitFun " >
< method-btn
v-if = "tableBtn.length"
slot = "handleBtn"
label = "操作"
fixed = "right"
:method-list = "tableBtn"
@clickBtn ="handleTableBtnClick" / >
< / base-table >
<!-- 操作工具栏 -- >
< 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:quality-inspection-box-btn:create']" > 新增 < / el -button >
< / el-col >
< el-col :span = "1.5" >
< el-button type = "warning" plain icon = "el-icon-download" size = "mini" @click ="handleExport" :loading = "exportLoading"
v-hasPermi = "['base:quality-inspection-box-btn:export']" > 导出 < / el -button >
< / el-col >
< right-toolbar :showSearch.sync = "showSearch" @queryTable ="getList" > < / right -toolbar >
< / el-row >
<!-- 分页组件 -- >
< pagination
v-show = "total > 0"
:total = "total "
:page.sync = "queryParams.pageNo"
:limit.sync = "queryParams.pageSize"
@pagination ="getList" / >
<!-- 列表 -- >
< el-table v-loading = "loading" :data="list" >
< el -table -column label = "ID" align = "center" prop = "id" / >
< el-table-column label = "该按钮绑定的检测内容id" align = "center" prop = "inspectionDetId" / >
< el-table-column label = "检测内容（ ， ， ） align = "center" prop = "inspectionDetContent" / >
< el-table-column label = "按钮盒所在产线id" align = "center" prop = "productionId" / >
< el-table-column label = "按钮盒所在工段id" align = "center" prop = "sectionId" / >
< el-table-column label = "按钮盒模式" align = "center" prop = "model" / >
< el-table-column label = "按钮值" align = "center" prop = "keyValue" / >
< el-table-column label = "创建时间" align = "center" prop = "createTime" width = "180" >
< template v-slot = "scope" >
< span > { { parseTime ( scope . row . createTime ) } } < / span >
< / template >
< / el-table-column >
< el-table-column label = "操作" align = "center" class -name = " small -padding fixed -width " >
< template v-slot = "scope" >
< el -button size = "mini" type = "text" icon = "el-icon-edit" @click ="handleUpdate(scope.row)"
v-hasPermi = "['base:quality-inspection-box-btn:update']" > 修改 < / el -button >
< el-button size = "mini" type = "text" icon = "el-icon-delete" @click ="handleDelete(scope.row)"
v-hasPermi = "['base:quality-inspection-box-btn:delete']" > 删除 < / el -button >
< / template >
< / el-table-column >
< / el-table >
<!-- 分页组件 -- >
< pagination v-show = "total > 0" :total="total" :page.sync="queryParams.pageNo" :limit.sync="queryParams.pageSize"
@pagination ="getList" />
< ! - - 对话框 ( 添加 / 修改 ) - - >
< el-dialog :title = "title" :visible.sync = "open" width = "500px" v-dialogDrag append -to -body >
< el-form ref = "form" :model = "form" :rules = "rules" label -width = " 80px " >
< el-form-item label = "该按钮绑定的检测内容id" prop = "inspectionDetId" >
< el-input v-model = "form.inspectionDetId" placeholder="请输入该按钮绑定的检测内容id" / >
< / el-form-item >
< el-form-item label = "检测内容（ ， ， ） prop = "inspectionDetContent" >
< el-input v-model = "form.inspectionDetContent" type="textarea" placeholder="请输入内容" / >
< / el-form-item >
< el-form-item label = "按钮盒所在产线id" prop = "productionId" >
< el-input v-model = "form.productionId" placeholder="请输入按钮盒所在产线id" / >
< / el-form-item >
< el-form-item label = "按钮盒所在工段id" prop = "sectionId" >
< el-input v-model = "form.sectionId" placeholder="请输入按钮盒所在工段id" / >
< / el-form-item >
< el-form-item label = "按钮盒模式" prop = "model" >
< el-input v-model = "form.model" placeholder="请输入按钮盒模式" / >
< / el-form-item >
< el-form-item label = "按钮值" prop = "keyValue" >
< el-input v-model = "form.keyValue" placeholder="请输入按钮值" / >
< / 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 >
<!-- 对话框 ( 添加 / 修改 ) -- >
< base-dialog
:dialogTitle = "title"
:dialogVisible = "open"
width = "50%"
@close ="cancel"
@cancel ="cancel"
@confirm ="submitForm" >
< DialogForm
v-if = "open"
ref = "form"
:dataForm = "form"
: rows = "[
[
{
select: true,
label: '产线',
url: '/base/production-line/listAll',
prop: 'productionId',
rules: [{ required: true, message: '不能为空', trigger: 'blur' }],
bind: {
filterable: true,
},
},
],
[
{
select: true,
label: '工段',
url: '/base/workshop-section/listAll',
prop: 'sectionId',
rules: [{ required: true, message: '不能为空', trigger: 'blur' }],
},
// {
// select: true,
// url: '', //
// label: '检测内容',
// prop: 'inspectionDetContent',
// rules: [{ required: true, message: '不能为空', trigger: 'blur' }],
// },
],
[
{
input: true,
label: '按钮盒识别码',
prop: 'buttonId',
rules: [
{
type: 'number',
message: '请输入数字',
trigger: 'blur',
transform: (val) => Number(val),
},
],
},
],
[{ input: true, label: '按钮盒模式', prop: 'model' }],
[
{
input: true,
label: '按钮值',
prop: 'keyValue',
rules: [
{
type: 'number',
message: '请输入100以内的数字',
trigger: 'blur',
transform: (val) => Number(val) <= 100 && Number(val),
},
],
bind: { type: 'number', min: 0, max: 100 },
},
],
[
{
textarea: true,
label: '检测内容',
prop: 'inspectionDetContent',
rules: [{ required: true, message: '不能为空', trigger: 'blur' }],
},
],
]" / >
< / base-dialog >
< / div >
< / template >
< script >
import { createQualityInspectionBoxBtn , updateQualityInspectionBoxBtn , deleteQualityInspectionBoxBtn , getQualityInspectionBoxBtn , getQualityInspectionBoxBtnPage , exportQualityInspectionBoxBtnExcel } from "@/api/base/qualityInspectionBoxBtn" ;
import {
createQualityInspectionBoxBtn ,
updateQualityInspectionBoxBtn ,
deleteQualityInspectionBoxBtn ,
getQualityInspectionBoxBtn ,
getQualityInspectionBoxBtnPage ,
exportQualityInspectionBoxBtnExcel ,
} from '@/api/base/qualityInspectionBoxBtn' ;
import basicPageMixin from '../../mixin/basicPageMixin' ;
import moment from 'moment' ;
export default {
name : " QualityInspectionBoxBtn" ,
components : {
} ,
data ( ) {
return {
// 遮罩层
loading : true ,
// 导出遮罩层
exportLoading : false ,
// 显示搜索条件
showSearch : true ,
// 总条数
total : 0 ,
// 安灯按钮16键对应列表
list : [ ] ,
// 弹出层标题
title : "" ,
// 是否显示弹出层
open : false ,
// 查询参数
queryParams : {
pageNo : 1 ,
pageSize : 10 ,
inspectionDetContent : null ,
} ,
// 表单参数
form : { } ,
// 表单校验
rules : {
productionId : [ { required : true , message : "按钮盒所在产线id不能为空" , trigger : "blur" } ] ,
sectionId : [ { required : true , message : "按钮盒所在工段id不能为空" , trigger : "blur" } ] ,
}
} ;
} ,
created ( ) {
this . getList ( ) ;
} ,
methods : {
/** 查询列表 */
getList ( ) {
this . loading = true ;
// 执行查询
getQualityInspectionBoxBtnPage ( this . queryParams ) . then ( response => {
this . list = response . data . list ;
this . total = response . data . total ;
this . loading = false ;
} ) ;
} ,
/** 取消按钮 */
cancel ( ) {
this . open = false ;
this . reset ( ) ;
} ,
/** 表单重置 */
reset ( ) {
this . form = {
id : undefined ,
inspectionDetId : undefined ,
inspectionDetContent : undefined ,
productionId : undefined ,
sectionId : undefined ,
model : undefined ,
keyValue : undefined ,
} ;
this . resetForm ( "form" ) ;
} ,
/** 搜索按钮操作 */
handleQuery ( ) {
this . queryParams . pageNo = 1 ;
this . getList ( ) ;
} ,
/** 重置按钮操作 */
resetQuery ( ) {
this . resetForm ( "queryForm" ) ;
this . handleQuery ( ) ;
} ,
/** 新增按钮操作 */
handleAdd ( ) {
this . reset ( ) ;
this . open = true ;
this . title = "添加安灯按钮16键对应" ;
} ,
/** 修改按钮操作 */
handleUpdate ( row ) {
this . reset ( ) ;
const id = row . id ;
getQualityInspectionBoxBtn ( id ) . then ( response => {
this . form = response . data ;
this . open = true ;
this . title = "修改安灯按钮16键对应" ;
} ) ;
} ,
/** 提交按钮 */
submitForm ( ) {
this . $refs [ "form" ] . validate ( valid => {
if ( ! valid ) {
return ;
}
// 修改的提交
if ( this . form . id != null ) {
updateQualityInspectionBoxBtn ( this . form ) . then ( response => {
this . $modal . msgSuccess ( "修改成功" ) ;
this . open = false ;
this . getList ( ) ;
} ) ;
return ;
}
// 添加的提交
createQualityInspectionBoxBtn ( this . form ) . then ( response => {
this . $modal . msgSuccess ( "新增成功" ) ;
this . open = false ;
this . getList ( ) ;
} ) ;
} ) ;
} ,
/** 删除按钮操作 */
handleDelete ( row ) {
const id = row . id ;
this . $modal . confirm ( '是否确认删除安灯按钮16键对应编号为"' + id + '"的数据项?' ) . then ( function ( ) {
return del ete QualityInspectionBoxBtn( id ) ;
} ) . then ( ( ) => {
this . getList ( ) ;
this . $modal . msgSuccess ( "删除成功" ) ;
} ) . catch ( ( ) => { } ) ;
} ,
/** 导出按钮操作 */
handleExpor t ( ) {
// 处理查询参数
let params = { ... this . queryParams } ;
params . pageNo = undefined ;
params . pageSize = undefined ;
this . $modal . confirm ( '是否确认导出所有安灯按钮16键对应数据项?' ) . then ( ( ) => {
this . exportLoading = true ;
return exportQualityInspectionBoxBtnExcel ( params ) ;
} ) . then ( response => {
this . $download . excel ( response , '安灯按钮16键对应.xls' ) ;
this . exportLoading = false ;
} ) . catch ( ( ) => { } ) ;
}
}
name : ' QualityInspectionBoxBtn' ,
mixins : [ basicPageMixin ] ,
components : { } ,
data ( ) {
return {
searchBarFormConfig : [
{
type : 'input' ,
label : '检查内容' ,
placeholder : '请输入检查内容' ,
param : 'inspectionDetContent' ,
} ,
{
type : 'button' ,
btnName : '查询' ,
name : 'search' ,
color : 'primary' ,
} ,
{
type : 'separate' ,
} ,
{
type : this . $auth . hasPermi ( 'base:quality-inspection-box-btn:create' )
? 'button'
: '' ,
btnName : '新增' ,
name : 'add' ,
plain : true ,
color : 'success' ,
} ,
] ,
tableBtn : [
this . $auth . hasPermi ( 'base:quality-inspection-box-btn:update' )
? {
type : 'edit' ,
btnName : '修改' ,
}
: undefined ,
this . $auth . hasPermi ( 'base:quality-inspection-box-btn:delete' )
? {
type : 'delete' ,
btnName : '删除' ,
}
: undefined ,
] . filter ( ( v ) => v ) ,
tableProps : [
{
prop : 'createTime' ,
label : '添加时间' ,
fixed : true ,
width : 180 ,
filter : ( val ) => moment ( val ) . format ( 'yyyy-MM-DD HH:mm:ss' ) ,
} ,
{
width : 128 ,
prop : 'productionName' ,
label : '产线' ,
align : 'center' ,
} ,
{
width : 128 ,
prop : 'sectionName' ,
label : '工段' ,
align : 'center' ,
} ,
{
width : 128 ,
prop : 'inspectionDetContent' ,
label : '检测内容' ,
align : 'center' ,
} ,
{
width : 160 ,
prop : 'buttonId' ,
label : '按钮盒识别码' ,
align : 'center' ,
} ,
// {
// width: 256,
// prop: 'productionId',
// label: '按钮盒所在产线ID',
// align: 'center',
// },
// {
// width: 256,
// prop: 'sectionId',
// label: '按钮盒所在工段ID',
// align: 'center',
// },
{ width : 90 , prop : 'keyValue' , label : '按钮值' , align : 'center' } ,
{ width : 128 , prop : 'model' , label : '按钮盒模式' , align : 'center' } ,
] ,
// 查询参数
queryParams : {
pageNo : 1 ,
pageSize : 10 ,
inspectionDetContent : null ,
} ,
// 搜索框需要的 keys, 与上面 queryParams 的除 pageNo, pageSize 之外的 key 一一对应
searchBarKeys : [ 'inspectionDetContent' ] ,
form : {
id : undefined ,
inspectionDetId : undefined ,
inspectionDetContent : undefined ,
productionId : undefined ,
sectionId : undefined ,
model : undefined ,
keyValue : undefined ,
} ,
} ;
} ,
created ( ) {
this . getList ( ) ;
} ,
methods : {
/** 查询列表 */
getList ( ) {
this . loading = true ;
// 执行查询
g etQualityInspectionBoxBtnPage ( this . queryParams ) . then ( ( response ) => {
this . list = response . data . list ;
this . total = response . data . total ;
this . loading = false ;
} ) ;
} ,
/** 表单重置 */
rese t ( ) {
this . form = {
id : undefined ,
inspectionDetId : undefined ,
inspectionDetContent : undefined ,
productionId : undefined ,
sectionId : undefined ,
model : undefined ,
keyValue : undefined ,
} ;
this . resetForm ( 'form' ) ;
} ,
/** 新增按钮操作 */
handleAdd ( ) {
this . reset ( ) ;
this . open = true ;
this . title = '添加安灯按钮16键对应' ;
} ,
/** 修改按钮操作 */
handleUpdate ( row ) {
this . reset ( ) ;
const id = row . id ;
getQualityInspectionBoxBtn ( id ) . then ( ( response ) => {
this . form = response . data ;
this . open = true ;
this . title = '修改安灯按钮16键对应' ;
} ) ;
} ,
/** 提交按钮 */
submitForm ( ) {
this . $refs [ 'form' ] . validate ( ( valid ) => {
if ( ! valid ) {
return ;
}
// 修改的提交
if ( this . form . id != null ) {
updateQualityInspectionBoxBtn ( this . form ) . then ( ( response ) => {
this . $modal . msgSuccess ( '修改成功' ) ;
this . open = false ;
this . getList ( ) ;
} ) ;
return ;
}
// 添加的提交
createQualityInspectionBoxBtn ( this . form ) . then ( ( response ) => {
this . $modal . msgSuccess ( '新增成功' ) ;
this . open = false ;
this . getList ( ) ;
} ) ;
} ) ;
} ,
/** 删除按钮操作 */
handleDelete ( row ) {
const id = row . id ;
this . $modal
. confirm ( '是否确认删除安灯按钮16键对应编号为"' + id + '"的数据项?' )
. then ( function ( ) {
return deleteQualityInspectionBoxBtn ( id ) ;
} )
. then ( ( ) => {
this . getList ( ) ;
this . $modal . msgSuccess ( '删除成功' ) ;
} )
. catch ( ( ) => { } ) ;
} ,
/** 导出按钮操作 */
handleExport ( ) {
// 处理查询参数
let params = { ... this . queryParams } ;
params . pageNo = undefined ;
params . pageSize = undefined ;
this . $modal
. confirm ( '是否确认导出所有安灯按钮16键对应数据项?' )
. then ( ( ) => {
this . exportLoading = true ;
return exportQualityInspectionBoxBtnExcel ( params ) ;
} )
. then ( ( response ) => {
this . $download . excel ( response , '安灯按钮16键对应.xls' ) ;
this . exportLoading = false ;
} )
. catch ( ( ) => { } ) ;
} ,
} ,
} ;
< / script >