From e944a85425e1404f894e28be4735979d69466305 Mon Sep 17 00:00:00 2001
From: haoxuan <haoxuan>
Date: 星期一, 06 十一月 2023 17:43:15 +0800
Subject: [PATCH] 更新工艺接口联调，工艺详情的数据对接，工艺列表的更新状态和工艺详情的更新状态保持一致的逻辑
---
src/views/dashboard/components/ProcessInfo.vue | 57 ++++++++++++++++---
src/views/dashboard/index.vue | 49 +++++++++++++++
src/components.d.ts | 1
src/views/dashboard/components/CraftDetailModal.vue | 71 ++++++++++++++---------
src/auto-imports.d.ts | 2
5 files changed, 139 insertions(+), 41 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/components.d.ts b/src/components.d.ts
index ab30609..5374a8f 100644
--- a/src/components.d.ts
+++ b/src/components.d.ts
@@ -10,7 +10,6 @@
AlertLightIcon: typeof import('./components/icons/AlertLightIcon.vue')['default']
BaseModal: typeof import('./components/BaseModal.vue')['default']
CommonModal: typeof import('./components/CommonModal.vue')['default']
- copy: typeof import('./components/BaseModal copy.vue')['default']
DashboardLayout: typeof import('./components/DashboardLayout.vue')['default']
ElButton: typeof import('element-plus/es')['ElButton']
ElCollapse: typeof import('element-plus/es')['ElCollapse']
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 65ab682..fcc3045 100644
--- a/src/views/dashboard/components/ProcessInfo.vue
+++ b/src/views/dashboard/components/ProcessInfo.vue
@@ -11,30 +11,57 @@
<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" class="color_organge" @click="onUpdateClick"> 鏇存柊宸ヨ壓 </el-button>
+ <!-- :disabled="craftModel.isUpdate?false:true" -->
+ <el-button type="primary" class="color_organge" @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)
+ emit('detail', craftModel.value)
}
function onUpdateClick() {
- emit('update', craftModel)
+ if (loading.value) {
+ return true
+ }
+ emit('update', craftModel.value)
}
</script>
@@ -42,12 +69,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 +97,11 @@
img {
width: 100%;
}
+ }
+ .refresh-top-icon {
+ display: flex;
+ align-items: center;
+ color: #fff;
}
.item-r {
@@ -114,12 +147,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>
diff --git a/src/views/dashboard/index.vue b/src/views/dashboard/index.vue
index d006860..1bb3da9 100644
--- a/src/views/dashboard/index.vue
+++ b/src/views/dashboard/index.vue
@@ -20,7 +20,10 @@
v-for="item in craftModelStore.craftModelList"
:key="item.ID"
:craft-model="item"
+ :task="activeTask"
+ :active-arr="activeArr"
@detail="openCraftModelDetailModal"
+ @update="updateCraft"
></ProcessInfo>
</el-scrollbar>
</el-tab-pane>
@@ -64,13 +67,20 @@
<BigButton class="btn" bg-color="red">绾㈢伅鍛煎彨</BigButton>
</template>
</DashboardLayout>
- <CraftDetailModal v-model="showCraftModelDetail" @close="showCraftModelDetail = false"></CraftDetailModal>
+ <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 } from 'vue'
import ChannelCollapse from '@/views/dashboard/components/ChannelCollapse.vue'
import type { Worker, Order, 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'
@@ -94,6 +104,7 @@
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'
defineOptions({
name: 'DashboardView'
@@ -157,9 +168,43 @@
craftModelStore.getCraftModelList()
const showCraftModelDetail = ref(false)
-function openCraftModelDetailModal() {
+// 褰撳墠瑕佸睍绀虹殑宸ヨ壓璇︽儏
+const currentCraftModelInfo = ref<CraftModel>()
+const activeArr = ref([])
+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'
+ })
+ }
+ },
+ (err) => {
+ console.error(err, '----err')
+ setTimeout(() => {
+ editActive(craftModel)
+ }, 3000000)
+ }
+ )
+ }
+}
+function editActive(craftModel: CraftModel) {
+ for (let i in activeArr.value) {
+ if (activeArr.value[i] == craftModel.number) {
+ activeArr.value.splice(i, 1)
+ }
+ }
+}
// 鏄惁灞曠ず鐗╂枡璇︽儏寮圭獥
const showMaterialDetail = ref(false)
--
Gitblit v1.8.0