<template>
<t-pr-ai-list
v-model:active="activeKey"
:items="items"
is-deal
position="left"
:deal-menu="dropdownMenuList"
@pr-command="handleCommand"
>
</t-pr-ai-list>
</template>
<script setup lang="ts">
import { ref } from "vue"
import { PrAiConversation, dropdownMenu } from "../../../../packages/pr-ai-list/src/type"
let activeKey = ref("11111111")
let items = ref<PrAiConversation[]>([
{
key: "11111111",
label: "列表1"
},
{
key: "22222222",
label: "列表2"
}
])
const dropdownMenuList: dropdownMenu[] = [
{
command: "edit",
lable: "重命名"
},
{
command: "del",
lable: "删除"
}
]
const handleCommand = (command: string | number | object, item) => {
console.log(`click on item ${command}`, item)
}
</script>
<style lang="scss" scoped></style>
| 参数 | 说明 | 类型 | 默认值 |
|---|---|---|---|
| items | 列表数据 | PrAiConversation[] | 无 |
| activeKey | 高亮数据 | string | 无 |
| isDeal | 是否有处理按钮 | boolean | false |
| onActiveChange | 切换高亮的事件 | Function | 无 |
PrAiConversation参数 | 参数 | 说明 | 类型 | 默认值 |
|---|---|---|---|
| key | 会话 key | string | 无 |
| label | 会话展示 | string | 无 |
| 插槽名 | 说明 |
|---|---|
| deal | 处理按钮插槽 |