Aurora Admin v1.2.0: 79 components x 5 ends, doc site, contracts batch 1, playground, regression, deploy ready

frameworks/LayoutSwitcher.vue3.vue

@@ -0,0 +1,37 @@
+<template>
+  <div class="aa-layoutsw">
+    <div
+      v-for="o in options"
+      :key="o.value"
+      class="aa-layoutsw-opt"
+      :class="{ 'is-active': modelValue === o.value }"
+      @click="emit('update:modelValue', o.value)"
+    >
+      <div class="aa-layoutsw-mini">
+        <div v-if="o.value !== 'side'" class="s-top"></div>
+        <div class="s-body">
+          <div v-if="o.value !== 'top'" class="s-side"></div>
+          <div class="s-main"></div>
+        </div>
+      </div>
+      <div class="aa-layoutsw-label">{{ o.label }}</div>
+    </div>
+  </div>
+</template>
+
+<script setup>
+defineProps({
+  modelValue: { type: String, default: 'side' },
+  options: {
+    type: Array,
+    default: () => [
+      { value: 'side', label: '侧边布局' },
+      { value: 'top', label: '顶部布局' },
+      { value: 'mixed', label: '混合布局' }
+    ]
+  }
+});
+const emit = defineEmits(['update:modelValue']);
+</script>
+
+<style src="./LayoutSwitcher.css"></style>