.env.development

@@ -5,6 +5,7 @@ VUE_APP_TITLE = 海亮工艺追溯系统
 ENV = 'development'
 
 # 海亮工艺追溯系统/开发环境
+#VUE_APP_BASE_API = 'http://172.20.2.8/prod-api'
 VUE_APP_BASE_API = 'http://localhost:8080'
 
 # 路由懒加载

package.json

@@ -55,6 +55,7 @@
     "vue": "2.6.12",
     "vue-count-to": "1.0.13",
     "vue-cropper": "0.5.5",
+    "vue-markdown": "^2.2.4",
     "vue-meta": "2.4.0",
     "vue-router": "3.4.9",
     "vuedraggable": "2.24.3",
@@ -71,6 +72,7 @@
     "connect": "3.6.6",
     "eslint": "^7.15.0",
     "eslint-plugin-vue": "7.2.0",
+    "github-markdown-css": "^5.4.0",
     "lint-staged": "10.5.3",
     "runjs": "4.4.2",
     "sass": "1.32.13",

src/App.vue

@@ -17,13 +17,87 @@ export default {
       titleTemplate: title => {
         return title ? `${title} - ${process.env.VUE_APP_TITLE}` : process.env.VUE_APP_TITLE
       },
-      websocket:null
+      websocket:null,
+      interval:null,
+      index:null,
+      heartbeat : null,
+      retryStatus:false
     }
   },
+  methods: {
+    initWebSocket() {
+      console.log("正在进行连接设备日志反馈WS")
+      let url = process.env.VUE_APP_BASE_API.replace("https://", "wss://").replace("http://", "ws://") + "/websocket/device/"+ this.index;
+      this.websocket = new WebSocket(url);
+      this.websocket.onopen = this.websocketonopen;
+      this.websocket.onmessage = this.websocketonmessage;
+      this.websocket.onerror = this.websocketonerror;
+      // this.websocket.
+      this.websocket.onclose = this.websocketclose;
+    },
+    // 连接成功后调用
+    websocketonopen: function () {
+      console.log("WebSocket连接成功");
+      clearInterval(this.interval)
+      const websocket = this.websocket;
+      this.retryStatus =false;
+      this.heartbeat = setInterval(function () {
+          websocket.send("T")
+      }, 5000);
+    },
+    // 发生错误时调用
+    websocketonerror: function (e) {
+      console.log("WebSocket连接发生错误");
+      clearInterval(this.heartbeat)
+      if (!this.retryStatus){
+        this.interval = setInterval(()=>{
+          this.initWebSocket()
+        },5000)
+        this.retryStatus = true;
+      }
+
+    },
+    websocketonmessage: function (e) {
+      const notify =  JSON.parse(e.data)
+      if (notify.type=="notify"){
+        if (notify.content.status=="1"){
+          this.$notify.info({
+            title: notify.content.deviceName,
+            message: notify.content.content,
+            showClose: false
+          });
+        }else {
+          this.$notify.error({
+            title:  notify.content.deviceName,
+            message: notify.content.content,
+            duration: 0
+          });
+        }
+      }
+    },
+    // 关闭连接时调用
+    websocketclose: function (e) {
+      console.log("connection closed (" + e.code + ")");
+      clearInterval(this.heartbeat)
+      if (!this.retryStatus){
+        this.interval = setInterval(()=>{
+          this.initWebSocket()
+        },5000)
+        this.retryStatus = true;
+      }
+    },
+  },
+  created() {
+    this.index = Math.round(Math.random() * 100000000)
+    setTimeout(()=>{
+      this.initWebSocket()
+    },5000)
+  }
 };
 </script>
 <style scoped>
 #app .theme-picker {
   display: none;
 }
+
 </style>

src/api/trace/device.js

@@ -8,7 +8,7 @@ export function getDeviceList() {
   })
 }
 
-//获取设备列表
+//获取设备日志列表
 export function getDeviceLog(data) {
   return request({
     url: '/device/log/list',

src/api/trace/process.js

@@ -44,3 +44,38 @@ export function getRetroactiveHistorys(data) {
     params: data
   })
 }
+
+
+//绑定托盘号
+export function bindLotNo(data) {
+  return request({
+    url: '/retroactive/now/bindLotNo',
+    method: 'get',
+    data: data
+  })
+}
+
+/**
+ * 删除
+ * @param data
+ * @returns {AxiosPromise}
+ */
+export function del(data) {
+  return request({
+    url: '/retroactive/now/del',
+    method: 'delete',
+    params: data
+  })
+}
+
+/**
+ * 删除
+ * @param data
+ * @returns {AxiosPromise}
+ */
+export function delList() {
+  return request({
+    url: '/retroactive/history/delList',
+    method: 'get',
+  })
+}

src/layout/components/processTableView/index.vue

@@ -11,7 +11,7 @@
       <el-table-column label="产线" prop="productionLine" width="80" align="center"/>
       <el-table-column label="批次号" prop="batchNo" width="150" :show-overflow-tooltip="true" align="center"/>
       <el-table-column label="托盘号" prop="lotNo" width="100" :show-overflow-tooltip="true" align="center"/>
-      <el-table-column label="重量" prop="weight" width="120" :show-overflow-tooltip="true" align="center"/>
+      <el-table-column label="重量(KG)" prop="weight" width="120" :show-overflow-tooltip="true" align="center"/>
       <el-table-column label="生产状态" align="center" width="150">
         <template slot-scope="scope">
           <dict-tag :options="dict.type.process" :value="scope.row.status"/>
@@ -22,11 +22,30 @@
           <span>{{ parseTime(scope.row.updateTime) }}</span>
         </template>
       </el-table-column>
-      <el-table-column label="备注" align="center" prop="remake" width="180"/>
+      <el-table-column label="备注" align="center" prop="remark" fixed-width/>
+      <el-table-column
+        label="操作"
+        align="center"
+        width="160"
+        class-name="small-padding fixed-width"
+      >
+        <template slot-scope="scope">
+          <el-button
+            size="mini"
+            type="text"
+            icon="el-icon-delete"
+            @click="handleDelete(scope.row)"
+          >删除
+          </el-button>
+        </template>
+      </el-table-column>
     </el-table>
   </div>
 </template>
 <script>
+
+import {del} from "@/api/trace/process";
+
 export default {
   name: "ProcessTable",
   dicts: ['process'],
@@ -40,6 +59,37 @@ export default {
       default: true
     }
   },
+  methods: {
+    handleDelete(row) {
+      this.$prompt('请输入删除批次为："' + row.batchNo + '"数据的原因', "提示", {
+        confirmButtonText: "确定",
+        cancelButtonText: "取消",
+        showCancelButton: true,
+        beforeClose: (action, instance, done) => {
+          if (action === 'confirm') {
+            instance.confirmButtonLoading = true;
+            instance.confirmButtonText = '删除中...';
+            if (instance.inputValue == null || instance.inputValue.trim().length == 0) {
+              this.$modal.msgWarning("删除原因不能为空！");
+            }else {
+              del({batchNo: row.batchNo, delRemark: instance.inputValue}).then(response => {
+                  this.$modal.msgSuccess("删除成功！");
+                  this.$emit("queryTable");
+                  done();
+                }
+              )
+            }
+            instance.confirmButtonLoading = false;
+            instance.confirmButtonText = '确认';
+          } else {
+            done();
+          }
+        }
+      }).then((value) => {
+      }).catch(() => {
+      });
+    }
+  }
 }
 </script>
 <style scoped lang="scss">

