检验项目维护界面

2025-10-21 17:43:57 +08:00 · 2025-10-21 17:43:57 +08:00 · 1c7e2c2c3e
commit 1c7e2c2c3e
parent c65531f531
8 changed files with 324 additions and 21 deletions
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@ -11,6 +11,9 @@ importers:
      '@element-plus/icons-vue':
        specifier: 2.3.1
        version: 2.3.1(vue@3.4.0)
+      '@fingerprintjs/fingerprintjs':
+        specifier: ^4.6.2
+        version: 4.6.2
      '@vueup/vue-quill':
        specifier: 1.2.0
        version: 1.2.0(vue@3.4.0)
@ -27,8 +30,8 @@ importers:
        specifier: 5.4.3
        version: 5.4.3
      element-plus:
-        specifier: 2.4.3
-        version: 2.4.3(vue@3.4.0)
+        specifier: ^2.11.2
+        version: 2.11.5(vue@3.4.0)
      file-saver:
        specifier: 2.0.5
        version: 2.0.5
@ -65,6 +68,9 @@ importers:
      socket.io-client:
        specifier: ^4.8.1
        version: 4.8.1
+      sortablejs:
+        specifier: ^1.14.0
+        version: 1.14.0
      vue:
        specifier: 3.4.0
        version: 3.4.0
@ -86,6 +92,12 @@ importers:
      vuedraggable:
        specifier: ^4.1.0
        version: 4.1.0(vue@3.4.0)
+      vxe-pc-ui:
+        specifier: ^4.3.2
+        version: 4.10.3(vue@3.4.0)
+      vxe-table:
+        specifier: ^4.9.4
+        version: 4.17.0(vue@3.4.0)
    devDependencies:
      '@eslint/js':
        specifier: ^9.27.0
@ -171,6 +183,11 @@ packages:
    peerDependencies:
      vue: ^3.2.0

+  '@element-plus/icons-vue@2.3.2':
+    resolution: {integrity: sha512-OzIuTaIfC8QXEPmJvB4Y4kw34rSXdCJzxcD1kFStBvr8bK6X1zQAYDo0CNMjojnfTqRQCJ0I7prlErcoRiET2A==}
+    peerDependencies:
+      vue: ^3.2.0
+
  '@esbuild/aix-ppc64@0.19.12':
    resolution: {integrity: sha512-bmoCYyWdEL3wDQIVbcyzRyeKLgk2WtWLTWz1ZIAZF/EGbNOwSA6ew3PftJ1PqMiOOGu0OyFMzG53L0zqIpPeNA==}
    engines: {node: '>=12'}
@ -347,6 +364,9 @@ packages:
    resolution: {integrity: sha512-0J+zgWxHN+xXONWIyPWKFMgVuJoZuGiIFu8yxk7RJjxkzpGmyja5wRFqZIVtjDVOQpV+Rw0iOAjYPE2eQyjr0w==}
    engines: {node: ^18.18.0 || ^20.9.0 || >=21.1.0}

+  '@fingerprintjs/fingerprintjs@4.6.2':
+    resolution: {integrity: sha512-g8mXuqcFKbgH2CZKwPfVtsUJDHyvcgIABQI7Y0tzWEFXpGxJaXuAuzlifT2oTakjDBLTK4Gaa9/5PERDhqUjtw==}
+
  '@floating-ui/core@1.6.9':
    resolution: {integrity: sha512-uMXCuQ3BItDUbAMhIXw7UPXRfAlOAvZzdK9BWpE60MCn+Svt3aLn9jsPTi/WNGlRUu2uI0v5S7JiIUsbsvh3fw==}

@ -538,8 +558,8 @@ packages:
  '@types/lodash-es@4.17.12':
    resolution: {integrity: sha512-0NgftHUcV4v34VhXm8QBSftKVXtbkBG3ViCjs6+eJ5a6y6Mi/jiFGPc1sC7QK+9BFhWrURE3EOggmWaSxL9OzQ==}

