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

refactor: convert legacy color classes to tailwind syntax

Browse Source 
Replace all custom `bg-*` utility classes across Vue components with Tailwind's arbitrary hex color notation (e.g. `bg-[#f7f7f7]`). Remove redundant hardcoded background color definitions from src/static/scss/background.scss, clean up template formatting, and update gradient button styles to use direct hex values.
This commit is contained in:
duanshuwen
2026-07-24 15:56:35 +08:00
parent d3d15b1a19
commit aa0203819c
27 changed files with 225 additions and 527 deletions
Download Patch File Download Diff File Expand all files Collapse all files

41
src/pages-order/order/components/OrderQrcode/index.vue
View File

@@ -1,12 +1,6 @@
<template>
<uni-popup
ref="popupRef"
type="bottom"
:safe-area="false"
@maskClick="handleClose"
@change="handlePopupChange"
>
<view class="refund-popup bg-F5F7FA border-box">
<uni-popup ref="popupRef" type="bottom" :safe-area="false" @maskClick="handleClose" @change="handlePopupChange">
<view class="refund-popup bg-[#f5f7fa] border-box">
<view class="border-box flex flex-items-center justify-between pt-12 pb-12 relative">
<view class="flex flex-col flex-items-center flex-full ">
<view class="flex-full font-size-16 text-color-900 text-center">核销凭证</view>
@@ -19,47 +13,54 @@
<view class="bg-white border-box rounded-12 flex flex-col flex-items-center flex-justify-center p-12 mb-12 mx-12">
<view class="flex w-full flex-row flex-items-center flex-justify-between py-4">
<view >
<view>
<view class="font-size-16 font-500 color-000 line-height-24 ellipsis-1">
{{ selectedVoucher.name }}
</view>
</view>
<view v-if="selectedVoucher" class="flex flex-row">
<view class="bg-F5F7FA text-color-600 font-size-12 p-4 rounded-4 mr-4">总计{{ selectedVoucher.count }}{{ selectedVoucher.unit }}
<view class="bg-[#f5f7fa] text-color-600 font-size-12 p-4 rounded-4 mr-4">总计{{ selectedVoucher.count }}{{
selectedVoucher.unit }}
</view>
<view class="bg-theme-color-50 theme-color-500 font-size-12 p-4 rounded-4">剩{{ selectedVoucher.count - selectedVoucher.writeOffCount }}{{ selectedVoucher.unit }}可用</view>
<view class="bg-theme-color-50 theme-color-500 font-size-12 p-4 rounded-4">剩{{ selectedVoucher.count -
selectedVoucher.writeOffCount }}{{ selectedVoucher.unit }}可用</view>
</view>
</view>
<view class="flex flex-col w-full flex-items-center flex-justify-center border-box rounded-8 border pt-16 pb-32 mt-12">
<view
class="flex flex-col w-full flex-items-center flex-justify-center border-box rounded-8 border pt-16 pb-32 mt-12">
<view class="flex flex-row flex-justify-between border-box w-full px-12">
<view class="bg-theme-color-50 theme-color-500 font-size-14 px-12 line-height-24 rounded-12">凭证{{ selectedVoucherList.length > 1 ? currentVoucherIndex + 1 : '' }}</view>
<view class="text-color-500 font-size-14 px-12 line-height-24 rounded-12">此码仅可核销{{ selectedVoucher.count - selectedVoucher.writeOffCount }}份</view>
<view class="bg-theme-color-50 theme-color-500 font-size-14 px-12 line-height-24 rounded-12">凭证{{
selectedVoucherList.length > 1 ? currentVoucherIndex + 1 : '' }}</view>
<view class="text-color-500 font-size-14 px-12 line-height-24 rounded-12">此码仅可核销{{ selectedVoucher.count -
selectedVoucher.writeOffCount }}份</view>
</view>
<view class="flex flex-items-center flex-justify-center mt-20 p-20 rounded-12 border borderColor"
<view class="flex flex-items-center flex-justify-center mt-20 p-20 rounded-12 border borderColor"
:style="{ borderColor: selectedVoucher?.color }">
<Qrcode v-if="showQrcode" :size="props.size" :unit="props.unit" :val="qrcodeVal" :loadMake="true"
:onval="true" />
</view>
<view v-if="false" class="mt-20 bg-theme-color-50 theme-color-500 font-size-14 px-12 line-height-24 rounded-12">
{{ selectedVoucher.name }}
<view v-if="false"
class="mt-20 bg-theme-color-50 theme-color-500 font-size-14 px-12 line-height-24 rounded-12">
{{ selectedVoucher.name }}
</view>
</view>
<view v-if="selectedVoucherList.length > 1" class="flex flex-row w-full flex-items-center flex-justify-between mt-16 mb-24">
<view v-if="selectedVoucherList.length > 1"
class="flex flex-row w-full flex-items-center flex-justify-between mt-16 mb-24">
<view class="actions-btn" @click.stop="upAction">
<uni-icons type="left" size="16" color="#171717" />
</view>
<view class="flex flex-col">
<view class="flex flex-row flex-justify-center flex-items-center">
<view class="flex flex-row flex-justify-center flex-items-center">
<view class="theme-color-500 font-size-16">{{ currentVoucherIndex + 1 }}</view>
<view class="text-color-600 font-size-12">/{{ selectedVoucherList.length }}</view>
</view>
<view class="text-color-600 font-size-14">扫码后点击下一张</view>
</view>