Merge branch 'master' of http://154.209.4.10:3001/tt0101/zhunong-h5

src/App.vue

@@ -17,7 +17,7 @@ export default {
   },
   computed: {
     showTabBar() {
-      const hideTabBarRoutes = ['/login', '/register', '/profile/detail']
+      const hideTabBarRoutes = ['/login', '/register', '/profile/detail', '/culture/detail','/InvitePeople']
       return !hideTabBarRoutes.includes(this.$route.path)
     }
   }

src/api/home.js

@@ -14,4 +14,6 @@ export function getShareReward(renshu) {
     data: formData,
     loading: true
   })
-}
+}
+export const getNewsDetail = (data) => request({ url: "index/newss_datail", method: "post", data,loading:true });
+export const getNews = (data) => request({ url: "index/get_newss", method: "post", data,loading:true });

src/router/index.js

@@ -19,7 +19,8 @@ import TeamDetail from "@/views/TeamDetail.vue";
 import AssetCenter from "@/views/AssetCenter.vue";
 import OrderList from "@/views/OrderList.vue";
 import LeverList from "@/views/LeverList.vue";
-
+import CultureDetail from "@/views/cultureDetail.vue";
+import InvitePeople from '@/views/InvitePeople.vue'
 Vue.use(VueRouter);
 
 const routes = [
@@ -173,6 +174,16 @@ const routes = [
       hideTabBar: true
     }
   }
