237 lines
11 KiB
Vue
237 lines
11 KiB
Vue
<template>
|
|
<el-container>
|
|
<el-aside width="300px">
|
|
<el-container>
|
|
<el-main class="nopadding">
|
|
<div style="font-size: 20px; padding: 8px;">产品</div>
|
|
<el-tree node-key="id" :data="productOptions" @node-click="productClick"></el-tree>
|
|
</el-main>
|
|
</el-container>
|
|
</el-aside>
|
|
<el-main class="nopadding">
|
|
<el-container>
|
|
<el-aside width="200px">
|
|
<el-container>
|
|
<el-header>
|
|
<div style="font-size: 20px; padding: 8px;" v-if="selectedProduct">{{ selectedProduct.name }}
|
|
</div>
|
|
</el-header>
|
|
<el-main class="nopadding">
|
|
<div style="height: 90%; padding: 8px">
|
|
<el-steps direction="vertical" active="20">
|
|
<el-step v-for="item in currentRoute" v-bind:key="item.id" :title="item.process_name" />
|
|
</el-steps>
|
|
</div>
|
|
</el-main>
|
|
</el-container>
|
|
</el-aside>
|
|
<el-main class="nopadding">
|
|
<el-container>
|
|
<el-header>
|
|
<div class="left-panel">
|
|
<el-button type="primary" icon="el-icon-plus" @click="table_add"
|
|
v-auth="'route.create'">新增</el-button>
|
|
</div>
|
|
</el-header>
|
|
<el-main class="nopadding">
|
|
<scTable ref="table" :data="currentRoute" row-key="id" hidePagination>
|
|
<el-table-column label="排序" prop="sort" min-width="80"></el-table-column>
|
|
<el-table-column label="工序" min-width="120">
|
|
<template #default="scope">
|
|
<span>{{ scope.row.process_cate }} - {{ scope.row.process_name }}</span>
|
|
</template>
|
|
</el-table-column>
|
|
<el-table-column label="自动排产" prop="is_autotask" min-width="80">
|
|
<template #default="scope">
|
|
<el-icon v-if="scope.row.is_autotask" color="green">
|
|
<CircleCheckFilled />
|
|
</el-icon>
|
|
</template>
|
|
</el-table-column>
|
|
<el-table-column label="输入/输出" min-width="120">
|
|
<template #default="scope">
|
|
<span>{{ scope.row.material_in_name }} -> {{ scope.row.material_out_name }}</span>
|
|
</template>
|
|
</el-table-column>
|
|
<el-table-column label="出材率" prop="out_rate" min-width="80"></el-table-column>
|
|
<el-table-column label="统计工序" min-width="80">
|
|
<template #default="scope">
|
|
<el-icon v-if="scope.row.is_count_utask" color="green">
|
|
<CircleCheckFilled />
|
|
</el-icon>
|
|
</template>
|
|
</el-table-column>
|
|
<el-table-column label="操作" fixed="right" align="center" width="140">
|
|
<template #default="scope">
|
|
<el-button link size="small" @click="table_edit(scope.row)" v-auth="'route.update'"
|
|
type="primary">编辑</el-button>
|
|
<el-divider direction="vertical"></el-divider>
|
|
<el-popconfirm title="确定删除吗？" @confirm="table_del(scope.row, scope.$index)">
|
|
<template #reference>
|
|
<el-button link size="small" v-auth="'route.delete'"
|
|
type="danger">删除</el-button>
|
|
</template>
|
|
</el-popconfirm>
|
|
</template>
|
|
</el-table-column>
|
|
</scTable>
|
|
</el-main>
|
|
</el-container>
|
|
</el-main>
|
|
</el-container>
|
|
</el-main>
|
|
</el-container>
|
|
<el-dialog :title="dialogTitle" v-model="dialogVisible" width="30%">
|
|
<el-form ref="dialogForm" :model="form" :rules="rules" label-position="right" label-width="80px">
|
|
<el-form-item label="排序" prop="sort">
|
|
<el-input-number v-model="form.sort" :min="1" />
|
|
</el-form-item>
|
|
<el-form-item label="工序" prop="process">
|
|
<el-select v-model="form.process" placeholder="工序" clearable style="width: 100%;" :disabled="updateDisable">
|
|
<el-option v-for="item in processOptions" :key="item.id" :label="item.name" :value="item.id">
|
|
</el-option>
|
|
</el-select>
|
|
</el-form-item>
|
|
<el-form-item label="出材率" prop="out_rate">
|
|
<el-input-number v-model="form.out_rate" :max="100" :precision="1" :step="0.1" />
|
|
</el-form-item>
|
|
<el-form-item label="统计工序">
|
|
<el-switch v-model="form.is_count_utask" />
|
|
</el-form-item>
|
|
<el-form-item label="自动排产" prop="is_autotask">
|
|
<el-switch v-model="form.is_autotask" />
|
|
</el-form-item>
|
|
<el-form-item label="主要输入" prop="material_in">
|
|
<el-select v-model="form.material_in" placeholder="物料" clearable style="width: 100%;">
|
|
<el-option v-for="item in materialOptions" :key="item.id" :label="item.full_name" :value="item.id">
|
|
<span style="float: left">{{ item.full_name }}</span>
|
|
<span style="float: right;color: '#E6A23C';font-size: 13px;" v-if="item.is_hidden">{{
|
|
item.process_name }}-隐</span>
|
|
</el-option>
|
|
</el-select>
|
|
</el-form-item>
|
|
<el-form-item label="主要输出" prop="material_out">
|
|
<el-select v-model="form.material_out" placeholder="物料" clearable style="width: 100%;">
|
|
<el-option v-for="item in materialOptions" :key="item.id" :label="item.full_name" :value="item.id">
|
|
<span style="float: left">{{ item.full_name }}</span>
|
|
<span style="float: right;color: '#E6A23C';font-size: 13px;" v-if="item.is_hidden">{{
|
|
item.process_name }}-隐</span></el-option>
|
|
</el-select>
|
|
</el-form-item>
|
|
</el-form>
|
|
<template #footer>
|
|
<el-button type="primary" :loading="isSaveing" @click="form_save">保存</el-button>
|
|
<el-button @click="dialogVisible = false">取消</el-button>
|
|
</template>
|
|
</el-dialog>
|
|
</template>
|
|
<script>
|
|
const defaultForm = {
|
|
process: null,
|
|
sort: 1,
|
|
out_rate: 100,
|
|
is_autotask: true,
|
|
is_count_utask: false
|
|
};
|
|
export default {
|
|
name: "route",
|
|
components: {},
|
|
data() {
|
|
return {
|
|
apiObj: null,
|
|
query: {},
|
|
productOptions: [],
|
|
dialogVisible: false,
|
|
form: {},
|
|
rules: {
|
|
process: [{ required: true, trigger: "blur" }],
|
|
sort: [{ required: true, trigger: "blur" }],
|
|
out_rate: [{ required: true, trigger: "blur" }]
|
|
},
|
|
processOptions: [],
|
|
materialOptions: [],
|
|
selectedProduct: { id: 0 },
|
|
dialogTitle: '新增',
|
|
updateDisable: false,
|
|
currentRoute: [],
|
|
}
|
|
},
|
|
mounted() {
|
|
this.getProducts()
|
|
this.getProcess()
|
|
this.getMaterial()
|
|
},
|
|
methods: {
|
|
getRoute() {
|
|
this.$API.mtm.route.list({ material: this.selectedProduct.id, page: 0 }).then(res => {
|
|
this.currentRoute = res
|
|
})
|
|
},
|
|
//获取工序列表
|
|
getProcess() {
|
|
var res = this.$API.mtm.process.list.req({ page: 0 }).then(res => {
|
|
this.processOptions = res;
|
|
});
|
|
},
|
|
getMaterial() {
|
|
this.$API.mtm.material.list.req({ page: 0, type__in: "10,20" }).then(res => {
|
|
this.materialOptions = res
|
|
})
|
|
},
|
|
getProducts() {
|
|
this.$API.mtm.material.list.req({ page: 0, need_route: true }).then(res => {
|
|
res.forEach(m => {
|
|
m.label = m.name+'|'+m.specification+'|'+m.model;
|
|
})
|
|
this.productOptions = res
|
|
})
|
|
},
|
|
table_add() {
|
|
if (this.selectedProduct.id === 0) {
|
|
this.$message.error('请先选择左侧产品');
|
|
return
|
|
}
|
|
this.dialogTitle = '新增'
|
|
this.updateDisable = false;
|
|
this.form = Object.assign({}, defaultForm);
|
|
this.form.material = this.selectedProduct.id
|
|
this.dialogVisible = true;
|
|
},
|
|
table_edit(row) {
|
|
this.dialogTitle = '编辑'
|
|
this.updateDisable = true;
|
|
this.form = Object.assign({}, row);
|
|
this.dialogVisible = true;
|
|
},
|
|
table_del(row) {
|
|
this.$API.mtm.route.delete.req(row.id).then(res => {
|
|
this.productClick()
|
|
})
|
|
},
|
|
form_save() {
|
|
if (this.dialogTitle == '新增') {
|
|
this.$API.mtm.route.create.req(this.form).then(res => {
|
|
this.productClick()
|
|
this.dialogVisible = false
|
|
this.getMaterial()
|
|
})
|
|
} else if (this.dialogTitle == '编辑') {
|
|
this.$API.mtm.route.update.req(this.form.id, this.form).then(res => {
|
|
this.productClick()
|
|
this.dialogVisible = false
|
|
})
|
|
}
|
|
},
|
|
productClick(data) {
|
|
let materialId = this.selectedProduct.id
|
|
if (data) {
|
|
this.selectedProduct = data
|
|
materialId = data.id
|
|
}
|
|
this.$API.mtm.route.list.req({ page: 0, material: materialId }).then(res => {
|
|
this.currentRoute = res
|
|
})
|
|
}
|
|
}
|
|
}
|
|
</script> |