From 08193b7e1e12feef582930abb456606ef7f8cf10 Mon Sep 17 00:00:00 2001
From: Vergil <974548713@qq.com>
Date: Sat, 9 May 2020 10:00:57 +0800
Subject: [PATCH] =?UTF-8?q?=E8=87=AA=E5=88=B6=E4=BB=B6=E7=8A=B6=E6=80=81?=
 =?UTF-8?q?=E6=9F=A5=E8=AF=A2?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/api/ManufacturingCenter/StatusQuery.js    |  36 +-
 .../ManufacturingCenter/StatusQuery/index.vue |  33 +-
 .../TraceabilityOfParts/index.vue             | 265 ++---------
 .../TraceabilityOfParts/零件追溯备份.vue      | 445 ++++++++++++++++++
 4 files changed, 537 insertions(+), 242 deletions(-)
 create mode 100644 src/views/ManufacturingCenter/TraceabilityOfParts/零件追溯备份.vue

diff --git a/src/api/ManufacturingCenter/StatusQuery.js b/src/api/ManufacturingCenter/StatusQuery.js
index b19b8c49..531229f9 100644
--- a/src/api/ManufacturingCenter/StatusQuery.js
+++ b/src/api/ManufacturingCenter/StatusQuery.js
@@ -2,16 +2,6 @@ import request from '@/utils/request'
 import state from '@/store'
 import router from '@/router'
 
-// export function initProject() {
-//   return request({
-//     url: '',
-//     method: 'post',
-//     data: {
-//       type: '1',
-//       name: 'PDM_项目名称_查询数据_按时间排序'
-//     }
-//   })
-// }
 export function intPartState() {
   return request({
     url: '',
@@ -62,3 +52,29 @@ export function searchTable(check1, machine, check2, groupNum, check3, partNumbe
     }
   })
 }
+export function gettabledata1(num) {
+  return request({
+    url: '',
+    method: 'post',
+    data: {
+      UserID: state.state.user.id,
+      ModularID: router.currentRoute.path,
+      type: '1',
+      name: '车间生产管理工艺_追溯加工过程_查询工序',
+      param: '工艺计划流水号=' + num + '=int'
+    }
+  })
+}
+export function getPersons(num) {
+  return request({
+    url: '',
+    method: 'post',
+    data: {
+      UserID: state.state.user.id,
+      ModularID: router.currentRoute.path,
+      type: '1',
+      name: '车间生产管理工艺_自制件状态查询_每阶段操作者查询',
+      param: '工艺计划流水号=' + num
+    }
+  })
+}
diff --git a/src/views/ManufacturingCenter/StatusQuery/index.vue b/src/views/ManufacturingCenter/StatusQuery/index.vue
index eaccdc46..89af9c40 100644
--- a/src/views/ManufacturingCenter/StatusQuery/index.vue
+++ b/src/views/ManufacturingCenter/StatusQuery/index.vue
@@ -73,6 +73,11 @@
             </el-steps>
           </template>
         </el-table-column>
+        <el-table-column label="操作" align="center" width="80px">
+          <template slot-scope="scope">
+            <el-button type="text" plain size="small" @click="details(scope.row)">详情</el-button>
+          </template>
+        </el-table-column>
       </el-table>
       <div class="block" style="margin-top: 10px;">
         <el-pagination
@@ -86,14 +91,24 @@
       </div>
     </el-card>
 
+    <el-dialog :visible.sync="dialogVisible" class="StatusQueryDialog" title=" " center style="" width="1350px">
+      <div slot="footer" class="dialog-footer">
+        <TraceabilityOfParts ref="fresh"/>
+      </div>
+    </el-dialog>
   </div>
 </template>
 
 <script>
 import { searchTable, searchmachine, searchgroup } from '@/api/ManufacturingCenter/StatusQuery'
