From 75c41cc8a2f25cff74e976cdc7851cbaddd97b3f Mon Sep 17 00:00:00 2001 From: haoxuan <haoxuan> Date: 星期一, 06 十一月 2023 17:58:39 +0800 Subject: [PATCH] 和代码 --- src/views/dashboard/components/ProcessInfo.vue | 52 +++++++++++++++-- src/stores/devices.ts | 3 + src/views/dashboard/components/CraftDetailModal.vue | 71 ++++++++++++++--------- src/auto-imports.d.ts | 2 4 files changed, 92 insertions(+), 36 deletions(-) diff --git a/src/auto-imports.d.ts b/src/auto-imports.d.ts index 1d89ee8..78813d8 100644 --- a/src/auto-imports.d.ts +++ b/src/auto-imports.d.ts @@ -5,5 +5,5 @@ // Generated by unplugin-auto-import export {} declare global { - + const ElMessage: typeof import('element-plus/es')['ElMessage'] } diff --git a/src/stores/devices.ts b/src/stores/devices.ts index 26d7162..a23d468 100644 --- a/src/stores/devices.ts +++ b/src/stores/devices.ts @@ -7,6 +7,9 @@ export const useDevicesStore = defineStore('device', () => { const deviceInfo = computed(() => { + if (deviceInfo?.value) { + deviceRes.value.data.currentDeviceID = 'wwwwwwww222222' + } return deviceRes?.value?.data as Devices }) diff --git a/src/views/dashboard/components/CraftDetailModal.vue b/src/views/dashboard/components/CraftDetailModal.vue index 22c3030..81e00c0 100644 --- a/src/views/dashboard/components/CraftDetailModal.vue +++ b/src/views/dashboard/components/CraftDetailModal.vue @@ -2,18 +2,18 @@ <div class="craft-detail-modal"> <BaseModal v-model="modelData" :wider="true" @close="closeModal"> <template #title>宸ヨ壓璇︽儏 </template> - <div class="modal-content"> + <div v-if="craftModel" class="modal-content"> <el-scrollbar always class="scroller"> - <div :class="processObj.isUpdate ? 'modal-t margin_bottom_20' : 'modal-t modal-t-two'"> + <div :class="!craftModel?.isUpdate ? 'modal-t margin_bottom_20' : 'modal-t modal-t-two'"> <div class="modal-t-l"> - <div class="modal-t-l-t">{{ processObj.procedure }}</div> + <div class="modal-t-l-t">{{ craftModel?.procedure }}</div> <div class="modal-t-l-b"> - <span v-for="(item, index) in processObj.paramsMap" :key="index"> {{ index }} : {{ item }}锛� </span> + <span v-for="(item, index) in craftModel?.paramsMap" :key="index"> {{ index }} : {{ item }}锛� </span> </div> </div> - <div class="modal-t-r">宸ヨ壓缂栧彿锛歿{ processObj.number }}</div> + <div class="modal-t-r">宸ヨ壓缂栧彿锛歿{ craftModel?.number }}</div> </div> - <div v-if="processObj.isUpdate" class="modal-b"> + <div v-if="!craftModel?.isUpdate" class="modal-b"> <div class="modal-b-t">鏇存柊璁剧疆</div> <template v-if="isUpdate == 1"> <div class="modal-b-m"> @@ -23,25 +23,25 @@ </el-icon> </div> <div class="modal-b-m-r"> - <span>宸叉鏌ュ埌鏂扮増鏈細{{ processObj.newNumber }}</span> + <span>宸叉鏌ュ埌鏂扮増鏈細{{ craftModel?.newNumber }}</span> <BigButton class="btn" bg-color="#4343f5" @click="updateProcess">鏇存柊宸ヨ壓</BigButton> </div> </div> <div class="modal-b-b"> <div class="modal-b-b-l"> - <div class="modal-b-b-l-t">{{ processObj.procedure }}</div> + <div class="modal-b-b-l-t">{{ craftModel?.procedure }}</div> <div class="modal-b-b-l-b"> - <span v-for="(item, index) in processObj.newParamsMap" :key="index"> + <span v-for="(item, index) in craftModel?.newParamsMap" :key="index"> {{ index }} : {{ item }}锛� </span> </div> </div> - <div class="modal-b-b-r">鏂扮増鏈細{{ processObj.newNumber }}</div> + <div class="modal-b-b-r">鏂扮増鏈細{{ craftModel?.newNumber }}</div> </div> </template> <template v-else-if="isUpdate == 2"> <div class="refresh-box"> - <template v-if="isLoading"> + <template v-if="loading"> <el-icon class="refresh-icon transform"> <Refresh /> </el-icon> @@ -65,42 +65,54 @@ import { Refresh, Top } from '@element-plus/icons-vue' import { useVModel } from '@vueuse/core' import BigButton from '@/views/dashboard/components/BigButton.vue' -import { ref } from 'vue' +import { ref, toRefs, watch } from 'vue' +import type { CraftModel } from '@/api/craftModel' export interface CraftDetailModalProps { + craftModel?: CraftModel + activeArr: Array modelValue: boolean } const props = withDefaults(defineProps<CraftDetailModalProps>(), { + craftModel: undefined, modelValue: false }) - +const { craftModel, activeArr, modelValue } = toRefs(props) const emit = defineEmits<{ 'update:modelValue': [show: boolean] close: [] + renew: [craftModel: CraftModel, true] }>() const modelData = useVModel(props, 'modelValue', emit) - function closeModal() { emit('close') } -const processObj = { - isUpdate: 1, //1==鏃犱笅闈㈢殑鏇存柊璁剧疆 2==鏈夋洿鏂拌缃� - procedure: '111', - number: 111, - paramsMap: { - 鍘嬪己: 111 - }, - newNumber: '鏂�222', - newParamsMap: { - 鍘嬪己: 222 - } -} // 鏈夋洿鏂拌缃殑鍒濆鍊� const isUpdate = ref(1) -const isLoading = ref(false) +const loading = ref(false) +watch(modelData, () => { + // 寮圭獥鏄剧ず鏃惰幏鍙栧伐鑹哄弬鏁� + if (modelData.value) { + getLoading() + } +}) +function getLoading() { + for (let i in activeArr.value) { + if (activeArr.value[i] == craftModel.value.number) { + isUpdate.value = 2 + loading.value = true + return true + } + } + isUpdate.value = 1 +} + function updateProcess() { isUpdate.value = 2 - isLoading.value = true + if (active.value) { + return true + } // 璇锋眰鏇存柊鎺ュ彛 鑾峰緱鏁版嵁涔嬪悗isLoading.value=false; + emit('renew', craftModel.value, true) } //TODO: 宸ヨ壓璇︽儏寮圭獥 </script> @@ -156,6 +168,9 @@ overflow: auto; width: calc(100% - 60px); margin: 0 auto; + :deep(.el-scrollbar__view) { + height: 100%; + } .modal-t-two { height: calc(100% - 55px) !important; } diff --git a/src/views/dashboard/components/ProcessInfo.vue b/src/views/dashboard/components/ProcessInfo.vue index 95ba326..859f890 100644 --- a/src/views/dashboard/components/ProcessInfo.vue +++ b/src/views/dashboard/components/ProcessInfo.vue @@ -11,29 +11,55 @@ <div v-if="craftModel.isUpdate" class="tip-r"> <img src="~@/assets/images/process-tip.png" /> </div> - <div v-if="craftModel.isUpdate" class="tip-current">褰撳墠浣跨敤</div> + <div v-if="craftModel.number == task?.Procedure?.processModelNumber" class="tip-current">褰撳墠浣跨敤</div> <div class="btn"> - <el-button type="primary" @click="onUpdateClick"> 鏇存柊宸ヨ壓 </el-button> + <el-button type="primary" :disabled="craftModel.isUpdate ? false : true" @click="onUpdateClick"> + <el-icon v-if="loading" color="#fff" :size="16" class="refresh-top-icon"> + <Loading /> + </el-icon> + 鏇存柊宸ヨ壓 + </el-button> </div> </div> </template> <script setup lang="ts"> -import { toRefs } from 'vue' +import { toRefs, ref, watch } from 'vue' +import { Loading } from '@element-plus/icons-vue' import type { CraftModel } from '@/api/craftModel' +import type { Task } from '@/api/task' const props = defineProps<{ craftModel: CraftModel + activeArr: Array + task?: Task }>() -const { craftModel } = toRefs(props) +const { craftModel, task, activeArr } = toRefs(props) const emit = defineEmits<{ update: [craftModel: CraftModel] detail: [craftModel: CraftModel] }>() - +const loading = ref(false) +watch(activeArr.value, () => { + // 寮圭獥鏄剧ず鏃惰幏鍙栧伐鑹哄弬鏁� + if (activeArr.value) { + getLoading() + } +}) +function getLoading() { + for (let i in activeArr.value) { + if (activeArr.value[i] == craftModel.value.number) { + loading.value = true + break + } + } +} function onDetailClick() { emit('detail', craftModel.value) } function onUpdateClick() { + if (loading.value) { + return true + } emit('update', craftModel.value) } </script> @@ -42,12 +68,13 @@ $status-running: #f76c0f; $status-done: #2c5dbb82; $status-ready: #00ff00f0; +$status-disabled: #7b95d3; .font_weight { font-weight: 600; } .process-info { width: calc(50% - 35px); - height: 110px; + height: 140px; padding: 23px 10px 10px; background: $status-done; border-radius: 8px; @@ -69,6 +96,11 @@ img { width: 100%; } + } + .refresh-top-icon { + display: flex; + align-items: center; + color: #fff; } .item-r { @@ -114,12 +146,18 @@ .btn { width: 100px; position: absolute; - right: 0px; + right: 10px; bottom: 10px; .el-button--primary { background: $status-running; border: 0 !important; } + .el-button.is-disabled, + .el-button.is-disabled:focus, + .el-button.is-disabled:hover { + color: #fff !important; + background: $status-disabled; + } } } </style> -- Gitblit v1.8.0