代客下单逻辑修改

This commit is contained in:
2025-11-14 18:06:04 +08:00
parent d0cee95145
commit 67ec915181
26 changed files with 5314 additions and 870 deletions

View File

@@ -54,7 +54,10 @@
{{ index + 1 }}
</view>
<view class="">
<view>{{ item.name }}</view>
<view>
<text>{{ item.name }}</text>
<text class="limit" v-if="item.is_time_discount"></text>
</view>
<view class="u-m-t-10 u-font-24 color-666">{{
item.specInfo || ""
}}</view>
@@ -179,7 +182,7 @@
v-if="v.is_time_discount || v.isTimeDiscount"
>
<view class="font-bold red u-m-r-32"
>{{ formatPrice(v.price * (v.num - v.returnNum)) }}</view
>{{ returnLimitPrice({...v,number:v.num,salePrice:v.price}) }}</view
>
<view class="u-m-l-30 u-m-r-30 color-333">
X{{ v.num.toFixed(2) }}
@@ -276,6 +279,8 @@ import { getElRect } from "@/commons/utils/safe-bottom.js";
import * as Api from "@/http/yskApi/Instead.js";
import { computed, ref, onMounted, reactive, watch, inject } from "vue";
import BigNumber from "bignumber.js";
import { limitTimeDiscount } from "../../../http/yskApi/limitTimeDiscount";
import { number } from "uview-plus/libs/function/test";
const yskUtils = inject("yskUtils");
const shopInfo = uni.getStorageSync("shopInfo");
@@ -343,18 +348,19 @@ function returnLimitPrice(data) {
shopInfo: shopInfo,
limitTimeDiscountRes: props.limitTimeDiscount,
shopUserInfo: null,
idKey: "id",
idKey: "product_id",
});
return price
}
function returnLimitTotalPrice(data) {
console.log('returnLimitTotalPrice',data)
const price = yskUtils.limitUtils.returnPrice({
goods: data,
shopInfo: shopInfo,
limitTimeDiscountRes: props.limitTimeDiscount,
shopUserInfo: null,
idKey: "id",
idKey: "product_id",
});
return BigNumber(price).times(data.number).toNumber();
}
@@ -377,16 +383,12 @@ const allPrice = computed(() => {
let price = (cur.is_time_discount? returnLimitPrice(cur) : cur.lowPrice) * cur.number
return BigNumber(prve).plus(price);
}, 0);
console.log('cartPrice',cartPrice)
let historyOrderPrice = allHistoryOrder.value.reduce((prve, cur) => {
const isTimeDiscount=cur.is_time_discount||cur.isTimeDiscount
let price = (isTimeDiscount? returnLimitPrice(cur) : cur.price)* (cur.num - cur.returnNum)
console.log('price',price)
let price = (cur.isTimeDiscount? returnLimitPrice({...cur,salePrice:cur.price}) : cur.price)* (cur.num - cur.returnNum)
return BigNumber(prve).plus(price);
}, 0);
console.log('historyOrderPrice',historyOrderPrice)
return BigNumber(cartPrice).plus(historyOrderPrice);
return BigNumber(cartPrice).plus(historyOrderPrice).decimalPlaces(2, BigNumber.ROUND_UP)
.toNumber();
});
const models = new Map();
const modelData = reactive({
@@ -495,7 +497,7 @@ function getshopsInfo() {
}
function toConfimOrder() {
if (props.data.length <= 0) {
if (props.data.length <= 0&& props.historyOrder.length<=0) {
return infoBox.showToast("还没有选择商品");
}
@@ -687,6 +689,7 @@ $car-top: -16rpx;
right: 0;
top: 0;
bottom: 0;
z-index: 10;
}
.total {
@@ -780,4 +783,17 @@ $car-top: -16rpx;
color: #999;
text-decoration: line-through;
}
.limit{
background-color: #cc5617;
margin-left: 10rpx;
padding: 2rpx 10rpx;
white-space: nowrap;
text-align: center;
position: absolute;
font-weight: 400;
font-size: 24rpx;
color: #ffffff;
border-radius: 14rpx;
color: #fff;
}
</style>

View File

@@ -3,7 +3,7 @@
class="u-relative u-flex item box-shadow"
@tap="emitEvent('showDetail')"
>
<view class="limit-discount" v-if="data.is_time_discount">限时折扣</view>
<view class="limit-discount" v-if="is_time_discount">限时折扣</view>
<!-- 已下架 -->
<view
v-if="!data.isSale"
@@ -175,9 +175,9 @@
<view class="bg-fff u-p-20 w-full">
<view class="u-flex u-row-between u-font-16">
<view>{{ data.name }}</view>
<view class="u-flex" v-if="data.is_time_discount">
<view class="u-flex" v-if="is_time_discount">
<view class="font-bold u-m-t-16">
¥{{ data.timeLimitPrice }}
¥{{ limitPrice }}
</view>
<view class="u-m-t-16 old-price"> ¥{{ data.lowPrice }} </view>
</view>
@@ -194,6 +194,7 @@ import { computed, toRef, toRefs, inject, watch } from "vue";
import dayjs from "dayjs";
import isBetween from "dayjs/plugin/isBetween";
const yskUtils = inject("yskUtils");
const shopInfo = inject("shopInfo");
dayjs.extend(isBetween);
import { onLoad } from "@dcloudio/uni-app";
const props = defineProps({
@@ -277,6 +278,34 @@ const computedImgStyle = computed(() => {
// height: props.img.height
// }
// }
//判断是否是时间折扣商品
const is_time_discount = computed(() => {
if (!props.limitTimeDiscount || !props.limitTimeDiscount.id) {
return false;
}
const isCanuse = yskUtils.limitUtils.canUseLimitTimeDiscount(
props.data,
props.limitTimeDiscount,
shopInfo,
null,
"id"
);
return isCanuse;
});
const limitPrice = computed(() => {
if (!is_time_discount.value) {
return 0;
}
const price = yskUtils.limitUtils.returnPrice({
goods: props.data,
shopInfo: shopInfo,
limitTimeDiscountRes: props.limitTimeDiscount,
shopUserInfo: null,
idKey: "id",
});
return price;
});
//判断是否是菜品
function isGoods() {

View File

@@ -29,8 +29,12 @@
<view class="u-flex u-p-b-30 u-row-between">
<view class="price">
<template v-if="goods && goods.isGrounding">
<text v-if="goodsData.is_time_discount">{{ returnLimitPrice() }}</text>
<text :class="{'old-price':goodsData.is_time_discount}">{{ to2(goods.salePrice * number) }}</text>
<text v-if="is_time_discount"
>{{ returnLimitPrice() }}</text
>
<text :class="{ oldPrice: is_time_discount }"
>{{ goods.salePrice }}</text
>
</template>
</view>
<view class="u-flex">
@@ -67,7 +71,7 @@
</template>
<script setup>
import { computed, reactive, ref, watch,inject } from "vue";
import { computed, reactive, ref, watch, inject } from "vue";
import util from "../util.js";
import infobox from "@/commons/utils/infoBox.js";
import myModel from "@/components/my-components/my-model.vue";
@@ -75,14 +79,15 @@ import myButton from "@/components/my-components/my-button.vue";
import BigNumber from "bignumber.js";
const yskUtils = inject("yskUtils");
const shopInfo = uni.getStorageSync("shopInfo");
const shopUserInfo = uni.getStorageSync("shopUserInfo");
const props = defineProps({
limitTimeDiscount:{
type: Object,
default: () => {
return {};
},
},
limitTimeDiscount: {
type: Object,
default: () => {
return {};
},
},
goodsData: {
type: Object,
default: () => {},
@@ -114,16 +119,33 @@ const props = defineProps({
function to2(number) {
return Number(number).toFixed(2);
}
function returnLimitPrice(){
const price= yskUtils.limitUtils.returnPrice({
const is_time_discount = computed(() => {
if (!props.limitTimeDiscount || !props.limitTimeDiscount.id) {
return false;
}
const isCanuse = yskUtils.limitUtils.canUseLimitTimeDiscount(
goods.value,
props.limitTimeDiscount,
shopInfo,
shopUserInfo,
"productId"
);
console.log('isCanuse');
console.log( goods.value);
return isCanuse;
});
function returnLimitPrice() {
const price = yskUtils.limitUtils.returnPrice({
goods: goods.value,
shopInfo: shopInfo,
limitTimeDiscountRes: props.limitTimeDiscount,
shopUserInfo: null,
idKey: "id",
shopUserInfo: shopUserInfo,
idKey: "productId",
});
return BigNumber(price).times(number.value).toNumber()
return BigNumber(price).times(number.value).toNumber();
}
const selSku = computed(() => {
return props.skus
@@ -228,7 +250,7 @@ function confirm() {
if (isDisabled.value) {
return;
}
emits("confirm", goods.value, number.value);
emits("confirm", goods.value, number.value,is_time_discount.value);
}
defineExpose({
open,
@@ -275,8 +297,8 @@ defineExpose({
.border-top {
border-top: 1px solid #e5e5e5;
}
.old-price{
color: #999;
text-decoration: line-through;
.oldPrice {
color: #999;
text-decoration: line-through;
}
</style>

View File

@@ -1,185 +1,205 @@
<template>
<my-model ref="model" borderRadius="12" :title="datas.title">
<template #desc>
<scroll-view scroll-y="true" style="height: 50vh;" class="u-p-30 guigeModel">
<view class="u-m-b-40" v-for="(item,index) in datas.skus" :key="index">
<view class="u-text-left">
<view class="color-333">{{item.title}} <text
style="color:#999">({{item.count}}{{item.number}})</text> </view>
</view>
<view class="u-flex u-m-t-20 u-flex-wrap">
<view class="item" @tap="chooseSkd(skd,item)" :class="{active:skd.select==true}"
v-for="(skd,skdIndex) in item.goods" :key="skdIndex">
{{skd.proName}}
</view>
</view>
</view>
</scroll-view>
</template>
<template #btn>
<view class="u-p-30 border-top ">
<view class="u-flex u-p-b-30 u-row-between">
<view class="price">
<text></text>
<text>{{datas.price}}</text>
</view>
</view>
<view class="u-m-t-10">
<my-button @tap="confirm">添加</my-button>
</view>
</view>
</template>
</my-model>
<uni-popup ref="popup" type="message">
<uni-popup-message type="info" message="请选择套餐" :duration="2000"></uni-popup-message>
</uni-popup>
<my-model ref="model" borderRadius="12" :title="datas.title">
<template #desc>
<scroll-view
scroll-y="true"
style="height: 50vh"
class="u-p-30 guigeModel"
>
<view class="u-m-b-40" v-for="(item, index) in datas.skus" :key="index">
<view class="u-text-left">
<view class="color-333"
>{{ item.title }}
<text style="color: #999"
>({{ item.count }}{{ item.number }})</text
>
</view>
</view>
<view class="u-flex u-m-t-20 u-flex-wrap">
<view
class="item"
@tap="chooseSkd(skd, item)"
:class="{ active: skd.select == true }"
v-for="(skd, skdIndex) in item.goods"
:key="skdIndex"
>
{{ skd.proName }}
</view>
</view>
</view>
</scroll-view>
</template>
<template #btn>
<view class="u-p-30 border-top">
<view class="u-flex u-p-b-30 u-row-between">
<view class="price">
<text></text>
<text>{{ datas.price }}</text>
</view>
</view>
<view class="u-m-t-10">
<my-button @tap="confirm">添加</my-button>
</view>
</view>
</template>
</my-model>
<uni-popup ref="popup" type="message">
<uni-popup-message
type="info"
message="请选择套餐"
:duration="2000"
></uni-popup-message>
</uni-popup>
</template>
<script setup>
import { computed, reactive, ref, watch } from 'vue';
import infobox from '@/commons/utils/infoBox.js'
import myModel from '@/components/my-components/my-model.vue'
import myButton from '@/components/my-components/my-button.vue'
import { onShow } from '@dcloudio/uni-app';
const props = defineProps({
goodsData: {
type: Object,
default: () => {}
},
})
const model = ref(null)
const popup = ref()
let datas = reactive({
item: "",
title: "",
price: "",
skus: [],
// 几选几,的和
selectNumber: 0,
})
watch(() => props.goodsData, (newval) => {
let gArr = JSON.parse(newval.groupSnap)
gArr.forEach(ele => {
ele.selectData = []
})
console.log(newval,11);
datas.item = newval
datas.title = newval.name
datas.price = newval.lowPrice
datas.skus = gArr
})
const selectNumber = computed(() => {
return datas.skus.reduce((prve, cur) => {
console.log(prve)
return 0 + cur.number
}, 0)
})
const emits = defineEmits(['confirm', 'updateSku'])
function confirm() {
// 将数据保存进对应的值
let arr = []
let arrlength = 0
datas.selectNumber = 0
datas.skus.map(ele => {
let group = {
...ele,
goods: [],
}
if(ele.goods&&ele.goods.length>0){
ele.goods.map(item=>{
if(item.select){
group.goods.push(item)
arrlength++
}
})
}
arr.push(group)
datas.selectNumber += ele.number
})
console.log(arrlength)
console.log(datas.selectNumber)
if (arrlength == datas.selectNumber) {
emits('confirm', arr, datas.item)
close()
} else {
popup.value.open()
}
}
/**
* 套餐选择处理
* @param {Object} skd
* @param {Object} item
*/
function chooseSkd(skd, item) {
if (item.selectData.includes(skd.proId)) {
skd.select = false
let indexs = item.selectData.indexOf(skd.proId)
item.selectData.splice(indexs, 1)
} else {
if (item.selectData.length < item.number) {
skd.select = true
item.selectData.push(skd.proId)
}
}
import { computed, reactive, ref, watch } from "vue";
import infobox from "@/commons/utils/infoBox.js";
import myModel from "@/components/my-components/my-model.vue";
import myButton from "@/components/my-components/my-button.vue";
import { onShow } from "@dcloudio/uni-app";
const props = defineProps({
goodsData: {
type: Object,
default: () => {},
},
});
const model = ref(null);
const popup = ref();
let datas = reactive({
item: "",
title: "",
price: "",
skus: [],
// 几选几,的和
selectNumber: 0,
});
}
watch(
() => props.goodsData,
(newval) => {
let gArr = JSON.parse(newval.groupSnap);
gArr.forEach((ele) => {
ele.selectData = [];
});
console.log(newval, 11);
datas.item = newval;
datas.title = newval.name;
datas.price = newval.lowPrice;
datas.skus = gArr;
}
);
function open() {
model.value.open()
}
const selectNumber = computed(() => {
return datas.skus.reduce((prve, cur) => {
console.log(prve);
return 0 + cur.number;
}, 0);
});
function close() {
datas.selectNumber = 0
model.value.close()
}
defineExpose({
open,
close
})
const emits = defineEmits(["confirm", "updateSku"]);
function confirm() {
// 将数据保存进对应的值
let arr = [];
let arrlength = 0;
datas.selectNumber = 0;
datas.skus.map((ele) => {
let group = {
...ele,
goods: [],
};
if (ele.goods && ele.goods.length > 0) {
ele.goods.map((item) => {
if (item.select) {
group.goods.push(item);
arrlength++;
}
});
}
arr.push(group);
datas.selectNumber += ele.number;
});
console.log(arrlength);
console.log(datas.selectNumber);
if (arrlength == datas.selectNumber) {
emits("confirm", arr, datas.item);
close();
} else {
popup.value.open();
}
}
/**
* 套餐选择处理
* @param {Object} skd
* @param {Object} item
*/
function chooseSkd(skd, item) {
if (item.selectData.includes(skd.proId)) {
skd.select = false;
let indexs = item.selectData.indexOf(skd.proId);
item.selectData.splice(indexs, 1);
} else {
if (item.selectData.length < item.number) {
skd.select = true;
item.selectData.push(skd.proId);
}
}
}
function open() {
model.value.open();
}
function close() {
datas.selectNumber = 0;
model.value.close();
}
defineExpose({
open,
close,
});
</script>
<style lang="scss">
.border-top {}
.border-top {
}
.icon {
width: 40rpx;
height: 40rpx;
}
.icon {
width: 40rpx;
height: 40rpx;
}
.guigeModel {
.item {
color: #666;
font-size: 24rpx;
padding: 4rpx 28rpx;
border: 1px solid #E5E5E5;
border-radius: 8rpx;
margin-right: 20rpx;
margin-bottom: 20rpx;
transition: all .2s ease-in-out;
.guigeModel {
.item {
color: #666;
font-size: 24rpx;
padding: 4rpx 28rpx;
border: 1px solid #e5e5e5;
border-radius: 8rpx;
margin-right: 20rpx;
margin-bottom: 20rpx;
transition: all 0.2s ease-in-out;
&.active {
border-color: $my-main-color;
color: $my-main-color;
}
&.active {
border-color: $my-main-color;
color: $my-main-color;
}
&.disabled {
color: #ccc;
border-color: #eee;
}
}
}
&.disabled {
color: #ccc;
border-color: #eee;
}
}
}
.price {
color: #EB4F4F;
}
.price {
color: #eb4f4f;
}
.border-top {
border-top: 1px solid #E5E5E5;
}
.border-top {
border-top: 1px solid #e5e5e5;
}
</style>

View File

@@ -1,279 +1,354 @@
<template>
<view class="">
<up-overlay :show="overlayshow" @click="overlayshow = false">
<view class="boxoverlay" v-if="form&&form.goods">
<view class="rect" @tap.stop>
<view class="title">
<view> 标题 </view>
<view class="" @click="overlayshow = false">
<up-icon name="close" color="#93969b" size="20"></up-icon>
</view>
</view>
<view class="inputtop">
<view class="dj">
<view class="text">单价</view>
<view class="jg">{{form.goods.lowPrice}}/{{form.goods.unitName}}</view>
</view>
<view class="inputdj">
<view>重量</view>
<view class="inputdjbox">
<view class="inputdisplay">{{ currentInput }}</view>
<text>{{ form.goods.unitName }}</text>
</view>
</view>
</view>
<view class="keyboard">
<button v-for="(num, index) in numberButtons" :key="index" @click="handleClick(num)">
{{ num }}
</button>
<button @click="deleteLast"></button>
</view>
<view class="classmoney">
{{ (Math.floor((form.goods.lowPrice * currentInput)*100)/100).toFixed(2) }}
</view>
<view class="classconfirm" @click="clickconfirm"> 确认 </view>
</view>
</view>
</up-overlay>
</view>
<view class="">
<up-overlay :show="overlayshow" @click="overlayshow = false">
<view class="boxoverlay" v-if="form && form.goods">
<view class="rect" @tap.stop>
<view class="title">
<view> {{ form.goods.name }} </view>
<view class="" @click="overlayshow = false">
<up-icon name="close" color="#93969b" size="20"></up-icon>
</view>
</view>
<view class="inputtop">
<view class="dj">
<view class="text">单价</view>
<view class="jg"
>{{
is_time_discount ? returnLimitPrice() : form.goods.lowPrice
}}/{{ form.goods.unitName }}</view
>
</view>
<view class="inputdj">
<view>重量</view>
<view class="inputdjbox">
<view class="inputdisplay">{{ currentInput }}</view>
<text>{{ form.goods.unitName }}</text>
</view>
</view>
</view>
<view class="keyboard">
<button
v-for="(num, index) in numberButtons"
:key="index"
@click="handleClick(num)"
>
{{ num }}
</button>
<button @click="deleteLast"></button>
</view>
<view class="classmoney">
{{ totalMoney }}
</view>
<view class="classconfirm" @click="clickconfirm"> 确认 </view>
</view>
</view>
</up-overlay>
</view>
</template>
<script setup>
import { onLoad, onShow } from '@dcloudio/uni-app';
import { reactive, ref, watch, defineExpose, defineEmits } from 'vue';
const emit = defineEmits(['refresh'])
const currentInput = ref('');
import { onLoad, onShow } from "@dcloudio/uni-app";
import { BigNumber } from "bignumber.js";
import {
reactive,
computed,
ref,
watch,
defineExpose,
defineEmits,
inject,
} from "vue";
const yskUtils = inject("yskUtils");
const shopInfo = uni.getStorageSync("shopInfo");
const shopUserInfo = uni.getStorageSync("shopUserInfo");
const emit = defineEmits(["refresh"]);
const currentInput = ref("");
const numberButtons = ['1', '2', '3', '4', '5', '6', '7', '8', '9', '0', '.'];
const numberButtons = ["1", "2", "3", "4", "5", "6", "7", "8", "9", "0", "."];
const handleClick = (value) => {
// 首位不能输入0
if (currentInput.value === '') {
if (value === '0') {
return;
}
}
if (value === '.' && currentInput.value.indexOf('.') !== -1) {
return; // 如果已经存在小数点,不再添加
}
if (value === '.' && currentInput.value === '') {
currentInput.value = '0.';
} else {
currentInput.value += value;
}
// 限制小数点后两位
const parts = currentInput.value.split('.');
if (parts.length > 1 && parts[1].length > 2) {
currentInput.value = currentInput.value.slice(0, -1);
}
};
const deleteLast = () => {
currentInput.value = currentInput.value.slice(0, -1);
};
const handleClick = (value) => {
// 首位不能输入0
if (currentInput.value === "") {
if (value === "0") {
return;
}
}
if (value === "." && currentInput.value.indexOf(".") !== -1) {
return; // 如果已经存在小数点,不再添加
}
if (value === "." && currentInput.value === "") {
currentInput.value = "0.";
} else {
currentInput.value += value;
}
// 限制小数点后两位
const parts = currentInput.value.split(".");
if (parts.length > 1 && parts[1].length > 2) {
currentInput.value = currentInput.value.slice(0, -1);
}
};
const clickconfirm = () => {
// 首位不能输入0
if (currentInput.value === '') {
uni.showToast({
title: '请输入',
icon: 'none'
})
return false;
}
console.log(currentInput.value,'称重数量')
emit('weighgoodsUpdate', form.foodsindex, form.index, true, undefined, currentInput.value)
overlayshow.value = false
}
//显示
const overlayshow = ref(false);
const form = reactive({})
const open = (foodsindex, index, goods) => {
console.log("222",goods)
currentInput.value = ''
Object.assign(form, {
foodsindex,
index,
goods
})
overlayshow.value = true
}
defineExpose({
open
})
const deleteLast = () => {
currentInput.value = currentInput.value.slice(0, -1);
};
const clickconfirm = () => {
// 首位不能输入0
if (currentInput.value === "") {
uni.showToast({
title: "请输入",
icon: "none",
});
return false;
}
console.log(currentInput.value, "称重数量");
emit(
"weighgoodsUpdate",
form.foodsindex,
form.index,
true,
undefined,
currentInput.value,
is_time_discount.value
);
overlayshow.value = false;
};
//显示
const overlayshow = ref(false);
const form = reactive({});
const open = (foodsindex, index, goods) => {
console.log(goods);
currentInput.value = "";
Object.assign(form, {
foodsindex,
index,
goods,
});
overlayshow.value = true;
};
const props = defineProps({
limitTimeDiscount: {
type: Object,
default: () => {},
},
});
const is_time_discount = computed(() => {
if (!props.limitTimeDiscount || !props.limitTimeDiscount.id) {
return false;
}
const isCanuse = yskUtils.limitUtils.canUseLimitTimeDiscount(
form.goods,
props.limitTimeDiscount,
shopInfo,
shopUserInfo,
"id"
);
console.log("isCanuse");
return isCanuse;
});
function returnLimitPrice() {
const price = yskUtils.limitUtils.returnPrice({
goods: form.goods,
shopInfo: shopInfo,
limitTimeDiscountRes: props.limitTimeDiscount,
shopUserInfo: shopUserInfo,
idKey: "id",
});
return price;
}
const totalMoney = computed(() => {
if(!currentInput.value) return 0
if (is_time_discount.value) {
return BigNumber(returnLimitPrice())
.times(currentInput.value)
.decimalPlaces(2, BigNumber.ROUND_UP)
.toNumber();
}
return BigNumber(form.goods.lowPrice)
.times(currentInput.value)
.decimalPlaces(2, BigNumber.ROUND_UP)
.toNumber();
});
defineExpose({
open,
});
</script>
<style lang="scss" scoped>
page {
background: #F9F9F9;
}
page {
background: #f9f9f9;
}
.boxoverlay {
width: 100%;
display: flex;
align-items: center;
justify-content: center;
height: 100%;
.boxoverlay {
width: 100%;
display: flex;
align-items: center;
justify-content: center;
height: 100%;
.rect {
padding: 32rpx 28rpx;
width: 30%;
background-color: #fff;
border-radius: 18rpx;
.rect {
padding: 32rpx 28rpx;
width: 30%;
background-color: #fff;
border-radius: 18rpx;
.title {
display: flex;
justify-content: space-between;
align-items: center;
padding-bottom: 20rpx;
font-size: 40rpx;
border-bottom: 1rpx solid #ccc;
}
.title {
display: flex;
justify-content: space-between;
align-items: center;
padding-bottom: 20rpx;
font-size: 40rpx;
border-bottom: 1rpx solid #ccc;
}
.inputtop {
margin-top: 20rpx;
width: 100%;
display: flex;
justify-content: space-between;
align-items: center;
flex-wrap: wrap;
.inputtop {
margin-top: 20rpx;
width: 100%;
display: flex;
justify-content: space-between;
align-items: center;
flex-wrap: wrap;
.dj {
width: 32%;
display: flex;
flex-direction: column;
justify-content: center;
align-items: flex-start;
.dj {
width: 32%;
display: flex;
flex-direction: column;
justify-content: center;
align-items: flex-start;
.text {
font-weight: 300;
font-size: 24rpx;
}
.text {
font-weight: 300;
font-size: 24rpx;
}
.jg {
margin-top: 16rpx;
background-color: #e8f4ff;
color: #1890ff;
height: 60rpx;
line-height: 60rpx;
padding: 0 20rpx;
font-size: 24rpx;
color: #1890ff;
border-radius: 10rpx;
}
}
.jg {
margin-top: 16rpx;
background-color: #e8f4ff;
color: #1890ff;
height: 60rpx;
line-height: 60rpx;
padding: 0 20rpx;
font-size: 24rpx;
color: #1890ff;
border-radius: 10rpx;
}
}
.inputdj {
width: 66%;
display: flex;
flex-direction: column;
justify-content: center;
align-items: flex-start;
font-weight: 300;
font-size: 24rpx;
.inputdj {
width: 66%;
display: flex;
flex-direction: column;
justify-content: center;
align-items: flex-start;
font-weight: 300;
font-size: 24rpx;
.inputdjbox {
margin-top: 16rpx;
width: 100%;
display: flex;
justify-content: space-between;
align-items: center;
border: 1rpx solid #ccc;
border-radius: 10rpx;
padding-left: 20rpx;
height: 60rpx;
line-height: 60rpx;
background: #fff;
.inputdjbox {
margin-top: 16rpx;
width: 100%;
display: flex;
justify-content: space-between;
align-items: center;
border: 1rpx solid #ccc;
border-radius: 10rpx;
padding-left: 20rpx;
height: 60rpx;
line-height: 60rpx;
background: #fff;
.inputdisplay {
width: auto;
.inputdisplay {
width: auto;
}
}
text {
border: 1rpx solid #ccc;
border-radius: 10rpx;
border-radius: 10rpx;
padding: 0 20rpx;
background: #f5f7fa;
color: #a7aaaf;
}
}
}
}
text {
border: 1rpx solid #ccc;
border-radius: 10rpx;
border-radius: 10rpx;
padding: 0 20rpx;
background: #f5f7fa;
color: #a7aaaf;
}
}
.keyboard {
margin-top: 20rpx;
display: flex;
justify-content: space-between;
align-items: center;
flex-wrap: wrap;
}
}
button {
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
width: 28%;
margin: 10rpx;
}
.keyboard {
margin-top: 20rpx;
display: flex;
justify-content: space-between;
align-items: center;
flex-wrap: wrap;
.keyboard-button {
width: 28%;
margin: 10rpx;
border: none;
border-radius: 5rpx;
box-shadow: 0 0 5rpx rgba(0, 0, 0, 0.3), 0 0 10rpx rgba(0, 0, 0, 0.2);
cursor: pointer;
transition: all 0.3s ease;
}
button {
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
width: 28%;
margin: 10rpx;
}
// .keyboard-button:hover {
// box-shadow: 0 0 10rpx rgba(255, 0, 0, 0.5), 0 0 20px rgba(255, 0, 0, 0.3);
// transform: translateY(-2rpx);
// }
.keyboard-button {
width: 28%;
margin: 10rpx;
border: none;
border-radius: 5rpx;
box-shadow: 0 0 5rpx rgba(0, 0, 0, 0.3), 0 0 10rpx rgba(0, 0, 0, 0.2);
cursor: pointer;
transition: all 0.3s ease;
}
.dot-button {
// background-color: #FFC107;
}
// .keyboard-button:hover {
// box-shadow: 0 0 10rpx rgba(255, 0, 0, 0.5), 0 0 20px rgba(255, 0, 0, 0.3);
// transform: translateY(-2rpx);
// }
.clear-button {
// background-color: #FF5733;
}
.dot-button {
// background-color: #FFC107;
}
.clear-button:hover {
box-shadow: 0 0 10px rgba(255, 87, 51, 0.5),
0 0 20px rgba(255, 87, 51, 0.3);
}
.clear-button {
// background-color: #FF5733;
}
.delete-button {
// background-color: #33FF57;
}
.clear-button:hover {
box-shadow: 0 0 10px rgba(255, 87, 51, 0.5), 0 0 20px rgba(255, 87, 51, 0.3);
}
.delete-button:hover {
// box-shadow: 0 0 10px rgba(51, 255, 87, 0.5), 0 0 20px rgba(51, 255, 87, 0.3);
}
}
.delete-button {
// background-color: #33FF57;
}
.classmoney {
margin-top: 16rpx;
width: 100%;
font-size: 40rpx;
text-align: left;
color: #ff5152;
font-weight: 600;
}
.delete-button:hover {
// box-shadow: 0 0 10px rgba(51, 255, 87, 0.5), 0 0 20px rgba(51, 255, 87, 0.3);
}
}
.classmoney {
margin-top: 16rpx;
width: 100%;
font-size: 40rpx;
text-align: left;
color: #ff5152;
font-weight: 600;
}
.classconfirm {
width: 100%;
margin: 30rpx auto 0 auto;
border-radius: 16rpx;
text-align: center;
background: #1890ff;
color: #fff;
padding: 10rpx 0;
}
}
}
.classconfirm {
width: 100%;
margin: 30rpx auto 0 auto;
border-radius: 16rpx;
text-align: center;
background: #1890ff;
color: #fff;
padding: 10rpx 0;
}
}
}
</style>