第一次提交

src/views/system/appstore/components/dict/user-select.vue

@@ -0,0 +1,76 @@
+<!-- 角色选择下拉框 -->
+<template>
+  <a-select
+    show-search
+    optionFilterProp="label"
+    :options="data"
+    allow-clear
+    :value="value"
+    :placeholder="placeholder"
+    @update:value="updateValue"
+    @search="onSearch"
+    @blur="onBlur"
+  />
+</template>
+
+<script lang="ts" setup>
+  import { reactive, ref } from 'vue';
+  import { message } from 'ant-design-vue';
+  import { listUsers } from '@/api/system/user';
+  import type { SelectProps } from 'ant-design-vue';
+  import { UserParam } from '@/api/system/user/model';
+
+  const emit = defineEmits<{
+    (e: 'update:value', value: string): void;
+    (e: 'blur'): void;
+  }>();
+
+  withDefaults(
+    defineProps<{
+      value?: string;
+      placeholder?: string;
+    }>(),
+    {
+      placeholder: '请选择客户类型'
+    }
+  );
+
+  // 字典数据
+  const data = ref<SelectProps['options']>([]);
+
+  /* 更新选中数据 */
+  const updateValue = (value: string) => {
+    emit('update:value', value);
+  };
+
+  // 默认搜索条件
+  const where = ref<UserParam>({});
+
+  const search = () => {
+    /* 获取用户列 */
+    listUsers({ ...where?.value })
+      .then((result) => {
+        data.value = result?.map((d) => {
+          return {
+            value: d.userId,
+            label: d.nickname
+          };
+        });
+      })
+      .catch((e) => {
+        message.error(e.message);
+      });
+  };
+
+  const onSearch = (e) => {
+    where.value.nickname = e;
+    search();
+  };
+
+  search();
+
+  /* 失去焦点 */
+  const onBlur = () => {
+    emit('blur');
+  };
+</script>