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,258 @@
<template>
<my-model ref="model" :title="title" iconColor="#000" @close="resetForm">
<template #desc>
<view class="u-m-t-48 tab">
<my-tabs :list="tabs" @change="tabsChange"></my-tabs>
</view>
<view class="u-text-left u-p-30 ">
<template v-if="!current">
<view>
<view class="u-m-t-24 border discount u-relative u-flex input-box">
<view class="u-flex-1">
<input @input="discountInput" v-model="form.discount" type="digit"
placeholder-class="placeholder-class" placeholder="打八折请输入80" />
</view>
<view class="color-999 u-p-l-48 u-p-r-48 u-flex u-row-center u-col-center">
<view>%</view>
</view>
<view class="color-999 u-p-l-48 u-p-r-48 bg1 u-absolute u-flex u-row-center u-col-center">
<view>%</view>
</view>
</view>
<view class="u-flex u-m-t-24">
<view class="u-flex" v-for="(item,index) in discounts" :key="index">
<button @tap="setForm('discount',item)" class="tag u-m-r-20"
hover-class="hover-class">{{item}}%</button>
</view>
</view>
</view>
</template>
<template v-else>
<view>
<view class="u-m-t-24 border discount u-relative u-flex input-box">
<view class="u-flex-1">
<input @input="discountMoneyInput" v-model="form.discountMoney" type="digit"
placeholder-class="placeholder-class" placeholder="减8.55元请输入8.55" />
</view>
<view class="color-999 u-p-l-48 u-p-r-48 u-flex u-row-center u-col-center">
<view></view>
</view>
<view class="color-999 u-p-l-48 u-p-r-48 bg1 u-absolute u-flex u-row-center u-col-center">
<view></view>
</view>
</view>
</view>
</template>
<view class="u-m-t-48">
<view class="u-font-24">
<text class="color-999">打折原因</text>
<text class="color-red">*</text>
</view>
<view class="u-flex u-m-t-24">
<view class="u-flex" v-for="(item,index) in causes" :key="index">
<button @tap="changeCauses(item)" class="tag u-m-r-20"
:class="{active:item.checked}">{{item.name}}</button>
</view>
</view>
</view>
<view class="u-m-t-32 u-flex ">
<uni-easyinput type="textarea" v-model="value" placeholder="自定义内容"></uni-easyinput>
</view>
</view>
</template>
<template #btn>
<view class="u-p-30">
<view class="u-m-t-10">
<my-button @tap="confirm" shape="circle" showShadow>确认</my-button>
<my-button type="cancel" bgColor="#fff" @tap="confirm">取消</my-button>
</view>
</view>
</template>
</my-model>
</template>
<script setup>
import {
reactive,
nextTick,
ref,
watch
} from 'vue';
import myModel from '@/components/my-components/my-model.vue'
import myButton from '@/components/my-components/my-button.vue'
import myTabs from '@/components/my-components/my-tabs.vue'
const props = defineProps({
price: {
type: [Number,String],
default: 0
},
title: {
type: String,
default: ''
},
data: {
type: Array,
default: []
}
})
function changeCauses(item) {
item.checked = !item.checked
}
const discounts = [95, 90, 85, 80]
const causes = reactive([{
name: '顾客投诉质量问题',
checked: false
},
{
name: '友情打折',
checked: false
},
{
name: '临时活动',
checked: false
}
])
function discountInput(e) {
if (e.detail.value >= 100) {
nextTick(() => {
form.discount = 100
})
}
}
function discountMoneyInput(e) {
const max=100
if (e.detail.value >= max) {
nextTick(() => {
form.discountMoney = 100
})
}
}
function setForm(key, val) {
form[key] = val
}
const tabs = ['打折', '减免']
let current = ref(0)
function tabsChange(i) {
console.log(i);
current.value = i
}
const $form = {
discountMoney: '',
discount: '',
name: '',
price: ''
}
const form = reactive({
...$form
})
watch(()=>props.price,(newval)=>{
console.log(newval);
form.price=newval
form.currentPrice=newval
})
function resetForm() {
Object.assign(form, {
...$form
})
}
const model = ref(null)
function open() {
model.value.open()
}
function close() {
model.value.close()
}
const emits = defineEmits(['confirm'])
function confirm() {
const {
discount,discountMoney
} = form
if (current.value===0&& discount==='') {
return uni.showToast({
icon: 'none',
title: '请输入有效折扣!'
})
}
if (current.value===1&& discountMoney==='') {
return uni.showToast({
icon: 'none',
title: '请输入有效减免价格!'
})
}
close()
emits('confirm', form)
}
defineExpose({
open,
close
})
</script>
<style lang="scss">
.tag {
background-color: #fff;
border: 1px solid #E5E5E5;
line-height: inherit;
font-size: 24rpx;
color: #666666;
padding: 6rpx 20rpx;
border-radius: 8rpx;
&.active {
border-color: #E6F0FF;
color: $my-main-color;
}
}
.hover-class {
background-color: #E5E5E5;
}
.discount {
.u-absolute {
top: 0;
bottom: 0;
right: 0;
}
}
.bg1 {
background: #F7F7FA;
}
.tab {
padding: 0 80rpx;
}
.border {
border: 1px solid #E5E5E5;
border-radius: 4rpx;
}
.input-box {
padding: 22rpx 32rpx;
font-size: 28rpx;
color: #666;
}
.placeholder-class {
font-size: 28rpx;
}
</style>

