<template> <view :class="{ line: line, weight: weight }" :style="{color: '#' + incolor,fontWeight: fontWeight, display:(discount || inline) ? 'inline-block' : 'block', fontFamily: line?'Futura-Light':'Futura' }" class="base-money"> <text v-if="!discount" class="symbol" :style="{'font-size': symbolSize +'rpx'}">¥</text><text class="integer" :style="{'font-size': integerSize +'rpx'}">{{ integer }}</text> <text v-if="digits && decimal != '00' && decimal != '0'" class="decimal" :style="{'font-size': decimalSize +'rpx'}">.{{ decimal }}</text> </view> </template> <script> // +---------------------------------------------------------------------- // | CRMEB [ CRMEB赋能开发者,助力企业发展 ] // +---------------------------------------------------------------------- // | Copyright (c) 2016~2023 https://www.crmeb.com All rights reserved. // +---------------------------------------------------------------------- // | Licensed CRMEB并不是自由软件,未经许可不能去掉CRMEB相关版权 // +---------------------------------------------------------------------- // | Author: CRMEB Team <admin@crmeb.com> // +---------------------------------------------------------------------- export default { name: 'BaseMoney', props: { // 小数位数,为0则不显示 digits: { type: Number, default: 2 }, fontWeight: { type: Number | String, default: 'inherit' }, money: { type: String | Number, default: "" }, // 删除线 line: { type: Boolean, default: false }, // 粗体 weight: { type: Boolean, default: false }, incolor: { type: String, default: '424242' }, symbolSize: { type: String, default: '20' }, integerSize: { type: String, default: '26' }, decimalSize: { type: String, default: '24' }, discount: { type: Boolean, default: false }, inline: { type: Boolean, default: false } }, data() { return { integer: 0, decimal: 0 }; }, watch: { money: { handler(newValue, oldValue) { let value = Number(newValue).toFixed(this.digits); value = value.split('.'); this.integer = value[0].replace(/\B(?=(\d{3})+(?!\d))/g, ','); if (value[1]) { this.decimal = (value[1].length == 2 && value[1].charAt(1) != 0) ? value[1] : (value[1].charAt( 0) || 0); } }, immediate: true } } } </script> <style lang="scss" scoped> .base-money { font-family: Futura; &.line { .symbol,.decimal,.integer{ text-decoration: line-through; } } &.weight { font-weight: 500; } } </style>