+  {
+    path: "/culture/detail",
+    name: "CultureDetail",
+    component: CultureDetail
+  },
+  {
+    path:'/InvitePeople',
+    name:'InvitePeople',
+    component:InvitePeople
+  }
 ];
 
 const router = new VueRouter({

src/views/InvitePeople.vue

@@ -0,0 +1,171 @@
+<template>
+<div>
+<div class="headers">
+      <div class="back" @click="goBack">
+        <img src="@/assets/back.png" alt="">
+      </div>
+      <div class="title">邀请百姓</div>
+    </div>
+  <div class="invite-page">
+  
+    <!-- 顶部logo和宣传语 -->
+    <div class="top-header">
+      <img class="logo" src="@/assets/hongqi.png" alt="" />
+      <div class="slogan">红旗资本·民生为本·保障一生</div>
+    </div>
+
+    <!-- 补贴金卡片列表 -->
+    <div class="card-list">
+      <div class="card" v-for="(item, idx) in cards" :key="idx">
+        <div class="card-title">{{ item.title }}</div>
+        <div class="card-table">
+          <div class="row header">
+            <span>收益率</span>
+            <span>每日获得</span>
+            <span>参与份数</span>
+          </div>
+          <div class="row">
+            <span>{{ item.rate }}</span>
+            <span>{{ item.amount }}</span>
+            <span>{{ item.count }}</span>
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+  </div>
+</template>
+
+<script>
+export default {
+  name: 'InvitePeople',
+  data() {
+    return {
+      cards: [
+        {
+          title: '初级退休补贴金',
+          rate: '10%',
+          amount: '3000元',
+          count: '1份'
+        },
+        {
+          title: '一级退休补贴金',
+          rate: '10%',
+          amount: '6000元',
+          count: '1份'
+        },
+        {
+          title: '二级退休补贴金',
+          rate: '10%',
+          amount: '10000元',
+          count: '1份'
+        },
+        {
+          title: '三级退休补贴金',
+          rate: '10%',
+          amount: '20000元',
+          count: '1份'
+        }
+      ]
+    }
+  },
+  methods:{
+    goBack() {
+      this.$router.go(-1)
+    },
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+.invite-page {
+  min-height: 100%;
+  background: url('~@/assets/dabag.png') no-repeat center center;
+  background-size: cover;
+  padding: 0px 16px 32px 16px;
+  box-sizing: border-box;
+}
+ .headers {
+    position: relative;
+    height: 44px;
+    background-color: #fff;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    border-bottom: 1px solid #eee;
+
+    .back {
+      position: absolute;
+      left: 15px;
+      font-size: 20px;
+      img{
+        width: 20px;
+        height: 20px;
+      }
+    }
+
+    .title {
+      font-size: 18px;
+      font-weight: 500;
+    }
+  }
+.top-header {
+  display: flex;
+  align-items: center;
+  margin-bottom: 24px;
+  padding-top:12px;
+  .logo {
+    width: 85px;
+    height: 58px;
+    object-fit: contain;
+    background: #fff;
+    margin-right: 16px;
+  }
+  .slogan {
+    color: #fff;
+    font-size: 16px;
+    font-weight: bold;
+    line-height: 1.3;
+    text-shadow: 0 2px 8px rgba(0,0,0,0.12);
+  }
+}
+
+.card-list {
+  display: flex;
+  flex-direction: column;
+  gap: 18px;
+}
+
+.card {
+  background: #fff;
+  overflow: hidden;
+  box-shadow: 0 2px 8px rgba(0,0,0,0.04);
+  margin-bottom: 8px;
+  .card-title {
+    background: #fdf3d0;
+    color: #000;
+    font-size: 14px;
+    font-weight: bold;
+    padding: 6px 0;
+    text-align: left;
+    padding-left: 16px;
+    border-bottom: 1px solid #f0e6d2;
+  }
+  .card-table {
+    padding: 12px 0;
+    .row {
+        display: grid;
+        grid-template-columns: 1fr 1fr 1fr;
+        align-items: center;
+        padding: 2px 10px;
+        font-size: 14px;
+        color: #000;
+        text-align: center;
+        &.header {
+        color: #333;
+        font-weight: bold;
+        }
+    }
+    }
+}
+</style>

src/views/ProfileDetail.vue

@@ -2,7 +2,8 @@
   <div class="profile-detail">
     <div class="header">
       <div class="back" @click="goBack">
-        <i class="iconfont icon-back"></i>
+        
+        <img src="@/assets/back.png" alt="">
       </div>
       <div class="title">个人详情</div>
     </div>
@@ -56,6 +57,10 @@ export default {
       position: absolute;
       left: 15px;
       font-size: 20px;
+      img{
+        width: 20px;
+        height: 20px;
+      }
     }
 
     .title {

src/views/cultureDetail.vue

@@ -0,0 +1,89 @@
+<template>
+  <div class="profile-detail">
+    <div class="header">
+      <div class="back" @click="goBack">
+        <img src="@/assets/back.png" alt="">
+      </div>
+      <div class="title">央企文化</div>
+    </div>
+    <div class="content">
+        <div class="title">{{newsDetail.title}}</div>
+        <div class="content" v-html="newsDetail.content"></div>
+    </div>
+
+  </div>
+</template>
+
+<script>
+import { getNewsDetail } from '@/api/home';
+export default {
+  name: 'ProfileDetail',
+  data() {
+    return {
+      newsDetail: {}
+    }
+  },
+  methods: {
+    goBack() {
+      this.$router.go(-1)
+    },
+    async getNewsDetail() {
+        const formData = new FormData();
+        formData.append('id', 8)
+        const res = await getNewsDetail(formData)
+        this.newsDetail = res.data
+    }
+  },
+  mounted() {
+    this.getNewsDetail()
+    console.log(this.newsDetail);
+
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+.profile-detail {
+  min-height: 100vh;
+  background-color: #f5f5f5;
+
+  .header {
+    position: relative;
+    height: 44px;
+    background-color: #fff;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    border-bottom: 1px solid #eee;
+
+    .back {
+      position: absolute;
+      left: 15px;
+      font-size: 20px;
+      img{
+        width: 20px;
+        height: 20px;
+      }
+    }
+
+    .title {
+      font-size: 18px;
+      font-weight: 500;
+    }
+  }
+
+  .content{
+    padding: 10px;
+    .title{
+      margin-bottom: 10px;
+      text-align: center;
+      font-size: 18px;
+      font-weight: 500;
+    }
+    .content{
+      font-size: 16px;
+      line-height: 24px;
+    }
+  }
+}
+</style> 

src/views/home/index.vue

@@ -2,7 +2,7 @@
   <div class="home">
     <div class="top-btns">
       <div class="row">
-        <button class="btn">邀请百姓</button>
+        <button class="btn" @click="toInvitePeople">邀请百姓</button>
         <button class="btn" @click="toOfficialGroup">官方群聊</button>
       </div>
       <div class="kefu">
@@ -10,7 +10,7 @@
       </div>
       <div class="row">
         <button class="btn" @click="toAppDownload">APP下载</button>
-        <button class="btn">央企文化</button>
+        <button class="btn" @click="toCultureDetail">央企文化</button>
       </div>
     </div>
     <div class="carousel">
@@ -46,37 +46,27 @@
       <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 class="news_content" v-html="newsList[2].content">
     </div>
+    <!-- <iframe
+      class="news-iframe"
+      src="https://www.nongfuspring.com/en/aboutus/management.html"
+      frameborder="0"
+    ></iframe> -->
     
   </div>
 </template>
 
 <script>
-import { getBanners, getUserInfo } from '@/api/home';
+import { getBanners, getUserInfo,getNews } from '@/api/home';
 import { Swipe, SwipeItem } from 'vant';
 export default {
   name: "Home",
   data() {
     return {
       banners: [],
-      userInfo: {}
+      userInfo: {},
+      newsList: [],
     };
   },
   components: {
@@ -86,6 +76,7 @@ export default {
   mounted() {
     this.getBanners();
     this.getUserInfo();
+    this.getNewsDetail()
   },
   methods: {
     async getUserInfo() {
@@ -97,13 +88,23 @@ export default {
       formData.append('cid', 5);
       const res = await getBanners(formData);
       this.banners = res.data.map(url => url.replace(/^https:/, 'http:'));
+    },
+     async getNewsDetail() {
+        const res = await getNews()
+        this.newsList = res.data
     },
     toOfficialGroup() {
       window.open(this.userInfo.link[2].value, '_blank');
     },
     toAppDownload() {
       window.open(this.userInfo.link[1].value, '_blank');
-    }
+    },
+    toCultureDetail() {
+      this.$router.push('/culture/detail');
+    },
+    toInvitePeople() {
+      this.$router.push('/InvitePeople');
+    },
   }
 };
 </script>
@@ -113,7 +114,7 @@ export default {
   height: 100%;
   width: 100%;
   background: url('~@/assets/dabag.png') no-repeat center center;
-  background-size: cover;
+  background-size: 100% 100%;
   background-position: center;
   display: flex;
   flex-direction: column;
@@ -235,4 +236,12 @@ export default {
   font-weight: bold;
   text-shadow: 0 2px 8px rgba(0,0,0,0.12);
 }
+.news_content {
+  width: 100%;
+  min-height: 450px; /* 保证在小屏下也有合适高度 */
+  border: none;
+  margin-top: 12px;
+  border-radius: 8px;
+  background: #fff;
+}
 </style>