refactor: replace border-box with box-border and clean up unused scss
Remove the unused box-sizing.scss stylesheet and its import from the main SCSS index file. Update all Vue component template class references from the custom border-box class to the native box-border utility class to eliminate redundant custom CSS and align with the project's utility class conventions.
This commit is contained in:
@@ -1,5 +1,5 @@
|
||||
<template>
|
||||
<view class="w-full border-box flex flex-col overflow-hidden pl-[12px] mt-6 mb-6">
|
||||
<view class="w-full box-border flex flex-col overflow-hidden pl-[12px] mt-6 mb-6">
|
||||
<text class="font-size-14 color-333">{{ text }}</text>
|
||||
<slot></slot>
|
||||
</view>
|
||||
|
||||
@@ -9,7 +9,7 @@
|
||||
<scroll-view class="flex-full 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] border-box gap-10">
|
||||
<view class="flex flex-col pt-[12px] px-[16px] pb-[24px] box-border gap-10">
|
||||
<template v-if="hasStructuredLongTextData">
|
||||
<view v-if="headerSections.title || headerSections.tag" class="long-answer-header">
|
||||
<view v-if="headerSections.title" class="long-answer-title">
|
||||
|
||||
@@ -1,15 +1,8 @@
|
||||
<template>
|
||||
<view class="more-tips bg-white border-box">
|
||||
<view class="font-size-0 whitespace-nowrap scroll-x">
|
||||
<view
|
||||
class="more-tips-item border-box inline-block mr-8"
|
||||
v-for="(item, index) in guideWords"
|
||||
:key="index"
|
||||
>
|
||||
<text
|
||||
:class="['font-500 font-size-12 text-center', `color-${index}`]"
|
||||
@click="sendReply(item)"
|
||||
>
|
||||
<view class="more-tips-item box-border inline-block mr-8" v-for="(item, index) in guideWords" :key="index">
|
||||
<text :class="['font-500 font-size-12 text-center', `color-${index}`]" @click="sendReply(item)">
|
||||
{{ item }}
|
||||
</text>
|
||||
</view>
|
||||
|
||||
@@ -1,7 +1,7 @@
|
||||
<template>
|
||||
<view>
|
||||
<view class="quick-access flex flex-row ml-[12px] pt-[8px] pb-[8px] scroll-x whitespace-nowrap">
|
||||
<view class="item border-box rounded-50 flex flex-row items-center" v-for="(item, index) in itemList" :key="index"
|
||||
<view class="item box-border rounded-50 flex flex-row items-center" v-for="(item, index) in itemList" :key="index"
|
||||
@click="sendReply(item)">
|
||||
<view class="flex items-center justify-center">
|
||||
<image v-if="item.icon" class="icon" :src="item.icon" />
|
||||
|
||||
@@ -1,8 +1,8 @@
|
||||
v
|
||||
<template>
|
||||
<view class="welcome-content border-box p-[12px]">
|
||||
<view class="welcome-content box-border p-[12px]">
|
||||
<view class="wrap rounded-20">
|
||||
<view class="flex flex-items-center flex-justify-between border-box pl-[12px] pr-[12px]">
|
||||
<view class="flex flex-items-center flex-justify-between box-border 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" />
|
||||
|
||||
@@ -7,7 +7,7 @@
|
||||
|
||||
<!-- ✅ 滚动区域 -->
|
||||
<scroll-view class="flex-full overflow-hidden" scroll-y>
|
||||
<view class="pb-[24px] border-box overflow-hidden">
|
||||
<view class="pb-[24px] box-border 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">
|
||||
|
||||
@@ -1,28 +1,27 @@
|
||||
<template>
|
||||
<view class="w-full bg-white border-box border-ff overflow-hidden rounded-20 flex flex-col">
|
||||
<!-- 占位撑开 -->
|
||||
<view class="w-vw"></view>
|
||||
|
||||
<view class="aigc-photo-card relative rounded-24 overflow-hidden w-full"
|
||||
<view class="w-full bg-white box-border border-ff overflow-hidden rounded-20 flex flex-col">
|
||||
<!-- 占位撑开 -->
|
||||
<view class="w-vw"></view>
|
||||
|
||||
<view class="aigc-photo-card relative rounded-24 overflow-hidden w-full"
|
||||
:class="{ 'is-disabled': disabled, 'is-empty': !videoUrl }" @click="handleAction">
|
||||
<video v-if="videoUrl" :id="videoId" class="aigc-photo-card__video block w-full" :src="videoUrl" :poster="poster"
|
||||
:controls="!disabled" :show-center-play-btn="!disabled" :show-play-btn="!disabled"
|
||||
:show-fullscreen-btn="!disabled" :enable-progress-gesture="!disabled"
|
||||
:direction="fullscreenDirection" object-fit="cover" @click.stop @play="handlePlay"
|
||||
@fullscreenchange="handleFullScreenChange" @error="handleError" />
|
||||
<view
|
||||
v-if="videoUrl && !disabled"
|
||||
:show-fullscreen-btn="!disabled" :enable-progress-gesture="!disabled" :direction="fullscreenDirection"
|
||||
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 color-white font-size-12"
|
||||
@click.stop="requestFullScreen"
|
||||
>
|
||||
@click.stop="requestFullScreen">
|
||||
全屏
|
||||
</view>
|
||||
<view v-if="!videoUrl" class="aigc-photo-card__empty flex flex-items-center flex-justify-center color-white font-size-14">
|
||||
<view v-if="!videoUrl"
|
||||
class="aigc-photo-card__empty flex flex-items-center flex-justify-center color-white font-size-14">
|
||||
视频地址为空
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
|
||||
@@ -1,5 +1,5 @@
|
||||
<template>
|
||||
<view v-if="shouldRenderCard" class="w-full bg-white border-box border-ff overflow-hidden rounded-20 flex flex-col">
|
||||
<view v-if="shouldRenderCard" class="w-full bg-white box-border border-ff overflow-hidden rounded-20 flex flex-col">
|
||||
<!-- 占位撑开 -->
|
||||
<view class="w-vw"></view>
|
||||
<view class="flex flex-col px-[16px] pt-[16px] pb-[12px] border-box" @click="lookDetailAction">
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
<template>
|
||||
<uni-popup ref="popup" type="center" :safe-area="false">
|
||||
<view class="popup-content bg-white border-box mx-24 px-[12px] py-16 rounded-12">
|
||||
<view class="popup-content bg-white box-border mx-24 px-[12px] py-16 rounded-12">
|
||||
<view class="header flex flex-items-center pb-[12px]">
|
||||
<view class="title flex-full text-center font-size-17 color-000 font-500 ml-[24px]">呼叫热线</view>
|
||||
<uni-icons type="close" size="24" color="#CACFD8" @click="close" />
|
||||
|
||||
@@ -1,9 +1,9 @@
|
||||
<template>
|
||||
<view class="container w-full border-box border-ff overflow-hidden rounded-24 flex flex-col">
|
||||
<view class="container w-full box-border border-ff overflow-hidden rounded-24 flex flex-col">
|
||||
<!-- 占位撑开 -->
|
||||
<view class="w-vw"></view>
|
||||
<view class="content flex flex-col m-4 border-box rounded-24">
|
||||
<view class="flex flex-col p-[6px] border-box flex-items-center justify-center">
|
||||
<view class="content flex flex-col m-4 box-border rounded-24">
|
||||
<view class="flex flex-col p-[6px] box-border flex-items-center justify-center">
|
||||
<image class="w-full rounded-20" :src="componentDataMap.background" mode="widthFix" />
|
||||
|
||||
<!-- 左上角标签 -->
|
||||
@@ -18,10 +18,10 @@
|
||||
{{ componentDataMap.description }}
|
||||
</text>
|
||||
|
||||
<view class="w-full border-box px-[12px] pb-[8px] flex flex-row" @click="jumpClick">
|
||||
<view class="btn-bg w-full border-box p-[4px] rounded-24 flex flex-row">
|
||||
<view class="w-full box-border px-[12px] pb-[8px] flex flex-row" @click="jumpClick">
|
||||
<view class="btn-bg w-full box-border p-[4px] rounded-24 flex flex-row">
|
||||
<view
|
||||
class="btn-bg-sub w-full border-box p-[16px] rounded-20 flex flex-row flex-items-center flex-justify-center color-white text-center font-size-18 font-800">
|
||||
class="btn-bg-sub w-full box-border p-[16px] rounded-20 flex flex-row flex-items-center flex-justify-center color-white text-center font-size-18 font-800">
|
||||
{{ componentDataMap.buttonName }}
|
||||
</view>
|
||||
</view>
|
||||
|
||||
@@ -20,7 +20,7 @@
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view v-else class="long-text-guide-card__detail-card bg-white rounded-24 border-box overflow-hidden">
|
||||
<view v-else class="long-text-guide-card__detail-card bg-white rounded-24 box-border 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-700"
|
||||
@click="closeDetail">
|
||||
|
||||
@@ -1,5 +1,5 @@
|
||||
<template>
|
||||
<view class="w-full bg-white border-box border-ff overflow-hidden rounded-20 flex flex-col">
|
||||
<view class="w-full bg-white box-border border-ff overflow-hidden rounded-20 flex flex-col">
|
||||
<!-- 占位撑开 -->
|
||||
<view class="w-vw"></view>
|
||||
<view class="flex flex-col px-[16px] pt-[16px] pb-[12px] border-box" @click="openDetail(item)">
|
||||
|
||||
@@ -1,13 +1,13 @@
|
||||
<template>
|
||||
<uni-popup ref="popup" type="bottom" :safe-area="false">
|
||||
<view class="popup-content border-box pt-[12px] pl-[12px] pr-[12px]">
|
||||
<view class="popup-content box-border pt-[12px] pl-[12px] pr-[12px]">
|
||||
<view class="header flex flex-items-center pb-[12px]">
|
||||
<view class="title flex-full text-center font-size-17 color-000 font-500 ml-[24px]">更多服务</view>
|
||||
<uni-icons type="close" size="24" color="#CACFD8" @click="close" />
|
||||
</view>
|
||||
|
||||
<view class="list bg-white border-box pl-[20px] pr-[20px]">
|
||||
<view class="item border-box border-bottom pt-[20px] pb-[20px]" v-for="(item, index) in list" :key="index">
|
||||
<view class="list bg-white box-border pl-[20px] pr-[20px]">
|
||||
<view class="item box-border border-bottom pt-[20px] pb-[20px]" v-for="(item, index) in list" :key="index">
|
||||
<view class="flex flex-items-center flex-justify-center">
|
||||
<image v-if="item.icon" class="left" :src="item.icon" />
|
||||
<view class="center flex-full">
|
||||
@@ -18,7 +18,7 @@
|
||||
{{ item.content }}
|
||||
</view>
|
||||
</view>
|
||||
<view class="right border-box font-size-12 color-white line-height-16" @click="handleClick(item)">
|
||||
<view class="right box-border font-size-12 color-white line-height-16" @click="handleClick(item)">
|
||||
{{ item.btnText }}
|
||||
</view>
|
||||
</view>
|
||||
|
||||
@@ -1,5 +1,5 @@
|
||||
<template>
|
||||
<view class="w-full bg-white border-box border-ff overflow-hidden rounded-20 flex flex-col">
|
||||
<view class="w-full bg-white box-border border-ff overflow-hidden rounded-20 flex flex-col">
|
||||
<!-- 占位撑开 -->
|
||||
<view class="w-vw"></view>
|
||||
<view class="flex flex-items-center flex-justify-between p-[12px] border-box" @click="openMap">
|
||||
|
||||
@@ -1,5 +1,5 @@
|
||||
<template>
|
||||
<view class="poi-detail-card bg-white rounded-24 border-box overflow-hidden">
|
||||
<view class="poi-detail-card bg-white rounded-24 box-border overflow-hidden">
|
||||
<view class="poi-detail-card__hero relative">
|
||||
<image class="poi-detail-card__image w-full h-full block rounded-18" :src="data.image" mode="aspectFill" />
|
||||
<view class="poi-detail-card__badge flex flex-items-center gap-4 font-size-10 font-900">
|
||||
|
||||
@@ -1,9 +1,6 @@
|
||||
<template>
|
||||
<view
|
||||
class="visual-card-shell w-full bg-white border-F1F5F9 rounded-24 border-box overflow-hidden"
|
||||
:class="[{ 'is-pressable': pressable, 'is-disabled': disabled }, variantClass]"
|
||||
@click="handleClick"
|
||||
>
|
||||
<view class="visual-card-shell w-full bg-white border-F1F5F9 rounded-24 box-border overflow-hidden"
|
||||
:class="[{ 'is-pressable': pressable, 'is-disabled': disabled }, variantClass]" @click="handleClick">
|
||||
<slot />
|
||||
</view>
|
||||
</template>
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
<template>
|
||||
<CardShell variant="detail">
|
||||
<view class="visual-detail__header flex flex-items-center px-[16px] border-box border-bottom-F1F5F9">
|
||||
<view class="visual-detail__header flex flex-items-center px-[16px] box-border border-bottom-F1F5F9">
|
||||
<view class="visual-detail__back mr-8 rounded-full bg-[#f8fafc] color-334155 font-900 text-center"
|
||||
@click="$emit('back')">
|
||||
<uni-icons type="left" size="16" color="#CBD5E1"></uni-icons>
|
||||
|
||||
@@ -1,9 +1,9 @@
|
||||
<template>
|
||||
<view class="container w-full border-box border-ff overflow-hidden rounded-24 flex flex-col">
|
||||
<view class="container w-full box-border border-ff overflow-hidden rounded-24 flex flex-col">
|
||||
<!-- 占位撑开 -->
|
||||
<view class="w-vw"></view>
|
||||
<view class="flex flex-col m-4 border-box rounded-24">
|
||||
<slot name="content"></slot>
|
||||
<view class="flex flex-col m-4 box-border rounded-24">
|
||||
<slot name="content"></slot>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
@@ -12,10 +12,8 @@
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
|
||||
.container {
|
||||
background: rgba(255, 255, 255, 0.2);
|
||||
box-shadow: 0px 9px 34px 0px rgba(27, 9, 91, 0.07);
|
||||
}
|
||||
|
||||
</style>
|
||||
@@ -8,7 +8,7 @@
|
||||
<view class="flex flex-row flex-justify-start p-[10px]">
|
||||
<image class="card-img flex-shrink-0 rounded-14" :src="createSvgIndex(index)" />
|
||||
|
||||
<view class="min-width-0 flex flex-col flex-full border-box pl-[8px] py-[4px]">
|
||||
<view class="min-width-0 flex flex-col flex-full box-border pl-[8px] py-[4px]">
|
||||
<view class="w-full font-size-12 font-600 color-171717 ellipsis-1">
|
||||
{{ item.title }}
|
||||
</view>
|
||||
|
||||
@@ -1,5 +1,5 @@
|
||||
<template>
|
||||
<view class="good-info border-box pl-[12px] pr-[12px]">
|
||||
<view class="good-info box-border pl-[12px] pr-[12px]">
|
||||
<!-- 标题区域 -->
|
||||
<view class="title-section">
|
||||
<text class="title">
|
||||
|
||||
@@ -39,7 +39,7 @@
|
||||
{{ calculatedTotalPrice }}
|
||||
</view>
|
||||
|
||||
<view class="btn border-box rounded-10 flex flex-items-center ml-auto pl-[8px]" @click="navigateToPay(goodsData)">
|
||||
<view class="btn box-border rounded-10 flex 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="font-size-16 font-500 color-white">立即预定</text>
|
||||
</view>
|
||||
|
||||
Reference in New Issue
Block a user