View File

@@ -0,0 +1,197 @@
<template>
<my-model ref="model" :title="title" iconColor="#000" @close="resetForm">
<template #desc>
<view class="u-text-left u-p-30 ">
<view style="transform: scale(1.5);transform-origin:left;">
<uni-number-box :min="1" :max="1" :value="form.number" @change="changeValue" :width="300" />
</view>
<view class="u-m-t-48">
<view class="u-font-24">
<text class="color-999">赠菜原因</text>
<text class="color-red">*</text>
</view>
<view class="u-flex u-m-t-24">
<view class="u-flex" v-for="(item,index) in causes" :key="index">
<button @tap="changeCauses(item)" class="tag u-m-r-20"
:class="{active:item.checked}">{{item.name}}</button>
</view>
</view>
</view>
<view class="u-m-t-32 u-flex ">
<uni-easyinput type="textarea" v-model="value" placeholder="自定义内容"></uni-easyinput>
</view>
</view>
</template>
<template #btn>
<view class="u-p-30">
<view class="u-m-t-10">
<my-button @tap="confirm" shape="circle" showShadow>确认</my-button>
<my-button type="cancel" bgColor="#fff" @tap="confirm">取消</my-button>
</view>
</view>
</template>
</my-model>
</template>
<script setup>
import {
reactive,
nextTick,
ref
} from 'vue';
import myModel from '@/components/my-components/my-model.vue'
import myButton from '@/components/my-components/my-button.vue'
import myTabs from '@/components/my-components/my-tabs.vue'
const props = defineProps({
title: {
type: String,
default: ''
},
data: {
type: Array,
default: []
}
})
function changeCauses(item) {
item.checked = !item.checked
}
const discounts = [95, 90, 85, 80]
const causes = reactive([{
name: '顾客投诉质量问题',
checked: false
},
{
name: '友情打折',
checked: false
},
{
name: '临时活动',
checked: false
}
])
function discountInput(e) {
if (e.detail.value >= 100) {
nextTick(() => {
form.discount = 100
})
}
}
function discountMoneyInput(e) {
const max=100
if (e.detail.value >= max) {
nextTick(() => {
form.discountMoney = 100
})
}
}
function setForm(key, val) {
form[key] = val
}
const tabs = ['打折', '减免']
let current = ref(0)
function tabsChange(i) {
console.log(i);
current.value = i
}
const $form = {
number:1
}
function changeValue(e){
form.number=e
}
const form = reactive({
...$form
})
function resetForm() {
Object.assign(form, {
...$form
})
}
const model = ref(null)
function open() {
model.value.open()
}
function close() {
model.value.close()
}
const emits = defineEmits(['confirm'])
function confirm() {
const {number
} = form
close()
emits('confirm', {
name,
price
})
}
defineExpose({
open,
close
})
</script>
<style lang="scss">
.tag {
background-color: #fff;
border: 1px solid #E5E5E5;
line-height: inherit;
font-size: 24rpx;
color: #666666;
padding: 6rpx 20rpx;
border-radius: 8rpx;
&.active {
border-color: #E6F0FF;
color: $my-main-color;
}
}
.hover-class {
background-color: #E5E5E5;
}
.discount {
.u-absolute {
top: 0;
bottom: 0;
right: 0;
}
}
.bg1 {
background: #F7F7FA;
}
.tab {
padding: 0 80rpx;
}
.border {
border: 1px solid #E5E5E5;
border-radius: 4rpx;
}
.input-box {
padding: 22rpx 32rpx;
font-size: 28rpx;
color: #666;
}
.placeholder-class {
font-size: 28rpx;
}
</style>

