duanshuwen/nianxx-h5
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

style: standardize tailwind classes and clean unused assets

Browse Source 
Standardize Tailwind CSS usage across the codebase: replace legacy shorthand utilities with modern syntax, update color classes to use bracket notation, fix margin/padding units, delete unused CreateServiceOrder SCSS stylesheet and image asset, and resolve minor style inconsistencies.
This commit is contained in:
DEV_DSW
2026-05-29 10:47:36 +08:00
parent 971b4d9cfa
commit 8312273696
40 changed files with 110 additions and 144 deletions
Download Patch File Download Diff File Expand all files Collapse all files

BIN
src/components/CreateServiceOrder/images/2025-07-11_104138.png
View File

Binary file not shown.
Side by Side

Before

Width:  |  Height:  |  Size: 122 KiB

51
src/components/CreateServiceOrder/index.vue
View File

@@ -1,42 +1,41 @@
<template>
<div class="create-service-order">
<div class="w-full bg-white border-ff overflow-hidden rounded-20">
<div class=" order-header w-vw flex items-center flex-justify-between bg-theme-color-50">
<span class="text-[18px] font-medium text-[#171717] text-left ml-12">
<div class="w-full bg-white border-ff overflow-hidden rounded-[20px]">
<div class="w-full h-[48px] flex items-center justify-between bg-[#f0f8f3]">
<span class="text-[18px] font-medium text-[#171717] text-left ml-[12px]">
{{ isCallSuccess ? "服务已创建" : "呼叫服务" }}
</span>
<img class="header-icon" src="https://oss.nianxx.cn/mp/static/version_101/home/feedback.png" />
<img class="w-[98px] h-[48px]" src="https://oss.nianxx.cn/mp/static/version_101/home/feedback.png" />
</div>
<div v-if="!isCallSuccess" class=" p-[12px]">
<div class="bg-F5F7FA flex items-center p-[12px] rounded-10 text-[14px] text-[#171717] mb-[12px]">
<span class="font-medium line-height-22 mr-20">所在位置</span>
<div class="bg-[#f5f7fa] flex items-center p-[12px] rounded-[10px] text-[14px] text-[#171717] mb-[12px]">
<span class="font-medium leading-[22px] mr-[20px]">所在位置</span>
<input placeholder="请填写所在位置" v-model="roomId" />
</div>
<div class="bg-F5F7FA flex items-center p-[12px] rounded-10 text-[14px] text-[#171717] mb-[12px]">
<span class="font-medium line-height-22 mr-20">联系电话</span>
<div class="bg-[#f5f7fa] flex items-center p-[12px] rounded-[10px] text-[14px] text-[#171717] mb-[12px]">
<span class="font-medium leading-[22px] mr-[20px]">联系电话</span>
<input placeholder="请填写联系电话" v-model="contactPhone" @input="handleContactPhoneInput" />
</div>
<div class="bg-F5F7FA p-[12px] rounded-10 text-[14px] font-medium text-[#171717] mb-[12px]">
<div class="font-medium line-height-22 mb-[12px]">需求信息描述</div>
<textarea class="h-80" placeholder="请输入需求信息描述" placeholder-class="text-[14px] font-400" maxlength="100"
v-model="contactText" />
<div class="bg-[#f5f7fa] p-[12px] rounded-[10px] text-[14px] font-medium text-[#171717] mb-[12px]">
<div class="font-medium leading-[22px] mb-[12px]">需求信息描述</div>
<textarea class="h-[80px]" placeholder="请输入需求信息描述" maxlength="100" v-model="contactText" />
</div>
<div class="bg-F5F7FA p-[12px] rounded-10 text-[14px] font-medium text-[#171717] mb-[12px]">
<div class="font-medium line-height-22 mb-[12px]">照片上传</div>
<div class="bg-[#f5f7fa] p-[12px] rounded-[10px] text-[14px] font-medium text-[#171717] mb-[12px]">
<div class="font-medium leading-[22px] mb-[12px]">照片上传</div>
<div class="w-80 h-80 bg-white rounded-8 overflow-hidden flex items-center flex-justify-center">
<div class="w-[80px] h-[80px] bg-white rounded-[8px] overflow-hidden flex items-center justify-center">
<div v-if="contentImgUrl" class="w-full h-full relative inline-block">
<img class="w-full h-full block" :src="contentImgUrl" mode="aspectFill" />
<uni-icons class="close-btn absolute z-10" type="close" size="20" color="#6A717F"
<img class="w-full h-full block" :src="contentImgUrl" />
<van-icon class="top-0 right-0 absolute z-10" name="cross" size="20" color="#6A717F"
@click="handleDeleteImage">
</uni-icons>
</van-icon>
</div>
<div v-else class="w-full h-full flex items-center flex-justify-center" @click="handleChooseImage">
<div v-else class="w-full h-full flex items-center justify-center" @click="handleChooseImage">
<zn-icon name="zn-camera" size="24" color="#6A717F"></zn-icon>
</div>
</div>
@@ -56,10 +55,11 @@
</div>
</div>
<img v-if="contentImgUrl" class="right rounded-6" :src="contentImgUrl" mode="aspectFill" />
<img v-if="contentImgUrl" class="w-[88px] h-[88px] rounded-[6px]" :src="contentImgUrl" mode="aspectFill" />
</div>
<div class="btn rounded-[5px]0 text-white bg-button flex items-center flex-justify-center ml-12 mr-12 mb-[12px]"
<div
class="h-[44px] rounded-[5px] text-white bg-linear-[90deg,#f0f8f3_0%,#4de4ff_100%] flex items-center justify-center mx-[12px] mb-[12px]"
@click="handleCall">
{{ isCallSuccess ? "查看服务" : "立即呼叫" }}
</div>
@@ -225,12 +225,3 @@ onMounted(() => {
});
});
</script>
<style scoped lang="scss">
@import "./styles/index.scss";
.close-btn {
top: 0;
right: 0;
}
</style>

