commit
9ad2fc3b6a
@ -0,0 +1,36 @@
|
||||
<template>
|
||||
<div>
|
||||
<slot :filter="filter"> </slot>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
let cancelId;
|
||||
|
||||
export default {
|
||||
name: "AutoCompleteWrapper",
|
||||
props: {
|
||||
callback: {
|
||||
type: Function,
|
||||
},
|
||||
},
|
||||
methods: {
|
||||
filter(e) {
|
||||
clearTimeout(cancelId);
|
||||
if (
|
||||
e.target.value &&
|
||||
e.target.value.length > 1 &&
|
||||
e.code !== "Tab" &&
|
||||
e.code !== "Enter"
|
||||
) {
|
||||
cancelId = setTimeout(() => {
|
||||
this.callback(e.target.value);
|
||||
}, 400);
|
||||
}
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
<style>
|
||||
</style>
|
@ -0,0 +1,106 @@
|
||||
<template>
|
||||
<v-tooltip
|
||||
:top="top"
|
||||
:bottom="bottom"
|
||||
:left="left"
|
||||
:right="right"
|
||||
:color="tooltipColor"
|
||||
:transition="transition"
|
||||
>
|
||||
<template v-slot:activator="{ on }">
|
||||
<v-btn
|
||||
slot="activator"
|
||||
fab
|
||||
:color="buttonColor"
|
||||
:dark="dark"
|
||||
:light="light"
|
||||
v-on="on"
|
||||
@click="$emit('click')"
|
||||
:small="small"
|
||||
:large="large"
|
||||
:x-large="xLarge"
|
||||
:x-small="xSmall"
|
||||
>
|
||||
<v-icon dark>{{ icon }}</v-icon>
|
||||
</v-btn>
|
||||
</template>
|
||||
<span>{{ text }}</span>
|
||||
</v-tooltip>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: "tooltipButton",
|
||||
props: {
|
||||
icon: {
|
||||
type: String,
|
||||
default: "WMi-user",
|
||||
},
|
||||
buttonColor: {
|
||||
type: String,
|
||||
default: "black",
|
||||
},
|
||||
text: {
|
||||
type: String,
|
||||
default: "متن پیش فرض",
|
||||
},
|
||||
tooltipColor: {
|
||||
type: String,
|
||||
default: "black",
|
||||
},
|
||||
top: {
|
||||
type: Boolean,
|
||||
default: function () {
|
||||
return !this.bottom && !this.left && !this.right ? true : false;
|
||||
},
|
||||
},
|
||||
bottom: {
|
||||
type: Boolean,
|
||||
default: false,
|
||||
},
|
||||
left: {
|
||||
type: Boolean,
|
||||
default: false,
|
||||
},
|
||||
right: {
|
||||
type: Boolean,
|
||||
default: false,
|
||||
},
|
||||
transition: {
|
||||
type: String,
|
||||
default: "fade-transition",
|
||||
},
|
||||
dark: {
|
||||
type: Boolean,
|
||||
default: function () {
|
||||
return !this.light ? true : false;
|
||||
},
|
||||
},
|
||||
light: {
|
||||
type: Boolean,
|
||||
default: false,
|
||||
},
|
||||
small: {
|
||||
type: Boolean,
|
||||
default: function () {
|
||||
return !this.large && !this.xSmall && !this.xLarge ? true : false;
|
||||
},
|
||||
},
|
||||
large: {
|
||||
type: Boolean,
|
||||
default: false,
|
||||
},
|
||||
xSmall: {
|
||||
type: Boolean,
|
||||
default: false,
|
||||
},
|
||||
xLarge: {
|
||||
type: Boolean,
|
||||
default: false,
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
<style>
|
||||
</style>
|
Loading…
Reference in new issue