mirror of
https://bitbucket.org/studiotem/jandl-taskmanager-app.git
synced 2026-10-21 14:29:34 +00:00
85 lines
1.4 KiB
Vue
85 lines
1.4 KiB
Vue
<template>
|
|
<v-row class="px-10 py-8 subheader">
|
|
<v-select
|
|
v-model="selectedEmployee"
|
|
class="subheader-input"
|
|
variant="outlined"
|
|
:items="allEmployees"
|
|
label="Zamestanec"
|
|
></v-select>
|
|
<v-text-field
|
|
v-model="searchQuery"
|
|
class="subheader-input"
|
|
variant="outlined"
|
|
placeholder="Vyhľadávanie"
|
|
prepend-inner-icon="mdi-magnify"
|
|
@input="onInput"
|
|
type="text"
|
|
></v-text-field>
|
|
</v-row>
|
|
</template>
|
|
|
|
<script>
|
|
export default {
|
|
data() {
|
|
return {
|
|
selectedEmployee: '',
|
|
employees: [],
|
|
searchQuery: ''
|
|
}
|
|
},
|
|
|
|
async created() {
|
|
try {
|
|
this.employees = await this.$axios.get_auth_data('v1/employees')
|
|
} catch (error) {
|
|
console.log(error)
|
|
}
|
|
},
|
|
|
|
methods: {
|
|
onInput() {
|
|
this.$emit('queryChange', this.searchQuery)
|
|
}
|
|
},
|
|
|
|
computed: {
|
|
allEmployees() {
|
|
const employees = this.employees.map((employee) => {
|
|
return `${employee.name} ${employee.surname}`
|
|
})
|
|
return employees
|
|
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style lang="sass" scoped>
|
|
.subheader
|
|
max-width: 100%
|
|
margin: 0
|
|
border-bottom: 1px solid rgba(33, 33, 33, 0.08)
|
|
gap: 25px
|
|
flex-wrap: wrap
|
|
flex: 0 0 auto
|
|
.subheader-input
|
|
max-width: 250px !important
|
|
min-width: 250px
|
|
height: 56px
|
|
|
|
&:deep(.v-input__details)
|
|
display: none
|
|
|
|
&.disabled
|
|
pointer-events: none !important
|
|
|
|
@media (max-width: 600px)
|
|
.subheader
|
|
gap: 15px
|
|
padding: 20px !important
|
|
|
|
.subheader-input
|
|
max-width: 100% !important
|
|
min-width: 100%
|
|
</style> |