This commit is contained in:
2024-09-10 10:49:08 +08:00
parent b5fd06b800
commit dd4f5938da
6391 changed files with 722800 additions and 0 deletions

View File

@@ -0,0 +1,619 @@
<template>
<view class="page">
<view class="box">
<view v-for="(item,index) in recharge.list" :key="index">
<uni-forms :model="item" :rules="rules" err-show-type="undertext" validateTrigger="blur"
:ref="setFormRef(index)" :border="true" label-position="top" label-width="350">
<view class="block">
<uni-forms-item label="充值面额" required name="miane">
<uni-easyinput :placeholderStyle="placeholderStyle" :inputBorder="inputBorder"
v-model="item.miane" placeholder="填输入面额" />
</uni-forms-item>
<uni-forms-item label="赠送金额" required name="jine">
<uni-easyinput :placeholderStyle="placeholderStyle" :inputBorder="inputBorder"
v-model="item.jine" placeholder="请输入金额" />
</uni-forms-item>
<uni-forms-item label="赠送积分" required name="jifen">
<uni-easyinput :placeholderStyle="placeholderStyle" :inputBorder="inputBorder"
v-model="item.jifen" placeholder="请输入赠送积分" />
</uni-forms-item>
<uni-forms-item label="赠送券">
<view class="option">
<template v-if="item.options.length">
<view class="u-flex">
<view class="u-flex-1">赠送券</view>
<view class="u-flex-1 u-p-l-60">赠送数量</view>
</view>
<view class="">
<view class="u-flex option-item" v-for="(option,optionIndex) in item.options"
:key="optionIndex">
<!-- <buton @tap="testVaildata(index,optionIndex)">test</buton> -->
<view class="u-flex-1">
<uni-forms-item :key="optionIndex" :name="['options',optionIndex,'quan']"
:ref="setFormInputRef(index,optionIndex)"
:rules="[{'required': true,errorMessage: '赠送券必选'}]" label-width="0"
label="" required>
<uni-data-select
v-model="recharge.list[index].options[optionIndex].quan"
:localdata="quans"
@change="inpuChange(index,optionIndex)"></uni-data-select>
<!-- <uni-easyinput v-model="recharge.list[index].options[optionIndex].quan"
@input="inpuChange(index,optionIndex)"
:placeholderStyle="placeholderStyle" :inputBorder="inputBorder"
placeholder="选项名" /> -->
</uni-forms-item>
</view>
<view class="u-p-l-60 u-flex-1 u-flex">
<uni-forms-item :key="optionIndex"
:rules="[{'required': true,errorMessage: '必填'}]"
:ref="setFormInputRef(index,optionIndex)"
:name="['options',optionIndex,'quanNumber']" label-width="0" label=""
required>
<view class="u-flex">
<uni-easyinput
v-model="recharge.list[index].options[optionIndex].quanNumber"
@input="inpuChange(index,optionIndex)"
:placeholderStyle="placeholderStyle" :inputBorder="inputBorder"
type="number" placeholder="填写数量 张" />
<view class="icon icon-reduce u-m-l-38"
@click="delOption(index,optionIndex)">
</view>
</view>
</uni-forms-item>
</view>
</view>
</view>
</template>
<view class="u-flex u-m-t-32" >
<view class="u-flex" @click="addOptions(index)">
<view class="icon icon-add u-m-r-22 ">
</view>
<view class="color-main">添加</view>
</view>
</view>
</view>
</uni-forms-item>
<!-- <view class="u-flex u-m-t-48 u-m-b-24" @click="delrechargeGroup(index)">
<view class="icon icon-reduce u-m-r-22 ">
</view>
<view class="color-red">删除规格组</view>
</view> -->
</view>
<view class="block u-m-t-30">
<view class="u-p-t-30 u-p-b-30">
<view class="u-flex u-row-between">
<view class="">首冲赠送</view>
<view>
<my-switch v-model="item.isFirst"></my-switch>
</view>
</view>
<view class="color-999" v-if="item.isFirst">当用户首次充值时仅赠送以下内容:</view>
</view>
<template v-if="item.isFirst">
<uni-forms-item label="赠送金额" required name="zengJie">
<uni-easyinput :placeholderStyle="placeholderStyle" :inputBorder="inputBorder"
v-model="item.zengJie" placeholder="请输入金额" />
</uni-forms-item>
<uni-forms-item label="赠送积分" required name="zengJifen">
<uni-easyinput :placeholderStyle="placeholderStyle" :inputBorder="inputBorder"
v-model="item.zengJifen" placeholder="请输入积分" />
</uni-forms-item>
<uni-forms-item label="赠送券">
<view class="option">
<template v-if="item.zengOptions.length">
<view class="u-flex">
<view class="u-flex-1">赠送券</view>
<view class="u-flex-1 u-p-l-60">赠送数量</view>
</view>
<view class="">
<view class="u-flex option-item" v-for="(option,optionIndex) in item.zengOptions"
:key="optionIndex">
<!-- <buton @tap="testVaildata(index,optionIndex)">test</buton> -->
<view class="u-flex-1">
<uni-forms-item :key="optionIndex" :name="['zengOptions',optionIndex,'quan']"
:ref="setFormInputRef(index,optionIndex)"
:rules="[{'required': true,errorMessage: '赠送券必选'}]" label-width="0"
label="" required>
<uni-data-select
v-model="recharge.list[index].zengOptions[optionIndex].quan"
:localdata="quans"
@change="inpuChange(index,optionIndex)"></uni-data-select>
<!-- <uni-easyinput v-model="recharge.list[index].options[optionIndex].quan"
@input="inpuChange(index,optionIndex)"
:placeholderStyle="placeholderStyle" :inputBorder="inputBorder"
placeholder="选项名" /> -->
</uni-forms-item>
</view>
<view class="u-p-l-60 u-flex-1 u-flex">
<uni-forms-item :key="optionIndex"
:rules="[{'required': true,errorMessage: '必填'}]"
:ref="setFormInputRef(index,optionIndex)"
:name="['zengOptions',optionIndex,'quanNumber']" label-width="0" label=""
required>
<view class="u-flex">
<uni-easyinput
v-model="recharge.list[index].zengOptions[optionIndex].quanNumber"
@input="inpuChange(index,optionIndex)"
:placeholderStyle="placeholderStyle" :inputBorder="inputBorder"
type="number" placeholder="填写数量 张" />
<view class="icon icon-reduce u-m-l-38"
@click="delZengOption(index,optionIndex)">
</view>
</view>
</uni-forms-item>
</view>
</view>
</view>
</template>
<view class="u-flex u-m-t-32" >
<view class="u-flex" @click="addZengOptions(index)">
<view class="icon icon-add u-m-r-22 ">
</view>
<view class="color-main">添加</view>
</view>
</view>
</view>
</uni-forms-item>
</template>
</view>
</uni-forms>
</view>
<!-- <view class="u-flex block u-p-l-20 u-p-r-20 u-p-t-28 u-p-b-28" @click="addrechargeGroup">
<view class="icon icon-add u-m-r-22 ">
</view>
<view class="color-main">添加规格组</view>
</view> -->
<view class="save-btn-box">
<my-button @tap="save" showShadow shape="circle">保存</my-button>
<view class="u-m-t-20">
<my-button @tap="back" type="cancel">取消</my-button>
</view>
</view>
</view>
<view style="height: 100rpx;"></view>
<view class="bottom" ref="bottom"></view>
</view>
</template>
<script setup>
import mySwitch from '@/components/my-components/my-switch.vue'
import myButton from '@/components/my-components/my-button.vue'
import go from '@/commons/utils/go.js';
import {
onLoad,
onReady
} from '@dcloudio/uni-app';
import {
onMounted,
reactive,
nextTick,
ref,
onBeforeMount
} from 'vue';
// 表单样式
const placeholderStyle = ref('font-size:28rpx;')
//表单边框
const inputBorder = ref(false)
const form = ref(null)
const bottom = ref(null)
//表单验证
const rules = {
miane: {
rules: [{
required: true,
errorMessage: '必填'
}]
},
jine: {
rules: [{
required: true,
errorMessage: '必填'
}]
},
zengJie:{
rules: [{
required: true,
errorMessage: '必填'
}]
},
zengJifen:{
rules: [{
required: true,
errorMessage: '必填'
}]
},
jifen: {
rules: [{
required: true,
errorMessage: '必填'
}]
},
quan: {
rules: [{
required: true,
errorMessage: '必填'
}]
},
quanNumber: {
rules: [{
required: true,
errorMessage: '必填'
}]
}
}
const quans = reactive([{
value: 0,
text: "充值18元优惠券"
},
{
value: 1,
text: "邀新10元优惠券"
},
{
value: 2,
text: "10元新人券"
},
])
// 构造规格的选项值的基础数据
const rechargeOptionsBasicData = {
quan: null,
quanNumber: 1
}
function returnOptionsBasicData() {
return {
...rechargeOptionsBasicData
}
}
// 构造规格的基础数据
const rechargeBasicData = {
GroupName: '',
miane: '',
jine: '',
jifen: '',
zengJie:'',
zengJifen:'',
isFirst:false,
options: [],
zengOptions:[]
}
function back(){
go.back()
}
function returnrechargeOptionsBasicData() {
return {
...rechargeBasicData,
options: [returnOptionsBasicData()],
zengOptions: [returnOptionsBasicData()],
}
}
function onFieldChange(e) {
console.log(e);
}
// 规格列表
const recharge = reactive({
list: [returnrechargeOptionsBasicData()]
})
//添加规格组
function addrechargeGroup() {
recharge.list.push(returnrechargeOptionsBasicData())
scrollPageBottom()
}
//删除规格组
function delrechargeGroup(index) {
recharge.list.splice(index, 1)
}
// 向指定索引的优惠券添加规格项
function addOptions(index) {
recharge.list[index].options.push(returnOptionsBasicData())
}
// 向指定索引的赠送优惠券添加规格项
function addZengOptions(index) {
recharge.list[index].zengOptions.push(returnOptionsBasicData())
}
// 删除指定索引的优惠券添加规格项
function delOption(index, optionIndex) {
recharge.list[index].options.splice(optionIndex, 1)
}
// 删除指定索引的赠送优惠券添加规格项
function delZengOption(index, optionIndex) {
recharge.list[index].zengOptions.splice(optionIndex, 1)
}
//页面滚动到最底部
function scrollPageBottom() {
nextTick(() => {
uni.pageScrollTo({
duration: 100, // 过渡时间
scrollTop: 100000, // 滚动的实际距离
})
})
}
//设置表单验证规则
function setFormRules() {
form.value.setRules(rules)
}
const formRefs = ref([]);
//绑定表单元素
function setFormRef(index) {
formRefs.value[index] = null;
return (el) => {
if (el) {
formRefs.value[index] = el;
}
};
}
// 绑定option input元素
const refFormInput = ref([])
function setFormInputRef(index, index1) {
const newIndex = 1000 + index * 10000 + index1
return (el) => {
if (el) {
if (!refFormInput.value[newIndex]) {
refFormInput.value[newIndex] = el;
}
}
}
}
function testVaildata(index, index1) {
const newIndex = 1000 + index * 10000 + index1
recharge.list[0].options[0].quanNumber = 1
refFormInput.value[newIndex] && refFormInput.value[newIndex].onFieldChange()
}
// 当表单内容输入变化根据配置的rules进行验证
function inpuChange(index, index1) {
const newIndex = 1000 + index * 10000 + index1
refFormInput.value[newIndex] && refFormInput.value[newIndex].onFieldChange()
}
let emitName = ''
function triggerEvent(emitName, data) {
if (emitName) {
uni.$emit(emitName, data)
}
}
onLoad(opt => {
const arr = uni.getStorageSync('guige')
if (arr.length) {
recharge.list = arr
console.log(arr);
}
console.log(opt);
if (opt && JSON.stringify(opt) !== '{}' && opt.emitName) {
emitName = opt.emitName
}
})
function emitrechargeSave() {
// emitrechargeSave 触发规格保存事件将数据给到添加商品页面
// guigeEdit 触发规格保存事件将数据给到添加规格页面
uni.removeStorageSync('guige')
triggerEvent(emitName, recharge.list)
}
function returnPromise(index, prosise) {
return new Promise((resolve, reject) => {
prosise.then(res => {
console.log(res);
resolve({
sucees: true
})
}).catch(err => {
console.log(err);
resolve({
sucees: false
})
})
})
}
async function save() {
let isAllPassForm = 0
for (let i in recharge.list) {
const res = await returnPromise(i, formRefs.value[i].validate())
isAllPassForm += res.sucees ? 1 : 0
}
//判断验证是否通过
if (isAllPassForm === recharge.list.length) {
console.log('pass');
emitrechargeSave()
go.back()
}
}
</script>
<style scoped>
page {
background: #F9F9F9;
}
</style>
<style lang="scss" scoped>
$icon-size: 34rpx;
$icon-line-width: 20rpx;
$icon-line-height: 4rpx;
.page {
background: #F9F9F9;
padding: 30rpx;
padding-bottom: 200rpx;
}
.my-switch {
transform: scale(0.7);
}
::v-deep .uni-forms-item__error {
display: none !important;
}
::v-deep .option .uni-forms-item {
padding: 0;
min-height: inherit;
background-color: transparent;
border-top: none;
}
.icon {
width: $icon-size;
height: $icon-size;
position: relative;
border-radius: 50%;
&:before,
&::after {
position: absolute;
display: block;
content: '';
background-color: #fff;
}
}
.icon-add {
background-color: $my-main-color;
&::before {
width: $icon-line-height;
height: $icon-line-width;
top: calc(($icon-size /2) - ($icon-line-width / 2));
left: calc(($icon-size /2) - ($icon-line-height / 2));
}
&::after {
width: $icon-line-width;
height: 4rpx;
top: calc(($icon-size /2) - ($icon-line-height / 2));
left: calc(($icon-size /2) - ($icon-line-width / 2));
}
}
.icon-reduce {
background-color: $my-red-color;
&::after {
width: $icon-line-width;
height: $icon-line-height;
top: calc(($icon-size /2) - ($icon-line-height / 2));
left: calc(($icon-size /2) - ($icon-line-width / 2));
}
}
.label-title {
font-size: 28rpx;
font-weight: bold;
font-family: Source Han Sans CN, Source Han Sans CN;
}
.lh40 {
line-height: 40rpx;
}
.box {
margin-top: 70rpx;
font-size: 28rpx;
.block {
background: #FFFFFF;
border-radius: 18rpx 18rpx 18rpx 18rpx;
padding: 12rpx 24rpx;
margin-bottom: 32rpx;
}
}
.save-btn-box {
position: fixed;
left: 30rpx;
right: 30rpx;
bottom: 60rpx;
}
::v-deep.uni-forms-item {
align-items: inherit;
}
::v-deep .uni-forms-item .uni-forms-item__label {
text-indent: 0;
font-size: 28rpx !important;
font-weight: bold;
color: #333;
}
::v-deep .border-top-0 .uni-forms-item.is-direction-top {
border-color: transparent !important;
}
.save-btn {
background-color: $my-main-color;
color: #fff;
border-radius: 12rpx;
font-size: 28rpx;
}
.btn-hover-class {
opacity: .6;
}
.zuofa {
padding: 28rpx 0;
background: #F9F9F9;
padding-left: 42rpx;
border-radius: 14rpx 14rpx 14rpx 14rpx;
}
::v-deep .uni-input-placeholder {
font-size: 28rpx;
}
.option {
padding: 26rpx 30rpx 24rpx 24rpx;
background: #F9F9F9;
}
.option-item {
margin-bottom: 10rpx;
}
</style>