src/router/index.js

@@ -100,6 +100,19 @@ export const constantRoutes = [
       }
     ]
   },
+  {
+    path: '/trace/retroactive',
+    component: Layout,
+    hidden: true,
+    children: [
+      {
+        path: 'delLog',
+        component: () => import('@/views/trace/process/log.vue'),
+        name: 'log',
+        meta: { title: '删除记录' }
+      }
+    ]
+  },
 ]
 
 // 动态路由，基于用户权限动态去加载

src/store/modules/user.js

@@ -1,5 +1,5 @@
-import { login, logout, getInfo } from '@/api/login'
-import { getToken, setToken, removeToken } from '@/utils/auth'
+import {getInfo, login, logout} from '@/api/login'
+import {getToken, removeToken, setToken} from '@/utils/auth'
 
 const user = {
   state: {

src/views/index.vue

@@ -1,64 +1,27 @@
 <template>
-  <div class="app-container home">
-  </div>
+<!--  <div id="my-markdown" class="markdown-body">-->
+<!--    <vue-markdown :source="md"></vue-markdown>-->
+<!--  </div>-->
 </template>
 
 <script>
+// import VueMarkdown from "vue-markdown";
+
 export default {
   name: "Index",
   data() {
     return {
+      md:''
     };
   },
-  methods: {
-    initWebSocket() {
-      let name = this.$store.state.user.name
-      let url = process.env.VUE_APP_BASE_API.replace("https://", "wss://").replace("http://", "ws://") + "/websocket/device/" + name;
-      this.websocket = new WebSocket(url);
-      this.websocket.addEventListener('beforeSend', function (event) {
-        event.target.setRequestHeader('Authorization', 'Bearer ' + this.$store.state.user.token);
-      });
-      this.websocket.onopen = this.websocketonopen;
-      this.websocket.onerror = this.websocketonerror;
-      this.websocket.onmessage = this.websocketonmessage;
-      this.websocket.onclose = this.websocketclose;
-    },
-    // 连接成功后调用
-    websocketonopen: function () {
-      console.log("WebSocket连接成功");
-    },
-    // 发生错误时调用
-    websocketonerror: function (e) {
-      console.log("WebSocket连接发生错误");
-    },
-    websocketonmessage: function (e) {
-      const  notify =  JSON.parse(e.data)
-      console.log(e.data)
-      if (notify.status=="1"){
-        this.$notify.info({
-          title: notify.deviceId,
-          message: notify.content,
-          showClose: false
-        });
-      }else {
-        this.$notify.error({
-          title:  notify.deviceId,
-          message: notify.content,
-          duration: 0
-        });
-      }
-    },
-    // 关闭连接时调用
-    websocketclose: function (e) {
-      console.log("connection closed (" + e.code + ")");
-    }
-  },
   created() {
-    this.initWebSocket()
+    // this.md = require('/public/tutorialFiles/海亮安徽工艺追溯平台.md');
   }
 };
+
 </script>
 
-<style scoped lang="scss">
+<style>
+
 </style>
 

src/views/trace/device/index.vue

@@ -130,9 +130,7 @@ export default {
   mounted() {
     this.getList()
     const vue = this
-    this.interval = setInterval(function () {
-      vue.getList()
-    }, 5000);
+    this.interval = z
   },
   beforeDestroy() {
       clearInterval(this.interval)

src/views/trace/device/log.vue

@@ -0,0 +1,209 @@
+<template>
+  <div class="app-container">
+    <el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch">
+      <el-form-item label="设备名" prop="deviceName">
+        <el-select
+          v-model="queryParams.deviceId"
+          placeholder="设备名"
+          clearable
+          style="width: 240px"
+        >
+          <el-option
+            v-for="dict in deviceList"
+            :key="dict.value"
+            :label="dict.abbreviation"
+            :value="dict.deviceId"
+          />
+        </el-select>
+      </el-form-item>
+      <el-form-item label="日志类型" prop="status">
+        <el-select
+          v-model="queryParams.status"
+          placeholder="日志类型"
+          clearable
+          style="width: 240px"
+        >
+          <el-option
+            v-for="dict in deviceLogType"
+            :key="dict.value"
+            :label="dict.label"
+            :value="dict.value"
+          />
+        </el-select>
+      </el-form-item>
+      <el-form-item label="创建时间">
+        <el-date-picker
+          v-model="dateRange"
+          style="width: 240px"
+          value-format="yyyy-MM-dd "
+          type="daterange"
+          range-separator="-"
+          start-placeholder="开始日期"
+          end-placeholder="结束日期"
+        ></el-date-picker>
+      </el-form-item>
+      <el-form-item>
+        <el-button type="primary" icon="el-icon-search" size="mini" @click="getList">搜索</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="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>
+    <div>
+      <el-table v-loading="deviceLogList" :data="logList"  @selection-change="handleSelectionChange">
+        <el-table-column type="selection" width="55" align="center"/>
+        <el-table-column label="日志编号" prop="deviceLogId" :show-overflow-tooltip="true" align="center"/>
+        <el-table-column label="设备编号" prop="deviceId" align="center"/>
+        <el-table-column label="设备名称" prop="deviceName" :show-overflow-tooltip="true" align="center"/>
+        <el-table-column label="类型" prop="status" width="80">
+          <template slot-scope="scope">
+            <el-tag v-if="scope.row.status==1 ">信息</el-tag>
+            <el-tag v-else type="danger">报警</el-tag>
+          </template>
+        </el-table-column>
+        <el-table-column label="创建时间" prop="createTime" :show-overflow-tooltip="true" align="center"/>
+        <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-view"
+              @click="handleView(scope.row)"
+              v-hasPermi="['monitor:job:query']"
+            >详细
+            </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"
+      />
+    </div>
+    <el-dialog title="日志详细" :visible.sync="open" width="700px" append-to-body>
+      <el-form ref="form" :model="form" label-width="100px" size="mini">
+        <el-row>
+          <el-col :span="12">
+            <el-form-item label="日志序号：">{{ form.deviceLogId }}</el-form-item>
+            <el-form-item label="设备编号：">{{ form.deviceId }}</el-form-item>
+          </el-col>
+          <el-col :span="12">
+            <el-form-item label="设备名称：">{{ form.deviceName }}</el-form-item>
+            <el-form-item label="时间：">{{ form.createTime }}</el-form-item>
+          </el-col>
+          <el-col :span="24">
+            <el-form-item label="日志类型：">
+              <div v-if="form.status == 1">信息</div>
+              <div v-else-if="form.status == 2">报警</div>
+            </el-form-item>
+          </el-col>
+          <el-col :span="24">
+            <el-form-item label="日志内容：">{{ form.content }}</el-form-item>
+          </el-col>
+        </el-row>
+      </el-form>
+      <div slot="footer" class="dialog-footer">
+        <el-button @click="open = false">关 闭</el-button>
+      </div>
+    </el-dialog>
+  </div>
+</template>
+
+<script>
+
+
+import {getDeviceList, getDeviceLog} from "../../../api/trace/device";
+
+export default {
+  name: "log",
+  data() {
+    return {
+      total: 0,
+      queryParams: {
+        pageNum: 1,
+        pageSize: 10,
+      },
+      logList: [],
+      deviceLogList: true,
+      dateRange: [],
+      showSearch: true,
+      deviceLogType: [
+        {value: 1, label: '信息'},
+        {value: 2, label: '报警'}
+      ],
+      deviceList: [],
+      form: {},
+      open: false,
+      ids:[],
+      // 非单个禁用
+      single: true,
+    }
+  },
+  methods: {
+    getList() {
+      this.deviceLogList = true;
+      let dateRange = Array.isArray(this.dateRange) ? this.dateRange : [];
+      if (dateRange.length>0){
+        this.queryParams.beginTime = dateRange[0]
+        this.queryParams.endTime = dateRange[1]
+      }
+      getDeviceLog(this.queryParams).then(response => {
+        this.logList = response.rows
+        this.total = response.total
+        this.deviceLogList = false
+      })
+    },
+    handleExport() {
+      if (this.ids.length > 0) {
+        this.download('device/log/exportByIds', {
+          ids: this.ids.join(",")
+        }, `设备日志_${new Date().getTime()}.xlsx`)
+      } else {
+        this.download('/device/log/export', {
+          ...this.queryParams
+        }, `设备日志_${new Date().getTime()}.xlsx`)
+      }
+    },
+    resetQuery() {
+      this.queryParams =  {
+        pageNum: 1,
+        pageSize: 10,
+      }
+      this.dateRange = [];
+    },
+    handleView(row) {
+      this.open = true;
+      this.form = row;
+    },
+    handleSelectionChange(selection) {
+      this.ids = selection.map(item => item.deviceLogId)
+      this.single = selection.length != 1
+      this.multiple = !selection.length
+    }
+  },
+  mounted() {
+    this.getList()
+    getDeviceList().then(response => {
+      this.deviceList = response.data
+    })
+  }
+}
+</script>
+<style scoped lang="scss">
+
+</style>

src/views/trace/process/index.vue

@@ -1,7 +1,7 @@
 <template>
   <div class="app-container">
     <el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch">
-      <el-form-item label="追溯编号" >
+      <el-form-item label="追溯编号">
         <el-input
           v-model="queryParams.retroactiveId"
           placeholder="请输入追溯编号"
@@ -10,7 +10,7 @@
           @keyup.enter.native="handleQuery"
         />
       </el-form-item>
-      <el-form-item label="产线" >
+      <el-form-item label="产线">
         <el-input
           v-model="queryParams.productionLine"
           placeholder="请输入产线"
@@ -19,7 +19,7 @@
           @keyup.enter.native="handleQuery"
         />
       </el-form-item>
-      <el-form-item label="批次号" >
+      <el-form-item label="批次号">
         <el-input
           v-model="queryParams.batchNo"
           placeholder="请输入批次号"
@@ -28,7 +28,7 @@
           @keyup.enter.native="handleQuery"
         />
       </el-form-item>
-      <el-form-item label="托盘号" >
+      <el-form-item label="托盘号">
         <el-input
           v-model="queryParams.lotNo"
           placeholder="请输入托盘号"
@@ -67,13 +67,34 @@
           size="mini"
           @click="handleExport"
           v-hasPermi="['system:role:export']"
-        >导出</el-button>
+        >导出
+        </el-button>
+      </el-col>
+<!--      <el-col :span="1.5">-->
+<!--        <el-button-->
+<!--          type="info"-->
+<!--          plain-->
+<!--          icon="el-icon-edit"-->
+<!--          size="mini"-->
+<!--          @click="handleEdit"-->
+<!--        >绑定托盘号-->
+<!--        </el-button>-->
+<!--      </el-col>-->
+      <el-col :span="1.5">
+        <el-button
+          type="info"
+          plain
+          icon="el-icon-s-operation"
+          size="mini"
+          @click="handleDelLog"
+        >查看删除记录
+        </el-button>
       </el-col>
       <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
     </el-row>
 
     <el-table v-loading="loading" :data="retroactiveList" @selection-change="handleSelectionChange">
-      <el-table-column type="selection" width="55" align="center" />
+      <el-table-column type="selection" width="55" align="center"/>
       <el-table-column label="追溯编号" prop="retroactiveId" width="180" :show-overflow-tooltip="true" align="center">
         <template slot-scope="scope">
           <router-link :to="'/trace/process-info/index/' + scope.row.retroactiveId" class="link-type">
@@ -81,11 +102,11 @@
           </router-link>
         </template>
       </el-table-column>
-      <el-table-column label="产线" prop="productionLine"  width="80"  align="center"/>
-      <el-table-column label="批次号" prop="batchNo"  width="150" :show-overflow-tooltip="true"  align="center"/>
+      <el-table-column label="产线" prop="productionLine" width="80" align="center"/>
+      <el-table-column label="批次号" prop="batchNo" width="150" :show-overflow-tooltip="true" align="center"/>
       <el-table-column label="托盘号" prop="lotNo" width="100" :show-overflow-tooltip="true" align="center"/>
-      <el-table-column label="重量" prop="weight" width="120" :show-overflow-tooltip="true" align="center" />
-      <el-table-column label="生产状态" align="center" width="150" >
+      <el-table-column label="重量(KG)" prop="weight" width="120" :show-overflow-tooltip="true" align="center"/>
+      <el-table-column label="生产状态" align="center" width="150">
         <template slot-scope="scope">
           <dict-tag :options="dict.type.process" :value="scope.row.status"/>
         </template>
@@ -95,7 +116,7 @@
           <span>{{ parseTime(scope.row.createTime) }}</span>
         </template>
       </el-table-column>
-      <el-table-column label="备注" align="center" prop="remake" width="180"/>
+      <el-table-column label="备注" align="center" prop="remark" fixed-width/>
 
     </el-table>
 
@@ -107,13 +128,33 @@
       @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="batchNo">
+          <el-autocomplete
+            style="width: 100%"
+            v-model="form.batchNo"
+            :fetch-suggestions="querySearchAsync"
+            placeholder="请输入批次号"
+            @select="handleSelect"
+          ></el-autocomplete>
+        </el-form-item>
+        <el-form-item label="托盘号" prop="lotNo">
+          <el-input v-model="form.lotNo" placeholder="请输入托盘号"/>
+        </el-form-item>
+      </el-form>
+      <div slot="footer" class="dialog-footer">
+        <el-button type="primary" @click="submitForm">确 定</el-button>
+        <el-button @click="cancel">取 消</el-button>
+      </div>
+    </el-dialog>
   </div>
 </template>
 <script>
 
-import {getRetroactiveHsitoryList} from "@/api/trace/process";
+import {bindLotNo, getRetroactiveHsitoryList, getRetroactiveNowList} from "@/api/trace/process";
 
-export default{
+export default {
   name: "index",
   dicts: ['process'],
   data() {
@@ -149,32 +190,42 @@ export default{
         batchNo: undefined,
         lotNo: undefined,
         productionProcess: undefined,
-        retroactiveId:undefined
-      }
+        retroactiveId: undefined
+      },
+      form: {},
+      rules: {
+        batchNo: [
+          {required: true, message: "批次号不能为空", trigger: "blur"}
+        ],
+        lotNo: [
+          {required: true, message: "托盘号不能为空", trigger: "blur"}
+        ],
+      },
+      retroactiveNows: []
     };
   },
   created() {
     this.getList()
   },
-  methods:{
-    handleQuery(){
+  methods: {
+    handleQuery() {
       this.getList()
     },
-    resetQuery(){
-      this.queryParams ={
+    resetQuery() {
+      this.queryParams = {
         pageNum: 1,
         pageSize: 10,
         productionLine: undefined,
         batchNo: undefined,
         lotNo: undefined,
         productionProcess: undefined,
-        retroactiveId:undefined
+        retroactiveId: undefined
       }
       this.getList()
     },
-    getList(){
+    getList() {
       this.loading = true
-      getRetroactiveHsitoryList(this.queryParams).then(response=>{
+      getRetroactiveHsitoryList(this.queryParams).then(response => {
         this.retroactiveList = response.rows
         this.loading = false
         this.total = response.total;
@@ -183,19 +234,61 @@ export default{
     // 多选框选中数据
     handleSelectionChange(selection) {
       this.ids = selection.map(item => item.historyId)
-      this.single = selection.length!=1
+      this.single = selection.length != 1
       this.multiple = !selection.length
     },
-    handleExport(){
-      if (this.ids.length>0){
+    handleExport() {
+      if (this.ids.length > 0) {
         this.download('retroactive/history/exportByIds', {
-          ids:this.ids.join(",")
+          ids: this.ids.join(",")
         }, `铜管追溯_${new Date().getTime()}.xlsx`)
-      }else {
+      } else {
         this.download('retroactive/history/export', {
           ...this.queryParams
         }, `铜管追溯_${new Date().getTime()}.xlsx`)
       }
+    },
+    handleEdit() {
+      this.open = true;
+      this.form = {};
+      getRetroactiveNowList({inStatus: "4"}).then(response => {
+        this.retroactiveNows = response.rows.map(item => {
+          let i = {value: item.batchNo}
+          return i
+        })
+      })
+    },
+    cancel() {
+      this.open = false;
+    },
+    submitForm() {
+      this.$refs["form"].validate(valid => {
+        if (valid) {
+          bindLotNo(this.form).then(response=>{
+            this.$modal.msgSuccess("绑定成功！");
+            this.open = false;
+            this.getList();
+          })
+        }
+      })
+    },
+    querySearchAsync(queryString, cb) {
+      var retroactiveNows = this.retroactiveNows;
+      var results = queryString ? retroactiveNows.value.filter(this.createStateFilter(queryString)) : retroactiveNows;
+
+      clearTimeout(this.timeout);
+      this.timeout = setTimeout(() => {
+        cb(results);
+      }, 1000 * Math.random());
+    },
+    createStateFilter(queryString) {
+        return (this.form.batchNo.toLowerCase().indexOf(queryString.toLowerCase()) === 0);
+    },
+    handleSelect(item) {
+      console.log(item);
+    },
+    handleDelLog(){
+        this.$router.push('/trace/retroactive/delLog')
     }
   }
 }

src/views/trace/process/info.vue

@@ -4,9 +4,8 @@
       <el-descriptions title="铜管基本信息" :column="3" border>
         <el-descriptions-item label="追溯编号">{{ retroactiveInfo.retroactiveId }}</el-descriptions-item>
         <el-descriptions-item label="产线">{{ retroactiveInfo.productionLine }}</el-descriptions-item>
-        <el-descriptions-item label="托盘号">{{ retroactiveInfo.lotNo }}</el-descriptions-item>
         <el-descriptions-item label="批次号">{{ retroactiveInfo.batchNo }}</el-descriptions-item>
-        <el-descriptions-item label="重量">{{ retroactiveInfo.weight }}</el-descriptions-item>
+        <el-descriptions-item label="重量(KG)">{{ retroactiveInfo.weight }}</el-descriptions-item>
         <el-descriptions-item label="生产状态">
           <template>
             <dict-tag :options="dict.type.process" :value="retroactiveInfo.status"/>
@@ -19,15 +18,15 @@
         <template slot="description">
           <el-descriptions :column="2" border style="margin:10px 0 10px 0">
             <el-descriptions-item label="称重完成时间">{{
-                this.retroactiveHisttoyrList[0].createTime
+                this.retroactiveHisttoyrMap['1'][0].createTime
               }}
             </el-descriptions-item>
-            <el-descriptions-item v-if="retroactiveInfo.status>0" v-show="true" label="至下个工序完成经历时间">
+            <el-descriptions-item v-if="retroactiveInfo.status>1 && retroactiveHisttoyrMap['2'] !=null" label="至下个工序完成经历时间">
               <span style="color: #3A71A8"
-                    v-text="parseTimeInterval(this.retroactiveHisttoyrList[0].createTime,this.retroactiveHisttoyrList[1].createTime)"/>
+                    v-text="parseTimeInterval(this.retroactiveHisttoyrMap['1'][0].createTime,this.retroactiveHisttoyrMap['2'][0].createTime)"/>
             </el-descriptions-item>
             <el-descriptions-item label="备注">{{
-                this.retroactiveHisttoyrList[0].remark
+                this.retroactiveHisttoyrMap['1'][0].remark
               }}
             </el-descriptions-item>
           </el-descriptions>
@@ -35,16 +34,16 @@
       </el-step>
       <el-step title="倒角工序">
         <template slot="description">
-          <el-descriptions v-if="retroactiveInfo.status>=1" :column="2" border style="margin:10px 0 10px 0">
+          <el-descriptions v-if="retroactiveHisttoyrMap['2']" :column="2" border style="margin:10px 0 10px 0">
             <el-descriptions-item label="倒角完成时间">
-              {{ this.retroactiveHisttoyrList[1].createTime }}
+              {{this.retroactiveHisttoyrMap['2'][0].createTime }}
             </el-descriptions-item>
-            <el-descriptions-item v-if="retroactiveInfo.status>1" v-show="true" label="至下个工序完成经历时间">
+            <el-descriptions-item v-if="retroactiveInfo.status>2 && retroactiveHisttoyrMap['3'] !=null" label="至下个工序完成经历时间">
               <span style="color: #3A71A8"
-                    v-text="parseTimeInterval(this.retroactiveHisttoyrList[1].createTime,this.retroactiveHisttoyrList[2].createTime)"/>
+                    v-text="parseTimeInterval(this.retroactiveHisttoyrMap['2'][0].createTime,this.retroactiveHisttoyrMap['3'][0].createTime)"/>
             </el-descriptions-item>
             <el-descriptions-item label="备注">{{
-                this.retroactiveHisttoyrList[1].remark
+                this.retroactiveHisttoyrMap['2'][0].remark
               }}
             </el-descriptions-item>
           </el-descriptions>
@@ -52,16 +51,16 @@
       </el-step>
       <el-step title="铣面工序">
         <template slot="description">
-          <el-descriptions v-if="retroactiveInfo.status>=2" :column="3" border style="margin:10px 0 10px 0">
+          <el-descriptions v-if="retroactiveHisttoyrMap['3']" :column="3" border style="margin:10px 0 10px 0">
             <el-descriptions-item label="铣面完成时间">
-              {{ this.retroactiveHisttoyrList[2].createTime }}
+              {{ this.retroactiveHisttoyrMap['3'][0].createTime }}
             </el-descriptions-item>
-            <el-descriptions-item v-if="retroactiveInfo.status>2" v-show="true" label="至下个工序完成经历时间">
+            <el-descriptions-item v-if="retroactiveInfo.status>3 && retroactiveHisttoyrMap['4'] !=null" label="至下个工序完成经历时间">
               <span style="color: #3A71A8"
-                    v-text="parseTimeInterval(this.retroactiveHisttoyrList[2].createTime,this.retroactiveHisttoyrList[3].createTime)"/>
+                    v-text="parseTimeInterval(this.retroactiveHisttoyrMap['3'][0].createTime,this.retroactiveHisttoyrMap['4'][0].createTime)"/>
             </el-descriptions-item>
             <el-descriptions-item label="备注">{{
-                this.retroactiveHisttoyrList[2].remark
+                this.retroactiveHisttoyrMap['3'][0].remark
               }}
             </el-descriptions-item>
           </el-descriptions>
@@ -69,73 +68,73 @@
       </el-step>
       <el-step title="轧制工序">
         <template slot="description">
-          <el-descriptions v-if="retroactiveInfo.status>=3" :column="2" border style="margin:10px 0 10px 0">
+          <el-descriptions v-if="retroactiveHisttoyrMap['4']" :column="2" border style="margin:10px 0 10px 0">
             <el-descriptions-item label="轧制完成时间">
-              {{ this.retroactiveHisttoyrList[3].createTime }}
+              {{ this.retroactiveHisttoyrMap['4'][0].createTime }}
             </el-descriptions-item>
-            <el-descriptions-item v-if="retroactiveInfo.status>3" v-show="true" label="至下个工序完成经历时间">
+            <el-descriptions-item v-if="retroactiveInfo.status>4 && retroactiveHisttoyrMap['5'] !=null" label="至下个工序完成经历时间">
               <span style="color: #3A71A8"
-                    v-text="parseTimeInterval(this.retroactiveHisttoyrList[3].createTime,this.retroactiveHisttoyrList[4].createTime)"/>
+                    v-text="parseTimeInterval(this.retroactiveHisttoyrMap['4'][0].createTime,this.retroactiveHisttoyrMap['5'][0].createTime)"/>
             </el-descriptions-item>
             <el-descriptions-item label="备注">{{
-                this.retroactiveHisttoyrList[3].remark
+                this.retroactiveHisttoyrMap['4'][0].remark
               }}
             </el-descriptions-item>
           </el-descriptions>
         </template>
       </el-step>
       <el-step title="大散盘工序">
-        <template slot="description">
-          <el-descriptions v-if="retroactiveInfo.status>=4" :column="2" border style="margin:10px 0 10px 0">
-            <el-descriptions-item label="大散下料时间">
-              {{ this.retroactiveHisttoyrList[4].createTime }}
-            </el-descriptions-item>
-            <el-descriptions-item label="设备号">
-              {{ this.retroactiveHisttoyrList[4].deviceId }}
-            </el-descriptions-item>
-            <el-descriptions-item v-if="retroactiveInfo.status>4" v-show="true" label="至下个工序完成经历时间">
-              <span style="color: #3A71A8"
-                    v-text="parseTimeInterval(this.retroactiveHisttoyrList[4].createTime,this.retroactiveHisttoyrList[5].createTime)"/>
-            </el-descriptions-item>
-            <el-descriptions-item label="备注">{{
-                this.retroactiveHisttoyrList[4].remark
-              }}
-            </el-descriptions-item>
-          </el-descriptions>
+        <template slot="description" >
+          <el-table :data="retroactiveHisttoyrMap['5']"  v-if="retroactiveHisttoyrMap['5']">
+            <el-table-column label="序号" type="index" align="center"/>
+            <el-table-column label="读码设备" prop="deviceId" :show-overflow-tooltip="true" align="center"/>
+            <el-table-column label="大散盘产出设备编号" prop="sanPanDevice" :show-overflow-tooltip="true" align="center"/>
+            <el-table-column label="托盘号" prop="lotNo" :show-overflow-tooltip="true" align="center"/>
+            <el-table-column label="大散下料时间" prop="createTime" :show-overflow-tooltip="true" align="center"/>
+            <el-table-column label="至下个工序完成经历时间" align="center" prop="createTime">
+              <template slot-scope="scope">
+                   <span style="color: #3A71A8"
+                         v-text="parseTimeInterval(scope.row.createTime,getNextTime(retroactiveHisttoyrMap['6'],scope.row.lotNo))"/>
+              </template>
+            </el-table-column>
+            <el-table-column label="备注" prop="remark" :show-overflow-tooltip="true" align="center"/>
+          </el-table>
         </template>
       </el-step>
       <el-step title="退货工序">
         <template slot="description">
-          <el-descriptions v-if="retroactiveInfo.status>=5" :column="2" border style="margin:10px 0 10px 0">
-            <el-descriptions-item label="退火上料时间">
-              {{ this.retroactiveHisttoyrList[5].createTime }}
-            </el-descriptions-item>
-            <el-descriptions-item v-if="retroactiveInfo.status>5" v-show="true" label="至下个工序完成经历时间">
-              <span style="color: #3A71A8"
-                    v-text="parseTimeInterval(this.retroactiveHisttoyrList[5].createTime,this.retroactiveHisttoyrList[6].createTime)"/>
-            </el-descriptions-item>
-            <el-descriptions-item label="备注">{{
-                this.retroactiveHisttoyrList[5].remark
-              }}
-            </el-descriptions-item>
-          </el-descriptions>
+          <el-table :data="retroactiveHisttoyrMap['6']"  v-if="retroactiveHisttoyrMap['6']">
+            <el-table-column label="序号" type="index" align="center"/>
+            <el-table-column label="托盘号" prop="lotNo" :show-overflow-tooltip="true" align="center"/>
+            <el-table-column label="机组号" prop="uniuCode" :show-overflow-tooltip="true" align="center"/>
+            <el-table-column label="料架号" prop="shelfNumber" :show-overflow-tooltip="true" align="center"/>
+            <el-table-column label="料架列" prop="shelfNumber" :show-overflow-tooltip="true" align="center"/>
+            <el-table-column label="料架层" prop="numberOfLayers" :show-overflow-tooltip="true" align="center"/>
+            <el-table-column label="退火上料时间" prop="createTime" :show-overflow-tooltip="true" align="center"/>
+            <el-table-column label="至下个工序完成经历时间" align="center" prop="createTime">
+              <template slot-scope="scope">
+                   <span style="color: #3A71A8"
+                         v-text="parseTimeInterval(scope.row.createTime,getNextTime(retroactiveHisttoyrMap['7'],scope.row.lotNo))"/>
+              </template>
+            </el-table-column>
+            <el-table-column label="备注" prop="remark" :show-overflow-tooltip="true" align="center"/>
+          </el-table>
         </template>
       </el-step>
       <el-step title="生产完成">
         <template slot="description">
-          <el-descriptions v-if="retroactiveInfo.status=7" :column="2" border style="margin:10px 0 10px 0">
-            <el-descriptions-item label="退火下料时间">
-              {{ this.retroactiveHisttoyrList[6].createTime }}
-            </el-descriptions-item>
-            <el-descriptions-item label="生产总耗时">
-              <span style="color: #3A71A8"
-                    v-text="parseTimeInterval(this.retroactiveHisttoyrList[0].createTime,this.retroactiveHisttoyrList[6].createTime)"/>
-            </el-descriptions-item>
-            <el-descriptions-item label="备注">{{
-                this.retroactiveHisttoyrList[6].remark
-              }}
-            </el-descriptions-item>
-          </el-descriptions>
+          <el-table :data="retroactiveHisttoyrMap['7']" v-if="retroactiveHisttoyrMap['7']">
+            <el-table-column label="序号" type="index" align="center"/>
+            <el-table-column label="托盘号" prop="lotNo" :show-overflow-tooltip="true" align="center"/>
+            <el-table-column label="退火下料时间" prop="createTime" :show-overflow-tooltip="true" align="center"/>
+            <el-table-column label="生产完成总耗时" align="center" prop="createTime" >
+              <template slot-scope="scope">
+                   <span style="color: #3A71A8"
+                         v-text="parseTimeInterval(this.retroactiveHisttoyrMap['1'][0].createTime,scope.row.createTime)"/>
+              </template>
+            </el-table-column>
+            <el-table-column label="备注" prop="remark" :show-overflow-tooltip="true" align="center"/>
+          </el-table>
         </template>
       </el-step>
     </el-steps>
@@ -151,8 +150,10 @@ export default {
   data() {
     return {
       retroactiveId: null,
-      retroactiveInfo: undefined,
-      retroactiveHisttoyrList: [],
+      retroactiveInfo: {
+        status:0,
+      },
+      retroactiveHisttoyrMap: {},
       poorProductionTime: [],
       open: false
     }
@@ -163,10 +164,10 @@ export default {
       getRetroactiveNowInfo({retroactiveId: this.retroactiveId}).then(response1 => {
         this.retroactiveInfo = response1.data
         getRetroactiveHistoryInfo({retroactiveId: this.retroactiveId}).then(response2 => {
-          this.retroactiveHisttoyrList = response2.data
-          if (this.retroactiveInfo == null) {
-            this.retroactiveInfo = this.retroactiveHisttoyrList[0]
-            this.retroactiveInfo.lotNo = this.retroactiveHisttoyrList[4].lotNo
+          this.retroactiveHisttoyrMap = eval(response2.data);
+          if (this.retroactiveInfo == null || this.retroactiveInfo==undefined) {
+            this.retroactiveInfo = this.retroactiveHisttoyrMap['1']
+            this.retroactiveInfo.lotNo = this.retroactiveHisttoyrMap['4'].lotNo
             this.retroactiveInfo.status = 7
           } else {
             this.retroactiveInfo.status = parseInt(this.retroactiveInfo.status)
@@ -177,6 +178,9 @@ export default {
 
     },
     parseTimeInterval(time1, time2) {
+      if (time1==null ||time2==null){
+        return '缺少数据!';
+      }
       var stime = new Date(time1).getTime();
       var etime = new Date(time2).getTime();
       var usedTime = etime - stime;  //两个时间戳相差的毫秒数
@@ -191,8 +195,20 @@ export default {
       //var time = days;
       return time
     },
+    getNextTime(next,lotNo){
+      if (!next){
+        return null
+      }
+      let time = null;
+      next.forEach(item=>{
+        if (item.lotNo === lotNo){
+          time = item.createTime
+        }
+      })
+      return time;
+    }
   },
-  created() {
+  mounted() {
     this.retroactiveId = this.$route.params.retroactiveId
     this.getInfo()
   },

src/views/trace/process/log.vue

@@ -0,0 +1,66 @@
+<template>
+  <div>
+    <el-table v-loading="delTabableloading" :data="delList">
+      <el-table-column label="追溯编号" prop="retroactiveId" width="180" :show-overflow-tooltip="true" align="center"/>
+      <el-table-column label="产线" prop="productionLine" width="80" align="center"/>
+      <el-table-column label="批次号" prop="batchNo" width="150" :show-overflow-tooltip="true" align="center"/>
+      <el-table-column label="托盘号" prop="lotNo" width="100" :show-overflow-tooltip="true" align="center"/>
+      <el-table-column label="重量(KG)" prop="weight" width="120" :show-overflow-tooltip="true" align="center"/>
+      <el-table-column label="生产状态" align="center" width="150">
+        <template slot-scope="scope">
+          <dict-tag :options="dict.type.process" :value="scope.row.status"/>
+        </template>
+      </el-table-column>
+      <el-table-column label="目前工艺到达时间" align="center" prop="createTime" width="180">
+        <template slot-scope="scope">
+          <span>{{ parseTime(scope.row.updateTime) }}</span>
+        </template>
+      </el-table-column>
+      <el-table-column label="备注" align="center" prop="remake" fixed-width/>
+      <el-table-column label="删除原因" align="center" prop="delRemark" fixed-width/>
+      <el-table-column label="操作人" align="center" prop="updateBy" fixed-width/>
+    </el-table>
+
+    <pagination
+      v-show="deltotal>0"
+      :total="deltotal"
+      :page.sync="delParams.pageNum"
+      :limit.sync="delParams.pageSize"
+      @pagination="getDelList"
+    />
+  </div>
+</template>
+
+<script>
+
+import {delList} from "@/api/trace/process";
+
+export default {
+  name: "log",
+  dicts: ['process'],
+  data() {
+    return {
+      deltotal: 0,
+      delParams: {},
+      delList: [],
+      delTable: false,
+      delTabableloading: true,
+    }
+  },
+  methods: {
+    getDelList() {
+      this.delTabableloading = true;
+      delList().then(response => {
+        this.delList = response.data
+        this.delTabableloading = false
+      })
+    }
+  },
+  mounted(){
+    this.getDelList()
+  }
+}
+</script>
+<style scoped lang="scss">
+
+</style>

src/views/trace/process/view.vue

@@ -12,25 +12,25 @@
       <div>
         <el-tabs :value="activeName" @tab-click="tabClick" :stretch="true">
           <el-tab-pane label="生产中" name="all">
-            <process-table :loading="showTable" :retroactive-list="allList"/>
+            <process-table :loading="showTable" @queryTable="getList" :retroactive-list="allList"/>
           </el-tab-pane>
           <el-tab-pane label="倒角工序" name="daoJiao">
-            <process-table :loading="showTable" :retroactive-list="DaojiaoList"/>
+            <process-table :loading="showTable" @queryTable="getList"  :retroactive-list="DaojiaoList"/>
           </el-tab-pane>
           <el-tab-pane label="铣面工序" name="xiMian">
-            <process-table :loading="showTable" :retroactive-list="xiMianList"/>
+            <process-table :loading="showTable" @queryTable="getList"  :retroactive-list="xiMianList"/>
           </el-tab-pane>
           <el-tab-pane label="轧制工序" name="zhaZhi">
-            <process-table :loading="showTable" :retroactive-list="zhaZhiList"/>
+            <process-table :loading="showTable" @queryTable="getList"  :retroactive-list="zhaZhiList"/>
           </el-tab-pane>
           <el-tab-pane label="大散盘工序" name="daSanPan">
-            <process-table :loading="showTable" :retroactive-list="daSanPanList"/>
+            <process-table :loading="showTable" @queryTable="getList"  :retroactive-list="daSanPanList"/>
           </el-tab-pane>
           <el-tab-pane label="退火工序" name="tuiHuo">
-            <process-table :loading="showTable" :retroactive-list="tuiHuoList"/>
+            <process-table :loading="showTable" @queryTable="getList"  :retroactive-list="tuiHuoList"/>
           </el-tab-pane>
           <el-tab-pane label="完成生产" name="finish">
-            <process-table :loading="showTable" :retroactive-list="completeProductionList"/>
+            <process-table :loading="showTable" @queryTable="getList"  :retroactive-list="completeProductionList"/>
           </el-tab-pane>
         </el-tabs>
       </div>
@@ -60,11 +60,16 @@ export default {
         pageNum: 1,
         pageSize: 1000,
       },
-      showTable: true
+      showTable: true,
+      tabName:null,
     }
   },
   methods: {
+    getList(){
+      this.tabClick({name:this.tabName},null)
+    },
     tabClick(tab, event) {
+      this.tabName = tab.name;
       this.showTable = true
       if (tab.name == "all") {
         getRetroactiveNowList(this.queryParams).then(response => {
@@ -80,18 +85,18 @@ export default {
           this.processNum = response.total
         })
       }
-      if (tab.name == "zhaZhi") {
+      if (tab.name == "xiMian") {
         let params = {...this.queryParams, inStatus: "3"}
         getRetroactiveNowList(params).then(response => {
-          this.zhaZhiList = response.rows
+          this.xiMianList = response.rows
           this.showTable = false
           this.processNum = response.total
         })
       }
-      if (tab.name == "xiMian") {
+      if (tab.name == "zhaZhi") {
         let params = {...this.queryParams, inStatus: "4"}
         getRetroactiveNowList(params).then(response => {
-          this.xiMianList = response.rows
+          this.zhaZhiList = response.rows
           this.showTable = false
           this.processNum = response.total
         })
@@ -99,7 +104,7 @@ export default {
       if (tab.name == "daSanPan") {
         let params = {...this.queryParams, inStatus: "5"}
         getRetroactiveNowList(params).then(response => {
-          this.DaojiaoList = response.rows
+          this.daSanPanList = response.rows
           this.showTable = false
           this.processNum = response.total
         })
@@ -123,7 +128,6 @@ export default {
     }
   },
   mounted() {
-    this.showTable = true
     getRetroactiveNowList(this.queryParams).then(response => {
       this.allList = response.rows
       this.showTable = false