View File

@@ -0,0 +1,168 @@
<template>
<my-model ref="model" :title="title" iconColor="#000" @close="resetForm">
<template #desc>
<view class="u-text-left u-p-30 ">
<view class="u-m-t-32 u-flex ">
<uni-easyinput type="textarea" v-model="form.remark" placeholder="自定义内容"></uni-easyinput>
</view>
<view class="u-flex u-m-t-24">
<view class="u-flex u-flex-wrap u-m-r-20 u-m-b-20 lh34" v-for="(item,index) in causes" :key="index">
<button @tap="changeCauses(item)" class="tag ">{{item.name}}</button>
</view>
</view>
</view>
</template>
<template #btn>
<view class="u-p-30">
<view class="u-m-t-10">
<my-button @tap="confirm" shape="circle" showShadow>确认</my-button>
<my-button type="cancel" bgColor="#fff" @tap="confirm">取消</my-button>
</view>
</view>
</template>
</my-model>
</template>
<script setup>
import {
reactive,
nextTick,
ref
} from 'vue';
import myModel from '@/components/my-components/my-model.vue'
import myButton from '@/components/my-components/my-button.vue'
import myTabs from '@/components/my-components/my-tabs.vue'
const props = defineProps({
title: {
type: String,
default: ''
},
data: {
type: Array,
default: []
}
})
function changeCauses(item) {
let prve=form.remark.length?',':''
form.remark +=prve+item.name
}
const causes = reactive([{
name: '免葱',
checked: false
},
{
name: '免香菜',
checked: false
},
{
name: '不要辣',
checked: false
}
])
function setForm(key, val) {
form[key] = val
}
const $form = {
remark:''
}
const form = reactive({
...$form
})
function resetForm() {
Object.assign(form, {
...$form
})
}
const model = ref(null)
function open() {
model.value.open()
}
function close() {
model.value.close()
}
const emits = defineEmits(['confirm'])
function confirm() {
const {remark
} = form
close()
emits('confirm', {
name,
price
})
}
defineExpose({
open,
close
})
</script>
<style lang="scss">
.lh34{
line-height: 34rpx;
}
.tag {
background-color: #fff;
border: 1px solid #E5E5E5;
line-height: inherit;
font-size: 24rpx;
color: #666666;
padding: 6rpx 20rpx;
border-radius: 8rpx;
&.active {
border-color: #E6F0FF;
color: $my-main-color;
}
}
.hover-class {
background-color: #E5E5E5;
}
.discount {
.u-absolute {
top: 0;
bottom: 0;
right: 0;
}
}
.bg1 {
background: #F7F7FA;
}
.tab {
padding: 0 80rpx;
}
.border {
border: 1px solid #E5E5E5;
border-radius: 4rpx;
}
.input-box {
padding: 22rpx 32rpx;
font-size: 28rpx;
color: #666;
}
.placeholder-class {
font-size: 28rpx;
}
</style>

View File

