382 lines
11 KiB
Vue
382 lines
11 KiB
Vue
<template>
|
|
<div class="mod-config">
|
|
<el-form :inline="true" :model="dataForm" @keyup.enter.native="currentChangeHandle(1)" class="blueTip" size="small">
|
|
<el-form-item>
|
|
{{ $t('pl.title') }}
|
|
</el-form-item>
|
|
<el-form-item>
|
|
<el-select v-model="dataForm.lineId" :placeholder="$t('pl.title')" clearable filterable>
|
|
<el-option v-for="pl in plList" :key="pl.value" :value="pl.value" :label="pl.label" />
|
|
</el-select>
|
|
</el-form-item>
|
|
<el-form-item>
|
|
{{ $t('inspect.det') }}
|
|
</el-form-item>
|
|
<el-form-item>
|
|
<el-input v-model="dataForm.key" :placeholder="$t('inspect.det')" clearable></el-input>
|
|
</el-form-item>
|
|
<el-form-item>
|
|
<el-button class="buttonColor" @click="currentChangeHandle(1)">{{ $t('query') }}</el-button>
|
|
<!-- <el-button v-if="$hasPermission('monitoring:qualityinspectionrecord:save')" type="primary" @click="addOrUpdateHandle()">{{ $t('add') }}</el-button> -->
|
|
</el-form-item>
|
|
</el-form>
|
|
|
|
<base-table
|
|
:top-btn-config="topBtnConfig"
|
|
:page="pageIndex"
|
|
:size="pageSize"
|
|
:data="dataList"
|
|
:table-head-configs="tableConfigs"
|
|
:max-height="calcMaxHeight(8)"
|
|
@operate-event="handleOperations"
|
|
@refreshDataList="getDataList"
|
|
@clickTopBtn="clickTopBtn" />
|
|
|
|
<el-pagination
|
|
@size-change="sizeChangeHandle"
|
|
@current-change="currentChangeHandle"
|
|
:current-page="pageIndex"
|
|
:page-sizes="[10, 20, 50, 100]"
|
|
:page-size="pageSize"
|
|
:total="totalPage"
|
|
layout="total, sizes, prev, pager, next, jumper">
|
|
</el-pagination>
|
|
|
|
<!-- 弹窗, 新增 / 修改 -->
|
|
<add-or-update
|
|
v-if="addOrUpdateVisible"
|
|
ref="addOrUpdate"
|
|
:configs="addOrUpdateConfigs"
|
|
@refreshDataList="addSuccess"
|
|
@destory-dialog="handleDestroyDialog"
|
|
@select-change="handleSelectChange" />
|
|
</div>
|
|
</template>
|
|
|
|
<script>
|
|
import { calcMaxHeight } from '@/utils'
|
|
import { timeFilter } from '@/utils/filters'
|
|
import AddOrUpdate from '@/components/base-dialog/addOrUpdate'
|
|
// import AddOrUpdate from './qualityInspectionRecord-add-or-update'
|
|
import i18n from '@/i18n'
|
|
import BaseTable from '@/components/base-table'
|
|
import TableOperateComponent from '@/components/base-table/components/operationComponent'
|
|
// import TableTextComponent from '@/components/base-table/components/detailComponent'
|
|
const topBtnConfig = [
|
|
{
|
|
type: 'add',
|
|
btnName: i18n.t('add')
|
|
}
|
|
]
|
|
const tableConfigs = [
|
|
{
|
|
type: 'index',
|
|
width: 100,
|
|
name: i18n.t('index')
|
|
},
|
|
{ prop: 'createTime', name: i18n.t('createTime'), filter: timeFilter },
|
|
{
|
|
prop: 'inspectionDetContent',
|
|
name: i18n.t('inspect.det')
|
|
},
|
|
{ prop: 'checkTime', name: i18n.t('inspect.time'), filter: timeFilter },
|
|
{ prop: 'productionName', name: i18n.t('pl.title') },
|
|
{ prop: 'sectionName', name: i18n.t('ws.title') },
|
|
// { prop: 'productionId', name: i18n.t('pl.id') },
|
|
// { prop: 'sectionId', name: i18n.t('ws.id') },
|
|
{ prop: 'checkPerson', name: i18n.t('inspect.people') },
|
|
{ prop: 'source', name: i18n.t('source'), filter: (val) => ({ 1: i18n.t('manual'), 2: i18n.t('auto') }[val]) },
|
|
{ prop: 'explainText', name: i18n.t('desc') },
|
|
{ prop: 'remark', name: i18n.t('remark') },
|
|
{ prop: 'operations', name: i18n.t('handle'), fixed: 'right', width: 180, subcomponent: TableOperateComponent, options: ['edit', 'delete'] }
|
|
]
|
|
|
|
const addOrUpdateConfigs = {
|
|
type: 'dialog',
|
|
infoUrl: '/monitoring/qualityInspectionRecord',
|
|
fields: [
|
|
{ name: 'checkTime', required: true, label: i18n.t('inspect.time'), type: 'date', props: { style: 'width: 100%', type: 'datetime' }, placeholder: i18n.t('hints.checktime') },
|
|
// {
|
|
// name: 'checkTime',
|
|
// required: true,
|
|
// label: i18n.t('inspect.time'),
|
|
// type: 'date',
|
|
// props: {
|
|
// 'type': 'date', // element-ui 的配置
|
|
// 'placeholder': i18n.t('hints.date'),
|
|
// 'value-format': 'yyyy-MM-ddTHH:mm:ss',
|
|
// 'style': {
|
|
// width: '100%'
|
|
// }
|
|
// },
|
|
// placeholder: i18n.t('hints.checktime')
|
|
// },
|
|
{ name: 'productionId', required: true, label: i18n.t('pl.title'), type: 'select', options: [] },
|
|
{ name: 'sectionId', required: true, label: i18n.t('ws.title'), type: 'select', options: [], isDisabled: true },
|
|
{
|
|
name: 'source',
|
|
label: i18n.t('source'),
|
|
type: 'select',
|
|
options: [
|
|
{ value: 1, label: i18n.t('manual'), default: true },
|
|
{ value: 2, label: i18n.t('auto') }
|
|
]
|
|
},
|
|
{ name: 'inspectionDetId', required: true, label: i18n.t('inspect.det'), type: 'select', options: [] },
|
|
{ name: 'checkPerson', label: i18n.t('inspect.people') },
|
|
{ name: 'explainText', label: i18n.t('desc') },
|
|
'remark'
|
|
],
|
|
operations: [
|
|
{ name: 'cancel', showAlways: true },
|
|
{ name: 'save', url: '/monitoring/qualityInspectionRecord', permission: 'monitoring:qualityinspectionrecord:save', showOnEdit: false },
|
|
{ name: 'update', url: '/monitoring/qualityInspectionRecord', permission: 'monitoring:qualityinspectionrecord:update', showOnEdit: true }
|
|
]
|
|
}
|
|
|
|
export default {
|
|
data() {
|
|
return {
|
|
topBtnConfig,
|
|
calcMaxHeight,
|
|
addOrUpdateConfigs,
|
|
tableConfigs,
|
|
dataForm: {
|
|
key: '',
|
|
lineId: ''
|
|
},
|
|
plList: [],
|
|
dataList: [],
|
|
pageIndex: 1,
|
|
pageSize: 10,
|
|
totalPage: 0,
|
|
dataListLoading: false,
|
|
dataListSelections: [],
|
|
addOrUpdateVisible: false
|
|
}
|
|
},
|
|
components: {
|
|
AddOrUpdate,
|
|
BaseTable
|
|
},
|
|
activated() {
|
|
this.getDataList()
|
|
this.getInspectionDet()
|
|
this.getWorkSections()
|
|
this.getProductLines()
|
|
},
|
|
methods: {
|
|
// destroy dialog
|
|
handleDestroyDialog() {
|
|
this.$set(this.addOrUpdateConfigs.fields[2], 'isDisabled', true)
|
|
setTimeout(() => {
|
|
this.addOrUpdateVisible = false
|
|
}, /** after dialog animated */ 200)
|
|
},
|
|
// handle
|
|
async handleSelectChange({ name, id }) {
|
|
// console.log('this',this)
|
|
if (name === 'productionId') {
|
|
// 如果选择了产线，就依据此更新工单的选项
|
|
if (id) {
|
|
this.$set(this.addOrUpdateConfigs.fields[2], 'isDisabled', false)
|
|
} else {
|
|
this.$set(this.addOrUpdateConfigs.fields[2], 'isDisabled', true)
|
|
}
|
|
await this.getWorkSections(id)
|
|
}
|
|
if (name === 'sectionId') {
|
|
// 如果选择了产线，就依据此更新工单的选项
|
|
// console.log('nihao',id);
|
|
// console.log('nihao2',this.addOrUpdateConfigs.fields[1].options == []);
|
|
// console.log('nihao2',this.addOrUpdateConfigs.fields[1].options );
|
|
}
|
|
},
|
|
// 获取检测内容
|
|
getInspectionDet() {
|
|
this.$http({
|
|
url: this.$http.adornUrl('/monitoring/qualityInspectionDet/page'),
|
|
method: 'get',
|
|
params: this.$http.adornParams({
|
|
// page: this.pageIndex,
|
|
// limit: this.pageSize,
|
|
// key: this.dataForm.key
|
|
page: 1,
|
|
limit: 9999999
|
|
})
|
|
}).then(({ data: res }) => {
|
|
console.log('insdet:', res)
|
|
const insDetOpt = this.addOrUpdateConfigs.fields.find((item) => item.name === 'inspectionDetId')
|
|
if (insDetOpt) {
|
|
insDetOpt.options = res.data.list.map((item) => ({ value: item.id, label: item.content })) || []
|
|
}
|
|
})
|
|
},
|
|
// 获取产线
|
|
getProductLines() {
|
|
this.$http({
|
|
url: this.$http.adornUrl('/monitoring/productionLine/list'),
|
|
method: 'get'
|
|
}).then(({ data: res }) => {
|
|
const plOpt = this.addOrUpdateConfigs.fields.find((item) => item.name === 'productionId')
|
|
if (plOpt) {
|
|
plOpt.options = res.data.map((item) => ({ value: item.id, label: item.name })) || []
|
|
}
|
|
this.plList = res.data.map((item) => ({ value: item.id, label: item.name })) || []
|
|
})
|
|
},
|
|
// 获取工段
|
|
getWorkSections(lineId) {
|
|
this.$http({
|
|
url: this.$http.adornUrl('/monitoring/workshopSection/page'),
|
|
method: 'get',
|
|
params: lineId
|
|
? this.$http.adornParams({
|
|
// page: this.pageIndex,
|
|
// limit: this.pageSize,
|
|
// key: this.dataForm.key
|
|
lineId
|
|
})
|
|
: {}
|
|
}).then(({ data: res }) => {
|
|
if (this.addOrUpdateVisible) {
|
|
if (res.data.total === 0) {
|
|
this.$message.error(i18n.t('errors.nosection'))
|
|
} else {
|
|
// console.log('da',this.dataForm);
|
|
this.$message.success(i18n.t('errors.numsection', { num: res.data.total }))
|
|
}
|
|
}
|
|
const wsOpt = this.addOrUpdateConfigs.fields.find((item) => item.name === 'sectionId')
|
|
// const wsOpt2 = this.addOrUpdateConfigs.fields.find((item) => item.name === 'productionId')
|
|
// console.log('wsOpt',wsOpt);
|
|
if (wsOpt) {
|
|
wsOpt.options = res.data.list.map((item) => ({ value: item.id, label: item.name })) || []
|
|
}
|
|
})
|
|
},
|
|
addSuccess() {
|
|
this.getDataList()
|
|
this.$set(this.addOrUpdateConfigs.fields[2], 'options', [])
|
|
this.$set(this.addOrUpdateConfigs.fields[2], 'isDisabled', true)
|
|
},
|
|
// 获取数据列表
|
|
getDataList() {
|
|
this.addOrUpdateVisible = false
|
|
this.dataListLoading = true
|
|
|
|
const queryParams = {
|
|
page: this.pageIndex,
|
|
limit: this.pageSize
|
|
}
|
|
|
|
if (this.dataForm.key) {
|
|
queryParams['key'] = this.dataForm.key
|
|
}
|
|
if (this.dataForm.lineId) {
|
|
queryParams['lineId'] = this.dataForm.lineId
|
|
}
|
|
this.$http({
|
|
url: this.$http.adornUrl('/monitoring/qualityInspectionRecord/page'),
|
|
method: 'get',
|
|
params: this.$http.adornParams(queryParams)
|
|
}).then(({ data }) => {
|
|
// console.log('data', data)
|
|
if (data && data.code === 0) {
|
|
this.dataList = data.data.list
|
|
this.totalPage = data.data.total
|
|
} else {
|
|
this.dataList = []
|
|
this.totalPage = 0
|
|
}
|
|
this.dataListLoading = false
|
|
})
|
|
},
|
|
// 每页数
|
|
sizeChangeHandle(val) {
|
|
this.pageSize = val
|
|
this.pageIndex = 1
|
|
this.getDataList()
|
|
},
|
|
// 当前页
|
|
currentChangeHandle(val) {
|
|
this.pageIndex = val
|
|
this.getDataList()
|
|
},
|
|
// 多选
|
|
selectionChangeHandle(val) {
|
|
this.dataListSelections = val
|
|
},
|
|
handleOperations({ type, data: id }) {
|
|
switch (type) {
|
|
case 'edit':
|
|
return this.addOrUpdateHandle(id)
|
|
case 'delete':
|
|
return this.deleteHandle(id)
|
|
}
|
|
},
|
|
// 新增 / 修改
|
|
addOrUpdateHandle(id) {
|
|
this.addOrUpdateVisible = true
|
|
this.$nextTick(() => {
|
|
this.$refs.addOrUpdate.init(id)
|
|
})
|
|
},
|
|
clickTopBtn() {
|
|
this.addOrUpdateVisible = true
|
|
this.$nextTick(() => {
|
|
this.$refs.addOrUpdate.init()
|
|
})
|
|
},
|
|
// 删除
|
|
deleteHandle(id) {
|
|
var ids = id
|
|
? [id]
|
|
: this.dataListSelections.map((item) => {
|
|
return item.id
|
|
})
|
|
this.$confirm(`${i18n.t('prompt.info', { handle: id ? i18n.t('delete').toLowerCase() : i18n.t('deleteBatch').toLowerCase() })}`, i18n.t('prompt.title'), {
|
|
confirmButtonText: i18n.t('confirm'),
|
|
cancelButtonText: i18n.t('cancel'),
|
|
type: 'warning'
|
|
}).then(() => {
|
|
this.$http({
|
|
url: this.$http.adornUrl('/monitoring/qualityInspectionRecord'),
|
|
method: 'delete',
|
|
data: this.$http.adornData(ids, false, 'raw')
|
|
}).then(({ data }) => {
|
|
if (data && data.code === 0) {
|
|
this.$message({
|
|
message: i18n.t('prompt.success'),
|
|
type: 'success',
|
|
duration: 1500,
|
|
onClose: () => {
|
|
this.getDataList()
|
|
}
|
|
})
|
|
} else {
|
|
this.$message.error(data.msg)
|
|
}
|
|
})
|
|
})
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style>
|
|
.blueTip::before {
|
|
display: inline-block;
|
|
content: '';
|
|
width: 4px;
|
|
height: 24px;
|
|
background: #0b58ff;
|
|
border-radius: 1px;
|
|
margin-right: 8px;
|
|
margin-top: 4px;
|
|
}
|
|
.buttonColor {
|
|
color: #fff;
|
|
background: #0b58ff;
|
|
}
|
|
</style> |