You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
295 lines
13 KiB
295 lines
13 KiB
6 months ago
|
<template>
|
||
|
|
<basic-container>
|
||
|
|
<!-- 成本计算配置 -->
|
||
|
|
<el-tabs v-model="tabPosition" class="demo-tabs" @tab-change="tabPositionChange">
|
||
|
|
<el-tab-pane label="工序维护" name="processMaintenance"></el-tab-pane>
|
||
|
|
<el-tab-pane label="物料维护" name="materialMaintenance">
|
||
|
|
<el-alert
|
||
|
|
title="维护的物料不进行材料费用计算"
|
||
|
|
style="margin-bottom: 10px; background: #e6f7ff;border-color: #91d5ff;"
|
||
|
|
show-icon>
|
||
|
|
</el-alert>
|
||
|
|
</el-tab-pane>
|
||
|
|
</el-tabs>
|
||
|
|
<avue-crud :option="option" :table-loading="loading" :data="data" v-model="form" v-model:page="page" ref="crud"
|
||
|
|
@row-update="rowUpdate" @row-save="rowSave" @search-change="searchChange" @search-reset="searchReset"
|
||
|
|
@selection-change="selectionChange" @current-change="currentChange" @size-change="sizeChange"
|
||
|
|
@refresh-change="refreshChange" @on-load="onLoad">
|
||
|
|
<template #menu-left>
|
||
|
|
<el-button icon="el-icon-plus" type="primary" @click="handleAdd">新增</el-button>
|
||
|
|
<el-button icon="el-icon-delete" type="danger" @click="handleDelete">删除</el-button>
|
||
|
|
<el-button icon="el-icon-upload" type="success">导入</el-button>
|
||
|
|
</template>
|
||
|
|
<template #menu="scope">
|
||
|
|
<el-button type="text" v-if="tabPosition == 'processMaintenance'" @click="maintainProcess(scope.row)">维护</el-button>
|
||
|
|
<el-button type="text" v-if="tabPosition == 'processMaintenance'" @click="deleteRow(scope.row)">删除</el-button>
|
||
|
|
</template>
|
||
|
|
</avue-crud>
|
||
|
|
<el-dialog :title="title" append-to-body v-model="showDialog" width="60%">
|
||
|
|
<div style="margin-bottom: 10px;">
|
||
|
|
<el-button type="primary" icon="el-icon-plus" @click="insertEvent()">插入一行</el-button>
|
||
|
|
<el-button plain type="danger" @click="remove">删除选择行</el-button>
|
||
|
|
<el-button type="primary" @click="handleSave">保存</el-button>
|
||
|
|
</div>
|
||
|
|
<el-table :data="processData" @select="selectChange">
|
||
|
|
<el-table-column type="selection" width="55px"></el-table-column>
|
||
|
|
<el-table-column align="center" label="作业中心" prop="workCenter">
|
||
|
|
<template #default="scope">
|
||
|
|
<el-select v-model="scope.row.workCenter">
|
||
|
|
<el-option label="镀金大批量作业中心" value="1"></el-option>
|
||
|
|
<el-option label="镀金小批量作业中心" value="2"></el-option>
|
||
|
|
</el-select>
|
||
|
|
</template>
|
||
|
|
</el-table-column>
|
||
|
|
<el-table-column align="center" label="工序" prop="process">
|
||
|
|
<template #default='scope'>
|
||
|
|
<el-select multiple v-model="scope.row.processVal">
|
||
|
|
<el-option label="镀金" value="1"></el-option>
|
||
|
|
<el-option label="滚金" value="2"></el-option>
|
||
|
|
<el-option label="化学镀镍" value="3"></el-option>
|
||
|
|
</el-select>
|
||
|
|
</template>
|
||
|
|
</el-table-column>
|
||
|
|
<el-table-column align="center" label="计算方式" prop="formulaMode">
|
||
|
|
<template #default="scope">
|
||
|
|
<el-radio-group v-model="scope.row.formulaMode">
|
||
|
|
<el-radio label="1">面积</el-radio>
|
||
|
|
<el-radio label="2">体积</el-radio>
|
||
|
|
</el-radio-group>
|
||
|
|
</template>
|
||
|
|
</el-table-column>
|
||
|
|
</el-table>
|
||
|
|
</el-dialog>
|
||
|
|
<el-dialog :title="title" append-to-body v-model="showMaterial" width="60%">
|
||
|
|
<div style="margin-bottom: 10px;">
|
||
|
|
<el-button type="primary" icon="el-icon-plus" @click="insertRow()">插入一行</el-button>
|
||
|
|
<el-button plain type="danger" @click="removeRow">删除选择行</el-button>
|
||
|
|
<el-button type="primary" @click="handleSave">保存</el-button>
|
||
|
|
</div>
|
||
|
|
<el-table :data="materialData" @select="selectChange">
|
||
|
|
<el-table-column type="selection" width="55px"></el-table-column>
|
||
|
|
<el-table-column align="center" label="物料编号" prop="goodsNo">
|
||
|
|
<template #default="{row,$index}">
|
||
|
|
<el-select v-model="row.goodsNo" @change="(event) => changeGoodsNo(event,$index)">
|
||
|
|
<el-option v-for="item in goodsData" :label="item.label" :value="item.label" :key="item.label"></el-option>
|
||
|
|
</el-select>
|
||
|
|
</template>
|
||
|
|
</el-table-column>
|
||
|
|
<el-table-column align="center" label="物料名称" prop="goodsName"></el-table-column>
|
||
|
|
</el-table>
|
||
|
|
</el-dialog>
|
||
|
|
</basic-container>
|
||
|
|
</template>
|
||
|
|
|
||
|
|
<script>
|
||
|
|
import costColumnData from './js/costColumnData';
|
||
|
|
export default {
|
||
|
|
data() {
|
||
|
|
return {
|
||
|
|
tabPosition: "processMaintenance",
|
||
|
|
loading:false,
|
||
|
|
showDialog:false,
|
||
|
|
showMaterial:false,
|
||
|
|
processData:[],
|
||
|
|
deleteProcessArr:[],
|
||
|
|
selectionList:[],
|
||
|
|
materialData:[],
|
||
|
|
data:[],
|
||
|
|
goodsData:[
|
||
|
|
{label:"0399-222-21",value:"物料一"},
|
||
|
|
{label:"0399-222-22",value:"物料二"},
|
||
|
|
{label:"0399-222-23",value:"物料三"},
|
||
|
|
{label:"0399-222-24",value:"物料四"},
|
||
|
|
],
|
||
|
|
form:{},
|
||
|
|
title:'新增',
|
||
|
|
page: {
|
||
|
|
pageSize: 10,
|
||
|
|
currentPage: 1,
|
||
|
|
total: 0,
|
||
|
|
},
|
||
|
|
option: {
|
||
|
|
height: 'auto',
|
||
|
|
calcHeight: 32,
|
||
|
|
tip: false,
|
||
|
|
size: 'medium',
|
||
|
|
simplePage: true,
|
||
|
|
searchShow: true,
|
||
|
|
searchMenuSpan: 6,
|
||
|
|
searchIcon: true,
|
||
|
|
searchIndex: 3,
|
||
|
|
tree: false,
|
||
|
|
border: true,
|
||
|
|
index: true,
|
||
|
|
selection: true,
|
||
|
|
viewBtn: false,
|
||
|
|
delBtn: false,
|
||
|
|
addBtn: false,
|
||
|
|
editBtn: false,
|
||
|
|
editBtnText: '修改',
|
||
|
|
viewBtnIcon: ' ',
|
||
|
|
delBtnIcon: ' ',
|
||
|
|
editBtnIcon: ' ',
|
||
|
|
viewBtnText: '详情',
|
||
|
|
labelWidth: 120,
|
||
|
|
searchLabelWidth: 120,
|
||
|
|
menuWidth: 220,
|
||
|
|
dialogWidth: 1200,
|
||
|
|
dialogClickModal: false,
|
||
|
|
searchEnter: true,
|
||
|
|
excelBtn: false,
|
||
|
|
filterBtn: true,
|
||
|
|
searchShowBtn: false,
|
||
|
|
columnSort: true,
|
||
|
|
excelBtn: true,
|
||
|
|
columnSort: true,
|
||
|
|
index: false,
|
||
|
|
showOverflowTooltip: true,
|
||
|
|
align: 'center',
|
||
|
|
column: []
|
||
|
|
}
|
||
|
|
}
|
||
|
|
},
|
||
|
|
mounted(){
|
||
|
|
this.option.column = costColumnData[this.tabPosition]
|
||
|
|
},
|
||
|
|
methods:{
|
||
|
|
selectionChange(val){
|
||
|
|
this.selectionList = val
|
||
|
|
},
|
||
|
|
changeGoodsNo(event,index){
|
||
|
|
let tmp = this.goodsData.find(item => item.label == event)
|
||
|
|
this.materialData[index].goodsName = tmp.value
|
||
|
|
},
|
||
|
|
// 点击删除按钮
|
||
|
|
handleDelete(){
|
||
|
|
if(this.selectionList.length == 0){
|
||
|
|
this.$message.error('请先选择数据')
|
||
|
|
return
|
||
|
|
}
|
||
|
|
this.$confirm('确定将选择数据删除?', {
|
||
|
|
confirmButtonText: '确定',
|
||
|
|
cancelButtonText: '取消',
|
||
|
|
type: 'warning',
|
||
|
|
}).then(res =>{
|
||
|
|
|
||
|
|
})
|
||
|
|
},
|
||
|
|
deleteRow(row){
|
||
|
|
this.$confirm('确定将选择数据删除?', {
|
||
|
|
confirmButtonText: '确定',
|
||
|
|
cancelButtonText: '取消',
|
||
|
|
type: 'warning',
|
||
|
|
}).then(res =>{
|
||
|
|
|
||
|
|
})
|
||
|
|
},
|
||
|
|
tabPositionChange(val){
|
||
|
|
if(val == 'materialMaintenance'){
|
||
|
|
this.option.menu = false
|
||
|
|
this.data = [
|
||
|
|
{id:1,goodsNo:'0399-222-21',goodsName:'物料一',createUser:'李四',createTime:'2023-08-20 11:23:25'},
|
||
|
|
{id:2,goodsNo:'0399-222-22',goodsName:'物料二',createUser:'李四',createTime:'2023-08-20 11:23:25'},
|
||
|
|
]
|
||
|
|
this.page.total = this.data.length
|
||
|
|
}else{
|
||
|
|
this.option.menu = true
|
||
|
|
this.data = [
|
||
|
|
{id:1,workCenter:'镀金大批量作业中心',processVal:['1','2','3'], processTitle:'镀金、滚金、化学镀镍',formulaMode:"1",createUser:'张三',createTime:'2023-11-20 11:23:25'},
|
||
|
|
{id:2,workCenter:'镀金大批量作业中心',processVal:['1','3'], processTitle:'镀金、化学镀镍',formulaMode:"2",createUser:'张三',createTime:'2023-11-20 11:23:25'},
|
||
|
|
{id:3,workCenter:'镀金大批量作业中心',processVal:['1','2'], processTitle:'镀金、滚金',formulaMode:"1",createUser:'张三',createTime:'2023-11-20 11:23:25'},
|
||
|
|
]
|
||
|
|
this.page.total = this.data.length
|
||
|
|
}
|
||
|
|
this.option.column = costColumnData[this.tabPosition]
|
||
|
|
},
|
||
|
|
maintainProcess(row){
|
||
|
|
this.title = '维护'
|
||
|
|
this.processData = [
|
||
|
|
{...row}
|
||
|
|
]
|
||
|
|
this.showDialog = true
|
||
|
|
},
|
||
|
|
handleAdd(){
|
||
|
|
if(this.tabPosition == 'materialMaintenance'){
|
||
|
|
this.materialData = []
|
||
|
|
this.showMaterial = true
|
||
|
|
}else{
|
||
|
|
this.title = '新增'
|
||
|
|
this.processData = []
|
||
|
|
this.showDialog = true
|
||
|
|
}
|
||
|
|
},
|
||
|
|
selectChange(list,row){
|
||
|
|
row._select = !row._select
|
||
|
|
},
|
||
|
|
//插入一行
|
||
|
|
insertEvent(){
|
||
|
|
const record = {
|
||
|
|
_select:false
|
||
|
|
}
|
||
|
|
this.processData.push(record)
|
||
|
|
},
|
||
|
|
insertRow(){
|
||
|
|
const record = {
|
||
|
|
_select:false
|
||
|
|
}
|
||
|
|
this.materialData.push(record)
|
||
|
|
},
|
||
|
|
//删除所选行
|
||
|
|
removeRow(){
|
||
|
|
let arr = this.materialData.filter(item => item._select)
|
||
|
|
if(arr.length != 0){
|
||
|
|
this.$confirm('确定将选择数据删除?', {
|
||
|
|
confirmButtonText: '确定',
|
||
|
|
cancelButtonText: '取消',
|
||
|
|
type: 'warning',
|
||
|
|
}).then(() =>{
|
||
|
|
if(this.rowId){
|
||
|
|
let deleteData = this.materialData.filter(item => item._select)
|
||
|
|
this.deleteProcessArr = deleteData.filter(item => item.tidId)
|
||
|
|
}
|
||
|
|
let deleteArr = this.materialData.filter(item => !item._select)
|
||
|
|
this.materialData = deleteArr
|
||
|
|
})
|
||
|
|
}else{
|
||
|
|
this.$message.error('请至少选择一条数据进行操作！')
|
||
|
|
}
|
||
|
|
},
|
||
|
|
//删除所选行
|
||
|
|
remove(){
|
||
|
|
let arr = this.processData.filter(item => item._select)
|
||
|
|
if(arr.length != 0){
|
||
|
|
this.$confirm('确定将选择数据删除?', {
|
||
|
|
confirmButtonText: '确定',
|
||
|
|
cancelButtonText: '取消',
|
||
|
|
type: 'warning',
|
||
|
|
}).then(() =>{
|
||
|
|
if(this.rowId){
|
||
|
|
let deleteData = this.processData.filter(item => item._select)
|
||
|
|
this.deleteProcessArr = deleteData.filter(item => item.tidId)
|
||
|
|
}
|
||
|
|
let deleteArr = this.processData.filter(item => !item._select)
|
||
|
|
this.processData = deleteArr
|
||
|
|
})
|
||
|
|
}else{
|
||
|
|
this.$message.error('请至少选择一条数据进行操作！')
|
||
|
|
}
|
||
|
|
},
|
||
|
|
handleSave(){
|
||
|
|
this.showDialog = false
|
||
|
|
this.showMaterial = false
|
||
|
|
},
|
||
|
|
onLoad(){
|
||
|
|
this.data = [
|
||
|
|
{id:1,workCenter:'镀金大批量作业中心',processVal:['1','2','3'], processTitle:'镀金、滚金、化学镀镍',formulaMode:"1",createUser:'张三',createTime:'2023-11-20 11:23:25'},
|
||
|
|
{id:1,workCenter:'镀金大批量作业中心',processVal:['1','3'], processTitle:'镀金、化学镀镍',formulaMode:"2",createUser:'张三',createTime:'2023-11-20 11:23:25'},
|
||
|
|
{id:1,workCenter:'镀金大批量作业中心',processVal:['1','2'], processTitle:'镀金、滚金',formulaMode:"1",createUser:'张三',createTime:'2023-11-20 11:23:25'},
|
||
|
|
]
|
||
|
|
this.page.total = this.data.length
|
||
|
|
}
|
||
|
|
}
|
||
|
|
}
|
||
|
|
</script>
|
||
|
|
|
||
|
|
<style></style>
|