初始化

2026-06-29 10:54:33 +08:00
parent 761cee968e
commit 4983006317
156 changed files with 25687 additions and 0 deletions
@@ -0,0 +1,111 @@
+<template>
+  <view class="container">
+    <view class="card search">
+      <view class="row between">
+        <input class="ipt" v-model="kw" placeholder="搜索项目：补水/清洁/肩颈…" confirm-type="search" />
+        <view class="sbtn" @tap="kw = ''">清空</view>
+      </view>
+    </view>
+
+    <view class="card filters">
+      <scroll-view class="sc" scroll-x>
+        <view class="row">
+          <view
+            v-for="c in allCategories"
+            :key="c.id"
+            class="chip"
+            :class="{ on: c.id === activeCategoryId }"
+            @tap="setCategory(c.id)"
+          >
+            {{ c.name }}
+          </view>
+        </view>
+      </scroll-view>
+    </view>
+
+    <view class="list">
+      <ProjectCard v-for="p in filteredProjects" :key="p.id" :project="p" class="mb" />
+    </view>
+
+    <AiFloat />
+  </view>
+</template>
+
+<script>
+import AiFloat from '@/components/AiFloat.vue'
+import ProjectCard from '@/components/ProjectCard.vue'
+import { categories, projects } from '@/common/mockData'
+
+export default {
+  components: { ProjectCard, AiFloat },
+  data() {
+    return {
+      allCategories: [{ id: 'all', name: '全部' }, ...categories],
+      activeCategoryId: 'all',
+      kw: ''
+    }
+  },
+  computed: {
+    filteredProjects() {
+      const kw = (this.kw || '').trim()
+      const list = this.activeCategoryId === 'all' ? projects : projects.filter((p) => p.categoryId === this.activeCategoryId)
+      if (!kw) return list
+      return list.filter((p) => `${p.name}${p.fitFor}${p.desc}`.includes(kw))
+    }
+  },
+  methods: {
+    setCategory(id) {
+      this.activeCategoryId = id
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+.search {
+  padding: 16rpx;
+}
+.ipt {
+  flex: 1;
+  height: 76rpx;
+  padding: 0 16rpx;
+  border-radius: 18rpx;
+  background: rgba(17, 24, 39, 0.05);
+  font-size: 28rpx;
+}
+.sbtn {
+  margin-left: 12rpx;
+  padding: 18rpx 14rpx;
+  border-radius: 18rpx;
+  background: rgba(17, 24, 39, 0.06);
+  font-size: 26rpx;
+  font-weight: 800;
+}
+.filters {
+  margin-top: 16rpx;
+  padding: 16rpx;
+}
+.sc {
+  white-space: nowrap;
+}
+.chip {
+  padding: 14rpx 18rpx;
+  margin-right: 12rpx;
+  border-radius: 999rpx;
+  font-size: 26rpx;
+  background: rgba(17, 24, 39, 0.06);
+  color: #111827;
+  flex: 0 0 auto;
+}
+.on {
+  background: rgba(59, 130, 246, 0.14);
+  color: #1d4ed8;
+}
+.list {
+  margin-top: 18rpx;
+}
+.mb {
+  margin-bottom: 18rpx;
+}
+</style>
+