更新

2026-03-27 18:06:12 +08:00
parent 9160c36735
commit 099bc1dd22
645 changed files with 276473 additions and 957 deletions
@@ -0,0 +1,96 @@
+<template>
+    <span v-if="disabled" class="medicine-name-readonly">{{ modelValue || '—' }}</span>
+    <el-select
+        v-else
+        :model-value="modelValue"
+        class="medicine-name-select w-full"
+        filterable
+        remote
+        reserve-keyword
+        placeholder="搜索药材名称或拼音首字母"
+        :remote-method="remoteMethod"
+        :loading="loading"
+        clearable
+        @visible-change="onVisibleChange"
+        @update:model-value="onUpdate"
+    >
+        <el-option v-for="item in options" :key="item.id" :label="item.name" :value="item.name" />
+    </el-select>
+</template>
+
+<script setup lang="ts">
+import { medicineLists } from '@/api/medicine'
+
+const props = withDefaults(
+    defineProps<{
+        modelValue: string
+        disabled?: boolean
+    }>(),
+    { disabled: false }
+)
+
+const emit = defineEmits<{
+    'update:modelValue': [value: string]
+}>()
+
+const loading = ref(false)
+const options = ref<{ id: number; name: string }[]>([])
+
+function ensureCurrentInOptions() {
+    const v = (props.modelValue || '').trim()
+    if (!v) {
+        return
+    }
+    if (!options.value.some((o) => o.name === v)) {
+        options.value = [{ id: 0, name: v }, ...options.value]
+    }
+}
+
+const remoteMethod = async (query: string) => {
+    loading.value = true
+    try {
+        const q = (query || '').trim()
+        const res = await medicineLists({
+            name: q || undefined,
+            page_no: 1,
+            page_size: 100,
+            status: 1
+        })
+        options.value = res.lists || []
+        ensureCurrentInOptions()
+    } catch (e) {
+        console.error(e)
+        options.value = []
+    } finally {
+        loading.value = false
+    }
+}
+
+const onVisibleChange = (open: boolean) => {
+    if (open && options.value.length === 0) {
+        remoteMethod('')
+    }
+}
+
+const onUpdate = (val: string) => {
+    emit('update:modelValue', val || '')
+}
+
+watch(
+    () => props.modelValue,
+    () => {
+        ensureCurrentInOptions()
+    },
+    { immediate: true }
+)
+</script>
+
+<style scoped lang="scss">
+.medicine-name-readonly {
+    color: var(--el-text-color-regular);
+}
+
+.medicine-name-select.w-full {
+    width: 100%;
+}
+</style>