Files
YGChatCS/src/pages/ChatModule/GeneratorPhotoComponent/index.vue
duanshuwen 5f06d8ef11 refactor: migrate legacy color classes to inline tailwind text utilities
Replace all usages of legacy `.color-*` and `.text-color-*` SCSS utility classes with inline Tailwind `text-[#hexcode]` arbitrary value classes. Remove the deprecated `src/static/scss/colors.scss` file, and fix minor formatting/indentation issues across multiple component files.
2026-07-24 21:38:17 +08:00

80 lines
2.5 KiB
Vue

<template>
<view class="container w-full border-ff overflow-hidden rounded-24 flex flex-col">
<!-- 占位撑开 -->
<view class="w-vw"></view>
<view class="content flex flex-col m-4 rounded-24">
<view class="flex flex-col p-[6px] flex-items-center justify-center">
<image class="w-full rounded-20" :src="componentDataMap.background" mode="widthFix" />
<!-- 左上角标签 -->
<view class="tag">
<view class="dot"></view>
<text class="tag-text">{{ componentDataMap.superscript }}</text>
</view>
<image class="g_title mt-20" :src="componentDataMap.title" />
<text class="font-size-14 font-400 text-white my-12 text-center">
{{ componentDataMap.description }}
</text>
<view class="w-full px-[12px] pb-[8px] flex flex-row" @click="jumpClick">
<view class="btn-bg w-full p-[4px] rounded-24 flex flex-row">
<view
class="btn-bg-sub w-full p-[16px] rounded-20 flex flex-row flex-items-center flex-justify-center text-white text-center font-size-18 font-800">
{{ componentDataMap.buttonName }}
</view>
</view>
</view>
</view>
</view>
</view>
</template>
<script setup>
import { defineProps, nextTick, onMounted, computed } from "vue";
import {
SCROLL_TO_BOTTOM,
} from "@/constant/constant";
import { getAccessToken } from "@/constant/token";
import { navigateTo } from "@/router";
const props = defineProps({
toolCall: {
type: Object,
default: {},
},
});
const componentDataMap = computed(() => {
return {
background: props.toolCall.componentNameParams?.background || props.toolCall.aigc?.background,
title: props.toolCall.componentNameParams?.title || props.toolCall.aigc?.title,
description: props.toolCall.componentNameParams?.description || props.toolCall.aigc?.description,
buttonName: props.toolCall.componentNameParams?.buttonName || props.toolCall.aigc?.buttonName,
superscript: props.toolCall.componentNameParams?.superscript || props.toolCall.aigc?.superscript,
jumpUrl: props.toolCall.componentNameParams?.jumpUrl || props.toolCall.aigc?.jumpUrl,
}
})
onMounted(() => {
nextTick(() => {
setTimeout(() => {
uni.$emit(SCROLL_TO_BOTTOM, true);
}, 300);
});
});
const jumpClick = () => {
const token = getAccessToken();
if (componentDataMap.value.jumpUrl) {
navigateTo(componentDataMap.value.jumpUrl, { token: token });
}
};
</script>
<style lang="scss" scoped>
@import "./styles/index.scss";
</style>