退休计划

src/api/home.js

@@ -26,4 +26,6 @@ export const getTong = (data) => request({ url: "index/gettong", method: "post",
 export const getChongInfo = (params) => request({ url: "index/get_chong_info", method: "get", params,loading:true });
 // 党员申请 
 export const applyDangyuan = (data) => request({ url: "user/apply_dangyuan", method: "post", data,loading:true });
+// 参与退休计划 
+export const joinRetirement = (data) => request({ url: "/user/join_retirement", method: "post", data,loading:true });
 

src/components/TabBar.vue

@@ -37,7 +37,9 @@ export default {
           iconActive: 'hang1.png'
         },
         {
-          path: '/dynamic',
+          path: '/dynamic', //邀请百姓
+          // path: '/China', // 红旗中国
+          // path: '/Medical', // 红旗医疗
           title: '邀请百姓',
           icon: 'gang0.png',
           iconActive: 'gang1.png'

src/router/index.js

@@ -23,8 +23,11 @@ import CultureDetail from "@/views/cultureDetail.vue";
 import InvitePeople from '@/views/InvitePeople.vue'
 import Apply from '@/views/Apply.vue'
 import RetirementSubsidy from '@/views/RetirementSubsidy.vue'
-
 import Payment from '@/views/Payment.vue'
+// 红旗医疗 后期直接替换邀请百姓
+import Medical from '@/views/Medical.vue'
+// 红旗中国 后期邀请百姓直接替换
+import China from '@/views/China.vue'
 Vue.use(VueRouter);
 
 const routes = [
@@ -47,6 +50,16 @@ const routes = [
     name: "Dynamic",
     component: Dynamic
   },
+  {
+    path: "/China",
+    name: "China",
+    component: China
+  },
+  {
+    path: "/Medical",
+    name: "Medical",
+    component: Medical
+  },
   {
     path: "/profile",
     name: "Profile",
@@ -216,7 +229,7 @@ const routes = [
     component: Payment,
     meta: {
       hideTabBar: true
-  },Payment
+  },
 }
 ];
 

src/views/China.vue

@@ -0,0 +1,90 @@
+<template>
+  <div class="usremei-container">
+    <div class="invite-header">
+      红旗资本医疗补贴
+    </div>
+    <div class="invite-list">
+      <div class="invite-item">
+        <div class="item_header">
+
+        </div>
+        <div class="item_body"></div>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+import { getShareccb } from '@/api/profile';
+
+export default {
+  name: 'Dynamic',
+  data() {
+    return {
+      rewards: [
+        { renshu: 5, title: '邀请5人实名认证', reward: '奖励60000元红旗资产' },
+        { renshu: 10, title: '邀请10人实名认证', reward: '奖励150000元红旗资产' },
+        { renshu: 20, title: '邀请20人实名认证', reward: '奖励300000元红旗资产' },
+        { renshu: 50, title: '邀请50人实名认证', reward: '奖励800000元红旗资产' },
+        { renshu: 100, title: '邀请100人实名认证', reward: '奖励1800000元红旗资产' },
+        { renshu: 150, title: '邀请150人实名认证', reward: '获得国家神秘奖励' }
+      ]
+    }
+  },
+  methods: {
+    async receiveReward(renshu) {
+      try {
+        const res = await getShareccb(renshu);
+        alert(res.data.msg);
+      } catch (e) {
+        // 接口异常时不弹窗
+      }
+    }
+  }
+}
+</script>
+
+<style scoped>
+.usremei-container {
+  min-height: 100vh;
+  background-image: url('../assets/dabag.png');
+  background-size: cover;
+  background-position: center;
+  padding-top: 60px;
+  padding-bottom: 80px;
+  box-sizing: border-box;
+  overflow-y: auto;
+  position: relative;
+}
+
+.invite-header {
+  background: #ffeddf;
+  color: #f11859;
+  font-size: 24px;
+  font-weight: bold;
+  text-align: center;
+  margin: 0 auto 30px auto;
+  padding: 20px 0 10px 0;
+  width: 90%;
+  box-shadow: 0 4px 16px rgba(208,2,27,0.08);
+  letter-spacing: 2px;
+}
+
+.invite-list {
+  width: 90%;
+  margin: 0 auto;
+}
+
+.invite-item {
+  margin-bottom: 22px;
+  width:100%;
+  height:100px;
+  background:#000;
+  padding-left:20px;
+}
+.item_header{
+    height:30px;
+    background:#a30100;
+}
+
+</style> 

src/views/Mall.vue

@@ -29,7 +29,12 @@
           <div class="plan-value">{{ item.power }}%</div>
         </div>
         <div class="plan-col-btn">
-          <button class="plan-btn" @click="toPayment(item)">立即参与</button>
+          <button 
+            class="plan-btn" 
+            :class="{ 'disabled': !canClick(item) }"
+            @click="canClick(item) && toPayment(item)"
+            :disabled="!canClick(item)"
+          >立即参与</button>
         </div>
       </div>
     </div>
@@ -37,16 +42,57 @@
 </template>
 
 <script>
-import {getMiner} from '@/api/home.js'
+import {getMiner,getUserInfo,joinRetirement} from '@/api/home.js'
 export default {
   name: 'Mall',
   data() {
     return {
       plans: [
-      ]
+          {
+              "id": 1,
+              "type": 1,
+              "title": "初级退休补贴金",
+              "money": "30000",
+              "rent_cycle": 1825,
+              "computing_power": "3000",
+              "power": "10",
+          },
+          {
+              "id": 2,
+              "type": 2,
+              "title": "一级退休补贴金",
+              "money": "60000",
+              "rent_cycle": 1825,
+              "computing_power": "6000",
+              "power": "10",
+          },
+          {
+              "id": 3,
+              "type": 3,
+              "title": "二级退休补贴金",
+              "money": "100000",
+              "rent_cycle": 1825,
+              "computing_power": "10000",
+              "power": "10",
+          },
+          {
+              "id": 4,
+              "type": 4,
+              "title": "三级退休补贴金",
+              "money": "200000",
+              "rent_cycle": 1825,
+              "computing_power": "20000",
+              "power": "10",
+          }
+      ],
+      userInfo:{}
     }
   },
   methods:{
+    async getUserInfo() {
+      const res = await getUserInfo();
+      this.userInfo = res.data;
+    },
     getPlans(){
       let data = {
         page:'',
@@ -60,11 +106,33 @@ export default {
       })
     },
     toPayment(item){
-      this.$router.push({path:'/Payment',query:{item:item}});
-    }
+      // this.$router.push({path:'/Payment',query:{item:item}});
+      const formData = new FormData();
+      formData.append('type',item.type);
+      joinRetirement(formData).then(res=>{
+        console.log(res,'2222222222');
+        
+      })
+    },
+    canClick(item) {
+      const { chuji, yiji, erji, sanji } = this.userInfo;
+      switch(item.id) {
+        case 1:
+          return chuji === 0;
+        case 2:
+          return yiji === 0;
+        case 3:
+          return erji === 0;
+        case 4:
+          return sanji === 0;
+        default:
+          return false;
+      }
+    },
   },
   mounted() {
-    this.getPlans()
+    this.getUserInfo()
+    // this.getPlans()
   },
 }
 </script>
@@ -162,4 +230,8 @@ export default {
 .plan-btn:hover {
   background: #a00028;
 }
+.plan-btn.disabled {
+  background: #cccccc;
+  cursor: not-allowed;
+}
 </style>