refactor: replace legacy flex utility classes and remove flex.scss

Replace all instances of prefixed flex utility classes (like flex-items-center, flex-justify-between, flex-full, flex-shrink-0) with their standard un-prefixed counterparts (items-center, justify-between, flex-1, shrink-0) across the codebase. Remove the deprecated src/static/scss/flex.scss partial file as it is no longer needed after these updates.
This commit is contained in:
duanshuwen
2026-07-25 10:03:01 +08:00
parent 1df4b328dd
commit 15560574e0
61 changed files with 191 additions and 243 deletions

View File

@@ -1,15 +1,11 @@
<template>
<!-- 外层行容器接收来自父组件的对齐类 flex flex-justify-start并占满宽度 -->
<!-- 外层行容器接收来自父组件的对齐类 flex justify-start并占满宽度 -->
<view class="chat-ai-row">
<view class="container">
<view class="chat-ai">
<view class="container-content">
<image
v-if="isLoading"
class="loading-img"
src="https://oss.nianxx.cn/mp/static/chat_msg_loading.gif"
mode="aspectFit"
/>
<image v-if="isLoading" class="loading-img" src="https://oss.nianxx.cn/mp/static/chat_msg_loading.gif"
mode="aspectFit" />
<ChatMarkdown :key="textKey" :text="processedText" />
<ChatLoading v-if="isLoading" />
</view>

View File

@@ -1,5 +1,5 @@
<template>
<!-- 外层行容器接收来自父组件的对齐类 flex flex-justify-end -->
<!-- 外层行容器接收来自父组件的对齐类 flex justify-end -->
<view class="chat-mine-row">
<view class="chat-mine bg-[#17294e]">
<text class="text-[15px] text-white">{{ text }}</text>

View File

@@ -1,12 +1,12 @@
<template>
<view class="flex flex-col bg-white h-screen overflow-hidden">
<!-- 顶部固定导航 -->
<view class="flex-shrink-0">
<view class="shrink-0">
<TopNavBar :title="title" background="transparent" />
</view>
<!-- 滚动区域 -->
<scroll-view class="flex-full overflow-hidden chat-scroll" scroll-y :scroll-into-view="scrollIntoViewId"
<scroll-view class="flex-1 overflow-hidden chat-scroll" scroll-y :scroll-into-view="scrollIntoViewId"
scroll-with-animation @scroll="onScroll" @touchstart="onTouchStart" @touchend="onTouchEnd"
@touchcancel="onTouchEnd">
<view class="flex flex-col pt-[12px] px-[16px] pb-[24px] gap-[10px]">

View File

@@ -6,26 +6,26 @@
@showDrawer="handleShowDrawer" />
</view>
<view class="home-hero relative flex-shrink-0">
<view class="home-hero relative shrink-0">
<image class="home-hero-bg w-full block" :src="mainPageDataModel?.initPageImages?.backgroundImageUrl"
mode="aspectFill" />
<SpriteAnimator v-if="homeSpriteStyle.ipLargeImage" class="home-hero-sprite" :src="homeSpriteStyle.ipLargeImage"
:frameWidth="homeSpriteStyle.frameWidth" :frameHeight="homeSpriteStyle.frameHeight"
:totalFrames="homeSpriteStyle.totalFrames" :columns="homeSpriteStyle.columns"
:displayWidth="homeSpriteStyle.displayWidth" :fps="16" />
<view class="home-tabs-layer absolute bottom-0 left-0 right-0 flex-full">
<view class="home-tabs-layer absolute bottom-0 left-0 right-0 flex-1">
<view style="margin-bottom: -1px;">
<AiTabSwitch v-model="tabIndex" :list="tabList" @change="handleChange" />
</view>
</view>
</view>
<view v-show="tabIndex === 0" class="discovery-shell flex-full" @touchstart.capture="handleDiscoveryPanelTouchStart"
<view v-show="tabIndex === 0" class="discovery-shell flex-1" @touchstart.capture="handleDiscoveryPanelTouchStart"
@touchstart="handleDiscoveryPanelTouchStart" @touchmove.capture="handleDiscoveryPanelTouchMove"
@touchmove="handleDiscoveryPanelTouchMove" @touchend="handleDiscoveryPanelTouchEnd"
@touchcancel="handleDiscoveryPanelTouchEnd">
<view class="home-welcome-panel">
<HomeWelcome class="flex-shrink-0" :mainPageDataModel="mainPageDataModel" />
<HomeWelcome class="shrink-0" :mainPageDataModel="mainPageDataModel" />
</view>
<view class="discovery-panel" :class="{ 'is-collapsed': isDiscoveryPanelCollapsed }">
@@ -34,14 +34,14 @@
</view>
<!-- 消息列表可滚动区域 -->
<scroll-view v-show="tabIndex === 1" class="main main-scroll-area flex-full overflow-hidden " scroll-y
<scroll-view v-show="tabIndex === 1" class="main main-scroll-area flex-1 overflow-hidden " scroll-y
:scroll-top="scrollTop" :scroll-with-animation="true" @scroll="handleScroll" @scrolltolower="handleScrollToLower"
@touchstart.capture="handleScrollAreaTouchStart" @touchstart="handleScrollAreaTouchStart"
@touchmove="handleScrollAreaTouchMove">
<view class="area-msg-list-content" v-for="item in chatMsgList" :key="item.msgId" :id="item.msgId">
<template v-if="item.msgType === MessageRole.AI">
<ChatCardAI class="flex flex-justify-start" :key="`ai-${item.msgId}-${item.msg ? item.msg.length : 0}`" :text="item.componentName && isLongTextCard(item.componentName)
<ChatCardAI class="flex justify-start" :key="`ai-${item.msgId}-${item.msg ? item.msg.length : 0}`" :text="item.componentName && isLongTextCard(item.componentName)
? ''
: item.msg || ''
" :isLoading="item.isLoading">
@@ -115,11 +115,11 @@
</template>
<template v-else-if="item.msgType === MessageRole.ME">
<ChatCardMine class="flex flex-justify-end" :text="item.msg" />
<ChatCardMine class="flex justify-end" :text="item.msg" />
</template>
<template v-else>
<ChatCardOther class="flex flex-justify-center" :text="item.msg">
<ChatCardOther class="flex justify-center" :text="item.msg">
<ChatGuide v-if="chatMsgList.length < 2" />
<ActivityListComponent v-if="
mainPageDataModel.activityList &&