@@ -0,0 +1,528 @@
<template>
<view class="page-gray color-333 u-font-28">
<view class="block">
<view class="u-p-b-24 u-m-b-24 border-bottom">
<view>选择用户</view>
<view class="u-m-t-24 u-flex u-row-between " @tap="chooseUser">
<view v-if="!user">选择用户</view>
<view class="u-flex" v-else>
<view class="headeimg">
<image class="img" :src="user.headImg" mode=""></image>
</view>
<view class="u-m-l-20">{{user.nickName}}</view>
<view class="color-main u-m-l-10 u-font-24">{{user.isVip?'会员':'' }}</view>
<view class="u-font-24 u-m-l-30"><text>余额</text><text class="color-main">{{user.amount}}</text>
</view>
<view class="u-font-24 u-m-l-30"><text>积分</text><text
class="color-main">{{user.totalScore}}</text></view>
</view>
<uni-icons type="right" color="#999" size="22"></uni-icons>
</view>
</view>
<view class="u-p-b-24 u-m-b-24 border-bottom">
<view>就餐类型</view>
<view class="u-m-t-24 u-flex ">
<view class="u-flex color-666">
<radio-group @change="radioGroupChange">
<label class="radio u-m-r-60" v-for="(item,index) in eatTypes.list" :key="index">
<radio :value="''+index" :checked="index === eatTypes.active" class="scale7 " />
<text>{{item.label}}</text>
</label>
</radio-group>
</view>
</view>
</view>
<view class="u-p-b-24 u-m-b-24 border-bottom" @tap="chooseTable">
<view>选择桌码</view>
<view class="u-m-t-24 u-flex u-row-between ">
<view>
<text v-if="table">{{table.name}}</text>
<text v-else>不选择桌台</text>
</view>
<uni-icons type="right" color="#999" size="22"></uni-icons>
</view>
</view>
</view>
<view class="block">
<template v-if="!user">
<view class="u-p-b-24 u-m-b-24 border-bottom">
<view>用餐人数</view>
<picker @change="userNumberChange" :value="userNumbers.defaultCateIndex" :range="userNumbers.list">
<view class="u-m-t-24 u-flex u-row-between ">
<view class="color-333">{{userNumbers.defaultCateIndex||''}}</view>
<uni-icons type="right" color="#999" size="22"></uni-icons>
</view>
</picker>
</view>
</template>
<template v-else>
<view>
<view class="u-flex border-bottom u-p-b-24">
<image class="headeimg" src="@/static/uni.png" mode=""></image>
<view class="u-m-l-32">
<view class="">{{user.name}}</view>
<view class="color-main u-font-24">{{user.isVip?'永久会员':'' }}</view>
</view>
</view>
<view class="u-flex u-m-t-24 u-row-between u-font-24 color-999">
<view class="u-flex">
<view>余额</view>
<view class="color-333 u-m-l-10"> 0.00</view>
</view>
<view class="u-flex">
<view>积分</view>
<view class="color-333 u-m-l-10"> 0</view>
</view>
<view class="u-flex">
<view>已消费</view>
<view class="color-333 u-m-l-10"> 0.00</view>
</view>
</view>
</view>
</template>
</view>
<view class="block">
<view class="u-p-b-24 ">
<view class="font-bold">订单备注</view>
<view class="u-m-t-32 u-flex ">
<uni-easyinput type="textarea" v-model="note" placeholder="请输入备注"></uni-easyinput>
</view>
</view>
</view>
<view class="block">
<view class="u-flex">
<view></view>
<view class="fen font-bold">{{goodsNumber}}</view>
<view>份菜品</view>
</view>
<view class="goods u-m-t-32">
<view class="item u-m-b-40" @click="changeGoodsSel(index)" v-for="(item,index) in goods.list"
:key="index">
<view class="u-flex u-row-between">
<view class="u-flex">
<image class="img" :src="item.coverImg" mode=""></image>
<view class="u-m-l-32">
<view class="u-flex">
<view class="u-flex u-m-r-20" v-if="item.isWait">
<uni-tag text="等叫"
custom-style="background-color: #FFF0DF; border-color: #FFF0DF; color: #FF9F2E;">
</uni-tag>
</view>
<view class="u-m-r-20 u-flex" v-if="item.isGift">
<uni-tag text="赠送"
custom-style="background-color: #FFF0DF; border-color: #FFF0DF; color: #FF9F2E;">
</uni-tag>
</view>
<view class="u-m-r-20 u-flex" v-if="item.isPack">
<uni-tag
custom-style="background-color: #E6F0FF; border-color: #E6F0FF; color: #318AFE;"
size="small" text="打包" inverted type="success" />
</view>
<view>
{{item.name}}
</view>
</view>
<view class="u-font-24 color-999 u-m-t-10">{{item.specSnap||' '}}</view>
</view>
</view>
<view class="">
<view class="font-bold">
<text></text>
<text v-if="item.isGift">0</text>
<text v-else>{{formatPrice(item.salePrice*item.number) }}</text>
</view>
<view class="color-999 u-text-right u-font-24 u-m-t-12">×{{item.number}}</view>
</view>
</view>
<scroll-view scroll-x="true" v-if="index==goods.sel">
<view class="u-m-t-32 u-flex no-wrap">
<view class="u-flex u-m-r-20 u-m-b-20">
<button class="tag" hover-class="hover-class" @tap="showModel('discount')">单品打折</button>
</view>
<view class="u-flex u-m-r-20 u-m-b-20">
<!-- <button class="tag" hover-class="hover-class" @tap="showModel('giveFood')">赠菜</button> -->
<button class="tag" hover-class="hover-class"
@tap="toggleGoodsItemKey(item,index,'isGift')">{{item.isGift?'取消赠送':'赠送'}}</button>
</view>
<view class="u-flex u-m-r-20 u-m-b-20">
<button class="tag" hover-class="hover-class"
@tap="toggleGoodsItemKey(item,index,'isPack')">{{item.isPack?'取消打包':'打包'}}</button>
</view>
<!-- <view class="u-flex u-m-r-20 u-m-b-20">
<button class="tag" hover-class="hover-class"
@tap="toggleWait(item)">{{item.isWait?'取消等叫':'等叫'}}</button>
</view> -->
<view class="u-flex u-m-r-20 u-m-b-20">
<button class="tag" hover-class="hover-class" @tap="showModel('remark')">单品备注</button>
</view>
</view>
</scroll-view>
</view>
</view>
<view class="u-flex u-row-between u-m-t-30 u-p-b-34 border-bottom">
<view>
<text v-if="eatTypes.active==1">包装费</text>
<text v-else>桌位费</text>
</view>
<view>0.00</view>
</view>
<view class="u-flex u-row-right u-m-t-38">
<view class="color-main" @tap="showModel('editMoney')">修改</view>
<view class="u-flex price u-m-l-32">
<view class="">实收金额</view>
<view class="font-bold u-font-32">{{formatPrice(allPrice) }}</view>
</view>
</view>
</view>
<view style="height: 300rpx;"></view>
<view class="safe-bottom fixed">
<view>
<label class="radio">
<radio value="" class="scale7" /><text>打印预结算</text>
</label>
</view>
<view class="u-m-t-48 btn">
<my-button shape="circle" @click="createOrder">提交</my-button>
</view>
</view>
<model-discount title="菜品打折/减免" :ref="setModel" name="discount" :price="allPrice"></model-discount>
<give-food title="赠菜" :ref="setModel" name="giveFood"></give-food>
<my-remark title="单品备注" :ref="setModel" name="remark"></my-remark>
<edit-discount title="优惠金额" :ref="setModel" name="editMoney" :price="allPrice"></edit-discount>
</view>
</template>
<script setup>
import {
onLoad,onShow
} from '@dcloudio/uni-app'
import {
ref,
onBeforeUnmount,
reactive,
computed
} from 'vue';
import myButton from '@/components/my-components/my-button'
import modelDiscount from './components/discount'
import giveFood from './components/give-food'
import myRemark from './components/remark'
import editDiscount from '@/pagesCreateOrder/components/edit-discount.vue'
import go from '@/commons/utils/go.js';
import {
returnBoolean
} from '@/commons/utils/format.js';
import color from '@/commons/color.js';
import * as Api from '@/http/yskApi/Instead.js'
const models = new Map();
//备注
let note=ref('')
function setModel(el) {
if (el && el.$attrs['name']) {
models.set(el.$attrs['name'], el);
}
}
function showModel(key) {
const model = models.get(key)
model && model.open()
}
function formatPrice(n) {
return Number(n).toFixed(2)
}
//用餐人数
const userNumbers = reactive({
list: new Array(100).fill(1).map((v, index) => {
return index === 0 ? '无' : index + '人'
}),
defaultCateIndex: 1,
})
function userNumberChange(e) {
userNumbers.defaultCateIndex = e.detail.value
}
const form = reactive({})
//切换商品状态
async function toggleGoodsItemKey(item, index, key) {
const {
productId,
skuId,
id,
number
} = item
const par = {
masterId: option.masterId,
tableId: option.tableId,
productId,
num: number,
skuId
}
par[key] = !item[key]
const res = await Api.addCart(par)
goods.list[index][key] = returnBoolean(res[key])
}
//等叫
function toggleWait(item) {
item.isWait = !item.isWait
}
const eatTypes = reactive({
list: [{
label: '堂食',
value: '1'
},
{
label: '自取',
value: '2'
},
],
active: 1
})
function radioGroupChange(e) {
eatTypes.active = e.detail.value
console.log(eatTypes.active);
}
function chooseUser() {
go.to('PAGES_CHOOSE_USER')
}
function chooseTable() {
go.to('PAGES_CHOOSE_TABLE',{
...table.value
})
}
// 监听选择用户事件
let user = ref(null)
function watchChooseuser() {
uni.$off('choose-user')
uni.$on('choose-user', (data) => {
console.log(data);
user.value = data
})
}
let table = ref(null)
function watchChooseTable() {
uni.$off('choose-table')
uni.$on('choose-table', (data) => {
table.value = data
console.log(table.value);
})
}
const option = reactive({
masterId: '',
tableId: ""
})
const goods = reactive({
list: [],
sel: 0
})
const goodsNumber = computed(() => {
let result = 0
result = goods.list.reduce((prve, cur) => {
return prve + cur.number
}, 0)
return result
})
const allPrice = computed(() => {
return goods.list.reduce((prve, cur) => {
return prve + cur.salePrice * cur.number * (cur.isGift ? 0 : 1)
}, 0).toFixed(2)
})
function setGoodsItem(key, val) {
item[key] = val
}
function changeGoodsSel(index) {
goods.sel = index
}
//获取购物车数据
async function getCart(par = {
page: 0,
size: 300,
masterId: option.masterId,
tableId: option.tableId
}) {
const res = await Api.getCart(par)
goods.list = res.records.map(item => {
return {
...item,
isPack: returnBoolean(item.isPack),
isGift: returnBoolean(item.isGift)
}
})
console.log(goods.list);
}
// 创建订单
async function createOrder(par = {
masterId: option.masterId,
vipUserId:user.value?user.value.id:'',
note:note.value,
postPay:true,
orderId:'',
tableId: option.tableId
}) {
const res = await Api.$createOrder(par)
uni.showToast({
title:'提交成功',
icon:'none'
})
setTimeout(()=>{
uni.navigateBack({delta:2})
},500)
}
onLoad((opt) => {
console.log(opt);
Object.assign(option, opt)
if(opt){
table.value={
tableId:opt.tableId,
name:opt.tableName
}
}
getCart()
})
onBeforeUnmount(() => {
})
onShow(()=>{
watchChooseuser()
watchChooseTable()
})
</script>
<style lang="scss" scoped>
.fen {
color: #FF9F2E;
}
.page-gray {
padding: 32rpx 28rpx;
}
.headeimg {
width: 84rpx;
height: 84rpx;
border-radius: 12rpx 12rpx 12rpx 12rpx;
}
.block {
background-color: #fff;
padding: 32rpx 24rpx;
border-radius: 18rpx;
margin-bottom: 32rpx;
}
.textarea {
border-radius: 12rpx 12rpx 12rpx 12rpx;
padding: 32rpx 0 32rpx 24rpx;
border: 1px solid #999999;
overflow: hidden;
}
.goods {
padding-bottom: 30rpx;
border-bottom: 1px dashed #E5E5E5;
.item {
.img {
width: 84rpx;
height: 84rpx;
border-radius: 8rpx 8rpx 8rpx 8rpx;
}
}
}
.headeimg {
width: 60rpx;
height: 60rpx;
display: flex;
background-color: #eee;
border-radius: 12rpx;
overflow: hidden;
.img {
width: 60rpx;
height: 60rpx;
}
}
.price {
color: #EB4F4F;
}
.opacity0 {
opacity: 0;
}
.fixed {
position: fixed;
}
.safe-bottom {
padding: 34rpx 28rpx;
background-color: #fff;
left: 0;
right: 0;
bottom: 0;
z-index: 10;
.btn {
padding: 0 88rpx 56rpx 88rpx;
}
}
.tag {
background-color: #fff;
border: 1px solid #E5E5E5;
line-height: inherit;
font-size: 24rpx;
color: #666666;
padding: 6rpx 16rpx;
border-radius: 100rpx;
}
.hover-class {
background-color: #E5E5E5;
}
</style>