签到完善

src/api/user.js

@@ -40,3 +40,19 @@ export function getInviteUserListApi(params) {
     params
   })
 }
+//用户最后签到时间
+export function lastSignApi() {
+  return request({
+    url: `/appUser/lastSign`,
+    method: 'get',
+  })
+}
+
+// 用户签到
+export function signApi(data) {
+  return request({
+    url: `/appUser/sign`,
+    method: 'post',
+    data
+  })
+}

src/views/user/components/consume.vue

@@ -82,6 +82,7 @@ import {
 export default {
   data() {
     return {
+      balance: 0,
       params: {
         pageNum: 1,
         pageSize: 10,

src/views/user/components/invite.vue

@@ -2,7 +2,7 @@
   <div class="user-info py-10 px-20 w-full h-full overflow-auto">
     <div class=" w-full rounded-xl w-full p-4 bg-white mb-4">
       <div class=" text-lg ">
-        每邀请一个用户，平台奖励：<i class="el-icon-coin text-yellow-500"></i> <span class=" text-yellow-500">{{ userInfo.inviteUserBalance }}</span>
+        每邀请一个用户，平台奖励：<i class="el-icon-coin text-yellow-500"></i> <span class=" text-yellow-500">{{ inviteUserBalance }}</span>
       </div>
       <div class="text-sm flex items-center">
         邀请链接：<span class=" text-indigo-600" id="code">{{ url }}{{ code }}</span>
@@ -55,6 +55,7 @@ export default {
     return {
       url: 'http://192.168.0.114:8088/#/home?code=',
       code: '',
+      inviteUserBalance: 0,
       userInfo: null,
       params: {
         pageNum: 1,
@@ -73,6 +74,7 @@ export default {
     getInfo().then(res => {
       console.log(res, 'getInfo')
       this.userInfo = res.data
+      this.inviteUserBalance = res.data.inviteUserBalance
       this.code = res.data.id
     })
     this.queryRecord()

src/views/user/components/signIn.vue

@@ -12,23 +12,32 @@
         <div class="grid grid-cols-7 gap-6 pt-10 pb-4 px-6">
           <div 
             class=" rounded-md bg-gray-700 flex flex-col justify-center items-center"
-            :class="[item.isSignIn ? 'bg-red-400' : 'bg-gray-400']"
+            :class="[item.isSignIn && 'active']"
             style="height: 12vw;"
-            v-for="(item, index) in signInList" 
+            v-for="(item, index) in signUserBalance" 
             :key="index"
           >
-            <div class=" text-2xl text-white" style="letter-spacing: 6px;">{{ item.title }}</div>
+            <div class=" text-2xl text-white" style="letter-spacing: 6px;">{{ days[index] }}</div>
             <div class=" text-white mt-4">
               <i class="el-icon-coin text-yellow-300"></i>
-              + 15
+              + {{ item }}
             </div>
             <div 
-              class=" bg-yellow-400 rounded-full text-white flex justify-center items-center mt-4 cursor-pointer" 
+              class=" bg-yellow-400 rounded-full text-white flex justify-center items-center mt-4 cursor-pointer"
+              :class="index + 1 > todayNum && 'future'"
               style="width: 4vw; height: 1.6vw;"
               @click="signIn(item, index)"
+              v-if="index >= lastSignDay"
             >
               签到
             </div>
+            <div 
+              class=" bg-green-400 rounded-full text-white flex justify-center items-center mt-4" 
+              style="width: 4vw; height: 1.6vw;"
+              v-if="index < lastSignDay"
+            >
+              已经签到
+            </div>
           </div>
         </div>
       </div>
@@ -37,42 +46,89 @@
 </template>
 
 <script>
+import { signApi, lastSignApi } from '@/api/user'
+import { getInfo } from '@/api/login'
 export default {
   data() {
     return {
-      signInList: [
-        {
-          title: '第一天'
-        },
-        {
-          title: '第二天'
-        },
-        {
-          title: '第三天'
-        },
-        {
-          title: '第四天'
-        },
-        {
-          title: '第五天'
-        },
-        {
-          title: '第六天'
-        },
-        {
-          title: '第七天'
-        },
-      ]
+      lastSignDay: 0,
+      todayNum: 0,
+      days: [
+        '第一天',
+        '第二天',
+        '第三天',
+        '第四天',
+        '第五天',
+        '第六天',
+        '第七天',
+      ],
+      signUserBalance: []
     }
   },
+  computed: {
+    today() {
+      return this.parseTime(new Date(), "{y}-{m}-{d}")
+    },
+  },
+  mounted() {
+    console.log(this.today, 'today');
+    this.getLastSign()
+    getInfo().then(res => {
+      let list = res.data.signUserBalance
+      this.signUserBalance = list.split(',')
+    })
+  },
   methods: {
-    signIn() {
-
+    getLastSign() {
+      lastSignApi().then(res => {
+        console.log(res, 'res>>');
+        if (res.data) {
+          this.lastSignDay = parseInt(res.data.remark)
+          let signInDay = this.parseTime(new Date(res.data.createTime), "{y}-{m}-{d}")
+          if (signInDay == this.today) {
+            this.todayNum = parseInt(res.data.remark)
+          } else {
+            if (parseInt(res.data.remark) == 7) {
+              this.todayNum = 1
+              this.lastSignDay = 0
+            } else {
+              this.todayNum = parseInt(res.data.remark) + 1
+            }
+          }
+        }
+      })
+    },
+    signIn(item, index) {
+      if (index + 1 > this.todayNum) {
+        this.$message({
+          type: 'warning',
+          message: '还未到时间。'
+        })
+        return
+      }
+      let params = {
+        day: index + 1
+      }
+      signApi(params).then(res => {
+        if (res.code == 200) {
+          // this.signUserBalance[index] = res.data
+          this.getLastSign()
+          this.$message({
+            type: 'success',
+            message: '签到成功'
+          })
+        }
+      })
     }
   }
 }
 </script>
 
-<style>
-
+<style lang="scss" scoped>
+.active {
+  box-shadow: 2px 2px 2px #ff7575;
+}
+.future {
+  background: #9e9e9e;
+}
 </style>

src/views/user/index.vue

@@ -20,22 +20,22 @@
         <i class="el-icon-setting text-xl mr-2"></i>
         消费明细
       </div>
-      <div 
+      <!-- <div 
         class="w-full px-2 py-2 mb-2 flex items-center rounded-md cursor-pointer"
         :class="active === '3' ? 'bg-gray-100' : ''"
         @click="menuClick('3')"
       >
         <i class="el-icon-setting text-xl mr-2"></i>
         用户偏好
-      </div>
-      <div 
+      </div> -->
+      <!-- <div 
         class="w-full px-2 py-2 mb-2 flex items-center rounded-md cursor-pointer"
         :class="active === '4' ? 'bg-gray-100' : ''"
         @click="menuClick('4')"
       >
         <i class="el-icon-medal text-xl mr-2"></i>
         会员
-      </div>
+      </div> -->
       <div 
         class="w-full px-2 py-2 mb-2 flex items-center rounded-md cursor-pointer"
         :class="active === 'invite' ? 'bg-gray-100' : ''"