-  '@types/lodash@4.17.16':
-    resolution: {integrity: sha512-HX7Em5NYQAXKW+1T+FiuG27NGwzJfCX3s1GjOa7ujxZa52kjJLOr4FUxT+giF6Tgxv1e+/czV/iTtBw27WTU9g==}
+  '@types/lodash@4.17.20':
+    resolution: {integrity: sha512-H3MHACvFUEiujabxhaI/ImO6gUrd8oOurg7LQtS7mbwIXA/cUqWrvBsaeJ23aZEPk1TAYkurjfMbSELfoCXlGA==}

  '@types/minimatch@3.0.5':
    resolution: {integrity: sha512-Klz949h02Gz2uZCMGwDUSDS1YBlTdDDgbWHi+81l29tQALUtvz4rAYi5uoVhE5Lagoq6DeqAUlbrHvW/mXDgdQ==}
@ -621,6 +641,11 @@ packages:
  '@vueuse/shared@9.13.0':
    resolution: {integrity: sha512-UrnhU+Cnufu4S6JLCPZnkWh0WwZGUp72ktOF2DFptMlOs3TOdVv8xJN53zhHGARmVOsz5KqOls09+J1NR6sBKw==}

+  '@vxe-ui/core@4.2.12':
+    resolution: {integrity: sha512-g6gNDykKrKLzxsDDFDYTD/6tWrV9AfSaU7WIlKCO67BSXgKDMaEVTsH7ZZ7fI5qkOO9DH1vo07kbacyBNx7gSQ==}
+    peerDependencies:
+      vue: ^3.2.0
+
  '@wtto00/html2canvas@1.4.3':
    resolution: {integrity: sha512-jwsb+xL8N+gjrSNABSaFdxmWtE4c7RNFjP20lo1G7gs63Qqo1phhxVBTzxc/apDVh6LgXsU2l5bwKtXd9uz65w==}
    engines: {node: '>=8.0.0'}
@ -923,8 +948,8 @@ packages:
    resolution: {integrity: sha512-BS8PfmtDGnrgYdOonGZQdLZslWIeCGFP9tpan0hi1Co2Zr2NKADsvGYA8XxuG/4UWgJ6Cjtv+YJnB6MM69QGlQ==}
    engines: {node: '>= 0.4'}

-  dayjs@1.11.13:
-    resolution: {integrity: sha512-oaMBel6gjolK862uaPQOVTA7q3TZhuSvuMQAAglQDOWYO9A91IrAOUJEyKVlqJlHE0vq5p5UXxzdPfMH/x6xNg==}
+  dayjs@1.11.18:
+    resolution: {integrity: sha512-zFBQ7WFRvVRhKcWoUh+ZA1g2HVgUbsZm9sbddh8EC5iv93sui8DVVz1Npvz+r6meo9VKfa8NyLWBsQK1VvIKPA==}

  debug@2.6.9:
    resolution: {integrity: sha512-bC7ElrdJaJnPbAP+1EotYvqZsb3ecl5wi6Bfi6BJTUcNowp6cvspg0jXznRTKDjm/E7AdgFBVeAPVMNcKGsHMA==}
@ -996,6 +1021,9 @@ packages:
  dom-serializer@1.4.1:
    resolution: {integrity: sha512-VHwB3KfrcOOkelEG2ZOfxqLZdfkil8PtJi4P8N2MMXucZq2yLp75ClViUlOVwyoHEDjYU433Aq+5zWP61+RGag==}

+  dom-zindex@1.0.6:
+    resolution: {integrity: sha512-FKWIhiU96bi3xpP9ewRMgANsoVmMUBnMnmpCT6dPMZOunVYJQmJhSRruoI0XSPoHeIif3kyEuiHbFrOJwEJaEA==}
+
  domelementtype@1.3.1:
    resolution: {integrity: sha512-BSKB+TSpMpFI/HOxCNr1O8aMOTZ8hT3pM3GQ0w/mWRmkhEDSFJkkyzz4XQsBV44BChwGkrDfMyjVD0eA2aFV3w==}

@ -1033,8 +1061,8 @@ packages:
    engines: {node: '>=14'}
    hasBin: true

-  element-plus@2.4.3:
-    resolution: {integrity: sha512-b3q26j+lM4SBqiyzw8HybybGnP2pk4MWgrnzzzYW5qKQUgV6EG1Zg7nMCfgCVccI8tNvZoTiUHb2mFaiB9qT8w==}
+  element-plus@2.11.5:
+    resolution: {integrity: sha512-O+bIVHQCjUDm4GiIznDXRoS8ar2TpWLwfOGnN/Aam0VXf5kbuc4SxdKKJdovWNxmxeqbcwjsSZPKgtXNcqys4A==}
    peerDependencies:
      vue: ^3.2.0

