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.
347 lines
13 KiB
347 lines
13 KiB
6 months ago
|
<template>
|
||
|
|
<div class="box-card">
|
||
|
|
<div class="process-left">
|
||
|
|
<div class="process-select">
|
||
|
|
<!-- 工艺级别：-->
|
||
|
|
<el-form :model="form" label-width="auto">
|
||
|
|
<el-form-item label="工艺级别:">
|
||
|
|
<el-select v-model="processLevel" placeholder="请选择" style="width: 220px" @change="leavelChange">
|
||
|
|
<el-option label="一级工艺" value="1" />
|
||
|
|
<el-option label="二级工艺" value="2" />
|
||
|
|
<el-option label="三级工艺" value="3" />
|
||
|
|
</el-select>
|
||
|
|
</el-form-item>
|
||
|
|
</el-form>
|
||
|
|
</div>
|
||
|
|
<el-tree style="width:240px" :data="data" :props="defaultProps" @node-click="handleNodeClick"
|
||
|
|
:default-expand-all="true" :expand-on-click-node="false" />
|
||
|
|
|
||
|
|
</div>
|
||
|
|
<div class="process-right">
|
||
|
|
<el-form :model="form" label-width="auto" :rules="rules">
|
||
|
|
<el-row :gutter="24">
|
||
|
|
<el-col :span="8">
|
||
|
|
<el-form-item label="重要度:" prop="zhongyaodu">
|
||
|
|
<el-select v-model="form.zhongyaodu" :placeholder="'请选择'">
|
||
|
|
<el-option v-for="item in priorityList" :key="item.value" :label="item.label"
|
||
|
|
:value="item.value" />
|
||
|
|
</el-select>
|
||
|
|
</el-form-item>
|
||
|
|
</el-col>
|
||
|
|
<el-col :span="8">
|
||
|
|
<el-form-item label="生产标识:" prop="qualityGrade">
|
||
|
|
<el-select v-model="form.qualityGrade" :placeholder="'请选择'">
|
||
|
|
<el-option v-for="item in rankList" :key="item.value" :label="item.label"
|
||
|
|
:value="item.value" />
|
||
|
|
</el-select>
|
||
|
|
</el-form-item>
|
||
|
|
</el-col>
|
||
|
|
<el-col :span="8">
|
||
|
|
<el-form-item label="备注:" prop="beizhu">
|
||
|
|
<el-input v-model="form.beizhu" placeholder="请输入" />
|
||
|
|
</el-form-item>
|
||
|
|
</el-col>
|
||
|
|
</el-row>
|
||
|
|
</el-form>
|
||
|
|
<el-tabs v-model="activeName" class="demo-tabs" @tab-click="handleClick">
|
||
|
|
<el-tab-pane label="工序" name="1" v-if="treeLeave == 2"></el-tab-pane>
|
||
|
|
<el-tab-pane label="项目" name="2" v-if="treeLeave == 3"></el-tab-pane>
|
||
|
|
<el-tab-pane label="尺寸、量具" name="3" v-if="treeLeave == 3"></el-tab-pane>
|
||
|
|
<el-tab-pane label="工装、模具表" name="4" v-if="treeLeave == 3"></el-tab-pane>
|
||
|
|
</el-tabs>
|
||
|
|
<div class="table-btn">
|
||
|
|
<div class="table-btn-left">
|
||
|
|
<el-button type="primary" plain @click="addTable()">插入一行</el-button>
|
||
|
|
<el-button type="danger" plain @click="delTable()">删除选择行</el-button>
|
||
|
|
</div>
|
||
|
|
<div class="table-btn-right" v-if="!(activeName=='3'||activeName=='4')">
|
||
|
|
<el-select v-model="processLevel" placeholder="选择工艺模板" style="width: 220px;margin-right: 12px;">
|
||
|
|
<el-option label="模板一" value="1" />
|
||
|
|
<el-option label="模板二" value="2" />
|
||
|
|
<el-option label="模板三" value="3" />
|
||
|
|
</el-select>
|
||
|
|
<el-button type="primary">导入模板</el-button>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<el-table :data="tableData1" style="width: 100%" v-if="activeName == '1'">
|
||
|
|
<el-table-column type="selection" width="55"></el-table-column>
|
||
|
|
<el-table-column prop="date" label="工序号"></el-table-column>
|
||
|
|
<el-table-column prop="name" label="工序">
|
||
|
|
<template #header>
|
||
|
|
<span><i style="color:red">*</i>工序</span>
|
||
|
|
</template>
|
||
|
|
</el-table-column>
|
||
|
|
<el-table-column prop="address" label="工艺能力">
|
||
|
|
<template #header>
|
||
|
|
<span><i style="color:red">*</i>工艺能力</span>
|
||
|
|
</template>
|
||
|
|
</el-table-column>
|
||
|
|
<el-table-column prop="address" label="工序描述">
|
||
|
|
<template #header>
|
||
|
|
<span><i style="color:red">*</i>工序描述</span>
|
||
|
|
</template>
|
||
|
|
</el-table-column>
|
||
|
|
<el-table-column prop="address" label="定额工时(分钟)">
|
||
|
|
<template #header>
|
||
|
|
<span><i style="color:red">*</i>定额工时(分钟)</span>
|
||
|
|
</template>
|
||
|
|
</el-table-column>
|
||
|
|
<el-table-column prop="address" label="准备工时(分钟)">
|
||
|
|
</el-table-column>
|
||
|
|
<el-table-column prop="address" label="是否主工序"></el-table-column>
|
||
|
|
</el-table>
|
||
|
|
<el-table :data="tableData2" style="width: 100%" v-if="activeName == '2'">
|
||
|
|
<el-table-column type="selection" width="55"></el-table-column>
|
||
|
|
<el-table-column prop="date" label="工序号"></el-table-column>
|
||
|
|
<el-table-column prop="date" label="检验项目">
|
||
|
|
<template #header>
|
||
|
|
<span><i style="color:red">*</i>检验项目</span>
|
||
|
|
</template>
|
||
|
|
</el-table-column>
|
||
|
|
<el-table-column prop="date" label="检验标准">
|
||
|
|
<template #header>
|
||
|
|
<span><i style="color:red">*</i>检验标准</span>
|
||
|
|
</template>
|
||
|
|
</el-table-column>
|
||
|
|
<el-table-column prop="date" label="定额工时(分钟)">
|
||
|
|
<template #header>
|
||
|
|
<span><i style="color:red">*</i>定额工时(分钟)</span>
|
||
|
|
</template>
|
||
|
|
</el-table-column>
|
||
|
|
<el-table-column prop="date" label="准备工时(分钟)"></el-table-column>
|
||
|
|
</el-table>
|
||
|
|
<el-table :data="tableData3" style="width: 100%" v-if="activeName == '3'">
|
||
|
|
<el-table-column type="selection" width="55"></el-table-column>
|
||
|
|
<el-table-column prop="date" label="工序号"></el-table-column>
|
||
|
|
<el-table-column prop="date" label="镀前镀后">
|
||
|
|
<template #header>
|
||
|
|
<span><i style="color:red">*</i>镀前镀后</span>
|
||
|
|
</template>
|
||
|
|
</el-table-column>
|
||
|
|
<el-table-column prop="date" label="量具">
|
||
|
|
<template #header>
|
||
|
|
<span><i style="color:red">*</i>量具</span>
|
||
|
|
</template>
|
||
|
|
</el-table-column>
|
||
|
|
<el-table-column prop="date" label="量具尺寸"></el-table-column>
|
||
|
|
<el-table-column prop="date" label="图纸尺寸"></el-table-column>
|
||
|
|
</el-table>
|
||
|
|
<el-table :data="tableData4" style="width: 100%" v-if="activeName == '4'">
|
||
|
|
<el-table-column type="selection" width="55"></el-table-column>
|
||
|
|
<el-table-column prop="date" label="工序号"></el-table-column>
|
||
|
|
<el-table-column prop="date" label="对应工装">
|
||
|
|
<template #header>
|
||
|
|
<span><i style="color:red">*</i>对应工装</span>
|
||
|
|
</template>
|
||
|
|
</el-table-column>
|
||
|
|
<el-table-column prop="date" label="工装名称"></el-table-column>
|
||
|
|
<el-table-column prop="date" label="是否印字"></el-table-column>
|
||
|
|
<el-table-column prop="date" label="印字版编号"></el-table-column>
|
||
|
|
<el-table-column prop="date" label="测试夹具号"></el-table-column>
|
||
|
|
</el-table>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</template>
|
||
|
|
<script>
|
||
|
|
export default {
|
||
|
|
name: 'CraftIndex',
|
||
|
|
components: {},
|
||
|
|
props: {
|
||
|
|
height: {
|
||
|
|
type: Number,
|
||
|
|
default: 600
|
||
|
|
},
|
||
|
|
partId: {
|
||
|
|
type: [Number, String],
|
||
|
|
default: null
|
||
|
|
},
|
||
|
|
dialogType: {
|
||
|
|
type: String,
|
||
|
|
default: '',
|
||
|
|
}
|
||
|
|
},
|
||
|
|
data() {
|
||
|
|
return {
|
||
|
|
processLevel: '2',
|
||
|
|
data: [
|
||
|
|
{
|
||
|
|
label: 'Level one 1',
|
||
|
|
disabled: true,
|
||
|
|
children: [
|
||
|
|
{
|
||
|
|
label: 'Level two 1-1',
|
||
|
|
children: [
|
||
|
|
{
|
||
|
|
label: 'Level three 1-1-1',
|
||
|
|
},
|
||
|
|
],
|
||
|
|
},
|
||
|
|
],
|
||
|
|
},
|
||
|
|
{
|
||
|
|
label: 'Level one 2',
|
||
|
|
disabled: true,
|
||
|
|
children: [
|
||
|
|
{
|
||
|
|
label: 'Level two 2-1',
|
||
|
|
children: [
|
||
|
|
{
|
||
|
|
label: 'Level three 2-1-1',
|
||
|
|
},
|
||
|
|
],
|
||
|
|
},
|
||
|
|
{
|
||
|
|
label: 'Level two 2-2',
|
||
|
|
children: [
|
||
|
|
{
|
||
|
|
label: 'Level three 2-2-1',
|
||
|
|
},
|
||
|
|
],
|
||
|
|
},
|
||
|
|
],
|
||
|
|
},
|
||
|
|
],
|
||
|
|
defaultProps: {
|
||
|
|
children: 'children',
|
||
|
|
label: 'label',
|
||
|
|
},
|
||
|
|
form: {
|
||
|
|
zhongyaodu: '',
|
||
|
|
qualityGrade: '',//生产标识
|
||
|
|
beizhu: '',//备注
|
||
|
|
},
|
||
|
|
rules: {
|
||
|
|
zhongyaodu: [
|
||
|
|
{ required: true, message: '请选择', trigger: 'blur' },
|
||
|
|
]
|
||
|
|
},
|
||
|
|
priorityList: [
|
||
|
|
{
|
||
|
|
label: '本次使用',
|
||
|
|
value: 1
|
||
|
|
},
|
||
|
|
{
|
||
|
|
label: '正式工艺',
|
||
|
|
value: 2
|
||
|
|
},
|
||
|
|
{
|
||
|
|
label: '临时工艺',
|
||
|
|
value: 3
|
||
|
|
}
|
||
|
|
],
|
||
|
|
rankList: [
|
||
|
|
{
|
||
|
|
label: '一级',
|
||
|
|
value: 1
|
||
|
|
},
|
||
|
|
{
|
||
|
|
label: '二级',
|
||
|
|
value: 2
|
||
|
|
},
|
||
|
|
{
|
||
|
|
label: '三级',
|
||
|
|
value: 3
|
||
|
|
}
|
||
|
|
],
|
||
|
|
activeName: '1',
|
||
|
|
treeLeave: {},//组织树选中层级
|
||
|
|
}
|
||
|
|
},
|
||
|
|
methods: {
|
||
|
|
// 组织树点击
|
||
|
|
handleNodeClick(nodes, node, self) {
|
||
|
|
if (nodes.disabled) {
|
||
|
|
// 阻止默认的点击行为
|
||
|
|
return false;
|
||
|
|
}
|
||
|
|
this.treeLeave = node.level
|
||
|
|
if (this.treeLeave == 3) {
|
||
|
|
this.activeName = '2'
|
||
|
|
}
|
||
|
|
},
|
||
|
|
// 右侧tab切换
|
||
|
|
handleClick(value) {
|
||
|
|
console.log(999999, value)
|
||
|
|
|
||
|
|
|
||
|
|
},
|
||
|
|
// 切换等级
|
||
|
|
leavelChange(){
|
||
|
|
this.$message.success('保存成功')
|
||
|
|
|
||
|
|
},
|
||
|
|
// 插入一行
|
||
|
|
addTable() {
|
||
|
|
if (this.activeName == '1') {
|
||
|
|
|
||
|
|
}
|
||
|
|
if (this.activeName == '2') {
|
||
|
|
|
||
|
|
}
|
||
|
|
if (this.activeName == '3') {
|
||
|
|
|
||
|
|
}
|
||
|
|
if (this.activeName == '4') {
|
||
|
|
|
||
|
|
}
|
||
|
|
},
|
||
|
|
// 删除选择行
|
||
|
|
delTable() {
|
||
|
|
if (this.activeName == '1') {
|
||
|
|
|
||
|
|
}
|
||
|
|
if (this.activeName == '2') {
|
||
|
|
|
||
|
|
}
|
||
|
|
if (this.activeName == '3') {
|
||
|
|
|
||
|
|
}
|
||
|
|
if (this.activeName == '4') {
|
||
|
|
|
||
|
|
}
|
||
|
|
},
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
</script>
|
||
|
|
<style lang="scss" scoped>
|
||
|
|
.box-card {
|
||
|
|
display: flex;
|
||
|
|
flex-direction: row;
|
||
|
|
height: calc(100vh - 200px);
|
||
|
|
|
||
|
|
.process-left {
|
||
|
|
// padding: 20px;
|
||
|
|
border: 1px solid #ccc;
|
||
|
|
|
||
|
|
.process-select {
|
||
|
|
padding: 12px;
|
||
|
|
background: #e4e7ed;
|
||
|
|
|
||
|
|
:deep(.el-form-item) {
|
||
|
|
margin-bottom: 0px !important;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
.process-right {
|
||
|
|
padding: 12px;
|
||
|
|
flex: 1;
|
||
|
|
border: 1px solid #ccc;
|
||
|
|
border-left: 0;
|
||
|
|
|
||
|
|
.table-btn {
|
||
|
|
width: 100%;
|
||
|
|
height: 50px;
|
||
|
|
|
||
|
|
.table-btn-left {
|
||
|
|
float: left;
|
||
|
|
}
|
||
|
|
|
||
|
|
.table-btn-right {
|
||
|
|
float: right;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
}
|
||
|
|
}
|
||
|
|
</style>
|