优化样式

3 weeks ago · c9794cb70b
33 changed files with 810 additions and 210 deletions
--- a/src/assets/images/wifi-conn.svg
+++ b/src/assets/images/wifi-conn.svg
@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" fill="none" version="1.1" width="42" height="32" viewBox="0 0 42 32"><g><path d="M0,9.368L3.81937,13.4827C13.3061,3.256,28.6939,3.256,38.1806,13.4827L42,9.368C30.4106,-3.12267,11.6078,-3.12267,0,9.368ZM15.2722,25.8267L21,32L26.7277,25.8267C23.5778,22.4133,18.4406,22.4133,15.2722,25.8267ZM7.63875,17.6L11.4581,21.7147C16.7265,16.0347,25.2787,16.0347,30.5471,21.7147L34.3639,17.6C26.9955,9.65867,15.0255,9.65867,7.63612,17.6L7.63875,17.6Z" fill="#2892F3" fill-opacity="1" style="mix-blend-mode:passthrough"/></g></svg>
--- a/src/assets/images/wifi-unconn.svg
+++ b/src/assets/images/wifi-unconn.svg
@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" fill="none" version="1.1" width="42" height="32" viewBox="0 0 42 32"><g><path d="M37.9313,13.4957L41.7381,9.3913C30.2499,-3.13043,11.5561,-3.13043,0,9.3913L3.80673,13.4957C13.2556,3.26957,28.5505,3.26957,37.9313,13.4957ZM26.7853,18.9216C27.873,17.252,29.4365,15.8607,31.2039,14.9564C23.9303,9.73897,14.0736,10.6433,7.61573,17.5998L11.4225,21.7042C15.5691,17.1824,21.755,16.2781,26.7853,18.9216ZM37.9991,25.461L41.5339,29.0784C42.1457,29.7045,42.1457,30.748,41.4659,31.2349C40.9221,31.7915,40.1063,31.861,39.4945,31.4436L39.2906,31.2349L35.7558,27.6175L32.221,31.2349C31.6092,31.861,30.5895,31.861,29.9777,31.2349C29.4339,30.6784,29.3659,29.8436,29.7738,29.2175L29.9777,29.0088L33.5125,25.3915L29.9777,21.7741C29.3659,21.148,29.3659,20.1045,29.9777,19.4784C30.5215,18.9219,31.3373,18.8523,31.9491,19.2697L32.153,19.4784L35.7558,23.2349L39.2906,19.6175C39.9024,18.9915,40.9221,18.9915,41.5339,19.6175C42.0777,20.1741,42.1457,21.0088,41.7378,21.6349L41.5339,21.8436L37.9991,25.461ZM25.0157,25.0435L25.0157,24.5565C21.9567,22.5391,17.878,22.9565,15.2269,25.8087L20.937,32L25.2876,27.2696C25.0836,26.5739,25.0157,25.8087,25.0157,25.0435Z" fill-rule="evenodd" fill="#2892F3" fill-opacity="1" style="mix-blend-mode:passthrough"/></g></svg>
--- a/src/assets/styles/common.scss
+++ b/src/assets/styles/common.scss
@ -6,6 +6,7 @@ html {
 }
 html, body {
  overflow: hidden;
+  user-select: none;
 }
 html,
 body,
--- a/src/components/common/BTButton/index.vue
+++ b/src/components/common/BTButton/index.vue
@ -67,6 +67,10 @@ const props = defineProps({
    type: String,
    default: '.714vw 1.339vw',
  },
+  minHeight: {
+    type: String,
+    default: '',
+  },
 })

 const emits = defineEmits(['click'])
@ -95,6 +99,7 @@ const handleClick = (event: MouseEvent) => {
      borderRadius,
      fontSize: textSize,
      padding,
+      minHeight,
    }"
    @click="handleClick"
  >
--- a/src/components/common/CascadingSelectModal/index.vue
+++ b/src/components/common/CascadingSelectModal/index.vue
@ -1,4 +1,5 @@
 <script lang="ts" setup>