View File

@@ -1,11 +1,11 @@
<template>
<view class="border-box h-44 flex flex-items-center pl-[12px] pr-[12px]" :style="navBarStyle">
<view class="border-box h-44 flex items-center pl-[12px] pr-[12px]" :style="navBarStyle">
<view class="nav-icon-button" @tap.stop="showDrawer">
<uni-icons type="bars" size="24" color="#ffffff" />
</view>
<!-- 隐藏 -->
<view v-if="false" class="flex-full h-full flex flex-items-center flex-justify-center">
<view v-if="false" class="flex-1 h-full flex items-center justify-center">
<!-- ChatTopWelcome不在可视区显示并添加动画在可视区隐藏 -->
<SpriteAnimator v-show="show" class="image-animated" :src="spriteStyle.ipSmallImage"
:frameWidth="spriteStyle.frameWidth" :frameHeight="spriteStyle.frameHeight"

View File

@@ -2,7 +2,7 @@ v
<template>
<view class="welcome-content p-[12px]">
<view class="wrap rounded-[20px]">
<view class="flex flex-items-center flex-justify-between pl-[12px] pr-[12px]">
<view class="flex items-center justify-between pl-[12px] pr-[12px]">
<SpriteAnimator :src="spriteStyle.ipLargeImage" :frameWidth="spriteStyle.frameWidth"
:frameHeight="spriteStyle.frameHeight" :totalFrames="spriteStyle.totalFrames" :columns="spriteStyle.columns"
:displayWidth="spriteStyle.displayWidth" :fps="16" />

View File

@@ -1,19 +1,19 @@
<template>
<view class="flex flex-col bg-liner h-screen overflow-hidden">
<!-- 顶部固定导航 -->
<view class="flex-shrink-0">
<view class="shrink-0">
<TopNavBar :title="detailTitle" background="transparent" />
</view>
<!-- 滚动区域 -->
<scroll-view class="flex-full overflow-hidden" scroll-y>
<scroll-view class="flex-1 overflow-hidden" scroll-y>
<view class="pb-[24px] overflow-hidden">
<image v-if="coverImage" class="w-full h-auto block" :src="coverImage" mode="widthFix" />
<view class="pt-[16px] px-[12px] pb-[24px] border-box">
<view class="text-[#171717] text-[16px] font-weight-600">{{ detailTitle }}</view>
<view v-if="publishTime" class="notice-time-tag flex flex-row flex-items-center mt-[16px]">
<view v-if="publishTime" class="notice-time-tag flex flex-row items-center mt-[16px]">
<uni-icons type="clock" size="18" color="#5A6780" />
<text class="text-[#171717] text-[12px] font-weight-600 ml-[8px]">发布时间{{ publishTime }}</text>
</view>

View File

@@ -11,12 +11,11 @@
object-fit="cover" @click.stop @play="handlePlay" @fullscreenchange="handleFullScreenChange"
@error="handleError" />
<view v-if="videoUrl && !disabled"
class="aigc-photo-card__fullscreen flex flex-items-center flex-justify-center text-white text-[12px]"
class="aigc-photo-card__fullscreen flex items-center justify-center text-white text-[12px]"
@click.stop="requestFullScreen">
全屏
</view>
<view v-if="!videoUrl"
class="aigc-photo-card__empty flex flex-items-center flex-justify-center text-white text-[14px]">
<view v-if="!videoUrl" class="aigc-photo-card__empty flex items-center justify-center text-white text-[14px]">
视频地址为空
</view>
</view>

