| | |
| | | <template>
|
| | | <div class="app-container">
|
| | | <el-card style="flex: 1; margin-left: 10px; " :loading="loading">
|
| | | <div slot="header" class="clearfix" style="display: flex; align-items: center;">
|
| | | <div class="app-container">
|
| | | <el-card style="flex: 1; margin-left: 10px" :loading="loading">
|
| | | <div
|
| | | slot="header"
|
| | | class="clearfix"
|
| | | style="display: flex; align-items: center"
|
| | | >
|
| | | <!-- 左侧按钮组 -->
|
| | | <div>
|
| | | <el-button type="success" size="mini" @click="storage()"
|
| | | >原片仓储详情</el-button
|
| | | >
|
| | | <el-button type="success" size="mini" @click="handleInbound()"
|
| | | >入库</el-button
|
| | | >
|
| | | <el-button type="success" size="mini">吊装位入库</el-button>
|
| | | </div>
|
| | |
|
| | | <!-- 左侧按钮组 -->
|
| | | <div >
|
| | | <el-button type="success" size="mini" @click="storage()">原片仓储详情</el-button>
|
| | | <el-button type="success" size="mini" @click="handleInbound()">入库</el-button>
|
| | | <el-button type="success" size="mini" >吊装位入库</el-button>
|
| | | |
| | | </div>
|
| | | <!-- 右侧选择框 -->
|
| | | <el-form-item style="margin-top: 15px; width: 150px">
|
| | | <el-select v-model="formData2.dzw" placeholder="请选择吊装位">
|
| | | <el-option label="吊装位1" value="吊装位1"></el-option>
|
| | | <el-option label="吊装位2" value="吊装位2"></el-option>
|
| | | <!-- 根据实际情况添加更多选项 -->
|
| | | </el-select>
|
| | | </el-form-item>
|
| | | </div>
|
| | | <el-dialog v-model="Hidden" top="10vh" width="80%">
|
| | | <el-table
|
| | | :data="tableData"
|
| | | v-model="dialogVisible3"
|
| | | style="width: 98%; height: 200px"
|
| | | @selection-change="handleSelectionChange"
|
| | | :header-cell-style="{ background: '#F2F3F5', color: '#1D2129' }"
|
| | | ref="table"
|
| | | empty-text="No Data"
|
| | | >
|
| | | <el-table-column prop="number" label="库位号"></el-table-column>
|
| | | <el-table-column prop="rawType" label="类型"></el-table-column>
|
| | | <el-table-column prop="rawWidth" label="长度(mm)"></el-table-column>
|
| | | <el-table-column prop="rawHeight" label="高度(mm)"></el-table-column>
|
| | | <el-table-column
|
| | | prop="rawThickness"
|
| | | label="厚度(mm)"
|
| | | ></el-table-column>
|
| | | <el-table-column prop="pieces" label="数量"></el-table-column>
|
| | | <el-table-column prop="createTime" label="入库时间"></el-table-column>
|
| | | <el-table-column prop="batchId" label="批次号"></el-table-column>
|
| | |
|
| | | <!-- 右侧选择框 -->
|
| | | <el-form-item style="margin-top: 15px; width: 150px;">
|
| | | <el-select v-model="formData2.dzw" placeholder="请选择吊装位">
|
| | | <el-option label="吊装位1" value="吊装位1"></el-option>
|
| | | <el-option label="吊装位2" value="吊装位2"></el-option>
|
| | | <!-- 根据实际情况添加更多选项 -->
|
| | | </el-select>
|
| | | </el-form-item>
|
| | | <el-table-column
|
| | | align="center"
|
| | | label="料架状态"
|
| | | min-width="80"
|
| | | prop="enableState"
|
| | | >
|
| | | <template #default="scope">
|
| | | <el-tag
|
| | | :type="getTagType(scope.row.enableState)"
|
| | | @click="toggleStatus(scope.row)"
|
| | | >
|
| | | {{ scope.row.enableState === 1 ? "启用" : "未启用" }}
|
| | | </el-tag>
|
| | | </template>
|
| | | </el-table-column>
|
| | |
|
| | | </div>
|
| | | <el-dialog v-model="Hidden" top="10vh" width="80%" >
|
| | | <!-- 操作列 -->
|
| | | <el-table-column label="操作" width="250">
|
| | | <template #default="{ row }">
|
| | | <el-button
|
| | | type="primary"
|
| | | size="mini"
|
| | | @click="edithandleRowClick(row)"
|
| | | >修改</el-button
|
| | | >
|
| | | <el-button type="danger" size="mini" @click="handleDelete(row)"
|
| | | >删除</el-button
|
| | | >
|
| | | <el-button type="warning" size="mini" @click="handleCheckout(row)"
|
| | | >出库</el-button
|
| | | >
|
| | | <!-- <el-button type="success" size="mini" @click="addglass()">添加原片</el-button> -->
|
| | | </template>
|
| | | </el-table-column>
|
| | | </el-table>
|
| | | <el-pagination
|
| | | v-if="totalItems > 0"
|
| | | background
|
| | | layout="prev, pager, next"
|
| | | :total="totalItems"
|
| | | :page-size="pageSize"
|
| | | @current-change="handleCurrentChange"
|
| | | ></el-pagination>
|
| | | </el-dialog>
|
| | |
|
| | | <el-table
|
| | | :data="tableData" v-model="dialogVisible3"
|
| | | |
| | | style="width: 98%; height: 200px"
|
| | | :data="tasktableData"
|
| | | style="width: 98%; height: 150px"
|
| | | @selection-change="handleSelectionChange"
|
| | | :header-cell-style="{ background: '#F2F3F5', color: '#1D2129' }"
|
| | | ref="table"
|
| | | |
| | | empty-text="No Data"
|
| | | >
|
| | | |
| | | <el-table-column prop="location" label="库位号"></el-table-column>
|
| | | <el-table-column prop="type" label="类型"></el-table-column>
|
| | | <el-table-column prop="length" label="长度(mm)"></el-table-column>
|
| | | <el-table-column prop="height" label="高度(mm)"></el-table-column>
|
| | | <el-table-column prop="thickness" label="厚度(mm)"></el-table-column>
|
| | | <el-table-column prop="quantity" label="数量"></el-table-column>
|
| | | <el-table-column prop="entry_time" label="入库时间"></el-table-column>
|
| | | <el-table-column prop="batchnumber" label="批次号"></el-table-column>
|
| | | |
| | | <template #header>
|
| | | <div style="display: flex; align-items: center">
|
| | | <span style="font-size: 16px; font-weight: bold; margin-right: 20px"
|
| | | >任务列表</span
|
| | | >
|
| | | </div>
|
| | | </template>
|
| | | <el-table-column prop="id" label="Glassid"></el-table-column>
|
| | | <el-table-column
|
| | | align="center"
|
| | | label="料架状态"
|
| | | min-width="80"
|
| | | prop="shelf_status"
|
| | | >
|
| | | <template #default="scope">
|
| | | <el-tag :type="getTagType(scope.row.shelf_status)" @click="toggleStatus(scope.row)">
|
| | | {{ scope.row.shelf_status === 1 ? '启用' : '未启用' }}
|
| | | </el-tag>
|
| | | </template>
|
| | | </el-table-column>
|
| | | prop="taskType"
|
| | | label="任务描述"
|
| | | width="250"
|
| | | :formatter="formatTaskType"
|
| | | ></el-table-column>
|
| | | <el-table-column
|
| | | prop="rawThickness"
|
| | | label="玻璃厚度"
|
| | | ></el-table-column>
|
| | | <el-table-column prop="color" label="玻璃膜系"></el-table-column>
|
| | | <el-table-column prop="startTime" label="创建时间"></el-table-column>
|
| | |
|
| | | <!-- 操作列 -->
|
| | | <el-table-column label="操作" width="250">
|
| | | <template #default="{ row }">
|
| | | <el-button type="primary" size="mini" @click="edithandleRowClick(row)">修改</el-button>
|
| | | <el-button type="danger" size="mini" @click="handleDelete(row)">删除</el-button>
|
| | | <el-button type="warning" size="mini" @click="handleCheckout(row)">出库</el-button>
|
| | | <!-- <el-button type="success" size="mini" @click="addglass()">添加原片</el-button> -->
|
| | | <el-table-column
|
| | | align="center"
|
| | | label="任务状态"
|
| | | min-width="80"
|
| | | prop="taskState"
|
| | | >
|
| | | <template #default="scope">
|
| | | <el-tag :type="getTagType2(scope.row.taskState)">
|
| | | {{ scope.row.taskState == "completed" ? "完成" : "进行中" }}
|
| | | </el-tag>
|
| | | </template>
|
| | | </el-table-column>
|
| | |
|
| | | |
| | | <!-- 操作列 -->
|
| | | <el-table-column label="操作" width="350">
|
| | | <template #default="{ row }">
|
| | | <el-button type="primary" size="mini" @click="handleRestart(row)"
|
| | | >重新开始</el-button
|
| | | >
|
| | | <el-button type="danger" size="mini" @click="handleDeletetask(row)"
|
| | | >删除任务</el-button
|
| | | >
|
| | | <el-button type="success" size="mini" @click="handleComplete(row)"
|
| | | >任务完成</el-button
|
| | | >
|
| | | </template>
|
| | | </el-table-column>
|
| | | </el-table>
|
| | | <el-pagination
|
| | | v-if="totalItems > 0"
|
| | | background
|
| | | layout="prev, pager, next"
|
| | | :total="totalItems"
|
| | | :page-size="pageSize"
|
| | | @current-change="handleCurrentChange"
|
| | | ></el-pagination>
|
| | |
|
| | | |
| | | </el-dialog>
|
| | |
|
| | |
|
| | | <el-table
|
| | | :data="tasktableData"
|
| | | style="width: 98%; height: 150px"
|
| | | @selection-change="handleSelectionChange"
|
| | | :header-cell-style="{ background: '#F2F3F5', color: '#1D2129' }"
|
| | | ref="table"
|
| | | empty-text="No Data"
|
| | | >
|
| | |
|
| | |
|
| | | <template #header>
|
| | | <div style="display: flex; align-items: center;">
|
| | | <span style="font-size: 16px; font-weight: bold; margin-right: 20px;">任务列表</span>
|
| | | |
| | | </div>
|
| | | </template>
|
| | | <el-table-column prop="Glassid" label="Glassid"></el-table-column>
|
| | | <el-table-column prop="taskDescription" label="任务描述" width="250"></el-table-column>
|
| | | <el-table-column prop="glassThickness" label="玻璃厚度"></el-table-column>
|
| | | <el-table-column prop="glassFilm" label="玻璃膜系"></el-table-column>
|
| | | <el-table-column prop="creationTime" label="创建时间"></el-table-column>
|
| | |
|
| | | <el-table-column
|
| | | align="center"
|
| | | label="任务状态"
|
| | | min-width="80"
|
| | | prop="taskStatus"
|
| | | >
|
| | | <template #default="scope">
|
| | | <el-tag :type="getTagType2(scope.row.taskStatus)">
|
| | | {{ scope.row.taskStatus == 'completed' ? '完成' : '进行中' }}
|
| | | </el-tag>
|
| | | </template>
|
| | | </el-table-column>
|
| | |
|
| | | <!-- 操作列 -->
|
| | | <el-table-column label="操作" width="350">
|
| | | <template #default="{ row }">
|
| | | <el-button type="primary" size="mini" @click="handleRestart(row)">重新开始</el-button>
|
| | | <el-button type="danger" size="mini" @click="handleDeletetask(row)">删除任务</el-button>
|
| | | <el-button type="success" size="mini" @click="handleComplete(row)">任务完成</el-button>
|
| | | </template>
|
| | | </el-table-column>
|
| | | </el-table>
|
| | | </el-card>
|
| | |
|
| | |
|
| | |
|
| | |
|
| | | |
| | | <div class="img-ypcc" >
|
| | |
|
| | |
|
| | | <div class="img-car1" :style="'z-index:999;left:397px;top:205px;position:absolute;'">
|
| | | <div v-show="cellshow1" style="margin-top:10px;width:200px;height:5px;background-color:#409EFF;"></div>
|
| | | <div class="img-ypcc">
|
| | | <div
|
| | | class="img-car1"
|
| | | :style="'z-index:999;left:397px;top:205px;position:absolute;'"
|
| | | >
|
| | | <div
|
| | | v-show="cellshow1"
|
| | | style="
|
| | | margin-top: 10px;
|
| | | width: 200px;
|
| | | height: 5px;
|
| | | background-color: #409eff;
|
| | | "
|
| | | ></div>
|
| | | </div>
|
| | | </div>
|
| | | |
| | | </div>
|
| | | |
| | |
|
| | | <!-- 入库对话框 -->
|
| | | <el-dialog
|
| | | title="入库"
|
| | |
| | | >
|
| | | <el-form :model="formData" ref="form" label-width="80px">
|
| | | <el-form-item label="进库料架">
|
| | | <el-select v-model="formData.shelf" placeholder="请选择进库料架">
|
| | | <el-option label="A1" value="A1"></el-option>
|
| | | <el-option label="B2" value="B2"></el-option>
|
| | | <el-select v-model="formData.number" placeholder="请选择进库料架">
|
| | | <el-option label="1" value="1"></el-option>
|
| | | <el-option label="2" value="2"></el-option>
|
| | | <!-- 根据实际情况添加更多选项 -->
|
| | | </el-select>
|
| | | </el-form-item>
|
| | |
| | | </el-select>
|
| | | </el-form-item>
|
| | | <el-form-item label="宽度">
|
| | | <el-input v-model.number="formData.width" placeholder="请输入宽度"></el-input>
|
| | | <el-input
|
| | | v-model.number="formData.rawWidth"
|
| | | placeholder="请输入宽度"
|
| | | ></el-input>
|
| | | </el-form-item>
|
| | | <el-form-item label="高度">
|
| | | <el-input v-model.number="formData.height" placeholder="请输入高度"></el-input>
|
| | | <el-input
|
| | | v-model.number="formData.rawHeight"
|
| | | placeholder="请输入高度"
|
| | | ></el-input>
|
| | | </el-form-item>
|
| | | <el-form-item label="厚度">
|
| | | <el-input v-model.number="formData.thickness" placeholder="请输入厚度"></el-input>
|
| | | <el-input
|
| | | v-model.number="formData.rawThickness"
|
| | | placeholder="请输入厚度"
|
| | | ></el-input>
|
| | | </el-form-item>
|
| | | <el-form-item label="数量">
|
| | | <el-input v-model.number="formData.quantity" placeholder="请输入数量"></el-input>
|
| | | <el-input
|
| | | v-model.number="formData.pieces"
|
| | | placeholder="请输入数量"
|
| | | ></el-input>
|
| | | </el-form-item>
|
| | | </el-form>
|
| | |
|
| | | <div slot="footer" class="dialog-footer">
|
| | | <el-button @click="dialogVisible = false">取 消</el-button>
|
| | | <el-button type="primary" @click="handleConfirmInbound">确 定</el-button>
|
| | | <el-button type="primary" @click="handleConfirmInbound"
|
| | | >确 定</el-button
|
| | | >
|
| | | </div>
|
| | | </el-dialog>
|
| | |
|
| | |
|
| | | <el-dialog title="添加原片" v-model="dialogVisible3" width="50%">
|
| | | <el-form :model="formData3" ref="form" label-width="80px">
|
| | | <el-form-item label="颜色膜系">
|
| | | <el-input v-model="formData.selectedColor" readonly style="width: 250px; height: 35px; font-size: 20px"></el-input>
|
| | | <el-dropdown @command="handleCommand">
|
| | | <span class="el-dropdown-link">
|
| | | 选择<i class="el-icon-arrow-down el-icon--right"></i>
|
| | | </span>
|
| | | <el-dropdown-menu slot="dropdown">
|
| | | <el-dropdown-item v-for="color in colors" :key="color['0_glass_id']" :command="color['0_glass_id']">
|
| | | {{ color['0_glass_id'] }}
|
| | | </el-dropdown-item>
|
| | | </el-dropdown-menu>
|
| | | </el-dropdown>
|
| | | </el-form-item>
|
| | |
|
| | | <el-form-item label="长度">
|
| | | <el-input v-model="formData.width" required style="width: 250px; font-size: 20px" @focus="clearInput('wid')"></el-input>
|
| | | </el-form-item>
|
| | |
|
| | | <el-form-item label="高度">
|
| | | <el-input v-model="formData.height" required style="width: 250px; font-size: 20px" @focus="clearInput('heig')"></el-input>
|
| | | </el-form-item>
|
| | |
|
| | | <el-form-item label="厚度">
|
| | | <el-input v-model="formData.thickness" required style="width: 250px; font-size: 20px" @focus="clearInput('thinkness')"></el-input>
|
| | | </el-form-item>
|
| | |
|
| | | <el-form-item label="数量">
|
| | | <el-input-number v-model="formData.quantity" required :min="0" :max="9000" style="width: 250px; font-size: 20px" @focus="clearInput('num')"></el-input-number>
|
| | | </el-form-item>
|
| | | </el-form>
|
| | |
|
| | | <span slot="footer" class="dialog-footer">
|
| | | <el-button @click="dialogVisible3 = false">关闭</el-button>
|
| | | <el-button type="primary" @click="submitForm">提交</el-button>
|
| | | </span>
|
| | | </el-dialog>
|
| | |
|
| | | <el-dialog title="编辑" v-model="editdialogVisible" width="30%" @close="edithandleDialogClose">
|
| | | <el-form :model="editForm" ref="editFormRef" label-width="80px">
|
| | | <el-form-item label="数量">
|
| | | <el-input v-model="editForm.quantity"></el-input>
|
| | | <el-dialog title="添加原片" v-model="dialogVisible3" width="50%">
|
| | | <el-form :model="formData3" ref="form" label-width="80px">
|
| | | <el-form-item label="颜色膜系">
|
| | | <el-input
|
| | | v-model="formData.selectedColor"
|
| | | readonly
|
| | | style="width: 250px; height: 35px; font-size: 20px"
|
| | | ></el-input>
|
| | | <el-dropdown @command="handleCommand">
|
| | | <span class="el-dropdown-link">
|
| | | 选择<i class="el-icon-arrow-down el-icon--right"></i>
|
| | | </span>
|
| | | <el-dropdown-menu slot="dropdown">
|
| | | <el-dropdown-item
|
| | | v-for="color in colors"
|
| | | :key="color['0_glass_id']"
|
| | | :command="color['0_glass_id']"
|
| | | >
|
| | | {{ color["0_glass_id"] }}
|
| | | </el-dropdown-item>
|
| | | </el-dropdown-menu>
|
| | | </el-dropdown>
|
| | | </el-form-item>
|
| | | <el-form-item label="批次号">
|
| | | <el-input v-model="editForm.batchnumber"></el-input>
|
| | | </el-form-item>
|
| | |
|
| | | <el-form-item label="长度">
|
| | | <el-input v-model="editForm.length"></el-input>
|
| | | <el-input
|
| | | v-model="formData.width"
|
| | | required
|
| | | style="width: 250px; font-size: 20px"
|
| | | @focus="clearInput('wid')"
|
| | | ></el-input>
|
| | | </el-form-item>
|
| | |
|
| | | <el-form-item label="高度">
|
| | | <el-input v-model="editForm.height"></el-input>
|
| | | <el-input
|
| | | v-model="formData.height"
|
| | | required
|
| | | style="width: 250px; font-size: 20px"
|
| | | @focus="clearInput('heig')"
|
| | | ></el-input>
|
| | | </el-form-item>
|
| | |
|
| | | <el-form-item label="厚度">
|
| | | <el-input v-model="editForm.thickness"></el-input>
|
| | | <el-input
|
| | | v-model="formData.thickness"
|
| | | required
|
| | | style="width: 250px; font-size: 20px"
|
| | | @focus="clearInput('thinkness')"
|
| | | ></el-input>
|
| | | </el-form-item>
|
| | |
|
| | | <el-form-item label="数量">
|
| | | <el-input-number
|
| | | v-model="formData.quantity"
|
| | | required
|
| | | :min="0"
|
| | | :max="9000"
|
| | | style="width: 250px; font-size: 20px"
|
| | | @focus="clearInput('num')"
|
| | | ></el-input-number>
|
| | | </el-form-item>
|
| | | </el-form>
|
| | |
|
| | | <div class="dialog-footer">
|
| | | <span slot="footer" class="dialog-footer">
|
| | | <el-button @click="dialogVisible3 = false">关闭</el-button>
|
| | | <el-button type="primary" @click="submitForm">提交</el-button>
|
| | | </span>
|
| | | </el-dialog>
|
| | |
|
| | | <el-dialog
|
| | | title="编辑"
|
| | | v-model="editdialogVisible"
|
| | | width="30%"
|
| | | @close="edithandleDialogClose"
|
| | | >
|
| | | <el-form :model="editForm" ref="editFormRef" label-width="80px">
|
| | | <el-form-item label="数量">
|
| | | <el-input v-model="editForm.pieces"></el-input>
|
| | | </el-form-item>
|
| | | <el-form-item label="批次号">
|
| | | <el-input v-model="editForm.batchId"></el-input>
|
| | | </el-form-item>
|
| | | <el-form-item label="长度">
|
| | | <el-input v-model="editForm.rawWidth"></el-input>
|
| | | </el-form-item>
|
| | | <el-form-item label="高度">
|
| | | <el-input v-model="editForm.rawHeight"></el-input>
|
| | | </el-form-item>
|
| | | <el-form-item label="厚度">
|
| | | <el-input v-model="editForm.rawThickness"></el-input>
|
| | | </el-form-item>
|
| | | </el-form>
|
| | |
|
| | | <div class="dialog-footer">
|
| | | <el-button @click="editdialogVisible = false">取消</el-button>
|
| | | <el-button type="primary" @click="editsaveEdit">保存</el-button>
|
| | | </div>
|
| | | </el-dialog>
|
| | |
|
| | |
|
| | | </div>
|
| | | </template>
|
| | |
|
| | |
| | |
|
| | |
|
| | | <script setup>
|
| | | import { ref, onMounted, onBeforeUnmount } from 'vue'; // 导入 Vue 3 的模块
|
| | | import * as echarts from 'echarts';
|
| | | import { ElMessage, ElMessageBox } from 'element-plus'
|
| | | import {tableData} from '@/stores/tableData.js';
|
| | | import { ref, onMounted, onBeforeUnmount } from "vue"; // 导入 Vue 3 的模块
|
| | | //import * as echarts from 'echarts';
|
| | | import { ElMessage, ElMessageBox } from "element-plus";
|
| | | // import {tableData} from '@/stores/tableData.js';
|
| | | import { WebSocketHost, host } from "@/utils/constants";
|
| | | import { initializeWebSocket, closeWebSocket } from "@/utils/WebSocketService";
|
| | |
|
| | | import {
|
| | | updateRawUsage,
|
| | | deleteRawUsage,
|
| | | inStorage,
|
| | | outStorage,
|
| | | taskUpdate,
|
| | | } from "@/utils/api";
|
| | |
|
| | |
|
| | | const loading = ref(false);
|
| | | |
| | |
|
| | | const Hidden = ref(false)
|
| | |
|
| | |
|
| | | const totalItems = ref(0);
|
| | | totalItems.value = 10;
|
| | | const pageSize = 10;
|
| | | let currentPage = ref(1);
|
| | | const handleCurrentChange = (val) => {
|
| | |
|
| | | currentPage.value = val;
|
| | | |
| | | };
|
| | |
|
| | | const getTagType2 =(status) => {
|
| | | switch (status) {
|
| | | case 'completed':
|
| | | return 'success';
|
| | | case 'in-progress':
|
| | | return 'info';
|
| | | case 'warning':
|
| | | return 'warning';
|
| | | case 'danger':
|
| | | return 'danger';
|
| | | default:
|
| | | return '';
|
| | | }
|
| | | }
|
| | |
|
| | | const getTagType =(status) => {
|
| | | return status === 1 ? 'success' : 'danger';
|
| | | // 根据状态值决定标签类型,这里假设状态为1时为成功(绿色),否则为失败(红色)
|
| | | }
|
| | |
|
| | | const toggleStatus = (row) => {
|
| | | // 切换料架状态的逻辑
|
| | | row.shelf_status = 1 - row.shelf_status; // Toggle between 0 and 1
|
| | | // 此处可以添加保存状态的逻辑,比如调用 API 更新数据
|
| | | };
|
| | |
|
| | | const tasktableData=ref([
|
| | |
|
| | | {
|
| | | Glassid: 'G001',
|
| | | taskDescription: '从吊装位【99】到仓位【56】',
|
| | | taskStatus: 'in-progress',
|
| | | glassThickness: '5mm',
|
| | | glassFilm: '膜系A',
|
| | | creationTime: '2024-06-19 10:00:00'
|
| | | },
|
| | | {
|
| | | Glassid: 'G002',
|
| | | taskDescription: '从吊装位【99】到仓位【56】',
|
| | | taskStatus: 'completed',
|
| | | glassThickness: '10mm',
|
| | | glassFilm: '膜系B',
|
| | | creationTime: '2024-06-19 11:00:00'
|
| | | }
|
| | | ]);
|
| | |
|
| | | const dialogVisible = ref(false);
|
| | | const formData = ref({
|
| | | shelf: '',
|
| | | color: '',
|
| | | width: '',
|
| | | height: '',
|
| | | thickness: '',
|
| | | quantity: ''
|
| | | });
|
| | |
|
| | | const formData2 = ref({
|
| | | dzw: '',
|
| | | |
| | | });
|
| | |
|
| | | |
| | | const handleDelete = (row) => {
|
| | | // 使用 Element UI 的 MessageBox.confirm 方法进行二次确认
|
| | | ElMessageBox.confirm('确定要执行删除操作吗?', '确认删除', {
|
| | | confirmButtonText: '确认',
|
| | | cancelButtonText: '取消',
|
| | | type: 'warning',
|
| | | }).then(() => {
|
| | | // 点击确认按钮的回调,执行出库操作
|
| | | console.log('执行删除操作', row);
|
| | | }).catch(() => {
|
| | | // 点击取消按钮的回调,不执行任何操作
|
| | | console.log('取消删除操作');
|
| | | });
|
| | | const loading = ref(false);
|
| | | const Hidden = ref(false);
|
| | | const tableData = ref([]);
|
| | | const totalItems = ref(0);
|
| | | totalItems.value = 10;
|
| | | const pageSize = 10;
|
| | | let currentPage = ref(1);
|
| | | const handleCurrentChange = (val) => {
|
| | | currentPage.value = val;
|
| | | };
|
| | |
|
| | | |
| | | const handleCheckout = (row) => {
|
| | | // 使用 Element UI 的 MessageBox.confirm 方法进行二次确认
|
| | | ElMessageBox.confirm('确定要执行出库操作吗?', '确认出库', {
|
| | | confirmButtonText: '确认',
|
| | | cancelButtonText: '取消',
|
| | | type: 'warning',
|
| | | }).then(() => {
|
| | | // 点击确认按钮的回调,执行出库操作
|
| | | console.log('执行出库操作', row);
|
| | | }).catch(() => {
|
| | | // 点击取消按钮的回调,不执行任何操作
|
| | | console.log('取消出库操作');
|
| | | });
|
| | | const formatTaskType = (row, column) => {
|
| | | if (row.taskType === "从仓位到吊装位") {
|
| | | return `从仓位${row.shelfRack}到吊装位${row.loadRack}`;
|
| | | } else if (row.taskType === "从仓位到上片位") {
|
| | | return `从仓位${row.shelfRack}到上片位${row.loadRack}`;
|
| | | } else if (row.taskType === "从上片位到仓位") {
|
| | | return `从上片位${row.loadRack}到仓位${row.shelfRack}`;
|
| | | } else if (row.taskType === "从吊装位到仓位") {
|
| | | return `从吊装位${row.loadRack}到仓位${row.shelfRack}`;
|
| | | }
|
| | | };
|
| | |
|
| | | const getTagType2 = (status) => {
|
| | | switch (status) {
|
| | | case "completed":
|
| | | return "success";
|
| | | case "in-progress":
|
| | | return "info";
|
| | | case "warning":
|
| | | return "warning";
|
| | | case "danger":
|
| | | return "danger";
|
| | | default:
|
| | | return "";
|
| | | }
|
| | | };
|
| | |
|
| | | const handleInbound = () => {
|
| | | // 打开入库对话框
|
| | | dialogVisible.value = true;
|
| | | };
|
| | | const getTagType = (status) => {
|
| | | return status === 1 ? "success" : "danger";
|
| | | // 根据状态值决定标签类型,这里假设状态为1时为成功(绿色),否则为失败(红色)
|
| | | };
|
| | |
|
| | | const storage = () => {
|
| | | // 打开入库对话框
|
| | | Hidden.value = true;
|
| | | };
|
| | | |
| | | const toggleStatus = (row) => {
|
| | | // 切换料架状态的逻辑
|
| | | row.enableState = 1 - row.enableState; // Toggle between 0 and 1
|
| | | // 此处可以添加保存状态的逻辑,比如调用 API 更新数据
|
| | | };
|
| | | const socketUrl = `ws://${WebSocketHost}:${host}/api/glassStorage/api/talk/storageTask`;
|
| | | // 定义消息处理函数,更新 receivedData 变量
|
| | | const handleMessage = (data) => {
|
| | | // 更新 tableData 的数据
|
| | |
|
| | | const handleCloseDialog = () => {
|
| | | // 关闭对话框时重置表单数据
|
| | | formData.value = {
|
| | | shelf: '',
|
| | | color: '',
|
| | | width: '',
|
| | | height: '',
|
| | | thickness: '',
|
| | | quantity: ''
|
| | | tableData.value = data.rack[0]; // 假设 tableData 是响应式对象或变量
|
| | |
|
| | | tableData.value.forEach((item) => {
|
| | | // 获取 createTime 的时间戳
|
| | | const createTimeTimestamp = item.createTime;
|
| | |
|
| | | // 创建日期对象
|
| | | const date = new Date(createTimeTimestamp);
|
| | |
|
| | | // 格式化日期时间为本地格式
|
| | | const formattedDateTime = date.toLocaleString();
|
| | |
|
| | | // 替换原来的 createTime 字段为格式化后的日期时间字符串
|
| | | item.createTime = formattedDateTime;
|
| | | });
|
| | |
|
| | | tasktableData.value = data.tasks[0]; // 假设 tasktableData 是响应式对象或变量
|
| | |
|
| | | tasktableData.value.forEach((item) => {
|
| | | // 获取 createTime 的时间戳
|
| | | const createTimeTimestamp = item.startTime;
|
| | |
|
| | | // 创建日期对象
|
| | | const date = new Date(createTimeTimestamp);
|
| | |
|
| | | // 格式化日期时间为本地格式
|
| | | const formattedDateTime = date.toLocaleString();
|
| | |
|
| | | // 替换原来的 createTime 字段为格式化后的日期时间字符串
|
| | | item.startTime = formattedDateTime;
|
| | | });
|
| | |
|
| | |
|
| | |
|
| | |
|
| | |
|
| | | };
|
| | |
|
| | | onMounted(() => {
|
| | | initializeWebSocket(socketUrl, handleMessage);
|
| | | });
|
| | | onBeforeUnmount(() => {
|
| | | console.log("关闭了");
|
| | | closeWebSocket();
|
| | | });
|
| | |
|
| | | const tasktableData = ref([]);
|
| | |
|
| | | const dialogVisible = ref(false);
|
| | | const formData = ref({
|
| | | number: "",
|
| | | color: "",
|
| | | rawWidth: "",
|
| | | rawHeight: "",
|
| | | rawThickness: "",
|
| | | pieces: "",
|
| | | loadRack: 1,
|
| | | });
|
| | |
|
| | | const formData2 = ref({
|
| | | dzw: "",
|
| | | });
|
| | |
|
| | | const handleDelete = (row) => {
|
| | | // 使用 Element UI 的 MessageBox.confirm 方法进行二次确认
|
| | | ElMessageBox.confirm("确定要执行删除操作吗?", "确认删除", {
|
| | | confirmButtonText: "确认",
|
| | | cancelButtonText: "取消",
|
| | | type: "warning",
|
| | | })
|
| | | .then(() => {
|
| | | // 点击确认按钮的回调,执行出库操作
|
| | |
|
| | | const intNumber = {
|
| | | id: parseInt(row.number),
|
| | | };
|
| | | dialogVisible.value = false;
|
| | | };
|
| | | deleteRawUsage(intNumber);
|
| | |
|
| | | const handleConfirmInbound = () => {
|
| | | // 处理确认入库逻辑,可以在这里提交表单或者执行其他操作
|
| | | console.log('Confirm Inbound:', formData.value);
|
| | | // 关闭对话框
|
| | | dialogVisible.value = false;
|
| | | };
|
| | |
|
| | |
|
| | |
|
| | |
|
| | |
|
| | | const dialogVisible3 = ref(false);
|
| | | const colors = ref([
|
| | | { '0_glass_id': 'Red' },
|
| | | { '0_glass_id': 'Green' },
|
| | | { '0_glass_id': 'Blue' }
|
| | | // Add more colors as needed
|
| | | ]);
|
| | |
|
| | | const formData3 = ref({
|
| | | selectedColor: '',
|
| | | wid: '',
|
| | | heig: '',
|
| | | thinkness: '',
|
| | | num: ''
|
| | | console.log("执行删除操作");
|
| | | })
|
| | | .catch(() => {
|
| | | // 点击取消按钮的回调,不执行任何操作
|
| | | console.log("取消删除操作");
|
| | | });
|
| | |
|
| | |
|
| | | const addglass = () => {
|
| | | // 打开入库对话框
|
| | | dialogVisible3.value = true;
|
| | | };
|
| | | const handleCommand = (command) => {
|
| | | formData.value.selectedColor = command;
|
| | | };
|
| | |
|
| | | const clearInput = (field) => {
|
| | | formData.value[field] = '';
|
| | | };
|
| | |
|
| | | const submitForm = () => {
|
| | | console.log('提交数据:', formData.value);
|
| | | dialogVisible3.value = false;
|
| | | // Add your submit logic here
|
| | | };
|
| | | |
| | |
|
| | |
|
| | |
|
| | | const editdialogVisible = ref(false);
|
| | | const editForm = ref({
|
| | | quantity: '',
|
| | | batchnumber: '',
|
| | | length:'',
|
| | | height:'',
|
| | | thickness:''
|
| | | });
|
| | | const editFormRef = ref(null);
|
| | | let currentRow = ref(null);
|
| | |
|
| | | // 处理行点击事件
|
| | | const edithandleRowClick = (row) => {
|
| | | currentRow.value = row;
|
| | | console.log(row)
|
| | | editForm.value.quantity = row.quantity.toString();
|
| | | editForm.value.batchnumber = row.batchnumber;
|
| | | editForm.value.length = row.length;
|
| | | editForm.value.height = row.height;
|
| | | editForm.value.thickness = row.thickness;
|
| | | editdialogVisible.value = true;
|
| | | console.log(editForm.value)
|
| | | };
|
| | |
|
| | | // 添加保存编辑内容
|
| | | const editsaveEdit = () => {
|
| | | if (!currentRow.value) return;
|
| | |
|
| | | // 更新当前行数据
|
| | | currentRow.value.quantity = parseInt(editForm.value.quantity);
|
| | | currentRow.value.batchnumber = editForm.value.batchnumber;
|
| | |
|
| | | // 关闭对话框
|
| | | editdialogVisible.value = false;
|
| | | };
|
| | |
|
| | | // 对话框关闭时重置编辑表单和当前行数据
|
| | | const edithandleDialogClose = () => {
|
| | | editForm.value.quantity = '';
|
| | | editForm.value.batchnumber = '';
|
| | | editForm.value.width = '';
|
| | | editForm.value.height = '';
|
| | | editForm.value.thickness = '';
|
| | | |
| | |
|
| | | currentRow.value = null;
|
| | | };
|
| | |
|
| | |
|
| | |
|
| | |
|
| | |
|
| | | |
| | |
|
| | |
|
| | | const handleRestart = (row) => {
|
| | | // 使用 Element UI 的 MessageBox.confirm 方法进行二次确认
|
| | | ElMessageBox.confirm('确定要执行重新开始操作吗?', '确认重新开始', {
|
| | | confirmButtonText: '确认',
|
| | | cancelButtonText: '取消',
|
| | | type: 'warning',
|
| | | }).then(() => {
|
| | | // 点击确认按钮的回调
|
| | | console.log('执行重新开始操作', row);
|
| | | }).catch(() => {
|
| | | // 点击取消按钮的回调,不执行任何操作
|
| | | console.log('取消重新开始操作');
|
| | | });
|
| | | };
|
| | |
|
| | | const handleCheckout = (row) => {
|
| | | // 使用 Element UI 的 MessageBox.confirm 方法进行二次确认
|
| | | ElMessageBox.confirm("确定要执行出库操作吗?", "确认出库", {
|
| | | confirmButtonText: "确认",
|
| | | cancelButtonText: "取消",
|
| | | type: "warning",
|
| | | })
|
| | | .then(() => {
|
| | | // 点击确认按钮的回调,执行出库操作
|
| | | const raw={
|
| | | number:parseInt(row.number),
|
| | | loadRack:2
|
| | | }
|
| | | outStorage(raw)
|
| | | console.log("执行出库操作", row);
|
| | | })
|
| | | .catch(() => {
|
| | | // 点击取消按钮的回调,不执行任何操作
|
| | | console.log("取消出库操作");
|
| | | });
|
| | | };
|
| | |
|
| | | const handleInbound = () => {
|
| | | // 打开入库对话框
|
| | | dialogVisible.value = true;
|
| | | };
|
| | |
|
| | | const storage = () => {
|
| | | // 打开入库对话框
|
| | | Hidden.value = true;
|
| | | };
|
| | |
|
| | | const handleCloseDialog = () => {
|
| | | // 关闭对话框时重置表单数据
|
| | | formData.value = {
|
| | | number: "",
|
| | | color: "",
|
| | | rawWidth: "",
|
| | | rawHeight: "",
|
| | | rawThickness: "",
|
| | | pieces: "",
|
| | | };
|
| | | dialogVisible.value = false;
|
| | | };
|
| | |
|
| | | const handleConfirmInbound = () => {
|
| | | inStorage(formData.value);
|
| | | // 处理确认入库逻辑,可以在这里提交表单或者执行其他操作
|
| | | console.log("Confirm Inbound:", formData.value);
|
| | | // 关闭对话框
|
| | | dialogVisible.value = false;
|
| | | };
|
| | |
|
| | | const dialogVisible3 = ref(false);
|
| | | const colors = ref([
|
| | | { "0_glass_id": "Red" },
|
| | | { "0_glass_id": "Green" },
|
| | | { "0_glass_id": "Blue" },
|
| | | // Add more colors as needed
|
| | | ]);
|
| | |
|
| | | const formData3 = ref({
|
| | | selectedColor: "",
|
| | | wid: "",
|
| | | heig: "",
|
| | | thinkness: "",
|
| | | num: "",
|
| | | });
|
| | |
|
| | | const addglass = () => {
|
| | | // 打开入库对话框
|
| | | dialogVisible3.value = true;
|
| | | };
|
| | | const handleCommand = (command) => {
|
| | | formData.value.selectedColor = command;
|
| | | };
|
| | |
|
| | | const clearInput = (field) => {
|
| | | formData.value[field] = "";
|
| | | };
|
| | |
|
| | | const submitForm = () => {
|
| | | console.log("提交数据:", formData.value);
|
| | | dialogVisible3.value = false;
|
| | | // Add your submit logic here
|
| | | };
|
| | |
|
| | | const editdialogVisible = ref(false);
|
| | | const editForm = ref({
|
| | | id: "",
|
| | | pieces: "",
|
| | | batchId: "",
|
| | | rawWidth: "",
|
| | | rawHeight: "",
|
| | | rawThickness: "",
|
| | | });
|
| | | const editFormRef = ref(null);
|
| | | let currentRow = ref(null);
|
| | |
|
| | | // 处理行点击事件
|
| | | const edithandleRowClick = (row) => {
|
| | | currentRow.value = row;
|
| | | console.log(row);
|
| | | editForm.value.pieces = row.pieces.toString();
|
| | | editForm.value.batchId = row.batchId;
|
| | | editForm.value.rawWidth = row.rawWidth;
|
| | | editForm.value.rawHeight = row.rawHeight;
|
| | | editForm.value.rawThickness = row.rawThickness;
|
| | | editForm.value.id = row.number;
|
| | | editdialogVisible.value = true;
|
| | | console.log(editForm.value);
|
| | | };
|
| | |
|
| | | // 添加保存编辑内容
|
| | | const editsaveEdit = () => {
|
| | | if (!currentRow.value) return;
|
| | |
|
| | | // 更新当前行数据
|
| | | currentRow.value.pieces = editForm.value.pieces;
|
| | | currentRow.value.batchId = editForm.value.batchId;
|
| | | currentRow.value.rawWidth = editForm.value.rawWidth;
|
| | | currentRow.value.rawHeight = editForm.value.rawHeight;
|
| | | currentRow.value.rawThickness = editForm.value.rawThickness;
|
| | | // 调用更新函数,并处理其返回的 Promise
|
| | | updateRawUsage(editForm.value);
|
| | |
|
| | | // 关闭对话框
|
| | | editdialogVisible.value = false;
|
| | | };
|
| | |
|
| | | // 对话框关闭时重置编辑表单和当前行数据
|
| | | const edithandleDialogClose = () => {
|
| | | editForm.value.pieces = "";
|
| | | editForm.value.batchId = "";
|
| | | editForm.value.rawWidth = "";
|
| | | editForm.value.rawHeight = "";
|
| | | editForm.value.rawThickness = "";
|
| | |
|
| | | currentRow.value = null;
|
| | | };
|
| | |
|
| | | const handleRestart = (row) => {
|
| | | // 使用 Element UI 的 MessageBox.confirm 方法进行二次确认
|
| | | ElMessageBox.confirm("确定要执行重新开始操作吗?", "确认重新开始", {
|
| | | confirmButtonText: "确认",
|
| | | cancelButtonText: "取消",
|
| | | type: "warning",
|
| | | })
|
| | | .then(() => {
|
| | | const taskdata={
|
| | | id:row.id,
|
| | | Type:"重新开始"
|
| | | }
|
| | | taskUpdate(taskdata);
|
| | | |
| | |
|
| | | console.log("执行重新开始操作", row);
|
| | | })
|
| | | .catch(() => {
|
| | | // 点击取消按钮的回调,不执行任何操作
|
| | | console.log("取消重新开始操作");
|
| | | });
|
| | | };
|
| | |
|
| | | const handleDeletetask = (row) => {
|
| | | // 使用 Element UI 的 MessageBox.confirm 方法进行二次确认
|
| | | ElMessageBox.confirm('确定要执行删除任务操作吗?', '确认删除任务', {
|
| | | confirmButtonText: '确认',
|
| | | cancelButtonText: '取消',
|
| | | type: 'warning',
|
| | | }).then(() => {
|
| | | // 点击确认按钮的回调
|
| | | console.log('执行删除任务操作', row);
|
| | | }).catch(() => {
|
| | | // 点击取消按钮的回调,不执行任何操作
|
| | | console.log('取消删除任务操作');
|
| | | });
|
| | | ElMessageBox.confirm("确定要执行删除任务操作吗?", "确认删除任务", {
|
| | | confirmButtonText: "确认",
|
| | | cancelButtonText: "取消",
|
| | | type: "warning",
|
| | | })
|
| | | .then(() => {
|
| | | // 点击确认按钮的回调
|
| | | const taskdata={
|
| | | id:row.id,
|
| | | Type:"删除"
|
| | | }
|
| | | taskUpdate(taskdata);
|
| | | console.log("执行删除任务操作", row);
|
| | | })
|
| | | .catch(() => {
|
| | | // 点击取消按钮的回调,不执行任何操作
|
| | | console.log("取消删除任务操作");
|
| | | });
|
| | | };
|
| | |
|
| | |
|
| | |
|
| | | const handleComplete = (row) => {
|
| | | // 使用 Element UI 的 MessageBox.confirm 方法进行二次确认
|
| | | ElMessageBox.confirm('确定要执行任务完成操作吗?', '确认任务完成', {
|
| | | confirmButtonText: '确认',
|
| | | cancelButtonText: '取消',
|
| | | type: 'warning',
|
| | | }).then(() => {
|
| | | // 点击确认按钮的回调
|
| | | console.log('执行任务完成操作', row);
|
| | | }).catch(() => {
|
| | | // 点击取消按钮的回调,不执行任何操作
|
| | | console.log('取消任务完成操作');
|
| | | });
|
| | | ElMessageBox.confirm("确定要执行任务完成操作吗?", "确认任务完成", {
|
| | | confirmButtonText: "确认",
|
| | | cancelButtonText: "取消",
|
| | | type: "warning",
|
| | | })
|
| | | .then(() => {
|
| | |
|
| | | const taskdata={
|
| | | id:row.id,
|
| | | Type:"完成"
|
| | | }
|
| | | taskUpdate(taskdata);
|
| | | // 点击确认按钮的回调
|
| | | console.log("执行任务完成操作", row);
|
| | | })
|
| | | .catch(() => {
|
| | | // 点击取消按钮的回调,不执行任何操作
|
| | | console.log("取消任务完成操作");
|
| | | });
|
| | | };
|
| | |
|
| | |
|
| | |
|
| | |
|
| | |
|
| | |
|
| | |
|
| | |
|
| | |
|
| | |
|
| | |
|
| | |
|
| | |
|
| | |
|
| | |
|
| | |
|
| | |
|
| | |
|
| | |
|
| | |
|
| | |
|
| | |
|
| | |
|
| | | |
| | |
|
| | |
|
| | | </script>
|
| | |
|
| | | <style scoped>
|
| | |
|
| | |
|
| | | #dt { display:block; float:left;line-height: 20px;margin-left: 100px;}
|
| | | #dta { display:block; float:left;line-height: 20px;margin-left: 80%;}
|
| | | #dialog-footer{
|
| | | #dt {
|
| | | display: block;
|
| | | float: left;
|
| | | line-height: 20px;
|
| | | margin-left: 100px;
|
| | | }
|
| | | #dta {
|
| | | display: block;
|
| | | float: left;
|
| | | line-height: 20px;
|
| | | margin-left: 80%;
|
| | | }
|
| | | #dialog-footer {
|
| | | text-align: center;
|
| | | margin-top: -15px;
|
| | | }
|
| | |
|
| | |
|
| | |
|
| | | .img-ypcc{
|
| | | .img-ypcc {
|
| | | margin-left: 80px;
|
| | | background-image:url('../../assets/ypcc.png');
|
| | | background-image: url("../../assets/ypcc.png");
|
| | | background-repeat: no-repeat;
|
| | | background-attachment: local;
|
| | | min-height: 600px;
|
| | | width: 1400px;
|
| | | max-width: 100%;
|
| | | background-size: 1400px 600px;
|
| | | overflow: hidden;
|
| | | position:relative;
|
| | | margin-top:0px
|
| | | background-attachment: local;
|
| | | min-height: 600px;
|
| | | width: 1400px;
|
| | | max-width: 100%;
|
| | | background-size: 1400px 600px;
|
| | | overflow: hidden;
|
| | | position: relative;
|
| | | margin-top: 0px;
|
| | | }
|
| | |
|
| | | .img-car1{
|
| | | background-image:url('../../assets/ypccche.png');
|
| | | .img-car1 {
|
| | | background-image: url("../../assets/ypccche.png");
|
| | | position: absolute;
|
| | | background-repeat: no-repeat;
|
| | | background-attachment: local;
|
| | | min-height: 400px;
|
| | | width: 200px;
|
| | | max-width: 100%;
|
| | | background-size: 200px 170px;
|
| | | overflow: hidden;
|
| | | position:relative
|
| | | background-attachment: local;
|
| | | min-height: 400px;
|
| | | width: 200px;
|
| | | max-width: 100%;
|
| | | background-size: 200px 170px;
|
| | | overflow: hidden;
|
| | | position: relative;
|
| | | }
|
| | |
|
| | | .custom-dialog {
|