Skip to content

Commit 87f6050

Browse files
author
dennis.zpf
committed
fix: 更新chain-thought组件
1 parent 15b3c0e commit 87f6050

File tree

15 files changed

+426
-389
lines changed

15 files changed

+426
-389
lines changed
+27-8
Original file line numberDiff line numberDiff line change
@@ -1,17 +1,36 @@
11
<view class="navigation-bar" />
22

33
<ant-container title="基础用法">
4-
<thought-chain list="{{basicList}}" onContentItemTap="onContentItemTap" />
4+
<thought-chain items="{{basicList}}" onContentItemTap="onContentItemTap" collapsible="{{true}}">
5+
</thought-chain>
56
</ant-container>
6-
<ant-container title="二级节点">
7-
<thought-chain list="{{secondLevelList}}" onContentItemTap="onContentItemTap" />
7+
<ant-container title="自定义内容">
8+
<thought-chain items="{{basicList}}" onContentItemTap="onContentItemTap" collapsible="{{false}}">
9+
<view slot="content" slot-scope="module" style="color: red">
10+
{{module.content}}
11+
</view>
12+
</thought-chain>
813
</ant-container>
9-
<ant-container title="自定义节点内容">
10-
<thought-chain list="{{customList}}" onContentItemTap="onContentItemTap">
11-
<view slot="content" slot-scope="props">
12-
<view a:if="{{props.contentType === 'customType'}}" style="color: red">
13-
customType: {{props.content}}
14+
<ant-container title="二级节点">
15+
<thought-chain items="{{customList}}" onContentItemTap="onContentItemTap" collapsible="{{true}}">
16+
<view slot="content" slot-scope="module">
17+
<view a:if="{{typeof(module.content) === 'object'}}" class="secondLevel">
18+
<thought-chain
19+
className="second-thoughtchain"
20+
items="{{module.content}}"
21+
collapsible="{{false}}"
22+
>
23+
<view slot="content" slot-scope="secondModule" a:if="{{typeof(secondModule.content) === 'object'}}">
24+
<view class="second-thoughtchain-content" a:for="{{secondModule.content}}">
25+
{{item}}
26+
</view>
27+
</view>
28+
<view a:else class="second-thoughtchain-content">
29+
{{secondModule.content}}
30+
</view>
31+
</thought-chain>
1432
</view>
33+
<view a:else>{{module.content}}</view>
1534
</view>
1635
</thought-chain>
1736
</ant-container>
+14
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,18 @@
11
page {
22
// background: #f5f5f5;
33
padding: 12rpx;
4+
.secondLevel {
5+
padding: 24rpx;
6+
background-color: #f5f5f5;
7+
border-radius: 24rpx;
8+
margin-left: -58rpx;
9+
}
10+
.second-thoughtchain {
11+
.ant-copilot-thoughtchain-node-title {
12+
color: #000;
13+
}
14+
.second-thoughtchain-content {
15+
color: #999;
16+
}
17+
}
418
}

copilot-demo/pages/ThoughtChain/index.ts

