fix: 加液配置逻辑修改

src/components/container/Item/index.vue

@@ -1,4 +1,5 @@
 <script lang="ts" setup>
+import { ElMessageBox } from 'element-plus'
 import { FtMessage } from 'libs/message'
 import { computed, ref } from 'vue'
 import { useRouter } from 'vue-router'
@@ -27,7 +28,7 @@ const solutionId = ref()
 const selectedSolutionItem = ref()
 const solutionInfo = ref(props.solutionItem)
 const solutionStyle = computed(() => {
-  const difference = solutionInfo.value.capacityUsed / solutionInfo.value.capacityTotal
+  const difference = (solutionInfo.value.capacityTotal - solutionInfo.value.capacityUsed) / solutionInfo.value.capacityTotal
   const process = 100 - (difference * 100)
   const filter = difference > 0.4 ? 'hue-rotate(270deg) saturate(100) brightness(81%)' : difference > 0.1 ? 'hue-rotate(150deg) saturate(100)' : 'hue-rotate(120deg) saturate(100)'
   return {
@@ -35,15 +36,28 @@ const solutionStyle = computed(() => {
     '-webkit-mask': `linear-gradient(to bottom, transparent ${process}%, #EEEFF8 ${process + 0.1}%)`,
   }
 })
-const onInputBlur = () => {
+const onInputBlur = async () => {
   if (solutionInfo.value.capacityUsed > solutionInfo.value.capacityTotal) {
     FtMessage.error(`容器容量不能超过${solutionInfo.value.capacityTotal}ml`)
     solutionInfo.value.capacityUsed = 5000
+    return
   }
-  saveContainer()
+  await ElMessageBox.confirm(
+    '确认保存吗? ',
+    '提示',
+    {
+      confirmButtonText: '确认',
+      showClose: false,
+      showCancelButton: true,
+      closeOnClickModal: false,
+      closeOnPressEscape: false,
+      type: 'warning',
+    },
+  )
+  await saveContainer()
 }
 
-const saveContainer = () => {
+const saveContainer = async () => {
   if (!solutionInfo.value.capacityUsed) {
     FtMessage.warning('请输入当前容量')
     return
@@ -61,10 +75,9 @@ const saveContainer = () => {
     capacityUsed: solutionInfo.value.capacityUsed,
     filled: solutionInfo.value.filled,
   }
-  updateContainer(params).then(() => {
-    FtMessage.success('保存成功')
-    emits('ok')
-  })
+  await updateContainer(params)
+  FtMessage.success('保存成功')
+  emits('ok')
 }
 const onSolutionChange = (value: number) => {
   if (value) {