签到页面，邀请和注册

src/api/user.js

@@ -32,3 +32,11 @@ export function queryUserBalanceApi(params) {
     params
   })
 }
+// 查询邀请用户列表
+export function getInviteUserListApi(params) {
+  return request({
+    url: `/system/app/getInviteUserList`,
+    method: 'get',
+    params
+  })
+}

src/store/modules/app.js

@@ -8,6 +8,7 @@ const state = {
   },
   isMobile: false,
   showPopup: false,
+  showPopupType: '',
   device: 'desktop',
   size: Cookies.get('size') || 'medium'
 }
@@ -19,6 +20,9 @@ const mutations = {
   TOGGLE_POPUP: (state, status) => {
     state.showPopup = status
   },
+  TOGGLE_POPUPTYPE: (state, type) => {
+    state.showPopupType = type
+  },
   TOGGLE_SIDEBAR: state => {
     if (state.sidebar.hide) {
       return false;

src/views/components/NavMenu.vue

@@ -94,6 +94,10 @@ export default {
     }
   },
   mounted() {
+    if (!this.haveToken && this.$route.query.code) {
+      this.$store.commit('app/TOGGLE_POPUPTYPE', 'register')
+      this.$store.commit('app/TOGGLE_POPUP', true)
+    }
   },
   watch: {
     '$store.state.user.token': function(newVal, oldVal) {

src/views/homeComponents/loginPopup.vue

@@ -34,7 +34,11 @@ export default {
   watch: {
     '$store.state.app.showPopup': {
       handler: function (value) {
-        this.popupType = 'login'
+        if (this.$store.state.app.showPopupType) {
+          this.popupType = this.$store.state.app.showPopupType
+        } else {
+          this.popupType = 'login'
+        }
       },
       immediate: true,
     }

src/views/homeComponents/register.vue

@@ -11,6 +11,9 @@
       <el-form-item label="" prop="repeatPassword">
         <el-input v-model="formRegister.repeatPassword" placeholder="确认密码"></el-input>
       </el-form-item>
+      <el-form-item label="" prop="inviteUser">
+        <el-input v-model="formRegister.inviteUser" placeholder="邀请码"></el-input>
+      </el-form-item>
       <el-form-item label="">
         <el-button
           class="formButton text-white text-lg mr-3 cursor-pointer px-3 py-2 rounded-md w-full"
@@ -45,6 +48,7 @@ export default {
         account: null,
         password: null,
         repeatPassword: null,
+        inviteUser: null
       },
       registerRules: {
         account: [
@@ -75,6 +79,10 @@ export default {
     }
   },
   mounted() {
+    // 如果有邀请码则回填
+    if (this.$route.query.code) {
+      this.formRegister.inviteUser = this.$route.query.code
+    }
   },
   methods: {
     toLogin() {

src/views/user/components/invite.vue

@@ -0,0 +1,152 @@
+<template>
+  <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 flex items-center">
+        邀请链接：<span class=" text-indigo-600" id="code">{{ url }}{{ code }}</span>
+        <el-button class=" ml-2" size="mini" @click="copy">复制</el-button>
+      </div>
+    </div>
+    
+    <div class=" w-full rounded-xl w-full overflow-hidden">
+      <div class="p-6 bg-white form">
+        <div class=" text-lg mb-4">已邀请用户</div>
+        <el-table
+          :data="tableData"
+          style="width: 100%"
+          height="540"
+        >
+          <el-table-column
+            prop="createTime"
+            label="时间"
+          >
+          </el-table-column>
+          <el-table-column
+            prop="userId"
+            label="用户ID"
+          >
+          </el-table-column>
+        </el-table>
+        <div class="w-full pt-4 flex justify-center">
+          <el-pagination
+            background
+            layout="prev, pager, next"
+            :total="total"
+            @current-change="currentChange"
+          >
+          </el-pagination>
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+import { getInfo } from '@/api/login'
+import { queryRecordApi, getInviteUserListApi } from '@/api/user'
+import {
+  getModelListApi,
+} from "@/api/chat.js"
+export default {
+  data() {
+    return {
+      url: 'http://192.168.0.114:8088/#/home?code=',
+      code: '',
+      params: {
+        pageNum: 1,
+        pageSize: 10,
+        startTime: null,
+        endTime: null,
+        modelId: null,
+      },
+      modelList: [],
+      times: [],
+      total: 0,
+      tableData: []
+    }
+  },
+  mounted() {
+    getInfo().then(res => {
+      console.log(res, 'getInfo')
+      this.code = res.data.id
+    })
+    this.queryRecord()
+    this.getModelList()
+  },
+  methods: {
+    async copy() {
+      try {
+        // 获取源DOM元素
+        const sourceElement = document.getElementById('code');
+        // 读取文本内容
+        const textContent = sourceElement.textContent;
+        // let url = 'http://192.168.0.114:8088/#/home?code=' + this.code
+        const textarea = document.createElement('textarea');
+        textarea.value = textContent;
+        document.body.appendChild(textarea);
+        textarea.select();
+        if (document.execCommand('copy')) {
+          document.execCommand('copy');
+        }
+        document.body.removeChild(textarea);
+        
+        this.$message({
+          message: '复制成功',
+          type: 'success'
+        });
+      } catch (err) {
+        this.$message({
+          message: '复制失败',
+          type: 'error'
+        });
+      }
+      
+    },
+    reset() {
+      this.params = {
+        pageNum: 1,
+        pageSize: 10,
+        startTime: null,
+        endTime: null,
+        modelId: null,
+      }
+      this.queryRecord()
+    },
+    getModelList() {
+      getModelListApi().then(res => {
+        console.log(res, '模型列表');
+        this.modelList = res.data
+      })
+    },
+    currentChange(value) {
+      this.params.pageNum = value
+      this.queryRecord()
+    },
+    search() {
+      if(this.times.length > 0) {
+        this.params.startTime = this.times[0]
+        this.params.endTime = this.times[1]
+      } else {
+        this.params.startTime = null
+        this.params.endTime = null
+      }
+      this.queryRecord()
+    },
+    queryRecord() {
+      getInviteUserListApi(this.params).then(res => {
+        console.log(res, 'getInviteUserListApi')
+        this.tableData = res.rows
+        this.total = res.total
+      })
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+  .top {
+    background: linear-gradient(rgba(0, 0, 0, 0) 23.28%, rgba(0, 0, 0, 0.72) 100%), url(https://cdn-az.rochat.tech/avatar/131__c9103616-e103-11ee-bef2-66a40ff97e79.png) center center / cover no-repeat;
+  }
+</style>
+<style scoped>
+
+</style>

src/views/user/components/signIn.vue

@@ -0,0 +1,78 @@
+<template>
+  <div class="user-info py-10 px-20 w-full h-full">
+    <div class=" w-full rounded-xl w-full p-4 bg-white mb-4">
+      <div class=" text-xl mb-4">每日签到</div>
+      <div class=" text-sm text-yellow-500 mb-2">
+        连续签到七天得好礼
+      </div>
+      <div class="">
+        <!-- <div class=" flex justify-center">
+          <el-button class=" w-60 h-12 text-xl rounded-full" type="primary" @click="signIn">签到</el-button>
+        </div> -->
+        <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']"
+            style="height: 12vw;"
+            v-for="(item, index) in signInList" 
+            :key="index"
+          >
+            <div class=" text-2xl text-white" style="letter-spacing: 6px;">{{ item.title }}</div>
+            <div class=" text-white mt-4">
+              <i class="el-icon-coin text-yellow-300"></i>
+              + 15
+            </div>
+            <div 
+              class=" bg-yellow-400 rounded-full text-white flex justify-center items-center mt-4 cursor-pointer" 
+              style="width: 4vw; height: 1.6vw;"
+              @click="signIn(item, index)"
+            >
+              签到
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      signInList: [
+        {
+          title: '第一天'
+        },
+        {
+          title: '第二天'
+        },
+        {
+          title: '第三天'
+        },
+        {
+          title: '第四天'
+        },
+        {
+          title: '第五天'
+        },
+        {
+          title: '第六天'
+        },
+        {
+          title: '第七天'
+        },
+      ]
+    }
+  },
+  methods: {
+    signIn() {
+
+    }
+  }
+}
+</script>
+
+<style>
+
+</style>

src/views/user/components/userInfo.vue

@@ -13,7 +13,7 @@
               <div class=" text-2xl text-white">{{ userInfo.userName }}</div>
               <div class="text-base text-white">账号：{{ userInfo.account }}</div>
               <div class=" text-sm text-white">
-                UID: 89942000
+                UID: {{ userInfo.id }}
                 <i class="el-icon-copy-document cursor-pointer"></i>
               </div>
             </div>

src/views/user/index.vue

@@ -6,16 +6,16 @@
       </div>
       <div 
         class="w-full px-2 py-2 mb-2 flex items-center rounded-md cursor-pointer"
-        :class="active === '1' ? 'bg-gray-100' : ''"
-        @click="menuClick('1')"
+        :class="active === 'userInfo' ? 'bg-gray-100' : ''"
+        @click="menuClick('userInfo')"
       >
         <i class="el-icon-user text-xl mr-2"></i>
         用户信息
       </div>
       <div 
         class="w-full px-2 py-2 mb-2 flex items-center rounded-md cursor-pointer"
-        :class="active === '2' ? 'bg-gray-100' : ''"
-        @click="menuClick('2')"
+        :class="active === 'consume' ? 'bg-gray-100' : ''"
+        @click="menuClick('consume')"
       >
         <i class="el-icon-setting text-xl mr-2"></i>
         消费明细
@@ -26,7 +26,7 @@
         @click="menuClick('3')"
       >
         <i class="el-icon-setting text-xl mr-2"></i>
-        用户偏好设定
+        用户偏好
       </div>
       <div 
         class="w-full px-2 py-2 mb-2 flex items-center rounded-md cursor-pointer"
@@ -38,16 +38,24 @@
       </div>
       <div 
         class="w-full px-2 py-2 mb-2 flex items-center rounded-md cursor-pointer"
-        :class="active === '5' ? 'bg-gray-100' : ''"
-        @click="menuClick('5')"
+        :class="active === 'invite' ? 'bg-gray-100' : ''"
+        @click="menuClick('invite')"
       >
         <i class="el-icon-present text-xl mr-2"></i>
         邀请有礼
       </div>
       <div 
         class="w-full px-2 py-2 mb-2 flex items-center rounded-md cursor-pointer"
-        :class="active === '6' ? 'bg-gray-100' : ''"
-        @click="menuClick('6')"
+        :class="active === 'signIn' ? 'bg-gray-100' : ''"
+        @click="menuClick('signIn')"
+      >
+        <i class="el-icon-present text-xl mr-2"></i>
+        签到
+      </div>
+      <div 
+        class="w-full px-2 py-2 mb-2 flex items-center rounded-md cursor-pointer"
+        :class="active === 'opinion' ? 'bg-gray-100' : ''"
+        @click="menuClick('opinion')"
       >
         <i class="el-icon-message text-xl mr-2"></i>
         意见反馈
@@ -69,9 +77,11 @@
       </div>
     </div>
     <div class=" flex-1 h-full bg-gray-50">
-      <UserInfo v-if="active == 1" />
-      <Consume  v-if="active == 2" />
-      <Opinion  v-if="active == 6" />
+      <UserInfo v-if="active == 'userInfo'" />
+      <Consume  v-if="active == 'consume'" />
+      <Invite  v-if="active == 'invite'" />
+      <Opinion  v-if="active == 'opinion'" />
+      <SignIn  v-if="active == 'signIn'" />
     </div>
   </div>
 </template>
@@ -80,12 +90,16 @@
 import UserInfo from "./components/userInfo.vue"
 import Consume from "./components/consume.vue"
 import Opinion from "./components/opinion.vue"
+import Invite from "./components/invite.vue"
+import SignIn from "./components/signIn.vue"
 
 export default {
   components: {
     UserInfo,
     Consume,
-    Opinion
+    Opinion,
+    Invite,
+    SignIn
   },
   data() {
     return {

vue.config.js

@@ -36,9 +36,9 @@ module.exports = {
     open: true,
     proxy: {
       [process.env.VUE_APP_BASE_API]: {
-        target: `http://192.168.0.105:8086`,
+        // target: `http://192.168.0.105:8086`,
         // target: `http://aitest.api.rongcyl.cn`,
-        // target: `http://192.168.0.107:8086`,
+        target: `http://192.168.0.103:8086`,
         changeOrigin: true,
         pathRewrite: {
           ["^" + process.env.VUE_APP_BASE_API]: "",