佰川加油

BagMoney/components/oil-card/oil-card.vue

@@ -0,0 +1,80 @@
+<template>
+	<view>
+		<view class="bg-img  flex align-center"
+			:style="'background-image: url('+imgURL+ (card.oilCardType==2?'card-zs.png':'card-other.png')+');'">
+			<view class="padding-xl text-white">
+				<view class="padding-xs  text-bold">
+				<!-- 	<text v-show="card.oilCardType==2">
+						直属油卡
+					</text>
+					<text v-show="card.oilCardType==3">
+						外请油卡
+					</text>
+					<text v-show="card.oilCardType==1">
+						个人油卡
+					</text> -->
+					油豆
+				</view>
+				<view class="padding-xs padding-top-lg padding-bottom text-xxl">
+					{{card.accountCardCode|cardNoFormat}}
+				</view>
+				<view class="padding-xs" v-if="card.companyId">
+					{{card.companyName}}
+				</view>
+				
+				<view class="padding-xs text-lg">
+					<text class="text-df">账户余额:</text>
+					<text class="text-xl text-bold padding-left-xs" v-if="card.shareCompanyQuota==1">
+						共享余额
+					</text>
+					<text class="text-xl text-bold padding-left-xs" v-else>
+						{{card.balance|moneyFormat}} 个
+					</text>
+				</view>
+			</view>
+		</view>
+	</view>
+</template>
+
+<script>
+	export default {
+		props: {
+			card: {
+				type: Object,
+				default () {}
+			}
+		},
+		data() {
+			return {
+				imgURL: this.global.imgURL,
+			}
+		},
+		methods: {
+
+		},
+		filters:{
+			moneyFormat(value) {
+				if (value) {
+					return value.toFixed(2)
+				} else {
+					return '0.00'
+				}
+			},
+			cardNoFormat(value) {
+				if (value) {
+					return value.replace(/(.{4})/g,'$1 ')
+				}
+			}
+		}
+	}
+</script>
+
+<style scoped>
+	.bg-img {
+		background-position: inherit;
+		background-size: cover;
+	}
+	.hidden-2{
+		opacity: 0;
+	}
+</style>