View File

@@ -4,7 +4,7 @@
<view class="w-screen"></view>
<view class="flex flex-col px-[16px] pt-[16px] pb-[12px] border-box" @click="lookDetailAction">
<view v-if="tag" class="long-answer-tag" :style="longAnswerTagStyle">{{ tag }}</view>
<view v-if="title" class="flex flex-row flex-items-start flex-justify-start mb-[4px]">
<view v-if="title" class="flex flex-row flex-items-start justify-start mb-[4px]">
<text class="text-[16px] font-[600] text-[#0B5C2D]"> {{ title }}</text>
</view>
<!-- 文字内容根据数据模式限制预览行数 -->
@@ -12,11 +12,11 @@
<ChatMarkdown :text="processedContent" :fontColor="'#94A3B8'" />
</view>
<!-- 超过2行时显示...提示 -->
<view v-if="!finish" class="flex flex-row flex-items-center mt-[8px]">
<view v-if="!finish" class="flex flex-row items-center mt-[8px]">
<text class="text-[12px] font-[500] font-color-600">正在生成</text>
<ChatLoading />
</view>
<view v-if="isOverflow" class="flex flex-row flex-items-center flex-justify-between mt-[12px]">
<view v-if="isOverflow" class="flex flex-row items-center justify-between mt-[12px]">
<text class="text-[12px] font-bold text-[#cbd5e1] mr-[4px]">查看完整{{ tag }}</text>
<uni-icons type="right" size="16" color="#CBD5E1"></uni-icons>
</view>

View File

@@ -1,8 +1,8 @@
<template>
<uni-popup ref="popup" type="center" :safe-area="false">
<view class="popup-content bg-white mx-[24px] px-[12px] py-16 rounded-[12px]">
<view class="header flex flex-items-center pb-[12px]">
<view class="title flex-full text-center text-[17px] text-[#000000] font-[500] ml-[24px]">呼叫热线</view>
<view class="header flex items-center pb-[12px]">
<view class="title flex-1 text-center text-[17px] text-[#000000] font-[500] ml-[24px]">呼叫热线</view>
<uni-icons type="close" size="24" color="#CACFD8" @click="close" />
</view>

View File

@@ -3,7 +3,7 @@
<image class="facility-location-card__image block w-full" :src="data.image" mode="aspectFill" />
<view class="facility-location-card__body px-[24px] pb-[24px]">
<view class="facility-location-card__title-row flex flex-items-center">
<view class="facility-location-card__title-row flex items-center">
<view class="facility-location-card__badge text-[#2563eb] bg-[#eff6ff] text-[12px] font-bold">
{{ type.text }}
</view>
@@ -12,14 +12,13 @@
</view>
</view>
<view class="facility-location-card__distance flex flex-items-center text-[#94a3b8] text-[14px] font-bold">
<view class="facility-location-card__distance flex items-center text-[#94a3b8] text-[14px] font-bold">
<text class="facility-location-card__distance-icon">{{ distance.icon }}</text>
<text>{{ distance.text }}</text>
</view>
<view class="facility-location-card__location bg-[#f8fafc] rounded-[20px]">
<view
class="facility-location-card__location-label flex flex-items-center text-[#64748b] text-[13px] font-bold">
<view class="facility-location-card__location-label flex items-center text-[#64748b] text-[13px] font-bold">
<text class="facility-location-card__location-dot">{{ location.icon }}</text>
<text>{{ location.label }}</text>
</view>
@@ -29,7 +28,7 @@
</view>
<view
class="facility-location-card__button flex flex-items-center flex-justify-center bg-[#0f172a] text-white text-[18px] font-bold"
class="facility-location-card__button flex items-center justify-center bg-[#0f172a] text-white text-[18px] font-bold"
:class="{ 'is-disabled': disabled }" @click="handleAction">
<text class="facility-location-card__button-icon">{{ action.icon }}</text>
<text>{{ action.text }}</text>

View File

@@ -1,7 +1,7 @@
<template>
<view class="faq-help-card bg-white rounded-[24px] w-full">
<view class="faq-help-card__header flex flex-items-center">
<view class="faq-help-card__icon flex flex-items-center flex-justify-center rounded-full text-[16px] font-bold">
<view class="faq-help-card__header flex items-center">
<view class="faq-help-card__icon flex items-center justify-center rounded-full text-[16px] font-bold">
{{ data.icon }}
</view>
<view class="faq-help-card__title text-[#1e293b] text-[20px] font-bold">
@@ -12,9 +12,9 @@
<view class="faq-help-card__divider"></view>
<view class="faq-help-card__list">
<view v-for="item in questions" :key="item.id || item.text" class="faq-help-card__item flex flex-items-center"
<view v-for="item in questions" :key="item.id || item.text" class="faq-help-card__item flex items-center"
:class="{ 'is-disabled': disabled }" @click="handleSelect(item)">
<view class="faq-help-card__question text-[#475569] text-[18px] font-bold truncate flex-full">
<view class="faq-help-card__question text-[#475569] text-[18px] font-bold truncate flex-1">
{{ item.text }}
</view>
<uni-icons type="right" size="16" color="#CBD5E1"></uni-icons>