+import TraceabilityOfParts from '@/views/ManufacturingCenter/TraceabilityOfParts/index'
 export default {
+  components: {
+    'TraceabilityOfParts': TraceabilityOfParts
+  },
   data() {
     return {
+      dialogVisible: false,
       loading0: false,
       entryNameValue: '', // 项目流水号
       entryName: [], // 项目数组
@@ -144,15 +159,11 @@ export default {
     this.fetchData()
   },
   methods: {
+    details(row) {
+      this.dialogVisible = true
+      this.$refs.fresh.handleSelect(row)
+    },
     fetchData() {
-      // intPartState().then(response => {
-      //   for (let i = 0; i < response.data.length; i++) {
-      //     this.partState.push({
-      //       label: response.data[i].考核状态名称,
-      //       value: response.data[i].考核状态
-      //     })
-      //   }
-      // })
       searchmachine().then(response => {
         for (let i = 0; i < response.data.length; i++) {
           this.machineTool.push({
@@ -242,3 +253,9 @@ export default {
      padding: 0;
   }
 </style>
+<style>
+  .StatusQueryDialog .el-dialog--center .el-dialog__body {
+    text-align: initial;
+    padding: 0;
+  }
+</style>
diff --git a/src/views/ManufacturingCenter/TraceabilityOfParts/index.vue b/src/views/ManufacturingCenter/TraceabilityOfParts/index.vue
index 72915b9d..0bcd4211 100644
--- a/src/views/ManufacturingCenter/TraceabilityOfParts/index.vue
+++ b/src/views/ManufacturingCenter/TraceabilityOfParts/index.vue
@@ -1,79 +1,10 @@
 <template>
   <div>
     <el-card>
-      <!--<el-radio-group v-model="radio" @change="changeType">-->
-      <!--<el-radio :label="1">自制件</el-radio>-->
-      <!--<el-radio :label="2">采购部采购</el-radio>-->
-      <!--<el-radio :label="3">制造部采购</el-radio>-->
-      <!--</el-radio-group>-->
-      <span style="display:inline-block;margin-left: 10px">零件图号：</span>
-      <el-autocomplete
-        v-model="searchPick"
-        :fetch-suggestions="querySearch"
-        clearable
-        style="width: 200px;margin-left: 10px;"
-        size="small"
-        class="inline-input"
-        placeholder="请输入零件图号"
-        @select="handleSelect"
-        @clear="clearSelect"
-      />
-      <!--<el-button type="text" @click="show1 = !show1" style="margin-left: 10px">高级查询</el-button>-->
-      <!--<div v-show="show1" style="margin-top: 20px" class="transition-box">-->
-      <!--<span style="display:inline-block;margin-left: 10px">项目名称：</span>-->
-      <!--<el-autocomplete-->
-      <!--v-model="searchCriteria"-->
-      <!--:fetch-suggestions="querySearch"-->
-      <!--clearable-->
-      <!--style="width: 200px;margin-left: 10px;"-->
-      <!--size="small"-->
-      <!--class="inline-input"-->
-      <!--placeholder="请输入零件或物料"-->
-      <!--@clear="clearSelect"-->
-      <!--@select="handleSelect"-->
-      <!--/>-->
-      <!--<span style="display:inline-block;margin-left: 10px">机床图号：</span>-->
-      <!--<el-input-->
-      <!--v-model="input_Mobile"-->
-      <!--:trigger-on-focus="false"-->
-      <!--clearable-->
-      <!--size="small"-->
-      <!--style="width: 200px;margin-right: 10px"-->
-      <!--placeholder="请输入内容"/>-->
-      <!--<span style="display:inline-block;margin-left: 10px">组号：</span>-->
-      <!--<el-input-->
-      <!--v-model="input_Mobile"-->
-      <!--:trigger-on-focus="false"-->
-      <!--clearable-->
-      <!--size="small"-->
-      <!--style="width: 200px;margin-right: 10px"-->
-      <!--placeholder="请输入内容"/>-->
-      <!--<span style="display:inline-block;margin-left: 10px">零件图号：</span>-->
-      <!--<el-input-->
-      <!--v-model="input_Mobile"-->
-      <!--:trigger-on-focus="false"-->
-      <!--clearable-->
-      <!--size="small"-->
-      <!--style="width: 200px;margin-right: 10px"-->
-      <!--placeholder="请输入内容"/>-->
-      <!--</div>-->
       <div>
-        <el-divider content-position="right">零件档案</el-divider>
-        <div class="text">
-          <span style="display:inline-block;margin-left: 10px">零件图号：<el-tag size="small">{{ form.零件图号 }}</el-tag></span>
-          <el-divider direction="vertical"/>
-          <span style="display:inline-block;margin-left: 10px">零件名称：<el-tag size="small">{{ form.零件名称 }}</el-tag></span>
-          <el-divider direction="vertical"/>
-          <span style="display:inline-block;margin-left: 10px">投产数量：<el-tag size="small">{{ form.投产数量 }}</el-tag></span>
-          <el-divider direction="vertical"/>
-          <span style="display:inline-block;margin-left: 10px">所属机床：<el-tag size="small">{{ form.所属机床 }}</el-tag></span>
-          <el-divider direction="vertical"/>
-          <span style="display:inline-block;margin-left: 10px">所属组件：<el-tag size="small">{{ form.所属组件 }}</el-tag></span>
-        </div>
-        <el-divider content-position="right">生命周期</el-divider>
         <div class="text item">
           <el-row>
-            <el-col :span="4">
+            <el-col :span="5">
               <el-timeline style="margin-top: 40px">
                 <el-timeline-item
                   v-for="(activity, index) in activities"
@@ -90,7 +21,7 @@
             <el-col :span="1">
               <div style="width:1px;border:0.1px solid #DCDFE6;float:left;height:450px;"/>
             </el-col>
-            <el-col :span="19" style="margin-top: 30px">
+            <el-col :span="18" style="margin-top: 30px;margin-bottom: 30px">
               <div class="main">
                 <el-table :data="tableData1" :row-class-name="tableRowClassName1" class="table" style="max-height: 830px" highlight-current-row empty-text="   " border>
                   <el-table-column align="center" label="工序" show-overflow-tooltip width="100">
@@ -103,11 +34,6 @@
                       {{ scope.row.工艺名称 }}
                     </template>
                   </el-table-column>
-                  <!--<el-table-column align="center" label="已完数量" show-overflow-tooltip min-width="70">-->
-                  <!--<template slot-scope="scope">-->
-                  <!--{{ scope.row.完成数量 }}-->
-                  <!--</template>-->
-                  <!--</el-table-column>-->
                   <el-table-column align="center" label="投产数" width="100">
                     <template slot-scope="scope">
                       {{ scope.row.批次数量 }}
@@ -137,16 +63,6 @@
               </div>
             </el-col>
           </el-row>
-          <el-divider content-position="right">跳转链接</el-divider>
-          <el-row style="margin-left: 20px">
-            <el-tooltip :open-delay="1000" effect="dark" content="转到零件状态查询模块" placement="top">
-              <el-button size="medium" type="text" @click="toStatusQuery">自制件状态查询</el-button>
-            </el-tooltip>
-            <el-divider direction="vertical"/>
-            <!--<el-tooltip :open-delay="1000" effect="dark" content="转到加工进度查询模块" placement="top">-->
-            <!--<el-button size="medium" type="text" @click="toProcessingStatus">加工进度查询</el-button>-->
-            <!--</el-tooltip>-->
-          </el-row>
         </div>
       </div>
     </el-card>
@@ -154,9 +70,7 @@
 </template>
 
 <script>
-import { SelectPart, SelectProcessingProgress } from '@/api/ManufacturingCenter/TraceabilityOfParts'
-import { gettabledata1 } from '@/api/ManufacturingCenter/ProcessingStatusNew'
-
+import { gettabledata1, getPersons } from '@/api/ManufacturingCenter/StatusQuery'
 export default {
   data() {
     return {
@@ -174,9 +88,6 @@ export default {
       tableData1: [],
       show: true,
       show1: false,
-      // typeA: true,
-      // typeB: false,
-      // typeC: false,
       radio: 1,
       form: {
         零件图号: '请查询',
@@ -188,31 +99,31 @@ export default {
       activities: [{
         id: 3,
         content: '生产计划下达',
-        timestamp: '制造部：计划员',
-        type: '',
-        size: 'large'
-      }, {
-        id: 4,
-        content: '工艺定额',
-        timestamp: '工艺部：工艺员',
+        timestamp: '-：-',
         type: '',
         size: 'large'
       }, {
         id: 6,
+        content: '工艺定额',
+        timestamp: '-：-',
+        type: '',
+        size: 'large'
+      }, {
+        id: 7,
         content: '生产加工',
-        timestamp: '金工车间：操作工',
+        timestamp: '金工车间：-',
         type: '',
         size: 'large'
       }, {
         id: 8,
         content: '入库',
-        timestamp: '金工车间：库管员',
+        timestamp: '-：-',
         type: '',
         size: 'large'
       }, {
         id: 9,
         content: '出库',
-        timestamp: '金工车间：库管员',
+        timestamp: '-：-',
         type: '',
         size: 'large'
       }],
@@ -221,86 +132,6 @@ export default {
     }
   },
   methods: {
-    // changeType() {
-    //   if(this.radio === 1) {
-    //     this.typeA = true
-    //     this.typeB = false
-    //     this.typeC = false
-    //   } else if(this.radio === 2) {
-    //     this.typeA = false
-    //     this.typeB = true
-    //     this.typeC = false
-    //   } else if(this.radio === 3) {
-    //     this.typeA = false
-    //     this.typeB = false
-    //     this.typeC = true
-    //   }
-    // },
-    touchstart: function(e) {
-      var that = this
-      var list = that.sudokus
-      for (var i = 0, len = list.length; i < len; ++i) {
-        if (list[i].id === e) {
-          that.curSelect = i
-        }
-      }
-    }, touchend: function() {
-      var that = this
-      that.curSelect = null
-    },
-    querySearch(queryString, cb) {
-      this.restaurantsPick = []
-      if (this.searchPick !== '' && this.searchPick !== null) {
-        SelectPart(this.searchPick).then(response => {
-          const res = response.data
-          res.forEach(item => {
-            this.restaurantsPick.push({
-              value: item.零件图号,
-              name: item.工艺计划流水号
-            })
-          })
-          return this.restaurantsPick
-        }).then(data => {
-          var restaurants = data
-          var results = queryString ? restaurants.filter(this.createFilterPick(queryString)) : restaurants
-          return results
-        }).then(data => {
-          cb(data)
-        })
-      }
-    },
-    toStatusQuery() {
-      this.$router.push('/ManufacturingCenter/StatusQuery')
-    },
-    toProcessingStatus() {
-      this.$router.push('/ManufacturingCenter/ProcessingStatus')
-    },
-    createFilterPick(queryString) {
-      return (restaurant) => {
-        return (restaurant.value.toLowerCase().indexOf(queryString.toLowerCase()) !== -1)
-      }
-    },
-    clearSelect() {
-      this.active = ''
-      this.active1 = ''
-      this.sudokus = []
-      this.isOut = '请查询'
-      this.outName = '请查询'
-      this.outTime = '请查询'
-      this.confirmationTime = '请查询'
-      this.Cutter = '请查询'
-      this.isMaterials = '请查询'
-      this.materialsType = '请查询'
-      this.form.零件图号 = '请查询'
-      this.form.投产数量 = '请查询'
-      this.form.所属机床 = '请查询'
-      this.form.所属组件 = '请查询'
-      this.form.零件名称 = '请查询'
-      for (let i = 0; i < this.activities.length; i++) {
-        this.activities[i].type = ''
-      }
-      this.show = true
-    },
     // 工序状态变色
     tableRowClassName1({ row, rowIndex }) {
       row.index = rowIndex
@@ -308,54 +139,40 @@ export default {
         return 'CompleteColor'
       }
     },
-    handleSelect(item) {
+    handleSelect(row) {
       this.sudokus = []
-      this.show = false
-      this.active = ''
-      this.active1 = ''
-      this.confirmationTime = '请查询'
-      this.Cutter = '请查询'
-      this.isMaterials = '请查询'
-      this.materialsType = '请查询'
-      this.isOut = '请查询'
-      this.outName = '请查询'
-      this.outTime = '请查询'
+      this.tableData1 = []
       for (let i = 0; i < this.activities.length; i++) {
         this.activities[i].type = ''
       }
-      SelectPart(0, '', 0, '', 0, '', 0, '', 0, '', 0, '', 0, '', '', '', item.name).then(response => {
-        this.form.零件图号 = response.data[0].零件图号
-        this.form.投产数量 = response.data[0].批次数量
-        this.form.所属机床 = response.data[0].机床图号
-        this.form.所属组件 = response.data[0].组号
-        this.form.零件名称 = response.data[0].零件名称
+      getPersons(row.工艺计划流水号).then(response => {
+        response.data[0].投产人 ? response.data[0].投产人 = response.data[0].投产人 : response.data[0].投产人 = '-'
+        response.data[0].投产时间 ? response.data[0].投产时间 = response.data[0].投产时间 : response.data[0].投产时间 = '-'
+        response.data[0].工艺员 ? response.data[0].工艺员 = response.data[0].工艺员 : response.data[0].工艺员 = '-'
+        response.data[0].工艺完成时间 ? response.data[0].工艺完成时间 = response.data[0].工艺完成时间 : response.data[0].工艺完成时间 = '-'
+        response.data[0].操作工 ? response.data[0].操作工 = response.data[0].操作工 : response.data[0].操作工 = '-'
+        response.data[0].入库人 ? response.data[0].入库人 = response.data[0].入库人 : response.data[0].入库人 = '-'
+        response.data[0].入库时间 ? response.data[0].入库时间 = response.data[0].入库时间 : response.data[0].入库时间 = '-'
+        response.data[0].出库人 ? response.data[0].出库人 = response.data[0].出库人 : response.data[0].出库人 = '-'
+        response.data[0].出库时间 ? response.data[0].出库时间 = response.data[0].出库时间 : response.data[0].出库时间 = '-'
+        response.data[0].入库人 === '超级管理员' ? response.data[0].入库人 = '系统' : response.data[0].入库人 = response.data[0].入库人
+        response.data[0].出库人 === '超级管理员' ? response.data[0].出库人 = '系统' : response.data[0].出库人 = response.data[0].出库人
+        this.activities[0].timestamp = response.data[0].投产人 + ':' + response.data[0].投产时间
+        this.activities[1].timestamp = response.data[0].工艺员 + ':' + response.data[0].工艺完成时间
+        this.activities[2].timestamp = '金工车间' + ':' + response.data[0].操作工
+        this.activities[3].timestamp = response.data[0].入库人 + ':' + response.data[0].入库时间
+        this.activities[4].timestamp = response.data[0].出库人 + ':' + response.data[0].出库时间
       })
-      SelectProcessingProgress(item.name).then(response => {
-        for (let i = 0; i < response.data.length; i++) {
-          this.sudokus.push({
-            id: response.data[i].工序顺序,
-            procedure: response.data[i].工艺名称,
-            planningTime: response.data[i].计划日期_短,
-            actualTime: response.data[i].完成日期_短 === null || response.data[i].完成日期_短 === '' ? '未完成' : response.data[i].完成日期_短,
-            name: response.data[i].工序状态 === 4 ? response.data[i].员工姓名 : '未完成',
-            color: response.data[i].进度颜色
-          })
-        }
-      })
-      SelectPart(0, '', 0, '', 0, '', 1, this.searchPick, 0, '', 0, '', 0, '', '', '', '').then(response => {
-        for (let i = 0; i < this.activities.length; i++) {
-          console.log(response.data[0].考核状态.toString(), this.activities[i].id.toString())
-          if (response.data[0].考核状态.toString() === this.activities[i].id.toString()) {
-            for (let j = 0; j <= i; j++) {
-              this.activities[j].type = 'success'
-            }
-            this.activities[i + 1].type = 'warning'
-          }
-        }
-      })
-      this.tableData1 = []
-      gettabledata1(item.name).then(response => {
+      gettabledata1(row.工艺计划流水号).then(response => {
         if (response.data.length !== 0) {
+          for (let i = 0; i < this.activities.length; i++) {
+            if (response.data[0].考核状态.toString() === this.activities[i].id.toString()) {
+              for (let j = 0; j <= i; j++) {
+                this.activities[j].type = 'success'
+              }
+              this.activities[i + 1].type = 'warning'
+            }
+          }
           for (let i = 0; i < response.data.length; i++) {
             this.tableData1.push({
               工艺名称: response.data[i].工艺名称,
diff --git a/src/views/ManufacturingCenter/TraceabilityOfParts/零件追溯备份.vue b/src/views/ManufacturingCenter/TraceabilityOfParts/零件追溯备份.vue
new file mode 100644
index 00000000..72915b9d
--- /dev/null
+++ b/src/views/ManufacturingCenter/TraceabilityOfParts/零件追溯备份.vue
@@ -0,0 +1,445 @@
+<template>
+  <div>
+    <el-card>
+      <!--<el-radio-group v-model="radio" @change="changeType">-->
+      <!--<el-radio :label="1">自制件</el-radio>-->
+      <!--<el-radio :label="2">采购部采购</el-radio>-->
+      <!--<el-radio :label="3">制造部采购</el-radio>-->
+      <!--</el-radio-group>-->
+      <span style="display:inline-block;margin-left: 10px">零件图号：</span>
+      <el-autocomplete
+        v-model="searchPick"
+        :fetch-suggestions="querySearch"
+        clearable
+        style="width: 200px;margin-left: 10px;"
+        size="small"
+        class="inline-input"
+        placeholder="请输入零件图号"
+        @select="handleSelect"
+        @clear="clearSelect"
+      />
+      <!--<el-button type="text" @click="show1 = !show1" style="margin-left: 10px">高级查询</el-button>-->
+      <!--<div v-show="show1" style="margin-top: 20px" class="transition-box">-->
+      <!--<span style="display:inline-block;margin-left: 10px">项目名称：</span>-->
+      <!--<el-autocomplete-->
+      <!--v-model="searchCriteria"-->
+      <!--:fetch-suggestions="querySearch"-->
+      <!--clearable-->
+      <!--style="width: 200px;margin-left: 10px;"-->
+      <!--size="small"-->
+      <!--class="inline-input"-->
+      <!--placeholder="请输入零件或物料"-->
+      <!--@clear="clearSelect"-->
+      <!--@select="handleSelect"-->
+      <!--/>-->
+      <!--<span style="display:inline-block;margin-left: 10px">机床图号：</span>-->
+      <!--<el-input-->
+      <!--v-model="input_Mobile"-->
+      <!--:trigger-on-focus="false"-->
+      <!--clearable-->
+      <!--size="small"-->
+      <!--style="width: 200px;margin-right: 10px"-->
+      <!--placeholder="请输入内容"/>-->
+      <!--<span style="display:inline-block;margin-left: 10px">组号：</span>-->
+      <!--<el-input-->
+      <!--v-model="input_Mobile"-->
+      <!--:trigger-on-focus="false"-->
+      <!--clearable-->
+      <!--size="small"-->
+      <!--style="width: 200px;margin-right: 10px"-->
+      <!--placeholder="请输入内容"/>-->
+      <!--<span style="display:inline-block;margin-left: 10px">零件图号：</span>-->
+      <!--<el-input-->
+      <!--v-model="input_Mobile"-->
+      <!--:trigger-on-focus="false"-->
+      <!--clearable-->
+      <!--size="small"-->
+      <!--style="width: 200px;margin-right: 10px"-->
+      <!--placeholder="请输入内容"/>-->
+      <!--</div>-->
+      <div>
+        <el-divider content-position="right">零件档案</el-divider>
+        <div class="text">
+          <span style="display:inline-block;margin-left: 10px">零件图号：<el-tag size="small">{{ form.零件图号 }}</el-tag></span>
+          <el-divider direction="vertical"/>
+          <span style="display:inline-block;margin-left: 10px">零件名称：<el-tag size="small">{{ form.零件名称 }}</el-tag></span>
+          <el-divider direction="vertical"/>
+          <span style="display:inline-block;margin-left: 10px">投产数量：<el-tag size="small">{{ form.投产数量 }}</el-tag></span>
+          <el-divider direction="vertical"/>
+          <span style="display:inline-block;margin-left: 10px">所属机床：<el-tag size="small">{{ form.所属机床 }}</el-tag></span>
+          <el-divider direction="vertical"/>
+          <span style="display:inline-block;margin-left: 10px">所属组件：<el-tag size="small">{{ form.所属组件 }}</el-tag></span>
+        </div>
+        <el-divider content-position="right">生命周期</el-divider>
+        <div class="text item">
+          <el-row>
+            <el-col :span="4">
+              <el-timeline style="margin-top: 40px">
+                <el-timeline-item
+                  v-for="(activity, index) in activities"
+                  :key="index"
+                  :icon="activity.icon"
+                  :type="activity.type"
+                  :color="activity.color"
+                  :size="activity.size"
+                  :timestamp="activity.timestamp">
+                  {{ activity.content }}
+                </el-timeline-item>
+              </el-timeline>
+            </el-col>
+            <el-col :span="1">
+              <div style="width:1px;border:0.1px solid #DCDFE6;float:left;height:450px;"/>
+            </el-col>
+            <el-col :span="19" style="margin-top: 30px">
+              <div class="main">
+                <el-table :data="tableData1" :row-class-name="tableRowClassName1" class="table" style="max-height: 830px" highlight-current-row empty-text="   " border>
+                  <el-table-column align="center" label="工序" show-overflow-tooltip width="100">
+                    <template slot-scope="scope">
+                      {{ scope.row.工序顺序 }}
+                    </template>
+                  </el-table-column>
+                  <el-table-column align="center" label="工艺名" show-overflow-tooltip min-width="120">
+                    <template slot-scope="scope">
+                      {{ scope.row.工艺名称 }}
+                    </template>
+                  </el-table-column>
+                  <!--<el-table-column align="center" label="已完数量" show-overflow-tooltip min-width="70">-->
+                  <!--<template slot-scope="scope">-->
+                  <!--{{ scope.row.完成数量 }}-->
+                  <!--</template>-->
+                  <!--</el-table-column>-->
+                  <el-table-column align="center" label="投产数" width="100">
+                    <template slot-scope="scope">
+                      {{ scope.row.批次数量 }}
+                    </template>
+                  </el-table-column>
+                  <el-table-column align="center" label="完成数" width="100">
+                    <template slot-scope="scope">
+                      {{ scope.row.完成数量 }}
+                    </template>
+                  </el-table-column>
+                  <el-table-column align="center" label="操作者" show-overflow-tooltip width="120">
+                    <template slot-scope="scope">
+                      {{ scope.row.操作者 }}
+                    </template>
+                  </el-table-column>
+                  <el-table-column align="center" label="加工开始" width="160">
+                    <template slot-scope="scope">
+                      {{ scope.row.加工开始时间 }}
+                    </template>
+                  </el-table-column>
+                  <el-table-column align="center" label="加工结束" width="160">
+                    <template slot-scope="scope">
+                      {{ scope.row.完成日期 }}
+                    </template>
+                  </el-table-column>
+                </el-table>
+              </div>
+            </el-col>
+          </el-row>
+          <el-divider content-position="right">跳转链接</el-divider>
+          <el-row style="margin-left: 20px">
+            <el-tooltip :open-delay="1000" effect="dark" content="转到零件状态查询模块" placement="top">
+              <el-button size="medium" type="text" @click="toStatusQuery">自制件状态查询</el-button>
+            </el-tooltip>
+            <el-divider direction="vertical"/>
+            <!--<el-tooltip :open-delay="1000" effect="dark" content="转到加工进度查询模块" placement="top">-->
+            <!--<el-button size="medium" type="text" @click="toProcessingStatus">加工进度查询</el-button>-->
+            <!--</el-tooltip>-->
+          </el-row>
+        </div>
+      </div>
+    </el-card>
+  </div>
+</template>
+
+<script>
+import { SelectPart, SelectProcessingProgress } from '@/api/ManufacturingCenter/TraceabilityOfParts'
+import { gettabledata1 } from '@/api/ManufacturingCenter/ProcessingStatusNew'
+
+export default {
+  data() {
+    return {
+      isOut: '请查询',
+      outName: '请查询',
+      outTime: '请查询',
+      active: '',
+      active1: '',
+      confirmationTime: '请查询',
+      Cutter: '请查询',
+      isMaterials: '请查询',
+      searchPick: '',
+      materialsType: '请查询',
+      restaurantsPick: [],
+      tableData1: [],
+      show: true,
+      show1: false,
+      // typeA: true,
+      // typeB: false,
+      // typeC: false,
+      radio: 1,
+      form: {
+        零件图号: '请查询',
+        投产数量: '请查询',
+        所属机床: '请查询',
+        所属组件: '请查询',
+        零件名称: '请查询'
+      },
+      activities: [{
+        id: 3,
+        content: '生产计划下达',
+        timestamp: '制造部：计划员',
+        type: '',
+        size: 'large'
+      }, {
+        id: 4,
+        content: '工艺定额',
+        timestamp: '工艺部：工艺员',
+        type: '',
+        size: 'large'
+      }, {
+        id: 6,
+        content: '生产加工',
+        timestamp: '金工车间：操作工',
+        type: '',
+        size: 'large'
+      }, {
+        id: 8,
+        content: '入库',
+        timestamp: '金工车间：库管员',
+        type: '',
+        size: 'large'
+      }, {
+        id: 9,
+        content: '出库',
+        timestamp: '金工车间：库管员',
+        type: '',
+        size: 'large'
+      }],
+      sudokus: [],
+      curSelect: null
+    }
+  },
+  methods: {
+    // changeType() {
+    //   if(this.radio === 1) {
+    //     this.typeA = true
+    //     this.typeB = false
+    //     this.typeC = false
+    //   } else if(this.radio === 2) {
+    //     this.typeA = false
+    //     this.typeB = true
+    //     this.typeC = false
+    //   } else if(this.radio === 3) {
+    //     this.typeA = false
+    //     this.typeB = false
+    //     this.typeC = true
+    //   }
+    // },
+    touchstart: function(e) {
+      var that = this
+      var list = that.sudokus
+      for (var i = 0, len = list.length; i < len; ++i) {
+        if (list[i].id === e) {
+          that.curSelect = i
+        }
+      }
+    }, touchend: function() {
+      var that = this
+      that.curSelect = null
+    },
+    querySearch(queryString, cb) {
+      this.restaurantsPick = []
+      if (this.searchPick !== '' && this.searchPick !== null) {
+        SelectPart(this.searchPick).then(response => {
+          const res = response.data
+          res.forEach(item => {
+            this.restaurantsPick.push({
+              value: item.零件图号,
+              name: item.工艺计划流水号
+            })
+          })
+          return this.restaurantsPick
+        }).then(data => {
+          var restaurants = data
+          var results = queryString ? restaurants.filter(this.createFilterPick(queryString)) : restaurants
+          return results
+        }).then(data => {
+          cb(data)
+        })
+      }
+    },
+    toStatusQuery() {
+      this.$router.push('/ManufacturingCenter/StatusQuery')
+    },
+    toProcessingStatus() {
+      this.$router.push('/ManufacturingCenter/ProcessingStatus')
+    },
+    createFilterPick(queryString) {
+      return (restaurant) => {
+        return (restaurant.value.toLowerCase().indexOf(queryString.toLowerCase()) !== -1)
+      }
+    },
+    clearSelect() {
+      this.active = ''
+      this.active1 = ''
+      this.sudokus = []
+      this.isOut = '请查询'
+      this.outName = '请查询'
+      this.outTime = '请查询'
+      this.confirmationTime = '请查询'
+      this.Cutter = '请查询'
+      this.isMaterials = '请查询'
+      this.materialsType = '请查询'
+      this.form.零件图号 = '请查询'
+      this.form.投产数量 = '请查询'
+      this.form.所属机床 = '请查询'
+      this.form.所属组件 = '请查询'
+      this.form.零件名称 = '请查询'
+      for (let i = 0; i < this.activities.length; i++) {
+        this.activities[i].type = ''
+      }
+      this.show = true
+    },
+    // 工序状态变色
+    tableRowClassName1({ row, rowIndex }) {
+      row.index = rowIndex
+      if (parseInt(row.工序状态) > 3) {
+        return 'CompleteColor'
+      }
+    },
+    handleSelect(item) {
+      this.sudokus = []
+      this.show = false
+      this.active = ''
+      this.active1 = ''
+      this.confirmationTime = '请查询'
+      this.Cutter = '请查询'
+      this.isMaterials = '请查询'
+      this.materialsType = '请查询'
+      this.isOut = '请查询'
+      this.outName = '请查询'
+      this.outTime = '请查询'
+      for (let i = 0; i < this.activities.length; i++) {
+        this.activities[i].type = ''
+      }
+      SelectPart(0, '', 0, '', 0, '', 0, '', 0, '', 0, '', 0, '', '', '', item.name).then(response => {
+        this.form.零件图号 = response.data[0].零件图号
+        this.form.投产数量 = response.data[0].批次数量
+        this.form.所属机床 = response.data[0].机床图号
+        this.form.所属组件 = response.data[0].组号
+        this.form.零件名称 = response.data[0].零件名称
+      })
+      SelectProcessingProgress(item.name).then(response => {
+        for (let i = 0; i < response.data.length; i++) {
+          this.sudokus.push({
+            id: response.data[i].工序顺序,
+            procedure: response.data[i].工艺名称,
+            planningTime: response.data[i].计划日期_短,
+            actualTime: response.data[i].完成日期_短 === null || response.data[i].完成日期_短 === '' ? '未完成' : response.data[i].完成日期_短,
+            name: response.data[i].工序状态 === 4 ? response.data[i].员工姓名 : '未完成',
+            color: response.data[i].进度颜色
+          })
+        }
+      })
+      SelectPart(0, '', 0, '', 0, '', 1, this.searchPick, 0, '', 0, '', 0, '', '', '', '').then(response => {
+        for (let i = 0; i < this.activities.length; i++) {
+          console.log(response.data[0].考核状态.toString(), this.activities[i].id.toString())
+          if (response.data[0].考核状态.toString() === this.activities[i].id.toString()) {
+            for (let j = 0; j <= i; j++) {
+              this.activities[j].type = 'success'
+            }
+            this.activities[i + 1].type = 'warning'
+          }
+        }
+      })
+      this.tableData1 = []
+      gettabledata1(item.name).then(response => {
+        if (response.data.length !== 0) {
+          for (let i = 0; i < response.data.length; i++) {
+            this.tableData1.push({
+              工艺名称: response.data[i].工艺名称,
+              工序顺序: response.data[i].工序顺序,
+              加工开始时间: response.data[i].加工开始时间 ? response.data[i].加工开始时间 : '',
+              完成日期: response.data[i].加工完成时间 ? response.data[i].加工完成时间 : '',
+              操作者: response.data[i].姓名,
+              批次数量: response.data[i].批次数量,
+              工序流水号: response.data[i].工序流水号,
+              完成过程流水号: response.data[i].完成过程流水号,
+              工序状态: response.data[i].工序状态,
+              完成数量: response.data[i].完成数量
+            })
+          }
+        }
+      })
+    }
+  }
+}
+</script>
+
+<style scoped>
+  .el-textarea__inner, .el-radio__inner, .el-input__inner{
+    border: 1px solid #C0C4CC !important
+  }
+  .text{
+    font-size: 14px;
+  }
+  .sudoku_row{
+    height: 120px;
+    padding: 5px;
+    /*overflow-x: scroll;*/
+    display: flex;
+    align-items: center;
+    /*flex-wrap: wrap;*/
+  }
+  .sudoku_item{
+    margin-right: 10px;
+    display: flex;
+    height: 110px;
+    justify-content: center;
+    align-items: center;
+    flex-direction: column;
+    /*padding-top: 10px;*/
+    /*padding-bottom: 10px;*/
+  }
+  .opacity{
+    opacity: 0.4;
+    background: #e5e5e5;
+  }
+  .sudoku_item img{
+    margin-bottom: 3px;
+    display: block;
+  }
+  .main{
+     border: 1px solid  #DCDFE6;
+     width:91.5%;
+     overflow-y: hidden;
+     overflow-x: auto;
+     color: #000;
+     font-size: 16px;
+     height: 430px;
+   }
+  .main p{height:300px;}
+  /*-------滚动条整体样式----*/
+  .main::-webkit-scrollbar {
+    width:8px;
+    height:8px;
+  }
+  /*滚动条里面小方块样式*/
+  .main::-webkit-scrollbar-thumb {
+    border-radius:100px;
+    -webkit-box-shadow:inset 0 0 5px rgba(0,0,0,0.2);
+    background:#DCDFE6;
+  }
+  /*滚动条里面轨道样式*/
+  .main::-webkit-scrollbar-track {
+    -webkit-box-shadow:inset 0 0 5px rgba(0,0,0,0.2);
+    border-radius:0;
+    background:white;
+  }
+</style>
+<style>
+  .CompleteColor{
+    background: #9bd7fc !important;
+  }
+</style>