app端新增原材料送检功能

JeecgUniapp-master/src/components/HelpTipBubble/HelpTipBubble.vue

@@ -0,0 +1,91 @@
+<template>
+  <view class="help-wrap">
+    <view class="help-icon" @click.stop="open">
+      <text class="q">?</text>
+    </view>
+    <view v-if="visible" class="mask" @click="close" @touchmove.stop.prevent="">
+      <view class="bubble" :style="bubbleStyle" @click.stop="">
+        <text class="bubble-text">{{ text }}</text>
+      </view>
+    </view>
+  </view>
+</template>
+
+<script lang="ts" setup>
+import { computed, ref } from 'vue'
+
+defineOptions({ name: 'HelpTipBubble' })
+
+const props = defineProps({
+  text: {
+    type: String,
+    default: '',
+  },
+  top: {
+    type: String,
+    default: '180upx',
+  },
+})
+
+const visible = ref(false)
+
+const bubbleStyle = computed(() => ({
+  top: props.top,
+}))
+
+function open() {
+  visible.value = true
+}
+
+function close() {
+  visible.value = false
+}
+
+defineExpose({ open, close })
+</script>
+
+<style lang="scss" scoped>
+.help-wrap {
+  display: inline-flex;
+  align-items: center;
+}
+.help-icon {
+  width: 36upx;
+  height: 36upx;
+  border-radius: 50%;
+  border: 2upx solid #888;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  margin-right: 8upx;
+}
+.q {
+  font-size: 22upx;
+  color: #666;
+  font-weight: 600;
+  line-height: 1;
+}
+.mask {
+  position: fixed;
+  left: 0;
+  right: 0;
+  top: 0;
+  bottom: 0;
+  z-index: 1000;
+  background: transparent;
+}
+.bubble {
+  position: absolute;
+  left: 32upx;
+  right: 32upx;
+  padding: 24upx 28upx;
+  border-radius: 16upx;
+  background: rgb(180, 180, 180);
+  box-sizing: border-box;
+}
+.bubble-text {
+  font-size: 26upx;
+  color: #fff;
+  line-height: 1.5;
+}
+</style>

JeecgUniapp-master/src/components/components.d.ts

@@ -5,6 +5,7 @@ Breadcrumb: typeof import('./Breadcrumb/Breadcrumb.vue')['default']
 CategorySelect: typeof import('./CategorySelect/CategorySelect.vue')['default']
 DateTime: typeof import('./DateTime/DateTime.vue')['default']
 Grid: typeof import('./Grid/Grid.vue')['default']
+HelpTipBubble: typeof import('./HelpTipBubble/HelpTipBubble.vue')['default']
 ImgPreview: typeof import('./ImgPreview/ImgPreview.vue')['default']
 LFile: typeof import('./LFile/LFile.vue')['default']
 PageLayout: typeof import('./PageLayout/PageLayout.vue')['default']