feat: migrate app routes and business modules

components/family/FeedMedia.vue

@@ -0,0 +1,68 @@
+<template>
+  <view
+    v-if="visibleFiles.length"
+    class="feed-media"
+    :class="`feed-media--${layout}`"
+  >
+    <image
+      v-for="file in visibleFiles"
+      :key="file.fileId || file.ossId || file.accessUrl"
+      class="feed-media__image"
+      :src="file.accessUrl"
+      mode="aspectFill"
+      role="button"
+      aria-label="查看动态图片"
+      @click.stop="preview(file)"
+    />
+  </view>
+</template>
+
+<script setup>
+import { computed } from "vue";
+
+const props = defineProps({
+  files: { type: Array, default: () => [] },
+});
+
+const visibleFiles = computed(() =>
+  props.files.filter((file) => typeof file?.accessUrl === "string" && file.accessUrl),
+);
+const layout = computed(() => {
+  if (visibleFiles.value.length === 1) return "single";
+  if (visibleFiles.value.length === 2) return "double";
+  return "grid";
+});
+const preview = (file) => {
+  const urls = visibleFiles.value.map((item) => item.accessUrl);
+  if (!file?.accessUrl || !urls.length || typeof uni?.previewImage !== "function") return;
+  uni.previewImage({ current: file.accessUrl, urls });
+};
+</script>
+
+<style scoped lang="scss">
+.feed-media {
+  display: grid;
+  gap: 8rpx;
+  margin-top: 16rpx;
+  overflow: hidden;
+  border-radius: 10rpx;
+}
+.feed-media--single {
+  grid-template-columns: minmax(0, 1fr);
+}
+.feed-media--double {
+  grid-template-columns: repeat(2, minmax(0, 1fr));
+}
+.feed-media--grid {
+  grid-template-columns: repeat(3, minmax(0, 1fr));
+}
+.feed-media__image {
+  display: block;
+  width: 100%;
+  height: 190rpx;
+  background: rgba(120, 84, 48, 0.08);
+}
+.feed-media--single .feed-media__image {
+  height: 360rpx;
+}
+</style>