View File

@@ -3,7 +3,7 @@
<!-- 占位撑开 -->
<view class="w-screen"></view>
<view class="content flex flex-col m-[4px] rounded-[24px]">
<view class="flex flex-col p-[6px] flex-items-center justify-center">
<view class="flex flex-col p-[6px] items-center justify-center">
<image class="w-full rounded-[20px]" :src="componentDataMap.background" mode="widthFix" />
<!-- 左上角标签 -->
@@ -21,7 +21,7 @@
<view class="w-full px-[12px] pb-[8px] flex flex-row" @click="jumpClick">
<view class="btn-bg w-full p-[4px] rounded-[24px] flex flex-row">
<view
class="btn-bg-sub w-full p-[16px] rounded-[20px] flex flex-row flex-items-center flex-justify-center text-white text-center text-[18px] font-bold">
class="btn-bg-sub w-full p-[16px] rounded-[20px] flex flex-row items-center justify-center text-white text-center text-[18px] font-bold">
{{ componentDataMap.buttonName }}
</view>
</view>

View File

@@ -13,7 +13,7 @@
<view class="long-text-guide-card__summary-text text-[#94a3b8] text-[14px] font-[500] line-clamp-2">
{{ item.summary }}
</view>
<view class="long-text-guide-card__summary-footer flex flex-items-center flex-justify-between">
<view class="long-text-guide-card__summary-footer flex items-center justify-between">
<text class="text-[#cbd5e1] text-[12px] font-bold">{{ item.footer }}</text>
<uni-icons type="right" size="16" color="#CBD5E1"></uni-icons>
</view>
@@ -21,8 +21,8 @@
</view>
<view v-else class="long-text-guide-card__detail-card bg-white rounded-[24px] overflow-hidden">
<view class="long-text-guide-card__detail-header flex flex-items-center border-bottom-F1F5F9">
<view class="long-text-guide-card__back flex flex-items-center flex-justify-center rounded-full font-bold"
<view class="long-text-guide-card__detail-header flex items-center border-bottom-F1F5F9">
<view class="long-text-guide-card__back flex items-center justify-center rounded-full font-bold"
@click="closeDetail">
<uni-icons type="left" size="16" color="#CBD5E1"></uni-icons>
</view>
@@ -84,8 +84,8 @@
{{ activeItem.action.tag }}
</view>
</view>
<view class="long-text-guide-card__map-bar flex flex-items-center bg-white">
<view class="flex-full">
<view class="long-text-guide-card__map-bar flex items-center bg-white">
<view class="flex-1">
<view class="text-[#1e293b] text-[15px] font-bold">{{ activeItem.action.title }}</view>
<view class="text-[#94a3b8] text-[12px] font-bold mt-[2px]">{{ activeItem.action.subtitle }}</view>
</view>
@@ -105,7 +105,7 @@
<image class="long-text-guide-card__photo-image w-full block" :src="activeItem.action.image"
mode="aspectFill" />
<view
class="long-text-guide-card__expand flex flex-items-center flex-justify-center rounded-full text-white text-[18px] font-bold">
class="long-text-guide-card__expand flex items-center justify-center rounded-full text-white text-[18px] font-bold">
</view>
</view>

View File

@@ -14,7 +14,7 @@
<view class="long-text-guide-card__summary-text text-[#94a3b8] text-[14px] font-[500] line-clamp-2">
{{ item.summary }}
</view>
<view class="long-text-guide-card__summary-footer flex flex-items-center flex-justify-between">
<view class="long-text-guide-card__summary-footer flex items-center justify-between">
<text class="text-[#cbd5e1] text-[12px] font-bold">{{ item.footer }}</text>
<uni-icons type="right" size="16" color="#CBD5E1"></uni-icons>
</view>

View File

@@ -2,14 +2,14 @@
<view class="map-navigation-card bg-white rounded-[24px] overflow-hidden w-full">
<view class="map-navigation-card__media">
<image class="map-navigation-card__image block w-full" :src="data.image" mode="aspectFill" />
<view class="map-navigation-card__badge flex flex-items-center text-white text-[12px] font-bold">
<view class="map-navigation-card__badge flex items-center text-white text-[12px] font-bold">
<text class="map-navigation-card__badge-icon">{{ badge.icon }}</text>
<text>{{ badge.text }}</text>
</view>
</view>
<view class="map-navigation-card__content flex flex-items-center">
<view class="map-navigation-card__info flex-full">
<view class="map-navigation-card__content flex items-center">
<view class="map-navigation-card__info flex-1">
<view class="map-navigation-card__title text-[#1e293b] text-[18px] font-bold truncate">
{{ data.title }}
</view>
@@ -18,7 +18,7 @@
</view>
</view>
<view
class="map-navigation-card__button flex flex-items-center flex-justify-center bg-[#0f172a] text-white text-[18px] font-bold"
class="map-navigation-card__button flex items-center justify-center bg-[#0f172a] text-white text-[18px] font-bold"
:class="{ 'is-disabled': disabled }" @click="handleAction">
<text class="map-navigation-card__button-icon">{{ action.icon }}</text>
<text>{{ action.text }}</text>

