From c7f3fd5215399b37d0511b3bd555150ff1b13507 Mon Sep 17 00:00:00 2001 From: charles <981744753@qq.com> Date: 星期一, 29 四月 2024 10:39:30 +0800 Subject: [PATCH] fix:回退原先版本 --- src/views/dashboard/index.vue | 231 ++++++++++++++++++++++++++++++++++++++++++++++++--------- 1 files changed, 192 insertions(+), 39 deletions(-) diff --git a/src/views/dashboard/index.vue b/src/views/dashboard/index.vue index c733a51..c301129 100644 --- a/src/views/dashboard/index.vue +++ b/src/views/dashboard/index.vue @@ -7,7 +7,7 @@ <ChannelCollapse :channels="channels"></ChannelCollapse> </template> <template #middleBlock1> - <DashboardTitle></DashboardTitle> + <DashboardTitle @should-reload="reloadAllData"></DashboardTitle> </template> <template #middleBlock2> <el-tabs v-model="activeMainTabName" class="main-info-tabs"> @@ -15,18 +15,55 @@ <ProcessingInfo style="margin-top: 6px" :task="activeTask"></ProcessingInfo> </el-tab-pane> <el-tab-pane label="宸ヨ壓淇℃伅" name="宸ヨ壓淇℃伅"> - <ProcessInfo :process="process"></ProcessInfo> + <div style="height: 300px"> + <el-scrollbar always class="scroller" style="height: 100%"> + <div + v-infinite-scroll="craftModelStore.loadMore" + infinite-scroll-delay="500" + infinite-scroll-distance="40" + style="display: flex; align-items: center; flex-wrap: wrap" + > + <ProcessInfo + v-for="item in craftModelStore.craftModelList" + :key="item.ID" + :task="activeTask" + :active-arr="activeArr" + :craft-model="item" + @detail="openCraftModelDetailModal" + @update="updateCraft" + ></ProcessInfo> + </div> + <div class="craft-loaded-tip"> + <el-icon v-if="craftModelStore.loading" class="is-loading" size="30"> + <Loading /> + </el-icon> + + <div v-if="!craftModelStore.hasMore && craftModelStore.craftModelList.length > 6">鍔犺浇瀹屾垚</div> + </div> + </el-scrollbar> + </div> </el-tab-pane> - <el-tab-pane label="鐗╂枡娓呭崟" name="鐗╂枡娓呭崟">Role</el-tab-pane> + <el-tab-pane label="鐗╂枡娓呭崟" name="鐗╂枡娓呭崟"> + <InputMaterialsList + :material-list="activeTask?.Procedure?.procedure?.inputMaterials" + @detail-click="showMaterialDetailModal" + ></InputMaterialsList> + <OutputMaterialsList + :material-list="activeTask?.Procedure?.procedure?.outputMaterials" + @detail-click="showMaterialDetailModal" + ></OutputMaterialsList> + </el-tab-pane> </el-tabs> </template> <template #middleBlock3> <SubTitle>浠诲姟璇︽儏</SubTitle> <div class="task-detail"> - <TaskControl :task="activeTask" @should-reload="reloadAllData"></TaskControl> + <el-scrollbar always class="scroller"> + <TaskControl :task="activeTask" :workers="currentWorkers" @should-reload="reloadChannel"></TaskControl> + <ColorInfo :type="1"></ColorInfo> + <ColorInfo :type="2"></ColorInfo> + </el-scrollbar> </div> - <ColorInfo :order="order" :type="1"></ColorInfo> - <ColorInfo :order="order" :type="2"></ColorInfo> </template> <template #middleBlock4> <SubTitle>浜哄憳淇℃伅</SubTitle> @@ -38,28 +75,43 @@ </div> </template> <template #rightBlock2> - <DeviceStatusInfo :plc="plcStore.plcInfo" :type="1"></DeviceStatusInfo> + <DeviceStatusInfo :type="1"></DeviceStatusInfo> <DeviceStatusInfo :device="deviceStore.deviceInfo" :type="2"></DeviceStatusInfo> - <DeviceNumberInfo></DeviceNumberInfo> - </template> + <DeviceNumberInfo></DeviceNumberInfo> </template + >褰撳墠浠诲姟: <template #rightBlock3> <SubTitle>鐭ヨ瘑搴�</SubTitle> - <KnowledgeInfo></KnowledgeInfo> + <div class="task-detail-right-3"> + <el-scrollbar always class="scroller"> + <KnowledgeInfo></KnowledgeInfo> + </el-scrollbar> + </div> <BigButton class="btn" bg-color="red">绾㈢伅鍛煎彨</BigButton> </template> </DashboardLayout> + <CraftDetailModal + v-model="showCraftModelDetail" + :active-arr="activeArr" + :craft-model="currentCraftModelInfo" + @renew="updateCraft" + @close="showCraftModelDetail = false" + ></CraftDetailModal> + <MaterialDetails v-model="showMaterialDetail" :material="currentMaterialInfo"></MaterialDetails> </template> <script setup lang="ts"> -import { computed, ref, watch, onUnmounted } from 'vue' +import { computed, ref } from 'vue' import ChannelCollapse from '@/views/dashboard/components/ChannelCollapse.vue' -import type { Worker, Order, Task } from '@/api/task' -import type { PLCResponse } from '@/api/plc' + +import type { Task, Material } from '@/api/task' +import type { CraftModel } from '@/api/craftModel' import PersonInfo from '@/views/dashboard/components/PersonInfo.vue' import ProcessInfo from '@/views/dashboard/components/ProcessInfo.vue' import ColorInfo from '@/views/dashboard/components/ColorInfo.vue' import DeviceStatusInfo from '@/views/dashboard/components/DeviceStatusInfo.vue' import DeviceNumberInfo from '@/views/dashboard/components/DeviceNumberInfo.vue' import KnowledgeInfo from '@/views/dashboard/components/KnowledgeInfo.vue' +import InputMaterialsList from '@/views/dashboard/components/InputMaterialsList.vue' +import OutputMaterialsList from '@/views/dashboard/components/OutputMaterialsList.vue' import BigButton from '@/views/dashboard/components/BigButton.vue' import type { LabelValue } from '@/views/dashboard/components/TaskTabs.vue' import TaskTabs from '@/views/dashboard/components/TaskTabs.vue' @@ -70,8 +122,17 @@ import TaskControl from '@/views/dashboard/components/TaskControl.vue' import SubTitle from '@/views/dashboard/components/SubTitle.vue' import DashboardTitle from '@/views/dashboard/components/DashboardTitle.vue' -import { usePLCStore } from '@/stores/plc' +// import { usePLCStore } from '@/stores/plc' import { useDevicesStore } from '@/stores/devices' +import { useCraftModelStore } from '@/stores/craftModel' +import CraftDetailModal from '@/views/dashboard/components/CraftDetailModal.vue' +import MaterialDetails from '@/views/dashboard/components/MaterialDetails.vue' + +import { updateCraftParams } from '@/api' +import { Loading } from '@element-plus/icons-vue' +import { isNumber } from 'lodash-es' +import { getToken } from '@/common/utils/index' +const token = getToken() defineOptions({ name: 'DashboardView' @@ -83,23 +144,6 @@ return taskStore.activeTask?.Procedure?.procedure?.workers ?? [] }) -const process = computed(() => { - return { product: '浜у搧鍚嶇О', number: '111', procedure: '宸ヨ壓鍚嶇О', isUpdate: true } as any -}) - -const order = computed(() => { - return { - finishNumber: 0, - unit: '涓�', - amount: '10' - } as unknown as Order -}) -const device = computed(() => { - return { - plcStatus: 1, - plcNotConnected: false - } as unknown as PLCResponse -}) const taskTabsList = [ { label: '鏈畬鎴�', @@ -119,22 +163,104 @@ const tasksStore = useTasksStore() const { activeTask, channels } = storeToRefs(tasksStore) -tasksStore.getChannels(1) +tasksStore.getChannels(1, true) function changeTab(tab: LabelValue) { tasksStore.getChannels(tab.value) } -function reloadAllData(task: Task) { - tasksStore.reload(task.Channel) +/** + * 瀹屾垚浠诲姟鎴栬�呬笅鍙戝弬鏁版垚鍔熷悗瑕佸埛鏂伴�氶亾鏁版嵁 + * @param task + */ +function reloadChannel(task: Task) { + if (token !== null || token !== '' || token !== 'undefined') { + tasksStore.reloadChannel(task.Channel) + location.reload() + } } -const plcStore = usePLCStore() +function reloadAllData() { + tasksStore.reloadAllData() + location.reload() +} // 鍚姩plc 杞 -plcStore.startPollingPLC() - +// const plcStore = usePLCStore() +// plcStore.startPollingPLC() +// 鍚姩 璁惧 杞 const deviceStore = useDevicesStore() deviceStore.startPollingDevice() +// console.log(deviceStore, '1111') +// localStorage.setItem('currentDeviceID', deviceStore.deviceInfo.currentDeviceID) + +// 鍒囨崲浠诲姟鏃惰幏鍙栧搴斾换鍔$殑宸ヨ壓妯″瀷淇℃伅 +const craftModelStore = useCraftModelStore() +craftModelStore.getCraftModelList() + +const showCraftModelDetail = ref(false) +// 褰撳墠瑕佸睍绀虹殑宸ヨ壓璇︽儏 +const currentCraftModelInfo = ref<CraftModel>() +const activeArr = ref<string[]>([]) +function openCraftModelDetailModal(craftModel: CraftModel) { + currentCraftModelInfo.value = craftModel + showCraftModelDetail.value = true +} +// 鏇存柊宸ヨ壓 +function updateCraft(craftModel: CraftModel) { + if (activeTask?.value?.Procedure?.ID) { + activeArr.value.push(craftModel.number) + updateCraftParams({ procedureId: activeTask!.value.Procedure.ID }).then( + (res) => { + if (res.code == 200) { + editActive(craftModel) + ElMessage({ + message: '鏇存柊鎴愬姛锛�', + type: 'success' + }) + craftModelStore.getCraftModelList() + } + }, + (err) => { + console.error(err, '----err') + setTimeout(() => { + editActive(craftModel) + }, 300) + } + ) + } +} +function editActive(craftModel: CraftModel) { + for (let i in activeArr.value) { + if (activeArr.value[i] == craftModel.number) { + activeArr.value.splice(Number(i), 1) + } + } +} + +// 鏄惁灞曠ず鐗╂枡璇︽儏寮圭獥 +const showMaterialDetail = ref(false) +// 褰撳墠瑕佸睍绀虹殑鐗╂枡璇︽儏 +const currentMaterialInfo = ref<Material>() + +/** + * 鏄剧ず鐗╂枡璇︽儏寮圭獥 + * @param material + */ +function showMaterialDetailModal(material: Material) { + currentMaterialInfo.value = material + showMaterialDetail.value = true +} + +const currentWorkers = computed(() => { + const channel = activeTask.value?.Channel + if (isNumber(channel)) { + console.log(activeTask.value?.Procedure?.procedure?.workers, '99999') + // return [] + return activeTask.value?.Procedure?.procedure?.workers ?? [] + } else { + return [] + } +}) </script> <style scoped lang="scss"> @@ -144,9 +270,17 @@ display: flex; align-items: center; justify-content: center; - padding-top: 12px; + padding-top: 22px; } - +:deep(.el-tabs) { + height: 100%; +} +:deep(.el-tab-pane) { + height: 100%; +} +:deep(.el-tabs__content) { + height: calc(100% - 56px); +} :deep(.el-tabs__item) { color: #fff; font-size: 20px; @@ -176,4 +310,23 @@ width: 100%; font-size: 20px; } +.craft-loaded-tip { + height: 40px; + text-align: center; + display: flex; + align-items: center; + justify-content: center; +} +.scroller { + padding: 4px 10px; +} +.task-detail { + width: 100%; + height: calc(100% - 32px); + padding-right: 5px; +} +.task-detail-right-3 { + width: 100%; + height: calc(100% - 32px - 50px); +} </style> -- Gitblit v1.8.0