From 9cb51d2a8db984c62de463db195ff201cd4466e5 Mon Sep 17 00:00:00 2001 From: wxw <Administrator@DESKTOP-5BIMHQ3> Date: 星期三, 28 八月 2024 17:03:23 +0800 Subject: [PATCH] 开发分拣码垛页面 --- Web/src/views/device/sortPallet/index.vue | 153 ++++++++++++++++++++++++++++++++++++++++++++++++++- 1 files changed, 150 insertions(+), 3 deletions(-) diff --git a/Web/src/views/device/sortPallet/index.vue b/Web/src/views/device/sortPallet/index.vue index d4eea89..676a25b 100644 --- a/Web/src/views/device/sortPallet/index.vue +++ b/Web/src/views/device/sortPallet/index.vue @@ -1,16 +1,163 @@ <template> <el-container> - + <div class="card-container"> + <el-card class="other-box-card" v-for="deviceInfo in deviceList" :key="deviceInfo.id"> + <div slot="header" class="linefix"> + <span>{{ deviceInfo.name }}</span> + <div :class="['lineStatus', { 'device-status-0': deviceInfo.status === 0 }, { 'device-status-1': deviceInfo.status === 1 }]"></div> + </div> + <div class="otherValuefix" > + <el-form label-position="left" label-width="90px"> + <el-form-item label="WMS鏄庣粏鍗曞彿"> + <el-input></el-input> + </el-form-item> + <el-form-item label="浠诲姟鍙�"> + <el-input v-model="deviceInfo.taskNumber"></el-input> + </el-form-item> + <el-form-item label="鐗╂枡缂栫爜"> + <el-input></el-input> + </el-form-item> + <el-form-item label="鐗╂枡鍚嶇О"> + <el-input></el-input> + </el-form-item> + <el-form-item label="鍖呰鍚嶇О"> + <el-input></el-input> + </el-form-item> + <el-form-item label="鐘舵��"> + <el-input></el-input> + </el-form-item> + <el-form-item label="鎶撶鍝佺"> + <el-input></el-input> + </el-form-item> + <el-form-item label="DB璁板綍绠辨暟"> + <el-input></el-input> + </el-form-item> + <el-form-item label="鎵樼洏鍙�"> + <el-input></el-input> + </el-form-item> + <el-form-item label="鐮佸灈绠辨暟"> + <el-input></el-input> + </el-form-item> + <el-form-item label="WMS涓嬪彂鏁伴噺"> + <el-input></el-input> + </el-form-item> + </el-form> + </div> + <div class="otherButtonfix"> + <el-form label-position="left"> + <el-form-item> + <el-button type="primary">缁戝畾</el-button> + <el-button>缁撴壒</el-button> + </el-form-item> + </el-form> + </div> + </el-card> + </div> </el-container> </template> <script lang="ts" setup> import { ref, reactive } from 'vue'; - + const deviceList=[ + { + id: 1, + name: '1鍙风爜鍨涙満鍣ㄤ汉', + taskNumber: 'T000001', + taskType: '', + plc: '', + wcs: '', + status: 0 + }, + { + id: 2, + name: '2鍙风爜鍨涙満鍣ㄤ汉', + taskNumber: '', + taskType: '', + plc: '', + wcs: '', + status: 1 + }, + { + id: 3, + name: '3鍙风爜鍨涙満鍣ㄤ汉', + taskNumber: '', + taskType: '', + plc: '', + wcs: '', + status: 0 + },{ + id: 4, + name: '4鍙风爜鍨涙満鍣ㄤ汉', + taskNumber: '', + taskType: '', + plc: '', + wcs: '', + status: 1 + },{ + id: 5, + name: '5鍙风爜鍨涙満鍣ㄤ汉', + taskNumber: '', + taskType: '', + plc: '', + wcs: '', + status: 0 + },{ + id: 6, + name: '6鍙风爜鍨涙満鍣ㄤ汉', + taskNumber: '', + taskType: '', + plc: '', + wcs: '', + status: 0 + } + ] </script> <style scoped> - + .card-container { + display: grid; + grid-template-columns: repeat(6, 1fr); + gap: 10px; + } + .other-box-card { + box-sizing: border-box; + } + .lineStatus{ + position: absolute; + right: 0; + float: right; + height: 20px; + width: 20px; + border-radius: 20px; + background-color: #67C23A; + } + .linefix{ + border-bottom: 1px solid rgb(197, 195, 195); + display: flex; + align-items: center; + height: 40px; + position: relative; + } + .otherValuefix{ + width: 100%; + height: 600px; + padding: 10px; + border-bottom: 1px solid rgb(197, 195, 195); + } + .otherButtonfix{ + width: 100%; + height: 100px; + display: flex; + align-items: center; + justify-content: center; + padding: 0; + } + .device-status-0{ + background-color: #67C23A; + } + .device-status-1{ + background-color: red; + } </style> \ No newline at end of file -- Gitblit v1.8.0