22
src/components/CreateServiceOrder/styles/index.scss
View File

@@ -1,22 +0,0 @@
.order-header {
height: 48px;
}
.header-icon {
width: 98px;
height: 48px;
}
.help-icon {
width: 16px;
height: 16px;
}
.btn {
height: 44px;
}
.right {
height: 88px;
width: 88px;
}

2
src/components/DateRangeSection/index.vue
View File

@@ -1,5 +1,5 @@
<template>
<div class=" flex items-center flex-justify-between mb-[12px]">
<div class=" flex items-center justify-between mb-[12px]">
<div class="left flex items-center">
<span class="text-[12px] text-ink-400 mr-[4px]">入住</span>
<span class="text-[12px] text-[#171717] mr-16">

8
src/components/DetailPopup/index.vue
View File

@@ -1,6 +1,6 @@
<template>
<uni-popup ref="popupRef" type="bottom" :safe-area="false" @maskClick="handleClose">
<div class="refund-popup bg-F5F7FA ">
<div class="refund-popup bg-[#f5f7fa] ">
<div class=" flex items-center justify-between pt-[12px] pb-[12px] relative">
<div class="flex-1 text-[16px] text-[#171717] leading-[24px] text-center">
明细详情
@@ -9,12 +9,12 @@
<uni-icons class="close absolute" type="close" size="20" color="#CACFD8" @click="handleClose" />
</div>
<!-- 内容区域 -->
<div class="rounded-[12px] bg-white ml-12 mr-12 mb-40">
<div class=" border-bottom flex items-center flex-justify-between pt-[12px] pb-[12px] ml-12 mr-12">
<div class="rounded-[12px] bg-white ml-[12px] mr-[12px] mb-40">
<div class=" border-bottom flex items-center justify-between pt-[12px] pb-[12px] ml-[12px] mr-[12px]">
<span class="text-[16px] font-medium text-[#171717]">在线支付</span>
<span class="text-[14px] text-[#171717]">239</span>
</div>
<div class=" flex items-center flex-justify-between pt-[12px] pb-[12px] ml-12 mr-12">
<div class=" flex items-center justify-between pt-[12px] pb-[12px] ml-[12px] mr-[12px]">
<span class="text-[16px] font-medium text-[#171717]">房费</span>
<span class="text-[14px] text-[#171717]">239</span>
</div>

18
src/components/Feedback/index.vue
View File