View File

@@ -1,16 +1,16 @@
<template>
<uni-popup ref="popup" type="bottom" :safe-area="false">
<view class="popup-content pt-[12px] pl-[12px] pr-[12px]">
<view class="header flex flex-items-center pb-[12px]">
<view class="title flex-full text-center text-[17px] text-[#000000] font-[500] ml-[24px]">更多服务</view>
<view class="header flex items-center pb-[12px]">
<view class="title flex-1 text-center text-[17px] text-[#000000] font-[500] ml-[24px]">更多服务</view>
<uni-icons type="close" size="24" color="#CACFD8" @click="close" />
</view>
<view class="list bg-white pl-[20px] pr-[20px]">
<view class="item border-bottom pt-[20px] pb-[20px]" v-for="(item, index) in list" :key="index">
<view class="flex flex-items-center flex-justify-center">
<view class="flex items-center justify-center">
<image v-if="item.icon" class="left" :src="item.icon" />
<view class="center flex-full">
<view class="center flex-1">
<view class="text-[16px] text-[#000000] leading-[24px] font-[500]">
{{ item.title }}
</view>

View File

@@ -7,7 +7,7 @@
<view class="notice-card__summary-content text-[#d97706] text-[14px] font-bold">
{{ summary.content }}
</view>
<view class="notice-card__summary-footer flex flex-items-center flex-justify-between">
<view class="notice-card__summary-footer flex items-center justify-between">
<view class="notice-card__summary-time text-[#d97706] text-[12px] font-bold">
{{ summary.publishTime }}
</view>
@@ -19,9 +19,8 @@
</view>
<view v-else class="notice-card__detail bg-white rounded-[24px] overflow-hidden w-full">
<view class="notice-card__detail-head flex flex-items-center">
<view class="notice-card__back flex flex-items-center flex-justify-center rounded-full flex-shrink-0"
@click="closeDetail">
<view class="notice-card__detail-head flex items-center">
<view class="notice-card__back flex items-center justify-center rounded-full shrink-0" @click="closeDetail">
<uni-icons type="left" size="16" color="#CBD5E1"></uni-icons>
</view>
<view class="notice-card__head-title text-[#1e293b] text-[18px] font-bold">
@@ -35,7 +34,7 @@
<view class="notice-card__detail-title text-[#1e293b] text-[20px] font-bold">
{{ detail.title }}
</view>
<view class="notice-card__time-pill flex flex-items-center bg-[#f8fafc] text-[#475569] text-[13px] font-bold">
<view class="notice-card__time-pill flex items-center bg-[#f8fafc] text-[#475569] text-[13px] font-bold">
<text class="notice-card__time-icon">{{ detail.timeIcon }}</text>
<text>{{ detail.publishTime }}</text>
</view>

View File

@@ -2,9 +2,9 @@
<view class="w-full bg-white border-ff overflow-hidden rounded-[20px] flex flex-col">
<!-- 占位撑开 -->
<view class="w-screen"></view>
<view class="flex flex-items-center flex-justify-between p-[12px] border-box" @click="openMap">
<view class="flex items-center justify-between p-[12px] border-box" @click="openMap">
<view class="rounded-[16px] p-[16px] bg-[#F0F8F3]">
<view class="w-[32px] h-32 rounded-full bg-white flex flex-items-center flex-justify-center">
<view class="w-[32px] h-32 rounded-full bg-white flex items-center justify-center">
<uni-icons type="location" size="16" color="#171717" />
</view>
</view>
@@ -12,7 +12,7 @@
<view class="font-color-900 text-[14px]">打开导览地图</view>
<view class="font-color-500 text-[12px] mt-[6px]">距你 {{ distance }} · 步行 {{ walk }}</view>
</view>
<view class="ml-[12px] flex flex-items-center flex-justify-center w-[32px] h-32 rounded-full bg-[#f2f5f8]">
<view class="ml-[12px] flex items-center justify-center w-[32px] h-32 rounded-full bg-[#f2f5f8]">
<uni-icons class="mb-[2px]" type="right" size="12" color="#99A0AE" />
</view>
</view>

View File