View File

@@ -0,0 +1,79 @@
<template>
<view class=" item">
<view class="u-flex ">
<view class="color-333 u-flex font-bold ">
<view class="u-font-40">{{to2(props.data.price) }}</view>
<view></view>
</view>
<view class="u-font-24 u-m-l-20 color-999 id">
id:{{props.data.id}}
</view>
</view>
<view class="u-m-t-32 u-p-22 desc">
<text class="color-999">充值赠送</text>
<text class="u-m-l-16 color-333">{{props.data.desc}}</text>
</view>
<view class="u-flex u-row-right u-m-t-32 gap-20">
<view class="" style="width: 140rpx;">
<my-button plain height="56" type="cancel" shape="circle" @tap="del">删除</my-button>
</view>
<view class="" style="width: 140rpx;">
<my-button height="56" shape="circle" @tap="toEdit">编辑</my-button>
</view>
</view>
</view>
</template>
<script setup>
import go from '@/commons/utils/go.js';
import myButton from '@/components/my-components/my-button.vue'
const props = defineProps({
index:{
type:Number,
default:-1
},
data: {
type: Object,
default: () => {
return {}
}
}
})
const emits=defineEmits(['del'])
function del(){
emits('del',{
index:props.index,
data:props.data
})
}
function toEdit(){
go.to('PAGES_USER_DEPOSIT_ADD_RECHARGE',{...props.data})
}
function to2(n) {
return Number(n).toFixed(2)
}
</script>
<style lang="scss" scoped>
.item {
padding: 32rpx 24rpx;
background: #FFFFFF;
border-radius: 18rpx 18rpx 18rpx 18rpx;
overflow: hidden;
.desc {
border-radius: 12rpx 12rpx 12rpx 12rpx;
background-color: #F9F9F9;
}
.id {
background: #F7F7FA;
border-radius: 4rpx 4rpx 4rpx 4rpx;
padding: 4prx 10rpx;
overflow: hidden;
}
}
</style>

