@ebiz/designer-components 0.0.58 → 0.0.60

package/src/components/EbizDepartmentSelector.vue

@@ -1,145 +1,145 @@
-<template>
-  <div style="width: 100%;">
-    <t-cascader v-model="selectedValue" :options="departmentTreeData" :placeholder="placeholder" :clearable="clearable"
-      :disabled="disabled" :size="size" :multiple="multiple" :max="max" :checkStrictly="checkStrictly"
-      :filterable="filterable" :loading="loading" @change="handleChange">
-      <template v-if="$slots.empty" #empty>
-        <slot name="empty"></slot>
-      </template>
-      <template v-if="$slots.dropdownItem" #dropdownItem="slotProps">
-        <slot name="dropdownItem" v-bind="slotProps"></slot>
-      </template>
-      <template v-if="$slots.collapsedItems" #collapsedItems="slotProps">
-        <slot name="collapsedItems" v-bind="slotProps"></slot>
-      </template>
-      <template v-if="$slots.suffix" #suffix>
-        <slot name="suffix"></slot>
-      </template>
-      <template v-if="$slots.prefixIcon" #prefixIcon>
-        <slot name="prefixIcon"></slot>
-      </template>
-    </t-cascader>
-  </div>
-</template>
-
-<script setup>
-import { ref, computed, onMounted, watch } from 'vue';
-import { Cascader as TCascader } from 'tdesign-vue-next';
-import { dataService } from '../index.js';
-
-// 定义组件属性
-const props = defineProps({
-  modelValue: {
-    type: [String, Number, Array],
-    default: undefined
-  },
-  companyId:{
-    type: Number,
-    default: null,
-  },
-  placeholder: {
-    type: String,
-    default: '请选择部门'
-  },
-  clearable: {
-    type: Boolean,
-    default: true
-  },
-  disabled: {
-    type: Boolean,
-    default: false
-  },
-  size: {
-    type: String,
-    default: undefined,
-    validator: (val) => ['small', 'medium', 'large'].includes(val)
-  },
-  multiple: {
-    type: Boolean,
-    default: false
-  },
-  max: {
-    type: Number,
-    default: 0
-  },
-  checkStrictly: {
-    type: Boolean,
-    default: true
-  },
-  filterable: {
-    type: Boolean,
-    default: true
-  }
-});
-
-// 定义组件事件
-const emit = defineEmits(['update:modelValue', 'change']);
-
-// 内部状态变量
-const departmentData = ref([]);
-const departmentTreeData = ref([]);
-const loading = ref(false);
-const selectedValue = computed({
-  get: () => props.modelValue,
-  set: (val) => emit('update:modelValue', val)
-});
-
-// 处理变更事件
-const handleChange = (value, context) => {
-  console.log(value, context.node.data);
-  emit('change', value, context);
-};
-
-// 将部门列表数据转换为树形结构
-const buildDepartmentTree = (data, parentId = null) => {
-  return data
-    .filter(item => item.manager_dept === parentId)
-    .map(item => {
-      const children = buildDepartmentTree(data, item.id);
-      return {
-        ...item,
-        label: item.name,
-        value: item.id,
-        children: children.length > 0 ? children : undefined
-      };
-    });
-};
-
-// 加载部门数据
-const loadDepartmentData = async () => {
-  try {
-    loading.value = true;
-    dataService.fetch({
-      companyId: props.companyId,
-    },{
-        apiKey: 'deptAllList',
-        apiId: 1933, 
-        apiType: 'MULTIPLE_DATA_SEARCH'
-    }).then(res => {
-      departmentData.value = res.data || [];
-      departmentTreeData.value = buildDepartmentTree(departmentData.value,0);
-    }).catch(err => {
-      console.error('获取部门数据失败:', err);
-    }).finally(() => {
-      loading.value = false;
-    });
-  } catch (error) {
-    console.error('获取部门数据失败:', error);
-    departmentData.value = [];
-    departmentTreeData.value = [];
-  } finally {
-    loading.value = false;
-  }
-};
-
-// 组件挂载时加载数据
-onMounted(() => {
-  loadDepartmentData();
-});
-</script>
-
-<style>
-.ebiz-department-selector {
-  width: 100%;
-}
+<template>
+  <div style="width: 100%;">
+    <t-cascader v-model="selectedValue" :options="departmentTreeData" :placeholder="placeholder" :clearable="clearable"
+      :disabled="disabled" :size="size" :multiple="multiple" :max="max" :checkStrictly="checkStrictly"
+      :filterable="filterable" :loading="loading" @change="handleChange">
+      <template v-if="$slots.empty" #empty>
+        <slot name="empty"></slot>
+      </template>
+      <template v-if="$slots.dropdownItem" #dropdownItem="slotProps">
+        <slot name="dropdownItem" v-bind="slotProps"></slot>
+      </template>
+      <template v-if="$slots.collapsedItems" #collapsedItems="slotProps">
+        <slot name="collapsedItems" v-bind="slotProps"></slot>
+      </template>
+      <template v-if="$slots.suffix" #suffix>
+        <slot name="suffix"></slot>
+      </template>
+      <template v-if="$slots.prefixIcon" #prefixIcon>
+        <slot name="prefixIcon"></slot>
+      </template>
+    </t-cascader>
+  </div>
+</template>
+
+<script setup>
+import { ref, computed, onMounted, watch } from 'vue';
+import { Cascader as TCascader } from 'tdesign-vue-next';
+import { dataService } from '../index.js';
+
+// 定义组件属性
+const props = defineProps({
+  modelValue: {
+    type: [String, Number, Array],
+    default: undefined
+  },
+  companyId:{
+    type: Number,
+    default: null,
+  },
+  placeholder: {
+    type: String,
+    default: '请选择部门'
+  },
+  clearable: {
+    type: Boolean,
+    default: true
+  },
+  disabled: {
+    type: Boolean,
+    default: false
+  },
+  size: {
+    type: String,
+    default: undefined,
+    validator: (val) => ['small', 'medium', 'large'].includes(val)
+  },
+  multiple: {
+    type: Boolean,
+    default: false
+  },
+  max: {
+    type: Number,
+    default: 0
+  },
+  checkStrictly: {
+    type: Boolean,
+    default: true
+  },
+  filterable: {
+    type: Boolean,
+    default: true
+  }
+});
+
+// 定义组件事件
+const emit = defineEmits(['update:modelValue', 'change']);
+
+// 内部状态变量
+const departmentData = ref([]);
+const departmentTreeData = ref([]);
+const loading = ref(false);
+const selectedValue = computed({
+  get: () => props.modelValue,
+  set: (val) => emit('update:modelValue', val)
+});
+
+// 处理变更事件
+const handleChange = (value, context) => {
+  console.log(value, context.node.data);
+  emit('change', value, context);
+};
+
+// 将部门列表数据转换为树形结构
+const buildDepartmentTree = (data, parentId = null) => {
+  return data
+    .filter(item => item.manager_dept === parentId)
+    .map(item => {
+      const children = buildDepartmentTree(data, item.id);
+      return {
+        ...item,
+        label: item.name,
+        value: item.id,
+        children: children.length > 0 ? children : undefined
+      };
+    });
+};
+
+// 加载部门数据
+const loadDepartmentData = async () => {
+  try {
+    loading.value = true;
+    dataService.fetch({
+      companyId: props.companyId,
+    },{
+        apiKey: 'deptAllList',
+        apiId: 1933, 
+        apiType: 'MULTIPLE_DATA_SEARCH'
+    }).then(res => {
+      departmentData.value = res.data || [];
+      departmentTreeData.value = buildDepartmentTree(departmentData.value,0);
+    }).catch(err => {
+      console.error('获取部门数据失败:', err);
+    }).finally(() => {
+      loading.value = false;
+    });
+  } catch (error) {
+    console.error('获取部门数据失败:', error);
+    departmentData.value = [];
+    departmentTreeData.value = [];
+  } finally {
+    loading.value = false;
+  }
+};
+
+// 组件挂载时加载数据
+onMounted(() => {
+  loadDepartmentData();
+});
+</script>
+
+<style>
+.ebiz-department-selector {
+  width: 100%;
+}
 </style>