@@ -1,11 +1,11 @@
<template>
<view class="poi-compare-card w-full">
<view v-if="!isDetail" class="poi-compare-card__overview bg-white rounded-[24px] overflow-hidden">
<view class="poi-compare-card__head flex flex-items-center">
<view class="poi-compare-card__mark flex flex-items-center flex-justify-center rounded-full flex-shrink-0">
<view class="poi-compare-card__head flex items-center">
<view class="poi-compare-card__mark flex items-center justify-center rounded-full shrink-0">
{{ data.icon }}
</view>
<view class="poi-compare-card__title text-[#1e293b] text-[18px] font-bold truncate flex-full">
<view class="poi-compare-card__title text-[#1e293b] text-[18px] font-bold truncate flex-1">
{{ data.title }}
</view>
</view>
@@ -30,19 +30,19 @@
</view>
<view
class="poi-compare-card__primary flex flex-items-center flex-justify-center bg-[#0f172a] text-white text-[15px] font-bold"
class="poi-compare-card__primary flex items-center justify-center bg-[#0f172a] text-white text-[15px] font-bold"
:class="{ 'is-disabled': disabled }" @click="openDetail">
{{ data.detailButtonText }}
</view>
</view>
<view v-else class="poi-compare-card__detail-card bg-white rounded-[24px] overflow-hidden">
<view class="poi-compare-card__detail-head flex flex-items-center">
<view class="poi-compare-card__back flex flex-items-center flex-justify-center rounded-full flex-shrink-0"
<view class="poi-compare-card__detail-head flex items-center">
<view class="poi-compare-card__back flex items-center justify-center rounded-full shrink-0"
@click="closeDetail">
<uni-icons type="left" size="16" color="#CBD5E1"></uni-icons>
</view>
<view class="poi-compare-card__detail-title text-[#1e293b] text-[20px] font-bold flex-full">
<view class="poi-compare-card__detail-title text-[#1e293b] text-[20px] font-bold flex-1">
{{ detail.title }}
</view>
<view class="poi-compare-card__compare-label text-[#94a3b8] text-[12px] font-bold">
@@ -76,7 +76,7 @@
</view>
<view class="poi-compare-card__tips">
<view v-for="tip in detail.tips" :key="tip.text" class="poi-compare-card__tip flex gap-[10px]">
<view class="poi-compare-card__dot rounded-full flex-shrink-0" :class="getDotClass(tip.tone)" />
<view class="poi-compare-card__dot rounded-full shrink-0" :class="getDotClass(tip.tone)" />
<view class="poi-compare-card__tip-text text-[#334155] text-[14px] font-bold">
{{ tip.text }}
</view>
@@ -86,7 +86,7 @@
<view class="poi-compare-card__actions grid grid-cols-2 gap-14">
<view v-for="action in detail.actions" :key="action.id || action.text"
class="poi-compare-card__action flex flex-items-center flex-justify-center text-[15px] font-bold"
class="poi-compare-card__action flex items-center justify-center text-[15px] font-bold"
:class="[action.primary ? 'poi-compare-card__action--primary bg-[#0f172a] text-white' : 'poi-compare-card__action--secondary text-[#334155]', { 'is-disabled': disabled }]"
@click="handleAction(action)">
<text class="poi-compare-card__action-icon">{{ action.icon }}</text>

View File

@@ -2,7 +2,7 @@
<view class="poi-detail-card bg-white rounded-[24px] overflow-hidden">
<view class="poi-detail-card__hero relative">
<image class="poi-detail-card__image w-full h-full block rounded-[18px]" :src="data.image" mode="aspectFill" />
<view class="poi-detail-card__badge flex flex-items-center gap-[4px] text-[10px] font-bold">
<view class="poi-detail-card__badge flex items-center gap-[4px] text-[10px] font-bold">
<text class="poi-detail-card__badge-icon"></text>
<text>{{ data.badge?.text }}</text>
</view>
@@ -13,7 +13,7 @@
{{ data.title }}
</view>
<view class="poi-detail-card__tip flex flex-items-center gap-[10px]">
<view class="poi-detail-card__tip flex items-center gap-[10px]">
<view class="poi-detail-card__spark text-[#047857] text-[18px] font-bold"></view>
<view class="poi-detail-card__tip-text text-[#047857] text-[14px] font-bold">
{{ data.tip?.text }}
@@ -21,7 +21,7 @@
</view>
<view
class="poi-detail-card__button flex flex-items-center flex-justify-center gap-[8px] text-white bg-[#0f172a] text-[16px] font-bold"
class="poi-detail-card__button flex items-center justify-center gap-[8px] text-white bg-[#0f172a] text-[16px] font-bold"
:class="{ 'is-disabled': disabled }" @click="handleAction">
<text class="poi-detail-card__button-icon"></text>
<text>{{ data.action?.text }}</text>

View File

@@ -11,12 +11,12 @@
{{ item.title }}
</view>
<view
class="recommendation-list-card__distance flex flex-items-center gap-[4px] mt-[4px] text-[#94a3b8] text-[12px] font-bold">
class="recommendation-list-card__distance flex items-center gap-[4px] mt-[4px] text-[#94a3b8] text-[12px] font-bold">
<text class="recommendation-list-card__pin"></text>
<text>{{ item.distance }}</text>
</view>
<view
class="recommendation-list-card__button flex flex-items-center flex-justify-center mt-[12px] text-[#334155] text-[12px] font-bold"
class="recommendation-list-card__button flex items-center justify-center mt-[12px] text-[#334155] text-[12px] font-bold"
@click.stop="handleSelect(item)">
{{ getActionText(item) }}
</view>

