From c540e530dec6de1d3427e264fe864ea9d5a820eb Mon Sep 17 00:00:00 2001
From: icewint <icewint@qq.com>
Date: Mon, 27 May 2024 08:50:44 +0800
Subject: [PATCH] =?UTF-8?q?<add>[important]=E6=B7=BB=E5=8A=A0=E5=A0=86?=
 =?UTF-8?q?=E5=9E=9B=E6=9C=BA=E7=AE=A1=E7=90=86=E5=8A=9F=E8=83=BD?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/axios/stacker.js                          |  12 +-
 src/router/index.js                           |   2 +-
 .../component/stackerData/EditStacker.vue     | 148 ++++++++++++++++++
 .../SocketData.vue                            |   0
 src/view/tab/equipmentManage/StackerData.vue  | 112 ++++++++++++-
 src/view/tab/systemStatus/StackerStatus.vue   |  31 ++--
 6 files changed, 281 insertions(+), 24 deletions(-)
 create mode 100644 src/view/component/stackerData/EditStacker.vue
 rename src/view/tab/{equipmentManage => development}/SocketData.vue (100%)

diff --git a/src/axios/stacker.js b/src/axios/stacker.js
index 5823428..daf2d0e 100644
--- a/src/axios/stacker.js
+++ b/src/axios/stacker.js
@@ -1,8 +1,16 @@
 import axios from '@/axios/base/base.axios';
 
 export default {
-    // 获取所有堆垛机数据
-    getStacker() {
+    // 获取所有堆垛机状态
+    getStackerStatus() {
         return axios.get('/api/wcs/stacker/getStackerStatus')
     },
+    // 获取所有堆垛机数据
+    getStackerData() {
+        return axios.get('/api/wcs/stacker/getStacker')
+    },
+    // 编辑/更新堆垛机信息
+    editStackerData(stackerDataItem) {
+        return axios.post('/api/wcs/stacker/editStacker', stackerDataItem)
+    },
 }
\ No newline at end of file
diff --git a/src/router/index.js b/src/router/index.js
index e3fb41d..6f64cee 100644
--- a/src/router/index.js
+++ b/src/router/index.js
@@ -37,7 +37,7 @@ const routes = [
       { path: 'plcData', name: 'plcData', component:() => import('@/view/tab/development/PLCData.vue') }, // PLC管理
       { path: 'dbData', name: 'dbData', component:() => import('@/view/tab/development/DbData.vue') }, // PLC通讯管理（DB块）
       { path: 'configData', name: 'configData', component:() => import('@/view/tab/development/ConfigData.vue') }, // 系统配置
-      { path: 'socketData', name: 'socketData', component:() => import('../view/tab/equipmentManage/SocketData.vue') }, // Socket通讯管理
+      { path: 'socketData', name: 'socketData', component:() => import('../view/tab/development/SocketData.vue') }, // Socket通讯管理
       { path: 'menuData', name: 'menuData', component:() => import('@/view/tab/development/MenuData.vue') }, // 菜单管理
 
     ]
diff --git a/src/view/component/stackerData/EditStacker.vue b/src/view/component/stackerData/EditStacker.vue
new file mode 100644
index 0000000..cade84c
--- /dev/null
+++ b/src/view/component/stackerData/EditStacker.vue
@@ -0,0 +1,148 @@
+<template>
+  <div>
+    <el-dialog
+        title="添加/修改 堆垛机数据"
+        :model-value="modelValue"
+        @close="() => $emit('update:modelValue', false)">
+      <el-form
+          label-position="left"
+          label-width="200px"
+          :model="stackerDataItem"
+      >
+        <el-form-item label="堆垛机编号（唯一）：" required>
+          <el-input v-model="stackerDataItem.stackerId" placeholder="不能相同与其他编号，不然视作更新那个编号的数据"/>
+        </el-form-item>
+        <el-form-item label="堆垛机名称：">
+          <el-input v-model="stackerDataItem.stackerName"/>
+        </el-form-item>
+        <el-form-item label="堆垛机状态：">
+          <el-switch
+              v-model="stackerDataItem.stackerStatus"
+              inline-prompt
+              active-text="启用"
+              inactive-text="停用"
+              active-value="1"
+              inactive-value="0"
+          />
+        </el-form-item>
+        <el-form-item label="货叉状态：">
+          <el-input v-model="stackerDataItem.forkStatus"/>
+        </el-form-item>
+        <el-form-item label="对应的PLC编号：">
+          <el-input v-model="stackerDataItem.actionPlc"/>
+        </el-form-item>
+        <el-form-item label="入库站台：">
+          <el-input v-model="stackerDataItem.inStand"/>
+        </el-form-item>
+        <el-form-item label="出库站台：">
+          <el-input v-model="stackerDataItem.outStand"/>
+        </el-form-item>
+        <el-form-item label="备注信息：">
+          <el-input v-model="stackerDataItem.remark"/>
+        </el-form-item>
+      </el-form>
+      <template #footer>
+        <div>
+          <el-button type="primary" @click="addOrUpdate">添加/更新</el-button>
+          <el-button type="danger" @click="$emit('update:modelValue', false)">关闭窗口</el-button>
+        </div>
+      </template>
+    </el-dialog>
+  </div>
+</template>
+
+<script>
+// import  《组件名称》  from '《组件路径》 ';
+import stackerApi from "@/axios/stacker";
+import {ElMessage, ElMessageBox} from "element-plus";
+
+export default {
+  // import 引入的组件需要注入到对象中才能使用
+  components: {},
+  props: ['modelValue', 'stackerDataItem'],
+  emits: ['update:modelValue'],
+  data() {
+    // 这里存放数据
+    return {}
+  },
+  // 计算属性 类似于 data 概念
+  computed: {},
+  // 监控 data 中的数据变化
+  watch: {},
+  // 方法集合
+  methods: {
+    addOrUpdate() {
+      if(this.stackerDataItem.stackerId === '' || this.stackerDataItem.stackerId === undefined || this.stackerDataItem.stackerId === null){
+        ElMessage({
+          message: '请输入 堆垛机编号，此项是必填的',
+          type: 'warning',
+        })
+        return
+      }
+      ElMessageBox.confirm(
+        `您确定要执行添加/更新 堆垛机编号 为 ${this.stackerDataItem.stackerId} 的堆垛机信息?`,
+        '数据变更警告',
+        {
+          confirmButtonText: '添加/更新',
+          cancelButtonText: '取消',
+          type: 'warning',
+        })
+        .then(() => {
+          stackerApi.editStackerData(this.stackerDataItem).then(response=>{
+            const responseData = response.data
+            if(responseData.code === 0){
+              ElMessage({
+                message: '添加/更新成功',
+                type: 'success',
+              })
+              this.$emit('update:modelValue', false)
+            } else {
+              ElMessage({
+                message: '服务器返回失败：' + responseData.msg,
+                type: 'warning',
+              })
+            }
+          }).catch(ex=>{
+            ElMessage({
+              message: '请求服务器失败：' + ex,
+              type: 'error',
+            })
+          })
+        })
+        .catch(() => {
+        })
+    }
+  },
+  // 组合式 API
+  setup() {
+  },
+  // 创建之前
+  beforeCreate() {
+  },
+  // 创建完成(可以访问 this 实例)
+  created() {
+  },
+  // 生命周期 - 挂载之前
+  beforeMount() {
+  },
+  // 生命周期 - 挂载完成（可以访问 DOM 元素）
+  mounted() {
+  },
+  // 更新之前
+  beforeUpdate() {
+  },
+  // 更新之后
+  updated() {
+  },
+  // 销毁之前
+  beforeUnmount() {
+  },
+  // 销毁完成
+  unmounted() {
+  }
+}
+</script>
+
+<style scoped>
+
+</style>
\ No newline at end of file
diff --git a/src/view/tab/equipmentManage/SocketData.vue b/src/view/tab/development/SocketData.vue
similarity index 100%
rename from src/view/tab/equipmentManage/SocketData.vue
rename to src/view/tab/development/SocketData.vue
diff --git a/src/view/tab/equipmentManage/StackerData.vue b/src/view/tab/equipmentManage/StackerData.vue
index 6b24fba..6d9944e 100644
--- a/src/view/tab/equipmentManage/StackerData.vue
+++ b/src/view/tab/equipmentManage/StackerData.vue
@@ -1,28 +1,134 @@
 <template>
 <!--  堆垛机管理-->
   <div>
+    <el-row>
+      <el-button type="primary" style="margin-left: 0.5rem" @click="refresh">查询/刷新</el-button>
+      <el-button type="success" style="margin-left: 0.5rem" @click="add">添加</el-button>
+    </el-row>
+    <el-row style="width: calc(100vw - 270px)">
+      <h5>堆垛机信息</h5>
+      <el-table :data="stackerInfo" border stripe style="width: 100%;" max-height="calc(100vh - 350px)">
+        <el-table-column fixed prop="stackerId" label="堆垛机编号" width="100px" align="center" show-overflow-tooltip/>
+        <el-table-column fixed prop="stackerName" label="堆垛机名称" width="250px" align="center" show-overflow-tooltip/>
+        <el-table-column prop="stackerStatus" label="堆垛机状态（系统）" align="center" width="180px">
+          <template #default="scope">
+            <el-tag class="ml-2" :type=formatterOnOrOffEnum(scope.row.stackerStatus).type>
+              {{formatterOnOrOffEnum(scope.row.stackerStatus).label}}</el-tag>
+          </template>
+        </el-table-column>
+        <el-table-column prop="forkStatus" label="货叉状态（系统）" align="center" width="150px"/>
+        <el-table-column prop="actionPlc" label="对应的PLC编号" align="center" width="150px"/>
+        <el-table-column prop="inStand" label="入库站台" align="center"/>
+        <el-table-column prop="outStand" label="出库站台" align="center"/>
+        <el-table-column prop="remark" label="备注" align="center"/>
+        <el-table-column fixed="right" label="操作" align="center" width="80">
+          <template #default="scope">
+            <el-button-group class="ml-4">
+              <el-tooltip content="编辑" placement="top" effect="light">
+                <el-button type="primary" size="small"  @click="edit(scope.row)">
+                  <el-icon><Edit/></el-icon>
+                </el-button>
+              </el-tooltip>
+            </el-button-group>
+          </template>
+        </el-table-column>
+      </el-table>
+    </el-row>
+<!--    添加或者编辑堆垛机窗口-->
+    <EditStacker v-model="showAddOrEdit" v-model:stacker-data-item="stackerDataItem"></EditStacker>
 
   </div>
 </template>
 
 <script>
 // import  《组件名称》  from '《组件路径》 ';
+import stackerApi from "@/axios/stacker";
+import {formatterOnOrOffEnum} from "@/enum/base/on.off.enum";
+import {Edit} from "@element-plus/icons-vue";
+import {ElLoading, ElMessage} from "element-plus";
+import EditStacker from "@/view/component/stackerData/EditStacker.vue";
 
 export default {
   // import 引入的组件需要注入到对象中才能使用
-  components: {},
+  components: {EditStacker, Edit},
   props: [],
   emits: [],
   data() {
     // 这里存放数据
-    return {}
+    return {
+      stackerInfo: [],
+      // 传入到添加/编辑框里面的参数
+      stackerDataItem: {},
+      // 是否展示添加或者编辑堆垛机窗口
+      showAddOrEdit: false
+    }
   },
   // 计算属性 类似于 data 概念
   computed: {},
   // 监控 data 中的数据变化
   watch: {},
   // 方法集合
-  methods: {},
+  methods: {
+    formatterOnOrOffEnum,
+    // 查询/刷新 堆垛机信息
+    refresh() {
+      const loading = ElLoading.service({
+        lock: true,
+        text: '加载中...',
+      })
+      this.stackerInfo = []
+      stackerApi.getStackerData().then(res=>{
+        const responseData = res.data
+        if(responseData.code === 0){
+          ElMessage({
+            message: '查询成功',
+            type: 'success',
+          })
+          this.stackerInfo = Object.freeze(responseData["returnData"])
+        }else{
+          ElMessage({
+            message: '服务器返回失败：' + responseData.msg,
+            type: 'warning',
+          })
+        }
+        loading.close()
+      }).catch(ex=>{
+        ElMessage({
+          message: '请求服务器失败：' + ex,
+          type: 'error',
+        })
+        loading.close()
+      })
+    },
+    // 打开编辑框
+    edit(row) {
+      this.stackerDataItem = {
+        stackerId: row.stackerId,
+        stackerName: row.stackerName,
+        stackerStatus: row.stackerStatus.toString(),
+        forkStatus: row.forkStatus,
+        actionPlc: row.actionPlc,
+        inStand: row.inStand,
+        outStand: row.outStand,
+        remark: row.remark
+      }
+      this.showAddOrEdit = true
+    },
+    // 添加
+    add() {
+      this.stackerDataItem = {
+        stackerId: '',
+        stackerName: '',
+        stackerStatus: '0',
+        forkStatus: '0',
+        actionPlc: '',
+        inStand: '',
+        outStand: '',
+        remark: ''
+      }
+      this.showAddOrEdit = true
+    }
+  },
   // 组合式 API
   setup() {
   },
diff --git a/src/view/tab/systemStatus/StackerStatus.vue b/src/view/tab/systemStatus/StackerStatus.vue
index b58dcc7..341607b 100644
--- a/src/view/tab/systemStatus/StackerStatus.vue
+++ b/src/view/tab/systemStatus/StackerStatus.vue
@@ -35,17 +35,17 @@
         <el-table-column prop="depth" label="深" align="center" width="60px"/>
         <el-table-column prop="code" label="料箱码" align="center"  width="150px"/>
         <el-table-column prop="errCode" label="报警编号" align="center" width="130px" show-overflow-tooltip/>
-        <el-table-column fixed="right" label="操作" align="center" width="80">
-          <template #default="scope">
-            <el-button-group class="ml-4">
-              <el-tooltip content="查询" placement="top" effect="light">
-                <el-button type="primary" size="small"  @click="search(scope.row)">
-                  <el-icon><Search/></el-icon>
-                </el-button>
-              </el-tooltip>
-            </el-button-group>
-          </template>
-        </el-table-column>
+<!--        <el-table-column fixed="right" label="操作" align="center" width="80">-->
+<!--          <template #default="scope">-->
+<!--            <el-button-group class="ml-4">-->
+<!--              <el-tooltip content="查询" placement="top" effect="light">-->
+<!--                <el-button type="primary" size="small"  @click="search(scope.row)">-->
+<!--                  <el-icon><Search/></el-icon>-->
+<!--                </el-button>-->
+<!--              </el-tooltip>-->
+<!--            </el-button-group>-->
+<!--          </template>-->
+<!--        </el-table-column>-->
       </el-table>
     </el-row>
   </div>
@@ -57,7 +57,7 @@ import stacker from "@/axios/stacker";
 import {ElLoading, ElMessage} from "element-plus";
 import {formatterOnOrOffEnum} from "@/enum/base/on.off.enum";
 import {formatterStackerControlModel} from "@/enum/stacker/stackerControlModelEnum";
-import {formatterStackerStatus} from "../../../enum/stacker/stackerStatusEnum";
+import {formatterStackerStatus} from "@/enum/stacker/stackerStatusEnum";
 
 export default {
   // import 引入的组件需要注入到对象中才能使用
@@ -87,7 +87,7 @@ export default {
         text: '加载中...',
       })
       this.stackerInfo = []
-      stacker.getStacker().then(res=>{
+      stacker.getStackerStatus().then(res=>{
         const responseData = res.data
         if(responseData.code === 0){
           ElMessage({
@@ -109,11 +109,6 @@ export default {
         })
         loading.close()
       })
-
-    },
-    // 查询堆垛机状态
-    search(row){
-
     }
   },
   // 组合式 API