init

src/views/index/index.vue

@@ -0,0 +1,68 @@
+<template>
+<!--  <div style="background: linear-gradient(167.96deg, #E6FAE1 0%, #F2E7B7 98.44%) no-repeat;min-height: 100%" >-->
+  <div>
+
+    <router-view />
+
+    <van-tabbar route v-model="active" active-color="#F9BF3A">
+      <van-tabbar-item v-for="tabBar in tabBarList" :key="tabBar.name" :replace="tabBar.replace" :to="tabBar.to">
+        <span>{{ tabBar.text }}</span>
+        <template #icon="props">
+          <van-icon :color="props.active ? '' : 'rgb(229, 229, 229)'" :name="props.active ? tabBar.active : tabBar.inactive" />
+        </template>
+      </van-tabbar-item>
+    </van-tabbar>
+  </div>
+</template>
+
+<script setup lang="ts">
+import {ref} from "vue";
+import JGap from "@/components/JGap/JGap.vue";
+import {getAssetsImages} from "@/utils";
+import {useBackgroundHook} from "@/hooks/useBackgroundHook";
+
+const tabBarList = [
+  {
+    to: '/home',
+    name: 'home',
+    text: '首页',
+    replace: true,
+    active: getAssetsImages('tabBar/home-active.png'),
+    inactive: getAssetsImages('tabBar/home-inactive.png')
+  },
+  {
+    to: '/serveList',
+    name: 'serveList',
+    text: '钱包',
+    replace: true,
+    active: getAssetsImages('tabBar/artificer-active.png'),
+    inactive: getAssetsImages('tabBar/artificer-inactive.png')
+  },
+  {
+    to: '/message',
+    name: 'message',
+    text: '客服',
+    replace: true,
+    active: 'chat',
+    inactive: 'chat'
+  },
+  {
+    to: '/my',
+    name: 'my',
+    text: '我的',
+    replace: true,
+    active: getAssetsImages('tabBar/my-active.png'),
+    inactive: getAssetsImages('tabBar/my-inactive.png')
+  }
+]
+
+const active = ref(0)
+
+// const {setBodyBackground} = useBackgroundHook()
+// setBodyBackground()
+</script>
+
+
+<style scoped>
+
+</style>