| | |
| | | <script setup> |
| | | import {Search} from "@element-plus/icons-vue"; |
| | | import {reactive} from "vue"; |
| | | import {onBeforeUnmount, onMounted, onUnmounted, reactive, ref} from "vue"; |
| | | import {useRouter} from "vue-router" |
| | | import {host, WebSocketHost} from '@/utils/constants' |
| | | import request from "@/utils/request" |
| | | import {closeWebSocket, initializeWebSocket} from '@/utils/WebSocketService'; |
| | | import {ElMessage, ElMessageBox} from 'element-plus' |
| | | import {useI18n} from 'vue-i18n' |
| | | const router = useRouter() |
| | | |
| | | import { ref } from 'vue' |
| | | import { ElMessage, ElMessageBox } from 'element-plus' |
| | | |
| | | const tableData = [ |
| | | { |
| | | id: '1', |
| | | long: '1005', |
| | | wide: '183.6', |
| | | thick: '1991', |
| | | type: '待识别', |
| | | typea: '1', |
| | | }, |
| | | { |
| | | id: '2', |
| | | long: '105', |
| | | wide: '183', |
| | | thick: '191', |
| | | typea: '1', |
| | | type: '待识别' |
| | | }, |
| | | { |
| | | id: '2', |
| | | long: '105', |
| | | wide: '183', |
| | | thick: '191', |
| | | typea: '1', |
| | | type: '待识别' |
| | | }, |
| | | ] |
| | | const open = () => { |
| | | ElMessageBox.confirm( |
| | | '是否删除该条信息?', |
| | | '提示', |
| | | { |
| | | confirmButtonText: '是', |
| | | cancelButtonText: '取消', |
| | | type: 'warning', |
| | | } |
| | | ) |
| | | .then(() => { |
| | | ElMessage({ |
| | | type: 'success', |
| | | message: '删除成功!', |
| | | }) |
| | | }) |
| | | .catch(() => { |
| | | ElMessage({ |
| | | type: 'info', |
| | | message: '删除失败', |
| | | }) |
| | | }) |
| | | } |
| | | const getTableRow = (row,type) =>{ |
| | | switch (type) { |
| | | case 'edit' :{ |
| | | //alert('我接收到子组件传送的编辑信息') |
| | | router.push({path: '/main/returns/createReturns', query: { ReturnID: 'TH24010101' }}) |
| | | break |
| | | } |
| | | case 'delete':{ |
| | | alert('我接收到子组件传送的删除信息') |
| | | break |
| | | const adda = ref(false) |
| | | const {t} = useI18n() |
| | | let language = ref(localStorage.getItem('lang') || 'zh') |
| | | const tableData = ref([]) |
| | | const blindb = ref(false) |
| | | const slot = ref('') |
| | | const requestData = { |
| | | line: 2001 |
| | | }; |
| | | const timeRange = ref([]) |
| | | const selectValuesa = reactive([]); |
| | | // 磨边任务查询 |
| | | const setEdgGlassInfoRequest = async () => { |
| | | let celllist=[] |
| | | let stateList=[] |
| | | if(selectValuesa[0]!=null&&selectValuesa[0]!='undefined'){ |
| | | if(selectValuesa[0]!=""){ |
| | | celllist=[selectValuesa[0]]; |
| | | } |
| | | } |
| | | } |
| | | |
| | | const gridOptions = reactive({ |
| | | border: "full",//表格加边框 |
| | | keepSource: true,//保持源数据 |
| | | align: 'center',//文字居中 |
| | | stripe:true,//斑马纹 |
| | | rowConfig: {isCurrent: true, isHover: true,height: 50},//鼠标移动或选择高亮 |
| | | id: 'OrderList', |
| | | showFooter: true,//显示脚 |
| | | printConfig: {}, |
| | | importConfig: {}, |
| | | exportConfig: {}, |
| | | scrollY:{ enabled: true },//开启虚拟滚动 |
| | | showOverflow:true, |
| | | columnConfig: { |
| | | resizable: true, |
| | | useKey: true |
| | | }, |
| | | filterConfig: { //筛选配置项 |
| | | remote: true |
| | | }, |
| | | customConfig: { |
| | | storage: true |
| | | }, |
| | | editConfig: { |
| | | trigger: 'click', |
| | | mode: 'row', |
| | | showStatus: true |
| | | }, |
| | | data: [ |
| | | { |
| | | 'id': '1', |
| | | 'long': '5', |
| | | 'wide': '1005', |
| | | 'thick': '183.6', |
| | | if(selectValuesa[1]!=null&&selectValuesa[1]!='undefined'){ |
| | | if(selectValuesa[1]!=""){ |
| | | stateList=[selectValuesa[1]]; |
| | | } |
| | | ], |
| | | }) |
| | | |
| | | } |
| | | const response = await request.post("/cacheGlass/edgGlassTaskInfo/setEdgGlassInfoRequest", { |
| | | cellList: celllist, |
| | | stateList: stateList, |
| | | beginDate: timeRange.value[0], |
| | | endDate: timeRange.value[1], |
| | | }) |
| | | if (response.code === 200) { |
| | | ElMessage.success(response.message); |
| | | } else { |
| | | ElMessage.error(response.message); |
| | | } |
| | | } |
| | | // 破损 |
| | | const open = async(row) => { |
| | | try { |
| | | const confirmResult = await ElMessageBox.confirm( |
| | | t('workOrder.messagedamaged'), |
| | | t('workOrder.prompt'), |
| | | { |
| | | confirmButtonText: t('workOrder.yes'), |
| | | cancelButtonText: t('workOrder.cancel'), |
| | | type: 'warning', |
| | | } |
| | | ); |
| | | if (confirmResult === 'confirm') { |
| | | const response = await request.post("/cacheGlass/edgStorageCage/edgReportStatus", { |
| | | glassId: row.glassId, |
| | | state: 8, |
| | | line: row.line, |
| | | workingProcedure: '磨边', |
| | | }) |
| | | if (response.code === 200) { |
| | | ElMessage.success(response.message); |
| | | } else { |
| | | ElMessage.error(response.msg); |
| | | } |
| | | } |
| | | } catch (error) { |
| | | } |
| | | }; |
| | | // 拿走 |
| | | const opena = async(row) => { |
| | | try { |
| | | const confirmResult = await ElMessageBox.confirm( |
| | | t('workOrder.takemessage'), |
| | | t('workOrder.prompt'), |
| | | { |
| | | confirmButtonText: t('workOrder.yes'), |
| | | cancelButtonText: t('workOrder.cancel'), |
| | | type: 'warning', |
| | | } |
| | | ); |
| | | if (confirmResult === 'confirm') { |
| | | const response = await request.post("/cacheGlass/edgStorageCage/edgReportStatus", { |
| | | glassId: row.glassId, |
| | | state: 9, |
| | | line: row.line, |
| | | workingProcedure: '磨边', |
| | | }) |
| | | if (response.code === 200) { |
| | | ElMessage.success(response.message); |
| | | } else { |
| | | ElMessage.error(response.msg); |
| | | } |
| | | } |
| | | } catch (error) { |
| | | } |
| | | }; |
| | | let socket = null; |
| | | const socketUrl = `ws://${WebSocketHost}:${host}/api/cacheGlass/api/talk/edgTasks`; |
| | | const handleMessage = (data) => { |
| | | const formattedTasks = data.edgTasks[0].map(cageInfo => { |
| | | if (cageInfo && cageInfo.createTime) { |
| | | cageInfo.formattedCreateTime = formatTimestamp(cageInfo.createTime); |
| | | } |
| | | return cageInfo; |
| | | }); |
| | | tableData.value = formattedTasks |
| | | }; |
| | | // 历史任务 |
| | | const iframeUrl = ref(''); |
| | | const handlehistorical = (row) => { |
| | | blindb.value = true; |
| | | iframeUrl.value = `${window.location.origin}/#/StockBasicData/stockhistory`; |
| | | }; |
| | | onMounted(() => { |
| | | socket = initializeWebSocket(socketUrl, handleMessage); |
| | | }); |
| | | onUnmounted(() => { |
| | | if (socket) { |
| | | closeWebSocket(socket); |
| | | } |
| | | }); |
| | | function getStatusTypeb(state) { |
| | | switch (state) { |
| | | case 0: |
| | | return 'info'; |
| | | case 1: |
| | | return 'success'; |
| | | case 1: |
| | | return 'danger'; |
| | | } |
| | | } |
| | | function getStatusTextb(state) { |
| | | switch (state) { |
| | | case 0: |
| | | return t('workOrder.nedging'); |
| | | case 1: |
| | | return t('workOrder.edging'); |
| | | case 2: |
| | | return t('workOrder.finedging'); |
| | | } |
| | | } |
| | | function formatTimestamp(timestamp) { |
| | | const date = new Date(timestamp); |
| | | const year = date.getFullYear(); |
| | | const month = String(date.getMonth() + 1).padStart(2, '0'); // 月份从0开始,需要加1,并补零 |
| | | const day = String(date.getDate()).padStart(2, '0'); // 补零 |
| | | const hours = String(date.getHours()).padStart(2, '0'); // 补零(如果需要显示时间) |
| | | const minutes = String(date.getMinutes()).padStart(2, '0'); // 补零(如果需要显示时间) |
| | | const seconds = String(date.getSeconds()).padStart(2, '0'); // 补零(如果需要显示时间) |
| | | return `${year}-${month}-${day} ${hours}:${minutes}:${seconds}`; |
| | | } |
| | | onBeforeUnmount(() => { |
| | | closeWebSocket(); |
| | | }); |
| | | </script> |
| | | |
| | | <template> |
| | | <div> |
| | | <el-card style="flex: 1;margin-left: 10px;margin-top: 5px;" v-loading="loading"> |
| | | <div style="width: 98%; height: calc(100% - 35px); overflow-y: auto;max-height: 200px;"> |
| | | <el-table height="100%" ref="table" |
| | | <div style="height: 500px;"> |
| | | <div> |
| | | <el-card style="flex: 1;margin-left: 10px;margin-top: 20px;" > |
| | | <div style="display: flex;"> |
| | | <!-- <el-button style="margin-left: 20px;" id="searchButton" type="success" @click="handlehistorical">{{ |
| | | $t('searchOrder.historicaltasks') |
| | | }} |
| | | </el-button> --> |
| | | <el-select v-model="selectValuesa[0]" filterable :placeholder="$t('workOrder.cway')" clearable |
| | | style="margin-left: 20px;margin-bottom: 10px;"> |
| | | <el-option :label="$t('workOrder.edgingone')" value="930"></el-option> |
| | | <el-option :label="$t('workOrder.edgingtwo')" value="931"></el-option> |
| | | </el-select> |
| | | <el-select v-model="selectValuesa[1]" filterable :placeholder="$t('workOrder.cstate')" clearable |
| | | style="margin-left: 20px;margin-bottom: 10px;"> |
| | | <el-option :label="$t('workOrder.nedging')" value="0"></el-option> |
| | | <el-option :label="$t('workOrder.edging')" value="1"></el-option> |
| | | <el-option :label="$t('workOrder.finedging')" value="2"></el-option> |
| | | </el-select> |
| | | <span class="demonstration" style="margin-left: 20px;margin-top: 3px;">{{ $t('workOrder.time') }}</span> |
| | | <el-date-picker v-model="timeRange" type="datetimerange" range-separator="至" :start-placeholder="$t('reportmanage.starttime')" style="margin-left: 15px;" value-format = "YYYY-MM-DD hh:mm:ss" |
| | | :end-placeholder="$t('reportmanage.endtime')"> |
| | | </el-date-picker> |
| | | <el-button type="primary" style="margin-left: 10px;margin-bottom: 10px;" @click="setEdgGlassInfoRequest()">{{ |
| | | $t('reportmanage.inquire') |
| | | }}</el-button> |
| | | </div> |
| | | <div style="width: 98%; height: calc(100% - 35px); overflow-y: auto;"> |
| | | <el-table height="750" ref="table" |
| | | @selection-change="handleSelectionChange" |
| | | :data="tableData" :header-cell-style="{background:'#F2F3F5 ',color:'#1D2129'}"> |
| | | <el-table-column prop="id" align="center" label="id" min-width="80" /> |
| | | <el-table-column prop="long" align="center" label="长" min-width="120" /> |
| | | <el-table-column prop="wide" align="center" label="宽" min-width="120" /> |
| | | <el-table-column prop="wide" align="center" label="厚度" min-width="120" /> |
| | | <el-table-column prop="wide" align="center" label="膜系" min-width="120" /> |
| | | <el-table-column prop="wide" align="center" label="出片顺序" min-width="120" /> |
| | | <el-table-column prop="wide" align="center" label="流程卡号" min-width="120" /> |
| | | <el-table-column prop="wide" align="center" label="其他" min-width="120" /> |
| | | <el-table-column fixed="right" label="操作" align="center" width="200"> |
| | | <template #default> |
| | | <el-button size="mini" type="text" plain @click="dialogFormVisiblea = true">破损</el-button> |
| | | <el-button size="mini" type="text" plain @click="dialogFormVisiblea = true">删除</el-button> |
| | | </template> |
| | | <el-table-column prop="glassId" align="center" :label="$t('workOrder.glassID')" min-width="180" /> |
| | | <el-table-column prop="width" align="center" :label="$t('workOrder.width')" min-width="120" /> |
| | | <el-table-column prop="height" align="center" :label="$t('workOrder.height')" min-width="80" /> |
| | | <el-table-column prop="thickness" align="center" :label="$t('workOrder.thickness')" min-width="120" /> |
| | | <el-table-column prop="filmsid" align="center" :label="$t('workOrder.glasstype')" min-width="120" /> |
| | | <el-table-column prop="line" align="center" :label="$t('workOrder.line')" min-width="120" /> |
| | | <el-table-column prop="formattedCreateTime" align="center" :label="$t('workOrder.time')" min-width="120" /> |
| | | <el-table-column prop="state" :label="$t('workOrder.status')" align="center" width="200"> |
| | | <!-- <template #default="scope"> |
| | | {{ scope.row.status==0?"未磨边":scope.row.status==1?"磨边中":"已磨边" }} |
| | | </template> --> |
| | | <template #default="scope"> |
| | | <el-tag :type="getStatusTypeb(scope.row.state)"> |
| | | {{ getStatusTextb(scope.row.state) }} |
| | | </el-tag> |
| | | </template> |
| | | </el-table-column> |
| | | <el-table-column fixed="right" :label="$t('workOrder.operate')" align="center" width="200"> |
| | | <template #default="scope"> |
| | | <el-button type="text" plain @click="open(scope.row)">{{ |
| | | $t('workOrder.breakage') |
| | | }} |
| | | </el-button> |
| | | <el-button type="text" plain @click="opena(scope.row)">{{ |
| | | $t('workOrder.takeout') |
| | | }} |
| | | </el-button> |
| | | </template> |
| | | </el-table-column> |
| | | </el-table> |
| | | </div> |
| | | </el-card> |
| | | |
| | | </el-card> |
| | | </div> |
| | | <!-- 历史任务 --> |
| | | <el-dialog v-model="blindb" top="10vh" width="95%" @close="iframeUrl=''"> |
| | | <iframe |
| | | :src="iframeUrl" |
| | | marginwidth="2000px" |
| | | marginheight="2000px" |
| | | width="100%" |
| | | height="700px" |
| | | frameborder="0" |
| | | ></iframe> |
| | | </el-dialog> |
| | | </div> |
| | | </template> |
| | | |
| | | <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{ |
| | |
| | | margin-left: 28%; |
| | | } |
| | | #awatch{ |
| | | height: 450px; |
| | | } |
| | | #main-body{ |
| | | margin-top: -20px; |
| | | margin-left: 300px; |
| | | } |
| | | #main-bodya{ |
| | | margin-top: -10px; |
| | | margin-left: 100px; |
| | | height: 460px; |
| | | /* margin-top: -60px; */ |
| | | } |
| | | </style> |