feat: 更新聊天视图样式和功能，增加首页任务选择API及数据展示
This commit is contained in:
rd
@ -3,6 +3,7 @@ import { message } from 'ant-design-vue';
|
||||
import ExpandableTags from '@/components/expandable-tags/index.vue';
|
||||
import SenderInput from '../sender-input/index.vue';
|
||||
|
||||
import { getHotTask } from '@/api/all/chat';
|
||||
import { useChatStore } from '@/stores/modules/chat';
|
||||
|
||||
export default {
|
||||
@ -10,6 +11,7 @@ export default {
|
||||
const senderRef = ref(null);
|
||||
const searchValue = ref('');
|
||||
const chatStore = useChatStore();
|
||||
const tagList = ref([]);
|
||||
|
||||
const handleSubmit = () => {
|
||||
handleSearch();
|
||||
@ -20,21 +22,19 @@ export default {
|
||||
chatStore.onCreateSession();
|
||||
};
|
||||
|
||||
const tagList = [
|
||||
'汇总账号昨天的运营情况',
|
||||
'查账号本月点赞量 Top3 的笔记详情',
|
||||
'统计投流账户上周的消耗金额 + 点击率',
|
||||
'把昨天漏采数据的账号重新抓取一次数据',
|
||||
'规划账号未来 2 周的内容发布排期和选题',
|
||||
'根据账号的已有选题生成具体内容稿件',
|
||||
'根据热点生成账号的选题及内容',
|
||||
];
|
||||
|
||||
const handleTagClick = (tag: string) => {
|
||||
searchValue.value = tag;
|
||||
senderRef.value?.focus();
|
||||
};
|
||||
|
||||
onMounted(() => {
|
||||
getHotTask().then((res) => {
|
||||
const { data, code } = res;
|
||||
if (code === 200) {
|
||||
tagList.value = data?.list?.map((v) => v.title) ?? [];
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
return () => (
|
||||
<div class="create-conversation-wrap w-full h-full flex justify-center">
|
||||
@ -47,7 +47,7 @@ export default {
|
||||
<p class="cts text-center mb-104px">AI 辅助账号托管账号 ｜ 自动生成爆款内容 ｜ 定时任务发布</p>
|
||||
<SenderInput ref={senderRef} v-model={searchValue.value} onSubmit={handleSubmit} class="mb-24px" />
|
||||
<p class="cts mb-6px">可以试试这样下发任务：</p>
|
||||
<ExpandableTags tags={tagList} clickable onTagClick={handleTagClick} />
|
||||
<ExpandableTags tags={tagList.value} clickable onTagClick={handleTagClick} />
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
|
||||
@ -94,7 +94,7 @@ export default {
|
||||
});
|
||||
|
||||
return () => (
|
||||
<Drawer width={240} rootClassName="ct-history-conversation-drawer" v-model:open={open.value} onClose={onClose}>
|
||||
<Drawer width={320} rootClassName="ct-history-conversation-drawer" v-model:open={open.value} onClose={onClose}>
|
||||
<header class="header h-40px px-12px flex justify-between items-center">
|
||||
<span class="text-12px font-400 color-#211F24 font-family-medium">历史对话</span>
|
||||
<icon-close size={16} class="color-#211F24 cursor-pointer" onClick={onClose} />
|
||||
|
||||
@ -95,8 +95,8 @@
|
||||
class="rounded-4px"
|
||||
/>
|
||||
</template>
|
||||
<template v-else-if="field.dataIndex === 'last_synced_at'">
|
||||
{{ exactFormatTime(detailData.last_synced_at, 'YYYY-MM-DD HH:mm:ss', 'YYYY-MM-DD HH:mm:ss') }}
|
||||
<template v-else-if="['last_authorized_at', 'last_synced_at'].includes(field.dataIndex)">
|
||||
{{ exactFormatTime(detailData[field.dataIndex], 'YYYY-MM-DD HH:mm:ss', 'YYYY-MM-DD HH:mm:ss') }}
|
||||
</template>
|
||||
<!-- 环比字段特殊渲染 -->
|
||||
<template v-else-if="field.isRateField">
|
||||
|
||||
@ -18,7 +18,7 @@ export function groupFieldsWithColSpan<
|
||||
dataIndex: `${getPropPrefix(dateType)}${item.dataIndex}`,
|
||||
prop: `${getPropPrefix(dateType)}${item.prop}`,
|
||||
title: `${labelPrefix}${item.title}`,
|
||||
tooltip: `${labelPrefix}${item.tooltip}`
|
||||
tooltip: `${labelPrefix}${item.tooltip}`,
|
||||
};
|
||||
}
|
||||
});
|
||||
@ -28,6 +28,7 @@ export const getAccountInfoFields = (dateType: string, showMore: boolean) => {
|
||||
const baseFields = [
|
||||
{ title: '账号名称', dataIndex: 'name', notDifferentiateDateType: true },
|
||||
{ title: '数据更新时间', dataIndex: 'last_synced_at', notDifferentiateDateType: true },
|
||||
{ title: '最后授权时间', dataIndex: 'last_authorized_at', notDifferentiateDateType: true },
|
||||
{ title: '平台', dataIndex: 'platform', notDifferentiateDateType: true },
|
||||
{ title: '状态', dataIndex: 'status', type: 'status', notDifferentiateDateType: true },
|
||||
{ title: '账号ID', dataIndex: 'account_id', notDifferentiateDateType: true },
|
||||
@ -36,7 +37,6 @@ export const getAccountInfoFields = (dateType: string, showMore: boolean) => {
|
||||
{ title: '所属项目', dataIndex: 'group.name', notDifferentiateDateType: true },
|
||||
{ title: '分组', dataIndex: 'group.name', notDifferentiateDateType: true },
|
||||
{ title: '标签', dataIndex: 'tags', notDifferentiateDateType: true },
|
||||
{ title: 'AI评价', dataIndex: 'ai_evaluation', notDifferentiateDateType: true },
|
||||
{ title: '粉丝量', dataIndex: 'fans_number', tooltip: '账号的当前粉丝总数。', notDifferentiateDateType: true },
|
||||
{
|
||||
title: '总赞藏数',
|
||||
@ -45,6 +45,11 @@ export const getAccountInfoFields = (dateType: string, showMore: boolean) => {
|
||||
tooltip: '账号所有内容获得的点赞数与收藏数总和，用于衡量历史内容的整体吸引力与认可度。',
|
||||
},
|
||||
];
|
||||
const allFields = showMore ? [...baseFields, ...CUSTOM_FIELDS] : baseFields.slice(0,8);
|
||||
const customFieldsWithAiEvaluation = [
|
||||
CUSTOM_FIELDS[0],
|
||||
{ title: 'AI评价', dataIndex: 'ai_evaluation', notDifferentiateDateType: true },
|
||||
...CUSTOM_FIELDS.slice(1),
|
||||
];
|
||||
const allFields = showMore ? [...baseFields, ...customFieldsWithAiEvaluation] : baseFields.slice(0, 8);
|
||||
return groupFieldsWithColSpan(allFields, dateType);
|
||||
};
|
||||
|
||||
@ -27,6 +27,10 @@
|
||||
<span class="label">数据更新时间</span>
|
||||
<span class="cts num">{{ getLastSyncedAt(item) }}</span>
|
||||
</div>
|
||||
<div class="field-row">
|
||||
<span class="label">最后授权时间</span>
|
||||
<span class="cts num">{{ formatTime(item.last_authorized_at) }}</span>
|
||||
</div>
|
||||
<div class="field-row">
|
||||
<span class="label">平台</span>
|
||||
<img :src="item.platform === 0 ? icon1 : icon2" width="16" height="16" />
|
||||
|
||||
Reference in New Issue
Block a user