@ -1094,9 +1122,6 @@ packages:
    engines: {node: '>=12'}
    hasBin: true

-  escape-html@1.0.3:
-    resolution: {integrity: sha512-NiSupZ4OeuGwr68lGIeym/ksIZMJodUGOSCZ/FSnTxcrekbvqrgdUxlJOMpijaKZVjAJrWrGs/6Jy8OMuyj9ow==}
-
  escape-string-regexp@1.0.5:
    resolution: {integrity: sha512-vbRorB5FUQWvla16U8R/qgaFIya2qGzwDrNmCZuYKrbdSUMG6I1ZCGQRefkRVhuOkIGVne7BQ35DSfo1qvJqFg==}
    engines: {node: '>=0.8.0'}
@ -2362,6 +2387,9 @@ packages:
  tslib@2.3.0:
    resolution: {integrity: sha512-N82ooyxVNm6h1riLCoyS9e3fuJ3AMG2zIZs2Gd1ATcSFjSA23Q0fzjjZeh0jbJvWVDZ0cJT8yaNNaaXHzueNjg==}

+  tslib@2.8.1:
+    resolution: {integrity: sha512-oJFu94HQb+KVduSUQL7wnpmqnfmLsOA/nAh6b6EH0wCEoK0/mPeXU6c3wKDV83MkOuHPRHtSXKKU99IBazS/2w==}
+
  type-check@0.4.0:
    resolution: {integrity: sha512-XleUoc9uwGXqjWwXaUTZAmzMcFZ5858QA2vvx1Ur5xIcixXIP+8LnFDgRplU30us6teqdlskFfu+ae4K79Ooew==}
    engines: {node: '>= 0.8.0'}
@ -2546,6 +2574,12 @@ packages:
    peerDependencies:
      vue: ^3.0.1

+  vxe-pc-ui@4.10.3:
+    resolution: {integrity: sha512-CLjY8NTgj1xQzuWoActFFEbqvs9THPCLChl5j7dLuOxaVJWtupDKdhG2hPEgd5X8umFqmiiSY6NNPhMAA+4kdw==}
+
+  vxe-table@4.17.0:
+    resolution: {integrity: sha512-IpyY5uzgMt4NEgTl0brAFe/xSyrBK8U0763uCG8LUe8TbGVuWMD5bCP9DYqkjK7cBmJjXtzwxlQ6I3auzCGd3Q==}
+
  webpack-virtual-modules@0.6.2:
    resolution: {integrity: sha512-66/V2i5hQanC51vBQKPH4aI8NMAcBW59FVBs+rC7eGHupMyfn34q7rZIE+ETlJ+XTevqfUhVVBgSUNSW2flEUQ==}

@ -2594,6 +2628,9 @@ packages:
      utf-8-validate:
        optional: true

+  xe-utils@3.7.9:
+    resolution: {integrity: sha512-LWH6M7g+TKX8P2fqGxDPgJQygiULhbMtpmfxTMxJTUjuUv9y2+I45UCcVLh5AnmJSxDV1xTxsq7G5P9Eid06JQ==}
+
  xml-name-validator@4.0.0:
    resolution: {integrity: sha512-ICP2e+jsHvAj2E2lIHxa5tjXRlKDJo4IdvPvCXbXQGdzSfmSpNVyIKMvoZHjDY9DP0zV17iI85o90vRFXNccRw==}
    engines: {node: '>=12'}
@ -2643,6 +2680,10 @@ snapshots:
    dependencies:
      vue: 3.4.0

+  '@element-plus/icons-vue@2.3.2(vue@3.4.0)':
+    dependencies:
+      vue: 3.4.0
+
  '@esbuild/aix-ppc64@0.19.12':
    optional: true

@ -2756,6 +2797,10 @@ snapshots:
      '@eslint/core': 0.14.0
      levn: 0.4.1

+  '@fingerprintjs/fingerprintjs@4.6.2':
+    dependencies:
+      tslib: 2.8.1
+
  '@floating-ui/core@1.6.9':
    dependencies:
      '@floating-ui/utils': 0.2.9
@ -2894,9 +2939,9 @@ snapshots:

  '@types/lodash-es@4.17.12':
    dependencies:
-      '@types/lodash': 4.17.16
+      '@types/lodash': 4.17.20

