修复前端迁移后的类型错误

2026-06-04 11:07:34 +08:00
parent eb6aed7e56
commit 75e849a91a
23 changed files with 1561 additions and 29 deletions
@@ -0,0 +1,73 @@
+<script setup lang="ts">
+const props = withDefaults(
+  defineProps<{
+    options: Array<string | number>
+    modelValue?: string | number
+    activeValues?: Array<string | number>
+    keyPrefix?: string
+    compact?: boolean
+    suffix?: string
+  }>(),
+  {
+    modelValue: undefined,
+    activeValues: () => [],
+    keyPrefix: '',
+    compact: false,
+    suffix: '',
+  },
+)
+
+const emit = defineEmits<{
+  select: [value: string | number]
+}>()
+
+function isActive(value: string | number) {
+  return props.activeValues.includes(value) || props.modelValue === value
+}
+</script>
+
+<template>
+  <div class="option-chips" :class="{ compact }">
+    <button
+      v-for="option in options"
+      :key="`${keyPrefix}${option}`"
+      type="button"
+      :class="{ active: isActive(option) }"
+      @click="emit('select', option)"
+    >
+      {{ option }}{{ suffix }}
+    </button>
+  </div>
+</template>
+
+<style scoped>
+.option-chips {
+  display: flex;
+  flex-wrap: wrap;
+  gap: 8px;
+}
+
+.option-chips button {
+  min-height: 34px;
+  padding: 0 14px;
+  border: 1px solid #dbe3ee;
+  border-radius: 8px;
+  background: #fff;
+  color: #334155;
+  font-size: 13px;
+  font-weight: 600;
+  cursor: pointer;
+  transition: border-color 0.15s, background 0.15s, color 0.15s;
+}
+
+.option-chips.compact button {
+  min-height: 30px;
+  padding: 0 10px;
+}
+
+.option-chips button.active {
+  border-color: #2563eb;
+  background: #eff6ff;
+  color: #1d4ed8;
+}
+</style>