View File

@@ -0,0 +1,298 @@
<template>
<view class="bg-gray min-page">
<view class="bg-fff top">
<view class="u-p-30">
<myTabs :defaultIndex="tabsCurrent" :list="tabsList" @change="tabsChange"></myTabs>
</view>
</view>
<template v-if="tabsCurrent===0">
<view class="u-p-30">
<view class="u-flex bg-fff u-p-30 border-r-12" @tap="toAddRecharge">
<view class="u-m-r-22 ">
<my-icons type="add"></my-icons>
</view>
<view class="">添加充值面额</view>
</view>
</view>
<view class="u-p-30">
<view class="u-m-b-32" v-for="(item,index) in rechargeLists" :key="index">
<recharge-item @del="rechargeItemDel" :index="index" :data="item"></recharge-item>
</view>
</view>
</template>
<template v-if="tabsCurrent===1">
<view class="u-p-30">
<view class="bg-fff u-p-30 border-r-12">
<view>充值说明</view>
<view class="u-p-30 border-r-12 border u-m-t-30">
<view class="">
<textarea placeholder="请填写充值说明"/>
</view>
</view>
</view>
<view class="bg-fff u-m-t-30 u-overflow-hide border-r-12 u-p-30 u-flex u-row-between">
<view class="">充值前绑定手机</view>
<view>
<my-switch v-model="mustBindPhone"></my-switch>
</view>
</view>
<view class="u-m-t-60" style="padding: 80rpx;">
<my-button showShadow shape="circle">保存</my-button>
</view>
</view>
</template>
<template v-if="tabsCurrent===2">
<view class="bg-fff">
<view class="box-shadow u-relative">
<view class="u-flex u-row-between u-p-30 u-relative">
<view class="u-flex u-col-center" @tap="timeToggle">
<text class="color-main">充值时间</text>
<view class="icon-down u-m-l-6">
<uni-icons type="right" :color="color.ColorMain" size="16"></uni-icons>
</view>
</view>
<view class="u-flex u-col-center" @tap="showStatusToggle">
<text :class="{'color-main':nowStatusIndex>=1}">状态</text>
<view class="icon-down u-m-l-6">
<uni-icons type="right" :color="nowStatusIndex>=1 ? color.ColorMain:'#000'" size="16"></uni-icons>
</view>
</view>
<view style="width: 164rpx;"></view>
<view class="search-box">
<view class="search-btn u-flex" @tap="showSearch" :style="{width:searchShow?'690rpx':'164rpx'}">
<image src="@/static/iconImg/icon-search.svg" class="input-icon" />
<view class="u-flex-1 u-p-l-10"><input v-model="keyword" @confirm="searchConfirm" type="text"
placeholder-style="font-size:28rpx;" placeholder="搜索" /></view>
<view @tap.stop="hideSearch" v-if="searchShow">取消</view>
</view>
</view>
</view>
<view :style="{height:showStatus?statusHeight:0}" class="tranistion status overflow-hide">
<view @tap="changeNowStatusIndex(index)" class="u-flex u-p-l-30 lh30 u-p-r-30 u-row-between"
v-for="(item,index) in status" :key="index">
<view>{{item}}</view>
<uni-icons v-if="nowStatusIndex===index" type="checkmarkempty" :color="color.ColorMain"></uni-icons>
</view>
<view :style="{height: statusBootom+'px'}"></view>
</view>
</view>
</view>
<view class="u-flex u-p-30">
<view class="time-area u-font-24 color-main u-flex">
<uni-dateformat format="yyyy-MM-dd hh:mm:ss" :date="filters.time.start"></uni-dateformat>
<text class="u-p-l-10 u-p-r-10"></text>
<uni-dateformat format="yyyy-MM-dd hh:mm:ss" :date="filters.time.end"></uni-dateformat>
</view>
</view>
<view class="u-p-30">
<view class="recoreds color-fff">
<view class="u-font-32">数据统计</view>
<view class="u-flex u-row-between u-m-t-48">
<view class="u-flex u-flex-col u-row-center u-col-center">
<view>充值总额</view>
<view class="u-font-32 u-m-t-10">0.00</view>
</view>
<view style="margin-left: 240rpx;" class="u-flex u-flex-col u-row-center u-col-center">
<view>充值人次</view>
<view class="u-font-32 u-m-t-10">0</view>
</view>
</view>
<view class="u-flex u-row-between u-m-t-30">
<view class="u-flex u-flex-col u-row-center u-col-center">
<view>退款总额</view>
<view class="u-font-32 u-m-t-10">0.00</view>
</view>
<view style="margin-left: 240rpx;" class="u-flex u-flex-col u-row-center u-col-center">
<view>退款金额</view>
<view class="u-font-32 u-m-t-10">0</view>
</view>
</view>
</view>
</view>
</template>
<my-model ref="model" :desc="modelData.desc"></my-model>
<my-date-pickerview @confirm="datePickerConfirm" ref="datePicker"></my-date-pickerview>
</view>
</template>
<script setup>
import {
computed,
reactive,
ref
} from 'vue';
import myTabs from '@/components/my-components/my-tabs.vue'
import myIcons from '@/components/my-components/my-icons.vue'
import mySwitch from '@/components/my-components/my-switch.vue'
import myButton from '@/components/my-components/my-button.vue'
import myModel from '@/components/my-components/my-model.vue'
import myDatePickerview from '@/components/my-components/my-date-pickerview'
import rechargeItem from './components/recharge-item.vue'
import color from '@/commons/color.js';
import $util from '@/commons/utils/getDateArea.js';
import go from '@/commons/utils/go.js';
const model=ref(null)
const modelData=reactive({
desc:''
})
function rechargeItemDel(e){
modelData.desc=`确定删除【${Number(e.data.price).toFixed(2)}】面额吗?`
model.value.open()
console.log(e);
}
function toAddRecharge(){
go.to('PAGES_USER_DEPOSIT_ADD_RECHARGE')
}
const rechargeLists=ref([
{
id:1,
price:200,
desc:'20.00元、2张券'
},
{
id:2,
price:500,
desc:'60.00元、4张券'
}
])
let mustBindPhone=ref(true)
const nowDate=new Date()
const filters=reactive({
time:{
start:$util.getDayArea(nowDate,'start'),
end:$util.getDayArea(nowDate,'end')
}
})
const tabsList = ['充值面额', '充值设置', '充值记录']
let tabsCurrent = ref(2)
let showStatus=ref(false)
function showStatusToggle(){
showStatus.value=!showStatus.value
}
const statusBootom=14
const statusHeight= computed(()=>{
return 30*status.length+statusBootom +'px'
})
let searchShow = ref(false)
function showSearch() {
searchShow.value = true
}
const status = ['全部', '未支付', '支付成功']
let nowStatusIndex = ref(0)
function changeNowStatusIndex(i) {
nowStatusIndex.value = i
showStatus.value=false
}
function hideSearch() {
searchShow.value = false
}
function tabsChange(i) {
console.log(i);
tabsCurrent.value = i
}
let keyword = ref('')
function searchConfirm(e) {
console.log(e)
}
const datePicker=ref(null)
function timeToggle(){
datePicker.value.toggle()
}
function datePickerConfirm(e){
console.log(e);
filters.time.start=e.start
filters.time.end=e.end
}
</script>
<style lang="scss" scoped>
.u-overflow-hide{
overflow: hidden;
}
.border{
border: 1px solid #E5E5E5;
}
.border-r-12{
border-radius: 12rpx;
}
.recoreds{
background: linear-gradient( 127deg, #33A0FF 0%, #6699FF 100%);
box-shadow: 0rpx 20rpx 60rpx 2rpx rgba(92,112,248,0.2);
border-radius: 14rpx 14rpx 14rpx 14rpx;
padding: 32rpx 40rpx 40rpx 48rpx;
}
.lh30 {
line-height: 30px;
}
.status {
position: absolute;top: 100%;
left: 0;
right: 0;
z-index: 10;
background-color: #fff;
}
.input-icon {
width: 28rpx;
height: 28rpx;
}
.box-shadow {
box-shadow: 0 0 5px #eee;
}
.search-box {
background-color: #fff;
padding: 16rpx 0;
top: 0;
bottom: 0;
position: absolute;
right: 30rpx;
display: flex;
.search-btn {
padding: 0 30rpx;
box-sizing: border-box;
display: flex;
align-items: center;
// width: 164rpx;
transition: all .3s ease-in-out;
background-color: rgb(247, 247, 247);
border-radius: 100px;
}
}
.time-area{
background: #E6F0FF;
border-radius: 100px;
padding: 10rpx 20rpx;
}
.icon-down {
transform: rotate(90deg);
display: flex;
justify-content: center;
align-items: center;
}
</style>