View File

@@ -1,32 +1,31 @@
<template>
<view class="route-plan-card w-full">
<view v-if="!detailOpen"
class="route-plan-card__summary flex flex-items-center bg-white rounded-[24px] overflow-hidden w-full"
class="route-plan-card__summary flex items-center bg-white rounded-[24px] overflow-hidden w-full"
:class="{ 'is-disabled': disabled }" @click="openDetail">
<image class="route-plan-card__cover block flex-shrink-0" :src="data.image" mode="aspectFill" />
<view class="route-plan-card__body flex-full">
<image class="route-plan-card__cover block shrink-0" :src="data.image" mode="aspectFill" />
<view class="route-plan-card__body flex-1">
<view class="route-plan-card__title text-[#1e293b] text-[18px] font-bold truncate">
{{ data.title }}
</view>
<view class="route-plan-card__tags flex flex-items-center">
<view class="route-plan-card__tags flex items-center">
<view v-for="tag in summaryTags" :key="tag.id || tag.text" class="route-plan-card__tag text-[12px] font-bold"
:class="getTagClass(tag.tone)">
{{ tag.text }}
</view>
</view>
</view>
<view class="flex-shrink-0">
<view class="shrink-0">
<uni-icons type="right" size="16" color="#CBD5E1"></uni-icons>
</view>
</view>
<view v-else class="route-plan-card__detail bg-white rounded-[24px] overflow-hidden w-full">
<view class="route-plan-card__detail-head flex flex-items-center">
<view class="route-plan-card__back flex flex-items-center flex-justify-center rounded-full flex-shrink-0"
@click="closeDetail">
<view class="route-plan-card__detail-head flex items-center">
<view class="route-plan-card__back flex items-center justify-center rounded-full shrink-0" @click="closeDetail">
<uni-icons type="left" size="16" color="#CBD5E1"></uni-icons>
</view>
<view class="route-plan-card__detail-title text-[#1e293b] text-[18px] font-bold truncate flex-full">
<view class="route-plan-card__detail-title text-[#1e293b] text-[18px] font-bold truncate flex-1">
{{ data.title }}
</view>
<view class="route-plan-card__detail-badge text-[#047857] bg-[#ecfdf5] text-[12px] font-bold">
@@ -38,12 +37,12 @@
<template v-for="(node, index) in nodes" :key="node.id || node.title">
<view class="route-plan-card__node-wrap" :class="{ 'is-disabled': disabled }" @click="handleSelect(node)">
<view
class="route-plan-card__node-number flex flex-items-center flex-justify-center rounded-full text-[#047857] bg-[#ecfdf5] text-[12px] font-bold">
class="route-plan-card__node-number flex items-center justify-center rounded-full text-[#047857] bg-[#ecfdf5] text-[12px] font-bold">
{{ index + 1 }}
</view>
<view class="route-plan-card__node bg-white rounded-[20px] flex flex-items-center">
<image class="route-plan-card__node-image block flex-shrink-0" :src="node.image" mode="aspectFill" />
<view class="route-plan-card__node-body flex-full">
<view class="route-plan-card__node bg-white rounded-[20px] flex items-center">
<image class="route-plan-card__node-image block shrink-0" :src="node.image" mode="aspectFill" />
<view class="route-plan-card__node-body flex-1">
<view class="route-plan-card__node-title text-[#1e293b] text-[16px] font-bold truncate">
{{ node.title }}
</view>
@@ -62,7 +61,7 @@
<view class="route-plan-card__connector-line"></view>
<view class="route-plan-card__connector-arrow"></view>
<view
class="route-plan-card__connector-chip flex flex-items-center bg-[#f8fafc] rounded-full text-[#64748b] text-[12px] font-bold">
class="route-plan-card__connector-chip flex items-center bg-[#f8fafc] rounded-full text-[#64748b] text-[12px] font-bold">
<text class="route-plan-card__connector-icon">{{ connectors[index].icon }}</text>
<text>{{ connectors[index].text }}</text>
</view>
@@ -75,8 +74,8 @@
{{ detail.tipsTitle }}
</view>
<view v-for="tip in tips" :key="tip"
class="route-plan-card__tip flex flex-items-center text-[#334155] text-[13px] font-bold">
<view class="route-plan-card__tip-dot rounded-full flex-shrink-0"></view>
class="route-plan-card__tip flex items-center text-[#334155] text-[13px] font-bold">
<view class="route-plan-card__tip-dot rounded-full shrink-0"></view>
<view>{{ tip }}</view>
</view>
</view>

View File

