style: migrate font-size classes to text-[size] syntax
Additionally update spacing utilities and refactor the OrderQrcode component: - Switch popup implementation from uni-popup to van-popup - Remove the deprecated SCSS stylesheet - Clean up component template and script code
This commit is contained in:
@@ -9,23 +9,23 @@
|
||||
</div>
|
||||
|
||||
<div v-if="!isCallSuccess" class="border-box p-12">
|
||||
<div class="bg-F5F7FA border-box flex flex-items-center p-12 rounded-10 font-size-14 color-171717 mb-12">
|
||||
<div class="bg-F5F7FA border-box flex flex-items-center p-12 rounded-10 text-[14px] color-171717 mb-12">
|
||||
<span class="font-500 line-height-22 mr-20">所在位置</span>
|
||||
<input placeholder="请填写所在位置" v-model="roomId" />
|
||||
</div>
|
||||
|
||||
<div class="bg-F5F7FA border-box flex flex-items-center p-12 rounded-10 font-size-14 color-171717 mb-12">
|
||||
<div class="bg-F5F7FA border-box flex flex-items-center p-12 rounded-10 text-[14px] color-171717 mb-12">
|
||||
<span class="font-500 line-height-22 mr-20">联系电话</span>
|
||||
<input placeholder="请填写联系电话" v-model="contactPhone" @input="handleContactPhoneInput" />
|
||||
</div>
|
||||
|
||||
<div class="bg-F5F7FA border-box p-12 rounded-10 font-size-14 font-500 color-171717 mb-12">
|
||||
<div class="bg-F5F7FA border-box p-12 rounded-10 text-[14px] font-500 color-171717 mb-12">
|
||||
<div class="font-500 line-height-22 mb-12">需求信息描述</div>
|
||||
<textarea class="h-80" placeholder="请输入需求信息描述" placeholder-class="font-size-14 font-400" maxlength="100"
|
||||
<textarea class="h-80" placeholder="请输入需求信息描述" placeholder-class="text-[14px] font-400" maxlength="100"
|
||||
v-model="contactText" />
|
||||
</div>
|
||||
|
||||
<div class="bg-F5F7FA border-box p-12 rounded-10 font-size-14 font-500 color-171717 mb-12">
|
||||
<div class="bg-F5F7FA border-box p-12 rounded-10 text-[14px] font-500 color-171717 mb-12">
|
||||
<div class="font-500 line-height-22 mb-12">照片上传</div>
|
||||
|
||||
<div class="w-80 h-80 bg-white rounded-8 overflow-hidden flex flex-items-center flex-justify-center">
|
||||
@@ -45,13 +45,13 @@
|
||||
|
||||
<div v-else class="border-box card-content flex flex-items-center p-12">
|
||||
<div class="border-box left flex-full pr-20">
|
||||
<div class="font-size-12 color-525866 line-height-20 mb-4">
|
||||
<div class="text-[12px] color-525866 line-height-20 mb-4">
|
||||
所在位置:{{ roomId }}
|
||||
</div>
|
||||
<div class="font-size-12 color-525866 line-height-20 mb-4">
|
||||
<div class="text-[12px] color-525866 line-height-20 mb-4">
|
||||
联系方式: {{ contactPhone }}
|
||||
</div>
|
||||
<div class="font-size-12 color-525866 line-height-20 ellipsis-2">
|
||||
<div class="text-[12px] color-525866 line-height-20 ellipsis-2">
|
||||
需求描述: {{ contactspan }}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -1,7 +1,7 @@
|
||||
<template>
|
||||
<div class="empty-container flex flex-col items-center justify-center">
|
||||
<img class="empty-image" :src="emptyIcon" mode="aspectFit" />
|
||||
<span class="font-size-12 text-center color-99A0AE mt-8">
|
||||
<span class="text-[12px] text-center color-99A0AE mt-8">
|
||||
{{ statusText }}
|
||||
</span>
|
||||
</div>
|
||||
|
||||
@@ -1,19 +1,19 @@
|
||||
<template>
|
||||
<div class="border-box flex flex-items-center flex-justify-between mb-12">
|
||||
<div class="left flex flex-items-center">
|
||||
<span class="font-size-12 color-99A0AE mr-4">入住</span>
|
||||
<span class="font-size-12 color-171717 mr-16">
|
||||
<span class="text-[12px] color-99A0AE mr-4">入住</span>
|
||||
<span class="text-[12px] color-171717 mr-16">
|
||||
{{ selectedDate.startDate }}
|
||||
</span>
|
||||
<span class="total border-box rounded-50 flex flex-items-center font-size-11 color-43669A relative">{{
|
||||
selectedDate.totalDays }}晚</span>
|
||||
<span class="font-size-12 color-99A0AE ml-16">离店</span>
|
||||
<span class="font-size-12 color-171717 ml-4">
|
||||
<span class="text-[12px] color-99A0AE ml-16">离店</span>
|
||||
<span class="text-[12px] color-171717 ml-4">
|
||||
{{ selectedDate.endDate }}
|
||||
</span>
|
||||
</div>
|
||||
<div class="flex flex-items-center" v-if="showBtn" @click="emit('click')">
|
||||
<span class="font-size-12 theme-color-500 line-height-16">房间详情</span>
|
||||
<span class="text-[12px] theme-color-500 line-height-16">房间详情</span>
|
||||
<van-icon name="arrow-right" size="15" color="#99A0AE" />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -12,11 +12,11 @@
|
||||
<div class="rounded-12 bg-white ml-12 mr-12 mb-40">
|
||||
<div class="border-box border-bottom flex flex-items-center flex-justify-between pt-12 pb-12 ml-12 mr-12">
|
||||
<span class="font-size-16 font-500 color-171717">在线支付</span>
|
||||
<span class="font-size-14 color-171717">239</span>
|
||||
<span class="text-[14px] color-171717">239</span>
|
||||
</div>
|
||||
<div class="border-box flex flex-items-center flex-justify-between pt-12 pb-12 ml-12 mr-12">
|
||||
<span class="font-size-16 font-500 color-171717">房费</span>
|
||||
<span class="font-size-14 color-171717">239</span>
|
||||
<span class="text-[14px] color-171717">239</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -9,13 +9,13 @@
|
||||
</div>
|
||||
|
||||
<div v-if="!isCallSuccess" class="border-box p-12">
|
||||
<div class="bg-F5F7FA border-box flex flex-items-center p-12 rounded-10 font-size-14 color-171717 mb-12">
|
||||
<div class="bg-F5F7FA border-box flex flex-items-center p-12 rounded-10 text-[14px] color-171717 mb-12">
|
||||
<span class="font-500 line-height-22 mr-20">联系电话</span>
|
||||
<input placeholder="请填写联系电话" v-model="contactPhone" />
|
||||
</div>
|
||||
<div class="bg-F5F7FA border-box p-12 rounded-10 font-size-14 font-500 color-171717 mb-12">
|
||||
<div class="bg-F5F7FA border-box p-12 rounded-10 text-[14px] font-500 color-171717 mb-12">
|
||||
<div class="font-500 line-height-22 mb-12">意见内容</div>
|
||||
<textarea class="h-80" placeholder="请输入反馈意见" placeholder-class="font-size-14 font-400" maxlength="100"
|
||||
<textarea class="h-80" placeholder="请输入反馈意见" placeholder-class="text-[14px] font-400" maxlength="100"
|
||||
v-model="contactText" />
|
||||
</div>
|
||||
|
||||
@@ -26,17 +26,17 @@
|
||||
</div>
|
||||
|
||||
<div v-else class="border-box left flex-full p-12">
|
||||
<div class="font-size-12 color-525866 line-height-20 mb-4">
|
||||
<div class="text-[12px] color-525866 line-height-20 mb-4">
|
||||
联系方式: {{ contactPhone }}
|
||||
</div>
|
||||
<div class="font-size-12 color-525866 line-height-20 ellipsis-2">
|
||||
<div class="text-[12px] color-525866 line-height-20 ellipsis-2">
|
||||
意见内容: {{ contactText }}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="footer-help flex flex-items-center pl-12 mb-12">
|
||||
<img class="help-icon mr-4" src="./images/icon_volume.png" />
|
||||
<span class="font-size-12 font-500 color-FA7319">
|
||||
<span class="text-[12px] font-500 color-FA7319">
|
||||
{{ appName }}收到您的意见将第一时间为您处理!
|
||||
</span>
|
||||
</div>
|
||||
|
||||
@@ -13,11 +13,11 @@
|
||||
}">
|
||||
<div class="flex flex-items-center flex-row flex-shrink-0 mr-8">
|
||||
<zn-icon :name="moduleItem.moduleIcon" size="20" color="#333"></zn-icon>
|
||||
<span class="ml-4 font-size-14 color-171717 line-height-20">
|
||||
<span class="ml-4 text-[14px] color-171717 line-height-20">
|
||||
{{ moduleItem.moduleTitle }}
|
||||
</span>
|
||||
</div>
|
||||
<span class="flex-full font-size-12 color-525866 line-height-20 mt-4">
|
||||
<span class="flex-full text-[12px] color-525866 line-height-20 mt-4">
|
||||
{{ moduleItem.moduleContent }}
|
||||
</span>
|
||||
</div>
|
||||
|
||||
@@ -14,11 +14,11 @@
|
||||
<uni-icons fontFamily="znicons" size="20" color="#333">
|
||||
{{ iconsMap["zn-refund"] }}
|
||||
</uni-icons>
|
||||
<span class="font-size-14 font-600 color-171717 ml-8">
|
||||
<span class="text-[14px] font-600 color-171717 ml-8">
|
||||
{{ refundTitle }}
|
||||
</span>
|
||||
</div>
|
||||
<div class="font-size-14 color-525866 line-height-16 mb-4" v-for="(item, index) in commodityPurchaseInstruction"
|
||||
<div class="text-[14px] color-525866 line-height-16 mb-4" v-for="(item, index) in commodityPurchaseInstruction"
|
||||
:key="index">
|
||||
{{ item }}
|
||||
</div>
|
||||
|
||||
@@ -1,9 +1,7 @@
|
||||
<template>
|
||||
<div class="stepper-wrapper border-box flex flex-items-center rounded-8">
|
||||
<uni-icons type="minus" size="24" color="#D1D1D1" @click="decrease" />
|
||||
<text
|
||||
class="stepper-text text-center font-size-14 font-500 color-000 ml-4 mr-4"
|
||||
>
|
||||
<text class="stepper-text text-center text-[14px] font-500 color-000 ml-4 mr-4">
|
||||
{{ value }} {{ unit }}
|
||||
</text>
|
||||
<uni-icons type="plus" size="24" color="#198CFF" @click="increase" />
|
||||
|
||||
@@ -7,16 +7,13 @@
|
||||
<scroll-div class="date-scroll" scroll-x>
|
||||
<div class="date-list">
|
||||
<block v-for="item in openDateRangeList" :key="item.date">
|
||||
<div
|
||||
class="date-item"
|
||||
:class="{ selected: isSameDate(selectedDate, item.date) }"
|
||||
@click="onDateClick(item)"
|
||||
>
|
||||
<div class="label font-size-12">{{ item.weekDesc }}</div>
|
||||
<div class="date-item" :class="{ selected: isSameDate(selectedDate, item.date) }"
|
||||
@click="onDateClick(item)">
|
||||
<div class="label text-[12px]">{{ item.weekDesc }}</div>
|
||||
<div class="md font-size-16 font-600">
|
||||
{{ formatMD(item.date) }}
|
||||
</div>
|
||||
<div class="status font-size-12">{{ item.canOrder }}</div>
|
||||
<div class="status text-[12px]">{{ item.canOrder }}</div>
|
||||
<div v-if="isSameDate(selectedDate, item.date)" class="check">
|
||||
✔
|
||||
</div>
|
||||
|
||||
Reference in New Issue
Block a user