# ResourceSelect 上帝选择器
自定义资源选择列表数据
# 效果
<template>
<ss-resource-select
v-if="show"
:tab-type="tabType"
:select-type="selectType"
:project-id="projectType"
:extra-params="extraParams"
@cancel="onCancel"
@select="onSelect">
</ss-resource-select>
</template>
<script>
data() {
return {
show: false,
tabType: 1,
selectType: 1,
projectType: 1,
extraParams: {
12: {
filter_ids: '',
filter_condition_first: '',
filter_condition_second: '',
filter_condition_third: '',
limitation_factor: '',
exclude_ids: [],
},
...
}
};
},
methods: {
onCancel() {
this.show = false;
},
onSelect(list) {
// list:选择的资源数组,单选只有一个资源对象,多选可以有多个资源对象;
console.log(list);
}
</script>
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
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
# 参数
| 参数 | 说明 | 类型 | 默认值 | 可选值 |
|---|---|---|---|---|
| tab-type | 表示场景id | Number | 1 | 0: 知识商品,1: 店铺首页,2: 助学工具,3: 微页面,5: 营销活动页 |
| select-type | 单选 / 多选 | Number | 1 | 1:单选,2:多选 |
| project-id | 项目id | Number | 1 | 1: 页面统计,2: 训练营 |
| extra-params | 额外参数,可以给给每一种资源类型添加筛选参数 | Object | — | 资源id对应关系: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: 打卡二级:打卡主题 |
# 事件
| 事件名称 | 说明 | 回调参数 |
|---|---|---|
| cancel | 取消选择 | — |
| select | 确认选择已选资源 | 选择的资源数组 |