@@ -4,7 +4,7 @@
<image class="scenic-image-card__image block w-full" :src="data.image" mode="aspectFill" />
<view
class="scenic-image-card__expand flex flex-items-center flex-justify-center rounded-full text-white text-[18px] font-bold"
class="scenic-image-card__expand flex items-center justify-center rounded-full text-white text-[18px] font-bold"
@click.stop="handleAction">
{{ action.icon }}
</view>

View File

@@ -1,12 +1,12 @@
<template>
<view class="visual-action-row flex flex-items-center gap-[12px] p-[12px] bg-white rounded-[18px] border-box"
<view class="visual-action-row flex items-center gap-[12px] p-[12px] bg-white rounded-[18px] border-box"
:class="{ 'is-disabled': disabled }" @click="handleClick">
<view
class="visual-action-row__icon flex flex-items-center flex-justify-center w-[42px] h-42 rounded-[14px] text-[18px] font-bold"
class="visual-action-row__icon flex items-center justify-center w-[42px] h-42 rounded-[14px] text-[18px] font-bold"
:class="toneClass">
<slot name="icon">{{ icon }}</slot>
</view>
<view class="visual-action-row__body flex-full">
<view class="visual-action-row__body flex-1">
<view class="visual-action-row__title text-[#1e293b] text-[14px] font-bold truncate">{{ title }}</view>
<view v-if="subtitle" class="visual-action-row__subtitle truncate">
{{ subtitle }}

View File

@@ -1,6 +1,5 @@
<template>
<view
class="visual-badge flex flex-items-center flex-justify-center rounded-[50px] text-[10px] font-bold whitespace-nowrap"
<view class="visual-badge flex items-center justify-center rounded-[50px] text-[10px] font-bold whitespace-nowrap"
:class="toneClass">
<slot>{{ label }}</slot>
</view>

View File

@@ -1,11 +1,11 @@
<template>
<CardShell variant="detail">
<view class="visual-detail__header flex flex-items-center px-[16px] border-bottom-F1F5F9">
<view class="visual-detail__header flex items-center px-[16px] border-bottom-F1F5F9">
<view class="visual-detail__back mr-[8px] rounded-full bg-[#f8fafc] text-[#334155] font-bold text-center"
@click="$emit('back')">
<uni-icons type="left" size="16" color="#CBD5E1"></uni-icons>
</view>
<view class="visual-detail__title flex-full text-[#1e293b] text-[14px] font-bold truncate">{{ title }}</view>
<view class="visual-detail__title flex-1 text-[#1e293b] text-[14px] font-bold truncate">{{ title }}</view>
<BadgePill v-if="tag" :label="tag" :tone="tone" />
</view>
<slot />

View File

@@ -5,10 +5,10 @@
<view class="card-item bg-white inline-block rounded-[20px] mr-[10px]" v-for="(item, index) in list" :key="index"
@click="sendReply(item)">
<view class="flex flex-row flex-justify-start p-[10px]">
<image class="card-img flex-shrink-0 rounded-[14px]" :src="createSvgIndex(index)" />
<view class="flex flex-row justify-start p-[10px]">
<image class="card-img shrink-0 rounded-[14px]" :src="createSvgIndex(index)" />
<view class=" flex flex-col flex-full pl-[8px] py-[4px]">
<view class=" flex flex-col flex-1 pl-[8px] py-[4px]">
<view class="w-full text-[12px] font-[600] text-[#171717] truncate">
{{ item.title }}
</view>

View File

@@ -5,7 +5,7 @@
<view class="flex flex-items-start flex-col" :class="{
'border-bottom': index < goodsData.commodityEquipment.length - 1,
}">
<view class="flex flex-items-center flex-row flex-shrink-0">
<view class="flex items-center flex-row shrink-0">
<uni-icons fontFamily="znicons" size="20" color="#171717">
{{ zniconsMap[moduleItem.icon] }}
</uni-icons>

View File

@@ -35,11 +35,11 @@
<!-- 立即抢购 -->
<view class="footer border-top">
<view class="amt text-[20px] font-bold text-[#ff3d60] line-height-28 flex flex-items-center mr-[8px]">
<view class="amt text-[20px] font-bold text-[#ff3d60] line-height-28 flex items-center mr-[8px]">
{{ calculatedTotalPrice }}
</view>
<view class="btn rounded-[10px] flex flex-items-center ml-auto pl-[8px]" @click="navigateToPay(goodsData)">
<view class="btn rounded-[10px] flex items-center ml-auto pl-[8px]" @click="navigateToPay(goodsData)">
<image class="icon" src="https://oss.nianxx.cn/mp/static/version_101/common/btn.png" />
<text class="text-[16px] font-[500] text-white">立即预定</text>
</view>

View File

@@ -14,7 +14,7 @@
</view>
<!-- 协议勾选 -->
<view class="login-agreement flex flex-items-center">
<view class="login-agreement flex items-center">
<CheckBox v-model="isAgree">
<text class="text-[12px] text-[#525866]">我已阅读并同意</text>
<text class="text-[12px] text-[#0CCD58] ml-[4px] mr-[4px]"