-  '@types/lodash@4.17.16': {}
+  '@types/lodash@4.17.20': {}

  '@types/minimatch@3.0.5': {}

@ -3018,6 +3063,12 @@ snapshots:
      - '@vue/composition-api'
      - vue

+  '@vxe-ui/core@4.2.12(vue@3.4.0)':
+    dependencies:
+      dom-zindex: 1.0.6
+      vue: 3.4.0
+      xe-utils: 3.7.9
+
  '@wtto00/html2canvas@1.4.3':
    dependencies:
      css-line-break: 2.1.0
@ -3339,7 +3390,7 @@ snapshots:
      es-errors: 1.3.0
      is-data-view: 1.0.2

-  dayjs@1.11.13: {}
+  dayjs@1.11.18: {}

  debug@2.6.9:
    dependencies:
@ -3406,6 +3457,8 @@ snapshots:
      domhandler: 4.3.1
      entities: 2.2.0

+  dom-zindex@1.0.6: {}
+
  domelementtype@1.3.1: {}

  domelementtype@2.3.0: {}
@ -3452,18 +3505,17 @@ snapshots:
      minimatch: 9.0.1
      semver: 7.7.1

-  element-plus@2.4.3(vue@3.4.0):
+  element-plus@2.11.5(vue@3.4.0):
    dependencies:
      '@ctrl/tinycolor': 3.6.1
-      '@element-plus/icons-vue': 2.3.1(vue@3.4.0)
+      '@element-plus/icons-vue': 2.3.2(vue@3.4.0)
      '@floating-ui/dom': 1.6.13
      '@popperjs/core': '@sxzz/popperjs-es@2.11.7'
-      '@types/lodash': 4.17.16
+      '@types/lodash': 4.17.20
      '@types/lodash-es': 4.17.12
      '@vueuse/core': 9.13.0(vue@3.4.0)
      async-validator: 4.2.5
-      dayjs: 1.11.13
-      escape-html: 1.0.3
+      dayjs: 1.11.18
      lodash: 4.17.21
      lodash-es: 4.17.21
      lodash-unified: 1.0.3(@types/lodash-es@4.17.12)(lodash-es@4.17.21)(lodash@4.17.21)
@ -3600,8 +3652,6 @@ snapshots:
      '@esbuild/win32-ia32': 0.19.12
      '@esbuild/win32-x64': 0.19.12

-  escape-html@1.0.3: {}
-
  escape-string-regexp@1.0.5: {}

  escape-string-regexp@4.0.0: {}
@ -5013,6 +5063,8 @@ snapshots:

  tslib@2.3.0: {}

+  tslib@2.8.1: {}
+
  type-check@0.4.0:
    dependencies:
      prelude-ls: 1.2.1
@ -5249,6 +5301,18 @@ snapshots:
      sortablejs: 1.14.0
      vue: 3.4.0

+  vxe-pc-ui@4.10.3(vue@3.4.0):
+    dependencies:
+      '@vxe-ui/core': 4.2.12(vue@3.4.0)
+    transitivePeerDependencies:
+      - vue
+
+  vxe-table@4.17.0(vue@3.4.0):
+    dependencies:
+      vxe-pc-ui: 4.10.3(vue@3.4.0)
+    transitivePeerDependencies:
+      - vue
+
  webpack-virtual-modules@0.6.2: {}

  which-boxed-primitive@1.1.1:
@ -5311,6 +5375,8 @@ snapshots:

  ws@8.17.1: {}

+  xe-utils@3.7.9: {}
+
  xml-name-validator@4.0.0: {}

  xmlhttprequest-ssl@2.1.2: {}
