From 2096f22b858727a449947ffaa68197ad96104d71 Mon Sep 17 00:00:00 2001
From: songshankun <songshankun@foxmail.com>
Date: 星期四, 09 十一月 2023 15:28:10 +0800
Subject: [PATCH] feat: 添加设备配置弹窗, 调整任务控制弹窗适配无工艺参数时允许不允许生产的情况
---
src/views/dashboard/components/DeliverParamsConfigModal.vue | 96 ++++++++++++++++++++++++++++++++
src/stores/devices.ts | 10 +++
src/components.d.ts | 2
src/api/device.ts | 2
src/api/index.ts | 19 +++++
src/views/dashboard/components/DashboardTitle.vue | 21 +++++++
src/views/dashboard/components/TaskControlModal.vue | 13 +++-
7 files changed, 157 insertions(+), 6 deletions(-)
diff --git a/src/api/device.ts b/src/api/device.ts
index f102b7b..1cd58f4 100644
--- a/src/api/device.ts
+++ b/src/api/device.ts
@@ -1,6 +1,8 @@
export interface DeviceMap {
deviceID: string
deviceName: string
+ /** true鏃舵病鏈夊伐鑹哄弬鏁颁笉鍏佽涓嬪彂 false鏃舵病鏈夊伐鑹哄弬鏁板厑璁镐笅鍙�*/
+ needSetProcessParams: boolean
}
export interface Devices {
diff --git a/src/api/index.ts b/src/api/index.ts
index e474d51..8c68113 100644
--- a/src/api/index.ts
+++ b/src/api/index.ts
@@ -120,16 +120,31 @@
}
/**
- * 鑾峰彇褰撳墠闈㈡澘缁戝畾鐨勮澶囧垪琛�
+ * 璁惧畾褰撳墠璁惧
*/
export function apiSetCurrentDevice(data: SetCurrentDeviceParams) {
- return request<BaseResponse<Devices>>({
+ return request<BaseResponse>({
url: `/v1/device/setCurrentDeviceId`,
method: 'post',
data
})
}
+export interface SetCurrentDeviceConfigParams {
+ needSetProcessParams: boolean
+}
+
+/**
+ * 璁惧畾褰撳墠璁惧閰嶇疆
+ */
+export function apiSetCurrentDeviceConfig(data: SetCurrentDeviceConfigParams) {
+ return request<BaseResponse>({
+ url: `/v1/device/config`,
+ method: 'post',
+ data
+ })
+}
+
export interface CraftModelListParams {
procedureId: number
page: number
diff --git a/src/components.d.ts b/src/components.d.ts
index a257981..ce217b0 100644
--- a/src/components.d.ts
+++ b/src/components.d.ts
@@ -19,6 +19,8 @@
ElPopconfirm: typeof import('element-plus/es')['ElPopconfirm']
ElPopover: typeof import('element-plus/es')['ElPopover']
ElProgress: typeof import('element-plus/es')['ElProgress']
+ ElRadio: typeof import('element-plus/es')['ElRadio']
+ ElRadioGroup: typeof import('element-plus/es')['ElRadioGroup']
ElScrollbar: typeof import('element-plus/es')['ElScrollbar']
ElStep: typeof import('element-plus/es')['ElStep']
ElSteps: typeof import('element-plus/es')['ElSteps']
diff --git a/src/stores/devices.ts b/src/stores/devices.ts
index 26d7162..e0f81ef 100644
--- a/src/stores/devices.ts
+++ b/src/stores/devices.ts
@@ -10,6 +10,14 @@
return deviceRes?.value?.data as Devices
})
+ // 褰撳墠璁惧鍦ㄧ己灏戝伐鑹哄弬鏁扮殑鏃跺�欐槸鍚﹀厑璁镐笅鍙戠敓浜�
+ const currentDeviceAllowNoParams = computed(() => {
+ const currentDeviceInfo = deviceInfo.value.deviceList?.find((ele) => {
+ return ele.deviceID === deviceInfo.value.currentDeviceID
+ })
+ return !currentDeviceInfo?.needSetProcessParams
+ })
+
/**
* 濡傛灉浠诲姟鐘舵�佹槸杩涜涓�, 鍒欒疆璇� plc 鍙栬繘搴�
*/
@@ -28,5 +36,5 @@
startDevicePolling()
}
- return { deviceInfo, startPollingDevice }
+ return { deviceInfo, startPollingDevice, currentDeviceAllowNoParams }
})
diff --git a/src/views/dashboard/components/DashboardTitle.vue b/src/views/dashboard/components/DashboardTitle.vue
index 49d3323..446f322 100644
--- a/src/views/dashboard/components/DashboardTitle.vue
+++ b/src/views/dashboard/components/DashboardTitle.vue
@@ -26,10 +26,15 @@
<IconCloudOff></IconCloudOff>
</el-icon>
</div>
+
+ <div class="params-config" @click="openConfigModal">
+ <el-icon size="28"><Setting /></el-icon>
+ </div>
</div>
</div>
<DeviceCheckList v-model="showDevicesModal" @should-reload="emits('shouldReload')"></DeviceCheckList>
<TroubleTrackerModal v-model="showProblemsModal" :problems="problemList"></TroubleTrackerModal>
+ <DeliverParamsConfigModal v-model="showConfigModal"></DeliverParamsConfigModal>
</template>
<script setup lang="ts">
import AlertLightIcon from '@/components/icons/AlertLightIcon.vue'
@@ -43,6 +48,8 @@
import { useRequest } from 'vue-hooks-plus'
import { apiGetProblemList } from '@/api'
import { PROBLEMS_POLLING_DURATION } from '@/common/constants'
+import { Setting } from '@element-plus/icons-vue'
+import DeliverParamsConfigModal from '@/views/dashboard/components/DeliverParamsConfigModal.vue'
const emits = defineEmits<{
shouldReload: []
@@ -98,6 +105,14 @@
return cloudConnection ? cloudConnection?.CheckResult : true
})
+// 閰嶇疆涓嬪彂鍙傛暟寮圭獥
+const showConfigModal = ref(false)
+function openConfigModal() {
+ showConfigModal.value = true
+}
+function closeConfigModal() {
+ showConfigModal.value = false
+}
/**
* 杞闂璇婃柇
*/
@@ -143,4 +158,10 @@
font-size: 40px;
color: #fff;
}
+.cloud-connection-status {
+ margin-right: 10px;
+}
+.params-config {
+ cursor: pointer;
+}
</style>
diff --git a/src/views/dashboard/components/DeliverParamsConfigModal.vue b/src/views/dashboard/components/DeliverParamsConfigModal.vue
new file mode 100644
index 0000000..9cfdd68
--- /dev/null
+++ b/src/views/dashboard/components/DeliverParamsConfigModal.vue
@@ -0,0 +1,96 @@
+<template>
+ <div class="deliver-params-config-modal">
+ <CommonModal v-model="modelData" @close="modelData = false">
+ <template #title>閰嶇疆</template>
+ <div class="config-content">
+ <el-radio-group v-model="config" class="config-radio-group">
+ <el-radio :label="false" size="large">鏃犲伐鑹哄弬鏁帮紝涓嶅厑璁镐笅鍙戠敓浜т换鍔�</el-radio>
+ <el-radio :label="true" size="large">鏃犲伐鑹哄弬鏁帮紝鍏佽涓嬪彂鐢熶骇浠诲姟</el-radio>
+ </el-radio-group>
+ </div>
+ <template #footer>
+ <div class="config-footer">
+ <BigButton class="btn" bg-color="#0dfde6" color="#333333" @click="setConfig">淇濆瓨</BigButton>
+ </div>
+ </template>
+ </CommonModal>
+ </div>
+</template>
+<script setup lang="ts">
+import BigButton from '@/views/dashboard/components/BigButton.vue'
+import { useVModel } from '@vueuse/core'
+import { ref, watch } from 'vue'
+import { useDevicesStore } from '@/stores/devices'
+import { storeToRefs } from 'pinia'
+import { apiSetCurrentDeviceConfig } from '@/api'
+import { ElMessage } from 'element-plus'
+const props = withDefaults(
+ defineProps<{
+ modelValue: boolean
+ }>(),
+ {
+ modelValue: false
+ }
+)
+
+const emit = defineEmits<{
+ 'update:modelValue': [show: boolean]
+}>()
+const modelData = useVModel(props, 'modelValue', emit)
+const deviceStore = useDevicesStore()
+const { currentDeviceAllowNoParams } = storeToRefs(deviceStore)
+watch(modelData, () => {
+ // 鎵撳紑寮圭獥鏃跺垵濮嬪寲閫変腑椤�
+ if (modelData.value) {
+ config.value = currentDeviceAllowNoParams.value
+ }
+})
+
+const config = ref(false)
+
+function setConfig() {
+ apiSetCurrentDeviceConfig({
+ // 閫変腑鍏佽涓嬪彂鍗充笉闇�瑕佸伐鑹哄弬鏁� ,杩欎咯鏄弽鐨�
+ needSetProcessParams: !config.value
+ })
+ .then(() => {
+ ElMessage({
+ message: '璁剧疆鎴愬姛',
+ type: 'success',
+ duration: 3 * 1000
+ })
+ modelData.value = false
+ deviceStore.startPollingDevice()
+ })
+ .catch((err) => {
+ console.error(err)
+ })
+}
+</script>
+<style scoped lang="scss">
+.config-content {
+ padding: 10px 20px;
+}
+.config-radio-group {
+ display: flex;
+ flex-direction: column;
+ justify-content: start;
+ align-items: start;
+ :deep(.el-radio__label) {
+ color: #fff;
+ }
+}
+.config-footer {
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ .btn {
+ height: 40px;
+ width: 100px;
+ font-size: 14px;
+ font-weight: 500;
+ line-height: 40px;
+ border-radius: 4px;
+ }
+}
+</style>
diff --git a/src/views/dashboard/components/TaskControlModal.vue b/src/views/dashboard/components/TaskControlModal.vue
index c51b154..e984ea7 100644
--- a/src/views/dashboard/components/TaskControlModal.vue
+++ b/src/views/dashboard/components/TaskControlModal.vue
@@ -40,6 +40,10 @@
<div class="info-item-two">
<div style="color: #4efefa; font-size: 18px; margin-bottom: 10px; margin-top: 20px">宸ヨ壓鍙傛暟</div>
+ <!-- 鏈幏鍙栧埌宸ヨ壓鍙傛暟, 涓斿綋鍓嶈澶囧厑璁稿湪娌℃湁宸ヨ壓鍙傛暟鐨勬儏鍐典笅鐢熶骇, 鍒欐彁绀�-->
+ <div v-if="getCraftParamsTip && currentDeviceAllowNoParams" class="info-item info-item-two">
+ 鏈幏鍙栧埌宸ヨ壓鍙傛暟, 璇锋墜鍔ㄨ缃垨鍦ㄤ簯绔伐鑹烘ā鍨嬩腑涓婁紶
+ </div>
<div v-for="(item, index) in craftParams" :key="index" class="info-item info-item-two">
{{ item.Key }}锛歿{ item.Value || '' }}
</div>
@@ -52,7 +56,7 @@
</template>
<!-- 鍙湁鑾峰彇鍒板伐鑹哄弬鏁版墠鍙互杩涜鎿嶄綔-->
- <template v-if="getCraftParamsTip">
+ <template v-if="getCraftParamsTip && !currentDeviceAllowNoParams">
<div class="content-tips">
<div class="craft-params-error">
<div class="error-icon">
@@ -108,7 +112,7 @@
</template>
</div>
<template #footer>
- <template v-if="getCraftParamsTip">
+ <template v-if="getCraftParamsTip && !currentDeviceAllowNoParams">
<div class="btn">
<BigButton bg-color="#4765c0" @click="closeModal"> 鍏抽棴 </BigButton>
</div>
@@ -160,6 +164,7 @@
import { createMachine } from 'xstate'
import { useMachine } from '@xstate/vue'
import { CircleCloseFilled, Loading, SuccessFilled } from '@element-plus/icons-vue'
+import { useDevicesStore } from '@/stores/devices'
export interface TaskControlModalProps {
task?: Task
@@ -196,7 +201,8 @@
const craftParams = ref<CraftParam[]>()
// 鑾峰彇宸ヨ壓鍙傛暟缁撴灉淇℃伅
const getCraftParamsTip = ref('')
-
+// 褰撳墠璁惧鑻ユ病鏈夊伐鑹哄弬鏁版槸鍚﹀厑璁镐笅鍙�
+const { currentDeviceAllowNoParams } = storeToRefs(useDevicesStore())
/**
* 鑾峰彇褰撳墠灞曠ず鐨勪换鍔＄殑宸ヨ壓鍙傛暟
*/
@@ -204,6 +210,7 @@
if (taskId) {
craftParams.value = []
getCraftParamsTip.value = ''
+
getCraftParams({ id: taskId }).then(
(res) => {
craftParams.value = res.data.Params ?? []
--
Gitblit v1.8.0