peizhi

src/App.vue

@@ -15,7 +15,6 @@ export default {
   },
   computed: {
     showTabBar() {
-      // Hide TabBar on login, register and profile detail pages
       const hideTabBarRoutes = ['/login', '/register', '/profile/detail']
       return !hideTabBarRoutes.includes(this.$route.path)
     }

src/api/home.js

@@ -0,0 +1,3 @@
+import request from "@/utils/request";
+//获取轮播图
+export const getBanners = (data) => request({ url: "index/get_banners", method: "post", data,loading:true });

src/store/index.js

@@ -1,6 +1,6 @@
 import Vue from "vue";
 import Vuex from "vuex";
-import { getUser, login } from "@/api/login";
+import { login } from "@/api/login";
 import { getToken, removeToken, setToken } from "../utils/auth";
 Vue.use(Vuex);
 
@@ -26,10 +26,10 @@ export default new Vuex.Store({
       return new Promise((resolve, reject) => {
         login(userInfo)
           .then(res => {
-            setToken(res.data.token);
-            commit("SET_TOKEN", res.data.token);
-            commit("SET_USER", res.data);
-            resolve();
+            setToken(res.data.userinfo.token);
+            commit("SET_TOKEN", res.data.userinfo.token);
+            commit("SET_USER", res.data.userinfo);
+            resolve(res.data.userinfo);
           })
           .catch(error => {
             reject(error);
@@ -37,17 +37,8 @@ export default new Vuex.Store({
       });
     },
     // 获取登录用户信息
-    GetUser({ commit }) {
-      return new Promise((resolve, reject) => {
-        getUser()
-          .then(res => {
-            commit("SET_USER", res.data);
-            resolve();
-          })
-          .catch(error => {
-            reject(error);
-          });
-      });
+    GetUser() {
+      console.log(1111111);
     },
     // 登出
     Logout({ commit }) {

src/utils/auth.js

@@ -1,15 +1,13 @@
-import Cookies from "js-cookie";
-
-const TokenKey = "token";
+const TokenKey = 'token';
 
 export function getToken() {
-  return Cookies.get(TokenKey);
+  return localStorage.getItem(TokenKey);
 }
 
 export function setToken(token) {
-  return Cookies.set(TokenKey, token);
+  return localStorage.setItem(TokenKey, token);
 }
 
 export function removeToken() {
-  return Cookies.remove(TokenKey);
+  return localStorage.removeItem(TokenKey);
 }

src/views/home/index.vue

@@ -1,59 +1,222 @@
 <template>
   <div class="home">
-    <h1>2222222222</h1>
-    <h1>2222222222</h1>
-    <h1>2222222222</h1>
-    <h1>2222222222</h1>
-    <h1>2222222222</h1>
-    <h1>2222222222</h1>
-    <h1>2222222222</h1>
-    <h1>2222222222</h1>
-    <h1>2222222222</h1>
-    <h1>2222222222</h1>
-    <h1>2222222222</h1>
-    <h1>2222222222</h1>
-    <h1>2222222222</h1>
-    <h1>2222222222</h1>
-    <h1>2222222222</h1>
-    <h1>2222222222</h1>
-    <h1>2222222222</h1>
-    <h1>2222222222</h1>
-    <h1>2222222222</h1>
-    <h1>2222222222</h1>
-    <h1>2222222222</h1>
-    <h1>2222222222</h1>
-    <h1>2222222222</h1>
-    <h1>2222222222</h1>
-    <h1>2222222222</h1>
-    <h1>2222222222</h1>
-    <h1>2222222222</h1>
-    <h1>2222222222</h1>
-    <h1>2222222222</h1>
-    <h1>2222222222</h1>
-    <h1>2222222222</h1>
-    <h1>2222222222</h1>
+    <div class="top-btns">
+      <div class="row">
+        <button class="btn">邀请百姓</button>
+        <button class="btn">APP下载</button>
+      </div>
+      <div class="kefu-box">
+        <img src="@/assets/kefu.png" alt="客服" />
+      </div>
+      <div class="row">
+        <button class="btn">党员申请</button>
+        <button class="btn">党员申请</button>
+      </div>
+    </div>
+    <div class="avatar-box">
+      <img class="avatar" src="" alt="客服" />
+    </div>
+    <div class="carousel">
+      <van-swipe
+        :autoplay="3000"
+        indicator-color="#ed4b39"
+        style="width: 100%; height: 80px; border-radius: 8px; overflow: hidden;"
+      >
+        <van-swipe-item v-for="(banner, index) in banners" :key="index">
+          <img
+            :src="banner"
+            alt="轮播图"
+            style="width: 100%; height: 80px; object-fit: cover;"
+          />
+        </van-swipe-item>
+      </van-swipe>
+    </div>
+    <div class="reward-section">
+      <div class="reward-table">
+        <div class="reward-row header">
+          <span>团队奖励</span>
+          <span>一级</span>
+          <span>二级</span>
+          <span>三级</span>
+        </div>
+        <div class="reward-row">
+          <span></span>
+          <span>20%</span>
+          <span>10%</span>
+          <span>5%</span>
+        </div>
+      </div>
+      <button class="party-btn">党员申请</button>
+    </div>
+    <div class="news-title">新闻中心</div>
+    <div class="news-list">
+      <div class="news-item">
+        <div class="news-item-title">
+          <span>新闻标题</span>
+        </div>
+      </div>
+      <div class="news-item">
+        <div class="news-item-title">
+          <span>新闻标题</span>
+        </div>
+      </div>
+      <div class="news-item">
+        <div class="news-item-title">
+          <span>新闻标题</span>
+        </div>
+      </div>
+      
+    </div>
+    
   </div>
 </template>
+
 <script>
+import { getBanners } from '@/api/home';
+import { Swipe, SwipeItem } from 'vant';
 export default {
-  
+  name: "Home",
   data() {
     return {
+      banners: []
     };
   },
- 
+  components: {
+    [Swipe.name]: Swipe,
+    [SwipeItem.name]: SwipeItem,
+  },
+  mounted() {
+    this.getBanners();
+  },
   methods: {
-   
-    
+    async getBanners() {
+      const formData = new FormData();
+      formData.append('cid', 5);
+      const res = await getBanners(formData);
+      this.banners = res.data.map(url => url.replace(/^https:/, 'http:'));
+      console.log(this.banners);
+    }
   }
 };
 </script>
+
 <style lang="scss" scoped>
 .home {
-  width: 100%;
   height: 100%;
+  width: 100%;
   background: url('~@/assets/dabag.png') no-repeat center center;
-  background-size: 100% 100%;
+  background-size: cover;
   background-position: center;
+  display: flex;
+  flex-direction: column;
+  padding: 18px;
+  box-sizing: border-box;
+}
+
+.top-btns {
+  width: 90%;
+  margin: 60px auto 16px auto;
+  .row {
+    display: flex;
+    justify-content: center;
+    gap: 24px;
+    margin-bottom: 12px;
+  }
+  .btn {
+    width: 120px;
+    height: 36px;
+    background: #fff;
+    border: none;
+    border-radius: 6px;
+    font-size: 16px;
+    color: #b20000;
+    font-weight: 500;
+    box-shadow: 0 2px 8px rgba(0,0,0,0.04);
+    cursor: pointer;
+    transition: background 0.2s;
+    &:hover {
+      background: #ffeaea;
+    }
+  }
+}
+
+.avatar-box {
+  display: flex;
+  justify-content: center;
+  margin-bottom: 16px;
+  .avatar {
+    width: 80px;
+    height: 80px;
+    border-radius: 50%;
+    object-fit: cover;
+    background: #fff;
+    border: 2px solid #fff;
+  }
+}
+
+.carousel {
+  width: 100%;
+  max-width: 500px;
+  margin: 0 auto 16px auto;
+  height: 80px;
+  background: #fff;
+  border-radius: 8px;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  font-size: 20px;
+  color: #b20000;
+  font-weight: 500;
+  box-shadow: 0 2px 8px rgba(0,0,0,0.04);
+}
+
+.reward-section {
+  width: 90%;
+  background: #fff;
+  border-radius: 8px;
+  margin: 0 auto 16px auto;
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  padding: 12px 16px;
+  box-shadow: 0 2px 8px rgba(0,0,0,0.04);
+
+  .reward-table {
+    flex: 1;
+    .reward-row {
+      display: flex;
+      justify-content: space-between;
+      font-size: 15px;
+      color: #b20000;
+      margin-bottom: 2px;
+      &.header {
+        font-weight: bold;
+      }
+    }
+  }
+  .party-btn {
+    background: #ed4b39;
+    color: #fff;
+    border: none;
+    border-radius: 20px;
+    padding: 8px 18px;
+    font-size: 15px;
+    font-weight: 500;
+    margin-left: 12px;
+    cursor: pointer;
+    transition: background 0.2s;
+    &:hover {
+      background: #c9301c;
+    }
+  }
+}
+
+.news-title {
+  width: 90%;
+  margin: 24px auto 0 auto;
+  color: #fff;
+  font-size: 20px;
+  font-weight: bold;
+  text-shadow: 0 2px 8px rgba(0,0,0,0.12);
 }
 </style>

src/views/login.vue

@@ -77,6 +77,7 @@ export default {
         };
         await this.$store.dispatch("Login", data);
         this.isRotate = false;
+       
         this.$router.replace("home");
       } catch (error) {
         this.isRotate = false;