Merge remote-tracking branch 'origin/0.8.X' into 0.8.X
This commit is contained in:
@@ -42,3 +42,12 @@ export function delCoilAbnormal(abnormalId) {
|
||||
method: 'delete'
|
||||
})
|
||||
}
|
||||
|
||||
// 异常判级
|
||||
export function judgeAbnormalLevel(params) {
|
||||
return request({
|
||||
url: '/wms/coilAbnormal/judge',
|
||||
method: 'put',
|
||||
params
|
||||
})
|
||||
}
|
||||
|
||||
@@ -3,32 +3,20 @@
|
||||
<el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px">
|
||||
<el-form-item label="位置" prop="position">
|
||||
<el-select v-model="queryParams.position" placeholder="请选择位置" clearable>
|
||||
<el-option
|
||||
v-for="dict in dict.type.coil_abnormal_position"
|
||||
:key="dict.value"
|
||||
:label="dict.label"
|
||||
:value="dict.value"
|
||||
/>
|
||||
<el-option v-for="dict in dict.type.coil_abnormal_position" :key="dict.value" :label="dict.label"
|
||||
:value="dict.value" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="缺陷代码" prop="defectCode">
|
||||
<el-select v-model="queryParams.defectCode" placeholder="请选择缺陷代码" clearable>
|
||||
<el-option
|
||||
v-for="dict in dict.type.coil_abnormal_code"
|
||||
:key="dict.value"
|
||||
:label="dict.label"
|
||||
:value="dict.value"
|
||||
/>
|
||||
<el-option v-for="dict in dict.type.coil_abnormal_code" :key="dict.value" :label="dict.label"
|
||||
:value="dict.value" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="程度" prop="degree">
|
||||
<el-select v-model="queryParams.degree" placeholder="请选择程度" clearable>
|
||||
<el-option
|
||||
v-for="dict in dict.type.coil_abnormal_degree"
|
||||
:key="dict.value"
|
||||
:label="dict.label"
|
||||
:value="dict.value"
|
||||
/>
|
||||
<el-option v-for="dict in dict.type.coil_abnormal_degree" :key="dict.value" :label="dict.label"
|
||||
:value="dict.value" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
@@ -39,67 +27,46 @@
|
||||
|
||||
<el-row :gutter="10" class="mb8">
|
||||
<el-col :span="1.5">
|
||||
<el-button
|
||||
type="primary"
|
||||
plain
|
||||
icon="el-icon-plus"
|
||||
size="mini"
|
||||
@click="handleAdd"
|
||||
>新增</el-button>
|
||||
<el-button type="primary" plain icon="el-icon-plus" size="mini" @click="handleAdd">新增</el-button>
|
||||
</el-col>
|
||||
<el-col :span="1.5">
|
||||
<el-button
|
||||
type="success"
|
||||
plain
|
||||
icon="el-icon-edit"
|
||||
size="mini"
|
||||
:disabled="single"
|
||||
@click="handleUpdate"
|
||||
>修改</el-button>
|
||||
<el-button type="success" plain icon="el-icon-edit" size="mini" :disabled="single"
|
||||
@click="handleUpdate">修改</el-button>
|
||||
</el-col>
|
||||
<el-col :span="1.5">
|
||||
<el-button
|
||||
type="danger"
|
||||
plain
|
||||
icon="el-icon-delete"
|
||||
size="mini"
|
||||
:disabled="multiple"
|
||||
@click="handleDelete"
|
||||
>删除</el-button>
|
||||
<el-button type="danger" plain icon="el-icon-delete" size="mini" :disabled="multiple"
|
||||
@click="handleDelete">删除</el-button>
|
||||
</el-col>
|
||||
<el-col :span="1.5">
|
||||
<el-button
|
||||
type="warning"
|
||||
plain
|
||||
icon="el-icon-download"
|
||||
size="mini"
|
||||
@click="handleExport"
|
||||
>导出</el-button>
|
||||
<el-button type="warning" plain icon="el-icon-download" size="mini" @click="handleExport">导出</el-button>
|
||||
</el-col>
|
||||
<right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
|
||||
</el-row>
|
||||
|
||||
<el-table v-loading="loading" :data="coilAbnormalList" @selection-change="handleSelectionChange">
|
||||
<el-table-column type="selection" width="55" align="center" />
|
||||
<el-table-column label="主键ID" align="center" prop="abnormalId" v-if="false"/>
|
||||
<el-table-column label="钢卷ID" align="center" prop="coilId" />
|
||||
<el-table-column label="主键ID" align="center" prop="abnormalId" v-if="false" />
|
||||
<el-table-column label="位置" align="center" prop="position">
|
||||
<template slot-scope="scope">
|
||||
<dict-tag :options="dict.type.coil_abnormal_position" :value="scope.row.position"/>
|
||||
<dict-tag :options="dict.type.coil_abnormal_position" :value="scope.row.position" />
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="长度坐标" align="center" prop="lengthCoord" />
|
||||
<el-table-column label="缺陷代码" align="center" prop="defectCode">
|
||||
<template slot-scope="scope">
|
||||
<dict-tag :options="dict.type.coil_abnormal_code" :value="scope.row.defectCode"/>
|
||||
<dict-tag :options="dict.type.coil_abnormal_code" :value="scope.row.defectCode" />
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="程度" align="center" prop="degree">
|
||||
<template slot-scope="scope">
|
||||
<dict-tag :options="dict.type.coil_abnormal_degree" :value="scope.row.degree"/>
|
||||
<dict-tag :options="dict.type.coil_abnormal_degree" :value="scope.row.degree" />
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="判级" align="center" prop="judgeLevel">
|
||||
<template slot-scope="scope">
|
||||
<dict-tag :options="dict.type.coil_abnormal_level" :value="scope.row.judgeLevel" />
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="判级" align="center" prop="judgeLevel" />
|
||||
<el-table-column label="判级人" align="center" prop="judgeBy" />
|
||||
<el-table-column label="判级时间" align="center" prop="judgeTime" width="180">
|
||||
<template slot-scope="scope">
|
||||
@@ -108,29 +75,15 @@
|
||||
</el-table-column>
|
||||
<el-table-column label="操作" align="center" class-name="small-padding fixed-width">
|
||||
<template slot-scope="scope">
|
||||
<el-button
|
||||
size="mini"
|
||||
type="text"
|
||||
icon="el-icon-edit"
|
||||
@click="handleUpdate(scope.row)"
|
||||
>修改</el-button>
|
||||
<el-button
|
||||
size="mini"
|
||||
type="text"
|
||||
icon="el-icon-delete"
|
||||
@click="handleDelete(scope.row)"
|
||||
>删除</el-button>
|
||||
<el-button size="mini" type="text" icon="el-icon-check" @click="handleJudge(scope.row)">判级</el-button>
|
||||
<el-button size="mini" type="text" icon="el-icon-edit" @click="handleUpdate(scope.row)">修改</el-button>
|
||||
<el-button size="mini" type="text" icon="el-icon-delete" @click="handleDelete(scope.row)">删除</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
|
||||
<pagination
|
||||
v-show="total>0"
|
||||
:total="total"
|
||||
:page.sync="queryParams.pageNum"
|
||||
:limit.sync="queryParams.pageSize"
|
||||
@pagination="getList"
|
||||
/>
|
||||
<pagination v-show="total > 0" :total="total" :page.sync="queryParams.pageNum" :limit.sync="queryParams.pageSize"
|
||||
@pagination="getList" />
|
||||
|
||||
<!-- 添加或修改钢卷异常信息对话框 -->
|
||||
<el-dialog :title="title" :visible.sync="open" width="600px" append-to-body>
|
||||
@@ -140,11 +93,8 @@
|
||||
</el-form-item>
|
||||
<el-form-item label="位置" prop="position">
|
||||
<el-radio-group v-model="form.position">
|
||||
<el-radio-button
|
||||
v-for="dict in dict.type.coil_abnormal_position"
|
||||
:key="dict.value"
|
||||
:label="dict.value"
|
||||
>{{dict.label}}</el-radio-button>
|
||||
<el-radio-button v-for="dict in dict.type.coil_abnormal_position" :key="dict.value"
|
||||
:label="dict.value">{{ dict.label }}</el-radio-button>
|
||||
</el-radio-group>
|
||||
</el-form-item>
|
||||
<el-form-item label="长度坐标" prop="lengthCoord">
|
||||
@@ -152,20 +102,14 @@
|
||||
</el-form-item>
|
||||
<el-form-item label="缺陷代码" prop="defectCode">
|
||||
<el-radio-group v-model="form.defectCode">
|
||||
<el-radio-button
|
||||
v-for="dict in dict.type.coil_abnormal_code"
|
||||
:key="dict.value"
|
||||
:label="dict.value"
|
||||
>{{dict.label}}</el-radio-button>
|
||||
<el-radio-button v-for="dict in dict.type.coil_abnormal_code" :key="dict.value"
|
||||
:label="dict.value">{{ dict.label }}</el-radio-button>
|
||||
</el-radio-group>
|
||||
</el-form-item>
|
||||
<el-form-item label="程度" prop="degree">
|
||||
<el-radio-group v-model="form.degree">
|
||||
<el-radio-button
|
||||
v-for="dict in dict.type.coil_abnormal_degree"
|
||||
:key="dict.value"
|
||||
:label="dict.value"
|
||||
>{{dict.label}}</el-radio-button>
|
||||
<el-radio-button v-for="dict in dict.type.coil_abnormal_degree" :key="dict.value"
|
||||
:label="dict.value">{{ dict.label }}</el-radio-button>
|
||||
</el-radio-group>
|
||||
</el-form-item>
|
||||
<el-form-item label="备注" prop="remark">
|
||||
@@ -177,16 +121,32 @@
|
||||
<el-button @click="cancel">取 消</el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
|
||||
<!-- 异常判级对话框 -->
|
||||
<el-dialog :title="title" :visible.sync="judgeOpen" width="600px" append-to-body>
|
||||
<el-form ref="form" :model="form" :rules="rules" label-width="80px">
|
||||
<el-form-item label="判级" prop="judgeLevel">
|
||||
<el-radio-group v-model="form.judgeLevel">
|
||||
<el-radio-button v-for="dict in dict.type.coil_abnormal_level" :key="dict.value"
|
||||
:label="dict.value">{{ dict.label }}</el-radio-button>
|
||||
</el-radio-group>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<div slot="footer" class="dialog-footer">
|
||||
<el-button :loading="buttonLoading" type="primary" @click="submitJudge">确 定</el-button>
|
||||
<el-button @click="judgeOpen = false">取 消</el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { listCoilAbnormal, getCoilAbnormal, delCoilAbnormal, addCoilAbnormal, updateCoilAbnormal } from "@/api/wms/coilAbnormal";
|
||||
import { listCoilAbnormal, getCoilAbnormal, delCoilAbnormal, addCoilAbnormal, updateCoilAbnormal, judgeAbnormalLevel } from "@/api/wms/coilAbnormal";
|
||||
import CoilSelector from '@/components/CoilSelector'
|
||||
|
||||
export default {
|
||||
name: "CoilAbnormal",
|
||||
dicts: ['coil_abnormal_code', 'coil_abnormal_position', 'coil_abnormal_degree'],
|
||||
dicts: ['coil_abnormal_code', 'coil_abnormal_position', 'coil_abnormal_degree', 'coil_abnormal_level'],
|
||||
components: {
|
||||
CoilSelector
|
||||
},
|
||||
@@ -228,7 +188,8 @@ export default {
|
||||
form: {},
|
||||
// 表单校验
|
||||
rules: {
|
||||
}
|
||||
},
|
||||
judgeOpen: false,
|
||||
};
|
||||
},
|
||||
// created() {
|
||||
@@ -294,7 +255,7 @@ export default {
|
||||
// 多选框选中数据
|
||||
handleSelectionChange(selection) {
|
||||
this.ids = selection.map(item => item.abnormalId)
|
||||
this.single = selection.length!==1
|
||||
this.single = selection.length !== 1
|
||||
this.multiple = !selection.length
|
||||
},
|
||||
/** 新增按钮操作 */
|
||||
@@ -360,6 +321,24 @@ export default {
|
||||
this.download('wms/coilAbnormal/export', {
|
||||
...this.queryParams
|
||||
}, `coilAbnormal_${new Date().getTime()}.xlsx`)
|
||||
},
|
||||
/** 异常判级按钮操作 */
|
||||
handleJudge(row) {
|
||||
this.reset();
|
||||
this.form = row
|
||||
this.judgeOpen = true;
|
||||
this.title = "异常判级";
|
||||
},
|
||||
/** 提交异常判级按钮操作 */
|
||||
submitJudge() {
|
||||
this.buttonLoading = true;
|
||||
judgeAbnormalLevel(this.form).then(response => {
|
||||
this.$modal.msgSuccess("判级成功");
|
||||
this.judgeOpen = false;
|
||||
this.getList();
|
||||
}).finally(() => {
|
||||
this.buttonLoading = false;
|
||||
});
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
@@ -431,9 +431,9 @@ export default {
|
||||
},
|
||||
/** 提交按钮 */
|
||||
submitForm() {
|
||||
this.buttonLoading = true;
|
||||
this.$refs['form'].validate(valid => {
|
||||
if (valid) {
|
||||
this.buttonLoading = true;
|
||||
if (this.form.actionId != null) {
|
||||
updatePendingAction(this.form).then(response => {
|
||||
this.$message.success('修改成功');
|
||||
|
||||
@@ -64,16 +64,8 @@
|
||||
min-width="250"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
<ProductInfo v-if="scope.row.itemType === 'product'" :product="scope.row.product">
|
||||
<template #default="{ product }">
|
||||
{{ product.productName || '未知' }}({{ product.productCode || '无编码' }})
|
||||
</template>
|
||||
</ProductInfo>
|
||||
<RawMaterialInfo v-else-if="scope.row.itemType === 'raw_material'" :material="scope.row.rawMaterial">
|
||||
<template #default="{ material }">
|
||||
{{ material.rawMaterialName || '未知' }}({{ material.rawMaterialCode || '无编码' }})
|
||||
</template>
|
||||
</RawMaterialInfo>
|
||||
<ProductInfo v-if="scope.row.itemType === 'product'" :product="scope.row.product" />
|
||||
<RawMaterialInfo v-else-if="scope.row.itemType === 'raw_material'" :material="scope.row.rawMaterial" />
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
|
||||
@@ -41,16 +41,8 @@
|
||||
<!-- 物料ID/名称列：仅物料统计时有效 -->
|
||||
<el-table-column label="物料信息" align="center" min-width="250">
|
||||
<template slot-scope="scope">
|
||||
<ProductInfo v-if="scope.row.itemType === 'product'" :product="scope.row.product">
|
||||
<template #default="{ product }">
|
||||
{{ product.productName || '未知' }}[{{ product.specification || '无规格' }}] - (材质：{{ product.material || '无材质' }})
|
||||
</template>
|
||||
</ProductInfo>
|
||||
<RawMaterialInfo v-else-if="scope.row.itemType === 'raw_material'" :material="scope.row.rawMaterial">
|
||||
<template #default="{ material }">
|
||||
{{ material.rawMaterialName || '未知' }}[{{ material.specification || '无规格' }}] - (材质：{{ material.material || '无材质' }})
|
||||
</template>
|
||||
</RawMaterialInfo>
|
||||
<ProductInfo v-if="scope.row.itemType === 'product'" :product="scope.row.product" />
|
||||
<RawMaterialInfo v-else-if="scope.row.itemType === 'raw_material'" :material="scope.row.rawMaterial" />
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
@@ -103,16 +95,8 @@
|
||||
</el-table-column>
|
||||
<el-table-column label="产品类型" align="center" min-width="250">
|
||||
<template slot-scope="scope">
|
||||
<ProductInfo v-if="scope.row.itemType === 'product'" :product="scope.row.product">
|
||||
<template #default="{ product }">
|
||||
{{ product.itemName || '未知' }}({{ product.itemCode || '无编码' }})
|
||||
</template>
|
||||
</ProductInfo>
|
||||
<RawMaterialInfo v-else-if="scope.row.itemType === 'raw_material'" :material="scope.row.rawMaterial">
|
||||
<template #default="{ material }">
|
||||
{{ material.itemName || '未知' }}({{ material.itemCode || '无编码' }})
|
||||
</template>
|
||||
</RawMaterialInfo>
|
||||
<ProductInfo v-if="scope.row.itemType === 'product'" :product="scope.row.product" />
|
||||
<RawMaterialInfo v-else-if="scope.row.itemType === 'raw_material'" :material="scope.row.rawMaterial" />
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="更新时间" align="center" prop="updateTime" />
|
||||
|
||||
@@ -64,16 +64,8 @@
|
||||
min-width="250"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
<ProductInfo v-if="scope.row.itemType === 'product'" :product="scope.row.product">
|
||||
<template #default="{ product }">
|
||||
{{ product.productName || '未知' }}({{ product.productCode || '无编码' }})
|
||||
</template>
|
||||
</ProductInfo>
|
||||
<RawMaterialInfo v-else-if="scope.row.itemType === 'raw_material'" :material="scope.row.rawMaterial">
|
||||
<template #default="{ material }">
|
||||
{{ material.rawMaterialName || '未知' }}({{ material.rawMaterialCode || '无编码' }})
|
||||
</template>
|
||||
</RawMaterialInfo>
|
||||
<ProductInfo v-if="scope.row.itemType === 'product'" :product="scope.row.product" />
|
||||
<RawMaterialInfo v-else-if="scope.row.itemType === 'raw_material'" :material="scope.row.rawMaterial" />
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
|
||||
@@ -47,8 +47,8 @@
|
||||
</el-table-column>
|
||||
<el-table-column label="产品类型" align="center" min-width="250">
|
||||
<template slot-scope="scope">
|
||||
<ProductInfo v-if="scope.row.itemType === 'product'" :product="scope.row.product"></ProductInfo>
|
||||
<RawMaterialInfo v-else-if="scope.row.itemType === 'raw_material'" :material="scope.row.rawMaterial"></RawMaterialInfo>
|
||||
<ProductInfo v-if="scope.row.itemType === 'product'" :product="scope.row.product" />
|
||||
<RawMaterialInfo v-else-if="scope.row.itemType === 'raw_material'" :material="scope.row.rawMaterial" />
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="更新时间" align="center" prop="updateTime" />
|
||||
|
||||
@@ -85,18 +85,10 @@
|
||||
<el-table-column label="逻辑库位" align="center" prop="warehouseName" v-if="!hideWarehouseQuery" />
|
||||
<el-table-column label="实际库区" align="center" prop="actualWarehouseName" v-if="!hideWarehouseQuery" />
|
||||
<!-- <el-table-column label="物料类型" align="center" prop="materialType" /> -->
|
||||
<el-table-column label="产品类型" align="center">
|
||||
<el-table-column label="产品类型" align="center" width="220">
|
||||
<template slot-scope="scope">
|
||||
<ProductInfo v-if="scope.row.itemType == 'product'" :product="scope.row.product">
|
||||
<template slot-scope="{ product }">
|
||||
{{ product.productName }}[{{ product.specification }}]
|
||||
</template>
|
||||
</ProductInfo>
|
||||
<RawMaterialInfo v-else-if="scope.row.itemType === 'raw_material'" :material="scope.row.rawMaterial">
|
||||
<template slot-scope="{ material }">
|
||||
{{ material.rawMaterialName }}[{{ material.specification }}]
|
||||
</template>
|
||||
</RawMaterialInfo>
|
||||
<ProductInfo v-if="scope.row.itemType == 'product'" :product="scope.row.product" />
|
||||
<RawMaterialInfo v-else-if="scope.row.itemType === 'raw_material'" :material="scope.row.rawMaterial" />
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column v-if="showAbnormal" label="异常数量" align="center" prop="abnormalCount"></el-table-column>
|
||||
|
||||
@@ -57,11 +57,7 @@
|
||||
<KLPTable v-loading="loading" :data="orderDetailList">
|
||||
<el-table-column label="产品" align="center">
|
||||
<template slot-scope="scope">
|
||||
<ProductInfo :product-id="scope.row.productId">
|
||||
<template #default="{ product }">
|
||||
{{ product.productName }}<span v-if="product.productCode">({{ product.productCode }})</span>
|
||||
</template>
|
||||
</ProductInfo>
|
||||
<ProductInfo :product-id="scope.row.productId" />
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="参数" align="center">
|
||||
|
||||
@@ -36,18 +36,10 @@
|
||||
<dict-tag :options="dict.type.stock_item_type" :value="scope.row.itemType" />
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="产品类型" align="center" prop="itemName">
|
||||
<el-table-column label="产品类型" align="center" prop="itemName" width="220">
|
||||
<template slot-scope="scope">
|
||||
<ProductInfo v-if="scope.row.itemType == 'product' || scope.row.itemType == 'semi'" :product="scope.row.product">
|
||||
<template #default="{ product }">
|
||||
{{ product.productName }}[{{ product.specification }}]
|
||||
</template>
|
||||
</ProductInfo>
|
||||
<RawMaterialInfo v-else-if="scope.row.itemType === 'raw_material'" :material="scope.row.rawMaterial">
|
||||
<template #default="{ material }">
|
||||
{{ material.rawMaterialName }}[{{ material.specification }}]
|
||||
</template>
|
||||
</RawMaterialInfo>
|
||||
<ProductInfo v-if="scope.row.itemType == 'product' || scope.row.itemType == 'semi'" :product="scope.row.product" />
|
||||
<RawMaterialInfo v-else-if="scope.row.itemType === 'raw_material'" :material="scope.row.rawMaterial" />
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="参数">
|
||||
|
||||
@@ -1,319 +0,0 @@
|
||||
<template>
|
||||
<div class="app-container">
|
||||
<el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px">
|
||||
<el-form-item label="工艺编码" prop="processCode">
|
||||
<el-input
|
||||
v-model="queryParams.processCode"
|
||||
placeholder="请输入工艺编码"
|
||||
clearable
|
||||
@keyup.enter.native="handleQuery"
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item label="工艺名称" prop="processName">
|
||||
<el-input
|
||||
v-model="queryParams.processName"
|
||||
placeholder="请输入工艺名称"
|
||||
clearable
|
||||
@keyup.enter.native="handleQuery"
|
||||
/>
|
||||
</el-form-item>
|
||||
<!-- <el-form-item label="产出产品" prop="outputProductId">
|
||||
<el-input
|
||||
v-model="queryParams.outputProductId"
|
||||
placeholder="请输入产出产品"
|
||||
clearable
|
||||
@keyup.enter.native="handleQuery"
|
||||
/>
|
||||
</el-form-item> -->
|
||||
<el-form-item label="工艺描述" prop="processDesc">
|
||||
<el-input
|
||||
v-model="queryParams.processDesc"
|
||||
placeholder="请输入工艺描述"
|
||||
clearable
|
||||
@keyup.enter.native="handleQuery"
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item label="标准工时" prop="standardTime">
|
||||
<el-input
|
||||
v-model="queryParams.standardTime"
|
||||
placeholder="请输入标准工时"
|
||||
clearable
|
||||
@keyup.enter.native="handleQuery"
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
|
||||
<el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
|
||||
<el-row :gutter="10" class="mb8">
|
||||
<el-col :span="1.5">
|
||||
<el-button
|
||||
type="primary"
|
||||
plain
|
||||
icon="el-icon-plus"
|
||||
size="mini"
|
||||
@click="handleAdd"
|
||||
>新增</el-button>
|
||||
</el-col>
|
||||
<el-col :span="1.5">
|
||||
<el-button
|
||||
type="success"
|
||||
plain
|
||||
icon="el-icon-edit"
|
||||
size="mini"
|
||||
:disabled="single"
|
||||
@click="handleUpdate"
|
||||
>修改</el-button>
|
||||
</el-col>
|
||||
<el-col :span="1.5">
|
||||
<el-button
|
||||
type="danger"
|
||||
plain
|
||||
icon="el-icon-delete"
|
||||
size="mini"
|
||||
:disabled="multiple"
|
||||
@click="handleDelete"
|
||||
>删除</el-button>
|
||||
</el-col>
|
||||
<el-col :span="1.5">
|
||||
<el-button
|
||||
type="warning"
|
||||
plain
|
||||
icon="el-icon-download"
|
||||
size="mini"
|
||||
@click="handleExport"
|
||||
>导出</el-button>
|
||||
</el-col>
|
||||
<right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
|
||||
</el-row>
|
||||
|
||||
<KLPTable v-loading="loading" :data="processeList" @selection-change="handleSelectionChange">
|
||||
<el-table-column type="selection" width="55" align="center" />
|
||||
<el-table-column label="工艺ID" align="center" prop="processId" v-if="false"/>
|
||||
<el-table-column label="工艺编码" align="center" prop="processCode" />
|
||||
<el-table-column label="工艺名称" align="center" prop="processName" />
|
||||
<!-- <el-table-column label="产出产品" align="center" prop="outputProductId" /> -->
|
||||
<el-table-column label="工艺描述" align="center" prop="processDesc" />
|
||||
<el-table-column label="标准工时" align="center" prop="standardTime" />
|
||||
<el-table-column label="备注" align="center" prop="remark" />
|
||||
<el-table-column label="操作" align="center" class-name="small-padding fixed-width">
|
||||
<template slot-scope="scope">
|
||||
<el-button
|
||||
size="mini"
|
||||
type="text"
|
||||
icon="el-icon-edit"
|
||||
@click="handleUpdate(scope.row)"
|
||||
>修改</el-button>
|
||||
<el-button
|
||||
size="mini"
|
||||
type="text"
|
||||
icon="el-icon-delete"
|
||||
@click="handleDelete(scope.row)"
|
||||
>删除</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</KLPTable>
|
||||
|
||||
<pagination
|
||||
v-show="total>0"
|
||||
:total="total"
|
||||
:page.sync="queryParams.pageNum"
|
||||
:limit.sync="queryParams.pageSize"
|
||||
@pagination="getList"
|
||||
/>
|
||||
|
||||
<!-- 添加或修改工艺对话框 -->
|
||||
<el-dialog :title="title" :visible.sync="open" width="500px" append-to-body>
|
||||
<el-form ref="form" :model="form" :rules="rules" label-width="80px">
|
||||
<el-form-item label="工艺编码" prop="processCode">
|
||||
<el-input v-model="form.processCode" placeholder="请输入工艺编码" />
|
||||
</el-form-item>
|
||||
<el-form-item label="工艺名称" prop="processName">
|
||||
<el-input v-model="form.processName" placeholder="请输入工艺名称" />
|
||||
</el-form-item>
|
||||
<!-- <el-form-item label="产出产品" prop="outputProductId">
|
||||
<el-input v-model="form.outputProductId" placeholder="请输入产出产品" />
|
||||
</el-form-item> -->
|
||||
<el-form-item label="工艺描述" prop="processDesc">
|
||||
<el-input v-model="form.processDesc" type="textarea" placeholder="请输入内容" />
|
||||
</el-form-item>
|
||||
<el-form-item label="标准工时" prop="standardTime">
|
||||
<el-input v-model="form.standardTime" placeholder="请输入标准工时" />
|
||||
</el-form-item>
|
||||
<el-form-item label="备注" prop="remark">
|
||||
<el-input v-model="form.remark" placeholder="请输入备注" />
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<div slot="footer" class="dialog-footer">
|
||||
<el-button :loading="buttonLoading" type="primary" @click="submitForm">确 定</el-button>
|
||||
<el-button @click="cancel">取 消</el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { listProcesse, getProcesse, delProcesse, addProcesse, updateProcesse } from "@/api/wms/craft";
|
||||
|
||||
export default {
|
||||
name: "Processe",
|
||||
data() {
|
||||
return {
|
||||
// 按钮loading
|
||||
buttonLoading: false,
|
||||
// 遮罩层
|
||||
loading: true,
|
||||
// 选中数组
|
||||
ids: [],
|
||||
// 非单个禁用
|
||||
single: true,
|
||||
// 非多个禁用
|
||||
multiple: true,
|
||||
// 显示搜索条件
|
||||
showSearch: true,
|
||||
// 总条数
|
||||
total: 0,
|
||||
// 工艺表格数据
|
||||
processeList: [],
|
||||
// 弹出层标题
|
||||
title: "",
|
||||
// 是否显示弹出层
|
||||
open: false,
|
||||
// 查询参数
|
||||
queryParams: {
|
||||
pageNum: 1,
|
||||
pageSize: 20,
|
||||
processCode: undefined,
|
||||
processName: undefined,
|
||||
outputProductId: undefined,
|
||||
processDesc: undefined,
|
||||
standardTime: undefined,
|
||||
},
|
||||
// 表单参数
|
||||
form: {},
|
||||
// 表单校验
|
||||
rules: {
|
||||
}
|
||||
};
|
||||
},
|
||||
created() {
|
||||
this.getList();
|
||||
},
|
||||
methods: {
|
||||
/** 查询工艺列表 */
|
||||
getList() {
|
||||
this.loading = true;
|
||||
listProcesse(this.queryParams).then(response => {
|
||||
this.processeList = response.rows;
|
||||
this.total = response.total;
|
||||
this.loading = false;
|
||||
});
|
||||
},
|
||||
// 取消按钮
|
||||
cancel() {
|
||||
this.open = false;
|
||||
this.reset();
|
||||
},
|
||||
// 表单重置
|
||||
reset() {
|
||||
this.form = {
|
||||
processId: undefined,
|
||||
processCode: undefined,
|
||||
processName: undefined,
|
||||
outputProductId: undefined,
|
||||
processDesc: undefined,
|
||||
standardTime: undefined,
|
||||
delFlag: undefined,
|
||||
remark: undefined,
|
||||
createTime: undefined,
|
||||
createBy: undefined,
|
||||
updateTime: undefined,
|
||||
updateBy: undefined
|
||||
};
|
||||
this.resetForm("form");
|
||||
},
|
||||
/** 搜索按钮操作 */
|
||||
handleQuery() {
|
||||
this.queryParams.pageNum = 1;
|
||||
this.getList();
|
||||
},
|
||||
/** 重置按钮操作 */
|
||||
resetQuery() {
|
||||
this.resetForm("queryForm");
|
||||
this.handleQuery();
|
||||
},
|
||||
// 多选框选中数据
|
||||
handleSelectionChange(selection) {
|
||||
this.ids = selection.map(item => item.processId)
|
||||
this.single = selection.length!==1
|
||||
this.multiple = !selection.length
|
||||
},
|
||||
/** 新增按钮操作 */
|
||||
handleAdd() {
|
||||
this.reset();
|
||||
this.open = true;
|
||||
this.title = "添加工艺";
|
||||
},
|
||||
/** 修改按钮操作 */
|
||||
handleUpdate(row) {
|
||||
this.loading = true;
|
||||
this.reset();
|
||||
const processId = row.processId || this.ids
|
||||
getProcesse(processId).then(response => {
|
||||
this.loading = false;
|
||||
this.form = response.data;
|
||||
this.open = true;
|
||||
this.title = "修改工艺";
|
||||
});
|
||||
},
|
||||
/** 提交按钮 */
|
||||
submitForm() {
|
||||
this.$refs["form"].validate(valid => {
|
||||
if (valid) {
|
||||
this.buttonLoading = true;
|
||||
if (this.form.processId != null) {
|
||||
updateProcesse(this.form).then(response => {
|
||||
this.$modal.msgSuccess("修改成功");
|
||||
this.open = false;
|
||||
this.getList();
|
||||
}).finally(() => {
|
||||
this.buttonLoading = false;
|
||||
});
|
||||
} else {
|
||||
addProcesse(this.form).then(response => {
|
||||
this.$modal.msgSuccess("新增成功");
|
||||
this.open = false;
|
||||
this.getList();
|
||||
}).finally(() => {
|
||||
this.buttonLoading = false;
|
||||
});
|
||||
}
|
||||
}
|
||||
});
|
||||
},
|
||||
/** 删除按钮操作 */
|
||||
handleDelete(row) {
|
||||
const processIds = row.processId || this.ids;
|
||||
this.$modal.confirm('是否确认删除工艺编号为"' + processIds + '"的数据项？').then(() => {
|
||||
this.loading = true;
|
||||
return delProcesse(processIds);
|
||||
}).then(() => {
|
||||
this.loading = false;
|
||||
this.getList();
|
||||
this.$modal.msgSuccess("删除成功");
|
||||
}).catch(() => {
|
||||
}).finally(() => {
|
||||
this.loading = false;
|
||||
});
|
||||
},
|
||||
/** 导出按钮操作 */
|
||||
handleExport() {
|
||||
this.download('klp/processe/export', {
|
||||
...this.queryParams
|
||||
}, `processe_${new Date().getTime()}.xlsx`)
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
@@ -1,196 +0,0 @@
|
||||
<template>
|
||||
<div ref="ganttChart" class="echarts-gantt-wrapper" style="width:100%;height:320px;"></div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import * as echarts from 'echarts';
|
||||
const colorList = [
|
||||
'#409EFF', '#67C23A', '#E6A23C', '#F56C6C', '#909399',
|
||||
'#13C2C2', '#B37FEB', '#FF85C0', '#36CBCB', '#FFC53D'
|
||||
];
|
||||
function getColor(lineId, orderId, idx) {
|
||||
if (!lineId) return colorList[idx % colorList.length];
|
||||
const base = Math.abs(Number(lineId)) % colorList.length;
|
||||
if (!orderId) return colorList[base];
|
||||
return colorList[(base + Math.abs(Number(orderId)) % colorList.length) % colorList.length];
|
||||
}
|
||||
export default {
|
||||
name: 'GanttChartEcharts',
|
||||
props: {
|
||||
tasks: {
|
||||
type: Array,
|
||||
default: () => []
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
chart: null
|
||||
};
|
||||
},
|
||||
watch: {
|
||||
tasks: {
|
||||
handler() {
|
||||
this.renderChart();
|
||||
},
|
||||
deep: true
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
this.renderChart();
|
||||
window.addEventListener('resize', this.resizeChart);
|
||||
},
|
||||
beforeDestroy() {
|
||||
if (this.chart) this.chart.dispose();
|
||||
window.removeEventListener('resize', this.resizeChart);
|
||||
},
|
||||
methods: {
|
||||
renderChart() {
|
||||
if (!this.$refs.ganttChart) return;
|
||||
if (this.chart) this.chart.dispose();
|
||||
this.chart = echarts.init(this.$refs.ganttChart);
|
||||
if (!this.tasks || this.tasks.length === 0) {
|
||||
this.chart.clear();
|
||||
return;
|
||||
}
|
||||
// 处理数据，兼容多种字段名，保证任务名唯一
|
||||
const taskData = this.tasks.map((item, idx) => {
|
||||
const name = (item.remark || item.taskName || item.productName || item.name || `任务${idx+1}`) + (item.productName ? `-${item.productName}` : '');
|
||||
const start = item.startDate || item.start_time || item.start || item.start_date;
|
||||
const end = item.endDate || item.end_time || item.end || item.end_date;
|
||||
console.log(item.lineId, item.orderId, idx, '颜色取值依据')
|
||||
return {
|
||||
name,
|
||||
value: [start, end],
|
||||
itemStyle: {
|
||||
color: getColor(item.lineId, item.orderId, idx),
|
||||
borderRadius: 6
|
||||
},
|
||||
lineId: item.lineId,
|
||||
orderId: item.orderId,
|
||||
productId: item.productId,
|
||||
quantity: item.quantity,
|
||||
startDate: start,
|
||||
endDate: end
|
||||
};
|
||||
});
|
||||
// 先全部用 getColor 分配基础色
|
||||
taskData.forEach((item, idx) => {
|
||||
item._color = getColor(item.lineId, item.orderId, idx);
|
||||
});
|
||||
// 检查冲突（同产线时间重叠），有冲突的都标红
|
||||
for (let i = 0; i < taskData.length; i++) {
|
||||
for (let j = i + 1; j < taskData.length; j++) {
|
||||
if (
|
||||
taskData[i].lineId &&
|
||||
taskData[i].lineId === taskData[j].lineId &&
|
||||
new Date(taskData[i].value[0]) < new Date(taskData[j].value[1]) &&
|
||||
new Date(taskData[i].value[1]) > new Date(taskData[j].value[0])
|
||||
) {
|
||||
taskData[i]._color = '#F56C6C';
|
||||
taskData[j]._color = '#F56C6C';
|
||||
}
|
||||
}
|
||||
}
|
||||
// 颜色映射
|
||||
const colorMap = taskData.map(d => d._color);
|
||||
// Y轴任务名
|
||||
const yData = taskData.map(d => d.name);
|
||||
// X轴时间范围
|
||||
const minDate = Math.min(...taskData.map(d => new Date(d.value[0]).getTime()));
|
||||
const maxDate = Math.max(...taskData.map(d => new Date(d.value[1]).getTime()));
|
||||
// 自动调整时间轴范围，避免跨度过大导致任务条重叠
|
||||
const oneMonth = 30 * 24 * 3600 * 1000;
|
||||
let xMin = minDate - oneMonth;
|
||||
let xMax = maxDate + oneMonth;
|
||||
// 如果跨度大于一年，仍然只扩展一个月
|
||||
// 如果跨度小于一个月，最小跨度为两个月
|
||||
if (xMax - xMin < 2 * oneMonth) {
|
||||
xMax = xMin + 2 * oneMonth;
|
||||
}
|
||||
console.log(taskData);
|
||||
|
||||
// 配置
|
||||
const option = {
|
||||
tooltip: {
|
||||
confine: true,
|
||||
formatter: params => {
|
||||
// 用 params.data[2] 作为索引查找 taskData
|
||||
const idx = params.data && params.data[2];
|
||||
const d = (typeof idx === 'number' && taskData[idx]) ? taskData[idx] : {};
|
||||
return `任务：${d.name || ''}` +
|
||||
`<br/>开始：${d.startDate || ''}` +
|
||||
`<br/>结束：${d.endDate || ''}` +
|
||||
`<br/>日产能：${d.capacity != null ? d.capacity : d.capacity || ''}` +
|
||||
`<br/>总产能：${d.totalCapacity != null ? d.totalCapacity : d.total_capacity || ''}` +
|
||||
`<br/>目标生产：${d.planQuantity != null ? d.planQuantity : d.plan_quantity || ''}` +
|
||||
`<br/>天数：${d.days != null ? d.days : d.day || ''}` +
|
||||
`<br/>数量：${d.quantity != null ? d.quantity : ''}`;
|
||||
}
|
||||
},
|
||||
grid: { left: 120, right: 40, top: 30, bottom: 80 },
|
||||
xAxis: {
|
||||
type: 'time',
|
||||
min: xMin,
|
||||
max: xMax,
|
||||
axisLabel: {
|
||||
formatter: v => echarts.format.formatTime('yyyy-MM-dd', v),
|
||||
rotate: 45 // 关键：倾斜45度
|
||||
}
|
||||
},
|
||||
yAxis: {
|
||||
type: 'category',
|
||||
data: yData,
|
||||
axisTick: { show: false },
|
||||
axisLine: { show: false },
|
||||
axisLabel: { fontWeight: 'bold' }
|
||||
},
|
||||
series: [{
|
||||
type: 'custom',
|
||||
renderItem: (params, api) => {
|
||||
const categoryIndex = api.value(2);
|
||||
const start = api.coord([api.value(0), categoryIndex]);
|
||||
const end = api.coord([api.value(1), categoryIndex]);
|
||||
const barHeight = 18;
|
||||
// 颜色从 colorMap 查
|
||||
const idx = params.dataIndex;
|
||||
let fillColor = colorMap[idx] || '#409EFF';
|
||||
return {
|
||||
type: 'rect',
|
||||
shape: {
|
||||
x: start[0],
|
||||
y: start[1] - barHeight / 2,
|
||||
width: end[0] - start[0],
|
||||
height: barHeight,
|
||||
r: 6
|
||||
},
|
||||
style: {
|
||||
fill: fillColor
|
||||
}
|
||||
};
|
||||
},
|
||||
encode: {
|
||||
x: [0, 1],
|
||||
y: 2
|
||||
},
|
||||
data: taskData.map((d, i) => [d.value[0], d.value[1], i]),
|
||||
itemStyle: {
|
||||
borderRadius: 6
|
||||
}
|
||||
}]
|
||||
};
|
||||
this.chart.setOption(option);
|
||||
},
|
||||
resizeChart() {
|
||||
if (this.chart) this.chart.resize();
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style>
|
||||
.echarts-gantt-wrapper {
|
||||
width: 100%;
|
||||
min-height: 220px;
|
||||
background: #fff;
|
||||
}
|
||||
</style>
|
||||
@@ -1,416 +0,0 @@
|
||||
<template>
|
||||
<div class="production-line-page">
|
||||
<el-tabs v-model="activeTab">
|
||||
<el-tab-pane label="列表" name="list">
|
||||
<!-- 原有列表内容 -->
|
||||
<div v-show="activeTab === 'list'">
|
||||
<!-- 保持原有内容不变 -->
|
||||
<div class="list-content">
|
||||
<el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px">
|
||||
<el-form-item label="产线编号" prop="lineCode">
|
||||
<el-input
|
||||
v-model="queryParams.lineCode"
|
||||
placeholder="请输入产线编号"
|
||||
clearable
|
||||
@keyup.enter.native="handleQuery"
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item label="产线名称" prop="lineName">
|
||||
<el-input
|
||||
v-model="queryParams.lineName"
|
||||
placeholder="请输入产线名称"
|
||||
clearable
|
||||
@keyup.enter.native="handleQuery"
|
||||
/>
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item>
|
||||
<el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
|
||||
<el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
|
||||
<el-row :gutter="10" class="mb8">
|
||||
<el-col :span="1.5">
|
||||
<el-button
|
||||
type="primary"
|
||||
plain
|
||||
icon="el-icon-plus"
|
||||
size="mini"
|
||||
@click="handleAdd"
|
||||
>新增</el-button>
|
||||
</el-col>
|
||||
<el-col :span="1.5">
|
||||
<el-button
|
||||
type="success"
|
||||
plain
|
||||
icon="el-icon-edit"
|
||||
size="mini"
|
||||
:disabled="single"
|
||||
@click="handleUpdate"
|
||||
>修改</el-button>
|
||||
</el-col>
|
||||
<el-col :span="1.5">
|
||||
<el-button
|
||||
type="danger"
|
||||
plain
|
||||
icon="el-icon-delete"
|
||||
size="mini"
|
||||
:disabled="multiple"
|
||||
@click="handleDelete"
|
||||
>删除</el-button>
|
||||
</el-col>
|
||||
<el-col :span="1.5">
|
||||
<el-button
|
||||
type="warning"
|
||||
plain
|
||||
icon="el-icon-download"
|
||||
size="mini"
|
||||
@click="handleExport"
|
||||
>导出</el-button>
|
||||
</el-col>
|
||||
<right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
|
||||
</el-row>
|
||||
|
||||
<KLPTable v-loading="loading" :data="productionLineList" @selection-change="handleSelectionChange">
|
||||
<el-table-column type="selection" width="55" align="center" />
|
||||
<el-table-column label="产线编号" align="center" prop="lineCode" />
|
||||
<el-table-column label="产线名称" align="center" prop="lineName" />
|
||||
<el-table-column label="日产能" align="center" prop="capacity" />
|
||||
<el-table-column label="负载任务数/预计耗时" align="center" prop="unit">
|
||||
<template slot-scope="scope">
|
||||
<span>{{ scope.row.planDetailCount }}</span> /
|
||||
<span>{{ scope.row.totalPlanDays }}天</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="产能单位" align="center" prop="unit" />
|
||||
<el-table-column label="是否启用" align="center" prop="isEnabled">
|
||||
<template slot-scope="scope">
|
||||
<el-switch
|
||||
v-model="scope.row.isEnabled"
|
||||
:active-value="1"
|
||||
:inactive-value="0"
|
||||
active-text="启用"
|
||||
inactive-text="禁用"
|
||||
@change="handleEnabledChange(scope.row)"
|
||||
/>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="备注" align="center" prop="remark" />
|
||||
<el-table-column label="操作" align="center" class-name="small-padding fixed-width">
|
||||
<template slot-scope="scope">
|
||||
<el-button
|
||||
size="mini"
|
||||
type="text"
|
||||
icon="el-icon-edit"
|
||||
@click="handleUpdate(scope.row)"
|
||||
>修改</el-button>
|
||||
<el-button
|
||||
size="mini"
|
||||
type="text"
|
||||
icon="el-icon-delete"
|
||||
@click="handleDelete(scope.row)"
|
||||
>删除</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</KLPTable>
|
||||
|
||||
<pagination
|
||||
v-show="total>0"
|
||||
:total="total"
|
||||
:page.sync="queryParams.pageNum"
|
||||
:limit.sync="queryParams.pageSize"
|
||||
@pagination="getList"
|
||||
/>
|
||||
|
||||
<!-- 添加或修改产线对话框 -->
|
||||
<el-dialog :title="title" :visible.sync="open" width="500px" append-to-body>
|
||||
<el-form ref="form" :model="form" :rules="rules" label-width="80px">
|
||||
<el-form-item label="产线编号" prop="lineCode">
|
||||
<el-input v-model="form.lineCode" placeholder="请输入产线编号" />
|
||||
</el-form-item>
|
||||
<el-form-item label="产线名称" prop="lineName">
|
||||
<el-input v-model="form.lineName" placeholder="请输入产线名称" />
|
||||
</el-form-item>
|
||||
<el-form-item label="日产能" prop="capacity">
|
||||
<el-input v-model="form.capacity" placeholder="请输入日产能" />
|
||||
</el-form-item>
|
||||
<el-form-item label="产能单位" prop="unit">
|
||||
<el-input v-model="form.unit" placeholder="请输入产能单位" />
|
||||
</el-form-item>
|
||||
<el-form-item label="是否启用" prop="isEnabled">
|
||||
<el-switch
|
||||
v-model="form.isEnabled"
|
||||
:active-value="1"
|
||||
:inactive-value="0"
|
||||
active-text="启用"
|
||||
inactive-text="禁用"
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item label="备注" prop="remark">
|
||||
<el-input v-model="form.remark" placeholder="请输入备注" />
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<div slot="footer" class="dialog-footer">
|
||||
<el-button :loading="buttonLoading" type="primary" @click="submitForm">确 定</el-button>
|
||||
<el-button @click="cancel">取 消</el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</div>
|
||||
</el-tab-pane>
|
||||
<el-tab-pane label="甘特图" name="gantt">
|
||||
<div v-show="activeTab === 'gantt'">
|
||||
<div style="margin-bottom: 16px; display: flex; gap: 16px; align-items: center;">
|
||||
<el-select v-model="selectedLineId" placeholder="选择产线" style="width: 180px" @change="fetchGanttData">
|
||||
<el-option v-for="item in lineList" :key="item.lineId" :label="item.lineName" :value="item.lineId" />
|
||||
</el-select>
|
||||
</div>
|
||||
<GanttChartEcharts :tasks="ganttTasks" v-if="ganttTasks.length > 0" />
|
||||
<el-empty v-else description="暂无甘特图数据" />
|
||||
</div>
|
||||
</el-tab-pane>
|
||||
</el-tabs>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import GanttChartEcharts from './GanttChartEcharts.vue';
|
||||
import { listProductionLine, getProductionLine, delProductionLine, addProductionLine, updateProductionLine, ganttProductionLine } from "@/api/wms/productionLine";
|
||||
import { listOrder } from '@/api/wms/order';
|
||||
|
||||
export default {
|
||||
name: "ProductionLine",
|
||||
components: { GanttChartEcharts },
|
||||
data() {
|
||||
return {
|
||||
// 按钮loading
|
||||
buttonLoading: false,
|
||||
// 遮罩层
|
||||
loading: true,
|
||||
// 选中数组
|
||||
ids: [],
|
||||
// 非单个禁用
|
||||
single: true,
|
||||
// 非多个禁用
|
||||
multiple: true,
|
||||
// 显示搜索条件
|
||||
showSearch: true,
|
||||
// 总条数
|
||||
total: 0,
|
||||
// 产线表格数据
|
||||
productionLineList: [],
|
||||
// 弹出层标题
|
||||
title: "",
|
||||
// 是否显示弹出层
|
||||
open: false,
|
||||
// 查询参数
|
||||
queryParams: {
|
||||
pageNum: 1,
|
||||
pageSize: 20,
|
||||
lineCode: undefined,
|
||||
lineName: undefined,
|
||||
capacity: undefined,
|
||||
unit: undefined,
|
||||
isEnabled: undefined,
|
||||
},
|
||||
// 表单参数
|
||||
form: {},
|
||||
// 表单校验
|
||||
rules: {
|
||||
lineCode: [
|
||||
{ required: true, message: "产线编号不能为空", trigger: "blur" }
|
||||
],
|
||||
lineName: [
|
||||
{ required: true, message: "产线名称不能为空", trigger: "blur" }
|
||||
],
|
||||
capacity: [
|
||||
{ required: true, message: "日产能不能为空", trigger: "blur" }
|
||||
],
|
||||
unit: [
|
||||
{ required: true, message: "产能单位不能为空", trigger: "blur" }
|
||||
],
|
||||
isEnabled: [
|
||||
{ required: true, message: "是否启用不能为空", trigger: "blur" }
|
||||
],
|
||||
},
|
||||
activeTab: 'list',
|
||||
lineList: [],
|
||||
orderList: [],
|
||||
selectedLineId: null,
|
||||
selectedOrderId: null,
|
||||
ganttTasks: [],
|
||||
ganttOrders: [],
|
||||
ganttOrder: {},
|
||||
ganttOrderDetails: []
|
||||
};
|
||||
},
|
||||
created() {
|
||||
this.getList();
|
||||
this.loadLines();
|
||||
this.loadOrders();
|
||||
},
|
||||
methods: {
|
||||
/** 查询产线列表 */
|
||||
getList() {
|
||||
this.loading = true;
|
||||
listProductionLine(this.queryParams).then(response => {
|
||||
this.productionLineList = response.rows;
|
||||
this.total = response.total;
|
||||
this.loading = false;
|
||||
});
|
||||
},
|
||||
// 取消按钮
|
||||
cancel() {
|
||||
this.open = false;
|
||||
this.reset();
|
||||
},
|
||||
// 表单重置
|
||||
reset() {
|
||||
this.form = {
|
||||
lineId: undefined,
|
||||
lineCode: undefined,
|
||||
lineName: undefined,
|
||||
capacity: undefined,
|
||||
unit: undefined,
|
||||
isEnabled: undefined,
|
||||
remark: undefined,
|
||||
createTime: undefined,
|
||||
createBy: undefined,
|
||||
updateTime: undefined,
|
||||
updateBy: undefined
|
||||
};
|
||||
this.resetForm("form");
|
||||
},
|
||||
/** 搜索按钮操作 */
|
||||
handleQuery() {
|
||||
this.queryParams.pageNum = 1;
|
||||
this.getList();
|
||||
},
|
||||
/** 重置按钮操作 */
|
||||
resetQuery() {
|
||||
this.resetForm("queryForm");
|
||||
this.handleQuery();
|
||||
},
|
||||
// 多选框选中数据
|
||||
handleSelectionChange(selection) {
|
||||
this.ids = selection.map(item => item.lineId)
|
||||
this.single = selection.length!==1
|
||||
this.multiple = !selection.length
|
||||
},
|
||||
/** 新增按钮操作 */
|
||||
handleAdd() {
|
||||
this.reset();
|
||||
this.open = true;
|
||||
this.title = "添加产线";
|
||||
},
|
||||
/** 修改按钮操作 */
|
||||
handleUpdate(row) {
|
||||
this.loading = true;
|
||||
this.reset();
|
||||
const lineId = row.lineId || this.ids
|
||||
getProductionLine(lineId).then(response => {
|
||||
this.loading = false;
|
||||
this.form = response.data;
|
||||
this.open = true;
|
||||
this.title = "修改产线";
|
||||
});
|
||||
},
|
||||
/** 提交按钮 */
|
||||
submitForm() {
|
||||
this.$refs["form"].validate(valid => {
|
||||
if (valid) {
|
||||
this.buttonLoading = true;
|
||||
if (this.form.lineId != null) {
|
||||
updateProductionLine(this.form).then(response => {
|
||||
this.$modal.msgSuccess("修改成功");
|
||||
this.open = false;
|
||||
this.getList();
|
||||
}).finally(() => {
|
||||
this.buttonLoading = false;
|
||||
});
|
||||
} else {
|
||||
addProductionLine(this.form).then(response => {
|
||||
this.$modal.msgSuccess("新增成功");
|
||||
this.open = false;
|
||||
this.getList();
|
||||
}).finally(() => {
|
||||
this.buttonLoading = false;
|
||||
});
|
||||
}
|
||||
}
|
||||
});
|
||||
},
|
||||
/** 删除按钮操作 */
|
||||
handleDelete(row) {
|
||||
const lineIds = row.lineId || this.ids;
|
||||
this.$modal.confirm('是否确认删除产线编号为"' + lineIds + '"的数据项？').then(() => {
|
||||
this.loading = true;
|
||||
return delProductionLine(lineIds);
|
||||
}).then(() => {
|
||||
this.loading = false;
|
||||
this.getList();
|
||||
this.$modal.msgSuccess("删除成功");
|
||||
}).catch(() => {
|
||||
}).finally(() => {
|
||||
this.loading = false;
|
||||
});
|
||||
},
|
||||
/** 导出按钮操作 */
|
||||
handleExport() {
|
||||
this.download('wms/productionLine/export', {
|
||||
...this.queryParams
|
||||
}, `productionLine_${new Date().getTime()}.xlsx`)
|
||||
},
|
||||
handleEnabledChange(row) {
|
||||
// 只更新isEnabled字段
|
||||
const updateData = {
|
||||
lineId: row.lineId,
|
||||
isEnabled: row.isEnabled
|
||||
};
|
||||
this.loading = true;
|
||||
updateProductionLine(updateData)
|
||||
.then(() => {
|
||||
this.$modal.msgSuccess("状态更新成功");
|
||||
})
|
||||
.catch(() => {
|
||||
this.$modal.msgError("状态更新失败");
|
||||
// 回滚状态
|
||||
row.isEnabled = row.isEnabled === 1 ? 0 : 1;
|
||||
})
|
||||
.finally(() => {
|
||||
this.loading = false;
|
||||
});
|
||||
},
|
||||
loadLines() {
|
||||
listProductionLine({}).then(res => {
|
||||
this.lineList = res.rows || [];
|
||||
});
|
||||
},
|
||||
loadOrders() {
|
||||
listOrder({}).then(res => {
|
||||
this.orderList = res.rows || [];
|
||||
});
|
||||
},
|
||||
fetchGanttData() {
|
||||
if (!this.selectedLineId) {
|
||||
this.ganttTasks = [];
|
||||
this.ganttOrders = [];
|
||||
return;
|
||||
}
|
||||
ganttProductionLine({
|
||||
lineId: this.selectedLineId
|
||||
}).then(res => {
|
||||
this.ganttTasks = res.data.tasks || [];
|
||||
this.ganttOrders = res.data.orders || [];
|
||||
});
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.production-line-page {
|
||||
padding: 16px;
|
||||
}
|
||||
</style>
|
||||
@@ -1,143 +0,0 @@
|
||||
<template>
|
||||
<el-row style="margin: 20px;">
|
||||
<el-col :span="12">
|
||||
<div style="max-height:60vh;overflow:auto;padding-right:8px;">
|
||||
<el-form :model="detailForm" :rules="detailRules" ref="detailForm" label-width="80px" style="overflow:visible;">
|
||||
<el-form-item label="产线" prop="lineId">
|
||||
<el-select clearable v-model="detailForm.lineId" placeholder="请选择产线" filterable @change="onLineChange">
|
||||
<el-option v-for="item in productionLineList" :key="item.lineId" :label="item.lineName"
|
||||
:value="item.lineId" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="批次" prop="batchId">
|
||||
<!-- <el-select v-model="detailForm.productId" placeholder="请选择产品" filterable>
|
||||
<el-option v-for="item in productList" :key="item.productId" :label="item.productName"
|
||||
:value="item.productId" />
|
||||
</el-select> -->
|
||||
<el-select clearable v-model="detailForm.batchId" placeholder="请选择批次" filterable @change="onBatchChange">
|
||||
<el-option v-for="item in batchList" :key="item.batchId" :label="item.batchNo" :value="item.batchId" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="排产数量" prop="quantity">
|
||||
<el-input-number :controls=false controls-position="right" v-model="detailForm.quantity" disabled :min="0.01" :step="0.01" style="width:100%" />
|
||||
</el-form-item>
|
||||
<el-form-item label="计划日期" prop="dateRange">
|
||||
<el-date-picker v-model="detailForm.dateRange" type="daterange" range-separator="至" start-placeholder="开始日期"
|
||||
end-placeholder="结束日期" style="width:100%" />
|
||||
</el-form-item>
|
||||
<el-form-item label="备注" prop="remark">
|
||||
<el-input v-model="detailForm.remark" placeholder="请输入备注" />
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</div>
|
||||
<el-button type="primary" @click="submitDetailForm">提交排产</el-button>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<div style="margin: 12px 0; max-width:100%; min-width:600px; height:220px; overflow-x:auto; overflow-y:hidden;">
|
||||
<GanttChartEcharts v-if="lineGanttTasks.length > 0 || previewTask"
|
||||
:tasks="previewTask ? [...lineGanttTasks, previewTask] : lineGanttTasks"
|
||||
style="height:220px; min-width:600px;" />
|
||||
<el-empty v-else description="请选择产线以查看排产情况" />
|
||||
</div>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { listProductionLine } from '@/api/wms/productionLine';
|
||||
import { ganttProductionLine } from '@/api/wms/productionLine';
|
||||
import { addSchedulePlanDetail, updateSchedulePlanDetail } from '@/api/wms/schedulePlanDetail';
|
||||
import { listBatch } from '@/api/wms/batch';
|
||||
|
||||
import GanttChartEcharts from '../productionLine/GanttChartEcharts.vue';
|
||||
|
||||
export default {
|
||||
components: {
|
||||
GanttChartEcharts
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
detailForm: {
|
||||
detailId: undefined,
|
||||
planId: undefined,
|
||||
lineId: undefined,
|
||||
// productId: undefined,
|
||||
batchId: undefined,
|
||||
quantity: 0,
|
||||
dateRange: [],
|
||||
startDate: '',
|
||||
endDate: '',
|
||||
remark: ''
|
||||
},
|
||||
detailRules: {
|
||||
batchId: [{ required: true, message: '请选择产品', trigger: 'change' }],
|
||||
lineId: [{ required: true, message: '请选择产线', trigger: 'change' }],
|
||||
quantity: [{ required: true, message: '请输入排产数量', trigger: 'blur' }],
|
||||
dateRange: [{ required: true, type: 'array', len: 2, message: '请选择计划日期区间', trigger: 'change' }]
|
||||
},
|
||||
lineGanttTasks: [],
|
||||
productionLineList: [],
|
||||
previewTask: null,
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.fetchBatchList();
|
||||
this.fetchProductionLineList();
|
||||
},
|
||||
methods: {
|
||||
fetchProductionLineList() {
|
||||
listProductionLine({ pageNum: 1, pageSize: 1000 }).then(res => {
|
||||
this.productionLineList = res.rows || [];
|
||||
});
|
||||
},
|
||||
onLineChange(lineId) {
|
||||
if (!lineId) {
|
||||
this.lineGanttTasks = [];
|
||||
return;
|
||||
}
|
||||
ganttProductionLine({ lineId }).then(res => {
|
||||
this.lineGanttTasks = res.data.tasks || [];
|
||||
this.updatePreviewTask();
|
||||
});
|
||||
},
|
||||
onBatchChange(batchId) {
|
||||
if (batchId) {
|
||||
// 从batchList中查找
|
||||
const batch = this.batchList.find(item => item.batchId == batchId);
|
||||
console.log(batch);
|
||||
if (batch) {
|
||||
this.detailForm.quantity = batch.totalQuantity;
|
||||
this.detailForm.dateRange = [
|
||||
batch.estimatedStartTime,
|
||||
batch.estimatedEndTime
|
||||
];
|
||||
}
|
||||
}
|
||||
},
|
||||
fetchBatchList() {
|
||||
listBatch({ pageNum: 1, pageSize: 1000 }).then(res => {
|
||||
this.batchList = res.rows || [];
|
||||
});
|
||||
},
|
||||
submitDetailForm() {
|
||||
this.$refs.detailForm.validate(valid => {
|
||||
if (!valid) return;
|
||||
if (this.detailForm.dateRange && this.detailForm.dateRange.length === 2) {
|
||||
this.detailForm.startDate = this.detailForm.dateRange[0].replace(' ', "T") + '.000Z';
|
||||
this.detailForm.endDate = this.detailForm.dateRange[1].replace(' ', "T") + '.000Z';
|
||||
} else {
|
||||
this.detailForm.startDate = '';
|
||||
this.detailForm.endDate = '';
|
||||
}
|
||||
const api = this.detailForm.detailId ? updateSchedulePlanDetail : addSchedulePlanDetail;
|
||||
const data = Object.assign({}, this.detailForm, { planId: this.planId });
|
||||
api(data).then(() => {
|
||||
this.$message.success(this.detailForm.detailId ? '修改成功' : '新增成功');
|
||||
this.detailDialogVisible = false;
|
||||
this.fetchDetailList();
|
||||
});
|
||||
});
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
@@ -1,205 +0,0 @@
|
||||
<template>
|
||||
<div class="merge-source-selector">
|
||||
<!-- 已选任务列表 -->
|
||||
<div v-if="selectedTasks.length > 0" class="selected-tasks">
|
||||
<div v-for="task in selectedTasks" :key="task.taskId" class="selected-task-item">
|
||||
<div class="task-info">
|
||||
<ProductInfo :product="task.product" />
|
||||
<CraftInfo :craftId="task.processId" />
|
||||
<span class="task-quantity">数量: {{ task.taskQuantity }}</span>
|
||||
</div>
|
||||
<el-button
|
||||
type="text"
|
||||
icon="el-icon-delete"
|
||||
size="mini"
|
||||
class="delete-btn"
|
||||
@click="removeTask(task.taskId)"
|
||||
></el-button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 未选择任务时的提示 -->
|
||||
<div v-else class="no-selected-tip">
|
||||
暂无选择的任务，请从下方选择
|
||||
</div>
|
||||
|
||||
<!-- 任务选择器 -->
|
||||
<div class="task-selector">
|
||||
<el-select
|
||||
v-model="currentSelectTaskId"
|
||||
placeholder="选择未合并的任务"
|
||||
clearable
|
||||
style="width: 100%;"
|
||||
@change="addSelectedTask"
|
||||
>
|
||||
<el-option
|
||||
v-for="task in availableTasks"
|
||||
:key="task.taskId"
|
||||
:value="task.taskId"
|
||||
>
|
||||
<div class="task-info">
|
||||
<ProductInfo :productId="task.productId" />
|
||||
<CraftInfo :craftId="task.processId" />
|
||||
<span class="task-quantity">数量: {{ task.taskQuantity }}</span>
|
||||
</div>
|
||||
</el-option>
|
||||
</el-select>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import CraftInfo from '@/components/KLPService/Renderer/CraftInfo.vue';
|
||||
import ProductInfo from '@/components/KLPService/Renderer/ProductInfo.vue';
|
||||
|
||||
export default {
|
||||
name: 'MergeSourceSelector',
|
||||
components: {
|
||||
CraftInfo,
|
||||
ProductInfo
|
||||
},
|
||||
props: {
|
||||
// 所有未合并的任务列表
|
||||
unmergedTasks: {
|
||||
type: Array,
|
||||
required: true,
|
||||
default: () => []
|
||||
},
|
||||
// 所有任务列表（用于回显）
|
||||
allTasks: {
|
||||
type: Array,
|
||||
required: true,
|
||||
default: () => []
|
||||
},
|
||||
// 绑定的合并来源ID字符串（逗号分隔）
|
||||
value: {
|
||||
type: String,
|
||||
default: ''
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
// 可选择的任务（未合并且不在当前已选中列表中）
|
||||
availableTasks() {
|
||||
return this.unmergedTasks.filter(task =>
|
||||
!this.selectedTasks.some(t => t.taskId === task.taskId)
|
||||
);
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
selectedTasks: [], // 当前选中的任务列表
|
||||
currentSelectTaskId: null // 当前选择的任务ID
|
||||
};
|
||||
},
|
||||
watch: {
|
||||
// 监听外部传入的value变化，同步到选中任务列表
|
||||
value: {
|
||||
handler(val) {
|
||||
if (val) {
|
||||
this.syncSelectedTasks(val.split(','));
|
||||
} else {
|
||||
this.selectedTasks = [];
|
||||
}
|
||||
},
|
||||
immediate: true
|
||||
},
|
||||
// 监听选中任务变化，同步到外部
|
||||
selectedTasks: {
|
||||
handler() {
|
||||
const mergeSource = this.selectedTasks.map(t => t.taskId).join(',');
|
||||
this.$emit('input', mergeSource);
|
||||
this.$emit('change', mergeSource, this.selectedTasks);
|
||||
},
|
||||
deep: true
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
/** 同步选中的任务列表 */
|
||||
syncSelectedTasks(taskIds) {
|
||||
this.selectedTasks = taskIds
|
||||
.map(taskId => this.allTasks.find(t => t.taskId === taskId))
|
||||
.filter(Boolean); // 过滤无效任务
|
||||
},
|
||||
|
||||
/** 添加选中的任务 */
|
||||
addSelectedTask(taskId) {
|
||||
if (!taskId) return;
|
||||
|
||||
// 查找任务信息
|
||||
const task = this.unmergedTasks.find(t => t.taskId === taskId);
|
||||
if (task && !this.selectedTasks.some(t => t.taskId === taskId)) {
|
||||
this.selectedTasks.push(task);
|
||||
this.currentSelectTaskId = null; // 清空选择器
|
||||
}
|
||||
},
|
||||
|
||||
/** 移除任务 */
|
||||
removeTask(taskId) {
|
||||
this.selectedTasks = this.selectedTasks.filter(t => t.taskId !== taskId);
|
||||
},
|
||||
|
||||
/** 清空选中的任务 */
|
||||
clear() {
|
||||
this.selectedTasks = [];
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.merge-source-selector {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.selected-tasks {
|
||||
margin-bottom: 15px;
|
||||
max-height: 200px;
|
||||
overflow-y: auto;
|
||||
border: 1px solid #e4e7ed;
|
||||
border-radius: 4px;
|
||||
padding: 10px;
|
||||
}
|
||||
|
||||
.selected-task-item {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
padding: 8px 5px;
|
||||
border-bottom: 1px dashed #e4e7ed;
|
||||
}
|
||||
|
||||
.selected-task-item:last-child {
|
||||
border-bottom: none;
|
||||
}
|
||||
|
||||
.task-info {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 10px;
|
||||
flex: 1;
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
|
||||
.task-quantity {
|
||||
color: #606266;
|
||||
font-size: 12px;
|
||||
}
|
||||
|
||||
.delete-btn {
|
||||
color: #f56c6c;
|
||||
padding: 0 5px;
|
||||
}
|
||||
|
||||
.no-selected-tip {
|
||||
text-align: center;
|
||||
color: #909399;
|
||||
padding: 10px;
|
||||
margin-bottom: 15px;
|
||||
border: 1px dashed #e4e7ed;
|
||||
border-radius: 4px;
|
||||
}
|
||||
|
||||
.task-selector {
|
||||
margin-top: 10px;
|
||||
}
|
||||
</style>
|
||||
@@ -1,309 +0,0 @@
|
||||
<template>
|
||||
<div class="app-container">
|
||||
<el-page-header @back="$router.back()" :content="'排产计划编号：' + (planInfo.planCode || '-')" />
|
||||
|
||||
<el-tabs v-model="activeTab" @tab-click="handleTabClick">
|
||||
<!-- <el-tab-pane label="排产计划详情" name="info">
|
||||
<el-descriptions :column="1" border>
|
||||
<el-descriptions-item label="计划ID">{{ planInfo.planId }}</el-descriptions-item>
|
||||
<el-descriptions-item label="关联订单ID">{{ planInfo.orderId }}</el-descriptions-item>
|
||||
<el-descriptions-item label="状态">{{ planInfo.status }}</el-descriptions-item>
|
||||
<el-descriptions-item label="备注">{{ planInfo.remark }}</el-descriptions-item>
|
||||
</el-descriptions>
|
||||
</el-tab-pane> -->
|
||||
|
||||
<el-tab-pane label="生产目标" name="target">
|
||||
<TargetPanel :list="orderDetailList" :planId="planId" v-if="activeTab === 'target'" />
|
||||
</el-tab-pane>
|
||||
|
||||
<el-tab-pane label="生产任务管理" name="batch">
|
||||
<BatchPanel :planId="planId" v-if="activeTab === 'batch'" />
|
||||
</el-tab-pane>
|
||||
</el-tabs>
|
||||
|
||||
<el-dialog :title="detailDialogTitle" :visible.sync="detailDialogVisible" width="700px"
|
||||
:modal-append-to-body="false" @close="resetDetailForm">
|
||||
<div style="max-height:60vh;overflow:auto;padding-right:8px;">
|
||||
<el-form :model="detailForm" :rules="detailRules" ref="detailForm" label-width="80px" style="overflow:visible;">
|
||||
<el-form-item label="产线" prop="lineId">
|
||||
<el-select v-model="detailForm.lineId" placeholder="请选择产线" filterable @change="onLineChange">
|
||||
<el-option v-for="item in productionLineList" :key="item.lineId" :label="item.lineName"
|
||||
:value="item.lineId" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="批次" prop="batchId">
|
||||
<!-- <el-select v-model="detailForm.productId" placeholder="请选择产品" filterable>
|
||||
<el-option v-for="item in productList" :key="item.productId" :label="item.productName"
|
||||
:value="item.productId" />
|
||||
</el-select> -->
|
||||
<el-select v-model="detailForm.batchId" placeholder="请选择批次" filterable @change="onBatchChange">
|
||||
<el-option v-for="item in batchList" :key="item.batchId" :label="item.batchNo" :value="item.batchId" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="排产数量" prop="quantity">
|
||||
<el-input-number :controls=false controls-position="right" v-model="detailForm.quantity" disabled :min="0.01" :step="0.01" style="width:100%" />
|
||||
</el-form-item>
|
||||
<el-form-item label="计划日期" prop="dateRange">
|
||||
<el-date-picker v-model="detailForm.dateRange" type="daterange" range-separator="至" start-placeholder="开始日期"
|
||||
end-placeholder="结束日期" style="width:100%" />
|
||||
</el-form-item>
|
||||
<el-form-item label="备注" prop="remark">
|
||||
<el-input v-model="detailForm.remark" placeholder="请输入备注" />
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<div style="margin: 12px 0; max-width:100%; min-width:600px; height:220px; overflow-x:auto; overflow-y:hidden;">
|
||||
<GanttChartEcharts v-if="lineGanttTasks.length > 0 || previewTask"
|
||||
:tasks="previewTask ? [...lineGanttTasks, previewTask] : lineGanttTasks"
|
||||
style="height:220px; min-width:600px;" />
|
||||
<el-empty v-else description="请选择产线以查看排产情况" />
|
||||
</div>
|
||||
</div>
|
||||
<div slot="footer" class="dialog-footer">
|
||||
<el-button @click="detailDialogVisible = false">取 消</el-button>
|
||||
<el-button type="primary" @click="submitDetailForm">确 定</el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { getSchedulePlan } from '@/api/wms/schedulePlan';
|
||||
import { listSchedulePlanDetail, addSchedulePlanDetail, updateSchedulePlanDetail } from '@/api/wms/schedulePlanDetail';
|
||||
import { listOrderDetail } from '@/api/wms/orderDetail';
|
||||
import { listProduct } from '@/api/wms/product';
|
||||
import { listProductionLine } from '@/api/wms/productionLine';
|
||||
import { ganttProductionLine } from '@/api/wms/productionLine';
|
||||
import { listBatch } from '@/api/wms/batch';
|
||||
|
||||
import GanttChartEcharts from '../productionLine/GanttChartEcharts.vue';
|
||||
import ProductInfo from '@/components/KLPService/Renderer/ProductInfo.vue';
|
||||
import TargetPanel from './panes/target.vue';
|
||||
import CraftTaskPanel from './panes/craftTask.vue';
|
||||
import BatchPanel from './panes/batch.vue';
|
||||
|
||||
export default {
|
||||
name: 'SchedulePlanDetail',
|
||||
components: { GanttChartEcharts, ProductInfo, TargetPanel, CraftTaskPanel, BatchPanel },
|
||||
data() {
|
||||
return {
|
||||
activeTab: 'target',
|
||||
planId: null,
|
||||
planInfo: {},
|
||||
orderDetailList: [],
|
||||
detailList: [],
|
||||
loading: false,
|
||||
detailDialogVisible: false,
|
||||
detailDialogTitle: '',
|
||||
detailForm: {
|
||||
detailId: undefined,
|
||||
planId: undefined,
|
||||
lineId: undefined,
|
||||
// productId: undefined,
|
||||
batchId: undefined,
|
||||
quantity: 0,
|
||||
dateRange: [],
|
||||
startDate: '',
|
||||
endDate: '',
|
||||
remark: ''
|
||||
},
|
||||
detailRules: {
|
||||
productId: [{ required: true, message: '请选择产品', trigger: 'change' }],
|
||||
lineId: [{ required: true, message: '请选择产线', trigger: 'change' }],
|
||||
quantity: [{ required: true, message: '请输入排产数量', trigger: 'blur' }],
|
||||
dateRange: [{ required: true, type: 'array', len: 2, message: '请选择计划日期区间', trigger: 'change' }]
|
||||
},
|
||||
productList: [],
|
||||
productionLineList: [],
|
||||
lineGanttTasks: [],
|
||||
previewTask: null,
|
||||
batchList: []
|
||||
};
|
||||
},
|
||||
created() {
|
||||
this.planId = this.$route.query.planId;
|
||||
if (this.planId) {
|
||||
this.fetchPlanInfo();
|
||||
this.fetchDetailList();
|
||||
// this.fetchProductList();
|
||||
this.fetchProductionLineList();
|
||||
this.fetchBatchList();
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
// handleTabClick(tab, event) {
|
||||
// if (this.activeTab === 'detail') {
|
||||
// this.fetchDetailList();
|
||||
// } else if (this.activeTab === 'batch') {
|
||||
// this.fetchBatchList();
|
||||
|
||||
// } else if (this.activeTab === 'target') {
|
||||
// this.fetchOrderDetailList();
|
||||
// }
|
||||
// },
|
||||
fetchPlanInfo() {
|
||||
getSchedulePlan(this.planId).then(res => {
|
||||
this.planInfo = res.data || {};
|
||||
this.fetchOrderDetailList();
|
||||
});
|
||||
},
|
||||
fetchOrderDetailList() {
|
||||
listOrderDetail({ orderId: this.planInfo.orderId }).then(res => {
|
||||
this.orderDetailList = res.rows || [];
|
||||
});
|
||||
},
|
||||
fetchBatchList() {
|
||||
listBatch({ pageNum: 1, pageSize: 1000, planId: this.planId }).then(res => {
|
||||
this.batchList = res.rows || [];
|
||||
});
|
||||
},
|
||||
fetchDetailList() {
|
||||
this.loading = true;
|
||||
listSchedulePlanDetail({ planId: this.planId }).then(res => {
|
||||
this.detailList = res.rows || [];
|
||||
}).finally(() => {
|
||||
this.loading = false;
|
||||
});
|
||||
},
|
||||
fetchProductList() {
|
||||
listProduct({ pageNum: 1, pageSize: 1000 }).then(res => {
|
||||
this.productList = res.rows || [];
|
||||
});
|
||||
},
|
||||
fetchProductionLineList() {
|
||||
listProductionLine({ pageNum: 1, pageSize: 1000 }).then(res => {
|
||||
this.productionLineList = res.rows || [];
|
||||
});
|
||||
},
|
||||
openDetailDialog(row) {
|
||||
if (row) {
|
||||
this.detailDialogTitle = '编辑明细';
|
||||
this.detailForm = Object.assign({}, row);
|
||||
this.detailForm.dateRange = row.startDate && row.endDate ? [row.startDate, row.endDate] : [];
|
||||
} else {
|
||||
this.detailDialogTitle = '新增明细';
|
||||
this.detailForm = {
|
||||
detailId: undefined,
|
||||
planId: this.planId,
|
||||
lineId: undefined,
|
||||
productId: undefined,
|
||||
batchId: undefined,
|
||||
quantity: 0,
|
||||
dateRange: [],
|
||||
startDate: '',
|
||||
endDate: '',
|
||||
remark: ''
|
||||
};
|
||||
}
|
||||
this.lineGanttTasks = [];
|
||||
this.detailDialogVisible = true;
|
||||
},
|
||||
resetDetailForm() {
|
||||
this.$refs.detailForm && this.$refs.detailForm.resetFields();
|
||||
},
|
||||
onBatchChange(batchId) {
|
||||
if (batchId) {
|
||||
// 从batchList中查找
|
||||
const batch = this.batchList.find(item => item.batchId == batchId);
|
||||
console.log(batch);
|
||||
if (batch) {
|
||||
this.detailForm.quantity = batch.totalQuantity;
|
||||
this.detailForm.dateRange = [
|
||||
batch.estimatedStartTime,
|
||||
batch.estimatedEndTime
|
||||
];
|
||||
}
|
||||
}
|
||||
},
|
||||
onLineChange(lineId) {
|
||||
if (!lineId) {
|
||||
this.lineGanttTasks = [];
|
||||
return;
|
||||
}
|
||||
ganttProductionLine({ lineId }).then(res => {
|
||||
this.lineGanttTasks = res.data.tasks || [];
|
||||
this.updatePreviewTask();
|
||||
});
|
||||
},
|
||||
// 监听日期区间变化，生成预览任务条
|
||||
updatePreviewTask() {
|
||||
const { lineId, productId, dateRange, quantity } = this.detailForm;
|
||||
if (!lineId || !dateRange || dateRange.length !== 2) {
|
||||
this.previewTask = null;
|
||||
return;
|
||||
}
|
||||
const startDate = dateRange[0];
|
||||
const endDate = dateRange[1];
|
||||
// 判断是否与已有任务冲突（只要有一天重合就算冲突）
|
||||
let hasConflict = false;
|
||||
console.log(this.lineGanttTasks);
|
||||
|
||||
for (const t of this.lineGanttTasks) {
|
||||
if (!t.startDate || !t.endDate) continue;
|
||||
const s1 = new Date(startDate).getTime();
|
||||
const e1 = new Date(endDate).getTime();
|
||||
const s2 = new Date(t.startDate).getTime();
|
||||
const e2 = new Date(t.endDate).getTime();
|
||||
// 只要有一天重合就算冲突
|
||||
if (!(e1 < s2 || s1 > e2)) {
|
||||
hasConflict = true;
|
||||
break;
|
||||
}
|
||||
|
||||
|
||||
}
|
||||
|
||||
this.previewTask = {
|
||||
name: '新任务(预览)',
|
||||
startDate,
|
||||
endDate,
|
||||
quantity,
|
||||
lineId,
|
||||
productId,
|
||||
itemStyle: { color: hasConflict ? '#F56C6C' : '#67C23A', borderRadius: 6 },
|
||||
};
|
||||
},
|
||||
submitDetailForm() {
|
||||
this.$refs.detailForm.validate(valid => {
|
||||
if (!valid) return;
|
||||
if (this.detailForm.dateRange && this.detailForm.dateRange.length === 2) {
|
||||
this.detailForm.startDate = this.detailForm.dateRange[0].replace(' ', "T") + '.000Z';
|
||||
this.detailForm.endDate = this.detailForm.dateRange[1].replace(' ', "T") + '.000Z';
|
||||
} else {
|
||||
this.detailForm.startDate = '';
|
||||
this.detailForm.endDate = '';
|
||||
}
|
||||
const api = this.detailForm.detailId ? updateSchedulePlanDetail : addSchedulePlanDetail;
|
||||
const data = Object.assign({}, this.detailForm, { planId: this.planId });
|
||||
api(data).then(() => {
|
||||
this.$message.success(this.detailForm.detailId ? '修改成功' : '新增成功');
|
||||
this.detailDialogVisible = false;
|
||||
this.fetchDetailList();
|
||||
});
|
||||
});
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
'detailForm.dateRange': {
|
||||
handler() {
|
||||
this.updatePreviewTask();
|
||||
},
|
||||
deep: true
|
||||
},
|
||||
'detailForm.lineId': function () {
|
||||
this.updatePreviewTask();
|
||||
},
|
||||
'detailForm.productId': function () {
|
||||
this.updatePreviewTask();
|
||||
},
|
||||
'detailForm.quantity': function () {
|
||||
this.updatePreviewTask();
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.mt20 {
|
||||
margin-top: 20px;
|
||||
}
|
||||
</style>
|
||||
@@ -1,421 +0,0 @@
|
||||
<template>
|
||||
<div class="app-container">
|
||||
<el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="100px">
|
||||
<el-form-item label="排产计划编号" prop="planCode">
|
||||
<el-input
|
||||
v-model="queryParams.planCode"
|
||||
placeholder="请输入排产计划编号"
|
||||
clearable
|
||||
@keyup.enter.native="handleQuery"
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item label="关联订单ID" prop="orderId">
|
||||
<el-input
|
||||
v-model="queryParams.orderId"
|
||||
placeholder="请输入关联订单ID"
|
||||
clearable
|
||||
@keyup.enter.native="handleQuery"
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
|
||||
<el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
|
||||
<el-row :gutter="10" class="mb8">
|
||||
<el-col :span="1.5">
|
||||
<el-button
|
||||
type="primary"
|
||||
plain
|
||||
icon="el-icon-plus"
|
||||
size="mini"
|
||||
@click="handleAdd"
|
||||
|
||||
>新增</el-button>
|
||||
</el-col>
|
||||
<el-col :span="1.5">
|
||||
<el-button
|
||||
type="success"
|
||||
plain
|
||||
icon="el-icon-edit"
|
||||
size="mini"
|
||||
:disabled="single"
|
||||
@click="handleUpdate"
|
||||
|
||||
>修改</el-button>
|
||||
</el-col>
|
||||
<el-col :span="1.5">
|
||||
<el-button
|
||||
type="danger"
|
||||
plain
|
||||
icon="el-icon-delete"
|
||||
size="mini"
|
||||
:disabled="multiple"
|
||||
@click="handleDelete"
|
||||
|
||||
>删除</el-button>
|
||||
</el-col>
|
||||
<el-col :span="1.5">
|
||||
<el-button
|
||||
type="warning"
|
||||
plain
|
||||
icon="el-icon-download"
|
||||
size="mini"
|
||||
@click="handleExport"
|
||||
|
||||
>导出</el-button>
|
||||
</el-col>
|
||||
<right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
|
||||
</el-row>
|
||||
|
||||
<KLPTable v-loading="loading" :data="schedulePlanList" @selection-change="handleSelectionChange">
|
||||
<el-table-column type="selection" width="55" align="center" />
|
||||
<!-- <el-table-column label="排产计划ID" align="center" prop="planId" v-if="true"/> -->
|
||||
<el-table-column label="排产计划编号" align="center" prop="planCode" />
|
||||
<el-table-column label="关联订单ID" align="center" prop="orderId" />
|
||||
<!-- <el-table-column label="工艺路线" align="center" prop="processRoute" /> -->
|
||||
<el-table-column label="开始时间" align="center" prop="startDate">
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.startDate ? scope.row.startDate.substr(0, 10) : '' }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="结束时间" align="center" prop="endDate">
|
||||
<template slot-scope="scope">
|
||||
{{ scope.row.endDate ? scope.row.endDate.substr(0, 10) : '' }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="优先级" align="center" prop="priority">
|
||||
<template slot-scope="scope">
|
||||
<dict-tag :options="dict.type.schedule_plan_priority" :value="scope.row.priority" />
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="状态" align="center" prop="status">
|
||||
<template slot-scope="scope">
|
||||
<el-select v-model="scope.row.status" @change="handleStatusChange(scope.row)">
|
||||
<el-option key="1" :value="0" label="新建">
|
||||
<el-tag type="info">新建</el-tag>
|
||||
</el-option>
|
||||
<el-option key="2" :value="1" label="已排产">
|
||||
<el-tag type="warning">待排产</el-tag>
|
||||
</el-option>
|
||||
<el-option key="3" :value="2" label="生产中">
|
||||
<el-tag type="primary">生产中</el-tag>
|
||||
</el-option>
|
||||
<el-option key="4" :value="3" label="已完成">
|
||||
<el-tag type="danger">已废弃</el-tag>
|
||||
</el-option>
|
||||
</el-select>
|
||||
<!-- <el-tag :type="statusTagType(scope.row.status)" disable-transitions>
|
||||
{{ statusText(scope.row.status) }}
|
||||
</el-tag> -->
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="备注" align="center" prop="remark" />
|
||||
<el-table-column label="创建时间" align="center" prop="createTime" width="200">
|
||||
<template slot-scope="scope">
|
||||
<span>{{ parseTime(scope.row.createTime) }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="创建人" align="center" prop="createBy" />
|
||||
<el-table-column label="操作" align="center" class-name="small-padding fixed-width">
|
||||
<template slot-scope="scope">
|
||||
<el-button
|
||||
size="mini"
|
||||
type="text"
|
||||
icon="el-icon-edit"
|
||||
@click="handleUpdate(scope.row)"
|
||||
>修改</el-button>
|
||||
<el-button
|
||||
size="mini"
|
||||
type="text"
|
||||
icon="el-icon-delete"
|
||||
@click="handleDelete(scope.row)"
|
||||
>删除</el-button>
|
||||
<el-button
|
||||
size="mini"
|
||||
type="text"
|
||||
icon="el-icon-document"
|
||||
@click="handleDetail(scope.row)"
|
||||
>详情</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</KLPTable>
|
||||
|
||||
<pagination
|
||||
v-show="total>0"
|
||||
:total="total"
|
||||
:page.sync="queryParams.pageNum"
|
||||
:limit.sync="queryParams.pageSize"
|
||||
@pagination="getList"
|
||||
/>
|
||||
|
||||
<!-- 添加或修改排产计划对话框 -->
|
||||
<el-dialog :title="title" :visible.sync="open" width="500px" append-to-body>
|
||||
<el-form ref="form" :model="form" :rules="rules" label-width="120px">
|
||||
<el-form-item label="计划编号" prop="planCode">
|
||||
<el-input v-model="form.planCode" placeholder="请输入排产计划编号" />
|
||||
</el-form-item>
|
||||
<el-form-item label="计划版本" prop="version">
|
||||
<el-input v-model="form.version" placeholder="请输入计划版本" />
|
||||
</el-form-item>
|
||||
<el-form-item label="关联订单" prop="orderId">
|
||||
<el-select v-model="form.orderId" placeholder="请选择关联订单" filterable clearable>
|
||||
<el-option v-for="item in orderList" :key="item.orderId" :label="item.orderCode || item.orderId" :value="item.orderId" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="开始时间" prop="startDate">
|
||||
<el-date-picker v-model="form.startDate" type="date" placeholder="请选择开始时间" style="width:100%" value-format="yyyy-MM-dd hh:mm:ss" />
|
||||
</el-form-item>
|
||||
<el-form-item label="结束时间" prop="endDate">
|
||||
<el-date-picker v-model="form.endDate" type="date" placeholder="请选择结束时间" style="width:100%" value-format="yyyy-MM-dd hh:mm:ss" />
|
||||
</el-form-item>
|
||||
<el-form-item label="优先级" prop="priority">
|
||||
<el-select v-model="form.priority" placeholder="请选择优先级">
|
||||
<el-option
|
||||
v-for="dict in dict.type.schedule_plan_priority"
|
||||
:key="dict.value"
|
||||
:label="dict.label"
|
||||
:value="parseInt(dict.value)"
|
||||
></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<!-- <el-form-item label="工艺路线" prop="processRoute">
|
||||
<el-input v-model="form.processRoute" placeholder="请输入工艺路线" />
|
||||
</el-form-item> -->
|
||||
<el-form-item label="备注" prop="remark">
|
||||
<el-input v-model="form.remark" placeholder="请输入备注" />
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<div slot="footer" class="dialog-footer">
|
||||
<el-button :loading="buttonLoading" type="primary" @click="submitForm">确 定</el-button>
|
||||
<el-button @click="cancel">取 消</el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { listSchedulePlan, getSchedulePlan, delSchedulePlan, addSchedulePlan, updateSchedulePlan } from "@/api/wms/schedulePlan";
|
||||
import { listOrder } from "@/api/wms/order";
|
||||
|
||||
export default {
|
||||
name: "SchedulePlan",
|
||||
dicts: ['schedule_plan_priority'],
|
||||
data() {
|
||||
return {
|
||||
// 按钮loading
|
||||
buttonLoading: false,
|
||||
// 遮罩层
|
||||
loading: true,
|
||||
// 选中数组
|
||||
ids: [],
|
||||
// 非单个禁用
|
||||
single: true,
|
||||
// 非多个禁用
|
||||
multiple: true,
|
||||
// 显示搜索条件
|
||||
showSearch: true,
|
||||
// 总条数
|
||||
total: 0,
|
||||
// 排产计划表格数据
|
||||
schedulePlanList: [],
|
||||
// 弹出层标题
|
||||
title: "",
|
||||
// 是否显示弹出层
|
||||
open: false,
|
||||
// 查询参数
|
||||
queryParams: {
|
||||
pageNum: 1,
|
||||
pageSize: 20,
|
||||
planCode: undefined,
|
||||
orderId: undefined,
|
||||
status: undefined,
|
||||
},
|
||||
// 表单参数
|
||||
form: {},
|
||||
// 表单校验
|
||||
rules: {
|
||||
},
|
||||
orderList: [], // 新增：订单列表
|
||||
};
|
||||
},
|
||||
created() {
|
||||
this.getList();
|
||||
this.getOrderList(); // 新增：获取订单列表
|
||||
},
|
||||
methods: {
|
||||
/** 查询排产计划列表 */
|
||||
getList() {
|
||||
this.loading = true;
|
||||
listSchedulePlan(this.queryParams).then(response => {
|
||||
this.schedulePlanList = response.rows;
|
||||
this.total = response.total;
|
||||
this.loading = false;
|
||||
});
|
||||
},
|
||||
// 取消按钮
|
||||
cancel() {
|
||||
this.open = false;
|
||||
this.reset();
|
||||
},
|
||||
// 表单重置
|
||||
reset() {
|
||||
this.form = {
|
||||
planId: undefined,
|
||||
planCode: undefined,
|
||||
version: undefined,
|
||||
orderId: undefined,
|
||||
status: undefined,
|
||||
remark: undefined,
|
||||
delFlag: undefined,
|
||||
createTime: undefined,
|
||||
createBy: undefined,
|
||||
updateTime: undefined,
|
||||
updateBy: undefined,
|
||||
priority: undefined,
|
||||
// processRoute: undefined,
|
||||
startDate: undefined,
|
||||
endDate: undefined,
|
||||
};
|
||||
this.resetForm("form");
|
||||
},
|
||||
/** 搜索按钮操作 */
|
||||
handleQuery() {
|
||||
this.queryParams.pageNum = 1;
|
||||
this.getList();
|
||||
},
|
||||
handleStatusChange(row) {
|
||||
console.log(row);
|
||||
updateSchedulePlan(row).then(response => {
|
||||
this.$modal.msgSuccess("修改成功");
|
||||
this.getList();
|
||||
});
|
||||
},
|
||||
/** 重置按钮操作 */
|
||||
resetQuery() {
|
||||
this.resetForm("queryForm");
|
||||
this.handleQuery();
|
||||
},
|
||||
// 多选框选中数据
|
||||
handleSelectionChange(selection) {
|
||||
this.ids = selection.map(item => item.planId)
|
||||
this.single = selection.length!==1
|
||||
this.multiple = !selection.length
|
||||
},
|
||||
/** 新增按钮操作 */
|
||||
handleAdd() {
|
||||
this.reset();
|
||||
this.open = true;
|
||||
this.title = "添加排产计划";
|
||||
},
|
||||
/** 修改按钮操作 */
|
||||
handleUpdate(row) {
|
||||
this.loading = true;
|
||||
this.reset();
|
||||
const planId = row.planId || this.ids
|
||||
getSchedulePlan(planId).then(response => {
|
||||
this.loading = false;
|
||||
this.form = response.data;
|
||||
this.open = true;
|
||||
this.title = "修改排产计划";
|
||||
});
|
||||
},
|
||||
/** 提交按钮 */
|
||||
submitForm() {
|
||||
this.$refs["form"].validate(valid => {
|
||||
if (valid) {
|
||||
this.buttonLoading = true;
|
||||
if (this.form.planId != null) {
|
||||
updateSchedulePlan(this.form).then(response => {
|
||||
this.$modal.msgSuccess("修改成功");
|
||||
this.open = false;
|
||||
this.getList();
|
||||
}).finally(() => {
|
||||
this.buttonLoading = false;
|
||||
});
|
||||
} else {
|
||||
addSchedulePlan(this.form).then(response => {
|
||||
this.$modal.msgSuccess("新增成功");
|
||||
this.open = false;
|
||||
this.getList();
|
||||
}).finally(() => {
|
||||
this.buttonLoading = false;
|
||||
});
|
||||
}
|
||||
}
|
||||
});
|
||||
},
|
||||
/** 删除按钮操作 */
|
||||
handleDelete(row) {
|
||||
const planIds = row.planId || this.ids;
|
||||
this.$modal.confirm('是否确认删除排产计划编号为"' + planIds + '"的数据项？').then(() => {
|
||||
this.loading = true;
|
||||
return delSchedulePlan(planIds);
|
||||
}).then(() => {
|
||||
this.loading = false;
|
||||
this.getList();
|
||||
this.$modal.msgSuccess("删除成功");
|
||||
}).catch(() => {
|
||||
}).finally(() => {
|
||||
this.loading = false;
|
||||
});
|
||||
},
|
||||
/** 导出按钮操作 */
|
||||
handleExport() {
|
||||
this.download('wms/schedulePlan/export', {
|
||||
...this.queryParams
|
||||
}, `schedulePlan_${new Date().getTime()}.xlsx`)
|
||||
},
|
||||
/** 获取订单列表 */
|
||||
getOrderList() {
|
||||
listOrder({ pageNum: 1, pageSize: 1000 }).then(res => {
|
||||
this.orderList = res.rows || [];
|
||||
});
|
||||
},
|
||||
/** 详情按钮操作 */
|
||||
handleDetail(row) {
|
||||
this.$router.push({
|
||||
path: '/production/schedulePlan/detail',
|
||||
query: { planId: row.planId }
|
||||
});
|
||||
},
|
||||
statusText(val) {
|
||||
switch (val) {
|
||||
case 0:
|
||||
case '0':
|
||||
return '新建';
|
||||
case 1:
|
||||
case '1':
|
||||
return '已排产';
|
||||
case 2:
|
||||
case '2':
|
||||
return '生产中';
|
||||
case 3:
|
||||
case '3':
|
||||
return '已完成';
|
||||
default:
|
||||
return val;
|
||||
}
|
||||
},
|
||||
statusTagType(val) {
|
||||
switch (val) {
|
||||
case 0:
|
||||
case '0':
|
||||
return 'info'; // 新建-灰色
|
||||
case 1:
|
||||
case '1':
|
||||
return 'warning'; // 已排产-橙色
|
||||
case 2:
|
||||
case '2':
|
||||
return 'primary'; // 生产中-蓝色
|
||||
case 3:
|
||||
case '3':
|
||||
return 'success'; // 已完成-绿色
|
||||
default:
|
||||
return '';
|
||||
}
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
@@ -1,482 +0,0 @@
|
||||
<template>
|
||||
<div class="app-container">
|
||||
<el-row>
|
||||
<!-- 任务列表容器 -->
|
||||
<div class="task-list-container">
|
||||
<!-- 单个任务项 -->
|
||||
<div v-for="(item, index) in taskList" :key="index" class="task-item"
|
||||
:style="{ marginBottom: index === taskList.length - 1 ? '0' : '20px' }">
|
||||
|
||||
<!-- 产品信息区域 -->
|
||||
<div class="product-info-wrapper">
|
||||
<ProductInfo :productId="item && item[0] && item[0].productId" />
|
||||
</div>
|
||||
|
||||
<!-- 工艺流程区域 -->
|
||||
<div class="process-flow-container">
|
||||
<div v-for="(process, pIndex) in item" :key="process.processId" class="process-item" :style="{
|
||||
marginRight: pIndex !== item.length - 1 ? '15px' : '0',
|
||||
// 最后一个工艺项不加右侧间距
|
||||
}">
|
||||
<CraftInfo :craftId="process.processId" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</el-row>
|
||||
|
||||
<el-row :gutter="10" class="mb8">
|
||||
<el-col :span="1.5">
|
||||
<el-button type="primary" plain icon="el-icon-plus" size="mini" @click="handleInitBatch">生成生产任务</el-button>
|
||||
</el-col>
|
||||
<el-col :span="1.5">
|
||||
<el-button type="primary" plain icon="el-icon-plus" size="mini" @click="handleAdd">新增</el-button>
|
||||
</el-col>
|
||||
<el-col :span="1.5">
|
||||
<el-button type="success" plain icon="el-icon-edit" size="mini" :disabled="single"
|
||||
@click="handleUpdate">修改</el-button>
|
||||
</el-col>
|
||||
<el-col :span="1.5">
|
||||
<el-button type="danger" plain icon="el-icon-delete" size="mini" :disabled="multiple"
|
||||
@click="handleDelete">删除</el-button>
|
||||
</el-col>
|
||||
<el-col :span="1.5">
|
||||
<el-button type="warning" plain icon="el-icon-download" size="mini" @click="handleExport">导出</el-button>
|
||||
</el-col>
|
||||
<right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
|
||||
</el-row>
|
||||
|
||||
<KLPTable v-loading="loading" :data="batchList" @selection-change="handleSelectionChange">
|
||||
<el-table-column type="selection" width="55" align="center" />
|
||||
<el-table-column label="生产任务ID" align="center" prop="batchId" v-if="true" />
|
||||
<el-table-column label="生产任务编号" align="center" prop="batchNo" />
|
||||
<el-table-column label="关联工艺ID" align="center" prop="processId">
|
||||
<template slot-scope="scope">
|
||||
<CraftInfo :craftId="scope.row.processId" />
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="生产任务总数量" align="center" prop="totalQuantity" />
|
||||
<el-table-column label="合并来源" align="center" prop="mergeSource">
|
||||
<template slot-scope="scope">
|
||||
<div v-for="item in scope.row.mergeSource.split(',')"
|
||||
style="display: flex; align-items: center; justify-content: center; gap: 10px;" :key="item">
|
||||
<ProductInfo :productId="getTaskInfo(item).productId" />
|
||||
<CraftInfo :craftId="getTaskInfo(item).processId" />
|
||||
</div>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="预计开始时间" align="center" prop="estimatedStartTime" width="180">
|
||||
<template slot-scope="scope">
|
||||
<span>{{ parseTime(scope.row.estimatedStartTime, '{y}-{m}-{d}') }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="预计结束时间" align="center" prop="estimatedEndTime" width="180">
|
||||
<template slot-scope="scope">
|
||||
<span>{{ parseTime(scope.row.estimatedEndTime, '{y}-{m}-{d}') }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="状态" align="center" prop="batchStatus">
|
||||
<template slot-scope="scope">
|
||||
<dict-tag :options="dict.type.batch_status" :value="scope.row.batchStatus" />
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="备注" align="center" prop="remark" />
|
||||
<el-table-column label="操作" align="center" class-name="small-padding fixed-width">
|
||||
<template slot-scope="scope">
|
||||
<el-button size="mini" type="text" icon="el-icon-edit" @click="handleUpdate(scope.row)">修改</el-button>
|
||||
<el-button size="mini" type="text" icon="el-icon-delete" @click="handleDelete(scope.row)">删除</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</KLPTable>
|
||||
|
||||
<!-- 添加或修改批次（合并相同工艺的任务）对话框 -->
|
||||
<el-dialog :title="title" :visible.sync="open" width="500px" append-to-body>
|
||||
<el-form ref="form" :model="form" :rules="rules" label-width="120px">
|
||||
<el-form-item label="生产任务编号" prop="batchNo">
|
||||
<el-input v-model="form.batchNo" placeholder="请输入生产任务编号" />
|
||||
</el-form-item>
|
||||
<!-- <el-form-item label="关联工艺ID" prop="processId">
|
||||
<el-input v-model="form.processId" placeholder="请输入关联工艺ID" />
|
||||
</el-form-item> -->
|
||||
<!-- <el-form-item label="批次总数量" prop="totalQuantity">
|
||||
<el-input v-model="form.totalQuantity" placeholder="请输入批次总数量" />
|
||||
</el-form-item> -->
|
||||
<el-form-item label="合并来源" prop="mergeSource">
|
||||
<merge-source-selector v-model="form.mergeSource" :unmerged-tasks="unmergedTaskList" :all-tasks="allTasks"
|
||||
@change="handleMergeSourceChange" />
|
||||
<!-- <el-input v-model="form.mergeSource" type="textarea" placeholder="请输入内容" /> -->
|
||||
</el-form-item>
|
||||
<el-form-item label="预计开始时间" prop="estimatedStartTime">
|
||||
<el-date-picker clearable v-model="form.estimatedStartTime" type="datetime" value-format="yyyy-MM-dd HH:mm:ss"
|
||||
placeholder="请选择预计开始时间">
|
||||
</el-date-picker>
|
||||
</el-form-item>
|
||||
<el-form-item label="预计结束时间" prop="estimatedEndTime">
|
||||
<el-date-picker clearable v-model="form.estimatedEndTime" type="datetime" value-format="yyyy-MM-dd HH:mm:ss"
|
||||
placeholder="请选择预计结束时间">
|
||||
</el-date-picker>
|
||||
</el-form-item>
|
||||
<el-form-item label="备注" prop="remark">
|
||||
<el-input v-model="form.remark" placeholder="请输入备注" />
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<div slot="footer" class="dialog-footer">
|
||||
<el-button :loading="buttonLoading" type="primary" @click="submitForm">确 定</el-button>
|
||||
<el-button @click="cancel">取 消</el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
|
||||
<el-drawer title="生成生产任务" direction="btt" size="90vh" :visible.sync="batchGenerateDialogVisible" append-to-body>
|
||||
<KLPTable :data="generateBatchList" style="width: 100%;" border>
|
||||
<el-table-column label="生产任务编号" align="center" prop="batchNo">
|
||||
<template slot-scope="scope">
|
||||
<el-input v-model="scope.row.batchNo" />
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="合并来源" align="center" prop="mergeSource">
|
||||
<template slot-scope="scope">
|
||||
<div v-for="item in scope.row.mergeSource.split(',')"
|
||||
style="display: flex; align-items: center; justify-content: center; gap: 10px;" :key="item">
|
||||
<!-- 返回的是taskId, 需要查找到对应的processId和productId -->
|
||||
<ProductInfo :productId="getTaskInfo(item).productId" />
|
||||
<CraftInfo :craftId="getTaskInfo(item).processId" />
|
||||
</div>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="生产任务总数量" align="center" prop="totalQuantity" />
|
||||
<el-table-column label="预计开始时间" align="center" prop="estimatedStartTime">
|
||||
<template slot-scope="scope">
|
||||
<el-date-picker v-model="scope.row.estimatedStartTime" type="datetime" value-format="yyyy-MM-dd HH:mm:ss"
|
||||
placeholder="请选择预计开始时间" />
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="预计结束时间" align="center" prop="estimatedEndTime">
|
||||
<template slot-scope="scope">
|
||||
<el-date-picker v-model="scope.row.estimatedEndTime" type="datetime" value-format="yyyy-MM-dd HH:mm:ss"
|
||||
placeholder="请选择预计结束时间" />
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="操作" align="center" class-name="small-padding fixed-width">
|
||||
<template slot-scope="scope">
|
||||
<el-button type="primary" size="mini" @click="handleAddBatch(scope.row)">创建生产任务</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</KLPTable>
|
||||
</el-drawer>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { listBatch, getBatch, delBatch, addBatch, updateBatch, generateBatch } from "@/api/wms/batch";
|
||||
import { listProcessTask } from "@/api/wms/processTask";
|
||||
|
||||
|
||||
import CraftInfo from '@/components/KLPService/Renderer/CraftInfo.vue';
|
||||
import ProductInfo from '@/components/KLPService/Renderer/ProductInfo.vue';
|
||||
import MergeSourceSelector from "../components/MergeSourceSelector.vue";
|
||||
|
||||
export default {
|
||||
name: "Batch",
|
||||
components: {
|
||||
CraftInfo,
|
||||
ProductInfo,
|
||||
MergeSourceSelector
|
||||
},
|
||||
dicts: ['batch_status'],
|
||||
props: {
|
||||
planId: {
|
||||
type: [String, Number, undefined],
|
||||
required: true
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
// 所有还没有被合并的任务
|
||||
unmergedTaskList() {
|
||||
// 也就是不在batchList.mergeSource中的
|
||||
return this.allTasks.filter(item => !this.batchList.some(batch => batch.mergeSource.split(',').includes(item.taskId)));
|
||||
},
|
||||
allTasks() {
|
||||
return this.taskList.flat(1);
|
||||
},
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
// 按钮loading
|
||||
buttonLoading: false,
|
||||
// 遮罩层
|
||||
loading: true,
|
||||
// 选中数组
|
||||
ids: [],
|
||||
// 非单个禁用
|
||||
single: true,
|
||||
// 非多个禁用
|
||||
multiple: true,
|
||||
// 显示搜索条件
|
||||
showSearch: true,
|
||||
// 总条数
|
||||
total: 0,
|
||||
// 批次（合并相同工艺的任务）表格数据
|
||||
batchList: [],
|
||||
// 弹出层标题
|
||||
title: "",
|
||||
// 是否显示弹出层
|
||||
open: false,
|
||||
// 查询参数
|
||||
queryParams: {
|
||||
pageNum: 1,
|
||||
pageSize: 999,
|
||||
planId: this.planId,
|
||||
batchNo: undefined,
|
||||
processId: undefined,
|
||||
totalQuantity: undefined,
|
||||
mergeSource: undefined,
|
||||
estimatedStartTime: undefined,
|
||||
estimatedEndTime: undefined,
|
||||
batchStatus: undefined,
|
||||
},
|
||||
// 表单参数
|
||||
form: {},
|
||||
// 表单校验
|
||||
rules: {
|
||||
},
|
||||
// 所有的工序任务
|
||||
taskList: [],
|
||||
// 批次生成对话框是否显示
|
||||
batchGenerateDialogVisible: false,
|
||||
generateBatchList: []
|
||||
};
|
||||
},
|
||||
created() {
|
||||
this.getList();
|
||||
this.getProcessList();
|
||||
},
|
||||
methods: {
|
||||
async getProcessList() {
|
||||
const { rows } = await listProcessTask({ planId: this.planId });
|
||||
// 整理成二维数组，按照productId
|
||||
const productIdToProcessTaskList = {};
|
||||
rows.forEach(item => {
|
||||
if (!productIdToProcessTaskList[item.productId]) {
|
||||
productIdToProcessTaskList[item.productId] = [];
|
||||
}
|
||||
productIdToProcessTaskList[item.productId].push(item);
|
||||
});
|
||||
this.taskList = Object.values(productIdToProcessTaskList);
|
||||
},
|
||||
getTaskInfo(taskId) {
|
||||
const task = this.allTasks.find(item => item.taskId == taskId);
|
||||
// console.log(task, taskId);
|
||||
if (!task) {
|
||||
return {
|
||||
productId: '',
|
||||
processId: ''
|
||||
};
|
||||
}
|
||||
return task;
|
||||
},
|
||||
/** 查询批次（合并相同工艺的任务）列表 */
|
||||
getList() {
|
||||
this.loading = true;
|
||||
listBatch(this.queryParams).then(response => {
|
||||
this.batchList = response.rows;
|
||||
this.total = response.total;
|
||||
this.loading = false;
|
||||
});
|
||||
},
|
||||
// 取消按钮
|
||||
cancel() {
|
||||
this.open = false;
|
||||
this.reset();
|
||||
},
|
||||
// 表单重置
|
||||
reset() {
|
||||
this.form = {
|
||||
batchId: undefined,
|
||||
batchNo: undefined,
|
||||
processId: undefined,
|
||||
totalQuantity: undefined,
|
||||
mergeSource: undefined,
|
||||
estimatedStartTime: undefined,
|
||||
estimatedEndTime: undefined,
|
||||
batchStatus: undefined,
|
||||
delFlag: undefined,
|
||||
remark: undefined,
|
||||
createTime: undefined,
|
||||
createBy: undefined,
|
||||
updateTime: undefined,
|
||||
updateBy: undefined
|
||||
};
|
||||
this.resetForm("form");
|
||||
},
|
||||
/** 搜索按钮操作 */
|
||||
handleQuery() {
|
||||
this.queryParams.pageNum = 1;
|
||||
this.getList();
|
||||
},
|
||||
// 处理合并来源变化的回调
|
||||
handleMergeSourceChange(mergeSource, selectedTasks) {
|
||||
console.log('合并来源变化:', mergeSource);
|
||||
console.log('选中的任务:', selectedTasks);
|
||||
// 可以在这里做一些额外处理，比如计算总数量等
|
||||
},
|
||||
async handleInitBatch() {
|
||||
generateBatch(this.taskList).then(res => {
|
||||
console.log(res)
|
||||
this.batchGenerateDialogVisible = true;
|
||||
this.generateBatchList = res.data.map(item => {
|
||||
let totalQuantity = 0;
|
||||
for (const taskId of item.taskIds) {
|
||||
const task = this.allTasks.find(item => item.taskId == taskId);
|
||||
totalQuantity += task.taskQuantity;
|
||||
}
|
||||
return {
|
||||
...item,
|
||||
planId: this.planId,
|
||||
processId: item.processId,
|
||||
mergeSource: item.taskIds.join(','),
|
||||
batchNo: item.groupId,
|
||||
totalQuantity
|
||||
}
|
||||
});
|
||||
})
|
||||
},
|
||||
/** 重置按钮操作 */
|
||||
resetQuery() {
|
||||
this.resetForm("queryForm");
|
||||
this.handleQuery();
|
||||
},
|
||||
// 多选框选中数据
|
||||
handleSelectionChange(selection) {
|
||||
this.ids = selection.map(item => item.batchId)
|
||||
this.single = selection.length !== 1
|
||||
this.multiple = !selection.length
|
||||
},
|
||||
/** 新增按钮操作 */
|
||||
handleAdd() {
|
||||
this.reset();
|
||||
this.open = true;
|
||||
this.title = "添加生产任务（合并相同工艺的任务）";
|
||||
},
|
||||
/** 修改按钮操作 */
|
||||
handleUpdate(row) {
|
||||
this.loading = true;
|
||||
this.reset();
|
||||
const batchId = row.batchId || this.ids
|
||||
getBatch(batchId).then(response => {
|
||||
this.loading = false;
|
||||
this.form = response.data;
|
||||
this.open = true;
|
||||
this.title = "修改生产任务（合并相同工艺的任务）";
|
||||
});
|
||||
},
|
||||
/** 提交按钮 */
|
||||
submitForm() {
|
||||
this.$refs["form"].validate(valid => {
|
||||
if (valid) {
|
||||
this.buttonLoading = true;
|
||||
if (this.form.batchId != null) {
|
||||
updateBatch(this.form).then(response => {
|
||||
this.$modal.msgSuccess("修改成功");
|
||||
this.open = false;
|
||||
this.getList();
|
||||
}).finally(() => {
|
||||
this.buttonLoading = false;
|
||||
});
|
||||
} else {
|
||||
addBatch(this.form).then(response => {
|
||||
this.$modal.msgSuccess("新增成功");
|
||||
this.open = false;
|
||||
this.getList();
|
||||
}).finally(() => {
|
||||
this.buttonLoading = false;
|
||||
});
|
||||
}
|
||||
}
|
||||
});
|
||||
},
|
||||
handleAddBatch(row) {
|
||||
addBatch(row).then(response => {
|
||||
this.$modal.msgSuccess("新增成功");
|
||||
this.getList();
|
||||
}).finally(() => {
|
||||
this.buttonLoading = false;
|
||||
});
|
||||
},
|
||||
/** 删除按钮操作 */
|
||||
handleDelete(row) {
|
||||
const batchIds = row.batchId || this.ids;
|
||||
this.$modal.confirm('是否确认删除生产任务（合并相同工艺的任务）编号为"' + batchIds + '"的数据项？').then(() => {
|
||||
this.loading = true;
|
||||
return delBatch(batchIds);
|
||||
}).then(() => {
|
||||
this.loading = false;
|
||||
this.getList();
|
||||
this.$modal.msgSuccess("删除成功");
|
||||
}).catch(() => {
|
||||
}).finally(() => {
|
||||
this.loading = false;
|
||||
});
|
||||
},
|
||||
/** 导出按钮操作 */
|
||||
handleExport() {
|
||||
this.download('klp/batch/export', {
|
||||
...this.queryParams
|
||||
}, `batch_${new Date().getTime()}.xlsx`)
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
/* 任务列表容器 */
|
||||
.task-list-container {
|
||||
width: 100%;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
/* 单个任务项样式 */
|
||||
.task-item {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
/* 鼠标悬停效果 */
|
||||
.task-item:hover {
|
||||
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
|
||||
background-color: #fff;
|
||||
}
|
||||
|
||||
/* 产品信息容器 */
|
||||
.product-info-wrapper {
|
||||
min-width: 180px;
|
||||
/* 固定产品信息宽度，保证对齐 */
|
||||
padding: 8px 0;
|
||||
border-right: 1px dashed #e5e7eb;
|
||||
/* 分隔线 */
|
||||
margin-right: 15px;
|
||||
}
|
||||
|
||||
/* 工艺流程容器 */
|
||||
.process-flow-container {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
gap: 12px;
|
||||
/* 工艺项之间的间距 */
|
||||
padding: 8px 0;
|
||||
flex: 1;
|
||||
/* 占满剩余空间 */
|
||||
}
|
||||
|
||||
/* 单个工艺项样式 */
|
||||
.process-item {
|
||||
flex: 0 0 auto;
|
||||
background-color: #fff;
|
||||
border: 1px solid #eee;
|
||||
}
|
||||
|
||||
.process-item:hover {
|
||||
border-color: #409eff;
|
||||
/* 高亮边框 */
|
||||
}
|
||||
</style>
|
||||
@@ -1,53 +0,0 @@
|
||||
<template>
|
||||
<div>
|
||||
<el-collapse>
|
||||
<el-collapse-item v-for="detail in list" :key="detail.detailId" :title="detail.productName">
|
||||
<el-descriptions>
|
||||
<el-descriptions-item label="产品名称">{{ detail.productName }}</el-descriptions-item>
|
||||
<el-descriptions-item label="产品编码">{{ detail.productCode }}</el-descriptions-item>
|
||||
<el-descriptions-item label="产品数量">{{ detail.quantity }}</el-descriptions-item>
|
||||
<el-descriptions-item label="单位">{{ detail.unit }}</el-descriptions-item>
|
||||
<el-descriptions-item label="备注">{{ detail.remark }}</el-descriptions-item>
|
||||
</el-descriptions>
|
||||
</el-collapse-item>
|
||||
</el-collapse>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import ProductSelect from '@/components/KLPService/ProductSelect';
|
||||
import { ProductInfo } from '@/components/KLPService';
|
||||
import BomInfoMini from '@/components/KLPService/Renderer/BomInfoMini.vue';
|
||||
|
||||
export default {
|
||||
name: "OrderDetailPanel",
|
||||
dicts: ['order_status'],
|
||||
props: {
|
||||
list: {
|
||||
type: Array,
|
||||
required: true
|
||||
}
|
||||
},
|
||||
components: {
|
||||
ProductSelect,
|
||||
ProductInfo,
|
||||
BomInfoMini
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
orderDetailList: [],
|
||||
queryParams: {
|
||||
pageNum: 1,
|
||||
pageSize: 9999,
|
||||
orderId: this.orderId,
|
||||
productId: undefined,
|
||||
quantity: undefined,
|
||||
unit: undefined,
|
||||
},
|
||||
};
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
</style>
|
||||
@@ -1,310 +0,0 @@
|
||||
<template>
|
||||
<div>
|
||||
<KLPTable
|
||||
v-loading="loading"
|
||||
:data="list"
|
||||
border
|
||||
style="width: 100%; margin-bottom: 20px;"
|
||||
>
|
||||
<el-table-column label="产品" align="center">
|
||||
<template slot-scope="scope">
|
||||
<ProductInfo :product-id="scope.row.productId">
|
||||
<template #default="{ product }">
|
||||
{{ product.productName }}<span v-if="product.productCode">({{ product.productCode }})</span>
|
||||
</template>
|
||||
</ProductInfo>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="参数" align="center">
|
||||
<template slot-scope="scope">
|
||||
<BomInfoMini item-type="product" :item-id="scope.row.productId" />
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="产品数量" align="center" prop="quantity" />
|
||||
<el-table-column label="单位" align="center" prop="unit" />
|
||||
<el-table-column label="备注" align="center" prop="remark" />
|
||||
<el-table-column label="操作">
|
||||
<template slot-scope="scope">
|
||||
<el-button type="text" @click="handleProcessTask(scope.row)">工序</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</KLPTable>
|
||||
|
||||
<el-dialog title="工序" :visible.sync="processTaskDialogVisible" width="80%">
|
||||
<KLPTable
|
||||
:data="processTaskList"
|
||||
border
|
||||
style="width: 100%"
|
||||
@sort-change="handleSortChange"
|
||||
>
|
||||
<el-table-column label="序号" type="index" width="60" align="center" />
|
||||
|
||||
<el-table-column
|
||||
label="工序顺序"
|
||||
prop="sequence"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
<el-input
|
||||
v-model="scope.row.sequence"
|
||||
size="mini"
|
||||
type="number"
|
||||
style="width: 80px;"
|
||||
/>
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label="工艺"
|
||||
prop="processId"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
<CraftSelect v-model="scope.row.processId" />
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label="任务数量"
|
||||
prop="taskQuantity"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
<el-input
|
||||
v-model="scope.row.taskQuantity"
|
||||
size="mini"
|
||||
type="number"
|
||||
style="width: 100px;"
|
||||
/>
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column
|
||||
label="任务状态"
|
||||
prop="taskStatus"
|
||||
align="center"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
<el-select v-model="scope.row.taskStatus" placeholder="请选择任务状态" size="mini">
|
||||
<el-option v-for="item in dict.type.process_task_status" :key="item.value" :label="item.label" :value="item.value" />
|
||||
</el-select>
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column label="操作" align="center" width="120">
|
||||
<template slot-scope="scope">
|
||||
<el-button type="text" size="small" @click="handleDelete(scope.$index)">删除</el-button>
|
||||
<el-button type="text" size="small" @click="handleSave(scope.row)">保存</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</KLPTable>
|
||||
|
||||
<!-- 新增按钮区域 -->
|
||||
<div style="margin-top: 15px; text-align: right;">
|
||||
<el-button
|
||||
type="primary"
|
||||
icon="el-icon-plus"
|
||||
@click="handleAddProcessTask"
|
||||
>
|
||||
新增工序
|
||||
</el-button>
|
||||
<!-- <el-button
|
||||
type="success"
|
||||
style="margin-left: 10px;"
|
||||
@click="handleSaveProcessTasks"
|
||||
>
|
||||
保存所有工序
|
||||
</el-button> -->
|
||||
</div>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import ProductSelect from '@/components/KLPService/ProductSelect';
|
||||
import { ProductInfo } from '@/components/KLPService';
|
||||
import BomInfoMini from '@/components/KLPService/Renderer/BomInfoMini.vue';
|
||||
import { listProcessTask, addProcessTask, updateProcessTask } from '@/api/wms/processTask';
|
||||
import CraftSelect from '@/components/KLPService/CraftSelect';
|
||||
|
||||
export default {
|
||||
name: "OrderDetailPanel",
|
||||
dicts: ['order_status', 'process_task_status'],
|
||||
props: {
|
||||
list: {
|
||||
type: Array,
|
||||
required: true
|
||||
},
|
||||
planId: {
|
||||
type: [String, Number, undefined],
|
||||
required: true
|
||||
}
|
||||
},
|
||||
components: {
|
||||
ProductSelect,
|
||||
ProductInfo,
|
||||
BomInfoMini,
|
||||
CraftSelect
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
loading: false,
|
||||
orderDetailList: [],
|
||||
queryParams: {
|
||||
pageNum: 1,
|
||||
pageSize: 9999,
|
||||
orderId: this.orderId,
|
||||
productId: undefined,
|
||||
quantity: undefined,
|
||||
unit: undefined,
|
||||
// 排序参数
|
||||
orderByColumn: '',
|
||||
isAsc: 'asc'
|
||||
},
|
||||
processTaskDialogVisible: false,
|
||||
processTaskList: [],
|
||||
form: {},
|
||||
currentProductId: null,
|
||||
currentProductCount: 0,
|
||||
};
|
||||
},
|
||||
methods: {
|
||||
handleProcessTask(row) {
|
||||
this.processTaskDialogVisible = true;
|
||||
this.currentProductId = row.productId;
|
||||
this.currentProductCount = row.quantity;
|
||||
this.form = {
|
||||
productId: row.productId,
|
||||
planId: this.planId,
|
||||
// 重置排序参数
|
||||
orderByColumn: '',
|
||||
isAsc: 'asc'
|
||||
};
|
||||
this.getProcessTaskList();
|
||||
},
|
||||
|
||||
// 获取工序任务列表
|
||||
getProcessTaskList() {
|
||||
this.loading = true;
|
||||
// 将排序参数添加到请求中
|
||||
const params = {
|
||||
...this.form,
|
||||
orderByColumn: this.queryParams.orderByColumn,
|
||||
isAsc: this.queryParams.isAsc
|
||||
};
|
||||
|
||||
listProcessTask(params).then(res => {
|
||||
this.processTaskList = res.rows || [];
|
||||
this.loading = false;
|
||||
}).catch(() => {
|
||||
this.loading = false;
|
||||
});
|
||||
},
|
||||
|
||||
// 处理排序变化
|
||||
handleSortChange({ column, prop, order }) {
|
||||
if (order) {
|
||||
this.queryParams.orderByColumn = prop;
|
||||
this.queryParams.isAsc = order === 'ascending' ? 'asc' : 'desc';
|
||||
} else {
|
||||
this.queryParams.orderByColumn = '';
|
||||
this.queryParams.isAsc = 'asc';
|
||||
}
|
||||
// 重新获取数据
|
||||
this.getProcessTaskList();
|
||||
},
|
||||
|
||||
// 新增工序
|
||||
handleAddProcessTask() {
|
||||
const newSequence =
|
||||
this.processTaskList.length >= 1 ?
|
||||
Math.max(...this.processTaskList.map(item => item.sequence || 0)) + 1
|
||||
: 1;
|
||||
// 添加新的工序行
|
||||
this.processTaskList.push({
|
||||
id: null, // 新记录ID为空
|
||||
productId: this.currentProductId,
|
||||
planId: this.planId,
|
||||
processId: '',
|
||||
taskQuantity: this.currentProductCount,
|
||||
taskStatus: 'pending',
|
||||
sequence: newSequence
|
||||
});
|
||||
},
|
||||
|
||||
// 删除工序
|
||||
handleDelete(index) {
|
||||
this.$confirm('确定要删除这条工序吗？', '提示', {
|
||||
confirmButtonText: '确定',
|
||||
cancelButtonText: '取消',
|
||||
type: 'warning'
|
||||
}).then(() => {
|
||||
this.processTaskList.splice(index, 1);
|
||||
this.$message.success('删除成功');
|
||||
}).catch(() => {
|
||||
// 取消删除
|
||||
});
|
||||
},
|
||||
|
||||
// 保存所有工序
|
||||
handleSaveProcessTasks() {
|
||||
// 验证数据
|
||||
const invalidItems = this.processTaskList.filter(item =>
|
||||
!item.processId || !item.quantity || !item.taskStatus
|
||||
);
|
||||
|
||||
if (invalidItems.length > 0) {
|
||||
this.$message.error('请完善所有工序的工艺、数量和状态信息');
|
||||
return;
|
||||
}
|
||||
|
||||
this.loading = true;
|
||||
saveProcessTasks({
|
||||
productId: this.currentProductId,
|
||||
planId: this.planId,
|
||||
tasks: this.processTaskList
|
||||
}).then(res => {
|
||||
this.$message.success('保存成功');
|
||||
this.getProcessTaskList(); // 重新加载数据
|
||||
this.loading = false;
|
||||
}).catch(() => {
|
||||
this.loading = false;
|
||||
});
|
||||
},
|
||||
|
||||
// 查看工序详情
|
||||
handleSave(row) {
|
||||
if (row.taskId) {
|
||||
updateProcessTask(row).then(_ => {
|
||||
this.$message.success('保存成功')
|
||||
})
|
||||
} else {
|
||||
addProcessTask(row).then(_ => {
|
||||
this.$message.success('保存成功')
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
::v-deep .el-table__header-wrapper th {
|
||||
background-color: #f5f7fa;
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
::v-deep .el-table-column--sortable .el-table-header__sort {
|
||||
color: #606266;
|
||||
}
|
||||
|
||||
::v-deep .el-dialog__body {
|
||||
padding: 20px;
|
||||
max-height: 60vh;
|
||||
overflow-y: auto;
|
||||
}
|
||||
|
||||
::v-deep .el-input--mini {
|
||||
width: 100px;
|
||||
}
|
||||
</style>
|
||||
@@ -1,138 +0,0 @@
|
||||
<template>
|
||||
<el-select
|
||||
v-model="innerValue"
|
||||
placeholder="请选择或搜索制造规范"
|
||||
clearable
|
||||
filterable
|
||||
remote
|
||||
:remote-method="handleRemoteSearch"
|
||||
:loading="loading"
|
||||
@change="handleSelectChange"
|
||||
style="width: 100%"
|
||||
>
|
||||
<!-- 下拉选项：循环制造规范列表 -->
|
||||
<el-option
|
||||
v-for="item in mSpecList"
|
||||
:key="item.specId"
|
||||
:label="item.specName"
|
||||
:value="item.specId"
|
||||
/>
|
||||
|
||||
<!-- 无数据提示 -->
|
||||
<el-option
|
||||
v-if="mSpecList.length === 0 && !loading"
|
||||
value=""
|
||||
disabled
|
||||
>
|
||||
暂无匹配制造规范
|
||||
</el-option>
|
||||
</el-select>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { listManufacturingSpec } from '@/api/work/manufacturingSpec'
|
||||
import { debounce } from '@/utils' // 防抖：避免频繁触发接口请求
|
||||
|
||||
export default {
|
||||
name: 'MSpecSelect',
|
||||
// 1. 接收外部传入的v-model值（必加，双向绑定的入口）
|
||||
props: {
|
||||
value: {
|
||||
type: [String, Number, undefined], // 支持字符串/数字ID（兼容不同后端返回类型）
|
||||
default: undefined // 初始值默认undefined（未选择状态）
|
||||
},
|
||||
// 可选：允许外部自定义搜索参数的字段名（增强组件复用性）
|
||||
searchKey: {
|
||||
type: String,
|
||||
default: 'specName' // 默认为“规范名称”搜索（对应接口的mSpecName参数）
|
||||
},
|
||||
// 可选：每页加载数量（外部可配置）
|
||||
pageSize: {
|
||||
type: Number,
|
||||
default: 20
|
||||
},
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
mSpecList: [], // 制造规范列表数据
|
||||
loading: false, // 远程请求加载状态
|
||||
queryParams: {
|
||||
// 搜索参数：默认用specName（可通过searchKey自定义）
|
||||
specName: undefined,
|
||||
pageNum: 1, // 分页：当前页码
|
||||
pageSize: this.pageSize // 分页：每页条数（关联props的pageSize）
|
||||
}
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
// 2. 核心：内部值与外部value的双向同步桥梁
|
||||
innerValue: {
|
||||
get() {
|
||||
// 外部传入的value -> 内部el-select的v-model值（初始回显）
|
||||
return this.value
|
||||
},
|
||||
set(newVal) {
|
||||
// 内部el-select值变化时 -> 触发input事件，同步给外部v-model
|
||||
this.$emit('input', newVal)
|
||||
}
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
// 3. 监听外部value变化（如父组件直接修改v-model值），同步更新内部选择状态
|
||||
value(newVal) {
|
||||
// 仅当外部值与内部值不一致时更新（避免死循环）
|
||||
if (newVal !== this.innerValue) {
|
||||
this.innerValue = newVal
|
||||
}
|
||||
},
|
||||
// 监听searchKey变化（外部修改搜索字段时，重置搜索参数）
|
||||
searchKey(newKey) {
|
||||
// 清空原搜索字段的值（避免残留旧字段的搜索条件）
|
||||
this.queryParams[this.searchKey] = undefined
|
||||
}
|
||||
},
|
||||
created() {
|
||||
// 初始化：加载默认制造规范列表
|
||||
this.getList()
|
||||
// 初始化防抖函数（300ms延迟，可根据需求调整）
|
||||
this.debouncedSearch = debounce(this.getList, 300)
|
||||
},
|
||||
methods: {
|
||||
// 4. 远程搜索逻辑（输入时触发）
|
||||
handleRemoteSearch(query) {
|
||||
// 根据searchKey设置搜索参数（如：specName=query）
|
||||
this.queryParams[this.searchKey] = query.trim() // 去除首尾空格，避免无效搜索
|
||||
this.queryParams.pageNum = 1 // 重置页码为1（新搜索从第一页开始）
|
||||
this.debouncedSearch() // 防抖后执行搜索
|
||||
},
|
||||
|
||||
// 5. 获取制造规范列表（远程接口请求）
|
||||
getList() {
|
||||
this.loading = true // 开始加载：显示加载动画
|
||||
listManufacturingSpec(this.queryParams)
|
||||
.then(res => {
|
||||
// 接口成功：赋值列表数据（兼容res.rows或res.data.rows，避免接口返回格式差异）
|
||||
this.mSpecList = res.rows || res.data?.rows || []
|
||||
})
|
||||
.catch(() => {
|
||||
// 接口失败：清空列表，避免旧数据残留
|
||||
this.mSpecList = []
|
||||
this.$message.error('获取制造规范列表失败，请重试') // 错误提示（优化用户体验）
|
||||
})
|
||||
.finally(() => {
|
||||
this.loading = false // 结束加载：隐藏加载动画
|
||||
})
|
||||
},
|
||||
|
||||
// 6. 选择变化时触发（返回完整订单项，方便父组件使用）
|
||||
handleSelectChange(mSpecId) {
|
||||
// 根据选中的ID，找到对应的完整制造规范对象
|
||||
const selectedItem = this.mSpecList.find(item => item.specId === mSpecId)
|
||||
// 触发change事件：返回完整项（父组件可通过@change接收）
|
||||
this.$emit('change', selectedItem)
|
||||
// 可选：触发input事件后，额外触发change事件（符合常规组件使用习惯）
|
||||
this.$emit('update:value', selectedItem)
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
@@ -1,138 +0,0 @@
|
||||
<template>
|
||||
<el-select
|
||||
v-model="innerValue"
|
||||
placeholder="请选择或搜索制造规范"
|
||||
clearable
|
||||
filterable
|
||||
remote
|
||||
:remote-method="handleRemoteSearch"
|
||||
:loading="loading"
|
||||
@change="handleSelectChange"
|
||||
style="width: 100%"
|
||||
>
|
||||
<!-- 下拉选项：循环制造规范列表 -->
|
||||
<el-option
|
||||
v-for="item in pSpecList"
|
||||
:key="item.groupId"
|
||||
:label="item.groupName"
|
||||
:value="item.groupId"
|
||||
/>
|
||||
|
||||
<!-- 无数据提示 -->
|
||||
<el-option
|
||||
v-if="pSpecList.length === 0 && !loading"
|
||||
value=""
|
||||
disabled
|
||||
>
|
||||
暂无匹配制造规范
|
||||
</el-option>
|
||||
</el-select>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { listProductSpecGroup } from '@/api/work/productSpecGroup'
|
||||
import { debounce } from '@/utils' // 防抖：避免频繁触发接口请求
|
||||
|
||||
export default {
|
||||
name: 'MSpecSelect',
|
||||
// 1. 接收外部传入的v-model值（必加，双向绑定的入口）
|
||||
props: {
|
||||
value: {
|
||||
type: [String, Number, undefined], // 支持字符串/数字ID（兼容不同后端返回类型）
|
||||
default: undefined // 初始值默认undefined（未选择状态）
|
||||
},
|
||||
// 可选：允许外部自定义搜索参数的字段名（增强组件复用性）
|
||||
searchKey: {
|
||||
type: String,
|
||||
default: 'groupName' // 默认为“规范名称”搜索（对应接口的mSpecName参数）
|
||||
},
|
||||
// 可选：每页加载数量（外部可配置）
|
||||
pageSize: {
|
||||
type: Number,
|
||||
default: 20
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
pSpecList: [], // 制造规范列表数据
|
||||
loading: false, // 远程请求加载状态
|
||||
queryParams: {
|
||||
// 搜索参数：默认用specName（可通过searchKey自定义）
|
||||
specName: undefined,
|
||||
pageNum: 1, // 分页：当前页码
|
||||
pageSize: this.pageSize // 分页：每页条数（关联props的pageSize）
|
||||
}
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
// 2. 核心：内部值与外部value的双向同步桥梁
|
||||
innerValue: {
|
||||
get() {
|
||||
// 外部传入的value -> 内部el-select的v-model值（初始回显）
|
||||
return this.value
|
||||
},
|
||||
set(newVal) {
|
||||
// 内部el-select值变化时 -> 触发input事件，同步给外部v-model
|
||||
this.$emit('input', newVal)
|
||||
}
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
// 3. 监听外部value变化（如父组件直接修改v-model值），同步更新内部选择状态
|
||||
value(newVal) {
|
||||
// 仅当外部值与内部值不一致时更新（避免死循环）
|
||||
if (newVal !== this.innerValue) {
|
||||
this.innerValue = newVal
|
||||
}
|
||||
},
|
||||
// 监听searchKey变化（外部修改搜索字段时，重置搜索参数）
|
||||
searchKey(newKey) {
|
||||
// 清空原搜索字段的值（避免残留旧字段的搜索条件）
|
||||
this.queryParams[this.searchKey] = undefined
|
||||
}
|
||||
},
|
||||
created() {
|
||||
// 初始化：加载默认制造规范列表
|
||||
this.getList()
|
||||
// 初始化防抖函数（300ms延迟，可根据需求调整）
|
||||
this.debouncedSearch = debounce(this.getList, 300)
|
||||
},
|
||||
methods: {
|
||||
// 4. 远程搜索逻辑（输入时触发）
|
||||
handleRemoteSearch(query) {
|
||||
// 根据searchKey设置搜索参数（如：specName=query）
|
||||
this.queryParams[this.searchKey] = query.trim() // 去除首尾空格，避免无效搜索
|
||||
this.queryParams.pageNum = 1 // 重置页码为1（新搜索从第一页开始）
|
||||
this.debouncedSearch() // 防抖后执行搜索
|
||||
},
|
||||
|
||||
// 5. 获取制造规范列表（远程接口请求）
|
||||
getList() {
|
||||
this.loading = true // 开始加载：显示加载动画
|
||||
listProductSpecGroup(this.queryParams)
|
||||
.then(res => {
|
||||
// 接口成功：赋值列表数据（兼容res.rows或res.data.rows，避免接口返回格式差异）
|
||||
this.pSpecList = res.rows || res.data?.rows || []
|
||||
})
|
||||
.catch(() => {
|
||||
// 接口失败：清空列表，避免旧数据残留
|
||||
this.pSpecList = []
|
||||
this.$message.error('获取制造规范列表失败，请重试') // 错误提示（优化用户体验）
|
||||
})
|
||||
.finally(() => {
|
||||
this.loading = false // 结束加载：隐藏加载动画
|
||||
})
|
||||
},
|
||||
|
||||
// 6. 选择变化时触发（返回完整订单项，方便父组件使用）
|
||||
handleSelectChange(pSpecId) {
|
||||
// 根据选中的ID，找到对应的完整制造规范对象
|
||||
const selectedItem = this.pSpecList.find(item => item.groupId === pSpecId)
|
||||
// 触发change事件：返回完整项（父组件可通过@change接收）
|
||||
this.$emit('change', selectedItem)
|
||||
// 可选：触发input事件后，额外触发change事件（符合常规组件使用习惯）
|
||||
this.$emit('update:value', selectedItem)
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
@@ -1,319 +0,0 @@
|
||||
<template>
|
||||
<div class="app-container">
|
||||
<el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px">
|
||||
<el-form-item label="工艺编码" prop="processCode">
|
||||
<el-input
|
||||
v-model="queryParams.processCode"
|
||||
placeholder="请输入工艺编码"
|
||||
clearable
|
||||
@keyup.enter.native="handleQuery"
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item label="工艺名称" prop="processName">
|
||||
<el-input
|
||||
v-model="queryParams.processName"
|
||||
placeholder="请输入工艺名称"
|
||||
clearable
|
||||
@keyup.enter.native="handleQuery"
|
||||
/>
|
||||
</el-form-item>
|
||||
<!-- <el-form-item label="产出产品" prop="outputProductId">
|
||||
<el-input
|
||||
v-model="queryParams.outputProductId"
|
||||
placeholder="请输入产出产品"
|
||||
clearable
|
||||
@keyup.enter.native="handleQuery"
|
||||
/>
|
||||
</el-form-item> -->
|
||||
<el-form-item label="工艺描述" prop="processDesc">
|
||||
<el-input
|
||||
v-model="queryParams.processDesc"
|
||||
placeholder="请输入工艺描述"
|
||||
clearable
|
||||
@keyup.enter.native="handleQuery"
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item label="标准工时" prop="standardTime">
|
||||
<el-input
|
||||
v-model="queryParams.standardTime"
|
||||
placeholder="请输入标准工时"
|
||||
clearable
|
||||
@keyup.enter.native="handleQuery"
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
|
||||
<el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
|
||||
<el-row :gutter="10" class="mb8">
|
||||
<el-col :span="1.5">
|
||||
<el-button
|
||||
type="primary"
|
||||
plain
|
||||
icon="el-icon-plus"
|
||||
size="mini"
|
||||
@click="handleAdd"
|
||||
>新增</el-button>
|
||||
</el-col>
|
||||
<el-col :span="1.5">
|
||||
<el-button
|
||||
type="success"
|
||||
plain
|
||||
icon="el-icon-edit"
|
||||
size="mini"
|
||||
:disabled="single"
|
||||
@click="handleUpdate"
|
||||
>修改</el-button>
|
||||
</el-col>
|
||||
<el-col :span="1.5">
|
||||
<el-button
|
||||
type="danger"
|
||||
plain
|
||||
icon="el-icon-delete"
|
||||
size="mini"
|
||||
:disabled="multiple"
|
||||
@click="handleDelete"
|
||||
>删除</el-button>
|
||||
</el-col>
|
||||
<el-col :span="1.5">
|
||||
<el-button
|
||||
type="warning"
|
||||
plain
|
||||
icon="el-icon-download"
|
||||
size="mini"
|
||||
@click="handleExport"
|
||||
>导出</el-button>
|
||||
</el-col>
|
||||
<right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
|
||||
</el-row>
|
||||
|
||||
<KLPTable v-loading="loading" :data="processeList" @selection-change="handleSelectionChange">
|
||||
<el-table-column type="selection" width="55" align="center" />
|
||||
<el-table-column label="工艺ID" align="center" prop="processId" v-if="false"/>
|
||||
<el-table-column label="工艺编码" align="center" prop="processCode" />
|
||||
<el-table-column label="工艺名称" align="center" prop="processName" />
|
||||
<!-- <el-table-column label="产出产品" align="center" prop="outputProductId" /> -->
|
||||
<el-table-column label="工艺描述" align="center" prop="processDesc" />
|
||||
<el-table-column label="标准工时" align="center" prop="standardTime" />
|
||||
<el-table-column label="备注" align="center" prop="remark" />
|
||||
<el-table-column label="操作" align="center" class-name="small-padding fixed-width">
|
||||
<template slot-scope="scope">
|
||||
<el-button
|
||||
size="mini"
|
||||
type="text"
|
||||
icon="el-icon-edit"
|
||||
@click="handleUpdate(scope.row)"
|
||||
>修改</el-button>
|
||||
<el-button
|
||||
size="mini"
|
||||
type="text"
|
||||
icon="el-icon-delete"
|
||||
@click="handleDelete(scope.row)"
|
||||
>删除</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</KLPTable>
|
||||
|
||||
<pagination
|
||||
v-show="total>0"
|
||||
:total="total"
|
||||
:page.sync="queryParams.pageNum"
|
||||
:limit.sync="queryParams.pageSize"
|
||||
@pagination="getList"
|
||||
/>
|
||||
|
||||
<!-- 添加或修改工艺对话框 -->
|
||||
<el-dialog :title="title" :visible.sync="open" width="500px" append-to-body>
|
||||
<el-form ref="form" :model="form" :rules="rules" label-width="80px">
|
||||
<el-form-item label="工艺编码" prop="processCode">
|
||||
<el-input v-model="form.processCode" placeholder="请输入工艺编码" />
|
||||
</el-form-item>
|
||||
<el-form-item label="工艺名称" prop="processName">
|
||||
<el-input v-model="form.processName" placeholder="请输入工艺名称" />
|
||||
</el-form-item>
|
||||
<!-- <el-form-item label="产出产品" prop="outputProductId">
|
||||
<el-input v-model="form.outputProductId" placeholder="请输入产出产品" />
|
||||
</el-form-item> -->
|
||||
<el-form-item label="工艺描述" prop="processDesc">
|
||||
<el-input v-model="form.processDesc" type="textarea" placeholder="请输入内容" />
|
||||
</el-form-item>
|
||||
<el-form-item label="标准工时" prop="standardTime">
|
||||
<el-input v-model="form.standardTime" placeholder="请输入标准工时" />
|
||||
</el-form-item>
|
||||
<el-form-item label="备注" prop="remark">
|
||||
<el-input v-model="form.remark" placeholder="请输入备注" />
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<div slot="footer" class="dialog-footer">
|
||||
<el-button :loading="buttonLoading" type="primary" @click="submitForm">确 定</el-button>
|
||||
<el-button @click="cancel">取 消</el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { listProcesse, getProcesse, delProcesse, addProcesse, updateProcesse } from "@/api/wms/craft";
|
||||
|
||||
export default {
|
||||
name: "Processe",
|
||||
data() {
|
||||
return {
|
||||
// 按钮loading
|
||||
buttonLoading: false,
|
||||
// 遮罩层
|
||||
loading: true,
|
||||
// 选中数组
|
||||
ids: [],
|
||||
// 非单个禁用
|
||||
single: true,
|
||||
// 非多个禁用
|
||||
multiple: true,
|
||||
// 显示搜索条件
|
||||
showSearch: true,
|
||||
// 总条数
|
||||
total: 0,
|
||||
// 工艺表格数据
|
||||
processeList: [],
|
||||
// 弹出层标题
|
||||
title: "",
|
||||
// 是否显示弹出层
|
||||
open: false,
|
||||
// 查询参数
|
||||
queryParams: {
|
||||
pageNum: 1,
|
||||
pageSize: 20,
|
||||
processCode: undefined,
|
||||
processName: undefined,
|
||||
outputProductId: undefined,
|
||||
processDesc: undefined,
|
||||
standardTime: undefined,
|
||||
},
|
||||
// 表单参数
|
||||
form: {},
|
||||
// 表单校验
|
||||
rules: {
|
||||
}
|
||||
};
|
||||
},
|
||||
created() {
|
||||
this.getList();
|
||||
},
|
||||
methods: {
|
||||
/** 查询工艺列表 */
|
||||
getList() {
|
||||
this.loading = true;
|
||||
listProcesse(this.queryParams).then(response => {
|
||||
this.processeList = response.rows;
|
||||
this.total = response.total;
|
||||
this.loading = false;
|
||||
});
|
||||
},
|
||||
// 取消按钮
|
||||
cancel() {
|
||||
this.open = false;
|
||||
this.reset();
|
||||
},
|
||||
// 表单重置
|
||||
reset() {
|
||||
this.form = {
|
||||
processId: undefined,
|
||||
processCode: undefined,
|
||||
processName: undefined,
|
||||
outputProductId: undefined,
|
||||
processDesc: undefined,
|
||||
standardTime: undefined,
|
||||
delFlag: undefined,
|
||||
remark: undefined,
|
||||
createTime: undefined,
|
||||
createBy: undefined,
|
||||
updateTime: undefined,
|
||||
updateBy: undefined
|
||||
};
|
||||
this.resetForm("form");
|
||||
},
|
||||
/** 搜索按钮操作 */
|
||||
handleQuery() {
|
||||
this.queryParams.pageNum = 1;
|
||||
this.getList();
|
||||
},
|
||||
/** 重置按钮操作 */
|
||||
resetQuery() {
|
||||
this.resetForm("queryForm");
|
||||
this.handleQuery();
|
||||
},
|
||||
// 多选框选中数据
|
||||
handleSelectionChange(selection) {
|
||||
this.ids = selection.map(item => item.processId)
|
||||
this.single = selection.length!==1
|
||||
this.multiple = !selection.length
|
||||
},
|
||||
/** 新增按钮操作 */
|
||||
handleAdd() {
|
||||
this.reset();
|
||||
this.open = true;
|
||||
this.title = "添加工艺";
|
||||
},
|
||||
/** 修改按钮操作 */
|
||||
handleUpdate(row) {
|
||||
this.loading = true;
|
||||
this.reset();
|
||||
const processId = row.processId || this.ids
|
||||
getProcesse(processId).then(response => {
|
||||
this.loading = false;
|
||||
this.form = response.data;
|
||||
this.open = true;
|
||||
this.title = "修改工艺";
|
||||
});
|
||||
},
|
||||
/** 提交按钮 */
|
||||
submitForm() {
|
||||
this.$refs["form"].validate(valid => {
|
||||
if (valid) {
|
||||
this.buttonLoading = true;
|
||||
if (this.form.processId != null) {
|
||||
updateProcesse(this.form).then(response => {
|
||||
this.$modal.msgSuccess("修改成功");
|
||||
this.open = false;
|
||||
this.getList();
|
||||
}).finally(() => {
|
||||
this.buttonLoading = false;
|
||||
});
|
||||
} else {
|
||||
addProcesse(this.form).then(response => {
|
||||
this.$modal.msgSuccess("新增成功");
|
||||
this.open = false;
|
||||
this.getList();
|
||||
}).finally(() => {
|
||||
this.buttonLoading = false;
|
||||
});
|
||||
}
|
||||
}
|
||||
});
|
||||
},
|
||||
/** 删除按钮操作 */
|
||||
handleDelete(row) {
|
||||
const processIds = row.processId || this.ids;
|
||||
this.$modal.confirm('是否确认删除工艺编号为"' + processIds + '"的数据项？').then(() => {
|
||||
this.loading = true;
|
||||
return delProcesse(processIds);
|
||||
}).then(() => {
|
||||
this.loading = false;
|
||||
this.getList();
|
||||
this.$modal.msgSuccess("删除成功");
|
||||
}).catch(() => {
|
||||
}).finally(() => {
|
||||
this.loading = false;
|
||||
});
|
||||
},
|
||||
/** 导出按钮操作 */
|
||||
handleExport() {
|
||||
this.download('klp/processe/export', {
|
||||
...this.queryParams
|
||||
}, `processe_${new Date().getTime()}.xlsx`)
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
@@ -1,201 +0,0 @@
|
||||
<template>
|
||||
<div ref="ganttChart" class="echarts-gantt-wrapper" style="width:100%;height:320px;"></div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import * as echarts from 'echarts';
|
||||
const colorList = [
|
||||
'#409EFF', '#67C23A', '#E6A23C', '#F56C6C', '#909399',
|
||||
'#13C2C2', '#B37FEB', '#FF85C0', '#36CBCB', '#FFC53D'
|
||||
];
|
||||
function getColor(lineId, orderId, idx) {
|
||||
if (!lineId) return colorList[idx % colorList.length];
|
||||
const base = Math.abs(Number(lineId)) % colorList.length;
|
||||
if (!orderId) return colorList[base];
|
||||
return colorList[(base + Math.abs(Number(orderId)) % colorList.length) % colorList.length];
|
||||
}
|
||||
export default {
|
||||
name: 'GanttChartEcharts',
|
||||
props: {
|
||||
tasks: {
|
||||
type: Array,
|
||||
default: () => []
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
chart: null
|
||||
};
|
||||
},
|
||||
watch: {
|
||||
tasks: {
|
||||
handler() {
|
||||
this.renderChart();
|
||||
},
|
||||
deep: true
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
this.renderChart();
|
||||
window.addEventListener('resize', this.resizeChart);
|
||||
},
|
||||
beforeDestroy() {
|
||||
if (this.chart) this.chart.dispose();
|
||||
window.removeEventListener('resize', this.resizeChart);
|
||||
},
|
||||
methods: {
|
||||
renderChart() {
|
||||
if (!this.$refs.ganttChart) return;
|
||||
if (this.chart) this.chart.dispose();
|
||||
this.chart = echarts.init(this.$refs.ganttChart);
|
||||
if (!this.tasks || this.tasks.length === 0) {
|
||||
this.chart.clear();
|
||||
return;
|
||||
}
|
||||
// 处理数据，兼容多种字段名，保证任务名唯一
|
||||
|
||||
const taskData = this.tasks
|
||||
.map((item, idx) => {
|
||||
const name = (item.taskName || item.planName || item.remark || item.productName || item.name || `任务${idx+1}`) + (item.productName ? `-${item.productName}` : '');
|
||||
const start = item.startDate || item.start_time || item.start || item.start_date;
|
||||
const end = item.endDate || item.end_time || item.end || item.end_date;
|
||||
console.log(item.lineId, item.orderId, idx, '颜色取值依据')
|
||||
return {
|
||||
name,
|
||||
value: [start, end],
|
||||
itemStyle: {
|
||||
color: getColor(item.lineId, item.orderId, idx),
|
||||
borderRadius: 6
|
||||
},
|
||||
lineId: item.lineId,
|
||||
orderId: item.orderId,
|
||||
productId: item.productId,
|
||||
quantity: item.quantity,
|
||||
startDate: start,
|
||||
endDate: end
|
||||
};
|
||||
})
|
||||
// 确保三个字段都存在：startDate,endDate,name
|
||||
.filter(item => item.startDate && item.endDate && item.name);
|
||||
|
||||
// 先全部用 getColor 分配基础色
|
||||
taskData.forEach((item, idx) => {
|
||||
item._color = getColor(item.lineId, item.orderId, idx);
|
||||
});
|
||||
// 检查冲突（同产线时间重叠），有冲突的都标红
|
||||
for (let i = 0; i < taskData.length; i++) {
|
||||
for (let j = i + 1; j < taskData.length; j++) {
|
||||
if (
|
||||
taskData[i].lineId &&
|
||||
taskData[i].lineId === taskData[j].lineId &&
|
||||
new Date(taskData[i].value[0]) < new Date(taskData[j].value[1]) &&
|
||||
new Date(taskData[i].value[1]) > new Date(taskData[j].value[0])
|
||||
) {
|
||||
taskData[i]._color = '#F56C6C';
|
||||
taskData[j]._color = '#F56C6C';
|
||||
}
|
||||
}
|
||||
}
|
||||
// 颜色映射
|
||||
const colorMap = taskData.map(d => d._color);
|
||||
// Y轴任务名
|
||||
const yData = taskData.map(d => d.name);
|
||||
// X轴时间范围
|
||||
const minDate = Math.min(...taskData.map(d => new Date(d.value[0]).getTime()));
|
||||
const maxDate = Math.max(...taskData.map(d => new Date(d.value[1]).getTime()));
|
||||
// 自动调整时间轴范围，避免跨度过大导致任务条重叠
|
||||
const oneMonth = 30 * 24 * 3600 * 1000;
|
||||
let xMin = minDate - oneMonth;
|
||||
let xMax = maxDate + oneMonth;
|
||||
// 如果跨度大于一年，仍然只扩展一个月
|
||||
// 如果跨度小于一个月，最小跨度为两个月
|
||||
if (xMax - xMin < 2 * oneMonth) {
|
||||
xMax = xMin + 2 * oneMonth;
|
||||
}
|
||||
console.log(taskData);
|
||||
|
||||
// 配置
|
||||
const option = {
|
||||
tooltip: {
|
||||
confine: true,
|
||||
formatter: params => {
|
||||
// 用 params.data[2] 作为索引查找 taskData
|
||||
const idx = params.data && params.data[2];
|
||||
const d = (typeof idx === 'number' && taskData[idx]) ? taskData[idx] : {};
|
||||
return `任务：${d.name || ''}` +
|
||||
`<br/>开始：${d.startDate || ''}` +
|
||||
`<br/>结束：${d.endDate || ''}` +
|
||||
`<br/>日产能：${d.capacity != null ? d.capacity : d.capacity || ''}` +
|
||||
`<br/>总产能：${d.totalCapacity != null ? d.totalCapacity : d.total_capacity || ''}` +
|
||||
`<br/>目标生产：${d.planQuantity != null ? d.planQuantity : d.plan_quantity || ''}` +
|
||||
`<br/>天数：${d.days != null ? d.days : d.day || ''}` +
|
||||
`<br/>数量：${d.quantity != null ? d.quantity : ''}`;
|
||||
}
|
||||
},
|
||||
grid: { left: 120, right: 40, top: 30, bottom: 80 },
|
||||
xAxis: {
|
||||
type: 'time',
|
||||
min: xMin,
|
||||
max: xMax,
|
||||
axisLabel: {
|
||||
formatter: v => echarts.format.formatTime('yyyy-MM-dd', v),
|
||||
rotate: 45 // 关键：倾斜45度
|
||||
}
|
||||
},
|
||||
yAxis: {
|
||||
type: 'category',
|
||||
data: yData,
|
||||
axisTick: { show: false },
|
||||
axisLine: { show: false },
|
||||
axisLabel: { fontWeight: 'bold' }
|
||||
},
|
||||
series: [{
|
||||
type: 'custom',
|
||||
renderItem: (params, api) => {
|
||||
const categoryIndex = api.value(2);
|
||||
const start = api.coord([api.value(0), categoryIndex]);
|
||||
const end = api.coord([api.value(1), categoryIndex]);
|
||||
const barHeight = 18;
|
||||
// 颜色从 colorMap 查
|
||||
const idx = params.dataIndex;
|
||||
let fillColor = colorMap[idx] || '#409EFF';
|
||||
return {
|
||||
type: 'rect',
|
||||
shape: {
|
||||
x: start[0],
|
||||
y: start[1] - barHeight / 2,
|
||||
width: end[0] - start[0],
|
||||
height: barHeight,
|
||||
r: 6
|
||||
},
|
||||
style: {
|
||||
fill: fillColor
|
||||
}
|
||||
};
|
||||
},
|
||||
encode: {
|
||||
x: [0, 1],
|
||||
y: 2
|
||||
},
|
||||
data: taskData.map((d, i) => [d.value[0], d.value[1], i]),
|
||||
itemStyle: {
|
||||
borderRadius: 6
|
||||
}
|
||||
}]
|
||||
};
|
||||
this.chart.setOption(option);
|
||||
},
|
||||
resizeChart() {
|
||||
if (this.chart) this.chart.resize();
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style>
|
||||
.echarts-gantt-wrapper {
|
||||
width: 100%;
|
||||
min-height: 220px;
|
||||
background: #fff;
|
||||
}
|
||||
</style>
|
||||
@@ -1,416 +0,0 @@
|
||||
<template>
|
||||
<div class="production-line-page">
|
||||
<el-tabs v-model="activeTab">
|
||||
<el-tab-pane label="列表" name="list">
|
||||
<!-- 原有列表内容 -->
|
||||
<div v-show="activeTab === 'list'">
|
||||
<!-- 保持原有内容不变 -->
|
||||
<div class="list-content">
|
||||
<el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px">
|
||||
<el-form-item label="产线编号" prop="lineCode">
|
||||
<el-input
|
||||
v-model="queryParams.lineCode"
|
||||
placeholder="请输入产线编号"
|
||||
clearable
|
||||
@keyup.enter.native="handleQuery"
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item label="产线名称" prop="lineName">
|
||||
<el-input
|
||||
v-model="queryParams.lineName"
|
||||
placeholder="请输入产线名称"
|
||||
clearable
|
||||
@keyup.enter.native="handleQuery"
|
||||
/>
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item>
|
||||
<el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
|
||||
<el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
|
||||
<el-row :gutter="10" class="mb8">
|
||||
<el-col :span="1.5">
|
||||
<el-button
|
||||
type="primary"
|
||||
plain
|
||||
icon="el-icon-plus"
|
||||
size="mini"
|
||||
@click="handleAdd"
|
||||
>新增</el-button>
|
||||
</el-col>
|
||||
<el-col :span="1.5">
|
||||
<el-button
|
||||
type="success"
|
||||
plain
|
||||
icon="el-icon-edit"
|
||||
size="mini"
|
||||
:disabled="single"
|
||||
@click="handleUpdate"
|
||||
>修改</el-button>
|
||||
</el-col>
|
||||
<el-col :span="1.5">
|
||||
<el-button
|
||||
type="danger"
|
||||
plain
|
||||
icon="el-icon-delete"
|
||||
size="mini"
|
||||
:disabled="multiple"
|
||||
@click="handleDelete"
|
||||
>删除</el-button>
|
||||
</el-col>
|
||||
<el-col :span="1.5">
|
||||
<el-button
|
||||
type="warning"
|
||||
plain
|
||||
icon="el-icon-download"
|
||||
size="mini"
|
||||
@click="handleExport"
|
||||
>导出</el-button>
|
||||
</el-col>
|
||||
<right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
|
||||
</el-row>
|
||||
|
||||
<KLPTable v-loading="loading" :data="productionLineList" @selection-change="handleSelectionChange">
|
||||
<el-table-column type="selection" width="55" align="center" />
|
||||
<el-table-column label="产线编号" align="center" prop="lineCode" />
|
||||
<el-table-column label="产线名称" align="center" prop="lineName" />
|
||||
<el-table-column label="日产能" align="center" prop="capacity" />
|
||||
<el-table-column label="负载任务数/预计耗时" align="center" prop="unit">
|
||||
<template slot-scope="scope">
|
||||
<span>{{ scope.row.planDetailCount }}</span> /
|
||||
<span>{{ scope.row.totalPlanDays }}天</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="产能单位" align="center" prop="unit" />
|
||||
<el-table-column label="是否启用" align="center" prop="isEnabled">
|
||||
<template slot-scope="scope">
|
||||
<el-switch
|
||||
v-model="scope.row.isEnabled"
|
||||
:active-value="1"
|
||||
:inactive-value="0"
|
||||
active-text="启用"
|
||||
inactive-text="禁用"
|
||||
@change="handleEnabledChange(scope.row)"
|
||||
/>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="备注" align="center" prop="remark" />
|
||||
<el-table-column label="操作" align="center" class-name="small-padding fixed-width">
|
||||
<template slot-scope="scope">
|
||||
<el-button
|
||||
size="mini"
|
||||
type="text"
|
||||
icon="el-icon-edit"
|
||||
@click="handleUpdate(scope.row)"
|
||||
>修改</el-button>
|
||||
<el-button
|
||||
size="mini"
|
||||
type="text"
|
||||
icon="el-icon-delete"
|
||||
@click="handleDelete(scope.row)"
|
||||
>删除</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</KLPTable>
|
||||
|
||||
<pagination
|
||||
v-show="total>0"
|
||||
:total="total"
|
||||
:page.sync="queryParams.pageNum"
|
||||
:limit.sync="queryParams.pageSize"
|
||||
@pagination="getList"
|
||||
/>
|
||||
|
||||
<!-- 添加或修改产线对话框 -->
|
||||
<el-dialog :title="title" :visible.sync="open" width="500px" append-to-body>
|
||||
<el-form ref="form" :model="form" :rules="rules" label-width="80px">
|
||||
<el-form-item label="产线编号" prop="lineCode">
|
||||
<el-input v-model="form.lineCode" placeholder="请输入产线编号" />
|
||||
</el-form-item>
|
||||
<el-form-item label="产线名称" prop="lineName">
|
||||
<el-input v-model="form.lineName" placeholder="请输入产线名称" />
|
||||
</el-form-item>
|
||||
<el-form-item label="日产能" prop="capacity">
|
||||
<el-input v-model="form.capacity" placeholder="请输入日产能" />
|
||||
</el-form-item>
|
||||
<el-form-item label="产能单位" prop="unit">
|
||||
<el-input v-model="form.unit" placeholder="请输入产能单位" />
|
||||
</el-form-item>
|
||||
<el-form-item label="是否启用" prop="isEnabled">
|
||||
<el-switch
|
||||
v-model="form.isEnabled"
|
||||
:active-value="1"
|
||||
:inactive-value="0"
|
||||
active-text="启用"
|
||||
inactive-text="禁用"
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item label="备注" prop="remark">
|
||||
<el-input v-model="form.remark" placeholder="请输入备注" />
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<div slot="footer" class="dialog-footer">
|
||||
<el-button :loading="buttonLoading" type="primary" @click="submitForm">确 定</el-button>
|
||||
<el-button @click="cancel">取 消</el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</div>
|
||||
</el-tab-pane>
|
||||
<el-tab-pane label="甘特图" name="gantt">
|
||||
<div v-show="activeTab === 'gantt'">
|
||||
<div style="margin-bottom: 16px; display: flex; gap: 16px; align-items: center;">
|
||||
<el-select v-model="selectedLineId" placeholder="选择产线" style="width: 180px" @change="fetchGanttData">
|
||||
<el-option v-for="item in lineList" :key="item.lineId" :label="item.lineName" :value="item.lineId" />
|
||||
</el-select>
|
||||
</div>
|
||||
<GanttChartEcharts :tasks="ganttTasks" v-if="ganttTasks.length > 0" />
|
||||
<el-empty v-else description="暂无甘特图数据" />
|
||||
</div>
|
||||
</el-tab-pane>
|
||||
</el-tabs>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import GanttChartEcharts from './GanttChartEcharts.vue';
|
||||
import { listProductionLine, getProductionLine, delProductionLine, addProductionLine, updateProductionLine, ganttProductionLine } from "@/api/wms/productionLine";
|
||||
import { listOrder } from '@/api/wms/order';
|
||||
|
||||
export default {
|
||||
name: "ProductionLine",
|
||||
components: { GanttChartEcharts },
|
||||
data() {
|
||||
return {
|
||||
// 按钮loading
|
||||
buttonLoading: false,
|
||||
// 遮罩层
|
||||
loading: true,
|
||||
// 选中数组
|
||||
ids: [],
|
||||
// 非单个禁用
|
||||
single: true,
|
||||
// 非多个禁用
|
||||
multiple: true,
|
||||
// 显示搜索条件
|
||||
showSearch: true,
|
||||
// 总条数
|
||||
total: 0,
|
||||
// 产线表格数据
|
||||
productionLineList: [],
|
||||
// 弹出层标题
|
||||
title: "",
|
||||
// 是否显示弹出层
|
||||
open: false,
|
||||
// 查询参数
|
||||
queryParams: {
|
||||
pageNum: 1,
|
||||
pageSize: 20,
|
||||
lineCode: undefined,
|
||||
lineName: undefined,
|
||||
capacity: undefined,
|
||||
unit: undefined,
|
||||
isEnabled: undefined,
|
||||
},
|
||||
// 表单参数
|
||||
form: {},
|
||||
// 表单校验
|
||||
rules: {
|
||||
lineCode: [
|
||||
{ required: true, message: "产线编号不能为空", trigger: "blur" }
|
||||
],
|
||||
lineName: [
|
||||
{ required: true, message: "产线名称不能为空", trigger: "blur" }
|
||||
],
|
||||
capacity: [
|
||||
{ required: true, message: "日产能不能为空", trigger: "blur" }
|
||||
],
|
||||
unit: [
|
||||
{ required: true, message: "产能单位不能为空", trigger: "blur" }
|
||||
],
|
||||
isEnabled: [
|
||||
{ required: true, message: "是否启用不能为空", trigger: "blur" }
|
||||
],
|
||||
},
|
||||
activeTab: 'list',
|
||||
lineList: [],
|
||||
orderList: [],
|
||||
selectedLineId: null,
|
||||
selectedOrderId: null,
|
||||
ganttTasks: [],
|
||||
ganttOrders: [],
|
||||
ganttOrder: {},
|
||||
ganttOrderDetails: []
|
||||
};
|
||||
},
|
||||
created() {
|
||||
this.getList();
|
||||
this.loadLines();
|
||||
this.loadOrders();
|
||||
},
|
||||
methods: {
|
||||
/** 查询产线列表 */
|
||||
getList() {
|
||||
this.loading = true;
|
||||
listProductionLine(this.queryParams).then(response => {
|
||||
this.productionLineList = response.rows;
|
||||
this.total = response.total;
|
||||
this.loading = false;
|
||||
});
|
||||
},
|
||||
// 取消按钮
|
||||
cancel() {
|
||||
this.open = false;
|
||||
this.reset();
|
||||
},
|
||||
// 表单重置
|
||||
reset() {
|
||||
this.form = {
|
||||
lineId: undefined,
|
||||
lineCode: undefined,
|
||||
lineName: undefined,
|
||||
capacity: undefined,
|
||||
unit: undefined,
|
||||
isEnabled: undefined,
|
||||
remark: undefined,
|
||||
createTime: undefined,
|
||||
createBy: undefined,
|
||||
updateTime: undefined,
|
||||
updateBy: undefined
|
||||
};
|
||||
this.resetForm("form");
|
||||
},
|
||||
/** 搜索按钮操作 */
|
||||
handleQuery() {
|
||||
this.queryParams.pageNum = 1;
|
||||
this.getList();
|
||||
},
|
||||
/** 重置按钮操作 */
|
||||
resetQuery() {
|
||||
this.resetForm("queryForm");
|
||||
this.handleQuery();
|
||||
},
|
||||
// 多选框选中数据
|
||||
handleSelectionChange(selection) {
|
||||
this.ids = selection.map(item => item.lineId)
|
||||
this.single = selection.length!==1
|
||||
this.multiple = !selection.length
|
||||
},
|
||||
/** 新增按钮操作 */
|
||||
handleAdd() {
|
||||
this.reset();
|
||||
this.open = true;
|
||||
this.title = "添加产线";
|
||||
},
|
||||
/** 修改按钮操作 */
|
||||
handleUpdate(row) {
|
||||
this.loading = true;
|
||||
this.reset();
|
||||
const lineId = row.lineId || this.ids
|
||||
getProductionLine(lineId).then(response => {
|
||||
this.loading = false;
|
||||
this.form = response.data;
|
||||
this.open = true;
|
||||
this.title = "修改产线";
|
||||
});
|
||||
},
|
||||
/** 提交按钮 */
|
||||
submitForm() {
|
||||
this.$refs["form"].validate(valid => {
|
||||
if (valid) {
|
||||
this.buttonLoading = true;
|
||||
if (this.form.lineId != null) {
|
||||
updateProductionLine(this.form).then(response => {
|
||||
this.$modal.msgSuccess("修改成功");
|
||||
this.open = false;
|
||||
this.getList();
|
||||
}).finally(() => {
|
||||
this.buttonLoading = false;
|
||||
});
|
||||
} else {
|
||||
addProductionLine(this.form).then(response => {
|
||||
this.$modal.msgSuccess("新增成功");
|
||||
this.open = false;
|
||||
this.getList();
|
||||
}).finally(() => {
|
||||
this.buttonLoading = false;
|
||||
});
|
||||
}
|
||||
}
|
||||
});
|
||||
},
|
||||
/** 删除按钮操作 */
|
||||
handleDelete(row) {
|
||||
const lineIds = row.lineId || this.ids;
|
||||
this.$modal.confirm('是否确认删除产线编号为"' + lineIds + '"的数据项？').then(() => {
|
||||
this.loading = true;
|
||||
return delProductionLine(lineIds);
|
||||
}).then(() => {
|
||||
this.loading = false;
|
||||
this.getList();
|
||||
this.$modal.msgSuccess("删除成功");
|
||||
}).catch(() => {
|
||||
}).finally(() => {
|
||||
this.loading = false;
|
||||
});
|
||||
},
|
||||
/** 导出按钮操作 */
|
||||
handleExport() {
|
||||
this.download('wms/productionLine/export', {
|
||||
...this.queryParams
|
||||
}, `productionLine_${new Date().getTime()}.xlsx`)
|
||||
},
|
||||
handleEnabledChange(row) {
|
||||
// 只更新isEnabled字段
|
||||
const updateData = {
|
||||
lineId: row.lineId,
|
||||
isEnabled: row.isEnabled
|
||||
};
|
||||
this.loading = true;
|
||||
updateProductionLine(updateData)
|
||||
.then(() => {
|
||||
this.$modal.msgSuccess("状态更新成功");
|
||||
})
|
||||
.catch(() => {
|
||||
this.$modal.msgError("状态更新失败");
|
||||
// 回滚状态
|
||||
row.isEnabled = row.isEnabled === 1 ? 0 : 1;
|
||||
})
|
||||
.finally(() => {
|
||||
this.loading = false;
|
||||
});
|
||||
},
|
||||
loadLines() {
|
||||
listProductionLine({}).then(res => {
|
||||
this.lineList = res.rows || [];
|
||||
});
|
||||
},
|
||||
loadOrders() {
|
||||
listOrder({}).then(res => {
|
||||
this.orderList = res.rows || [];
|
||||
});
|
||||
},
|
||||
fetchGanttData() {
|
||||
if (!this.selectedLineId) {
|
||||
this.ganttTasks = [];
|
||||
this.ganttOrders = [];
|
||||
return;
|
||||
}
|
||||
ganttProductionLine({
|
||||
lineId: this.selectedLineId
|
||||
}).then(res => {
|
||||
this.ganttTasks = res.data.tasks || [];
|
||||
this.ganttOrders = res.data.orders || [];
|
||||
});
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.production-line-page {
|
||||
padding: 16px;
|
||||
}
|
||||
</style>
|
||||
@@ -1,457 +0,0 @@
|
||||
<template>
|
||||
<div class="app-container">
|
||||
<el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="80px">
|
||||
<el-form-item label="规范名称" prop="specName">
|
||||
<el-input
|
||||
v-model="queryParams.specName"
|
||||
placeholder="请输入制造规范名称"
|
||||
clearable
|
||||
@keyup.enter.native="handleQuery"
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item label="工艺路线" prop="processRoute">
|
||||
<el-input
|
||||
v-model="queryParams.processRoute"
|
||||
placeholder="请输入工艺路线"
|
||||
clearable
|
||||
@keyup.enter.native="handleQuery"
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item label="状态" prop="status">
|
||||
<el-select v-model="queryParams.status" placeholder="请选择状态" clearable>
|
||||
<el-option
|
||||
v-for="dict in dict.type.work_mspec_status"
|
||||
:key="dict.value"
|
||||
:label="dict.label"
|
||||
:value="dict.value"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="规范类型" prop="specType">
|
||||
<el-select v-model="queryParams.specType" placeholder="请选择规范类型" clearable>
|
||||
<el-option
|
||||
v-for="dict in dict.type.work_mspec_type"
|
||||
:key="dict.value"
|
||||
:label="dict.label"
|
||||
:value="dict.value"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
|
||||
<el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
|
||||
<el-row :gutter="10" class="mb8">
|
||||
<el-col :span="1.5">
|
||||
<el-button
|
||||
type="primary"
|
||||
plain
|
||||
icon="el-icon-plus"
|
||||
size="mini"
|
||||
@click="handleAdd"
|
||||
>新增</el-button>
|
||||
</el-col>
|
||||
<el-col :span="1.5">
|
||||
<el-button
|
||||
type="success"
|
||||
plain
|
||||
icon="el-icon-edit"
|
||||
size="mini"
|
||||
:disabled="single"
|
||||
@click="handleUpdate"
|
||||
>修改</el-button>
|
||||
</el-col>
|
||||
<el-col :span="1.5">
|
||||
<el-button
|
||||
type="danger"
|
||||
plain
|
||||
icon="el-icon-delete"
|
||||
size="mini"
|
||||
:disabled="multiple"
|
||||
@click="handleDelete"
|
||||
>删除</el-button>
|
||||
</el-col>
|
||||
<el-col :span="1.5">
|
||||
<el-button
|
||||
type="warning"
|
||||
plain
|
||||
icon="el-icon-download"
|
||||
size="mini"
|
||||
@click="handleExport"
|
||||
>导出</el-button>
|
||||
</el-col>
|
||||
<right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
|
||||
</el-row>
|
||||
|
||||
<KLPTable v-loading="loading" :data="manufacturingSpecList" @selection-change="handleSelectionChange">
|
||||
<el-table-column type="selection" width="55" align="center" />
|
||||
<el-table-column label="主键" align="center" prop="specId" v-if="false"/>
|
||||
<el-table-column label="制造规范编码" align="center" prop="specCode" />
|
||||
<el-table-column label="制造规范名称" align="center" prop="specName" />
|
||||
<!-- 工艺路线列：溢出显示省略号 -->
|
||||
<el-table-column
|
||||
label="工艺路线"
|
||||
align="center"
|
||||
prop="processRoute"
|
||||
width="220"
|
||||
show-overflow-tooltip
|
||||
/>
|
||||
<el-table-column label="状态" align="center" prop="status">
|
||||
<template slot-scope="scope">
|
||||
<dict-tag :options="dict.type.work_mspec_status" :value="scope.row.status"/>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="规范类型" align="center" prop="specType">
|
||||
<template slot-scope="scope">
|
||||
<dict-tag :options="dict.type.work_mspec_type" :value="scope.row.specType"/>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="理论工时(h)" align="center" prop="standardHours" />
|
||||
<el-table-column label="备注" align="center" prop="remark" />
|
||||
<el-table-column label="操作" align="center" class-name="small-padding fixed-width">
|
||||
<template slot-scope="scope">
|
||||
<el-button
|
||||
size="mini"
|
||||
type="text"
|
||||
icon="el-icon-edit"
|
||||
@click="handleUpdate(scope.row)"
|
||||
>修改</el-button>
|
||||
<el-button
|
||||
size="mini"
|
||||
type="text"
|
||||
icon="el-icon-delete"
|
||||
@click="handleDelete(scope.row)"
|
||||
>删除</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</KLPTable>
|
||||
|
||||
<pagination
|
||||
v-show="total>0"
|
||||
:total="total"
|
||||
:page.sync="queryParams.pageNum"
|
||||
:limit.sync="queryParams.pageSize"
|
||||
@pagination="getList"
|
||||
/>
|
||||
|
||||
<!-- 添加或修改制造规范对话框 -->
|
||||
<el-dialog :title="title" :visible.sync="open" width="600px" append-to-body>
|
||||
<el-form ref="form" :model="form" :rules="rules" label-width="80px">
|
||||
<el-form-item label="规范编码" prop="specCode">
|
||||
<el-input v-model="form.specCode" placeholder="请输入制造规范编码" />
|
||||
</el-form-item>
|
||||
<el-form-item label="规范名称" prop="specName">
|
||||
<el-input v-model="form.specName" placeholder="请输入制造规范名称" />
|
||||
</el-form-item>
|
||||
|
||||
<!-- 工艺路线：动态输入框组 -->
|
||||
<el-form-item label="工艺路线" prop="processSteps">
|
||||
<div v-for="(step, index) in form.processSteps" :key="index" class="process-step-item">
|
||||
<el-input
|
||||
v-model="form.processSteps[index]"
|
||||
placeholder="请输入工艺步骤"
|
||||
class="step-input"
|
||||
/>
|
||||
<el-button
|
||||
type="text"
|
||||
icon="el-icon-delete"
|
||||
size="mini"
|
||||
class="delete-btn"
|
||||
@click="removeStep(index)"
|
||||
:disabled="form.processSteps.length <= 1"
|
||||
/>
|
||||
</div>
|
||||
<el-button
|
||||
type="primary"
|
||||
icon="el-icon-plus"
|
||||
size="mini"
|
||||
@click="addStep"
|
||||
class="add-step-btn"
|
||||
>
|
||||
添加工艺步骤
|
||||
</el-button>
|
||||
<div class="form-hint">提示：点击"+"添加步骤，点击"×"删除步骤</div>
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="状态" prop="status">
|
||||
<el-radio-group v-model="form.status">
|
||||
<el-radio
|
||||
v-for="dict in dict.type.work_mspec_status"
|
||||
:key="dict.value"
|
||||
:label="parseInt(dict.value)"
|
||||
>{{dict.label}}</el-radio>
|
||||
</el-radio-group>
|
||||
</el-form-item>
|
||||
<el-form-item label="规范类型" prop="specType">
|
||||
<el-select v-model="form.specType" placeholder="请选择规范类型">
|
||||
<el-option
|
||||
v-for="dict in dict.type.work_mspec_type"
|
||||
:key="dict.value"
|
||||
:label="dict.label"
|
||||
:value="parseInt(dict.value)"
|
||||
></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="理论工时(h)" prop="standardHours">
|
||||
<el-input v-model="form.standardHours" placeholder="请输入理论工时(h)" />
|
||||
</el-form-item>
|
||||
<el-form-item label="备注" prop="remark">
|
||||
<el-input v-model="form.remark" type="textarea" placeholder="请输入内容" />
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<div slot="footer" class="dialog-footer">
|
||||
<el-button :loading="buttonLoading" type="primary" @click="submitForm">确 定</el-button>
|
||||
<el-button @click="cancel">取 消</el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { listManufacturingSpec, getManufacturingSpec, delManufacturingSpec, addManufacturingSpec, updateManufacturingSpec } from "@/api/work/manufacturingSpec";
|
||||
|
||||
export default {
|
||||
name: "ManufacturingSpec",
|
||||
dicts: ['work_mspec_status', 'work_mspec_type'],
|
||||
data() {
|
||||
return {
|
||||
// 按钮loading
|
||||
buttonLoading: false,
|
||||
// 遮罩层
|
||||
loading: true,
|
||||
// 选中数组
|
||||
ids: [],
|
||||
// 非单个禁用
|
||||
single: true,
|
||||
// 非多个禁用
|
||||
multiple: true,
|
||||
// 显示搜索条件
|
||||
showSearch: true,
|
||||
// 总条数
|
||||
total: 0,
|
||||
// 制造规范表格数据
|
||||
manufacturingSpecList: [],
|
||||
// 弹出层标题
|
||||
title: "",
|
||||
// 是否显示弹出层
|
||||
open: false,
|
||||
// 查询参数
|
||||
queryParams: {
|
||||
pageNum: 1,
|
||||
pageSize: 10,
|
||||
specCode: undefined,
|
||||
specName: undefined,
|
||||
processRoute: undefined,
|
||||
status: undefined,
|
||||
specType: undefined,
|
||||
standardHours: undefined,
|
||||
},
|
||||
// 表单参数
|
||||
form: {
|
||||
processSteps: [] // 用于存储多个工艺步骤的数组
|
||||
},
|
||||
// 表单校验
|
||||
rules: {
|
||||
}
|
||||
};
|
||||
},
|
||||
created() {
|
||||
this.getList();
|
||||
},
|
||||
methods: {
|
||||
/** 查询制造规范列表 */
|
||||
getList() {
|
||||
this.loading = true;
|
||||
listManufacturingSpec(this.queryParams).then(response => {
|
||||
this.manufacturingSpecList = response.rows;
|
||||
this.total = response.total;
|
||||
this.loading = false;
|
||||
});
|
||||
},
|
||||
// 取消按钮
|
||||
cancel() {
|
||||
this.open = false;
|
||||
this.reset();
|
||||
},
|
||||
// 表单重置
|
||||
reset() {
|
||||
this.form = {
|
||||
specId: undefined,
|
||||
specCode: undefined,
|
||||
specName: undefined,
|
||||
businessUnit: undefined,
|
||||
projectTeam: undefined,
|
||||
productModule: undefined,
|
||||
identifier: undefined,
|
||||
material: undefined,
|
||||
specification: undefined,
|
||||
processRoute: undefined,
|
||||
processSteps: [''], // 初始化至少一个输入框
|
||||
processParams: undefined,
|
||||
scope: undefined,
|
||||
inspectionStandard: undefined,
|
||||
status: 1,
|
||||
specType: 1,
|
||||
version: undefined,
|
||||
versionDate: undefined,
|
||||
standardHours: undefined,
|
||||
createBy: undefined,
|
||||
createTime: undefined,
|
||||
updateBy: undefined,
|
||||
updateTime: undefined,
|
||||
delFlag: undefined,
|
||||
remark: undefined
|
||||
};
|
||||
this.resetForm("form");
|
||||
},
|
||||
/** 搜索按钮操作 */
|
||||
handleQuery() {
|
||||
this.queryParams.pageNum = 1;
|
||||
this.getList();
|
||||
},
|
||||
/** 重置按钮操作 */
|
||||
resetQuery() {
|
||||
this.resetForm("queryForm");
|
||||
this.handleQuery();
|
||||
},
|
||||
// 多选框选中数据
|
||||
handleSelectionChange(selection) {
|
||||
this.ids = selection.map(item => item.specId)
|
||||
this.single = selection.length!==1
|
||||
this.multiple = !selection.length
|
||||
},
|
||||
/** 新增按钮操作 */
|
||||
handleAdd() {
|
||||
this.reset();
|
||||
this.open = true;
|
||||
this.title = "添加制造规范";
|
||||
},
|
||||
/** 修改按钮操作 */
|
||||
handleUpdate(row) {
|
||||
this.loading = true;
|
||||
this.reset();
|
||||
const specId = row.specId || this.ids
|
||||
getManufacturingSpec(specId).then(response => {
|
||||
this.loading = false;
|
||||
const data = response.data;
|
||||
|
||||
// 将工艺路线字符串拆分为步骤数组
|
||||
if (data.processRoute) {
|
||||
data.processSteps = data.processRoute
|
||||
.split('-')
|
||||
.filter(line => line); // 过滤空行
|
||||
} else {
|
||||
data.processSteps = [''];
|
||||
}
|
||||
|
||||
this.form = data;
|
||||
this.open = true;
|
||||
this.title = "修改制造规范";
|
||||
});
|
||||
},
|
||||
/** 添加工艺步骤输入框 */
|
||||
addStep() {
|
||||
this.form.processSteps.push('');
|
||||
},
|
||||
/** 移除工艺步骤输入框 */
|
||||
removeStep(index) {
|
||||
if (this.form.processSteps.length <= 1) {
|
||||
this.$message.warning('至少保留一个工艺步骤');
|
||||
return;
|
||||
}
|
||||
this.form.processSteps.splice(index, 1);
|
||||
},
|
||||
/** 提交按钮 */
|
||||
submitForm() {
|
||||
this.$refs["form"].validate(valid => {
|
||||
if (valid) {
|
||||
this.buttonLoading = true;
|
||||
|
||||
// 验证至少有一个非空步骤
|
||||
const hasValidStep = this.form.processSteps.some(step => step.trim() !== '');
|
||||
if (!hasValidStep) {
|
||||
this.$message.error('请至少输入一个工艺步骤');
|
||||
this.buttonLoading = false;
|
||||
return;
|
||||
}
|
||||
|
||||
// 处理工艺路线格式，将步骤数组合并为带-前缀的字符串
|
||||
this.form.processRoute = this.form.processSteps
|
||||
.map(step => step.trim())
|
||||
.filter(step => step) // 过滤空行
|
||||
.join('-');
|
||||
|
||||
if (this.form.specId != null) {
|
||||
updateManufacturingSpec(this.form).then(response => {
|
||||
this.$modal.msgSuccess("修改成功");
|
||||
this.open = false;
|
||||
this.getList();
|
||||
}).finally(() => {
|
||||
this.buttonLoading = false;
|
||||
});
|
||||
} else {
|
||||
addManufacturingSpec(this.form).then(response => {
|
||||
this.$modal.msgSuccess("新增成功");
|
||||
this.open = false;
|
||||
this.getList();
|
||||
}).finally(() => {
|
||||
this.buttonLoading = false;
|
||||
});
|
||||
}
|
||||
}
|
||||
});
|
||||
},
|
||||
/** 删除按钮操作 */
|
||||
handleDelete(row) {
|
||||
const specIds = row.specId || this.ids;
|
||||
this.$modal.confirm('是否确认删除制造规范编号为"' + specIds + '"的数据项？').then(() => {
|
||||
this.loading = true;
|
||||
return delManufacturingSpec(specIds);
|
||||
}).then(() => {
|
||||
this.loading = false;
|
||||
this.getList();
|
||||
this.$modal.msgSuccess("删除成功");
|
||||
}).catch(() => {
|
||||
}).finally(() => {
|
||||
this.loading = false;
|
||||
});
|
||||
},
|
||||
/** 导出按钮操作 */
|
||||
handleExport() {
|
||||
this.download('klp/manufacturingSpec/export', {
|
||||
...this.queryParams
|
||||
}, `manufacturingSpec_${new Date().getTime()}.xlsx`)
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.process-step-item {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
.step-input {
|
||||
flex: 1;
|
||||
margin-right: 10px;
|
||||
}
|
||||
|
||||
.delete-btn {
|
||||
color: #F56C6C;
|
||||
}
|
||||
|
||||
.add-step-btn {
|
||||
margin-top: 10px;
|
||||
}
|
||||
|
||||
.form-hint {
|
||||
margin-top: 5px;
|
||||
color: #606266;
|
||||
font-size: 12px;
|
||||
line-height: 1.5;
|
||||
}
|
||||
</style>
|
||||
@@ -1,294 +0,0 @@
|
||||
<template>
|
||||
<div class="app-container">
|
||||
<el-row :gutter="10" class="mb8" v-if="!readonly">
|
||||
<el-col :span="1.5">
|
||||
<el-button
|
||||
type="primary"
|
||||
plain
|
||||
icon="el-icon-plus"
|
||||
size="mini"
|
||||
@click="handleAdd"
|
||||
>新增</el-button>
|
||||
</el-col>
|
||||
<el-col :span="1.5">
|
||||
<el-button
|
||||
type="success"
|
||||
plain
|
||||
icon="el-icon-edit"
|
||||
size="mini"
|
||||
:disabled="single"
|
||||
@click="handleUpdate"
|
||||
>修改</el-button>
|
||||
</el-col>
|
||||
<el-col :span="1.5">
|
||||
<el-button
|
||||
type="danger"
|
||||
plain
|
||||
icon="el-icon-delete"
|
||||
size="mini"
|
||||
:disabled="multiple"
|
||||
@click="handleDelete"
|
||||
>删除</el-button>
|
||||
</el-col>
|
||||
<el-col :span="1.5">
|
||||
<el-button
|
||||
type="warning"
|
||||
plain
|
||||
icon="el-icon-download"
|
||||
size="mini"
|
||||
@click="handleExport"
|
||||
>导出</el-button>
|
||||
</el-col>
|
||||
<right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
|
||||
</el-row>
|
||||
|
||||
<KLPTable v-loading="loading" :data="productSpecList" @selection-change="handleSelectionChange">
|
||||
<el-table-column type="selection" width="55" align="center" />
|
||||
<el-table-column label="规范名称" align="center" prop="specKey">
|
||||
<template slot-scope="scope">
|
||||
<span>{{ scope.row.specKey }}</span>
|
||||
<span v-if="scope.row.remark">
|
||||
<el-tooltip :content="scope.row.remark" placement="top">
|
||||
<i class="el-icon-info"></i>
|
||||
</el-tooltip>
|
||||
</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="规范值" align="center" prop="specValue" />
|
||||
<!-- <el-table-column label="备注" align="center" prop="remark" /> -->
|
||||
<el-table-column label="操作" v-if="!readonly" align="center" class-name="small-padding fixed-width">
|
||||
<template slot-scope="scope">
|
||||
<el-button
|
||||
size="mini"
|
||||
type="text"
|
||||
icon="el-icon-edit"
|
||||
@click="handleUpdate(scope.row)"
|
||||
>修改</el-button>
|
||||
<el-button
|
||||
size="mini"
|
||||
type="text"
|
||||
icon="el-icon-delete"
|
||||
@click="handleDelete(scope.row)"
|
||||
>删除</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</KLPTable>
|
||||
|
||||
<pagination
|
||||
v-show="total>0"
|
||||
:total="total"
|
||||
:page.sync="queryParams.pageNum"
|
||||
:limit.sync="queryParams.pageSize"
|
||||
@pagination="getList"
|
||||
/>
|
||||
|
||||
<!-- 添加或修改产品规范（键值对模式）对话框 -->
|
||||
<el-dialog :title="title" :visible.sync="open" width="500px" append-to-body>
|
||||
<el-form ref="form" :model="form" :rules="rules" label-width="80px">
|
||||
<!-- <el-form-item label="所属产品规范组ID" prop="groupId">
|
||||
<el-input v-model="form.groupId" placeholder="请输入所属产品规范组ID" />
|
||||
</el-form-item> -->
|
||||
<el-form-item label="规范键" prop="specKey">
|
||||
<el-input v-model="form.specKey" placeholder="请输入规范键" />
|
||||
</el-form-item>
|
||||
<el-form-item label="规范值" prop="specValue">
|
||||
<el-input v-model="form.specValue" type="textarea" placeholder="请输入内容" />
|
||||
</el-form-item>
|
||||
<el-form-item label="备注" prop="remark">
|
||||
<el-input v-model="form.remark" type="textarea" placeholder="请输入内容" />
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<div slot="footer" class="dialog-footer">
|
||||
<el-button :loading="buttonLoading" type="primary" @click="submitForm">确 定</el-button>
|
||||
<el-button @click="cancel">取 消</el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { listProductSpec, getProductSpec, delProductSpec, addProductSpec, updateProductSpec } from "@/api/work/productSpec";
|
||||
|
||||
export default {
|
||||
name: "ProductSpec",
|
||||
props: {
|
||||
groupId: {
|
||||
type: String,
|
||||
default: ""
|
||||
},
|
||||
readonly: {
|
||||
type: Boolean,
|
||||
default: false
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
// 按钮loading
|
||||
buttonLoading: false,
|
||||
// 遮罩层
|
||||
loading: true,
|
||||
// 选中数组
|
||||
ids: [],
|
||||
// 非单个禁用
|
||||
single: true,
|
||||
// 非多个禁用
|
||||
multiple: true,
|
||||
// 显示搜索条件
|
||||
showSearch: true,
|
||||
// 总条数
|
||||
total: 0,
|
||||
// 产品规范（键值对模式）表格数据
|
||||
productSpecList: [],
|
||||
// 弹出层标题
|
||||
title: "",
|
||||
// 是否显示弹出层
|
||||
open: false,
|
||||
// 查询参数
|
||||
queryParams: {
|
||||
pageNum: 1,
|
||||
pageSize: 10,
|
||||
groupId: undefined,
|
||||
specKey: undefined,
|
||||
specValue: undefined,
|
||||
},
|
||||
// 表单参数
|
||||
form: {},
|
||||
// 表单校验
|
||||
rules: {
|
||||
groupId: [
|
||||
{ required: true, message: "所属产品规范组ID不能为空", trigger: "blur" }
|
||||
],
|
||||
specKey: [
|
||||
{ required: true, message: "规范键不能为空", trigger: "blur" }
|
||||
],
|
||||
specValue: [
|
||||
{ required: true, message: "规范值不能为空", trigger: "blur" }
|
||||
],
|
||||
}
|
||||
};
|
||||
},
|
||||
watch: {
|
||||
groupId: {
|
||||
handler(newVal) {
|
||||
// if (newVal) {
|
||||
this.queryParams.groupId = newVal;
|
||||
this.getList();
|
||||
// }
|
||||
},
|
||||
immediate: true
|
||||
},
|
||||
},
|
||||
methods: {
|
||||
/** 查询产品规范（键值对模式）列表 */
|
||||
getList() {
|
||||
this.loading = true;
|
||||
listProductSpec(this.queryParams).then(response => {
|
||||
this.productSpecList = response.rows;
|
||||
this.total = response.total;
|
||||
this.loading = false;
|
||||
});
|
||||
},
|
||||
// 取消按钮
|
||||
cancel() {
|
||||
this.open = false;
|
||||
this.reset();
|
||||
},
|
||||
// 表单重置
|
||||
reset() {
|
||||
this.form = {
|
||||
specId: undefined,
|
||||
groupId: this.groupId,
|
||||
specKey: undefined,
|
||||
specValue: undefined,
|
||||
remark: undefined,
|
||||
createBy: undefined,
|
||||
createTime: undefined,
|
||||
updateBy: undefined,
|
||||
updateTime: undefined,
|
||||
delFlag: undefined
|
||||
};
|
||||
this.resetForm("form");
|
||||
},
|
||||
/** 搜索按钮操作 */
|
||||
handleQuery() {
|
||||
this.queryParams.pageNum = 1;
|
||||
this.getList();
|
||||
},
|
||||
/** 重置按钮操作 */
|
||||
resetQuery() {
|
||||
this.resetForm("queryForm");
|
||||
this.handleQuery();
|
||||
},
|
||||
// 多选框选中数据
|
||||
handleSelectionChange(selection) {
|
||||
this.ids = selection.map(item => item.specId)
|
||||
this.single = selection.length!==1
|
||||
this.multiple = !selection.length
|
||||
},
|
||||
/** 新增按钮操作 */
|
||||
handleAdd() {
|
||||
this.reset();
|
||||
this.open = true;
|
||||
this.title = "添加产品规范（键值对模式）";
|
||||
},
|
||||
/** 修改按钮操作 */
|
||||
handleUpdate(row) {
|
||||
this.loading = true;
|
||||
this.reset();
|
||||
const specId = row.specId || this.ids
|
||||
getProductSpec(specId).then(response => {
|
||||
this.loading = false;
|
||||
this.form = response.data;
|
||||
this.open = true;
|
||||
this.title = "修改产品规范（键值对模式）";
|
||||
});
|
||||
},
|
||||
/** 提交按钮 */
|
||||
submitForm() {
|
||||
this.$refs["form"].validate(valid => {
|
||||
if (valid) {
|
||||
this.buttonLoading = true;
|
||||
if (this.form.specId != null) {
|
||||
updateProductSpec(this.form).then(response => {
|
||||
this.$modal.msgSuccess("修改成功");
|
||||
this.open = false;
|
||||
this.getList();
|
||||
}).finally(() => {
|
||||
this.buttonLoading = false;
|
||||
});
|
||||
} else {
|
||||
addProductSpec(this.form).then(response => {
|
||||
this.$modal.msgSuccess("新增成功");
|
||||
this.open = false;
|
||||
this.getList();
|
||||
}).finally(() => {
|
||||
this.buttonLoading = false;
|
||||
});
|
||||
}
|
||||
}
|
||||
});
|
||||
},
|
||||
/** 删除按钮操作 */
|
||||
handleDelete(row) {
|
||||
const specIds = row.specId || this.ids;
|
||||
this.$modal.confirm('是否确认删除产品规范（键值对模式）编号为"' + specIds + '"的数据项？').then(() => {
|
||||
this.loading = true;
|
||||
return delProductSpec(specIds);
|
||||
}).then(() => {
|
||||
this.loading = false;
|
||||
this.getList();
|
||||
this.$modal.msgSuccess("删除成功");
|
||||
}).catch(() => {
|
||||
}).finally(() => {
|
||||
this.loading = false;
|
||||
});
|
||||
},
|
||||
/** 导出按钮操作 */
|
||||
handleExport() {
|
||||
this.download('klp/productSpec/export', {
|
||||
...this.queryParams
|
||||
}, `productSpec_${new Date().getTime()}.xlsx`)
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
@@ -1,319 +0,0 @@
|
||||
<template>
|
||||
<div class="app-container">
|
||||
<el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="80px">
|
||||
<el-form-item label="规范组编码" prop="groupCode">
|
||||
<el-input
|
||||
v-model="queryParams.groupCode"
|
||||
placeholder="请输入产品规范组编码"
|
||||
clearable
|
||||
@keyup.enter.native="handleQuery"
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item label="绑定产品" prop="productId">
|
||||
<ProductSelect v-model="queryParams.productId" />
|
||||
</el-form-item>
|
||||
<el-form-item label="规范组名称" prop="groupName">
|
||||
<el-input
|
||||
v-model="queryParams.groupName"
|
||||
placeholder="请输入产品规范组名称"
|
||||
clearable
|
||||
@keyup.enter.native="handleQuery"
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
|
||||
<el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
|
||||
<el-row :gutter="10" class="mb8">
|
||||
<el-col :span="1.5">
|
||||
<el-button
|
||||
type="primary"
|
||||
plain
|
||||
icon="el-icon-plus"
|
||||
size="mini"
|
||||
@click="handleAdd"
|
||||
>新增</el-button>
|
||||
</el-col>
|
||||
<el-col :span="1.5">
|
||||
<el-button
|
||||
type="success"
|
||||
plain
|
||||
icon="el-icon-edit"
|
||||
size="mini"
|
||||
:disabled="single"
|
||||
@click="handleUpdate"
|
||||
>修改</el-button>
|
||||
</el-col>
|
||||
<el-col :span="1.5">
|
||||
<el-button
|
||||
type="danger"
|
||||
plain
|
||||
icon="el-icon-delete"
|
||||
size="mini"
|
||||
:disabled="multiple"
|
||||
@click="handleDelete"
|
||||
>删除</el-button>
|
||||
</el-col>
|
||||
<el-col :span="1.5">
|
||||
<el-button
|
||||
type="warning"
|
||||
plain
|
||||
icon="el-icon-download"
|
||||
size="mini"
|
||||
@click="handleExport"
|
||||
>导出</el-button>
|
||||
</el-col>
|
||||
<right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
|
||||
</el-row>
|
||||
|
||||
<KLPTable v-loading="loading" :data="productSpecGroupList" @selection-change="handleSelectionChange">
|
||||
<el-table-column type="selection" width="55" align="center" />
|
||||
<el-table-column label="主键" align="center" prop="groupId" v-if="true"/>
|
||||
<el-table-column label="规范组编码" align="center" prop="groupCode" />
|
||||
<!-- <el-table-column label="绑定产品" align="center" prop="productId" /> -->
|
||||
<el-table-column label="绑定产品" align="center">
|
||||
<template slot-scope="scope">
|
||||
<ProductInfo :productId="scope.row.productId" />
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="产品规范组名称" align="center" prop="groupName" />
|
||||
<el-table-column label="状态" align="center" prop="status" />
|
||||
<el-table-column label="备注" align="center" prop="remark" />
|
||||
<el-table-column label="操作" align="center" class-name="small-padding fixed-width">
|
||||
<template slot-scope="scope">
|
||||
<el-button
|
||||
size="mini"
|
||||
type="text"
|
||||
icon="el-icon-edit"
|
||||
@click="handleUpdate(scope.row)"
|
||||
>修改</el-button>
|
||||
<el-button
|
||||
size="mini"
|
||||
type="text"
|
||||
icon="el-icon-delete"
|
||||
@click="handleDelete(scope.row)"
|
||||
>删除</el-button>
|
||||
<el-button
|
||||
size="mini"
|
||||
type="text"
|
||||
icon="el-icon-document"
|
||||
@click="showDetail(scope.row)"
|
||||
>明细</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</KLPTable>
|
||||
|
||||
<pagination
|
||||
v-show="total>0"
|
||||
:total="total"
|
||||
:page.sync="queryParams.pageNum"
|
||||
:limit.sync="queryParams.pageSize"
|
||||
@pagination="getList"
|
||||
/>
|
||||
|
||||
<!-- 添加或修改产品规范组对话框 -->
|
||||
<el-dialog :title="title" :visible.sync="open" width="500px" append-to-body>
|
||||
<el-form ref="form" :model="form" :rules="rules" label-width="80px">
|
||||
<el-form-item label="规范组编码" prop="groupCode">
|
||||
<el-input v-model="form.groupCode" placeholder="请输入产品规范组编码" />
|
||||
</el-form-item>
|
||||
<el-form-item label="绑定产品" prop="productId">
|
||||
<ProductSelect v-model="form.productId" />
|
||||
</el-form-item>
|
||||
<el-form-item label="规范组名称" prop="groupName">
|
||||
<el-input v-model="form.groupName" placeholder="请输入产品规范组名称" />
|
||||
</el-form-item>
|
||||
<el-form-item label="备注" prop="remark">
|
||||
<el-input v-model="form.remark" type="textarea" placeholder="请输入内容" />
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<div slot="footer" class="dialog-footer">
|
||||
<el-button :loading="buttonLoading" type="primary" @click="submitForm">确 定</el-button>
|
||||
<el-button @click="cancel">取 消</el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
|
||||
<el-dialog title="产品规范组明细" :visible.sync="detailDialogVisible" width="1200px" append-to-body>
|
||||
<Detail :groupId="detailGroupId" />
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { listProductSpecGroup, getProductSpecGroup, delProductSpecGroup, addProductSpecGroup, updateProductSpecGroup } from "@/api/work/productSpecGroup";
|
||||
import Detail from "./components/detail.vue";
|
||||
import ProductSelect from "@/components/KLPService/ProductSelect";
|
||||
import ProductInfo from "@/components/KLPService/Renderer/ProductInfo";
|
||||
|
||||
export default {
|
||||
name: "ProductSpecGroup",
|
||||
components: {
|
||||
Detail,
|
||||
ProductSelect,
|
||||
ProductInfo
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
// 按钮loading
|
||||
buttonLoading: false,
|
||||
// 遮罩层
|
||||
loading: true,
|
||||
// 选中数组
|
||||
ids: [],
|
||||
// 非单个禁用
|
||||
single: true,
|
||||
// 非多个禁用
|
||||
multiple: true,
|
||||
// 显示搜索条件
|
||||
showSearch: true,
|
||||
// 总条数
|
||||
total: 0,
|
||||
// 产品规范组表格数据
|
||||
productSpecGroupList: [],
|
||||
// 产品规范组明细
|
||||
detailGroupId: "",
|
||||
detailDialogVisible: false,
|
||||
// 弹出层标题
|
||||
title: "",
|
||||
// 是否显示弹出层
|
||||
open: false,
|
||||
// 查询参数
|
||||
queryParams: {
|
||||
pageNum: 1,
|
||||
pageSize: 10,
|
||||
groupCode: undefined,
|
||||
productId: undefined,
|
||||
groupName: undefined,
|
||||
status: undefined,
|
||||
},
|
||||
// 表单参数
|
||||
form: {},
|
||||
// 表单校验
|
||||
rules: {
|
||||
}
|
||||
};
|
||||
},
|
||||
created() {
|
||||
this.getList();
|
||||
},
|
||||
methods: {
|
||||
/** 查询产品规范组列表 */
|
||||
getList() {
|
||||
this.loading = true;
|
||||
listProductSpecGroup(this.queryParams).then(response => {
|
||||
this.productSpecGroupList = response.rows;
|
||||
this.total = response.total;
|
||||
this.loading = false;
|
||||
});
|
||||
},
|
||||
// 取消按钮
|
||||
cancel() {
|
||||
this.open = false;
|
||||
this.reset();
|
||||
},
|
||||
// 表单重置
|
||||
reset() {
|
||||
this.form = {
|
||||
groupId: undefined,
|
||||
groupCode: undefined,
|
||||
productId: undefined,
|
||||
groupName: undefined,
|
||||
status: undefined,
|
||||
remark: undefined,
|
||||
createBy: undefined,
|
||||
createTime: undefined,
|
||||
updateBy: undefined,
|
||||
updateTime: undefined,
|
||||
delFlag: undefined
|
||||
};
|
||||
this.resetForm("form");
|
||||
},
|
||||
/** 搜索按钮操作 */
|
||||
handleQuery() {
|
||||
this.queryParams.pageNum = 1;
|
||||
this.getList();
|
||||
},
|
||||
/** 重置按钮操作 */
|
||||
resetQuery() {
|
||||
this.resetForm("queryForm");
|
||||
this.handleQuery();
|
||||
},
|
||||
// 多选框选中数据
|
||||
handleSelectionChange(selection) {
|
||||
this.ids = selection.map(item => item.groupId)
|
||||
this.single = selection.length!==1
|
||||
this.multiple = !selection.length
|
||||
},
|
||||
/** 新增按钮操作 */
|
||||
handleAdd() {
|
||||
this.reset();
|
||||
this.open = true;
|
||||
this.title = "添加产品规范组";
|
||||
},
|
||||
/** 修改按钮操作 */
|
||||
handleUpdate(row) {
|
||||
this.loading = true;
|
||||
this.reset();
|
||||
const groupId = row.groupId || this.ids
|
||||
getProductSpecGroup(groupId).then(response => {
|
||||
this.loading = false;
|
||||
this.form = response.data;
|
||||
this.open = true;
|
||||
this.title = "修改产品规范组";
|
||||
});
|
||||
},
|
||||
/** 提交按钮 */
|
||||
submitForm() {
|
||||
this.$refs["form"].validate(valid => {
|
||||
if (valid) {
|
||||
this.buttonLoading = true;
|
||||
if (this.form.groupId != null) {
|
||||
updateProductSpecGroup(this.form).then(response => {
|
||||
this.$modal.msgSuccess("修改成功");
|
||||
this.open = false;
|
||||
this.getList();
|
||||
}).finally(() => {
|
||||
this.buttonLoading = false;
|
||||
});
|
||||
} else {
|
||||
addProductSpecGroup(this.form).then(response => {
|
||||
this.$modal.msgSuccess("新增成功");
|
||||
this.open = false;
|
||||
this.getList();
|
||||
}).finally(() => {
|
||||
this.buttonLoading = false;
|
||||
});
|
||||
}
|
||||
}
|
||||
});
|
||||
},
|
||||
/** 删除按钮操作 */
|
||||
handleDelete(row) {
|
||||
const groupIds = row.groupId || this.ids;
|
||||
this.$modal.confirm('是否确认删除产品规范组编号为"' + groupIds + '"的数据项？').then(() => {
|
||||
this.loading = true;
|
||||
return delProductSpecGroup(groupIds);
|
||||
}).then(() => {
|
||||
this.loading = false;
|
||||
this.getList();
|
||||
this.$modal.msgSuccess("删除成功");
|
||||
}).catch(() => {
|
||||
}).finally(() => {
|
||||
this.loading = false;
|
||||
});
|
||||
},
|
||||
/** 导出按钮操作 */
|
||||
handleExport() {
|
||||
this.download('klp/productSpecGroup/export', {
|
||||
...this.queryParams
|
||||
}, `productSpecGroup_${new Date().getTime()}.xlsx`)
|
||||
},
|
||||
showDetail(row) {
|
||||
this.detailGroupId = row.groupId;
|
||||
this.detailDialogVisible = true;
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
@@ -1,157 +0,0 @@
|
||||
<template>
|
||||
<el-row style="margin: 20px;">
|
||||
<el-col :span="12">
|
||||
<div style="max-height:60vh;overflow:auto;padding-right:8px;">
|
||||
<el-form :model="detailForm" :rules="detailRules" ref="detailForm" label-width="80px" style="overflow:visible;">
|
||||
<el-form-item label="产线" prop="lineId">
|
||||
<el-select clearable v-model="detailForm.lineId" placeholder="请选择产线" filterable @change="onLineChange">
|
||||
<el-option v-for="item in productionLineList" :key="item.lineId" :label="item.lineName"
|
||||
:value="item.lineId" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="生产任务" :prop="binding.key">
|
||||
<!-- <el-select v-model="detailForm.productId" placeholder="请选择产品" filterable>
|
||||
<el-option v-for="item in productList" :key="item.productId" :label="item.productName"
|
||||
:value="item.productId" />
|
||||
</el-select> -->
|
||||
<el-select clearable v-model="detailForm.taskId" placeholder="请选择生产任务" filterable @change="onTaskChange">
|
||||
<el-option v-for="item in taskList" :key="item.taskId" :label="item.planName" :value="item.taskId" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="排产数量" prop="quantity">
|
||||
<el-input-number :controls=false controls-position="right" v-model="detailForm.quantity" :min="0.01" :step="0.01" style="width:100%" />
|
||||
</el-form-item>
|
||||
<el-form-item label="计划日期" prop="dateRange">
|
||||
<el-date-picker v-model="detailForm.dateRange" type="daterange" range-separator="至" start-placeholder="开始日期"
|
||||
end-placeholder="结束日期" style="width:100%" @change="onDateRangeChange" />
|
||||
</el-form-item>
|
||||
<el-form-item label="备注" prop="remark">
|
||||
<el-input v-model="detailForm.remark" placeholder="请输入备注" />
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</div>
|
||||
<el-button type="primary" @click="submitDetailForm">提交排产</el-button>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<div style="margin: 12px 0; max-width:100%; min-width:600px; height:220px; overflow-x:auto; overflow-y:hidden;">
|
||||
<GanttChartEcharts v-if="lineGanttTasks.length > 0 || previewTask"
|
||||
:tasks="previewTask ? [...lineGanttTasks, previewTask] : lineGanttTasks"
|
||||
style="height:220px; min-width:600px;" />
|
||||
<el-empty v-else description="请选择产线以查看排产情况" />
|
||||
</div>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { listProductionLine } from '@/api/wms/productionLine';
|
||||
import { ganttProductionLine } from '@/api/wms/productionLine';
|
||||
import { addSchedulePlanDetail, updateSchedulePlanDetail } from '@/api/wms/schedulePlanDetail';
|
||||
import { listProductionTask } from '@/api/work/productionTask';
|
||||
|
||||
import GanttChartEcharts from '../line/GanttChartEcharts.vue';
|
||||
|
||||
const binding = {
|
||||
key: 'taskId',
|
||||
label: 'planName',
|
||||
api: listProductionTask,
|
||||
text: '生产任务'
|
||||
}
|
||||
|
||||
export default {
|
||||
components: {
|
||||
GanttChartEcharts
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
binding,
|
||||
detailForm: {
|
||||
detailId: undefined,
|
||||
lineId: undefined,
|
||||
[binding.key]: undefined,
|
||||
quantity: 0,
|
||||
dateRange: [],
|
||||
startDate: '',
|
||||
endDate: '',
|
||||
remark: ''
|
||||
},
|
||||
detailRules: {
|
||||
[binding.key]: [{ required: true, message: '请选择' + binding.text, trigger: 'change' }],
|
||||
lineId: [{ required: true, message: '请选择产线', trigger: 'change' }],
|
||||
quantity: [{ required: true, message: '请输入排产数量', trigger: 'blur' }],
|
||||
dateRange: [{ required: true, type: 'array', len: 2, message: '请选择计划日期区间', trigger: 'change' }]
|
||||
},
|
||||
lineGanttTasks: [],
|
||||
productionLineList: [],
|
||||
previewTask: {},
|
||||
taskList: [],
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.fetchTaskList();
|
||||
this.fetchProductionLineList();
|
||||
},
|
||||
methods: {
|
||||
fetchProductionLineList() {
|
||||
listProductionLine({ pageNum: 1, pageSize: 1000 }).then(res => {
|
||||
this.productionLineList = res.rows || [];
|
||||
});
|
||||
},
|
||||
onTaskChange(taskId) {
|
||||
const task = this.taskList.find(item => item.taskId === taskId);
|
||||
if (task) {
|
||||
this.previewTask = {
|
||||
...this.previewTask,
|
||||
taskName: task.taskName,
|
||||
planName: task.planName,
|
||||
};
|
||||
}
|
||||
},
|
||||
onDateRangeChange(dateRange) {
|
||||
if (dateRange && dateRange.length === 2) {
|
||||
const startDate = this.parseTime(dateRange[0], '{y}-{m}-{d} {h}:{i}:{s}');
|
||||
const endDate = this.parseTime(dateRange[1], '{y}-{m}-{d} {h}:{i}:{s}');
|
||||
console.log(startDate, endDate);
|
||||
this.previewTask.startDate = startDate;
|
||||
this.previewTask.endDate = endDate;
|
||||
}
|
||||
},
|
||||
onLineChange(lineId) {
|
||||
if (!lineId) {
|
||||
this.lineGanttTasks = [];
|
||||
return;
|
||||
}
|
||||
ganttProductionLine({ lineId }).then(res => {
|
||||
this.lineGanttTasks = res.data.tasks || [];
|
||||
this.updatePreviewTask();
|
||||
});
|
||||
},
|
||||
fetchTaskList() {
|
||||
listProductionTask({ pageNum: 1, pageSize: 1000 }).then(res => {
|
||||
this.taskList = res.rows || [];
|
||||
});
|
||||
},
|
||||
submitDetailForm() {
|
||||
this.$refs.detailForm.validate(valid => {
|
||||
if (!valid) return;
|
||||
if (this.detailForm.dateRange && this.detailForm.dateRange.length === 2) {
|
||||
// const startDate = this.parseTime(this.detailForm.dateRange[0], '{y}-{m}-{d}T{h}:{i}:{s}') + '.000Z';
|
||||
// const endDate = this.parseTime(this.detailForm.dateRange[1], '{y}-{m}-{d}T{h}:{i}:{s}') + '.000Z';
|
||||
this.detailForm.startDate = this.detailForm.dateRange[0];
|
||||
this.detailForm.endDate = this.detailForm.dateRange[1];
|
||||
} else {
|
||||
this.detailForm.startDate = '';
|
||||
this.detailForm.endDate = '';
|
||||
}
|
||||
const api = this.detailForm.detailId ? updateSchedulePlanDetail : addSchedulePlanDetail;
|
||||
const data = Object.assign({}, this.detailForm, { taskId: this.detailForm.taskId });
|
||||
api(data).then(() => {
|
||||
this.$message.success(this.detailForm.detailId ? '修改成功' : '新增成功');
|
||||
this.detailDialogVisible = false;
|
||||
this.fetchDetailList();
|
||||
});
|
||||
});
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
@@ -1,87 +0,0 @@
|
||||
<template>
|
||||
<el-select
|
||||
v-model="selectedValue"
|
||||
placeholder="请选择或搜索订单"
|
||||
clearable
|
||||
filterable
|
||||
remote
|
||||
:remote-method="handleRemoteSearch"
|
||||
:loading="loading"
|
||||
@change="handleSelectChange"
|
||||
style="width: 100%"
|
||||
>
|
||||
<!-- 下拉选项 -->
|
||||
<el-option
|
||||
v-for="item in orderList"
|
||||
:key="item.orderId"
|
||||
:label="item.orderCode"
|
||||
:value="item.orderId"
|
||||
/>
|
||||
|
||||
<!-- 无数据提示 -->
|
||||
<el-option
|
||||
v-if="orderList.length === 0 && !loading"
|
||||
value=""
|
||||
disabled
|
||||
>
|
||||
暂无匹配订单
|
||||
</el-option>
|
||||
</el-select>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { listOrder } from '@/api/wms/order'
|
||||
import { debounce } from 'lodash' // 引入防抖函数
|
||||
|
||||
export default {
|
||||
name: 'OrderSelect',
|
||||
data() {
|
||||
return {
|
||||
orderList: [],
|
||||
loading: false,
|
||||
queryParams: {
|
||||
orderCode: undefined,
|
||||
orderStatus: 1,
|
||||
pageNum: 1,
|
||||
pageSize: 20
|
||||
},
|
||||
selectedValue: undefined
|
||||
}
|
||||
},
|
||||
created() {
|
||||
// 初始化加载订单列表
|
||||
this.getList()
|
||||
|
||||
// 初始化防抖搜索方法（300ms延迟）
|
||||
this.debouncedSearch = debounce(this.getList, 300)
|
||||
},
|
||||
methods: {
|
||||
// 远程搜索方法
|
||||
handleRemoteSearch(query) {
|
||||
this.queryParams.orderCode = query
|
||||
this.queryParams.pageNum = 1 // 重置页码
|
||||
this.debouncedSearch() // 使用防抖搜索
|
||||
},
|
||||
|
||||
// 获取订单列表
|
||||
getList() {
|
||||
this.loading = true
|
||||
listOrder(this.queryParams).then(res => {
|
||||
this.orderList = res.rows || []
|
||||
this.loading = false
|
||||
}).catch(() => {
|
||||
this.loading = false
|
||||
this.orderList = []
|
||||
})
|
||||
},
|
||||
|
||||
// 选择变化时触发
|
||||
handleSelectChange(orderId) {
|
||||
// 找到选中的完整订单项
|
||||
const selectedItem = this.orderList.find(item => item.orderId === orderId)
|
||||
// 通过onchange事件返回完整订单项
|
||||
this.$emit('change', selectedItem)
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
@@ -1,405 +0,0 @@
|
||||
<template>
|
||||
<div class="app-container">
|
||||
<el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px">
|
||||
<el-form-item label="产品规范" prop="productSpecGroupId">
|
||||
<el-input
|
||||
v-model="queryParams.productSpecGroupId"
|
||||
placeholder="请输入产品规范组ID"
|
||||
clearable
|
||||
@keyup.enter.native="handleQuery"
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item label="制造规范" prop="manufacturingSpecId">
|
||||
<el-input
|
||||
v-model="queryParams.manufacturingSpecId"
|
||||
placeholder="请输入制造规范ID"
|
||||
clearable
|
||||
@keyup.enter.native="handleQuery"
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item label="订单" prop="orderId">
|
||||
<el-input
|
||||
v-model="queryParams.orderId"
|
||||
placeholder="请输入订单ID"
|
||||
clearable
|
||||
@keyup.enter.native="handleQuery"
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item label="计划名称" prop="planName">
|
||||
<el-input
|
||||
v-model="queryParams.planName"
|
||||
placeholder="请输入计划名称"
|
||||
clearable
|
||||
@keyup.enter.native="handleQuery"
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item label="计划编号" prop="planCode">
|
||||
<el-input
|
||||
v-model="queryParams.planCode"
|
||||
placeholder="请输入计划编号"
|
||||
clearable
|
||||
@keyup.enter.native="handleQuery"
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
|
||||
<el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
|
||||
<el-row :gutter="10" class="mb8">
|
||||
<el-col :span="1.5">
|
||||
<el-button
|
||||
type="primary"
|
||||
plain
|
||||
icon="el-icon-plus"
|
||||
size="mini"
|
||||
@click="handleCreateFromOrder"
|
||||
>从订单创建</el-button>
|
||||
</el-col>
|
||||
<el-col :span="1.5">
|
||||
<el-button
|
||||
type="primary"
|
||||
plain
|
||||
icon="el-icon-plus"
|
||||
size="mini"
|
||||
@click="handleAdd"
|
||||
>新增</el-button>
|
||||
</el-col>
|
||||
<el-col :span="1.5">
|
||||
<el-button
|
||||
type="success"
|
||||
plain
|
||||
icon="el-icon-edit"
|
||||
size="mini"
|
||||
:disabled="single"
|
||||
@click="handleUpdate"
|
||||
>修改</el-button>
|
||||
</el-col>
|
||||
<el-col :span="1.5">
|
||||
<el-button
|
||||
type="danger"
|
||||
plain
|
||||
icon="el-icon-delete"
|
||||
size="mini"
|
||||
:disabled="multiple"
|
||||
@click="handleDelete"
|
||||
>删除</el-button>
|
||||
</el-col>
|
||||
<el-col :span="1.5">
|
||||
<el-button
|
||||
type="warning"
|
||||
plain
|
||||
icon="el-icon-download"
|
||||
size="mini"
|
||||
@click="handleExport"
|
||||
>导出</el-button>
|
||||
</el-col>
|
||||
<right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
|
||||
</el-row>
|
||||
|
||||
<KLPTable v-loading="loading" :data="productionTaskList" @selection-change="handleSelectionChange">
|
||||
<el-table-column type="selection" width="55" align="center" />
|
||||
<el-table-column label="主键" align="center" prop="taskId" v-if="false" />
|
||||
<!-- <el-table-column label="产品规范组ID" align="center" prop="productSpecGroupId" /> -->
|
||||
<el-table-column label="产品规范组" align="center" prop="productSpecGroup.groupName" />
|
||||
<el-table-column label="产品规范名" align="center" prop="productSpecGroup.groupCode" />
|
||||
<el-table-column label="工艺步骤" align="center" prop="manufacturingSpec.processRoute" />
|
||||
<el-table-column label="制造规范名" align="center" prop="manufacturingSpec.specName" />
|
||||
<el-table-column label="制造规范编号" align="center" prop="manufacturingSpec.specCode" />
|
||||
<el-table-column label="订单编号" align="center" prop="orderCode" />
|
||||
<el-table-column label="生产产品" align="center">
|
||||
<template slot-scope="scope">
|
||||
<ProductInfo :productId="scope.row.productId" />
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="计划名称" align="center" prop="planName" />
|
||||
<el-table-column label="计划编号" align="center" prop="planCode" />
|
||||
<!-- <el-table-column label="状态" align="center" prop="status" /> -->
|
||||
<el-table-column label="备注" align="center" prop="remark" />
|
||||
<el-table-column label="操作" align="center" class-name="small-padding fixed-width">
|
||||
<template slot-scope="scope">
|
||||
<el-button
|
||||
size="mini"
|
||||
type="text"
|
||||
icon="el-icon-edit"
|
||||
@click="handleUpdate(scope.row)"
|
||||
>修改</el-button>
|
||||
<el-button
|
||||
size="mini"
|
||||
type="text"
|
||||
icon="el-icon-delete"
|
||||
@click="handleDelete(scope.row)"
|
||||
>删除</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</KLPTable>
|
||||
|
||||
<pagination
|
||||
v-show="total>0"
|
||||
:total="total"
|
||||
:page.sync="queryParams.pageNum"
|
||||
:limit.sync="queryParams.pageSize"
|
||||
@pagination="getList"
|
||||
/>
|
||||
|
||||
<!-- 添加或修改生产任务对话框 -->
|
||||
<el-dialog :title="title" :visible.sync="open" width="500px" append-to-body>
|
||||
<el-form ref="form" :model="form" :rules="rules" label-width="100px">
|
||||
<el-form-item label="产品规范组" prop="productSpecGroupId">
|
||||
<PSpecSelect v-model="form.productSpecGroupId" />
|
||||
</el-form-item>
|
||||
<el-form-item label="制造规范" prop="manufacturingSpecId">
|
||||
<MSpecSelect v-model="form.manufacturingSpecId" />
|
||||
</el-form-item>
|
||||
<!-- <el-form-item label="订单" prop="orderId">
|
||||
<el-input v-model="form.orderId" placeholder="请输入订单" />
|
||||
</el-form-item>
|
||||
<el-form-item label="订单明细" prop="orderItemId">
|
||||
<OrderSelect v-model="form.orderId" @change="handleOrderChange" />
|
||||
</el-form-item> -->
|
||||
<el-form-item label="计划名称" prop="planName">
|
||||
<el-input v-model="form.planName" placeholder="请输入计划名称" />
|
||||
</el-form-item>
|
||||
<el-form-item label="计划编号" prop="planCode">
|
||||
<el-input v-model="form.planCode" placeholder="请输入计划编号" />
|
||||
</el-form-item>
|
||||
<el-form-item label="备注" prop="remark">
|
||||
<el-input v-model="form.remark" type="textarea" placeholder="请输入内容" />
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<div slot="footer" class="dialog-footer">
|
||||
<el-button :loading="buttonLoading" type="primary" @click="submitForm">确 定</el-button>
|
||||
<el-button @click="cancel">取 消</el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
|
||||
<el-dialog title="从订单创建生产任务" :visible.sync="detailDialogVisible" width="500px" append-to-body>
|
||||
<CreateByOrder @create="handleConfirmCreate" />
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { listProductionTask, getProductionTask, delProductionTask, addProductionTask, updateProductionTask } from "@/api/work/productionTask";
|
||||
import CreateByOrder from "./panels/createByOrder.vue";
|
||||
import ProductInfo from "@/components/KLPService/Renderer/ProductInfo";
|
||||
import MSpecSelect from "../components/MSpecSelect.vue";
|
||||
import PSpecSelect from "../components/PSpecSelect.vue";
|
||||
|
||||
export default {
|
||||
name: "ProductionTask",
|
||||
components: {
|
||||
CreateByOrder,
|
||||
ProductInfo,
|
||||
MSpecSelect,
|
||||
PSpecSelect
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
// 按钮loading
|
||||
buttonLoading: false,
|
||||
// 遮罩层
|
||||
loading: true,
|
||||
// 选中数组
|
||||
ids: [],
|
||||
// 非单个禁用
|
||||
single: true,
|
||||
// 非多个禁用
|
||||
multiple: true,
|
||||
// 显示搜索条件
|
||||
showSearch: true,
|
||||
// 总条数
|
||||
total: 0,
|
||||
// 生产任务表格数据
|
||||
productionTaskList: [],
|
||||
// 弹出层标题
|
||||
title: "",
|
||||
// 是否显示弹出层
|
||||
open: false,
|
||||
// 查询参数
|
||||
queryParams: {
|
||||
pageNum: 1,
|
||||
pageSize: 10,
|
||||
productSpecGroupId: undefined,
|
||||
manufacturingSpecId: undefined,
|
||||
orderId: undefined,
|
||||
orderItemId: undefined,
|
||||
planName: undefined,
|
||||
planCode: undefined,
|
||||
status: undefined,
|
||||
},
|
||||
// 表单参数
|
||||
form: {},
|
||||
// 表单校验
|
||||
rules: {
|
||||
productSpecGroupId: [
|
||||
{ required: true, message: "产品规范组ID不能为空", trigger: "blur" }
|
||||
],
|
||||
manufacturingSpecId: [
|
||||
{ required: true, message: "制造规范ID不能为空", trigger: "blur" }
|
||||
],
|
||||
},
|
||||
detailDialogVisible: false,
|
||||
};
|
||||
},
|
||||
created() {
|
||||
this.getList();
|
||||
},
|
||||
methods: {
|
||||
/** 查询生产任务列表 */
|
||||
getList() {
|
||||
this.loading = true;
|
||||
listProductionTask(this.queryParams).then(response => {
|
||||
this.productionTaskList = response.rows;
|
||||
this.total = response.total;
|
||||
this.loading = false;
|
||||
});
|
||||
},
|
||||
// 取消按钮
|
||||
cancel() {
|
||||
this.open = false;
|
||||
this.reset();
|
||||
},
|
||||
// 表单重置
|
||||
reset() {
|
||||
this.form = {
|
||||
taskId: undefined,
|
||||
productSpecGroupId: undefined,
|
||||
manufacturingSpecId: undefined,
|
||||
orderId: undefined,
|
||||
orderItemId: undefined,
|
||||
planName: undefined,
|
||||
planCode: undefined,
|
||||
status: undefined,
|
||||
remark: undefined,
|
||||
createBy: undefined,
|
||||
createTime: undefined,
|
||||
updateBy: undefined,
|
||||
updateTime: undefined,
|
||||
delFlag: undefined
|
||||
};
|
||||
this.resetForm("form");
|
||||
},
|
||||
/** 搜索按钮操作 */
|
||||
handleQuery() {
|
||||
this.queryParams.pageNum = 1;
|
||||
this.getList();
|
||||
},
|
||||
/** 重置按钮操作 */
|
||||
resetQuery() {
|
||||
this.resetForm("queryForm");
|
||||
this.handleQuery();
|
||||
},
|
||||
// 多选框选中数据
|
||||
handleSelectionChange(selection) {
|
||||
this.ids = selection.map(item => item.taskId)
|
||||
this.single = selection.length!==1
|
||||
this.multiple = !selection.length
|
||||
},
|
||||
/** 新增按钮操作 */
|
||||
handleAdd() {
|
||||
this.reset();
|
||||
this.open = true;
|
||||
this.title = "添加生产任务";
|
||||
},
|
||||
/** 修改按钮操作 */
|
||||
handleUpdate(row) {
|
||||
this.loading = true;
|
||||
this.reset();
|
||||
const taskId = row.taskId || this.ids
|
||||
getProductionTask(taskId).then(response => {
|
||||
this.loading = false;
|
||||
this.form = response.data;
|
||||
this.open = true;
|
||||
this.title = "修改生产任务";
|
||||
});
|
||||
},
|
||||
/** 提交按钮 */
|
||||
submitForm() {
|
||||
this.$refs["form"].validate(valid => {
|
||||
if (valid) {
|
||||
this.buttonLoading = true;
|
||||
if (this.form.taskId != null) {
|
||||
updateProductionTask(this.form).then(response => {
|
||||
this.$modal.msgSuccess("修改成功");
|
||||
this.open = false;
|
||||
this.getList();
|
||||
}).finally(() => {
|
||||
this.buttonLoading = false;
|
||||
});
|
||||
} else {
|
||||
addProductionTask(this.form).then(response => {
|
||||
this.$modal.msgSuccess("新增成功");
|
||||
this.open = false;
|
||||
this.getList();
|
||||
}).finally(() => {
|
||||
this.buttonLoading = false;
|
||||
});
|
||||
}
|
||||
}
|
||||
});
|
||||
},
|
||||
/** 删除按钮操作 */
|
||||
handleDelete(row) {
|
||||
const taskIds = row.taskId || this.ids;
|
||||
this.$modal.confirm('是否确认删除生产任务编号为"' + taskIds + '"的数据项？').then(() => {
|
||||
this.loading = true;
|
||||
return delProductionTask(taskIds);
|
||||
}).then(() => {
|
||||
this.loading = false;
|
||||
this.getList();
|
||||
this.$modal.msgSuccess("删除成功");
|
||||
}).catch(() => {
|
||||
}).finally(() => {
|
||||
this.loading = false;
|
||||
});
|
||||
},
|
||||
/** 导出按钮操作 */
|
||||
handleExport() {
|
||||
this.download('klp/productionTask/export', {
|
||||
...this.queryParams
|
||||
}, `productionTask_${new Date().getTime()}.xlsx`)
|
||||
},
|
||||
handleCreateFromOrder() {
|
||||
this.reset();
|
||||
this.detailDialogVisible = true;
|
||||
},
|
||||
handleConfirmCreate(orderItems) {
|
||||
console.log(orderItems);
|
||||
const params = [];
|
||||
const orderId = orderItems[0].orderId;
|
||||
|
||||
for (const item of orderItems) {
|
||||
if (item.groupId == undefined) {
|
||||
continue;
|
||||
}
|
||||
for (const manufacturingSpecId of item.manufacturingSpecIds) {
|
||||
params.push({
|
||||
productSpecGroupId: item.groupId,
|
||||
manufacturingSpecId: manufacturingSpecId,
|
||||
orderId: item.orderId,
|
||||
orderItemId: item.detailId,
|
||||
planName: '生产任务' + item.detailId,
|
||||
planCode: 'PT' + item.detailId,
|
||||
})
|
||||
}
|
||||
}
|
||||
Promise.all(params.map(item => {
|
||||
return addProductionTask(item);
|
||||
})).then(res => {
|
||||
this.$modal.msgSuccess("创建成功");
|
||||
// 是否将订单状态设置为生产中？
|
||||
this.$modal.confirm('是否将订单状态设置为生产中？').then(() => {
|
||||
updateOrder({
|
||||
orderId,
|
||||
orderStatus: 2
|
||||
});
|
||||
});
|
||||
this.detailDialogVisible = false;
|
||||
this.getList();
|
||||
});
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
@@ -1,131 +0,0 @@
|
||||
<template>
|
||||
<div>
|
||||
<el-row style="margin-bottom: 10px;">
|
||||
<el-col :span="12">
|
||||
<OrderSelect @change="handleOrderChange" />
|
||||
</el-col>
|
||||
<el-col :span="12" style="text-align: right;">
|
||||
<el-button type="primary" @click="handleCreate">确认创建</el-button>
|
||||
</el-col>
|
||||
</el-row>
|
||||
|
||||
<KLPTable :data="orderItems" style="width: 100%;">
|
||||
<el-table-column label="产品">
|
||||
<template slot-scope="scope">
|
||||
<ProductInfo :productId="scope.row.productId" />
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="规格">
|
||||
<template slot-scope="scope">
|
||||
<el-button type="text" @click="handleSpec(scope.row)">查看规格</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="制造规格">
|
||||
<template slot-scope="scope">
|
||||
<el-select v-model="scope.row.manufacturingSpecIds" placeholder="请选择制造规格" multiple>
|
||||
<el-option v-for="item in manufacturingSpecList" :key="item.specId" :label="item.specName" :value="item.specId" />
|
||||
</el-select>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</KLPTable>
|
||||
|
||||
<el-dialog title="产品规范" :visible.sync="specDialogVisible" width="600px" append-to-body>
|
||||
<ProductSpec v-if="form.groupId" :groupId="form.groupId" :readonly="false"/>
|
||||
<div v-else>
|
||||
<el-select placeholder="请选择产品规范" @change="handleChangeSpec" style="width: 100%;">
|
||||
<el-option v-for="item in productSpecList.filter(item => item.productId != this.form.productId)" :key="item.groupId" :label="item.groupName" :value="item.groupId" />
|
||||
<template #empty>
|
||||
<el-button @click="handleAddSpec" style="width: 100%;">新增产品规范</el-button>
|
||||
</template>
|
||||
</el-select>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import OrderSelect from "../components/OrderSelect";
|
||||
import { listOrderDetail, updateOrderDetail } from "@/api/wms/orderDetail";
|
||||
import ProductInfo from "@/components/KLPService/Renderer/ProductInfo";
|
||||
import MSpecSelect from "@/views/work/components/MSpecSelect";
|
||||
import ProductSpec from "@/views/wms/order/panels/spec.vue";
|
||||
|
||||
import { listManufacturingSpec } from "@/api/work/manufacturingSpec";
|
||||
import { listProductSpecGroup } from "@/api/work/productSpecGroup";
|
||||
|
||||
export default {
|
||||
name: 'CreateByOrder',
|
||||
components: {
|
||||
OrderSelect,
|
||||
ProductInfo,
|
||||
MSpecSelect,
|
||||
ProductSpec
|
||||
},
|
||||
created() {
|
||||
listManufacturingSpec().then(res => {
|
||||
this.manufacturingSpecList = res.rows;
|
||||
})
|
||||
listProductSpecGroup().then(response => {
|
||||
this.productSpecList = response.rows;
|
||||
});
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
order: null,
|
||||
orderItems: [],
|
||||
specDialogVisible: false,
|
||||
form: {
|
||||
groupId: undefined
|
||||
},
|
||||
manufacturingSpecList: [],
|
||||
productSpecList: [],
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
handleOrderChange(order) {
|
||||
this.order = order;
|
||||
listOrderDetail({
|
||||
orderId: order.orderId
|
||||
}).then(res => {
|
||||
this.orderItems = res.rows
|
||||
})
|
||||
},
|
||||
handleCreate() {
|
||||
console.log(this.orderItems);
|
||||
if (this.orderItems.length === 0) {
|
||||
this.$message.error('请选择订单');
|
||||
return;
|
||||
}
|
||||
for (const item of this.orderItems) {
|
||||
if (item.groupId && item.manufacturingSpecIds.length === 0) {
|
||||
this.$message.error('请选择制造规格');
|
||||
return;
|
||||
}
|
||||
}
|
||||
this.$emit('create', this.orderItems);
|
||||
},
|
||||
handleSpec(row) {
|
||||
this.specDialogVisible = true;
|
||||
this.form = row;
|
||||
},
|
||||
handleChangeSpec(groupId) {
|
||||
// 确认更换
|
||||
this.$modal && this.$modal.confirm('是否确认更换产品规范？').then(() => {
|
||||
this.form.groupId = groupId;
|
||||
updateOrderDetail(this.form).then(response => {
|
||||
this.$modal && this.$modal.msgSuccess("修改成功");
|
||||
this.open = false;
|
||||
this.getList();
|
||||
}).finally(() => {
|
||||
this.buttonLoading = false;
|
||||
});
|
||||
});
|
||||
},
|
||||
handleAddSpec() {
|
||||
this.$router.push({
|
||||
path: '/production/pspec',
|
||||
});
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
Reference in New Issue
Block a user