+import { useHomeStore } from 'stores/homeStore'
 import { defineEmits, defineProps, onBeforeMount, onMounted, ref, toRefs, watchEffect } from 'vue'

 const props = defineProps({
@ -32,6 +33,8 @@ const emits = defineEmits(['confirm', 'cancel'])
 const optionsList = ref<HTMLUListElement | null>(null)
 const { optionsLeft, options } = toRefs(props)

+const homeStore = useHomeStore()
+
 const tempSelectedLeftValue = ref('positivePressure')

 const tempSelectedRightValue = ref(props.defaultValue)
@ -84,6 +87,7 @@ const selectOption = (option: System.Option) => {
 }

 const confirmSelection = () => {
+  tempSelectedValue.value = [tempSelectedLeftValue.value, `${tempSelectedRightValue.value}`]
  emits('confirm', tempSelectedValue.value)
 }

@ -93,6 +97,7 @@ const handleCancel = () => {

 watchEffect(() => {
  tempSelectedRightValue.value = props.defaultValue
+  tempSelectedLeftValue.value = homeStore.defaultIntensityTypeValue
 })
 </script>

@ -123,7 +128,7 @@ watchEffect(() => {
            </div>
          </div>
          <div ref="optionsList" class="modal-content-right">
-            <ul class="options-list">
+            <ul v-if="tempSelectedLeftValue !== 'constantPressure'" class="options-list">
              <li
                v-for="(option, index) in filteredOptionsRight"
                :key="option.value || index"
@ -133,15 +138,19 @@ watchEffect(() => {
                {{ option.label }}
              </li>
            </ul>
-            <div v-if="!filteredOptionsRight.length" class="no-results">
+            <div v-else class="no-results">
              没有找到匹配项
            </div>
          </div>
        </div>
      </div>
      <div class="modal-footer">
-        <button class="cancel-btn" @click="handleCancel">取消</button>
-        <button class="confirm-btn" @click="confirmSelection">确定</button>
+        <button class="cancel-btn" @click="handleCancel">
+          取消
+        </button>
+        <button class="confirm-btn" @click="confirmSelection">
+          确定
+        </button>
      </div>
    </div>
  </div>
--- a/src/components/common/SoftKeyboard/index.vue
+++ b/src/components/common/SoftKeyboard/index.vue
@ -1,6 +1,7 @@
 <script lang="ts" setup>
 import type { Ref } from 'vue'
 import pinyinDict from 'libs/pinyinDict.json'
+import { useDeviceStore } from 'stores/deviceStore'
 import { computed, defineEmits, defineProps, onMounted, ref, watch, watchEffect } from 'vue'

 const props = defineProps<{
@ -14,6 +15,7 @@ const emits = defineEmits<{
  (e: 'confirm', value: string): void
  (e: 'close'): void
 }>()
+const deviceStete = useDeviceStore()
 const languageType = ref('en')
 const inputValue = ref(props.modelValue)
 const cnList = ref<string[]>([])
@ -24,7 +26,7 @@ const isDragging = ref(false)// 是否正在拖动
 const startX = ref(0)// 触摸起始 X
 const startY = ref(0)// 触摸起始 Y
 const x = ref(0)// 容器偏移 X
-const y = ref(0)// 容器偏移 Y
+const y = ref(-50)// 容器偏移 Y
 const keyboardRef = ref() as Ref<HTMLDivElement> // 软键盘容器 DOM

 onMounted(() => {
@ -39,12 +41,22 @@ onMounted(() => {
 const isOpen = ref(false)
 watchEffect(() => {
  // 在焦点内二次点击时不触发EventListener，做一下延迟处理
-  setTimeout(() => {
-    isOpen.value = props.isVisible
-  }, 100)
+  console.log('deviceStete.deviceType--11-', deviceStete.deviceType)
+  if (!deviceStete.deviceType) {
+    setTimeout(() => {
+      isOpen.value = props.isVisible
+    }, 100)
+  }
  inputValue.value = props.modelValue
 })

+watch(() => props.isVisible, (newVal) => {
+  console.log('deviceStete.deviceType--2-', deviceStete.deviceType)
+  if (!deviceStete.deviceType) {
+    isOpen.value = newVal
+  }
+})
+
 const activeKey = ref('')
 const keyboardLayout = computed(() => {
  if (props.keyboardType === 'number') {
@ -124,10 +136,6 @@ const closeKeyboard = () => {
  emits('close')
 }

-watch(() => props.isVisible, (newVal) => {
-  isOpen.value = newVal
-})
-
 // 触摸开始：记录初始位置
 const handleTouchStart = (e: TouchEvent) => {
  isDragging.value = true
@ -142,6 +150,26 @@ const handleTouchMove = (e: TouchEvent) => {
    const touch = e.touches[0]
    x.value = touch.clientX - startX.value
    y.value = touch.clientY - startY.value
+    // const keyboardRect = keyboardRef.value.getBoundingClientRect()
+    // // 拖动时不超出左边界
+    // if (newX < 0) {
+    //   newX = 0
+    // }
+    // // 拖动时不超出右边界
+    // else if ((newX + keyboardRect.width) > window.innerWidth) {
+    //   newX = window.innerWidth - keyboardRect.width
+    // }
+    // // 拖动时不超出上边界
+    // if (keyboardRect.height + newY < 0) {
+    //   newY = keyboardRect.height - window.innerHeight + 50
+    // }
+    // // 拖动时不超出下边界
+    // const maxY = keyboardRect.height - (window.innerHeight - keyboardRect.height) + 10
+    // if (newY > maxY) {
+    //   newY = maxY
+    // }
+    // x.value = newX
+    // y.value = newY
  }
 }

@ -167,7 +195,7 @@ const handleTouchEnd = () => {
      :style="{
        transform: `translate(${x}px, ${y}px)`,
        transition: isDragging ? 'none' : 'transform 0.3s ease',
-        width: keyboardType === 'number' ? '50vw' : '66vw',
+        width: keyboardType === 'number' ? '30vw' : '66vw',
        height: keyboardType === 'number' ? '46vh' : '46vh',
      }"
    >
@ -247,7 +275,7 @@ const handleTouchEnd = () => {
  .pinyin-container{
    display: flex;
    width: 80%;
-    height: 3rem;
+    height: 4rem;
    padding-left: 2rem;
    .pinyin-cn{
      color: #1890ff;
--- a/src/components/common/SoftKeyboard/moveKeyboard.vue
+++ b/src/components/common/SoftKeyboard/moveKeyboard.vue
@ -0,0 +1,354 @@
+<script lang="ts" setup>
+import type { Ref } from 'vue'
+import pinyinDict from 'libs/pinyinDict.json'
+import { computed, defineEmits, defineProps, nextTick, onMounted, ref, watch, watchEffect } from 'vue'
+
+const props = defineProps<{
+  modelValue: string
+  keyboardType: 'text' | 'number'
+  isVisible: boolean
+  targetInput: HTMLInputElement
+}>()
+const emits = defineEmits<{
+  (e: 'update:modelValue', value: string): void
+  (e: 'updateKeyboardVisible', value: boolean): void
+  (e: 'confirm', value: string): void
+  (e: 'close'): void
+}>()
+const languageType = ref('en')
+const inputValue = ref(props.modelValue)
+const cnList = ref<string[]>([])
+const pinyinMap: Record<string, string[]> = pinyinDict
+const pinyinValue = ref('')
+// 拖动相关状态
+const isDragging = ref(false)// 是否正在拖动
+const startX = ref(0)// 触摸起始 X
+const startY = ref(0)// 触摸起始 Y
+const x = ref(0)// 容器偏移 X
+const y = ref(0)// 容器偏移 Y
+const inputX = ref(0)
+const inputY = ref(0)
+const keyboardRef = ref() as Ref<HTMLDivElement> // 软键盘容器 DOM
+
+onMounted(() => {
+  document.addEventListener('click', (e: any) => {
+    if (isOpen.value && !e.target?.name) {
+      isOpen.value = false
+      emits('updateKeyboardVisible', false)
+    }
+  })
+})
+
+const isOpen = ref(false)
+watchEffect(() => {
+  // 在焦点内二次点击时不触发EventListener，做一下延迟处理
+  setTimeout(() => {
+    isOpen.value = props.isVisible
+    if (props.targetInput) {
+      const rect = props.targetInput.getBoundingClientRect()
+      const windowWidth = window.innerWidth
+      const windowHeight = window.innerHeight
+      // 确保 keyboardRef 已挂载，获取实际宽高
+      nextTick(() => {
+        const keyboardWidth = keyboardRef.value ? keyboardRef.value.offsetWidth : 0
+        const keyboardHeight = keyboardRef.value ? keyboardRef.value.offsetHeight : 0
+
+        let targetX = rect.left - x.value
+        let targetY = rect.bottom - y.value
+
+        // 左侧边界修正
+        if (targetX < 0) {
+          targetX = 0
+        }
+        // 右侧边界修正
+        else if (targetX + keyboardWidth > windowWidth) {
+          targetX = windowWidth - keyboardWidth
+        }
+
+        // 下侧边界修正（超出则放上面）
+        if (targetY + keyboardHeight > windowHeight) {
+          targetY = rect.top - keyboardHeight
+          // 上面也超出则贴顶
+          if (targetY < 0) {
+            targetY = 0
+          }
+        }
+        console.log('targetX--', targetX)
+        console.log('targetY--', targetY)
+        inputX.value = targetX
+        inputY.value = targetY
+      })
+    }
+  }, 100)
+  inputValue.value = props.modelValue
+})
+
+const activeKey = ref('')
+const keyboardLayout = computed(() => {
+  if (props.keyboardType === 'number') {
+    return [
+      ['1', '2', '3'],
+      ['4', '5', '6'],
+      ['7', '8', '9'],
+      ['.', '0', 'del'],
+    ]
+  }
+  return [
+    ['1', '2', '3', '4', '5', '6', '7', '8', '9', '0', 'del'],
+    ['q', 'w', 'e', 'r', 't', 'y', 'u', 'i', 'o', 'p', '/'],
+    ['a', 's', 'd', 'f', 'g', 'h', 'j', 'k', 'l', ';', 'enter'],
+    ['z', 'x', 'c', 'v', 'b', 'n', 'm', ',', '?', '.', ':'],
+    ['close', ' ', 'en'],
+  ]
+})
+const specialKeys = ['del', 'enter', ' ']
+const handleKeyCn = (cn: string) => {
+  emits('update:modelValue', props.modelValue + cn)
+  cnList.value = []
+  pinyinValue.value = ''
+}
+const handleKeyPress = (key: string) => {
+  activeKey.value = key
+  setTimeout(() => {
+    activeKey.value = ''
+  }, 150)
+
+  if (key === 'del') {
+    if (props.keyboardType === 'text' && languageType.value === 'cn' && pinyinValue.value) {
+      pinyinValue.value = pinyinValue.value.slice(0, -1)
+      // 中文
+      onHandlePinyinToCn(pinyinValue.value)
+    }
+    else {
+      emits('update:modelValue', props.modelValue.slice(0, -1))
+    }
+  }
+  else if (key === 'enter') {
+    emits('confirm', props.modelValue)
+    closeKeyboard()
+  }
+  else if (key === 'close') {
+    closeKeyboard()
+  }
+  else if ((key === 'en' || key === 'cn') && props.keyboardType === 'text') {
+    languageType.value = key === 'en' ? 'cn' : 'en'
+    keyboardLayout.value[4][2] = key === 'en' ? 'cn' : 'en'
+    cnList.value = []
+  }
+  else {
+    if (props.keyboardType === 'text' && languageType.value === 'cn') {
+      // 中文
+      pinyinValue.value = pinyinValue.value + key
+      onHandlePinyinToCn(pinyinValue.value)
+    }
+    else {
+      emits('update:modelValue', props.modelValue + key)
+    }
+  }
+}
+
+const onHandlePinyinToCn = (keyValue: string) => {
+  const cn: string[] = pinyinMap[keyValue]
+  if (cn && cn.length) {
+    cnList.value = cn
+  }
+  else {
+    cnList.value = []
+  }
+}
+
+const closeKeyboard = () => {
+  isOpen.value = false
+  emits('close')
+}
+
+watch(() => props.isVisible, (newVal) => {
+  isOpen.value = newVal
+})
+
+// 触摸开始：记录初始位置
+const handleTouchStart = (e: TouchEvent) => {
+  isDragging.value = true
+  const touch = e.touches[0]
+  startX.value = touch.clientX - x.value
+  startY.value = touch.clientY - y.value
+}
+
+// 触摸移动：计算偏移量
+const handleTouchMove = (e: TouchEvent) => {
+  if (isDragging.value) {
+    const touch = e.touches[0]
+    x.value = touch.clientX - startX.value
+    y.value = touch.clientY - startY.value
+  }
+}
+
+// 触摸结束：停止拖动
+const handleTouchEnd = () => {
+  isDragging.value = false
+}
+</script>
+
+<template>
+  <div
+    v-if="isOpen"
+    :style="{
+      position: 'absolute',
+      left: `${inputX}px`,
+      top: `${inputY}px`,
+    }"
+  >
+    <!-- <div class="keyboard-header">
+      <button @click="closeKeyboard">
+        关闭键盘
+      </button>
+    </div> -->
+    <div
+      ref="keyboardRef"
+      class="keyboard-container keyboard-body"
+      @touchstart="handleTouchStart"
+      @touchmove="handleTouchMove"
+      @touchend="handleTouchEnd"
+      :style="{
+        transform: `translate(${x}px, ${y}px)`,
+        transition: isDragging ? 'none' : 'transform 0.3s ease',
+        width: keyboardType === 'number' ? '30vw' : '66vw',
+        height: keyboardType === 'number' ? '46vh' : '46vh',
+      }"
+    >
+      <div>
+        <div v-if="keyboardType === 'text'" class="pinyin-container">
+          <span v-if="pinyinValue" style="font-size:12px">拼音：{{ pinyinValue }}</span>
+          <div v-if="cnList && cnList.length" class="pinyin-cn">
+            <div
+              v-for="(cnName, cnIndex) in cnList"
+              :key="cnIndex"
+              class="cn-name"
+              @click="(e) => { e.stopPropagation(); handleKeyCn(cnName) }">
+              {{ cnName }}
+            </div>
+          </div>
+        </div>
+        <div v-for="(row, index) in keyboardLayout" :key="index" class="keyboard-row">
+          <button
+            v-for="(key, keyIndex) in row"
+            :key="keyIndex"
+            :class="{
+              'key-space': key === ' ',
+              'key-special': specialKeys.includes(key),
+              'key-active': activeKey === key,
+              'key-number': keyboardType === 'number',
+              'key-text': key !== ' ' && keyboardType === 'text',
+            }"
+            :style="keyboardType === 'number' ? 'height: 10vh' : 'height:3rem;'"
+            @click="(e) => {
+              e.stopPropagation()
+              handleKeyPress(key)
+            }"
+          >
+            {{ key === ' ' ? '空格' : key === 'del' ? '删除' : key === 'enter' ? '确认' : key === 'close' ? '关闭' : key === 'cn' ? '英文' : key === 'en' ? '拼音' : key }}
+          </button>
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
+
+<style lang="scss" scoped>
+.soft-keyboard {
+  //background-color: #f5f5f5;
+  border-top: 1px solid #ddd;
+  padding: 10px;
+  transition: all 0.3s ease;
+  user-select: none;
+  z-index: 9999;
+  overflow: hidden;
+}
+
+.keyboard-open {
+  /* 这里可以根据需要补充打开时的过渡效果等，原 bottom 相关去掉 */
+}
+
+.keyboard-body {
+  display: flex;
+  flex-direction: column;
+  gap: 8px;
+  .pinyin-container{
+    display: flex;
+    width: 80%;
+    height: 3rem;
+    padding-left: 2rem;
+    .pinyin-cn{
+      color: #1890ff;
+      padding-left: 1rem;
+      display: flex;
+      width: 1rem;
+      position: relative;
+      gap:5px;
+      font-family: fangsong;
+      .cn-name{
+        font-size: 2.5rem;
+      }
+    }
+  }
+}
+
+.keyboard-row {
+  display: flex;
+  justify-content: center;
+  gap: 5px;
+}
+
+.keyboard-row button {
+  min-width: 50px;
+  font-size: 18px;
+  border: none;
+  border-radius: 5px;
+  background-color: #fff;
+  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
+  cursor: pointer;
+  transition: all 0.2s;
+  height: 10vh;
+}
+
+.keyboard-row button:active {
+  transform: scale(0.95);
+}
+
+.key-space {
+  margin-top: 3.5px;
+  width: 75vw;;
+}
+
+.key-special {
+  background-color: #e0e0e0;
+}
+
+.key-active {
+  background-color: #a0c4ff;
+  transform: scale(0.95);
+}
+
+.key-number{
+  width: 30vw;
+  height: 6vh;
+  margin: 5px;
+}
+
+.key-text {
+  width: 8vw;
+  height: 5vh;
+  margin: 5px;
+}
+
+.keyboard-container {
+  border-radius: 16px;
+  box-shadow: 0 -4px 12px rgba(0,0,0,0.1);
+  overflow: hidden;
+  z-index: 9999;
+  /* 让拖动更顺滑 */
+  will-change: transform;
+  touch-action: none; /* 禁止浏览器默认触摸行为（如滚动） */
+  background: #c8c8c8;
+}
+</style>
--- a/src/components/formula/FormulaConfig.vue
+++ b/src/components/formula/FormulaConfig.vue
@ -20,8 +20,13 @@ const props = defineProps<{
  type: string
 }>()

+const nameLength = 10
+
 const formulaStore = useFormulaStore()

+const targetInputRef = ref<HTMLInputElement | null>(null)
+
+const isFlip = ref(true)
 /**
 * 当前表单数据
 * 不同模式下有不同的初始值：
@ -123,7 +128,8 @@ watchEffect(() => {
  else {
    formData.value = cloneDeep(formulaStore.currentSelectedFormulaInfo) || cloneDeep(formulaStore.defaultFormulaInfo)
  }
-  // 后端给的数据类型是字符串型，前端需要的是int型，后端开发说后端不好转换，由前端进行转换
+  isFlip.value = formulaStore.flip
+  // 后端给的数据类型是字符串型，前端需要的是int型，后端开发说（赵贺）后端不好转换，由前端进行转换.
  formData.value = convertValuesToInt(formData.value)
 })

@ -132,18 +138,29 @@ watchEffect(() => {
 * @param {string | number} newVal - 新的输入值
 */
 watch(inputValue, (newVal: string | number) => {
+  console.log('inputValue-----------', inputValue)
  if (focusedInput.value) {
    if (focusedInput.value !== 'name') {
      newVal = Number(newVal)
+      if (currentFormulaItem.value && newVal > currentFormulaItem.value.val_upper_limit) {
+        newVal = currentFormulaItem.value.val_upper_limit
+      }
+      formData.value[focusedInput.value] = newVal
    }
-    console.log('currentFormulaItem.value--', currentFormulaItem.value)
-    if (currentFormulaItem.value && newVal > currentFormulaItem.value.val_upper_limit) {
-      newVal = currentFormulaItem.value.val_upper_limit
+    else {
+      if (formData.value.name && formData.value.name.length > nameLength) {
+        inputValue.value = formData.value.name
+      }
    }
-    formData.value[focusedInput.value] = newVal
  }
 })

+// watch(formData, (newVal) => {
+//   if (newVal && newVal.length > nameLength) {
+//     formData.value.name = newVal.name.slice(0, nameLength)
+//   }
+// }, { deep: true })
+
 /**
 * 获取当前表单数据，将值转换为字符串格式
 * @returns {Record<string, string>} 转换后的表单数据
@ -287,6 +304,9 @@ const openKeyboard = (e: any, item: Formula.FormulaItem) => {
    inputValue.value = formValue.toString()
    focusedInput.value = e.target.name
    currentFormulaItem.value = item
+
+    const inputDom = e.target as HTMLInputElement
+    targetInputRef.value = inputDom
  }, 100)
 }

@ -343,95 +363,105 @@ const openKeyboardType = (labelName: string) => {
 </script>

 <template>
-  <div class="formula-form">
-    <el-form :model="formData" label-width="auto" label-position="right" class="formulaFormItem" inline>
-      <el-form-item v-if="type !== 'setting'" label="配方名称" style="margin-top:20px">
-        <el-input v-model="formData.name" v-prevent-keyboard name="name" placeholder="配方名称" class="formdata-input-home" @focus="openKeyboard" />
-      </el-form-item>
-      <el-form-item
-        v-for="item in formulaConfigList"
-        :key="item.setting_id"
-        :label="formulaNameMap[item.setting_id]"
-        style="margin-top:20px"
-      >
-        <template v-if="item.val_type === 'int'">
+  <transition name="slide-right">
+    <div v-if="isFlip" class="formula-form">
+      <el-form :model="formData" label-width="auto" label-position="right" class="formulaFormItem" inline>
+        <el-form-item v-if="type !== 'setting'" label="配方名称" style="margin-top:20px">
          <el-input
-            v-model.number="formData[item.setting_id]"
+            v-model="formData.name"
            v-prevent-keyboard
-            type="number"
-            :name="item.setting_id"
-            :controls="false"
-            :min="Number(item.val_lower_limit)"
-            :max="Number(item.val_upper_limit)"
+            name="name"
+            placeholder="配方名称"
+            :disabled="type === 'home'"
            class="formdata-input-home"
-            :disabled="!item.is_visible_in_setting_page"
-            @focus="(e) => openKeyboard(e, item)"
-          >
-            <template v-if="labelUnitMap[item.setting_id]" #append>{{ labelUnitMap[item.setting_id] }}</template>
-          </el-input>
-        </template>
-        <template v-else-if="item.val_type === 'enum'">
-          <el-input
-            v-model="formData[item.setting_id]"
-            v-prevent-keyboard
-            placeholder="请选择"
-            class="formdata-input-home"
-            @focus="openModal"
-          >
-            <template #append>{{ labelUnitMap[item.setting_id] }}</template>
-          </el-input>
-        </template>
-        <template v-else-if="item.val_type === 'boolean'">
-          <el-radio-group
-            v-model="formData[item.setting_id]"
-            class="formdata-input-home"
-            :disabled="!item.is_visible_in_setting_page"
-          >
-            <el-radio :label="true">
-              是
-            </el-radio>
-            <el-radio :label="false">
-              否
-            </el-radio>
-          </el-radio-group>
-        </template>
-      </el-form-item>
-    </el-form>
-    <div v-if="type !== 'home'" class="formula-form-btn" :style="{ marginLeft: type === 'setting' ? '20%' : '33%' }">
-      <slot name="formulaBtn">
-        <div class="default-btn">
-          <el-button type="primary" class="config-btn" @click="handleSubmit">
-            确定
-          </el-button>
-          <el-button v-if="type === 'setting'" class="config-btn" @click="handleResetDefault">
-            恢复默认值
-          </el-button>
-          <el-button v-else class="config-btn" @click="handleCancel">
-            取消
-          </el-button>
-        </div>
-      </slot>
-    </div>
-    <Teleport to="body">
-      <SoftKeyboard
-        ref="softKeyboardRef"
-        v-model="inputValue"
-        :is-visible="keyboardVisible"
-        :keyboard-type="keyboardType"
-        @confirm="handleConfirm"
-        @update-keyboard-visible="(visible) => keyboardVisible = visible"
-        @close="keyboardVisible = false"
+            @focus="openKeyboard"
+          />
+        </el-form-item>
+        <el-form-item
+          v-for="(item) in formulaConfigList"
+          :key="item.setting_id"
+          :label="formulaNameMap[item.setting_id]"
+          style="margin-top:20px"
+        >
+          <template v-if="item.val_type === 'int'">
+            <el-input
+              v-model.number="formData[item.setting_id]"
+              v-prevent-keyboard
+              type="number"
+              :name="item.setting_id"
+              :controls="false"
+              class="formdata-input-home"
+              :disabled="!item.is_visible_in_setting_page"
+              @focus="(e) => openKeyboard(e, item)"
+            >
+              <template v-if="labelUnitMap[item.setting_id]" #append>{{ labelUnitMap[item.setting_id] }}</template>
+            </el-input>
+          </template>
+          <template v-else-if="item.val_type === 'enum'">
+            <el-input
+              v-model="formData[item.setting_id]"
+              v-prevent-keyboard
+              placeholder="请选择"
+              class="formdata-input-home"
+              readonly
+              @focus="openModal"
+            >
+              <template #append>{{ labelUnitMap[item.setting_id] }}</template>
+            </el-input>
+          </template>
+          <template v-else-if="item.val_type === 'boolean'">
+            <el-radio-group
+              v-model="formData[item.setting_id]"
+              class="formdata-input-home"
+              :disabled="!item.is_visible_in_setting_page"
+            >
+              <el-radio :label="true">
+                是
+              </el-radio>
+              <el-radio :label="false">
+                否
+              </el-radio>
+            </el-radio-group>
+          </template>
+        </el-form-item>
+      </el-form>
+      <div v-if="type !== 'home'" class="formula-form-btn" :style="{ marginLeft: '33%' }">
+        <slot name="formulaBtn">
+          <div class="default-btn">
+            <el-button type="primary" class="config-btn" @click="handleSubmit">
+              确定
+            </el-button>
+            <el-button v-if="type === 'setting'" class="config-btn" @click="handleResetDefault">
+              恢复默认值
+            </el-button>
+            <el-button v-else class="config-btn" @click="handleCancel">
+              取消
+            </el-button>
+          </div>
+        </slot>
+      </div>
+      <Teleport to="body">
+        <SoftKeyboard
+          ref="softKeyboardRef"
+          v-model="inputValue"
+          :is-visible="keyboardVisible"
+          :keyboard-type="keyboardType"
+          :target-input="targetInputRef"
+          @confirm="handleConfirm"
+          @update-keyboard-visible="(visible) => keyboardVisible = visible"
+          @close="keyboardVisible = false"
+        />
+      </Teleport>
+      <SelectModal
+        v-if="isModalOpen"
+        :options="options"
+        :selected-value="formData.loglevel"
+        placeholder="请选择"
+        @confirm="handleLogConfirm"
+        @cancel="handleLogCancel"
      />
-    </Teleport>
-    <SelectModal
-      v-if="isModalOpen"
-      :options="options"
-      :selected-value="formData.loglevel"
-      placeholder="请选择"
-      @confirm="handleLogConfirm"
-      @cancel="handleLogCancel"
-    />
-  </div>
+    </div>
+  </transition>
 </template>

 <style lang="scss" scoped>
@ -439,24 +469,20 @@ const openKeyboardType = (labelName: string) => {
    font-size: 20px !important;
    padding: 5px;
    padding-left: 15px;
-    max-height: 75vh;
-    height: 73vh;
+    height: 81vh;
    overflow: auto;
    .formulaFormItem{
      display: grid;
      grid-template-columns: 1fr 1fr;
    }
    .formula-form-btn{
-      bottom: 0rem;
-      height: 7rem;
-      position: absolute;
    }
    .default-btn{
      margin-top: 1rem;
    }
    .config-btn{
      height: 3rem;
-      width: 7rem;
+      width: 8rem;
    }
  }

@ -468,6 +494,7 @@ const openKeyboardType = (labelName: string) => {
    display: grid;
    grid-template-columns: 1fr 1fr;
  }
+
  .formData-input-config{
    width: 10vw;
  }
@ -478,9 +505,34 @@ const openKeyboardType = (labelName: string) => {
    margin-right: 0;
  }
  ::v-deep .el-input__inner{
-    height: 6vh;
+    height: 45px;
  }
  ::v-deep .el-form-item{
    align-items: center;
  }
+
+  /* 进入动画的初始状态 */
+  .slide-right-enter-from {
+    transform: translateX(100%);
+  }
+  /* 进入动画的结束状态（也可以理解为激活状态） */
+  .slide-right-enter-to {
+    transform: translateX(0);
+  }
+  /* 进入动画的过渡曲线等 */
+  .slide-right-enter-active {
+    transition: transform 0.3s ease-in-out;
+  }
+  /* 离开动画的初始状态（激活状态） */
+  .slide-right-leave-from {
+    transform: translateX(0);
+  }
+  /* 离开动画的结束状态 */
+  .slide-right-leave-to {
+    transform: translateX(100%);
+  }
+  /* 离开动画的过渡曲线等 */
+  .slide-right-leave-active {
+    transition: transform 0.3s ease-in-out;
+  }
 </style>
--- a/src/components/formula/FormulaTable.vue
+++ b/src/components/formula/FormulaTable.vue
@ -17,9 +17,7 @@ onMounted(() => {
 })

 watchEffect(() => {
-  if (formulaStore.formulaList && formulaStore.formulaList.length) {
-    recipes.value = formulaStore.formulaList as Formula.FormulaItem[]
-  }
+  recipes.value = formulaStore.formulaList as Formula.FormulaItem[]
 })

 const initFormulaList = () => {
--- a/src/components/home/HomeFormula.vue
+++ b/src/components/home/HomeFormula.vue
@ -31,13 +31,14 @@ watchEffect(() => {
 .home-right-title{
  display: grid;
  grid-template-columns: 1fr 1fr;
+  font-size: 1.5rem;
  .title-formula{
    display: flex;
    justify-self: start;
    align-items: center;
    gap: 5px;
    padding: 10px;
-    font-size: 16px;
+    font-size: 1.5rem;
  }
  .title-spend{
    justify-self: end;
@ -45,7 +46,7 @@ watchEffect(() => {
    align-items: center;
    gap: 5px;
    padding: 10px;
-    font-size: 16px;
+    font-size: 1.5rem;
  }
 }
 </style>
--- a/src/components/home/HomeLogLevel.vue
+++ b/src/components/home/HomeLogLevel.vue
@ -37,6 +37,7 @@ const handleCancel = () => {
      class="input"
      placeholder="请选择"
      style="height: 4rem"
+      readonly
      @focus="openModal"
    >
      <template #append>
@ -66,7 +67,7 @@ $input-height: 3rem;
  display: flex;
  align-items: center;
  justify-content: center;
-  margin-top: 26vh;
+  margin-top: 24vh;
  font-family: Source Han Sans;
  font-size: 24px;
  .input{
--- a/src/components/home/HomeOperation.vue
+++ b/src/components/home/HomeOperation.vue
@ -163,6 +163,7 @@ const operationState = computed(() => {
      :height="btnStyle.height"
      :text-size="btnStyle.textSize"
      :border-radius="btnStyle.borderRadius"
+      min-height="4rem"
      @click="onStartDisinfect"
    >
      <template #icon>
@ -178,6 +179,7 @@ const operationState = computed(() => {
      :height="btnStyle.height"
      :text-size="btnStyle.textSize"
      :border-radius="btnStyle.borderRadius"
+      min-height="4rem"
      @click="onFinishDisinfect"
    >
      <template #icon>
--- a/src/components/home/HomeSetting.vue
+++ b/src/components/home/HomeSetting.vue
@ -179,6 +179,7 @@ const onSetPressure = () => {
    if (res.ackcode === 0) {
      defaultIntensityValue.value = res.rely.intensity
      homeStore.updateDefaultIntensityValue(res.rely.intensity)
+      homeStore.updateDefaultIntensityTypeValue(res.rely.type)
      isModalOpen.value = true
    }
  })
@ -268,22 +269,20 @@ const onClose = () => {
    <template #footer>
      <div class="config-btn">
        <BtButton
-          bgColor="#1989fa"
+          bg-color="#1989fa"
          button-text="确认"
-          text-size="1rem"
          border-radius="5px"
          width="7rem"
-          textSize="1.5rem"
+          text-size="1.5rem"
          text-color="#ffffff"
          height="3rem"
          @click="onSave"
        />
        <BtButton
          button-text="取消"
-          text-size="1rem"
          border-radius="5px"
          width="7rem"
-          textSize="1.5rem"
+          text-size="1.5rem"
          text-color="#1989fa"
          height="3rem"
          @click="onClose"
--- a/src/components/home/config.vue
+++ b/src/components/home/config.vue
@ -4,6 +4,7 @@ import { useFormulaStore } from '@/stores/formulaStore'
 import { useHomeStore } from '@/stores/homeStore'
 import SelectModal from 'components/common/SelectModal/index.vue'
 import FormulaConfig from 'components/formula/FormulaConfig.vue'
+import { FtMessage } from 'libs/message'
 import { computed, onMounted, ref, watchEffect } from 'vue'

 /**
@ -62,6 +63,11 @@ const options = computed(() => {
 * @description 关闭模态框，更新选中配方并转换数值类型
 */
 const handleConfirm = (value: any) => {
+  if (!value) {
+    FtMessage.error('请选择配方')
+    return
+  }
+  console.log('value---', value)
  isModalOpen.value = false
  let selectedFormula = {}
  formulaStore.formulaList.forEach((item: Formula.FormulaItem) => {
--- a/src/components/setting/AddUser.vue
+++ b/src/components/setting/AddUser.vue
@ -28,9 +28,9 @@ watchEffect(() => {
  modalType.value = settingStore.userModalState
  if (settingStore.userModalState === 'edit') {
    modalTitle.value = '修改密码'
-  }
-  if (settingStore.currentEditUser) {
-    userForm.value = settingStore.currentEditUser
+    if (settingStore.currentEditUser) {
+      userForm.value = settingStore.currentEditUser
+    }
  }
  else {
    modalTitle.value = '新增用户'
@ -58,13 +58,12 @@ const onSave = (formRef: FormInstance | undefined) => {
      console.log('error submit!')
    }
  })
-  onClose()
 }
 const openKeyboard = (e: any) => {
  setTimeout(() => {
    keyboardVisible.value = true
    const labelName = e.target.name
-    const formValue = userForm.value[labelName as keyof typeof userForm.value]
+    const formValue = userForm.value[labelName]
    inputValue.value = formValue ? formValue.toString() : ''
    focusedInput.value = e.target.name
  }, 100)
@ -94,10 +93,21 @@ const doSave = () => {
    if (res.ackcode === 0) {
      FtMessage.success('成功')
      emits('refresh')
+      onClose()
    }
  })
 }
 const onClose = () => {
+  const defaultForm = {
+    id: 0,
+    name: '',
+    passwd: '',
+    confirmPasswd: '',
+    roleType: '',
+  }
+  userForm.value = defaultForm
+  settingStore.updateCurrentEditUser(defaultForm)
+  focusedInput.value = null
  settingStore.updateVisible(false)
 }
 const handleConfirm = (value: string) => {
@ -106,7 +116,7 @@ const handleConfirm = (value: string) => {
 </script>

 <template>
-  <FtDialog v-model="visible" :title="modalTitle" :ok-handle="() => { onSave(userFormRef) }" @cancel="onClose">
+  <FtDialog v-if="visible" v-model="visible" :title="modalTitle" :ok-handle="() => { onSave(userFormRef) }" @cancel="onClose">
    <div>
      <el-form ref="userFormRef" :model="userForm" label-width="auto" style="max-width: 400px">
        <el-form-item
@ -142,7 +152,7 @@ const handleConfirm = (value: string) => {
              trigger: ['blur', 'change'],
            }"
          >
-            <el-input v-model="userForm.confirmPasswd" v-prevent-keyboard name="confirmPasswd" @focus="openKeyboard" type="password" placeholder="确认密码" />
+            <el-input v-model="userForm.confirmPasswd" v-prevent-keyboard name="confirmPasswd" @focus="openKeyboard" placeholder="确认密码" />
          </el-form-item>
        </div>
        <el-form-item
--- a/src/components/setting/History.vue
+++ b/src/components/setting/History.vue
@ -106,7 +106,6 @@ const onClose = () => {
        @click="onExportHistory"
      />
      <bt-button
-        type="primary"
        button-text="删除"
        @click="onDelHistory"
      />
--- a/src/components/setting/HistoryDetail.vue
+++ b/src/components/setting/HistoryDetail.vue
@ -54,6 +54,7 @@ const tableColumns = computed(() => {
        :key="column.prop"
        :prop="column.prop"
        :label="column.label"
+        width="150"
        :min-width="column.minWidth"
      />
    </el-table>
--- a/src/components/setting/User.vue
+++ b/src/components/setting/User.vue
@ -10,6 +10,8 @@ import ModifyPwd from './ModifyPwd.vue'
 const settingStore = useSettingStore()
 const tableData = ref(settingStore.userList)
 const selectedUserList = ref<User.UserItem[]>([])
+const userData = localStorage.getItem('user')
+const userInfo = userData ? JSON.parse(userData) : {}

 onMounted(() => {
  queryUserList()
@ -27,6 +29,11 @@ const queryUserList = () => {
  })
 }
 const updatePwd = (userItem: User.UserItem) => {
+  // 判断登录是否管理员，非管理员不可修改密码
+  if (userInfo.roleType !== 'admin' && userInfo.id !== userItem.id) {
+    FtMessage.error('无权限修改密码')
+    return
+  }
  settingStore.updateCurrentEditUser(userItem)
  settingStore.updatePwdVisible(true)
 }
@ -35,13 +42,17 @@ const onAddUser = () => {
  settingStore.updateUserModalState('add')
  settingStore.updateVisible(true)
 }
-const onDelUser = () => {
-  if (selectedUserList.value.length !== 1) {
-    FtMessage.warning('选择一条数据进行删除')
+const onDelUser = (user: User.UserItem) => {
+  // if (selectedUserList.value.length !== 1) {
+  //   FtMessage.warning('选择一条数据进行删除')
+  //   return
+  // }
+  // 自己不是管理员，要删除管理账号，不允许
+  if (user.id === userInfo.id) {
+    FtMessage.warning('自己不可删除自己')
    return
  }
-  const user = selectedUserList.value[0]
-  if (user.roleType === 'admin') {
+  if (user.roleType === 'admin' && userInfo.roleType !== 'admin') {
    FtMessage.warning('不可删除管理员用户')
    return
  }
@ -67,46 +78,56 @@ const handleSelectionChange = (users: User.UserItem[]) => {
 </script>

 <template>
-  <div>
-    <div class="history-export">
+  <div class="user">
+    <div class="add-user">
      <bt-button
        type="primary"
        button-text="新增用户"
        @click="onAddUser"
      />
-      <bt-button
-        button-text="删除"
-        @click="onDelUser"
-      />
    </div>
-    <div>
+    <div class="user-table">
      <el-table :data="tableData" stripe style="width: 100%" @selection-change="handleSelectionChange">
-        <el-table-column type="selection" width="55" />
        <el-table-column prop="name" label="用户名" />
-        <el-table-column prop="detail" label="操作" width="150">
+        <el-table-column prop="detail" label="操作" width="150" align="center">
          <template #default="scoped">
-            <el-link type="primary" @click="updatePwd(scoped.row)">
-              修改密码
-            </el-link>
+            <div class="user-opera">
+              <el-link type="primary" @click="updatePwd(scoped.row)">
+                修改密码
+              </el-link>
+              <el-link type="primary" @click="onDelUser(scoped.row)">
+                删 除
+              </el-link>
+            </div>
          </template>
        </el-table-column>
      </el-table>
    </div>
-    <div>
-      <AddUser @refresh="queryUserList" />
-      <ModifyPwd @refresh="queryUserList" />
-    </div>
+    <AddUser @refresh="queryUserList" />
+    <ModifyPwd @refresh="queryUserList" />
  </div>
 </template>

 <style lang="scss" scoped>
-.main-content{
-  height: 100%;
+.user{
+  height: 84vh;
  overflow: hidden;
  padding: 10px;
  background: $gradient-color;
-  .history-export{
-    margin: 2vw;
+  .add-user{
+    padding: 2vw;
+    height: 12%;
+    display: flex  ;
+    align-items: center;
+  }
+  .user-table{
+    height: 85%;
+    max-height: 73vh;
+    overflow: auto;
  }
 }
+.user-opera{
+  display: flex;
+  gap: 10px;
+}
 </style>
--- a/src/components/system/NetReconnection.vue
+++ b/src/components/system/NetReconnection.vue
@ -20,7 +20,6 @@ const countdownToReconnection = () => {
 }

 watchEffect(() => {
-  console.log('systemStore.websocketConnected---', systemStore.websocketConnected)
  websocketConnected.value = systemStore.websocketConnected
  if (!systemStore.websocketConnected) {
    countdownToReconnection()
--- a/src/layouts/default.vue
+++ b/src/layouts/default.vue
@ -6,6 +6,8 @@ import { useLiquidStore } from '@/stores/liquidStore'
 import { useSealStore } from '@/stores/sealStore'
 import { useSystemStore } from '@/stores/systemStore'
 import HomeAlarmSvg from 'assets/images/home/home-alarm.svg'
+import WifiConnSvg from 'assets/images/wifi-conn.svg'
+import WifiUnconnSvg from 'assets/images/wifi-unconn.svg'
 import ErrorEventsModal from 'components/system/ErrorEventsModal.vue'
 import NetReconnection from 'components/system/NetReconnection.vue'
 // import ErrorBox from 'libs/modalUtil'
@ -39,6 +41,7 @@ const sealInfo = ref(sealStore.sealInfo)
 const websocketConnected = ref(systemStore.websocketConnected)
 let touchStartTime = 0
 let touchCount = 0
+const deviceType = ref()

 onMounted(() => {
  // 连续3次点击任意地方，全屏显示
@ -96,6 +99,7 @@ watchEffect(() => {
  // 密封测试状态
  sealInfo.value = sealStore.sealInfo
  showDeviceStateName()
+  deviceType.value = deviceStore.deviceType
 })

 onUnmounted(() => {
@ -149,7 +153,11 @@ const toggleLanguage = () => {
          </div>
        </div>
        <div class="user">
-          <el-select v-model="languageType" class="select-language" @change="toggleLanguage">
+          <span v-if="deviceType">
+            <img v-if="websocketConnected" width="20" :src="WifiConnSvg" alt="" />
+            <img v-else :src="WifiUnconnSvg" width="20" alt="" />
+          </span>
+          <el-select v-model="languageType" class="select-language" @change="toggleLanguage" :disabled="true">
            <el-option v-for="language in languages" :key="language.value" :value="language.value" :label="language.name">
              {{ language.name }}
            </el-option>
@ -166,7 +174,7 @@ const toggleLanguage = () => {
      <el-main>
        <router-view v-slot="{ Component }" class="content">
          <transition name="el-fade-in-linear">
-            <component :is="Component" />
+            <keep-alive include="seal"><component :is="Component" /></keep-alive>
          </transition>
        </router-view>
      </el-main>
@ -250,6 +258,10 @@ const toggleLanguage = () => {
      width: 20vw;
      text-align: right;
      right: 5px;
+      display: flex;
+      align-items: center;
+      gap: 25px;
+      padding-left: 10px;
      .select-language {
        width: 100px;
        border-radius: 5px;
@ -401,11 +413,12 @@ const toggleLanguage = () => {
  .alarm-info {
    font-size: 1.5rem;
    width: 53vw;
-    padding-left: 1.3vw;
+    //padding-left: 1.3vw;
    background: #F5F5F5;
    height: 5vh;
    display: flex;
    align-items: center;
+    justify-content: center;
    gap: 5px;
    .alarm-workState{
      margin-left: 5px;
--- a/src/main.ts
+++ b/src/main.ts
@ -4,6 +4,7 @@ import BTButton from 'components/common/BTButton/index.vue'
 import FtButton from 'components/common/FTButton/index.vue'
 import FtDialog from 'components/common/FTDialog/index.vue'
 import FtTable from 'components/common/FTTable/index.vue'
+
 import ElementPlus from 'element-plus'
 import locale from 'element-plus/es/locale/lang/zh-cn'
 import ErrorBox from 'libs/modalUtil'
@ -36,8 +37,9 @@ for (const [key, component] of Object.entries(ElementPlusIconsVue)) {
 }
 app.directive('prevent-keyboard', {
  mounted(el) {
+    console.log('el---', el)
    // 阻止输入框自动聚焦
-    el.querySelector('input').setAttribute('readonly', 'readonly')
+    // el.querySelector('input').setAttribute('readonly', 'readonly')
  },
 })
 app.config.warnHandler = () => null
--- a/src/router/index.ts
+++ b/src/router/index.ts
@ -1,15 +1,18 @@
 import type { NavigationGuardNext, RouteLocationNormalized } from 'vue-router'
 import { getToken } from '@/libs/token'
+import { createWebSocket } from 'libs/socket'
 import { createRouter, createWebHashHistory } from 'vue-router'
 import routes from './routes'

+const wsClient = createWebSocket()
+
 const router = createRouter({
  history: createWebHashHistory(),
  routes,
 })

 router.beforeEach((to: RouteLocationNormalized, from: RouteLocationNormalized, next: NavigationGuardNext) => {
-  if (getToken()) {
+  if (getToken() && wsClient.isConnected) {
    next()
  }
  else {
--- a/src/stores/deviceStore.ts
+++ b/src/stores/deviceStore.ts
@ -22,12 +22,29 @@ const initState = {
  state: DEVICE_STATES.IDLE,
 }

+const deviceTypeMap = {
+  LargeSpaceDM: 'DT600N', // 大空间
+  SmallSpaceDM: 'DT300N', // 小空间
+  PipeDM: 'DT300W', // 管道式
+  DrawBarDM: 'DT100N', // 拉杆箱
+  LargeSpaceDM_B: 'DT600B', // 大空间标准
+}
+
 export const useDeviceStore = defineStore('device', () => {
  const deviceInfo = ref<Device.DeviceInfo>(initDeviceInfo)
+  // 使用deviceType区分是什么消毒机。低成本消毒机部署在移动pad，不显示软件键盘的开关。 拉杆消毒机是上位机显示软键盘
+  // 暂时使用 deviceType ： ture 表示 为低成本。
+  const deviceType = ref(true)
  const deviceStete = ref<Device.State>(initState) // 设备状态

  const updateDeviceInfo = (info: Device.DeviceInfo) => {
    deviceInfo.value = info
+    if (info.projectType === 'SmallSpaceDM') {
+      deviceType.value = true
+    }
+    else {
+      deviceType.value = false
+    }
  }

  /**
@ -48,7 +65,9 @@ export const useDeviceStore = defineStore('device', () => {
  }

  return {
+    deviceTypeMap,
    deviceInfo,
+    deviceType,
    deviceStete,
    updateDeviceInfo,
    setDeviceState,
--- a/src/stores/formulaStore.ts
+++ b/src/stores/formulaStore.ts
@ -44,6 +44,7 @@ export const useFormulaStore = defineStore('formula', () => {
  const formulaConfigList = ref<Formula.FormulaConfig[]>([])
  const formulaList = ref<Formula.FormulaItem[]>([])
  const loglevel = ref<string>('1')
+  const flip = ref(true)

  watch(defaultFormulaInfo, (newVal) => {
    currentSelectedFormulaInfo.value = cloneDeep(newVal)
@ -158,6 +159,12 @@ export const useFormulaStore = defineStore('formula', () => {
      const res = await syncSendCmd(params)
      if (res.rely) {
        formulaList.value = res.rely
+        if (res.rely.length) {
+          currentSelectedFormulaInfo.value = res.rely[res.rely.length - 1]
+        }
+      }
+      else {
+        formulaList.value = []
      }
    }
    catch (error) {
@ -205,6 +212,10 @@ export const useFormulaStore = defineStore('formula', () => {
    }
  }

+  const updateFlip = (data: boolean) => {
+    flip.value = data
+  }
+
  return {
    // 属性
    logEnums,
@ -218,6 +229,7 @@ export const useFormulaStore = defineStore('formula', () => {
    selectedFormulaInfo,
    defaultFormulaInfo,
    isDefaultFormula,
+    flip,
    // 方法
    updatePressurList,
    updateSelectedFormulaData,
@ -229,5 +241,6 @@ export const useFormulaStore = defineStore('formula', () => {
    updateLogLevel,
    resetToDefaultFormula,
    getFormualDefaultData,
+    updateFlip,
  }
 })
--- a/src/stores/homeStore.ts
+++ b/src/stores/homeStore.ts
@ -38,6 +38,7 @@ export const useHomeStore = defineStore('home', () => {
  const disinfectionState = ref<Home.DisinfectState>(initDisinfectState) // 当前设备消毒状态
  let renderTimer: any
  const defaultIntensityValue = ref(0)
+  const defaultIntensityTypeValue = ref()

  /**
   * @function updateHomeData
@ -73,7 +74,6 @@ export const useHomeStore = defineStore('home', () => {
        params: { type },
      }
      syncSendCmd(pressureTypeParams)
-
      // 正压或负压时保存设置的压力值
      if (type === 'positivePressure' || type === 'negativePressure') {
        const intensity = pressureData[1]
@ -125,6 +125,10 @@ export const useHomeStore = defineStore('home', () => {
    defaultIntensityValue.value = value
  }

+  const updateDefaultIntensityTypeValue = (value: number) => {
+    defaultIntensityTypeValue.value = value
+  }
+
  return {
    isDeviceIdle,

@ -143,5 +147,8 @@ export const useHomeStore = defineStore('home', () => {

    defaultIntensityValue,
    updateDefaultIntensityValue,
+
+    defaultIntensityTypeValue,
+    updateDefaultIntensityTypeValue,
  }
 })
--- a/src/stores/systemStore.ts
+++ b/src/stores/systemStore.ts
@ -100,6 +100,7 @@ export const useSystemStore = defineStore('system', () => {
    systemList,
    loading,
    websocketConnected,
+
    updateLoading,
    updateConnected,
    subscribeDisinfectEvent,
--- a/src/types/user.d.ts
+++ b/src/types/user.d.ts
@ -44,4 +44,10 @@ declare namespace User {
    newpasswd: string
    confirmNewpasswd?: string
  }
+
+  interface UsrRole {
+    account: string
+    usrRole: string
+    id: number
+  }
 }
--- a/src/views/audit/index.vue
+++ b/src/views/audit/index.vue
@ -54,18 +54,19 @@ const getAuditList = async () => {
 * @desc 导出单条审计记录，需先选择一条记录
 */
 const onExportRecord = () => {
-  if (selectedUserList.value.length !== 1) {
-    FtMessage.warning('请选择一条数据进行导出')
-    return
-  }
+  // if (selectedUserList.value.length !== 1) {
+  //   FtMessage.warning('请选择一条数据进行导出')
+  //   return
+  // }
  const params = {
    className: 'AuditMgrService',
    fnName: 'exportData',
-    params: {},
  }
  syncSendCmd(params)
-    .then(() => {
-      FtMessage.success('导出成功')
+    .then((res) => {
+      if (res.ackcode === 0) {
+        FtMessage.success('导出成功')
+      }
    })
    .catch((error) => {
      console.error('导出审计记录失败:', error)
@ -95,23 +96,23 @@ const handleSelectionChange = (users: Audit.AuditItem[]) => {
 <template>
  <div class="dashboard-container">
    <main class="main-content">
-      <div>
-        <div class="audit-export">
-          <bt-button
-            type="primary"
-            button-text="导出"
-            @click="onExportRecord"
-          />
-        </div>
-        <el-table class="audit-table" :data="tableData" stripe style="width: 100%" @selection-change="handleSelectionChange">
+      <div class="audit-export">
+        <bt-button
+          type="primary"
+          button-text="导出"
+          @click="onExportRecord"
+        />
+      </div>
+      <div class="audit-table">
+        <el-table :data="tableData" stripe style="width: 100%" @selection-change="handleSelectionChange">
          <el-table-column type="selection" width="55" />
-          <el-table-column prop="usrName" label="操作人" width="150" />
+          <el-table-column prop="usrName" label="操作人" width="250" />
          <el-table-column prop="behaviorinfo" label="操作内容" />
          <el-table-column prop="date" label="操作时间" width="250" />
        </el-table>
-        <div class="audit-pagination">
-          <el-pagination layout="prev, pager, next" :total="totle" @current-change="handleCurrentChange" />
-        </div>
+      </div>
+      <div class="audit-pagination">
+        <el-pagination layout="prev, pager, next" :total="totle" @current-change="handleCurrentChange" />
      </div>
    </main>
  </div>
@ -124,16 +125,21 @@ const handleSelectionChange = (users: Audit.AuditItem[]) => {
  background: $gradient-color;
  box-shadow: 0px 1px 5px 0px rgba(9, 39, 62, 0.15);
  .audit-export{
-    margin: 2vw;
-  }
-  .audit-pagination{
-    bottom: 1rem;
-    position: absolute;
-    right: 2rem;
+    padding: 2vw;
+    display: flex;
+    align-items: center;
+    height: 12%;
  }
  .audit-table{
    max-height: 67vh;
    overflow: auto;
+    height: 76%;
+  }
+  .audit-pagination{
+    height: 12%;
+    display: flex;
+    justify-content: end;
+    align-items: center;
  }
 }
 </style>
--- a/src/views/formula/index.vue
+++ b/src/views/formula/index.vue
@ -3,16 +3,21 @@ import { useFormulaStore } from '@/stores/formulaStore'
 import { syncSendCmd } from 'apis/system'
 import FormulaConfig from 'components/formula/FormulaConfig.vue'
 import FormulaTable from 'components/formula/FormulaTable.vue'
+import { FtMessage } from 'libs/message'

 const formulaStore = useFormulaStore()
 const onAddFormula = () => {
  const params = {
    className: 'SettingMgrService',
    fnName: 'addNewFormula',
-    params: {},
  }
-  syncSendCmd(params).then(() => {
-    formulaStore.initFormulaList()
+  formulaStore.updateFlip(false)
+  syncSendCmd(params).then((res) => {
+    if (res.ackcode === 0) {
+      FtMessage.success('新增成功')
+      formulaStore.initFormulaList()
+      formulaStore.updateFlip(true)
+    }
  })
 }
 </script>
@ -69,8 +74,8 @@ const onAddFormula = () => {
    .formula-list{
      display: flex;
      justify-content: center;
-      height: 75vh;
-      max-height: 75vh;
+      height: 74vh;
+      max-height: 74vh;
    }
  }
  .formula-right{
--- a/src/views/home/chart.vue
+++ b/src/views/home/chart.vue
@ -180,7 +180,7 @@ const onClose = () => {
  background: $gradient-color;
  height: $main-container-height;
  .line-chart-formula{
-    width: 25vw;
+    width: 30vw;
    background: #E0F0FF;
    height: 3.5rem;
    display: flex;
--- a/src/views/liquid/index.vue
+++ b/src/views/liquid/index.vue
@ -12,8 +12,8 @@ import homeStart from 'assets/images/home/home-start.svg'
 import SoftKeyboard from 'components/common/SoftKeyboard/index.vue'
 import LiquidLevel from 'components/liquid/LiquidLevel.vue'
 import { ElMessage } from 'element-plus'
-import { roundNumber } from 'libs/utils'
-import { computed, onMounted, ref, watchEffect } from 'vue'
+// import { roundNumber } from 'libs/utils'
+import { onMounted, ref, watch, watchEffect } from 'vue'

 const liquidStore = useLiquidStore()
 const homeStore = useHomeStore()
@ -46,7 +46,6 @@ onMounted(() => {
 })

 watchEffect(() => {
-  stopatg.value = inputValue.value
  addWorkState.value = liquidStore.liquidAddWorkState
  drainWorkState.value = liquidStore.liquidDrainWorkState
  liquidTotoal.value = liquidStore.liquidTotal
@ -56,6 +55,10 @@ watchEffect(() => {
  loading.value = systemStore.loading
 })

+watch(inputValue, (newVal: string | number) => {
+  stopatg.value = newVal
+})
+
 const subScribeLiquid = () => { // 事件订阅
  subscribeEvent('stateUpdate', (data: Socket.WebSocketResponse<Liquid.LiquidData>) => {
    if (data.fromClass === 'AddLiquidService') {
@ -72,9 +75,9 @@ const openKeyboard = () => {
  keyboardVisible.value = true
 }

-const nowLiquid = computed(() => {
-  return roundNumber(liquidStateData.value.nowLiquid, 0)
-})
+// const nowLiquid = computed(() => {
+//   return roundNumber(liquidStateData.value.nowLiquid, 0)
+// })

 const handleConfirm = (value: string) => {
  console.log('确认输入:', value)
@ -124,6 +127,7 @@ const onStartDrainLiquid = async () => {
    FtMessageBox.error(statusName)
    return
  }
+  inputValue.value = ''
  const params = {
    className: 'DrainLiquidService',
    fnName: 'start',
@ -159,10 +163,7 @@ const onStopDrainLiquid = async () => {
      <div class="liquid-right">
        <!-- 当前液位 -->
        <div class="liquid-surplus-title">
-          <div>当前液位：</div>
-          <div class="liquid-title-g">
-            {{ nowLiquid }}g
-          </div>
+          <div>目标液位：</div>
        </div>

        <!-- 输入加液/排液量 -->
@ -181,6 +182,7 @@ const onStopDrainLiquid = async () => {
                type="primary"
                :button-text="`${liquidTotoal}g`"
                bg-color="#2892F3"
+                border-radius="0"
                text-color="#ffffff"
                height="4rem"
                text-size="24px"
@ -202,6 +204,8 @@ const onStopDrainLiquid = async () => {
                :height="btnStyle.height"
                :text-size="btnStyle.textSize"
                :border-radius="btnStyle.borderRadius"
+                :disabled="drainWorkState.workState !== 'idle'"
+                min-height="4rem"
                @click="onStartAddLiquid"
              >
                <template #icon>
@ -218,6 +222,7 @@ const onStopDrainLiquid = async () => {
                :text-size="btnStyle.textSize"
                :border-radius="btnStyle.borderRadius"
                :disabled="addWorkState.workState === 'emptyLineLiquid'"
+                min-height="4rem"
                @click="onStopAddLiquid"
              >
                <template #icon>
@ -235,6 +240,8 @@ const onStopDrainLiquid = async () => {
                :height="btnStyle.height"
                :text-size="btnStyle.textSize"
                :border-radius="btnStyle.borderRadius"
+                :disabled="addWorkState.workState !== 'idle'"
+                min-height="4rem"
                @click="onStartDrainLiquid"
              >
                <template #icon>
@ -250,6 +257,7 @@ const onStopDrainLiquid = async () => {
                :height="btnStyle.height"
                :text-size="btnStyle.textSize"
                :border-radius="btnStyle.borderRadius"
+                min-height="4rem"
                @click="onStopDrainLiquid"
              >
                <template #icon>
@ -296,7 +304,7 @@ const onStopDrainLiquid = async () => {
    width: 100%;
    background: $gradient-color;
    .liquid-surplus-title{
-      height: 10vh;
+      height: 13vh;
      display: flex;
      padding-left: 2.5rem;
      align-items: center;
@ -320,7 +328,7 @@ const onStopDrainLiquid = async () => {
    .liquid-opt{
      display: flex;
      justify-content: center;
-      margin-top: 5vh;
+      margin-top: 4vh;
    }
    .liquid-add-btn{
      width: 25vw;
--- a/src/views/login/index.vue
+++ b/src/views/login/index.vue
@ -1,11 +1,13 @@
 <script setup lang="ts">
 import { FtMessage } from '@/libs/message'
 import { setToken } from '@/libs/token'
+import { syncSendCmd } from 'apis/system'
 import { login } from 'apis/user'
 import logo from 'assets/images/logo.svg'
 import password from 'assets/images/password_icon.svg'
 import user from 'assets/images/user_icon.svg'
 import SoftKeyboard from 'components/common/SoftKeyboard/index.vue'
+import { nanoid } from 'nanoid'
 import { useSystemStore } from 'stores/systemStore'
 import { ref, watchEffect } from 'vue'
 import { useRouter } from 'vue-router'
@ -20,6 +22,7 @@ const keyboardType = ref<'text' | 'number'>('text')
 const softKeyboardRef = ref()
 const loginForm = ref<Record<string, any>>(sys.loginForm)
 const focusedInput = ref<string | null>(null)
+const keyboardKey = ref(nanoid())

 const rules = {
  username: [
@ -40,6 +43,7 @@ watchEffect(() => {

 const openKeyboard = (e: { target: { name: string | null } }) => {
  keyboardVisible.value = true
+  keyboardKey.value = nanoid()
  if (e.target.name) {
    const labelName = e.target.name
    const formValue = loginForm.value[labelName]
@ -58,6 +62,16 @@ const loginHandle = async () => {
    login(loginForm.value as User.Login).then(async (res) => {
      if (res.ackcode === 0) {
        setToken('login success')
+        // 获取用户信息
+        const params = {
+          className: 'UserMgrService',
+          fnName: 'getLoginUser',
+        }
+        syncSendCmd(params).then((res) => {
+          if (res.ackcode === 0) {
+            localStorage.setItem('user', JSON.stringify(res.rely.loginUser))
+          }
+        })
        await router.push('/home')
      }
      loading.value = false
@ -134,6 +148,7 @@ const loginHandle = async () => {
      <SoftKeyboard
        ref="softKeyboardRef"
        v-model="inputValue"
+        :key="keyboardKey"
        :is-visible="keyboardVisible"
        :keyboard-type="keyboardType"
        @update-keyboard-visible="(visible: boolean) => keyboardVisible = visible"
--- a/src/views/seal/index.vue
+++ b/src/views/seal/index.vue
@ -11,8 +11,11 @@ import SealInstrumentSvg from 'assets/images/seal/seal-instrument.svg'
 import SoftKeyboard from 'components/common/SoftKeyboard/index.vue'
 import DashboardChart from 'components/seal/DashboardChart.vue'
 import { startPosityveTimer, stopPosityveTimer } from 'libs/timer'
-import { computed, onMounted, ref, watchEffect } from 'vue'
+import { computed, onMounted, ref, watch, watchEffect } from 'vue'

+defineOptions({
+  name: 'seal',
+})
 const sealStore = useSealStore()
 const systemStore = useSystemStore()
 const sealInfo = ref(sealStore.sealInfo)
@ -43,11 +46,19 @@ const getFirstPressure = () => {

 watchEffect(() => {
  sealInfo.value = sealStore.sealInfo
-  inflationTime.value = inputValue.value
  realTimePressure.value = sealStore.sealInfo.pressure
  getFirstPressure()
 })

+watch(inputValue, (newVal: string | number) => {
+  if (Number(newVal) < 1000) {
+    inflationTime.value = newVal
+  }
+  // else {
+  //   inputValue.value = inflationTime.value
+  // }
+})
+
 const subscribeSealState = () => {
  // 订阅测试状态
  subscribeEvent('stateUpdate', (data: Socket.WebSocketResponse<Seal.SealStateItem>) => {
@ -97,8 +108,7 @@ const onStartTest = () => {
    else {
      FtMessage.error('指令发送失败，请稍候再试')
    }
-  }).catch((e) => {
-    console.log('e----------', e.message)
+  }).catch(() => {
    loading.value = false
    FtMessage.error('指令发送失败，请稍候再试')
  })
@ -197,10 +207,12 @@ const stopDisabled = computed(() => {
                <bt-button
                  type="primary"
                  button-text="秒"
+                  border-radius="0"
                  bg-color="#2892F3"
                  text-color="#ffffff"
                  height="4rem"
                  text-size="24px"
+                  min-height="4rem"
                />
              </template>
            </el-input>
@ -216,6 +228,7 @@ const stopDisabled = computed(() => {
                text-size="24px"
                border-radius="12px"
                :disabled="sealInfo.workState !== 'idle'"
+                min-height="4rem"
                @click="onStartTest"
              >
                <template #icon>
@ -233,6 +246,7 @@ const stopDisabled = computed(() => {
                text-size="24px"
                border-radius="12px"
                :disabled="stopDisabled"
+                min-height="4rem"
                @click="onFinishTest"
              >
                <template #icon>