搜索

gaoshp

2024-06-02 b46e6d2306515f94bf77c06e8d80ac76267e3ddb

 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,8 +22,8 @@
      </div>
      <div class="process-main-tabs">
         <div class="process-main-header">
            <div class="main-header-label">工艺路线<span>{{leftData[0].name}}</span></div>
            <div style="padding: 20px;border-bottom: 1px solid #dee;">
            <div class="main-header-label">工艺路线<span>{{productName}}</span></div>
            <div style="padding: 20px 20px 8px;border-bottom: 1px solid #dee;">
               <div class="main-info">
                  <div class="info-top-title">工艺路线版本</div>
                  <div class="main-info-tooltip">
@@ -32,74 +32,32 @@
                  </div>
               </div>
               <div>
                  <div class="btn-box vistion-button">
                  <div :class="{'btn-box':true, 'vistion-button': true, 'isBorder': item.isBorder}" v-for="(item,index) in detail.dtos" @click="changeDots(item,index)">
                     <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>
                     <el-icon class="vistion-button-icon" @click="delIcon(item)"><Delete /></el-icon>
                  </div>
                  <div class="btn-box most-vision">更多版本...</div>
                  <el-button>+ 添加新版本</el-button>
                  <div class="btn-box most-vision" @click="changeV" v-if="detail.dtos.length!=0">{{changVTitle}}</div>
                  <el-button @click="addVision">+ 添加新版本</el-button>
               </div>
            </div>
         </div>
         <div class="correlation-product-line">关联产线<span>千文科技</span></div>
         <div class="process-main-content">
            <div class="main-content-left">
               <div class="info-top-title">工艺路线</div>
               <div style="margin-bottom: 12px;">
                     <el-button type="primary">新增</el-button>
                     <el-button type="primary">定版</el-button>
                     <el-button disabled>并序</el-button>
               </div>
               <el-table ref="multipleTableRef0" :data="tableData" border style="width: 100%" class="multipleTableRef" @selection-change="HandleSelectionChange">
                  <el-table-column type="selection" width="55" />
                  <el-table-column prop="name" label="工序顺序"></el-table-column>
                  <el-table-column prop="code" label="工序编号"></el-table-column>
                  <el-table-column prop="typeName" label="工序名称"></el-table-column>
                  <el-table-column fixed="right" label="操作" width="200px">
                     <template #default="scope">
                        <!-- <el-button text type="primary" size="small" @click="table_edit(scope.row, scope.$index)">编辑</el-button>
                        <el-button text type="primary" size="small" @click="table_edit(scope.row, scope.$index)">刷新</el-button>
                        <el-button text type="primary" size="small" @click="table_edit(scope.row, scope.$index)">删除</el-button> -->
                     </template>
                  </el-table-column>
               </el-table>
            </div>
            <div class="main-content-right">
               <div class="main-info-title">工序信息</div>
               <ul>
                  <li>工序编号<span>-</span></li>
                  <li>工序名称<span>-</span></li>
                  <li>工序顺序<span>-</span></li>
               </ul>
            </div>
            <!-- isCustomization 新建/步骤 -->
            <workmanship :isCustomization="true" :craftId="craftId"></workmanship>
         </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>

