feat: style选择

src/views/home/components/style.ts

@@ -0,0 +1,59 @@
+const sofaImages = import.meta.glob('@/assets/images/sofa/*.png', { eager: true })
+const deskImages = import.meta.glob('@/assets/images/desk/*.png', { eager: true })
+const chairImages = import.meta.glob('@/assets/images/chair/*.png', { eager: true })
+
+const imagesMaps = {
+	sofa: sofaImages,
+	desk: deskImages,
+	chair: chairImages
+}
+
+function slugify(str) {
+	return str
+		.toLowerCase()
+		.trim()
+		.replace(/['"]/g, '') // 去掉撇号
+		.replace(/[^a-z0-9\s-]+/g, '') // 只保留字母数字空格-
+		.replace(/\s+/g, '-') // 空格转 -
+		.replace(/-+/g, '-')
+}
+
+/**
+ * 动态获取风格对应的图片 URL
+ * @param { 'sofa' | 'desk' | 'chair' } type
+ * @param { string } style   // 必须和 styleList 里的字符串完全一致
+ * @returns { string | null }  返回可直接用于 <img :src=""> 的 URL
+ */
+export function getStyleImage(types, style) {
+  
+  if (!types) types = 'Sofa'
+	const type = types.toLowerCase()
+	const map = imagesMaps[type]
+  
+	const fileName = `${slugify(style)}.png`
+	const key = `/src/assets/images/${type}/${fileName}`
+  console.log('types',types, 'style',style, 'fileName',fileName, 'key',key);
+
+	if (map[key]) {
+		return map[key].default
+	}
+	return ''
+}
+
+const styleList = [
+	'Venetian Modern',
+	'Coastal',
+	'Maximalism',
+	'Memphis',
+	'Verdant',
+	'Century Chrome',
+	'Modern Revival',
+	'Transitional',
+	"Tuscan 2000's",
+	'Kitsch-core',
+	'Bauhaus',
+	'Constructivism',
+	'Nordic Noir',
+	'Dopamine',
+	'Squiggle'
+]