feat(P4): precompute移植+app.js sources双向回填+回归1003/1003+验收体积/文件/data.json

2026-09-12 14:18:41 +08:00
parent 16f365a045
commit c65a69c34e
401 changed files with 22932 additions and 140 deletions
@@ -0,0 +1,43 @@
+<template>
+  <div class="aa-segmented">
+    <button
+      v-for="opt in options" :key="opt.value"
+      class="aa-segmented-item"
+      :class="{ 'is-active': modelValue === opt.value, 'is-disabled': opt.disabled }"
+      :disabled="opt.disabled"
+      @click="choose(opt)"
+    >
+      <span v-if="opt.icon" class="ico">{{ opt.icon }}</span>
+      {{ opt.label }}
+    </button>
+  </div>
+</template>
+
+<script setup>
+const props = defineProps({
+  modelValue: { type: [String, Number], default: '' },
+  options: { type: Array, required: true }   // [{ label, value, icon?, disabled? }]
+});
+const emit = defineEmits(['update:modelValue', 'change']);
+
+function choose(opt) {
+  if (opt.disabled) return;
+  emit('update:modelValue', opt.value);
+  emit('change', opt.value);
+}
+</script>
+
+<!-- 样式对齐 组件2.txt Segmented 规范 -->
+<style scoped>
+.aa-segmented {
+  display: inline-flex; align-items: center; background: #F5F7FA; border-radius: 4px; padding: 2px;
+}
+.aa-segmented-item {
+  height: 28px; padding: 0 16px; display: inline-flex; align-items: center; gap: 6px;
+  border-radius: 4px; cursor: pointer; font-size: 14px; color: #262626; border: none; background: none;
+  transition: background .15s, color .15s;
+}
+.aa-segmented-item:hover:not(.is-active):not(.is-disabled) { color: #2F54EB; }
+.aa-segmented-item.is-active { background: #fff; color: #262626; box-shadow: 0 1px 2px rgba(0,0,0,0.08); font-weight: 500; }
+.aa-segmented-item.is-disabled { color: #BFBFBF; cursor: not-allowed; }
+</style>