2919ce45b8
Include recent Magic app work: Tauri native shell, iOS device detection via supervise-magic sidecar, MDM client, local HTTP server, new pages (detect, enroll, supervise, sideload, pair, preflight, configure, done), and updated device section/status UI.
44 lines
1.1 KiB
Vue
44 lines
1.1 KiB
Vue
<template>
|
|
<button
|
|
class="w-full text-left"
|
|
@click="toggle"
|
|
>
|
|
<div
|
|
class="flex items-start gap-3 p-4 rounded-xl transition-colors"
|
|
:class="checked || auto ? 'bg-green-50/50 ring-1 ring-green-100' : 'bg-gray-50 hover:bg-gray-100'"
|
|
>
|
|
<UIcon
|
|
:name="checked || auto ? 'i-heroicons-check-circle-solid' : 'i-heroicons-circle'"
|
|
class="w-6 h-6 shrink-0"
|
|
:class="checked || auto ? 'text-green-600' : 'text-gray-400'"
|
|
/>
|
|
<div>
|
|
<div class="font-bold text-gray-900">{{ title }}</div>
|
|
<div class="text-sm text-gray-500 mt-0.5">{{ detail }}</div>
|
|
<div v-if="auto && !checked" class="text-xs text-green-600 font-semibold mt-1">
|
|
Automatisch erkannt ✓
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</button>
|
|
</template>
|
|
|
|
<script setup lang="ts">
|
|
const props = defineProps<{
|
|
modelValue: boolean;
|
|
title: string;
|
|
detail: string;
|
|
auto?: boolean;
|
|
}>();
|
|
|
|
const emit = defineEmits<{
|
|
(e: "update:modelValue", value: boolean): void;
|
|
}>();
|
|
|
|
const checked = computed(() => props.modelValue || props.auto);
|
|
|
|
function toggle() {
|
|
emit("update:modelValue", !props.modelValue);
|
|
}
|
|
</script>
|