Initial commit: 积分兑换电商平台多商户版 MER-2.2
Made-with: Cursor
This commit is contained in:
128
mer_uniapp/pages/admin/components/BaseMoney.vue
Normal file
128
mer_uniapp/pages/admin/components/BaseMoney.vue
Normal file
@@ -0,0 +1,128 @@
|
||||
<template>
|
||||
<view :class="{ line: line, weight: weight }"
|
||||
:style="{color:color}"
|
||||
class="base-money semiBold">
|
||||
<text v-show="preFix" class="preFix" :style="{'font-size': preFixSize + 'rpx','color':textColor}">{{preFix}}</text>
|
||||
<text class="symbol" :style="{'font-size': symbolSize +'rpx'}">¥</text><text class="integer"
|
||||
:style="{'font-size': integerSize +'rpx'}">{{ integer }}</text>
|
||||
<text v-if="digits && showDigits" class="decimal semiBold"
|
||||
:style="{'font-size': decimalSize +'rpx'}">.{{ decimal }}</text>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: 'BaseMoney',
|
||||
props: {
|
||||
// 小数位数,为0则不显示
|
||||
digits: {
|
||||
type: Number,
|
||||
default: 2
|
||||
},
|
||||
money: {
|
||||
type: String | Number,
|
||||
default: ""
|
||||
},
|
||||
// 删除线
|
||||
line: {
|
||||
type: Boolean,
|
||||
default: false
|
||||
},
|
||||
// 粗体
|
||||
weight: {
|
||||
type: Boolean,
|
||||
default: false
|
||||
},
|
||||
color:{
|
||||
type: String,
|
||||
default: 'var(--view-theme)'
|
||||
},
|
||||
textColor:{
|
||||
type: String,
|
||||
default: '#999'
|
||||
},
|
||||
symbolSize: {
|
||||
type: String,
|
||||
default: '20'
|
||||
},
|
||||
integerSize: {
|
||||
type: String,
|
||||
default: '26'
|
||||
},
|
||||
decimalSize: {
|
||||
type: String,
|
||||
default: '24'
|
||||
},
|
||||
inline: {
|
||||
type: Boolean,
|
||||
default: false
|
||||
},
|
||||
preFix:{
|
||||
type: String,
|
||||
default: ''
|
||||
},
|
||||
preFixSize:{
|
||||
type: String,
|
||||
default: '24'
|
||||
},
|
||||
SemiBold:{
|
||||
type: Boolean,
|
||||
default: true
|
||||
},
|
||||
isCoupon:{
|
||||
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];
|
||||
}
|
||||
},
|
||||
immediate: true
|
||||
}
|
||||
},
|
||||
computed:{
|
||||
showDigits(){
|
||||
if(this.isCoupon){
|
||||
if(this.decimal == '00') return false
|
||||
}else{
|
||||
return true
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.base-money {
|
||||
display: inline-block;
|
||||
&.line {
|
||||
text-decoration: line-through;
|
||||
}
|
||||
|
||||
&.weight {
|
||||
font-weight: 500;
|
||||
}
|
||||
}
|
||||
.preFix{
|
||||
font-weight: 500 !important;
|
||||
}
|
||||
// .SemiBold{
|
||||
// font-family:'SemiBold';
|
||||
// }
|
||||
// .Regular{
|
||||
// font-family:'Regular';
|
||||
// }
|
||||
</style>
|
||||
Reference in New Issue
Block a user