mirror of
https://github.com/IT4Change/gradido.git
synced 2025-12-13 07:45:54 +00:00
59 lines
1.2 KiB
Vue
59 lines
1.2 KiB
Vue
<template>
|
|
<card class="card-stats" :show-footer-line="true">
|
|
<b-row>
|
|
<b-col>
|
|
<slot>
|
|
<h5 class="card-title text-uppercase text-muted mb-0" v-if="title">
|
|
{{ title }}
|
|
</h5>
|
|
<span class="h2 font-weight-bold mb-0" v-if="subTitle">
|
|
{{ subTitle }}
|
|
</span>
|
|
</slot>
|
|
</b-col>
|
|
|
|
<b-col cols="auto" v-if="$slots.icon || icon">
|
|
<slot name="icon">
|
|
<div
|
|
class="icon icon-shape text-white rounded-circle shadow"
|
|
:class="[`bg-${type}`, iconClasses]"
|
|
>
|
|
<i :class="icon"></i>
|
|
</div>
|
|
</slot>
|
|
</b-col>
|
|
<b-col cols="auto" v-if="$slots.img || img">
|
|
<slot name="img">
|
|
<img :src="img" width="80" />
|
|
</slot>
|
|
</b-col>
|
|
</b-row>
|
|
|
|
<p class="mt-3 mb-0 text-sm">
|
|
<slot name="footer"></slot>
|
|
</p>
|
|
</card>
|
|
</template>
|
|
<script>
|
|
import Card from "./Card.vue";
|
|
|
|
export default {
|
|
name: "stats-card",
|
|
components: {
|
|
Card
|
|
},
|
|
props: {
|
|
type: {
|
|
type: String,
|
|
default: "primary"
|
|
},
|
|
icon: String,
|
|
img: String,
|
|
title: String,
|
|
subTitle: String,
|
|
iconClasses: [String, Array]
|
|
}
|
|
};
|
|
</script>
|
|
<style></style>
|