<script>
   import saveDialog from './addRoute'
   import workmanship from './process-route/workmanship'  //工艺路线
   import * as ElementPlusIconsVue from '@element-plus/icons-vue'
   let icons = []
   for (const [key, component] of Object.entries(ElementPlusIconsVue)) {
@@ -107,9 +65,16 @@
   }
   export default {
      name: 'route',
      components: {...ElementPlusIconsVue,saveDialog},
      components: {...ElementPlusIconsVue,saveDialog,workmanship},
      data() {
         return {
            craftId: "",
            id: "",
            changVTitle: "更多版本...",
            isMore: true,
            productName: "",
            vHtml: '',
            detail: {dtos: [{name: "",isBorder: false}]},
            testList: [],
            routeForm: {
               test: ""
@@ -125,16 +90,66 @@
               save: false
            },
            info: {},
            tableData: [],
            selection: []
            delIconId: ""
         }
      },
      mounted(){
         this.getLeftTree();
      },
      methods: {
         delIcon(item) {
            this.delIconId = item.id;
            var that = this;
            this.$confirm(`确认要删除此工艺版本吗?`, '', {
               type: 'warning'
            }).then(() => {
               this.$HTTP.delete("/api/blade-cps/production-craft-version/remove/"+that.delIconId).then(res=> {
                  if(res.code == 200) {
                     that.$message.success("操作成功");
                     that.getDetail();
                  }
               })
            }).catch(() => {

            })
         },
         changeDots(item,index) {
            this.detail.dtos.forEach(item=> {
               item.isBorder = false;
            })
            this.detail.dtos[index].isBorder = true;
            this.craftId = item.id;
         },
         addVision() {
            this.$router.push({path: `/console/product-process/process-route/add-craft-version`,query: {id:this.id,craftId:this.craftId}})
         },
         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=> {
               if(res.code == 200) {
                  this.dialog.save = true;
@@ -146,9 +161,6 @@
         },
         addRouteSuccess() {
            this.getLeftTree();
         },
         HandleSelectionChange(selection) {
            this.selection = selection;
         },
         routeSubmit() {
            this.$refs.dialogForm.validate(async (valid) => {
@@ -176,6 +188,20 @@
            this.leftData[index].active = true;
            this.info = this.leftData[index];
         },
         getDetail() {
            this.$HTTP.get(`/api/blade-cps/craft-routing/detail?id=${this.id}`).then(res=> {
               if(res.code == 200) {
                  if(res.data.dtos.length != 0) {
                     res.data.dtos.forEach(item=> {
                        item.isBorder = false;
                     })
                     res.data.dtos[0].isBorder = true;
                     this.craftId = res.data.dtos[0].id;
                  }
                  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();
               }
            })
         }
@@ -276,11 +307,6 @@
.main-header-label span {
   margin-left: 12px;
}
.main-info-title {
   font-size: 14px;
    padding-left: 8px;
    border-left: 2px solid #7ab3ee;
}
.info-top-title {
   padding-left: 8px;
    border-left: 4px solid #86bffa;
@@ -304,38 +330,6 @@
    margin-right: 4px;
    display: inline-block;
}
.main-info-conent {
   display: flex;
    margin: 8px 0px 12px;
}
.main-info-conent > span {
   margin-right: 12px;
   font-size: 14px;
}
.main-info-conent > span span {
   margin-left:12px;
}
.process-main-content {
   display: flex;
}
.main-content-left {
   width: 70%;
}
.main-content-right {
   flex: 1;
}
.main-content-right ul {
   padding: 12px 30px;
}
.main-content-right ul li {
   width: 50%;
   float: left;
   list-style: none;
   margin-bottom:12px;
}
.main-content-right ul li span {
   margin-left:12px;
}
.addRoute {
   color: #409eff;
   padding: 12px 6px;
@@ -344,19 +338,24 @@
}
.btn-box {
   display: inline-block;
   margin-right: 20px;
}
.most-vision {
   border-bottom: 1px solid #86bffa;
   font-size: 14px;
   font-weight: 700;
   cursor: pointer;
   margin-right: 12px;
   margin-left: 6px;
}
.vistion-button {
   border: 1px solid #86bffa;
    padding: 8px 12px;
   margin-right: 6px;
   margin-bottom: 12px;
}
.vistion-button-name {
   vertical-align: middle;
   cursor: pointer;
}
.vistion-button-round {
   width: 10px;
@@ -382,4 +381,22 @@
.correlation-product-line span {
   margin-left: 20px;
}
.isBorder {
   border: 1px solid #0176f0;
}
</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>