| | |
| | | import {useRouter} from "vue-router" |
| | | const router = useRouter() |
| | | |
| | | import { useI18n } from 'vue-i18n' |
| | | const { t } = useI18n() |
| | | let language = ref(localStorage.getItem('lang') || 'zh') |
| | | import { ref } from 'vue' |
| | | import { ElMessage, ElMessageBox } from 'element-plus' |
| | | import Landingindication from "./Landingindication.vue"; |
| | |
| | | import { initializeWebSocket, closeWebSocket } from '@/utils/WebSocketService'; |
| | | import { WebSocketHost ,host} from '@/utils/constants' |
| | | const dialogFormVisiblea = ref(false) |
| | | |
| | | const dialogFormVisiblea2 = ref(false) |
| | | |
| | | // 数据 |
| | | const loading = ref(false); |
| | | |
| | | // 弹框显示控制 |
| | | const dialogFormVisible = ref(false); |
| | | // 表单数据 |
| | | const workstationId = ref(''); |
| | | const selectedProjectNoa = ref(null); // 当前选中的角色 |
| | | const flowCardId = ref(''); |
| | | const flowCardOptions = ref([]); |
| | | const flowCardOptions = ref('[]'); |
| | | const tableData = reactive([]); |
| | | // 方法 |
| | | const handleSelectionChange = () => { |
| | | // 处理表格行选择事件 |
| | | }; |
| | | |
| | | const handleBindRack = (row) => { |
| | | workstationId.value = row.workstationId; // 假设rackNumber是架号字段的属性名 |
| | | console.log(row.flowCardId); |
| | | flowCardId.value = row.flowCardId; |
| | | // 发起接口请求获取流程卡号 |
| | | fetchFlowCardId(); |
| | | dialogFormVisiblea.value = true; // 打开绑定架子对话框 |
| | |
| | | const response = await request.get('unLoadGlass/downWorkStation/getflowCardId'); |
| | | console.log(response) |
| | | if (response.code === 200) { |
| | | flowCardOptions.value = response.data |
| | | .filter(item => item !== null) |
| | | .map(item => ({ flowcard_id: item.flow_card_Id })); |
| | | |
| | | flowCardOptions.value = response.data.filter(item => item !== null) |
| | | .map(item => ({ flowcard_id: item.flow_card_id })); |
| | | console.log(flowCardOptions.value); |
| | | } |
| | | else { |
| | |
| | | } |
| | | }; |
| | | //确认 |
| | | |
| | | const handleConfirm = async () => { |
| | | try { |
| | | const firstPart = flowCardId.value.split('|')[0].trim(); // |
| | | const twoPart = flowCardId.value.split('|')[1].trim(); // |
| | | const response = await request.post('unLoadGlass/downWorkStation/updateFlowCardId', { |
| | | workstationId: workstationId.value, |
| | | flowCardId: flowCardId.value |
| | | flowCardId: firstPart, |
| | | layer:twoPart |
| | | |
| | | }); |
| | | |
| | | console.log(response) |
| | |
| | | closeWebSocket(); |
| | | }); |
| | | |
| | | // beforeUnmount(() => { |
| | | // closeWebSocket(); |
| | | // }); |
| | | const getTagType =(status) => { |
| | | return status === 1 ? 'success' : 'danger'; |
| | | // 根据状态值决定标签类型,这里假设状态为1时为成功(绿色),否则为失败(红色) |
| | | } |
| | | |
| | | const toggleStatus = (row) => { |
| | | // 切换料架状态的逻辑 |
| | | row.enableState = 1 - row.enableState; // Toggle between 0 and 1 |
| | | // 此处可以添加保存状态的逻辑,比如调用 API 更新数据 |
| | | updateRowStatus(row); |
| | | }; |
| | | |
| | | // setInterval(fetchTableData, 2000) |
| | | const updateRowStatus = async (row) => { |
| | | try { |
| | | // 假设你的后端 API 接收 PUT 请求,并且需要传递 row.id 和 row.enableState 参数 |
| | | |
| | | |
| | | const response = await request.post('unLoadGlass/downWorkStation/updateDownWorkstation', { |
| | | enableState: 1 - row.enableState |
| | | |
| | | }); |
| | | console.log('Updated row status:', response.data); |
| | | // 可以根据后端返回的数据进行进一步处理,比如更新本地状态等 |
| | | } catch (error) { |
| | | console.error('Error updating row status:', error); |
| | | // 处理错误情况,比如提示用户更新失败 |
| | | } |
| | | }; |
| | | |
| | | |
| | | </script> |
| | |
| | | <el-table height="100%" ref="table" |
| | | @selection-change="handleSelectionChange" |
| | | :data="tableData" :header-cell-style="{background:'#F2F3F5 ',color:'#1D2129'}"> |
| | | <el-table-column prop="workstationId" align="center" label="下片位" min-width="80" /> |
| | | <el-table-column prop="workstationId" align="center" label="架号" min-width="120" /> |
| | | <el-table-column prop="flowCardId" align="center" label="流程卡号" min-width="120" /> |
| | | <el-table-column prop="totalquantity" align="center" label="总数量" min-width="120" /> |
| | | <el-table-column prop="racksnumber" align="center" label="已落架数量" min-width="120" /> |
| | | <el-table-column prop="work_state" align="center" label="状态" min-width="120" /> |
| | | <el-table-column prop="deviceId" align="center" label="设备号" min-width="120" /> |
| | | |
| | | |
| | | |
| | | <el-table-column prop="workstationId" align="center" :label="$t('reportWork.lowerbit')" min-width="80" /> |
| | | <el-table-column prop="workstationId" align="center" :label="$t('reportWork.shelfnumber')" min-width="120" /> |
| | | <el-table-column prop="flowCardId" align="center" :label="$t('reportWork.cardnumber')" min-width="120" /> |
| | | <el-table-column prop="totalquantity" align="center" :label="$t('reportWork.totalquantity')" min-width="120" /> |
| | | <el-table-column prop="racksnumber" align="center" :label="$t('reportWork.beendropped')" min-width="120" /> |
| | | <el-table-column prop="layer" align="center" label="层数" min-width="120" /> |
| | | <el-table-column prop="artificialnumber" align="center" label="人工下片数" min-width="120" /> |
| | | <el-table-column prop="work_state" align="center" :label="$t('reportWork.state')" min-width="120" /> |
| | | <el-table-column prop="deviceId" align="center" :label="$t('reportWork.devicenumber')" min-width="120" /> |
| | | <el-table-column |
| | | align="center" |
| | | label="启用状态" |
| | | :label="$t('reportWork.startstatus')" |
| | | min-width="80" |
| | | prop="enableState" |
| | | > |
| | | <template #default="scope"> |
| | | <el-tag type="success" >{{ scope.row.enableState==1?"启用":"未启用" }}</el-tag> |
| | | |
| | | <el-tag :type="getTagType(scope.row.enableState)" @click="toggleStatus(scope.row)"> |
| | | {{ scope.row.enableState === 1 ? $t('reportWork.enable') : $t('reportWork.unenable') }} |
| | | </el-tag> |
| | | </template> |
| | | </el-table-column> |
| | | <el-table-column fixed="right" label="操作" align="center" width="200"> |
| | | <el-table-column fixed="right" :label="$t('reportWork.operate')" align="center" width="200"> |
| | | <template #default="scope"> |
| | | <el-button size="mini" type="text" plain v-show="scope.row.enableState !== '已启用' " @click="handleBindRack(scope.row)">绑定架子</el-button> |
| | | <el-button size="mini" type="text" plain @click="handleBindRack2(scope.row)">清空</el-button> |
| | | <el-button size="mini" type="text" plain v-show="scope.row.enableState !== '已启用' " @click="handleBindRack(scope.row)">{{ $t('reportWork.bindingshelves') }}</el-button> |
| | | <el-button size="mini" type="text" plain @click="handleBindRack2(scope.row)">{{ $t('reportWork.clear') }}</el-button> |
| | | </template> |
| | | </el-table-column> |
| | | </el-table> |
| | |
| | | </el-card> |
| | | |
| | | |
| | | <el-dialog v-model="dialogFormVisiblea" top="21vh" width="30%" title="绑定架子" > |
| | | <el-dialog v-model="dialogFormVisiblea" top="21vh" width="40%" :title="$t('reportWork.bindingshelves')"> |
| | | <div style="margin-left: 50px;margin-top: 10px;margin-bottom: 10px;"> |
| | | <el-form size="mini" label-width="150px"> |
| | | <el-form label-width="100px" label-position="right"> |
| | | <el-form-item label="架号:" :required="true" style="width: 18vw"> |
| | | <el-form size="mini" label-width="100px"> |
| | | <el-form label-width="210px" label-position="right"> |
| | | <el-form-item :label="$t('reportWork.shelfnumbera')" :required="true" style="width: 25vw"> |
| | | <el-input v-model="workstationId" autocomplete="off"/> |
| | | </el-form-item> |
| | | <el-form-item label="流程卡号:" :required="true" style="width: 18vw;"> |
| | | <el-select v-model="flowCardId" placeholder="请选择流程卡号"> |
| | | <el-form-item :label="$t('reportWork.cardnumbera')" :required="true" style="width: 25vw;"> |
| | | <el-select v-model="flowCardId" :placeholder="$t('reportWork.incardnumber')"> |
| | | <el-option v-for="item in flowCardOptions" :key="item.flowcard_id" :label="item.flowcard_id" :value="item.flowcard_id" /> |
| | | </el-select> |
| | | </el-form-item> |
| | |
| | | <template #footer> |
| | | <div id="dialog-footer"> |
| | | <el-button type="primary" @click="handleConfirm"> |
| | | 确认 |
| | | {{ $t('reportWork.sure') }} |
| | | </el-button> |
| | | <el-button @click="dialogFormVisiblea = false">取消</el-button> |
| | | <el-button @click="dialogFormVisiblea = false">{{ $t('reportWork.cancel') }}</el-button> |
| | | </div> |
| | | </template> |
| | | </el-dialog> |
| | |
| | | |
| | | |
| | | |
| | | <el-dialog v-model="dialogFormVisiblea2" top="21vh" width="30%" title="清除架子玻璃" > |
| | | <el-dialog v-model="dialogFormVisiblea2" top="21vh" width="30%" :title="$t('reportWork.clearglass')"> |
| | | |
| | | <template #footer> |
| | | <div id="dialog-footer"> |
| | | <el-button type="primary" @click="handleclear"> |
| | | 确认 |
| | | {{ $t('reportWork.sure') }} |
| | | </el-button> |
| | | <el-button @click="dialogFormVisiblea2 = false">取消</el-button> |
| | | <el-button @click="dialogFormVisiblea2 = false">{{ $t('reportWork.cancel') }}</el-button> |
| | | </div> |
| | | </template> |
| | | </el-dialog> |