skytek_xinliang
41 lines
1022 B
Vue
41 lines
1022 B
Vue
<script setup lang="ts">
|
|
interface Props {
|
|
title: string
|
|
backLabel?: string
|
|
error?: string
|
|
loading?: boolean
|
|
}
|
|
|
|
withDefaults(defineProps<Props>(), {})
|
|
|
|
const emit = defineEmits<{
|
|
search: []
|
|
back: []
|
|
}>()
|
|
</script>
|
|
|
|
<template>
|
|
<v-container fluid class="pt-2 px-1">
|
|
<v-card class="mb-2">
|
|
<v-card-title class="text-title-large bg-primary">{{ title }}</v-card-title>
|
|
<v-card-text class="pa-4">
|
|
<v-alert v-if="error" class="mb-4" type="error" variant="tonal">{{ error }}</v-alert>
|
|
<v-row density="compact" align="center">
|
|
<slot name="filters" />
|
|
<v-col cols="12" md="auto" class="d-md-flex justify-md-end pr-md-2">
|
|
<v-btn color="primary" :loading="loading" @click="emit('search')">查詢</v-btn>
|
|
</v-col>
|
|
</v-row>
|
|
</v-card-text>
|
|
</v-card>
|
|
|
|
<v-card v-if="$slots.results">
|
|
<v-card-text>
|
|
<slot name="results" />
|
|
</v-card-text>
|
|
</v-card>
|
|
|
|
<slot name="sections" />
|
|
</v-container>
|
|
</template>
|