--- a/src/views/liswork/labItem/index.vue
+++ b/src/views/liswork/labItem/index.vue
@ -0,0 +1,128 @@
+<template>
+  <div class="app-container">
+    <el-row :gutter="20">
+      <el-col :span="14" :xs="24">
+         <!--  表单区域-->
+        <el-form :inline="true" :model="queryParams" class="mb8">
+           <el-form-item label="项目类别" prop="userName">
+              <el-input clearable placeholder="项目类别" prefix-icon="Search" style="width: 150px"/>
+           </el-form-item>
+          <el-form-item label="细菌标志" prop="bacteriaFlag">
+              <el-input clearable placeholder="细菌标志" prefix-icon="Search" style="width: 150px"/>
+          </el-form-item>
+          <el-form-item label="仪器代号" prop="instrumentCode">
+              <el-input clearable placeholder="仪器代号" prefix-icon="Search" style="width: 130px"/>
+          </el-form-item>
+          <el-form-item label="快速查找">
+              <el-input clearable placeholder="快速查找" prefix-icon="Search" style="width: 150px"/>
+          </el-form-item>
+          <el-form-item label="仪器大类">
+            <el-input clearable placeholder="仪器大类" prefix-icon="Search" style="width: 150px"/>
+          </el-form-item>
+          <el-form-item label="项目ID">
+            <el-input clearable placeholder="项目ID" prefix-icon="Search" style="width: 150px"/>
+          </el-form-item>
+          <el-form-item>
+            <el-radio-group v-model="status" fill="primary" size="large">
+              <el-radio label="1" >在用</el-radio>
+              <el-radio label="2">停用</el-radio>
+              <el-radio label="3">所有</el-radio>
+            </el-radio-group>
+          </el-form-item>
+          <el-form-item>
+           <el-checkbox v-model="isMIC" label="隐藏微生物项目" size="large" />
+        </el-form-item>
+        </el-form>
+        <el-row :gutter="10" class="mb8">
+          <el-col :span="1.5">
+            <el-button type="primary" plain icon="Plus" @click="handleAdd">新增</el-button>
+            <el-button type="primary" plain icon="Plus" @click="handleDel">删除</el-button>
+            <el-button type="primary" plain icon="Plus" @click="handleDelCorr">删除对应</el-button>
+            <el-button type="primary" plain icon="Plus" @click="handleSave">保存</el-button>
+          </el-col>
+        </el-row>
+          <!--  表格区域-->
+        <el-table :data="dataList" height="65vh">
+            <el-table-column label="项目类别" align="center"></el-table-column>
+            <el-table-column label="英文缩写" align="center"></el-table-column>
+            <el-table-column label="名称" align="center"></el-table-column>
+            <el-table-column label="参考值" align="center"></el-table-column>
+            <el-table-column label="单位" align="center"></el-table-column>
+            <el-table-column label="结果类型" align="center"></el-table-column>
+            <el-table-column label="计算项目" align="center"></el-table-column>
+            <el-table-column label="序号" align="center"></el-table-column>
+            <el-table-column label="小数位数" align="center"></el-table-column>
+            <el-table-column label="稀释倍数" align="center"></el-table-column>
+            <el-table-column label="停用" align="center"></el-table-column>
+            <el-table-column label="仪器大类" align="center"></el-table-column>
+            <el-table-column label="项目ID" align="center"></el-table-column>
+            <el-table-column label="项目编码" align="center"></el-table-column>
+            <el-table-column label="外部代码1" align="center"></el-table-column>
+            <el-table-column label="外部代码2" align="center"></el-table-column>
+            <el-table-column label="外部代码3" align="center"></el-table-column>
+            <el-table-column label="英文名称" align="center"></el-table-column>
+        </el-table>
+      </el-col>
+      <!--  右侧区域-->
+      <el-col :span="10" :xs="24">
+        <div class="flex gap-2 mt-4">
+          <el-check-tag checked type="primary" @click="handleTabClick('1')">基本资料</el-check-tag>
+          <el-check-tag checked type="primary" @click="handleTabClick('2')">常用取值</el-check-tag>
+          <el-check-tag checked type="primary" @click="handleTabClick('3')">使用仪器</el-check-tag>
+          <el-check-tag checked type="primary" @click="handleTabClick('4')">知识库</el-check-tag>
+          <el-check-tag checked type="primary" @click="handleTabClick('5')">整体排序</el-check-tag>
+          <el-check-tag checked type="primary" @click="handleTabClick('6')">常见描述</el-check-tag>
+        </div>
+        <div>
+          <Basic :visible="tabVisible === '1'"/>
+          <CommmonlyValues :visible="tabVisible === '2'"/>
+          <UseInstr :visible="tabVisible === '3'"/>
+          <Knowledge :visible="tabVisible === '4'"/>
+          <Sort :visible="tabVisible === '5'"/>
+          <CommonDescriptions :visible="tabVisible === '6'"/>
+        </div>
+      </el-col>
+    </el-row>
+  </div>
+</template>
+
+<script setup>
+import { ref } from 'vue';
+import Basic from './tab/basic.vue'
+import CommmonlyValues from './tab/commmonlyValues.vue'
+import UseInstr from './tab/useInstr.vue'
+import Knowledge from './tab/knowledge.vue'
+import CommonDescriptions from './tab/commonDescriptions.vue'
+import Sort from './tab/sort.vue'
+
+const status = ref(1);
+const isMIC = ref(false);
+const dataList = ref([])
+const tabVisible = ref('1')
+
+//新增
+const handleAdd = () => {
+  console.log('新增')
+}
+
+//删除
+const handleDel = () => {
+  console.log('删除')
+}
+
+//删除对应
+const handleDelCorr = () => {
+  console.log('删除对应')
+}
+
+//保存
+const handleSave = () => {
+  console.log('保存')
+}
+
+//标签切换
+const handleTabClick = (tab) => {
+  tabVisible.value = tab
+}
+
+</script>
--- a/src/views/liswork/labItem/tab/basic.vue
+++ b/src/views/liswork/labItem/tab/basic.vue
@ -0,0 +1,20 @@
+<template>
+<!-- 基本资料 -->
+<div v-show="visible" class="app-container">
+  
+  基本资料内容
+</div>
+</template>
+
+<script setup>
+import { ref } from 'vue';
+
+const props = defineProps({
+  // 定义一个名为 'exampleProp' 的字符串类型的 prop
+  visible: {
+    type: String,
+    required: true,
+    default: 'false'
+  }
+});
+</script>
--- a/src/views/liswork/labItem/tab/commmonlyValues.vue
+++ b/src/views/liswork/labItem/tab/commmonlyValues.vue
@ -0,0 +1,17 @@
+<!-- 常用取值 -->
+<template>
+<div v-show="visible">常用取值内容</div>
+</template>
+
+<script setup>
+import { ref } from 'vue';
+
+const props = defineProps({
+  // 定义一个名为 'exampleProp' 的字符串类型的 prop
+  visible: {
+    type: String,
+    required: true,
+    default: 'false'
+  }
+});
+</script>
--- a/src/views/liswork/labItem/tab/commonDescriptions.vue
+++ b/src/views/liswork/labItem/tab/commonDescriptions.vue
@ -0,0 +1,18 @@
+<template>
+<!-- 常见描述 -->
+ <div v-show="visible">常见描述内容</div>
+</template>
+
+
+<script setup>
+import { ref } from 'vue';
+
+const props = defineProps({
+  // 定义一个名为 'exampleProp' 的字符串类型的 prop
+  visible: {
+    type: String,
+    required: true,
+    default: 'false'
+  }
+});
+</script>
--- a/src/views/liswork/labItem/tab/knowledge.vue
+++ b/src/views/liswork/labItem/tab/knowledge.vue
@ -0,0 +1,18 @@
+<template>
+<!-- 知识库 -->
+ <div v-show="visible">知识库内容</div>
+</template>
+
+
+<script setup>
+import { ref } from 'vue';
+
+const props = defineProps({
+  // 定义一个名为 'exampleProp' 的字符串类型的 prop
+  visible: {
+    type: String,
+    required: true,
+    default: 'false'
+  }
+});
+</script>
--- a/src/views/liswork/labItem/tab/sort.vue
+++ b/src/views/liswork/labItem/tab/sort.vue
@ -0,0 +1,18 @@
+<template>
+<!-- 整体排序 -->
+ <div v-show="visible">整体排序内容</div>
+</template>
+
+
+<script setup>
+import { ref } from 'vue';
+
+const props = defineProps({
+  // 定义一个名为 'exampleProp' 的字符串类型的 prop
+  visible: {
+    type: String,
+    required: true,
+    default: 'false'
+  }
+});
+</script>
--- a/src/views/liswork/labItem/tab/useInstr.vue
+++ b/src/views/liswork/labItem/tab/useInstr.vue
@ -0,0 +1,18 @@
+<template>
+<!-- 使用仪器 -->
+ <div v-show="visible">使用仪器内容</div>
+</template>
+
+
+<script setup>
+import { ref } from 'vue';
+
+const props = defineProps({
+  // 定义一个名为 'exampleProp' 的字符串类型的 prop
+  visible: {
+    type: String,
+    required: true,
+    default: 'false'
+  }
+});
+</script>