+9-35
Original file line numberDiff line numberDiff line change
@@ -4,77 +4,51 @@ Page({
44
data: {
55
basicList: [
66
{
7-
status: 'success',
87
title: '理解问题',
8+
content: '3A游戏',
9+
icon: 'CheckCircleOutline'
910
},
1011
{
11-
status: 'fail',
1212
title: '没有在本地找到结果',
13+
content: '当前主流显卡',
14+
icon: 'CheckCircleOutline'
1315
},
1416
{
15-
status: 'loading',
1617
title: '在互联网上搜索问题',
18+
content: '黑神话悟空所需显卡',
19+
icon: 'MoreOutline',
1720
},
1821
],
19-
secondLevelList: [
22+
customList: [
2023
{
21-
status: 'success',
2224
title: '理解问题',
2325
content: '解析语法结构',
24-
contentType: 'text',
2526
},
2627
{
2728
status: 'loading',
2829
title: '搜索问题',
29-
list: [
30+
content: [
3031
{
31-
status: 'success',
3232
title: '理解问题',
3333
},
3434
{
35-
status: 'success',
3635
title: '联网搜索',
37-
content: ['当前主流电脑配置', '黑神话悟空所需显卡', '3A游戏'],
38-
contentType: 'tag',
36+
content: '1. 黑神话悟空介绍',
3937
},
4038
{
41-
status: 'success',
4239
title: '已根据搜索结果精选3篇资料',
43-
contentType: 'link',
4440
content: [
4541
'1. 黑神话悟空介绍',
4642
'2. 对于1080p显示器,4060ti和4060该选哪个?',
4743
'3. 黑神话悟空官方建议配置',
4844
],
4945
},
5046
{
51-
status: 'loading',
5247
title: '联想更多结果',
5348
},
5449
],
5550
},
5651
],
57-
customList: [
58-
{
59-
status: 'success',
60-
title: '理解问题',
61-
content: '这是自定义样式的内容',
62-
contentType: 'customType',
63-
},
64-
{
65-
status: 'success',
66-
title: '搜索问题',
67-
list: [
68-
{
69-
status: 'success',
70-
title:
71-
'搜索中',
72-
content: '子节点中的自定义内容',
73-
contentType: 'customType',
74-
},
75-
],
76-
},
77-
],
7852
},
7953
onContentItemTap(e) {
8054
const { content } = e.target.dataset || {};

copilot/ThoughtChain/index.axml

+20-132
Original file line numberDiff line numberDiff line change
@@ -1,142 +1,30 @@
11
<import-sjs from="./index.sjs" name="utils" />
2-
<template name="content">
3-
<view a:if="{{contentType === 'text'}}" class="ant-copilot-thoughtchain-node-content-text">
4-
<view a:if="{{typeof content === 'string'}}">{{content}}</view>
5-
<view a:elif="{{typeof content === 'object'}}">
6-
<view a:for="{{content}}" class="ant-copilot-thoughtchain-node-content-text-item">
7-
{{item}}
8-
</view>
9-
</view>
10-
</view>
11-
<view a:if="{{contentType === 'link'}}" class="ant-copilot-thoughtchain-node-content-link">
12-
<view
13-
a:if="{{typeof content === 'string'}}"
14-
data-id="{{id}}"
15-
data-index="{{0}}"
16-
data-content="{{content}}"
17-
data-nodeItem="{{nodeItem}}"
18-
data-contentType="{{contentType}}"
19-
onTap="onContentItemTap"
20-
>
21-
{{content}}
22-
</view>
23-
<view a:elif="{{typeof content === 'object'}}">
24-
<view
25-
a:for="{{content}}"
26-
class="ant-copilot-thoughtchain-node-content-link-item"
27-
data-id="{{id}}"
28-
data-index="{{index}}"
29-
data-content="{{item}}"
30-
data-contentType="{{contentType}}"
31-
data-nodeItem="{{nodeItem}}"
32-
onTap="onContentItemTap"
33-
>
34-
{{item}}
35-
</view>
36-
</view>
37-
</view>
38-
<view a:if="{{contentType === 'tag'}}" class="ant-copilot-thoughtchain-node-content-tag">
39-
<view
40-
a:for="{{content}}"
41-
class="ant-copilot-thoughtchain-node-content-tag-item"
42-
data-id="{{id}}"
43-
data-index="{{index}}"
44-
data-content="{{item}}"
45-
data-nodeItem="{{nodeItem}}"
46-
data-contentType="{{contentType}}"
47-
onTap="onContentItemTap"
48-
>
49-
{{item}}
50-
</view>
51-
</view>
52-
</template>
53-
<template name="title">
54-
<view class="ant-copilot-thoughtchain-node-title">
55-
<ant-loading
56-
a:if="{{item.status === statusEnum.LOADING}}"
57-
className="ant-copilot-thoughtchain-node-title-loading"
58-
type="spin"
59-
size="small"
60-
color="{{isFirstLevel ? '#000000a6' : '#000'}}"
61-
/>
62-
<ant-icon
63-
a:elif="{{item.status === statusEnum.FAIL}}"
64-
className="ant-copilot-thoughtchain-node-title-fail"
65-
type="CloseCircleOutline"
66-
/>
67-
<ant-icon
68-
a:else
69-
className="ant-copilot-thoughtchain-node-title-success"
70-
type="CheckCircleOutline"
71-
/>
72-
<view class="ant-copilot-thoughtchain-node-title-text">
73-
{{item.title}}
74-
<ant-icon a:if="{{isExpand && hasExpandArrow}}" type="UpOutline" />
75-
<ant-icon a:elif="{{hasExpandArrow}}" type="DownOutline" />
76-
</view>
77-
78-
</view>
79-
</template>
802
<view class="ant-copilot-thoughtchain {{ className }}">
81-
<view
82-
a:for="{{list}}"
83-
a:for-index="firstLevelIndex"
84-
a:for-item="firstLevelItem"
85-
class="ant-copilot-thoughtchain-node"
86-
>
87-
<view onTap="onTitleTap" data-index="{{firstLevelIndex}}" data-isExpand="{{utils.isExpand(firstLevelFoldStatusList[firstLevelIndex], list.length, firstLevelIndex, firstLevelItem)}}">
88-
<slot name="title" title="{{firstLevelItem.title}}" isExpand="{{utils.isExpand(firstLevelFoldStatusList[firstLevelIndex], list.length, firstLevelIndex, firstLevelItem)}}">
89-
<template is="title" data="{{item: firstLevelItem, statusEnum, isFirstLevel: true, hasExpandArrow: utils.hasExpandArrow(firstLevelItem) ,isExpand: utils.isExpand(firstLevelFoldStatusList[firstLevelIndex], list.length, firstLevelIndex, firstLevelItem)}}" />
90-
</slot>
3+
<view a:for="{{items}}" class="ant-copilot-thoughtchain-node">
4+
<view onTap="onTitleTap" data-index="{{index}}" data-key="{{item.key || index}}">
5+
<view class="ant-copilot-thoughtchain-node-title">
6+
<image
7+
a:if="{{item.icon && item.icon.includes('https://')}}"
8+
class="ant-copilot-thoughtchain-node-title-icon"
9+
mode="widthFix"
10+
src="{{item.icon}}"
11+
/>
12+
<ant-icon a:else type="{{item.icon || 'CheckCircleOutline'}}" class="ant-copilot-thoughtchain-node-title-icon" />
13+
{{item.title}}
14+
<view a:if="{{collapsible}}" class="ant-copilot-thoughtchain-node-title-collapse">
15+
<ant-icon type="{{utils.isExpand(collapsible, item.key || index, foldStatusMap) ? 'UpOutline' : 'DownOutline'}}" />
16+
</view>
17+
</view>
9118
</view>
9219
<view
93-
a:if="{{utils.isExpand(firstLevelFoldStatusList[firstLevelIndex], list.length, firstLevelIndex, firstLevelItem) && firstLevelItem.content && firstLevelItem.contentType}}"
20+
a:if="{{utils.isExpand(collapsible, item.key || index, foldStatusMap)}}"
9421
class="ant-copilot-thoughtchain-node-content"
9522
>
96-
<view a:if="{{['text', 'link', 'tag'].includes(firstLevelItem.contentType)}}">
97-
<template is="content" data="{{content: firstLevelItem.content, contentType: firstLevelItem.contentType, id: firstLevelItem.id || firstLevelIndex, nodeItem: firstLevelItem}}">
98-
</template>
99-
</view>
100-
<view a:else>
101-
<slot
102-
name="content"
103-
contentType="{{firstLevelItem.contentType}}"
104-
content="{{firstLevelItem.content}}"
105-
id="{{firstLevelItem.id || firstLevelIndex}}"
106-
>
107-
</slot>
108-
</view>
109-
110-
</view>
111-
<view a:if="{{utils.isExpand(firstLevelFoldStatusList[firstLevelIndex], list.length, firstLevelIndex, firstLevelItem) && firstLevelItem.list && firstLevelItem.list.length}}" class="ant-copilot-thoughtchain-node-secondlevel">
112-
<view
113-
a:for="{{firstLevelItem.list}}"
114-
a:for-index="secondLevelIndex"
115-
a:for-item="secondLevelItem"
116-
class="ant-copilot-thoughtchain-node secondLevel"
117-
>
118-
<slot name="title" title="{{secondLevelItem.title}}">
119-
<template is="title" data="{{item: secondLevelItem, statusEnum, isFirstLevel: false}}" />
120-
</slot>
121-
<view
122-
a:if="{{secondLevelItem.content && secondLevelItem.contentType}}"
123-
class="ant-copilot-thoughtchain-node-content secondLevel"
124-
>
125-
<view a:if="{{['text', 'link', 'tag'].includes(secondLevelItem.contentType)}}">
126-
<template is="content" data="{{content: secondLevelItem.content, contentType: secondLevelItem.contentType, id: `${firstLevelItem.id || firstLevelIndex}-${secondLevelItem.id || secondLevelIndex}` , nodeItem: secondLevelItem}}">
127-
</template>
128-
</view>
129-
<view a:else>
130-
<slot
131-
name="content"
132-
contentType="{{secondLevelItem.contentType}}"
133-
content="{{secondLevelItem.content}}"
134-
id="{{`${firstLevelItem.id || firstLevelIndex}-${secondLevelItem.id || secondLevelIndex}` }}"
135-
>
136-
</slot>
137-
</view>
23+
<slot name="content" content="{{item.content}}" item="{{item}}">
24+
<view class="ant-copilot-thoughtchain-node-content-text" onTap="onContentItemTap" data-key="{{item.key || index}}" data-content="{{item.content}}">
25+
<view>{{item.content}}</view>
13826
</view>
139-
</view>
27+
</slot>
14028
</view>
14129
</view>
14230
</view>

0 commit comments

Comments
 (0)