1

lzhe

2024-05-24 9771f0241849c464c01dd76d7f841facd2abf6ef

1

 src/config/route.js

@@ -36,7 +36,29 @@
            type: 'menu',
            hidden: true
        }
    }
    },
    {
        name: "新建工艺路线",
        path: "/console/product-process/process-route/add-craft",
        component: "console/product-process/process-route/add-craft",
        meta: {
            icon: "el-icon-menu",
            title: "新建工艺路线",
            type: 'menu',
            hidden: true
        }
    },
    {
        name: "新建工艺路线版本",
        path: "/console/product-process/process-route/add-craft-version",
        component: "console/product-process/process-route/add-craft-version",
        meta: {
            icon: "el-icon-menu",
            title: "新建工艺路线版本",
            type: 'menu',
            hidden: true
        }
    }
]

//const routes = []

 src/utils/request.js

@@ -185,6 +185,7 @@
            }).then((response) => {
                resolve(response.data);
            }).catch((error) => {
                resolve(error.data);
                reject(error);
            })
        })

 src/views/console/product-process/process-route.vue

@@ -1,7 +1,7 @@
<template>
    <div class="processPage">
        <div class="roleContainer">
            <div class="addRoute">+新建工艺路线</div>
            <div class="addRoute" @click="addRoute">+新建工艺路线</div>
            <el-input v-model="keyword" size="small" prefix-icon="el-icon-search" placeholder="请输入名称" clearable @keyup.enter="searchBtn"></el-input>
            <ul class="left-ul">
                <li v-for="(item,index) in leftData" :class="{active: item.active}" @click="changeTabaleLi(index)">
@@ -22,7 +22,7 @@
        </div>
        <div class="process-main-tabs">
            <div class="process-main-header">
                <div class="main-header-label">工艺路线<span>{{leftData[0].name}}</span></div>
                <div class="main-header-label">工艺路线<span>{{productName}}</span></div>
                <div style="padding: 20px;border-bottom: 1px solid #dee;">
                    <div class="main-info">
                        <div class="info-top-title">工艺路线版本</div>
@@ -32,14 +32,16 @@
                        </div>
                    </div>
                    <div>
                        <div class="btn-box vistion-button">
                        <div class="btn-box vistion-button" v-for="item in detail.dtos">
                            <span class="vistion-button-round"></span>
                            <span class="vistion-button-name">V001</span>
                            <el-tooltip trigger="click" class="detail-item" effect="dark" :content="vHtml" placement="bottom" raw-content>
                              <span class="vistion-button-name" @click="showDetail(item)">{{item.name}}</span>
                            </el-tooltip>
                            <el-icon class="vistion-button-icon"><DocumentCopy /></el-icon>
                            <el-icon class="vistion-button-icon"><Delete /></el-icon>
                        </div>
                        <div class="btn-box most-vision">更多版本...</div>
                        <el-button>+ æ·»åŠ æ–°ç‰ˆæœ¬</el-button>
                        <div class="btn-box most-vision" @click="changeV">{{changVTitle}}</div>
                        <el-button @click="addVision">+ æ·»åŠ æ–°ç‰ˆæœ¬</el-button>
                    </div>
                </div>
            </div>
@@ -76,24 +78,6 @@
                </div>
            </div>
        </div>
        <!-- <el-dialog title="" v-model="visible" :width="360" class="visible-model">
            <el-form :model="routeForm" :rules="routeRules" ref="dialogForm" label-width="120px"
                label-position="center">
                <el-row>
                    <el-col :span="24">
                        <el-form-item label="工艺路线版本" prop="test">
                            <el-select v-model="routeForm.test" style="width: 100%" placeholder="请选择">
                                <el-option v-for="item in testList" :key="item.id" :label="item.title" :value="item.id"/>
                            </el-select>
                        </el-form-item>
                    </el-col>
                </el-row>
            </el-form>
            <template #footer>
                <el-button @click="visible = false">取消</el-button>
                <el-button type="primary" :loading="isSaveing" @click="routeSubmit">确定</el-button>
            </template>
        </el-dialog> -->
    </div>
    <save-dialog v-if="dialog.save" ref="saveDialog" @success="addRouteSuccess" @closed="dialog.save=false"></save-dialog>
