项目初始化

2025-01-21 01:46:34 +08:00
parent 364021b042
commit 48153e7761
962 changed files with 172070 additions and 0 deletions
--- a/sheep/components/s-tabbar/s-tabbar.vue
+++ b/sheep/components/s-tabbar/s-tabbar.vue
@@ -0,0 +1,90 @@
+<template>
+  <view class="u-page__item" v-if="tabbar?.items?.length > 0">
+    <su-tabbar
+      :value="path"
+      :fixed="true"
+      :placeholder="true"
+      :safeAreaInsetBottom="true"
+      :inactiveColor="tabbar.style.color"
+      :activeColor="tabbar.style.activeColor"
+      :midTabBar="tabbar.mode === 2"
+      :customStyle="tabbarStyle"
+    >
+      <su-tabbar-item
+        v-for="(item, index) in tabbar.items"
+        :key="item.text"
+        :text="item.text"
+        :name="item.url"
+        :isCenter="getTabbarCenter(index)"
+        :centerImage="sheep.$url.cdn(item.iconUrl)"
+        @tap="sheep.$router.go(item.url)"
+      >
+        <template v-slot:active-icon>
+          <image class="u-page__item__slot-icon" :src="sheep.$url.cdn(item.activeIconUrl)"></image>
+        </template>
+        <template v-slot:inactive-icon>
+          <image class="u-page__item__slot-icon" :src="sheep.$url.cdn(item.iconUrl)"></image>
+        </template>
+      </su-tabbar-item>
+    </su-tabbar>
+  </view>
+</template>
+
+<script setup>
+  import { computed, unref } from 'vue';
+  import sheep from '@/sheep';
+
+  const tabbar = computed(() => {
+    return sheep.$store('app').template.basic?.tabbar;
+  });
+
+  const tabbarStyle = computed(() => {
+    const backgroundStyle = tabbar.value.style;
+    if (backgroundStyle.bgType === 'color') {
+      return { background: backgroundStyle.bgColor };
+    }
+    if (backgroundStyle.bgType === 'img')
+      return {
+        background: `url(${sheep.$url.cdn(
+          backgroundStyle.bgImg,
+        )}) no-repeat top center / 100% auto`,
+      };
+  });
+
+  const getTabbarCenter = (index) => {
+    if (unref(tabbar).mode !== 2) return false;
+    return unref(tabbar).items % 2 > 0
+      ? Math.ceil(unref(tabbar).items.length / 2) === index + 1
+      : false;
+  };
+
+  const props = defineProps({
+    path: String,
+    default: '',
+  });
+</script>
+
+<style lang="scss">
+  .u-page {
+    padding: 0;
+
+    &__item {
+      &__title {
+        color: var(--textSize);
+        background-color: #fff;
+        padding: 15px;
+        font-size: 15px;
+
+        &__slot-title {
+          color: var(--textSize);
+          font-size: 14px;
+        }
+      }
+
+      &__slot-icon {
+        width: 25px;
+        height: 25px;
+      }
+    }
+  }
+</style>