@ebiz/designer-components 0.1.32 → 0.1.33

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@ebiz/designer-components",
3
- "version": "0.1.32",
3
+ "version": "0.1.33",
4
4
  "private": false,
5
5
  "publishConfig": {
6
6
  "access": "public"
@@ -1,26 +1,27 @@
1
1
  <script setup>
2
- import { ref, watch } from 'vue';
3
-
2
+ import { watch, computed } from 'vue';
4
3
  const props = defineProps({
5
- key: {
4
+ permissionKey: {
6
5
  type: String,
7
6
  required: true,
8
7
  default: ''
9
8
  }
10
9
  });
11
10
 
12
- const isShow = ref(true);
11
+ const isShow = computed(() => {
13
12
 
14
- const checkPermission = () => {
15
13
  try {
16
14
  const permissionKeysStr = localStorage.getItem('permissionKeys') || '[]';
17
15
  const permissionKeys = JSON.parse(permissionKeysStr);
18
16
  const hasPermission = permissionKeys.includes(props.key);
19
- isShow.value = hasPermission;
17
+ return hasPermission;
20
18
  } catch (error) {
21
- console.error('解析权限数据失败:', error);
22
- isShow.value = false;
19
+ return false;
23
20
  }
21
+ });
22
+
23
+ const checkPermission = () => {
24
+
24
25
  };
25
26
 
26
27
  watch(() => props.key, checkPermission, { immediate: true });
@@ -112,25 +112,55 @@
112
112
  @click="clearSearch">清除搜索</t-button>
113
113
  </div>
114
114
 
115
- <div class="employee-list">
116
- <div v-for="(item, index) in filteredEmployeeList" :key="index" class="employee-item"
117
- style="cursor: pointer;">
118
- <t-checkbox v-model="item.checked" @change="handleCheckChange(item)"></t-checkbox>
119
- <div style="display: flex; align-items: center; gap: 10px; flex: 1;">
120
- <div class="employee-avatar">
121
- <t-avatar v-if="item.avatar" :image="item.avatar" size="small" />
122
- <t-avatar v-else size="small">{{ getAvatarText(item.name) }}</t-avatar>
123
- </div>
124
- <div class="employee-info">
125
- <div class="employee-code">{{ item.no }} - </div>
126
- <div class="employee-name">{{ item.name }}</div>
127
- </div>
128
- </div>
115
+ <t-checkbox-group v-if="!single" v-model="tempSelectedEmployeeIds" style="width: 100%;"
116
+ @change="handleCheckChange">
117
+ <div class="employee-list">
118
+ <div v-for="(item, index) in filteredEmployeeList" :key="index" class="employee-item"
119
+ style="cursor: pointer;">
120
+ <t-checkbox :key="item.id" :value="item.id">
121
+ <div style="display: flex; align-items: center; gap: 10px; flex: 1;">
122
+ <div class="employee-avatar">
123
+ <t-avatar v-if="item.avatar" :image="item.avatar" size="small" />
124
+ <t-avatar v-else size="small">{{ getAvatarText(item.name) }}</t-avatar>
125
+ </div>
126
+ <div class="employee-info">
127
+ <div class="employee-code">{{ item.no }} - </div>
128
+ <div class="employee-name">{{ item.name }}</div>
129
+ </div>
130
+ </div>
131
+ </t-checkbox>
129
132
 
133
+ </div>
130
134
  </div>
131
- <div v-if="filteredEmployeeList.length === 0" class="empty-data">
132
- <t-empty />
135
+
136
+ </t-checkbox-group>
137
+
138
+ <t-radio-group v-else style="width: 100%;" v-model="tempSelectedEmployeeId" @change="handleCheckChange">
139
+ <div class="employee-list">
140
+ <div v-for="(item, index) in filteredEmployeeList" :key="index" class="employee-item"
141
+ style="cursor: pointer;">
142
+ <t-radio :value="item.id">
143
+ <div style="display: flex; align-items: center; gap: 10px; flex: 1;">
144
+ <div class="employee-avatar">
145
+ <t-avatar v-if="item.avatar" :image="item.avatar" size="small" />
146
+ <t-avatar v-else size="small">{{ getAvatarText(item.name) }}</t-avatar>
147
+ </div>
148
+ <div class="employee-info">
149
+ <div class="employee-code">{{ item.no }} - </div>
150
+ <div class="employee-name">{{ item.name }}</div>
151
+ </div>
152
+ </div>
153
+ </t-radio>
154
+
155
+ </div>
156
+
133
157
  </div>
158
+
159
+ </t-radio-group>
160
+
161
+
162
+ <div v-if="filteredEmployeeList.length === 0" class="empty-data">
163
+ <t-empty />
134
164
  </div>
135
165
  </div>
136
166
  </div>
@@ -141,7 +171,9 @@
141
171
  <template #footer>
142
172
  <div class="dialog-footer">
143
173
  <div class="selected-preview">
144
- 已选: {{ tempSelectedEmployees.length }} 人
174
+ <div class="selected-people-count" v-if="!single">
175
+ 已选: {{ tempSelectedEmployees.length }} 人
176
+ </div>
145
177
  <div class="selected-people-list" v-if="tempSelectedEmployees.length > 0">
146
178
  <div v-for="(item, index) in tempSelectedEmployees" :key="index" class="selected-people-item">
147
179
  <t-avatar v-if="item.avatar" :image="item.avatar" size="small" />
@@ -150,7 +182,7 @@
150
182
  <span class="item-code">{{ item.no }}</span>
151
183
  <span class="item-name">{{ item.name }}</span>
152
184
  </span>
153
- <t-icon name="close" class="item-remove" @click="removeSelectedEmployee(item)"></t-icon>
185
+ <t-icon v-if="!single" name="close" class="item-remove" @click="removeSelectedEmployee(item)"></t-icon>
154
186
  </div>
155
187
  </div>
156
188
  </div>
@@ -177,10 +209,13 @@ import {
177
209
  Tree as TTree,
178
210
  Avatar as TAvatar,
179
211
  Checkbox as TCheckbox,
212
+ CheckboxGroup as TCheckboxGroup,
180
213
  Empty as TEmpty,
181
214
  List as TList,
182
215
  ListItem as TListItem,
183
- MessagePlugin
216
+ MessagePlugin,
217
+ Radio as TRadio,
218
+ RadioGroup as TRadioGroup
184
219
  } from 'tdesign-vue-next';
185
220
  import dataService from '../apiService/simpleDataService';
186
221
 
@@ -238,6 +273,10 @@ const props = defineProps({
238
273
  // 定义组件事件
239
274
  const emit = defineEmits(['update:modelValue', 'change', 'update:visible', 'confirm']);
240
275
  const tempVisible = ref(false);
276
+
277
+ const tempSelectedEmployeeIds = ref([])
278
+ const tempSelectedEmployeeId = ref("")
279
+
241
280
  // 内部状态变量
242
281
  const dialogVisible = computed({
243
282
  set(val) {
@@ -259,7 +298,7 @@ const selectedItems = ref([]);
259
298
  // 对话框中临时保存的选中员工列表
260
299
  const tempSelectedEmployees = ref([]);
261
300
  // 是否查询子部门
262
- const childDeptEnable = ref(false);
301
+ const childDeptEnable = ref(true);
263
302
 
264
303
  // 数据源
265
304
  const organizationData = ref([]);
@@ -308,12 +347,6 @@ const computedModelValue = computed({
308
347
  value.forEach((val) => {
309
348
  return Number(val);
310
349
  })
311
-
312
- employeeList.value.forEach(emp => {
313
- if (!value.includes(Number(emp.id))) {
314
- emp.checked = false;
315
- }
316
- });
317
350
  return value;
318
351
  }
319
352
  });
@@ -500,6 +533,9 @@ const fetchEmployeesByNode = async (nodeId, type, keyword = searchText.value) =>
500
533
  }));
501
534
 
502
535
  employeeList.value = employees;
536
+
537
+ handleCheckChange()
538
+
503
539
  updateSelectAllStatus();
504
540
  } catch (error) {
505
541
  MessagePlugin.error({
@@ -569,56 +605,60 @@ const selectDepartment = (department) => {
569
605
  // 处理全选
570
606
  const handleSelectAll = (checked) => {
571
607
  employeeList.value.forEach(item => {
572
- item.checked = checked;
573
608
 
574
609
  // 如果选中,确保添加到临时选中列表
575
- if (checked && !tempSelectedEmployees.value.some(emp => emp.id === item.id)) {
610
+ if (!tempSelectedEmployees.value.some(emp => emp.id === item.id)) {
576
611
  tempSelectedEmployees.value.push(item);
612
+ tempSelectedEmployeeIds.value.push(item.id);
577
613
  }
578
614
  });
579
615
  };
580
616
 
581
617
  // 处理选中状态变更
582
- const handleCheckChange = (item) => {
618
+ const handleCheckChange = () => {
619
+ console.log("tempSelectedEmployeeIds", tempSelectedEmployeeIds.value)
583
620
  // 单选模式下,取消其他选中
621
+ const selectedEmployees = []
622
+
584
623
  if (props.single) {
624
+ console.log("single", tempSelectedEmployeeId.value)
585
625
  employeeList.value.forEach(emp => {
586
- if (emp.id !== item.id) {
587
- emp.checked = false;
626
+ if (Number(emp.id) === Number(tempSelectedEmployeeId.value)) {
627
+ selectedEmployees.push(emp)
588
628
  }
589
629
  });
590
- // 单选模式下,直接替换tempSelectedEmployees
591
- tempSelectedEmployees.value = item.checked ? [item] : [];
592
- } else {
593
- // 多选模式
594
- // 如果选中,添加到临时选中列表
595
- if (item.checked && !tempSelectedEmployees.value.some(emp => emp.id === item.id)) {
596
- tempSelectedEmployees.value.push(item);
597
- } else if (!item.checked) {
598
- // 如果取消选中,从临时选中列表中移除
599
- const index = tempSelectedEmployees.value.findIndex(emp => emp.id === item.id);
600
- if (index !== -1) {
601
- tempSelectedEmployees.value.splice(index, 1);
602
- }
630
+ if (selectedEmployees.length === 0) {
631
+ selectedItems.value.forEach(emp => {
632
+ if (Number(emp.id) === Number(tempSelectedEmployeeId.value)) {
633
+ selectedEmployees.push(emp)
634
+ }
635
+ });
603
636
  }
604
- }
605
637
 
606
- // 检查最大选择数量限制
607
- if (props.maxCount > 0) {
608
- const checkedCount = tempSelectedEmployees.value.length;
609
- if (checkedCount > props.maxCount) {
610
- item.checked = false;
611
- const index = tempSelectedEmployees.value.findIndex(emp => emp.id === item.id);
612
- if (index !== -1) {
613
- tempSelectedEmployees.value.splice(index, 1);
638
+ } else {
639
+ const handled = [];
640
+ console.log("multi", tempSelectedEmployeeIds.value)
641
+
642
+ tempSelectedEmployees.value.forEach(emp => {
643
+ if (tempSelectedEmployeeIds.value.indexOf(emp.id) !== -1) {
644
+ selectedEmployees.push(emp)
645
+ handled.push(emp.id)
614
646
  }
615
- MessagePlugin.warning({
616
- content: `最多只能选择${props.maxCount}个人员`,
617
- duration: 3000
618
- });
619
- }
647
+ });
648
+ employeeList.value.forEach(emp => {
649
+ if (tempSelectedEmployeeIds.value.indexOf(emp.id) !== -1 && handled.indexOf(emp.id) === -1) {
650
+ selectedEmployees.push(emp)
651
+ handled.push(emp.id)
652
+ }
653
+ });
654
+ selectedItems.value.forEach(emp => {
655
+ if (tempSelectedEmployeeIds.value.indexOf(emp.id) !== -1 && handled.indexOf(emp.id) === -1) {
656
+ selectedEmployees.push(emp)
657
+ handled.push(emp.id)
658
+ }
659
+ });
620
660
  }
621
-
661
+ tempSelectedEmployees.value = selectedEmployees
622
662
  updateSelectAllStatus();
623
663
  };
624
664
 
@@ -638,18 +678,14 @@ const removeItem = (index, id) => {
638
678
 
639
679
  // 从已选列表中移除员工
640
680
  const removeSelectedEmployee = (employee) => {
641
- // 将员工的checked状态设为false
642
- const foundEmployee = employeeList.value.find(item => item.id === employee.id);
643
- if (foundEmployee) {
644
- foundEmployee.checked = false;
645
- }
646
-
647
681
  // 从临时选中列表中移除
648
- const index = tempSelectedEmployees.value.findIndex(emp => emp.id === employee.id);
682
+ const index = tempSelectedEmployeeIds.value.findIndex(id => employee.id === id);
649
683
  if (index !== -1) {
650
- tempSelectedEmployees.value.splice(index, 1);
684
+ tempSelectedEmployeeIds.value.splice(index, 1);
651
685
  }
652
686
 
687
+ handleCheckChange()
688
+
653
689
  // 更新全选状态
654
690
  updateSelectAllStatus();
655
691
  };
@@ -673,18 +709,21 @@ const initSelector = async () => {
673
709
  // 显示对话框
674
710
  const showDialog = () => {
675
711
  // 初始化临时选中列表
676
- if (selectedItems.value.length > 0) {
677
- tempSelectedEmployees.value = [...selectedItems.value];
678
- updateSelectStatus()
712
+ if (props.single) {
713
+ tempSelectedEmployeeId.value = props.modelValue || []
679
714
  } else {
680
- tempSelectedEmployees.value = [];
715
+ tempSelectedEmployeeIds.value = props.modelValue || []
681
716
  }
682
717
 
683
718
  // 初始化数据
684
719
  if (props.visible == null) {
685
720
  initSelector();
686
721
  }
722
+
723
+ handleCheckChange()
724
+
687
725
  dialogVisible.value = true;
726
+
688
727
  };
689
728
 
690
729
  // 确认选择
@@ -735,24 +774,6 @@ watch(() => props.visible, (val) => {
735
774
  fetchOrganizationData()
736
775
  }
737
776
  }, { immediate: true })
738
- // 监听选中员工变化,更新临时已选列表
739
- watch(selectedEmployees, (newVal) => {
740
- // 更新临时选中列表,保留之前不在当前列表中的已选员工
741
-
742
- const currentIds = new Set(newVal.map(emp => emp.id));
743
-
744
- // 移除tempSelectedEmployees中已经不再选中的员工
745
- tempSelectedEmployees.value = tempSelectedEmployees.value.filter(emp =>
746
- !currentIds.has(emp.id) || newVal.some(item => item.id === emp.id)
747
- );
748
-
749
- // 添加新选中的员工
750
- newVal.forEach(emp => {
751
- if (!tempSelectedEmployees.value.some(item => item.id === emp.id)) {
752
- tempSelectedEmployees.value.push(emp);
753
- }
754
- });
755
- }, { deep: true });
756
777
 
757
778
  // 监听子部门查询开关变化
758
779
  watch(childDeptEnable, () => {
@@ -822,12 +843,6 @@ const clearSearch = () => {
822
843
  searchText.value = '';
823
844
  if (currentActive.value && currentActive.value.length > 0) {
824
845
  fetchEmployeesByNode(currentActive.value[0], activeTab.value);
825
- } else {
826
- // 如果没有选中节点,重置员工列表但保留选中状态
827
- employeeList.value = employeeList.value.map(emp => ({
828
- ...emp,
829
- checked: tempSelectedEmployees.value.some(item => item.id === emp.id)
830
- }));
831
846
  }
832
847
  };
833
848
  </script>
@@ -1017,6 +1032,7 @@ const clearSearch = () => {
1017
1032
  display: flex;
1018
1033
  flex-direction: column;
1019
1034
  gap: 8px;
1035
+ height: 400px;
1020
1036
  }
1021
1037
 
1022
1038
  .employee-item {
@@ -3,131 +3,129 @@
3
3
  :style="customStyle" :rules="rules" :label-width="labelWidth" :label-align="labelAlign" :status="status"
4
4
  @validate="handleValidate" style="margin-bottom: 10px;">
5
5
 
6
- <!-- 员工选择 -->
7
- <template v-if="type === 'employee'">
8
- <ebiz-employee-selector v-model="computedModelValue" :placeholder="placeholder || '请选择员工'"
9
- :disabled="disabled" :clearable="clearable" :single="single" :defaultTab="defaultTab"
10
- :maxCount="maxCount" @change="handleChange" />
11
- </template>
6
+ <slot name="default">
7
+ <!-- 员工选择 -->
8
+ <template v-if="type === 'employee'">
9
+ <ebiz-employee-selector v-model="computedModelValue" :placeholder="placeholder || '请选择员工'"
10
+ :disabled="disabled" :clearable="clearable" :single="single" :defaultTab="defaultTab"
11
+ :maxCount="maxCount" @change="handleChange" />
12
+ </template>
12
13
 
13
- <!-- 部门选择 -->
14
- <template v-if="type === 'dept'">
15
- <ebiz-department-selector v-model="computedModelValue" :placeholder="placeholder || '请选择部门'"
16
- :disabled="disabled" :clearable="clearable" :filterable="filterable" :apiUrl="apiUrl"
17
- :companyId="companyId" @change="handleChange" />
18
- </template>
14
+ <!-- 部门选择 -->
15
+ <template v-if="type === 'dept'">
16
+ <ebiz-department-selector v-model="computedModelValue" :placeholder="placeholder || '请选择部门'"
17
+ :disabled="disabled" :clearable="clearable" :filterable="filterable" :apiUrl="apiUrl"
18
+ :companyId="companyId" @change="handleChange" />
19
+ </template>
19
20
 
20
- <!-- 输入框 -->
21
- <template v-if="type === 'input'">
22
- <t-input v-model="computedModelValue" :placeholder="placeholder || '请输入'" :disabled="disabled"
23
- :readonly="readonly" :clearable="clearable" :max-length="maxLength" :max-character="maxCharacter"
24
- :show-limit-number="showLimitNumber" @change="handleChange" />
25
- </template>
21
+ <!-- 输入框 -->
22
+ <template v-if="type === 'input'">
23
+ <t-input v-model="computedModelValue" :placeholder="placeholder || '请输入'" :disabled="disabled"
24
+ :readonly="readonly" :clearable="clearable" :max-length="maxLength" :max-character="maxCharacter"
25
+ :show-limit-number="showLimitNumber" @change="handleChange" />
26
+ </template>
26
27
 
27
- <!-- 数字输入框 -->
28
- <template v-else-if="type === 'number'">
29
- <t-input-number v-model="computedModelValue" :placeholder="placeholder || '请输入'" :disabled="disabled"
30
- :readonly="readonly" :max="max" :min="min" :step="step" :format="format" @change="handleChange" />
31
- </template>
28
+ <!-- 数字输入框 -->
29
+ <template v-else-if="type === 'number'">
30
+ <t-input-number v-model="computedModelValue" :placeholder="placeholder || '请输入'" :disabled="disabled"
31
+ :readonly="readonly" :max="max" :min="min" :step="step" :format="format" @change="handleChange" />
32
+ </template>
32
33
 
33
- <!-- 文本域 -->
34
- <template v-else-if="type === 'textarea'">
35
- <t-textarea v-model="computedModelValue" :placeholder="placeholder || '请输入'" :disabled="disabled"
36
- :readonly="readonly" :autosize="autosize" :maxlength="maxLength" :max-character="maxCharacter"
37
- :show-limit-number="showLimitNumber" @change="handleChange" />
38
- </template>
34
+ <!-- 文本域 -->
35
+ <template v-else-if="type === 'textarea'">
36
+ <t-textarea v-model="computedModelValue" :placeholder="placeholder || '请输入'" :disabled="disabled"
37
+ :readonly="readonly" :autosize="autosize" :maxlength="maxLength" :max-character="maxCharacter"
38
+ :show-limit-number="showLimitNumber" @change="handleChange" />
39
+ </template>
39
40
 
40
- <!-- 选择器 -->
41
- <template v-else-if="type === 'select'">
42
- <template v-if="isRemote">
43
- <ebiz-remote-select v-model="computedModelValue" :placeholder="placeholder || '请选择'"
44
- :disabled="disabled" :clearable="clearable" :filterable="true" :multiple="multiple"
45
- :loading="loading" :apiConfig="remoteApiConfig" @change="handleChange" />
41
+ <!-- 选择器 -->
42
+ <template v-else-if="type === 'select'">
43
+ <template v-if="isRemote">
44
+ <ebiz-remote-select v-model="computedModelValue" :placeholder="placeholder || '请选择'"
45
+ :disabled="disabled" :clearable="clearable" :filterable="true" :multiple="multiple"
46
+ :loading="loading" :apiConfig="remoteApiConfig" @change="handleChange" />
47
+ </template>
48
+ <template v-else>
49
+ <t-select v-model="computedModelValue" :options="options" :placeholder="placeholder || '请选择'"
50
+ :disabled="disabled" :clearable="clearable" :filterable="filterable" :multiple="multiple"
51
+ :loading="loading" @change="handleChange" />
52
+ </template>
46
53
  </template>
47
- <template v-else>
48
- <t-select v-model="computedModelValue" :options="options" :placeholder="placeholder || '请选择'"
49
- :disabled="disabled" :clearable="clearable" :filterable="filterable" :multiple="multiple"
50
- :loading="loading" @change="handleChange" />
54
+
55
+ <!-- 日期选择器 -->
56
+ <template v-else-if="type === 'datetime'">
57
+ <t-date-picker v-model="computedModelValue" :placeholder="placeholder || '请选择日期时间'" :disabled="disabled"
58
+ :clearable="clearable" enable-time-picker format="YYYY-MM-DD HH:mm:ss" @change="handleChange" />
51
59
  </template>
52
- </template>
53
60
 
54
- <!-- 日期选择器 -->
55
- <template v-else-if="type === 'datetime'">
56
- <t-date-picker v-model="computedModelValue" :placeholder="placeholder || '请选择日期时间'" :disabled="disabled"
57
- :clearable="clearable" enable-time-picker format="YYYY-MM-DD HH:mm:ss" @change="handleChange" />
58
- </template>
59
61
 
62
+ <!-- 日期选择器 -->
63
+ <template v-else-if="type === 'date'">
64
+ <t-date-picker v-model="computedModelValue" :placeholder="placeholder || '请选择日期'" :disabled="disabled"
65
+ :clearable="clearable" :format="dateFormat || 'YYYY-MM-DD'" :mode="dateMode || 'date'"
66
+ @change="handleChange" />
67
+ </template>
60
68
 
61
- <!-- 日期选择器 -->
62
- <template v-else-if="type === 'date'">
63
- <t-date-picker v-model="computedModelValue" :placeholder="placeholder || '请选择日期'" :disabled="disabled"
64
- :clearable="clearable" :format="dateFormat || 'YYYY-MM-DD'" :mode="dateMode || 'date'"
65
- @change="handleChange" />
66
- </template>
69
+ <!-- 时间选择器 -->
70
+ <template v-else-if="type === 'time'">
71
+ <t-time-picker v-model="computedModelValue" :placeholder="placeholder || '请选择时间'" :disabled="disabled"
72
+ :clearable="clearable" :format="timeFormat || 'HH:mm:ss'" @change="handleChange" />
73
+ </template>
67
74
 
68
- <!-- 时间选择器 -->
69
- <template v-else-if="type === 'time'">
70
- <t-time-picker v-model="computedModelValue" :placeholder="placeholder || '请选择时间'" :disabled="disabled"
71
- :clearable="clearable" :format="timeFormat || 'HH:mm:ss'" @change="handleChange" />
72
- </template>
75
+ <!-- 单选框组 -->
76
+ <template v-else-if="type === 'radio'">
77
+ <t-radio-group v-model="computedModelValue" :disabled="disabled" :options="options"
78
+ @change="handleChange" />
79
+ </template>
73
80
 
74
- <!-- 单选框组 -->
75
- <template v-else-if="type === 'radio'">
76
- <t-radio-group v-model="computedModelValue" :disabled="disabled" :options="options"
77
- @change="handleChange" />
78
- </template>
81
+ <!-- 复选框组 -->
82
+ <template v-else-if="type === 'checkbox'">
83
+ <t-checkbox-group v-model="computedModelValue" :disabled="disabled" :options="options" :max="max"
84
+ @change="handleChange" />
85
+ </template>
79
86
 
80
- <!-- 复选框组 -->
81
- <template v-else-if="type === 'checkbox'">
82
- <t-checkbox-group v-model="computedModelValue" :disabled="disabled" :options="options" :max="max"
83
- @change="handleChange" />
84
- </template>
87
+ <!-- 开关 -->
88
+ <template v-else-if="type === 'switch'">
89
+ <t-switch v-model="computedModelValue" :disabled="disabled" @change="handleChange" />
90
+ </template>
85
91
 
86
- <!-- 开关 -->
87
- <template v-else-if="type === 'switch'">
88
- <t-switch v-model="computedModelValue" :disabled="disabled" @change="handleChange" />
89
- </template>
92
+ <!-- 滑块 -->
93
+ <template v-else-if="type === 'slider'">
94
+ <t-slider v-model="computedModelValue" :disabled="disabled" :max="max" :min="min" :step="step"
95
+ :range="range" :marks="marks" @change="handleChange" />
96
+ </template>
90
97
 
91
- <!-- 滑块 -->
92
- <template v-else-if="type === 'slider'">
93
- <t-slider v-model="computedModelValue" :disabled="disabled" :max="max" :min="min" :step="step"
94
- :range="range" :marks="marks" @change="handleChange" />
95
- </template>
98
+ <!-- 上传 -->
99
+ <template v-else-if="type === 'upload'">
100
+ <ebiz-upload v-model="computedModelValue" :disabled="disabled" :accept="accept" :multiple="multiple"
101
+ :max="max" :theme="uploadTheme || 'file'" @change="handleChange" />
102
+ </template>
96
103
 
97
- <!-- 上传 -->
98
- <template v-else-if="type === 'upload'">
99
- <ebiz-upload v-model="computedModelValue" :disabled="disabled" :accept="accept" :multiple="multiple"
100
- :max="max" :theme="uploadTheme || 'file'" @change="handleChange" />
101
- </template>
104
+ <!-- 级联选择器 -->
105
+ <template v-else-if="type === 'cascader'">
106
+ <t-cascader v-model="computedModelValue" :disabled="disabled" :options="options"
107
+ :placeholder="placeholder || '请选择'" :clearable="clearable" :filterable="filterable"
108
+ :multiple="multiple" @change="handleChange" />
109
+ </template>
102
110
 
103
- <!-- 级联选择器 -->
104
- <template v-else-if="type === 'cascader'">
105
- <t-cascader v-model="computedModelValue" :disabled="disabled" :options="options"
106
- :placeholder="placeholder || '请选择'" :clearable="clearable" :filterable="filterable" :multiple="multiple"
107
- @change="handleChange" />
108
- </template>
111
+ <!-- 树形选择器 -->
112
+ <template v-else-if="type === 'tree-select'">
113
+ <t-tree-select v-model="computedModelValue" :disabled="disabled" :data="treeData || options"
114
+ :placeholder="placeholder || '请选择'" :clearable="clearable" :filterable="filterable"
115
+ :multiple="multiple" @change="handleChange" />
116
+ </template>
109
117
 
110
- <!-- 树形选择器 -->
111
- <template v-else-if="type === 'tree-select'">
112
- <t-tree-select v-model="computedModelValue" :disabled="disabled" :data="treeData || options"
113
- :placeholder="placeholder || '请选择'" :clearable="clearable" :filterable="filterable" :multiple="multiple"
114
- @change="handleChange" />
115
- </template>
118
+ <!-- 颜色选择器 -->
119
+ <template v-else-if="type === 'color-picker'">
120
+ <t-color-picker v-model="computedModelValue" :disabled="disabled" :clearable="clearable"
121
+ @change="handleChange" />
122
+ </template>
116
123
 
117
- <!-- 颜色选择器 -->
118
- <template v-else-if="type === 'color-picker'">
119
- <t-color-picker v-model="computedModelValue" :disabled="disabled" :clearable="clearable"
120
- @change="handleChange" />
121
- </template>
124
+ <!-- 默认插槽,用于自定义控件 -->
125
+ <template v-else>
126
+ </template>
127
+ </slot>
122
128
 
123
- <!-- 默认插槽,用于自定义控件 -->
124
- <template v-else>
125
- <slot>
126
- <div class="custom-control">
127
- <slot name="default"></slot>
128
- </div>
129
- </slot>
130
- </template>
131
129
  </t-form-item>
132
130
  </template>
133
131