</template>
@@ -110,6 +94,12 @@
        components: {...ElementPlusIconsVue,saveDialog},
        data() {
            return {
                id: "",
                changVTitle: "更多版本...",
                isMore: true,
                productName: "",
                vHtml: '',
                detail: {dtos: [{name: ""}]},
                testList: [],
                routeForm: {
                    test: ""
@@ -133,6 +123,35 @@
            this.getLeftTree();
        },
        methods: {
            addVision() {
                this.$router.push({path: `/console/product-process/process-route/add-craft-version`,query: {id:this.id}})
            },
            addRoute() {
                this.$router.push({path: `/console/product-process/process-route/add-craft`,query: {id:this.id}})
            },
            changeV() {
                this.isMore = !this.isMore;
                if(this.isMore) {
                    this.changVTitle = "更多版本...";
                }else {
                    this.changVTitle = "收起";
                }
            },
            showDetail(item) {
                this.$HTTP.get(`/api/blade-cps/production-craft-version/detail/${item.id}`).then(res=> {
                    if(res.code == 200) {
                        this.vHtml = `<ul class='detailUl'>
                            <li><span class='detailStyle'>名称</span><span>${res.data.name}</span></li>
                            <li><span class='detailStyle'>关联产线</span><span>${res.data.groupName}</span></li>
                            <li><span class='detailStyle'>描述</span><span>${res.data.description}</span></li>
                            <li><span class='detailStyle'>创建人</span><span>${res.data.createUser}</span></li>
                            <li><span class='detailStyle'>创建时间</span><span>${res.data.createTime}</span></li>
                            <li><span class='detailStyle'>修改人</span><span>${res.data.updateUser}</span></li>
                            <li><span class='detailStyle'>修改时间</span><span>${res.data.updateTime}</span></li>
                        </ul>`
                    }
                })
            },
            table_edit(row){
                this.dialog.save = true
                this.$HTTP.get(`/api/blade-cps/craft-routing/not-band-craft?craftId=${row.id}`).then(res=> {
@@ -176,6 +195,13 @@
                this.leftData[index].active = true;
                this.info = this.leftData[index];
            },
            getDetail(id) {
                this.$HTTP.get(`/api/blade-cps/craft-routing/detail?id=${id}`).then(res=> {
                    if(res.code == 200) {
                        this.detail = res.data;
                    }
                })
            },
            getLeftTree() {
                var params = [{
                    key: "name_like",value: ""
@@ -185,6 +211,11 @@
                this.$HTTP.post("/api/blade-cps/craft-routing/list",{params}).then(res=> {
                    if(res.code == 200) {
                        this.leftData = res.data;
                        if(res.data) {
                            this.productName = res.data[0].name;
                            this.id = res.data[0].id;
                        }
                        this.getDetail(res.data[0].id);
                    }
                })
            }
@@ -350,6 +381,7 @@
    border-bottom: 1px solid #86bffa;
    font-size: 14px;
    font-weight: 700;
    cursor: pointer;
}
.vistion-button {
    border: 1px solid #86bffa;
@@ -357,6 +389,7 @@
}
.vistion-button-name {
    vertical-align: middle;
    cursor: pointer;
}
.vistion-button-round {
    width: 10px;
@@ -383,3 +416,18 @@
    margin-left: 20px;
}
</style>
<style>
    .detailUl {
        padding:20px 6px 8px;
    }
    .detailUl li{
        list-style: none;
        margin-bottom: 8px;
    }
    .detailStyle {
        display: inline-block;
        width: 60px;
        text-align: right;
        margin-right:20px;
    }
</style>

 src/views/console/product-process/process-route/add-craft-version.vue

¶Ô±ÈÐÂÎļþ
@@ -0,0 +1,231 @@
<template>
    <div class="processPage">
        <el-steps :active="active" finish-status="success" style="step">
          <el-step title="工艺路线版本"></el-step>
          <el-step title="添加工序"></el-step>
          <el-step title="完成"></el-step>
        </el-steps>
        <div class="step-dev">
            <el-button @click="previous" v-if="active != 0">上一步</el-button>
            <el-button type="primary" @click="next">下一步</el-button>
        </div>
        <div class="step-content">
            <!-- ç¬¬ä¸€æ­¥ -->
            <el-form :model="addStepForm0" :rules="addStepRules0" ref="dialogForm0" label-width="80px" label-position="center" class="addStepRules0" v-show="active == 0">
                <el-row>
                    <el-col :span="24">
                        <el-form-item label="工艺路线" prop="name">
                            <el-input v-model="addStepForm0.name" placeholder="工艺路线" clearable></el-input>
                        </el-form-item>
                    </el-col>
                    <el-col :span="24">
                        <el-form-item label="产品编号">
                            <el-select v-model="addStepForm0.productId" style="width: 100%" placeholder="产品编号">
                                <el-option v-for="item in productList" :key="item.id" :label="item.name" :value="item.id"/>
                            </el-select>
                        </el-form-item>
                    </el-col>
                    <el-col :span="24">
                        <el-form-item label="备注">
                            <el-input v-model="addStepForm0.description" placeholder="备注" clearable></el-input>
                        </el-form-item>
                    </el-col>
                </el-row>
            </el-form>
            <!-- ç¬¬äºŒæ­¥ -->
            <el-form :model="addStepForm1" :rules="addStepRules1" ref="dialogForm1" label-width="80px" label-position="center" class="addStepRules0" v-show="active == 1">
                <el-row>
                    <el-col :span="24">
                        <el-row class="step1-top">
                            <el-col :span="8"><span>工艺路线名称</span><span>-</span></el-col>
                            <el-col :span="8"><span>关联产品</span><span>-</span></el-col>
                            <el-col :span="8"><span>工艺路线描述</span><span>-</span></el-col>
                        </el-row>
                    </el-col>
                    <el-col :span="24">
                        <el-form-item label="版本名称">
                            <el-input v-model="addStepForm1.name" disabled placeholder="版本名称" clearable></el-input>
                        </el-form-item>
                    </el-col>
                    <el-col :span="24">
                        <el-form-item label="关联产线" prop="groupIds">
                            <el-tree-select
                                node-key="id"
                                :props="{ label: 'title',children: 'children',hasChildren: 'ids'}"
                                v-model="addStepForm1.groupIds"
                                placeholder="关联产线"
                                :data="step1TreeData"
                                multiple
                                default-expand-all
                                :render-after-expand="false"
                                show-checkbox
                                style="width: 100%"
                              />
                        </el-form-item>
                    </el-col>
                    <el-col :span="24">
                        <el-form-item label="描述">
                            <el-input v-model="addStepForm1.description" placeholder="请输入工艺路线版本描述" clearable></el-input>
                        </el-form-item>
                    </el-col>
                </el-row>
            </el-form>
        </div>
    </div>
</template>

<script>
    export default {
        name: 'add-craft',
        components: {},
        data() {
            var valiarrPass = (rule, value, callback) => {
                if (value.length == 0) {
                  callback(new Error('请选择关联产线'));
                } else {
                  callback();
                }
             };
            return {
                step1TreeData: [],
                active: 0,
                //表单数据
                addStepForm0: {
                    name: "",
                    productId: "",
                    description: "",

                },
                //验证规则
                addStepRules0: {
                    name:[{required: true, message: '请输入工艺路线'}],
                },
                addStepForm1: {
                    name: "",
                    groupIds: [],
                    description: "",

                },
                //验证规则
                addStepRules1: {
                    groupIds:[{validator: valiarrPass,required: true, trigger:'change'}],
                },
                productList: []
            }
        },
        watch: {
            active(step) {
                console.log(step)
            }
        },
        mounted(){
            //this.getProductList();  //for step0
            // this.getGroupWorkstation();  //for step1
        },
        methods: {
            getGroupWorkstation() {
                var obj = {
                    groupCategory: 1,
                    groupType: "group_workstation"
                }
                this.$HTTP.post(`/api/blade-cps/group/groupWorkstation`,obj).then(res=> {
                    if(res.code == 200) {
                        var tree = [];
                        var children = [];
                        res.data.forEach(item=> {
                            if(item.parentId == 1 && item.title != "默认") {
                                children.push(item);
                            }
                            if(item.parentId == 0) {
                                item.children = children;
                                tree.push(item);
                            }
                        })
                        this.step1TreeData = tree;
                        console.log(this.step1TreeData)
                    }
                })
            },
            previous() {
                if(this.active != 0) {
                    this.active -= this.active;
                }
            },
            next() {
                if(this.active == 0) {
                    this.setStep0();
                }else if(this.active == 1) {
					
                }else if(this.active == 2) {

                }
            },
            setStep0() {
                var obj = Object.assign({},this.addStepForm1);
                obj.craftId = "";
                this.$refs.dialogForm1.validate(async (valid) => {
                    if (valid) {
                        this.$HTTP.post("/api/blade-cps/production-craft-version/insert",obj).then(res=> {
                            this.isSaveing = false;
                            if(res.code == 200) {
                                this.active = 2;
                                this.$message.success("操作成功");
                            }else {
                                console.log(res,123)
                                //this.$alert(res.message, "提示", {type: 'error'});
                            }
                        })
                    }else{
                        return false;
                    }
                })
            },
            getDetail(id) {
                this.$HTTP.get(`/api/blade-cps/craft-routing/detail?id=${this.$route.query.id}`).then(res=> {
                    if(res.code == 200) {
                        this.addStepForm0 = res.data;
                    }
                })
            },
            getProductList() {
                this.$HTTP.get(`/api/blade-cps/craft-routing/not-band-craft?craftId=${this.$route.query.id}`).then(res=> {
                    if(res.code == 200) {
                        this.productList = res.data;
                        this.getDetail();
                    }
                })
            }
        }
    }
</script>

<style scoped>
.processPage {
    min-height: 100%;
    width:100%;
    margin: 8px;
    position: relative;
    background-color: #fff;
    padding: 40px 60px;
}
.step-dev {
    position: absolute;
    bottom: 12px;
    right: 60px;
    text-align: right;
}
.addStepRules0 {
    width: 70%;
}
.step-content {
    width: 100%;
    display: flex;
    justify-content: center;
    margin-top: 30px;
}
.step1-top {
    margin-bottom: 12px;
    background-color: #faf8f8;
    padding: 12px;
}
</style>

 src/views/console/product-process/process-route/add-craft.vue

¶Ô±ÈÐÂÎļþ
@@ -0,0 +1,250 @@
<template>
    <div class="processPage">
        <el-steps :active="active" finish-status="success" style="step">
          <el-step title="新建工艺路线"></el-step>
          <el-step title="工艺路线版本"></el-step>
          <el-step title="添加工序"></el-step>
          <el-step title="完成"></el-step>
        </el-steps>
        <div class="step-dev">
            <el-button @click="previous" v-if="active != 0">上一步</el-button>
            <el-button type="primary" @click="next">下一步</el-button>
        </div>
        <div class="step-content">
            <!-- ç¬¬ä¸€æ­¥ -->
            <el-form :model="addStepForm0" :rules="addStepRules0" ref="dialogForm0" label-width="80px" label-position="center" class="addStepRules0" v-show="active == 0">
                <el-row>
                    <el-col :span="24">
                        <el-form-item label="工艺路线" prop="name">
                            <el-input v-model="addStepForm0.name" placeholder="工艺路线" clearable></el-input>
                        </el-form-item>
                    </el-col>
                    <el-col :span="24">
                        <el-form-item label="产品编号">
                            <el-select v-model="addStepForm0.productId" style="width: 100%" placeholder="产品编号">
                                <el-option v-for="item in productList" :key="item.id" :label="item.name" :value="item.id"/>
                            </el-select>
                        </el-form-item>
                    </el-col>
                    <el-col :span="24">
                        <el-form-item label="备注">
                            <el-input v-model="addStepForm0.description" placeholder="备注" clearable></el-input>
                        </el-form-item>
                    </el-col>
                </el-row>
            </el-form>
            <!-- ç¬¬äºŒæ­¥ -->
            <el-form :model="addStepForm1" :rules="addStepRules1" ref="dialogForm1" label-width="80px" label-position="center" class="addStepRules0" v-show="active == 1">
                <el-row>
                    <el-col :span="24">
                        <el-row class="step1-top">
                            <el-col :span="8"><span>工艺路线名称</span><span>-</span></el-col>
                            <el-col :span="8"><span>关联产品</span><span>-</span></el-col>
                            <el-col :span="8"><span>工艺路线描述</span><span>-</span></el-col>
                        </el-row>
                    </el-col>
                    <el-col :span="24">
                        <el-form-item label="版本名称">
                            <el-input v-model="addStepForm1.name" disabled placeholder="版本名称" clearable></el-input>
                        </el-form-item>
                    </el-col>
                    <el-col :span="24">
                        <el-form-item label="关联产线" prop="groupIds">
                            <el-tree-select
                                node-key="id"
                                :props="{ label: 'title',children: 'children',hasChildren: 'ids'}"
                                v-model="addStepForm1.groupIds"
                                placeholder="关联产线"
                                :data="step1TreeData"
                                multiple
                                default-expand-all
                                :render-after-expand="false"
                                show-checkbox
                                style="width: 100%"
                              />
                        </el-form-item>
                    </el-col>
                    <el-col :span="24">
                        <el-form-item label="描述">
                            <el-input v-model="addStepForm1.description" placeholder="请输入工艺路线版本描述" clearable></el-input>
                        </el-form-item>
                    </el-col>
                </el-row>
            </el-form>
        </div>
    </div>
</template>

<script>
    export default {
        name: 'add-craft',
        components: {},
        data() {
            var valiarrPass = (rule, value, callback) => {
                if (value.length == 0) {
                  callback(new Error('请选择关联产线'));
                } else {
                  callback();
                }
             };
            return {
                step1TreeData: [],
                active: 0,
                //表单数据
                addStepForm0: {
                    name: "",
                    productId: "",
                    description: "",

                },
                //验证规则
                addStepRules0: {
                    name:[{required: true, message: '请输入工艺路线'}],
                },
                addStepForm1: {
                    name: "",
                    groupIds: [],
                    description: "",

                },
                //验证规则
                addStepRules1: {
                    groupIds:[{validator: valiarrPass,required: true, trigger:'change'}],
                },
                productList: []
            }
        },
        watch: {
            active(step) {
                console.log(step)
            }
        },
        mounted(){
            this.getProductList();  //for step0
            this.getGroupWorkstation();  //for step1
        },
        methods: {
            getGroupWorkstation() {
                var obj = {
                    groupCategory: 1,
                    groupType: "group_workstation"
                }
                this.$HTTP.post(`/api/blade-cps/group/groupWorkstation`,obj).then(res=> {
                    if(res.code == 200) {
                        var tree = [];
                        var children = [];
                        res.data.forEach(item=> {
                            if(item.parentId == 1 && item.title != "默认") {
                                children.push(item);
                            }
                            if(item.parentId == 0) {
                                item.children = children;
                                tree.push(item);
                            }
                        })
                        this.step1TreeData = tree;
                        console.log(this.step1TreeData)
                    }
                })
            },
            previous() {
                if(this.active != 0) {
                    this.active -= this.active;
                }
            },
            next() {
                if(this.active == 0) {
                    this.setStep0();
                }else if(this.active == 1) {
                    this.setStep1();
                }else if(this.active == 2) {

                }
            },
            setStep0() {
                var obj = Object.assign({},this.addStepForm0);
                this.$refs.dialogForm0.validate(async (valid) => {
                    if (valid) {
                        this.$HTTP.put("/api/blade-cps/craft-routing/update",obj).then(res=> {
                            this.isSaveing = false;
                            if(res.code == 200) {
                                this.active = 1;
                                this.$message.success("操作成功");
                            }else {
                                this.$alert(res.message, "提示", {type: 'error'});
                            }
                        })
                    }else{
                        return false;
                    }
                })
            },
            setStep1() {
                var obj = Object.assign({},this.addStepForm1);
                obj.craftId = "";
                this.$refs.dialogForm1.validate(async (valid) => {
                    if (valid) {
                        this.$HTTP.post("/api/blade-cps/production-craft-version/insert",obj).then(res=> {
                            this.isSaveing = false;
                            if(res.code == 200) {
                                this.active = 2;
                                this.$message.success("操作成功");
                            }else {
                                console.log(res,123)
                                //this.$alert(res.message, "提示", {type: 'error'});
                            }
                        })
                    }else{
                        return false;
                    }
                })
            },
            getDetail(id) {
                this.$HTTP.get(`/api/blade-cps/craft-routing/detail?id=${this.$route.query.id}`).then(res=> {
                    if(res.code == 200) {
                        this.addStepForm0 = res.data;
                    }
                })
            },
            getProductList() {
                this.$HTTP.get(`/api/blade-cps/craft-routing/not-band-craft?craftId=${this.$route.query.id}`).then(res=> {
                    if(res.code == 200) {
                        this.productList = res.data;
                        this.getDetail();
                    }
                })
            }
        }
    }
</script>

<style scoped>
.processPage {
    min-height: 100%;
    width:100%;
    margin: 8px;
    position: relative;
    background-color: #fff;
    padding: 40px 60px;
}
.step-dev {
    position: absolute;
    bottom: 12px;
    right: 60px;
    text-align: right;
}
.addStepRules0 {
    width: 70%;
}
.step-content {
    width: 100%;
    display: flex;
    justify-content: center;
    margin-top: 30px;
}
.step1-top {
    margin-bottom: 12px;
    background-color: #faf8f8;
    padding: 12px;
}
</style>