@@ -1,25 +1,25 @@
<template>
<div class="create-service-order">
<div class="w-full bg-white border-ff overflow-hidden rounded-20">
<div class=" order-header w-vw flex items-center flex-justify-between bg-theme-color-50">
<span class="text-[18px] font-medium text-[#171717] text-left ml-12">
<div class="w-full bg-white border-ff overflow-hidden rounded-[20px]">
<div class=" order-header w-full flex items-center justify-between bg-[#f0f8f3]">
<span class="text-[18px] font-medium text-[#171717] text-left ml-[12px]">
{{ isCallSuccess ? "反馈已创建" : "反馈意见" }}
</span>
<img class="header-icon" src="https://oss.nianxx.cn/mp/static/version_101/home/feedback.png" />
</div>
<div v-if="!isCallSuccess" class=" p-[12px]">
<div class="bg-F5F7FA flex items-center p-[12px] rounded-10 text-[14px] text-[#171717] mb-[12px]">
<span class="font-medium line-height-22 mr-20">联系电话</span>
<div class="bg-[#f5f7fa] flex items-center p-[12px] rounded-[10px] text-[14px] text-[#171717] mb-[12px]">
<span class="font-medium leading-[22px] mr-[20px]">联系电话</span>
<input placeholder="请填写联系电话" v-model="contactPhone" />
</div>
<div class="bg-F5F7FA p-[12px] rounded-10 text-[14px] font-medium text-[#171717] mb-[12px]">
<div class="font-medium line-height-22 mb-[12px]">意见内容</div>
<textarea class="h-80" placeholder="请输入反馈意见" placeholder-class="text-[14px] font-400" maxlength="100"
<div class="bg-[#f5f7fa] p-[12px] rounded-[10px] text-[14px] font-medium text-[#171717] mb-[12px]">
<div class="font-medium leading-[22px] mb-[12px]">意见内容</div>
<textarea class="h-80" placeholder="请输入反馈意见" placeholder-class="text-[14px] font-normal" maxlength="100"
v-model="contactText" />
</div>
<div class="btn rounded-[5px]0 text-white bg-button flex items-center flex-justify-center" @click="handleCall">
<div class="btn rounded-[5px]0 text-white bg-button flex items-center justify-center" @click="handleCall">
立即提交
</div>
</div>

4
src/components/RefundPopup/index.vue
View File

@@ -1,6 +1,6 @@
<template>
<uni-popup ref="popupRef" type="bottom" :safe-area="false" @maskClick="handleClose">
<div class="refund-popup bg-F5F7FA ">
<div class="refund-popup bg-[#f5f7fa] ">
<div class=" flex items-center justify-between pt-[12px] pb-[12px] relative">
<div class="flex-1 text-[16px] text-[#171717] leading-[24px] text-center">
取消政策
@@ -9,7 +9,7 @@
<uni-icons class="close absolute" type="close" size="20" color="#CACFD8" @click="handleClose" />
</div>
<!-- 内容区域 -->
<div class=" rounded-[12px] bg-white p-[12px] ml-12 mr-12 mb-40">
<div class=" rounded-[12px] bg-white p-[12px] ml-[12px] mr-[12px] mb-40">
<div class="flex items-center mb-8">
<uni-icons fontFamily="znicons" size="20" color="#333">
{{ iconsMap["zn-refund"] }}

2
src/components/Stepper/index.vue
View File

@@ -1,5 +1,5 @@
<template>
<div class="stepper-wrapper flex items-center rounded-8">
<div class="stepper-wrapper flex items-center rounded-[8px]">
<uni-icons type="minus" size="24" color="#D1D1D1" @click="decrease" />
<text class="stepper-text text-center text-[14px] font-medium text-black ml-4 mr-[4px]">
{{ value }} {{ unit }}

10
src/components/SurveyQuestionnaire/index.vue
View File

@@ -1,8 +1,8 @@
<template>
<div class="survey-questionnaire w-vw-24">
<div class="bg-white border-ff overflow-hidden rounded-20">
<div class=" flex items-center flex-justify-between bg-theme-color-50">
<span class="text-[18px] font-medium text-[#171717] text-left ml-12">
<div class="survey-questionnaire w-[calc(100%-24px)]">
<div class="bg-white border-ff overflow-hidden rounded-[20px]">
<div class=" flex items-center justify-between bg-[#f0f8f3]">
<span class="text-[18px] font-medium text-[#171717] text-left ml-[12px]">
调查问卷
</span>
<img class="w-102 h-72" :src="surveyData.logoUrl" mode="widthFix" />
@@ -10,7 +10,7 @@
<img class="w-full" :src="surveyData.bannerUrl" mode="widthFix" />
<div class="h-44 m-[12px] rounded-[5px]0 bg-button text-white flex items-center flex-justify-center"
<div class="h-44 m-[12px] rounded-[5px]0 bg-button text-white flex items-center justify-center"
@click="handleCall">
前往填写
</div>