zoujing/YGChatCS
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: 数据接口的字段对接 与交互对接

Browse Source
This commit is contained in:
zoujing
2026-04-29 15:33:21 +08:00
parent 3d6fe2642c
commit bf76fa89c9
3 changed files with 59 additions and 92 deletions
Download Patch File Download Diff File Expand all files Collapse all files

70
src/pages/Discovery/components/QuickQuestions/index.vue
View File

@@ -4,17 +4,17 @@
<view class="container-scroll font-size-0 scroll-x whitespace-nowrap">
<view class="card-item bg-white inline-block rounded-20 p-10 mr-10"
v-for="(item, index) in recommendPostsList" :key="index" @click="sendReply(item)">
<view class="card-item bg-white inline-block rounded-20 mr-10"
v-for="(item, index) in list" :key="index" @click="sendReply(item)">
<view class="flex flex-row items-center">
<image class="card-img rounded-14" :src="createSvg(item.bgColor, item.iconColor)" />
<view class="flex flex-row flex-justify-start p-10">
<image class="card-img flex-shrink-0 rounded-14" :src="createSvgIndex(index)" />
<view class="ml-8 mt-4 border-box">
<view class="font-size-12 font-600 color-171717 ellipsis-1">
<view class="min-width-0 flex flex-col flex-full border-box pl-8 py-4" >
<view class="w-full font-size-12 font-600 color-171717 ellipsis-1">
{{ item.title }}
</view>
<view class="font-size-9 color-94A3B8 ellipsis-1">
<view class="w-full font-size-9 color-94A3B8 ellipsis-1">
{{ item.subTitle }}
</view>
</view>
@@ -27,60 +27,36 @@
<script setup>
import { defineProps } from "vue";
import { SEND_MESSAGE_CONTENT_TEXT, SEND_MESSAGE_COMMAND_TYPE } from "@/constant/constant";
import ModuleTitle from "@/components/ModuleTitle/index.vue";
const emit = defineEmits(["didSelectItem"]);
const props = defineProps({
themeName: {
type: String,
default: "快捷提问",
},
recommendPostsList: {
list: {
type: Array,
default: () => [
{
title: "小七孔古桥",
subTitle: "小七孔古桥",
coverPhoto: "https://images.unsplash.com/photo-1506744038136-46273834b3fb?w=800&q=80",
bgColor: '#ECFDF5',
iconColor: '#10B981'
},
{
title: "翠谷瀑布",
subTitle: "翠谷瀑布",
coverPhoto: "https://images.unsplash.com/photo-1506744038136-46273834b3fb?w=800&q=80",
bgColor: '#FFFBEB',
iconColor: '#F59E0B'
},
{
title: "鸳鸯湖",
subTitle: "鸳鸯湖",
coverPhoto: "https://images.unsplash.com/photo-1506744038136-46273834b3fb?w=800&q=80",
bgColor: '#EFF6FF',
iconColor: '#3B82F6'
},
{
title: "卧龙潭",
subTitle: "卧龙潭",
coverPhoto: "https://images.unsplash.com/photo-1506744038136-46273834b3fb?w=800&q=80",
bgColor: '#FFFBEB',
iconColor: '#F59E0B'
}
],
},
default: () => [],
}
});
/// 点击卡片
const sendReply = (item) => {
if (item.userInputContentType && item.userInputContentType === '1') {
const commonItem = { type: item.userInputContent, title: item.topic }
uni.$emit(SEND_MESSAGE_COMMAND_TYPE, commonItem);
return;
}
uni.$emit(SEND_MESSAGE_CONTENT_TEXT, item.userInputContent);
emit("didSelectItem", item);
};
/// 生成icon
const createSvgIndex = (index) => {
const colors = [
{ bgColor: '#ECFDF5', iconColor: '#10B981' },
{ bgColor: '#FFFBEB', iconColor: '#F59E0B' },
{ bgColor: '#EFF6FF', iconColor: '#3B82F6' },
{ bgColor: '#FFFBEB', iconColor: '#F59E0B' }
];
return createSvg(...Object.values(colors[index % colors.length]));
}
const createSvg = (bgColor = '#FFFBEB', iconColor = '#F59E0B', size = 40) => {
const svg = `
<svg xmlns="http://www.w3.org/2000/svg" width="${size}" height="${size}" viewBox="0 0 40 40" fill="none">