xiaoyi
4 天以前 5c243d9d05da668a32b1bc9a4f543ea081488d11
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
<script lang="ts" setup>
  import { onMounted, ref } from 'vue';
 
  import { Select } from 'ant-design-vue';
 
  import { getCtcPage } from '#/api/mes/pd/ctc';
 
  defineOptions({ name: 'PdCtcSelect', inheritAttrs: false });
 
  const props = withDefaults(
    defineProps<{
      allowClear?: boolean;
      disabled?: boolean;
      modelValue?: number;
      placeholder?: string;
    }>(),
    {
      allowClear: true,
      disabled: false,
      modelValue: undefined,
      placeholder: '请选择换位导线产品',
    },
  );
 
  const emit = defineEmits<{
    'update:modelValue': [value: number | undefined];
  }>();
 
  const options = ref<{ label: string; value: number }[]>([]);
  const searchText = ref('');
 
  async function load() {
    const data = await getCtcPage({
      pageNo: 1,
      pageSize: 100,
      orderSpec: searchText.value || undefined,
    });
    options.value = (data.list ?? []).map((item) => ({
      label: `${item.orderSpec ?? ''}${item.itemName ? `(${item.itemName})` : ''}`,
      value: item.id!,
    }));
  }
 
  onMounted(load);
 
  function handleSearch(val: string) {
    searchText.value = val;
    load();
  }
</script>
 
<template>
  <Select
    :model-value="modelValue"
    :options="options"
    :disabled="disabled"
    :placeholder="placeholder"
    :allow-clear="allowClear"
    show-search
    :filter-option="false"
    @update:value="(v: number | undefined) => emit('update:modelValue', v)"
    @search="handleSearch"
  />
</template>