Skip to content

Commit ddaf664

Browse files
authored
Feat Conversations (#1388)
* feat: init copilot conversations * feat: dev copilot conversations * feat: dev copilot conversations * feat: dev copilot conversations * feat: dev copilot conversations * feat: dev copilot conversations * feat: dev copilot conversations
1 parent 3c21d95 commit ddaf664

File tree

17 files changed

+592
-12
lines changed

17 files changed

+592
-12
lines changed
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,46 @@
1+
<view class="navigation-bar"/>
2+
3+
<ant-container title="基础用法">
4+
<ant-conversations
5+
items="{{items}}"
6+
menus="{{menus}}"
7+
onItemTap="handleItemTap"
8+
onMenuItemTap="handleMenuItemTap"
9+
/>
10+
</ant-container>
11+
12+
<!-- #if ALIPAY -->
13+
<ant-container title="自定义插槽">
14+
<ant-conversations
15+
items="{{items.slice(2,5)}}"
16+
menus="{{menus}}"
17+
onItemTap="handleItemTap"
18+
onMenuItemTap="handleMenuItemTap"
19+
>
20+
<view slot-scope="props">
21+
<view style="color: #1677ff;">{{props.item.label}}</view>
22+
<view style="color: #bbbbbb;">{{props.item.description}}</view>
23+
</view>
24+
</ant-conversations>
25+
</ant-container>
26+
<!-- #endif -->
27+
28+
<ant-container title="抽屉中展示">
29+
<ant-button onTap="handleOpenHistory" inline size="small">历史记录</ant-button>
30+
<ant-popup
31+
className="history-popup"
32+
visible="{{ visible }}"
33+
height="{{ 250 }}"
34+
width="{{ 250 }}"
35+
position="left"
36+
animation
37+
onClose="handlePopupClose"
38+
>
39+
<ant-conversations
40+
items="{{items}}"
41+
menus="{{menus}}"
42+
onItemTap="handleItemTap"
43+
onMenuItemTap="handleMenuItemTap"
44+
/>
45+
</ant-popup>
46+
</ant-container>
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,18 @@
1+
{
2+
/// #if WECHAT
3+
"navigationBarTitleText": "Conversations",
4+
/// #endif
5+
6+
/// #if ALIPAY
7+
"defaultTitle": "Conversations",
8+
"transparentTitle": "auto",
9+
"titlePenetrate": "YES",
10+
/// #endif
11+
12+
"usingComponents": {
13+
"ant-container": "../../../src/Container/index",
14+
"ant-conversations": "../../../src/Conversations/index",
15+
"ant-popup": "../../../src/Popup/index",
16+
"ant-button": "../../../src/Button/index"
17+
}
18+
}
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,7 @@
1+
.history-popup {
2+
.ant-popup-transform-left {
3+
/// #if ALIPAY
4+
padding-top: 90px;
5+
/// #endif
6+
}
7+
}
+100
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,100 @@
1+
Page({
2+
data: {
3+
visible: false,
4+
items: [
5+
{
6+
key: '1',
7+
label: '给我推荐一首歌',
8+
description: '这是会话的部分富文本信息描述',
9+
icon: 'https://randomuser.me/api/portraits/thumb/women/4.jpg',
10+
timestamp: '10:23',
11+
disabled: false,
12+
},
13+
{
14+
key: '2',
15+
label: '请根据图片里的提示,写一篇小学二年级的数学题目',
16+
description:
17+
'这首歌来自英国歌手艾德·希兰旋律轻快,歌曲写自上个世纪落日',
18+
icon: '',
19+
timestamp: '10:22',
20+
disabled: false,
21+
},
22+
{
23+
key: '3',
24+
label: '禁用无法点击此条',
25+
description: '这是会话的部分富文本信息描述',
26+
icon: '',
27+
timestamp: '10:21',
28+
disabled: true,
29+
},
30+
{
31+
key: '4',
32+
label: '菜单禁用无法滑动',
33+
description: '这是会话的部分富文本信息描述',
34+
icon: '',
35+
timestamp: '10:18',
36+
disabled: false,
37+
disabledMenu: true,
38+
},
39+
{
40+
key: '5',
41+
label: '给我推荐一首歌',
42+
description: '这是会话的部分富文本信息描述',
43+
icon: '',
44+
timestamp: '09:11',
45+
disabled: false,
46+
},
47+
],
48+
menus: [
49+
{
50+
text: '编辑',
51+
bgColor: '#FFA91B',
52+
color: '#fff',
53+
width: 160,
54+
},
55+
{
56+
text: '删除',
57+
bgColor: '#FF2B00',
58+
color: '#fff',
59+
width: 160,
60+
},
61+
],
62+
},
63+
handleItemTap(i) {
64+
let item = i;
65+
/// #if ALIPAY
66+
console.log(item);
67+
my.showToast({ content: item.key });
68+
/// #endif
69+
/// #if WECHAT
70+
item = i.detail[0];
71+
console.log(item);
72+
// @ts-ignore
73+
wx.showToast({ title: item.key });
74+
/// #endif
75+
},
76+
handleMenuItemTap(menuItem, item) {
77+
/// #if ALIPAY
78+
console.log(menuItem, item);
79+
my.showToast({ content: `菜单${menuItem.index}_列表项${item.key}` });
80+
/// #endif
81+
/// #if WECHAT
82+
console.log(menuItem.detail[0], menuItem.detail[1]);
83+
// @ts-ignore
84+
wx.showToast({
85+
title: `菜单${menuItem.detail[0].index}_列表项${menuItem.detail[1].key}`,
86+
});
87+
/// #endif
88+
},
89+
90+
handleOpenHistory() {
91+
this.setData({
92+
visible: true,
93+
});
94+
},
95+
handlePopupClose() {
96+
this.setData({
97+
visible: false,
98+
});
99+
},
100+
});

copilot-demo/utils/constants.ts

-11
This file was deleted.

copilot/Conversations/index.axml

+44
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,44 @@
1+
<view class="ant-copilot-conversations {{className}}" style="{{style}}">
2+
<block
3+
a:for="{{items}}"
4+
a:for-index="index"
5+
a:for-item="item"
6+
a:key="key">
7+
<view class="ant-copilot-conversations-swipe-item">
8+
<ant-swipe-action
9+
data-item="{{item}}"
10+
data-index="{{index}}"
11+
rightButtons="{{menus}}"
12+
elasticity="{{true}}"
13+
disabled="{{item.disabledMenu}}"
14+
onButtonTap="onButtonTap"
15+
>
16+
<view
17+
class="ant-copilot-conversations-swipe-item-view"
18+
hover-start-time="{{20}}"
19+
hover-stay-time="{{40}}"
20+
hover-class="{{item.disabled ? '' : 'ant-copilot-conversations-hover'}}"
21+
onTouchStart="{{item.disabled ? '' : 'onTouchStart'}}"
22+
onTouchEnd="{{item.disabled ? '' : 'onItemTap'}}"
23+
data-item="{{item}}"
24+
data-index="{{index}}"
25+
>
26+
<!-- #if ALIPAY -->
27+
<slot item="{{item}}" index="{{index}}">
28+
<!-- #endif -->
29+
<image a:if="{{item.icon}}" class="ant-copilot-conversations-swipe-item-view-icon" src="{{item.icon}}" />
30+
<view class="ant-copilot-conversations-swipe-item-view-main">
31+
<view class="ant-copilot-conversations-swipe-item-view-main-top">
32+
<view a:if="{{item.label}}" class="ant-copilot-conversations-swipe-item-view-label">{{item.label}}</view>
33+
<view a:if="{{item.timestamp}}" class="ant-copilot-conversations-swipe-item-view-timestamp">{{item.timestamp}}</view>
34+
</view>
35+
<view a:if="{{item.description}}" class="ant-copilot-conversations-swipe-item-view-desc">{{item.description}}</view>
36+
</view>
37+
<!-- #if ALIPAY -->
38+
</slot>
39+
<!-- #endif -->
40+
</view>
41+
</ant-swipe-action>
42+
</view>
43+
</block>
44+
</view>

copilot/Conversations/index.en.md

Whitespace-only changes.

copilot/Conversations/index.json

+6
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,6 @@
1+
{
2+
"component": true,
3+
"usingComponents": {
4+
"ant-swipe-action": "../../src/SwipeAction/index"
5+
}
6+
}

copilot/Conversations/index.less

+61
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,61 @@
1+
@import (reference) './variable.less';
2+
3+
@buttonPrefix: ant-copilot-conversations;
4+
5+
.@{buttonPrefix} {
6+
&-hover {
7+
opacity: 0.6;
8+
}
9+
&-swipe-item {
10+
height: @conversations-swipe-item-height;
11+
&-view {
12+
height: 100%;
13+
width: @conversations-swipe-item-view-width;
14+
padding: 24 * @rpx 32 * @rpx;
15+
box-sizing: border-box;
16+
display: flex;
17+
align-items: center;
18+
&-main {
19+
flex-grow: 1;
20+
overflow: hidden;
21+
&-top {
22+
display: flex;
23+
align-items: center;
24+
justify-content: space-between;
25+
}
26+
}
27+
&-icon {
28+
flex-shrink: 0;
29+
width: 72 * @rpx;
30+
height: 72 * @rpx;
31+
border-radius: 50%;
32+
margin-right: 24 * @rpx;
33+
}
34+
&-label {
35+
font-size: 28 * @rpx;
36+
line-height: 40 * @rpx;
37+
height: 40 * @rpx;
38+
color: @conversations-swipe-item-view-label-color;
39+
white-space: nowrap;
40+
overflow: hidden;
41+
text-overflow: ellipsis;
42+
}
43+
&-timestamp {
44+
flex-shrink: 0;
45+
margin-left: 28 * @rpx;
46+
font-size: 28 * @rpx;
47+
line-height: 44 * @rpx;
48+
color: @conversations-swipe-item-view-timestamp-color;
49+
}
50+
&-desc {
51+
font-size: 24 * @rpx;
52+
line-height: 48 * @rpx;
53+
height: 48 * @rpx;
54+
color: @conversations-swipe-item-view-desc-color;
55+
white-space: nowrap;
56+
overflow: hidden;
57+
text-overflow: ellipsis;
58+
}
59+
}
60+
}
61+
}

0 commit comments

Comments
 (0)