Merge branch 'master' of http://git.kingsome.cn/yuyongdong/UAW

.env.development

@@ -1,5 +1,5 @@
 # API
-VUE_APP_API_URL = 'http://192.168.100.22:3006/api'
+VUE_APP_API_URL = 'http://192.168.100.22:3006'
 # VUE_APP_API_URL = 'http://127.0.0.1:3006/api'
 VUE_APP_WL_URL = 'https://nftwl.counterfire.games/wl_test'
 VUE_APP_CONFIG_URL = 'https://sepolia.infura.io/v3/b6bf7d3508c941499b10025c0776eaf8'

.env.production

@@ -15,4 +15,4 @@ VUE_APP_CHAIN_ID = '5611'
 
 VUE_APP_APP_NAME = 'CF UAW'
 
-VUE_APP_SCRIPTION_ADDRESS='0x50A8e60041A206AcaA5F844a1104896224be6F39'
+VUE_APP_SCRIPTION_ADDRESS='0xcd4bb3402f1a444a1af10f31946ed37dac0eac4d'

src/components/errorDialog/errorDialog.vue

@@ -0,0 +1,47 @@
+<template>
+  <el-dialog
+    title=""
+    :visible="dialogVisible"
+    width="416px"
+    @cancel="handleClose"
+    :closable="false"
+  >
+  <div class="confirm-box">
+    <div class="confirm-title">
+      <span>错误提示</span>
+    </div>
+    <div class="confirm-context"> {{message}}</div>
+  </div>
+  <div  slot="footer" class="dialog-footer">
+    <a-button @click="handleClose" type="primary">Close</a-button>
+  </div>
+  </el-dialog>
+</template>
+<script>
+export default {
+  name: "iErrorMessage",
+  data() {
+    return {
+    };
+  },
+  methods:{
+    handleClose(){
+      this.dialogVisible = false
+    }
+  }
+};
+</script>
+<style lang="scss" scoped>
+.confirm-title{
+  color: #323233;
+  font-weight: 500;
+  font-size: 16px;
+  line-height: 1.4;
+}
+.confirm-context{
+  margin-top: 8px;
+    color: #323233;
+    font-size: 14px;
+    padding-left: 21px;
+}
+</style>

src/components/errorDialog/index.js

@@ -0,0 +1,29 @@
+import Vue from 'vue';
+import confirm from './errorDialog.vue';
+const iErrorMessage = Vue.extend(confirm);
+function showErrMsg(err) {
+  let errmsg = err;
+  if (typeof err === 'object') {
+    errmsg = JSON.stringify(err);
+  }
+  if (errmsg.indexOf('User denied message signature') > -1) {
+    errmsg = `User denied message signature`;
+  } else if (errmsg.indexOf('insufficient funds') > -1) {
+    errmsg = 'Insufficient funds';
+  }
+
+  const _confirm = new iErrorMessage({
+    data() {
+      return {
+        message: errmsg,
+        dialogVisible: true,
+      };
+    },
+  });
+  const element = _confirm.$mount().$el;
+  document.body.appendChild(element);
+}
+showErrMsg.install = (Vue) => {
+  Vue.prototype.$showErr = showErrMsg;
+};
+export default showErrMsg;

src/components/formatPrice.vue

@@ -0,0 +1,39 @@
+<template>
+  <div>{{ formatPrice(5000000000000)  }}</div>
+</template>
+
+<script>
+export default {
+  props: {
+    NubSize: Number
+  },
+  data() {
+    return {
+      format: '',
+    }
+  },
+  computed: {
+    fileSize() {
+      const units = ['B', 'KB', 'MB', 'GB', 'TB', 'PB'];
+      let number = this.size;
+      let unitIndex = 0;
+
+      while (number >= 1024 && unitIndex < units.length - 1) {
+        number /= 1024;
+        unitIndex++;
+      }
+
+      return number.toFixed(2) + ' ' + units[unitIndex];
+    }
+  },
+  mounted() {
+    
+  },
+  methods: {
+  },
+}
+</script>
+
+<style>
+
+</style>

src/components/linkButton/linkBtnView.vue

@@ -82,7 +82,7 @@ export default {
 
     // 获取用户状态
     getUserState(token) {
-      this.$axios.get('/api/user/state',{ params: '',
+      this.$axios.get(process.env.VUE_APP_API_URL+'/api/user/state',{ params: '',
           headers: { Authorization: `Bearer ${token}` },
         }).then(res => {
           localStorage.setItem('userData', JSON.stringify(res.data.data))

src/main.js

@@ -7,10 +7,13 @@ import ElementUI from 'element-ui'
 import 'element-ui/lib/theme-chalk/index.css'
 import moment from 'moment'
 import axios from 'axios'
+import iErrorMsg from './components/errorDialog/index.js'
 Vue.prototype.$axios = axios
 
 // import Web3 from 'web3'
 Vue.use(ElementUI)
+// 全局的错误提示, this.$showErr(string|object)
+Vue.use(iErrorMsg)
 
 import {Message} from 'element-ui'
 Vue.prototype.$message = Message
@@ -19,17 +22,17 @@ Vue.filter('formatDate', function (value) {
   return moment(value).format('YYYY-MM-DD HH:mm:ss')
 })
 
-Vue.config.errorHandler = function(err, vm, info){
+// Vue.config.errorHandler = function(err, vm, info){
-  //todo: show error message
+//   //todo: show error message
-  console.error('[vue error handler|error]: ', err)
+//   console.error('[vue error handler|error]: ', err)
-  console.error('[vue error handler|VM]: ', vm)
+//   console.error('[vue error handler|VM]: ', vm)
-  console.warn('[vue error handler|info]: ', info)
+//   console.warn('[vue error handler|info]: ', info)
-  Message({
+//   Message({
-    message: info,
+//     message: info,
-    type: 'error',
+//     type: 'error',
-    duration: 3 * 1000
+//     duration: 3 * 1000
-  })
+//   })
-}
+// }
 
 Vue.config.productionTip = false
 

src/utils/webapi.js

@@ -247,3 +247,9 @@ export const joinDiscord = (id) => {
   const url = `https://discord.gg/${id}`
   window.open(url, '_blank');
 }
+
+// NFT 合作伙伴列表
+export const apiNftList = async () => {
+  const url = `${API_BASE}/api/partner/nfts`;
+  return httpPost(url, {})
+}

src/views/bonus/index.vue

@@ -141,7 +141,7 @@ export default {
     async getHistorical(id) {
       let res = await this.$axios
         .post(
-          "/api/chest/enhance/list",
+          process.env.VUE_APP_API_URL+"/api/chest/enhance/list",
           { chestid: id },
           {
             headers: { Authorization: `Bearer ${this.token}` }
@@ -154,7 +154,7 @@ export default {
     // 邀请列表
     getBoosting() {
       this.$axios
-        .get("/api/activity/invite_list", {
+        .get(process.env.VUE_APP_API_URL+"/api/activity/invite_list", {
           params: "",
           headers: { Authorization: `Bearer ${this.token}` }
         })
@@ -170,7 +170,7 @@ export default {
     // 复制助力链接
     copyLink(text) {
       console.log(text)
-      let url = `http://192.168.100.216:8030/home/new=${this.userData.code}/box=${text}/id=${this.boxList[0].id}`
+      let url = `${location.protocol}//${location.host}/home/new=${this.userData.code}/box=${text}/id=${this.boxList[0].id}`
       let oInput = document.createElement("input");
       oInput.value = url;
       document.body.appendChild(oInput);
@@ -184,7 +184,7 @@ export default {
     // 宝箱列表
     async getBoxList() {
       let res = await this.$axios
-        .get("/api/chest/list", {
+        .get(process.env.VUE_APP_API_URL+"/api/chest/list", {
           params: "",
           headers: { Authorization: `Bearer ${this.token}` }
         })
@@ -199,7 +199,7 @@ export default {
 
     // 宝箱开启记录
     async getOpenBox() {
-      let res = await this.$axios.get('/api/chest/open/history',{params: '',headers: { Authorization: `Bearer ${this.token}` }})
+      let res = await this.$axios.get(process.env.VUE_APP_API_URL+'/api/chest/open/history',{params: '',headers: { Authorization: `Bearer ${this.token}` }})
       console.log('宝箱开启记录', res.data)
     },
 
@@ -208,7 +208,7 @@ export default {
       // const address = localStorage.getItem('address')
       try{
         // let res = await sendOpenChest(address,id)
-        let res = await this.$axios.post('/api/chest/open',{chestId: id},{
+        let res = await this.$axios.post(process.env.VUE_APP_API_URL+'/api/chest/open',{chestId: id},{
           headers: { Authorization: `Bearer ${this.token}` }
         })
         console.log('开宝箱', res)

src/views/home/awardDialog.vue

@@ -72,7 +72,7 @@
         </div>
         <div class="btn" @click="ExploreDialog">Confirm</div>
       </div>
-      <div v-else-if="eventName == 'help_event'">
+      <div v-else-if="eventName == 'help_event' || eventName == 'help_event'">
         <div class="top">
           <div class="top-title"></div>
           <div class="top-close" @click="ExploreDialog">
@@ -81,13 +81,20 @@
         </div>
         <div class="content">
           <div class="points-title">{{ dialogTitle }}</div>
-          <div class="points-amount">
+          <div class="points-amount" v-if="awardData.score">
             <div>Points</div>
             <div>
               <span>X {{ awardData.score }}</span>
               <img src="./../../assets/common/Icon_Points.png" alt="">
             </div>
           </div>
+          <div class="points-amount" v-if="awardData.ticket">
+            <div>Points</div>
+            <div>
+              <span>X {{ awardData.ticket }}</span>
+              <img src="./../../assets/common/Icon_Explore9.png" alt="">
+            </div>
+          </div>
           <div v-if="awardData.isNewUser == 0">Complete tasks to get more rewards</div>
         </div>
         <div class="btn" v-if="awardData.isNewUser == 0" @click="toComplete">To complete</div>

src/views/home/boxBtm.vue

@@ -382,7 +382,7 @@ export default {
     // 我的宝箱
     async getMyBoxList() {
       let res = await this.$axios
-        .get("/api/chest/list", {
+        .get(process.env.VUE_APP_API_URL+"/api/chest/list", {
           params: "",
           headers: { Authorization: `Bearer ${this.token}` }
         })
@@ -419,7 +419,7 @@ export default {
     async getHistorical(id) {
       let res = await this.$axios
         .post(
-          "/api/chest/enhance/list",
+          process.env.VUE_APP_API_URL+"/api/chest/enhance/list",
           { chestid: id },
           {
             headers: { Authorization: `Bearer ${this.token}` }
@@ -475,7 +475,7 @@ export default {
           if(resOpen) {
             let serTimeId = setInterval(async () => {
               let res = await this.$axios.post(
-                  "/api/chest/open",
+                process.env.VUE_APP_API_URL+"/api/chest/open",
                   { chestId: id },
                   { headers: { Authorization: `Bearer ${this.token}` } }
                 );
@@ -494,7 +494,7 @@ export default {
 
     // 开箱子记录
     async openBoxLog() {
-      let res = await this.$axios.get('/api/chest/open/history', {
+      let res = await this.$axios.get(process.env.VUE_APP_API_URL+'/api/chest/open/history', {
           params: { },
           headers: { Authorization: `Bearer ${this.token}` }
         })
@@ -508,7 +508,7 @@ export default {
 
     // 我的助力记录
     async getMyHistoricalLog() {
-      let res = await this.$axios.post('/api/user/enhance/list', {},{headers: { Authorization: `Bearer ${this.token}` }})
+      let res = await this.$axios.post(process.env.VUE_APP_API_URL+'/api/user/enhance/list', {},{headers: { Authorization: `Bearer ${this.token}` }})
         this.myRecordsList = res.data.data
     },
     // 我的助力记录
@@ -521,7 +521,7 @@ export default {
       this.userData = JSON.parse(localStorage.getItem("userData"))
       // console.log(data, this.userData.code)
       // return
-      let url = `http://192.168.100.216:8030/home/new=${this.userData.code}/box=${data.shareCode}/id=${data.id}`
+      let url = `${location.protocol}//${location.host}/home/new=${this.userData.code}/box=${data.shareCode}/id=${data.id}`
       let oInput = document.createElement("input");
       oInput.value = url;
       document.body.appendChild(oInput);

src/views/home/gameView.vue

@@ -119,7 +119,7 @@ export default {
           if(amount >= 1) {
           cc.mainAnim.setCurrPos(getTotalUsed)
           cc.mainAnim.setData(amount)
-          let res = await this.$axios.post('/api/game/pre_step',{step: amount},{headers: { Authorization: `Bearer ${this.token}` }})
+          let res = await this.$axios.post(process.env.VUE_APP_API_URL+'/api/game/pre_step',{step: amount},{headers: { Authorization: `Bearer ${this.token}` }})
           let id = res.data.data.id
           if(id){
             try{

src/views/home/helpDialog.vue

@@ -108,7 +108,7 @@ export default {
   methods: {
     // 宝箱信息接口
     async getBoxData() {
-      let res = await this.$axios.post('/api/chest/enhance/state', {chestId: '660a4b63de92bca95af2b714'},{})
+      let res = await this.$axios.post(process.env.VUE_APP_API_URL+'/api/chest/enhance/state', {chestId: '660a4b63de92bca95af2b714'},{})
       this.boxData = res.data.data
     },
 
@@ -117,7 +117,7 @@ export default {
       if (this.$route.params.boxId != undefined) {
         let rtoken = await checkReCaptcha("chest_share");
         let res = await this.$axios.post(
-          "/api/chest/enhance/list",
+          process.env.VUE_APP_API_URL+"/api/chest/enhance/list",
           { chestid: this.boxId, rtoken: rtoken },
           {
             headers: { Authorization: `Bearer ${this.token}` }
@@ -134,7 +134,7 @@ export default {
       if(this.$route.params.name != undefined) {
         let newInvite = this.$route.params.name.split("new=")[1];
         let rtoken = await checkReCaptcha("invite_user");
-        let res = await this.$axios.get("/api/activity/upload_invite_code", {
+        let res = await this.$axios.get(process.env.VUE_APP_API_URL+"/api/activity/upload_invite_code", {
           params: { code: newInvite, rtoken: rtoken },
           headers: { Authorization: `Bearer ${this.token}` }
         });
@@ -248,7 +248,7 @@ export default {
 
     // 助力状态查询
     async initBoxState(code,chestId) {
-      let res = await this.$axios.post('/api/chest/enhance/state',{code: code, chestId: chestId, },{headers: { Authorization: `Bearer ${this.token}` }})
+      let res = await this.$axios.post(process.env.VUE_APP_API_URL+'/api/chest/enhance/state',{code: code, chestId: chestId, },{headers: { Authorization: `Bearer ${this.token}` }})
       this.boxState = res.data.data
       if (this.boxState.userCurrent == this.boxState.userMax) {
         if(this.boxState.enhanced == 1) {

src/views/home/index.vue

@@ -142,7 +142,7 @@
             </li>
           </div>
         </div>
-        <div class="right-title" v-if="navIndex == 0">
+        <div class="right-title" v-if="navIndex == 0 || navIndex == 2">
           <p>Phase 1</p>
           <h3>Complete quests to shatter the looming</h3>
           <h3>fog that veils the unknown!</h3>
@@ -390,12 +390,43 @@
             </div>
           </div>
         </div>
-        <div v-if="navIndex == 2">
+        <div class="content-right" v-if="navIndex == 2">
-          其他钱包链合作
+          <div class="title">
+            <div class="title-left">
+              <div>Partner</div>
+            </div>
+          </div>
+          <div class="quest">
+            <div class="quest-list">
+              <li v-for="(item, index) in activeList" :key="index">
+                <div class="content-right-left">
+                  <!-- <div class="img-logo">
+                    <img src="./../../assets/home/twitter.png" alt />
+                  </div>
+                  <div class="score">
+                    <span>{{ item.score }} Pts</span>
+                  </div>-->
+                  <div class="desc">
+                    <h3>{{ item.title }}</h3>
+                    <p>{{ item.desc }}</p>
+                  </div>
+                </div>
+                <div v-if="token != null" class="btn">
+                  <div class="is-btn">
+                    <div v-if="item.status == 0" class="started" @click="toPost(item)">{{ item.actionTitle }}</div>
+                    <CheckBtn v-if="item.status == 1" @stateupdate="toCheck" :dataid="item.id" time="10" title="Check" class="started">Check</CheckBtn>
+                    <div v-if="item.status == 2" class="claim" @click="getTaskClaim(item.id)">Claim</div>
+                    <div v-if="item.status == 3" class="success">+{{ item.score }} <img src="./../../assets/home/Checkmark.png" alt=""></div>
+                  </div>
+                </div>
+                <div class='light-btn' v-else @click="onWalletLogin">Connect Wallet</div>
+              </li>
             </div>
           </div>
         </div>
-    <div class="content-box" v-show="navIndex == 3">
+      </div>
+    </div>
+    <div class="content-box" v-show="navIndex == 3 || navIndex == 4">
       <div class="box">
         <div class="box-top">
           <div class="left">
@@ -488,9 +519,12 @@
             </div>
           </div>
         </div>
-        <div class="box-btm">
+        <div class="box-btm" v-show="navIndex == 3">
           <BoxBtm @toExplore="toExplore" @awardDialog="activityDialog" />
         </div>
+        <div class="box-btm" v-show="navIndex == 4">
+          <Ranking :activityName="activityData.name" />
+        </div>
       </div>
       
     </div>
@@ -512,6 +546,7 @@
 <script>
 import Calen from "./calenView.vue";
 import BoxBtm from './boxBtm.vue'
+import Ranking from './ranking.vue'
 // import ImgView from './../../components/imgView.vue'
 import gameView from "./gameView.vue";
 import CheckBtn from "@/components/checkBtn.vue";
@@ -534,6 +569,7 @@ import {
   apiGameStat,
   apiUsercheckin,
   apiEnhanceBox,
+  apiNftList,
 } from "./../../utils/webapi.js";
 import { sendToChain, sendHelp } from "./../../utils/chainapi.js";
 import { Wallet } from '@/wallet/index.js'
@@ -545,6 +581,7 @@ export default {
     gameView,
     WalletDialog,
     BoxBtm,
+    Ranking,
     CheckBtn,
     AwardDialog,
     HelpDialog,
@@ -619,7 +656,7 @@ export default {
       myAddress: this.$store.state.user.address,
       getTotalUsed: 0, // 已探索总次数
       todayStepTicket: 0, // 探索总次数
-      stepTicket: 0, // 探索次数
+      stepTicket: 1, // 探索次数
       inviteTableData: [],
       ExploreDialogVisible: false,
       awardData: {},
@@ -655,6 +692,7 @@ export default {
   methods: {
     async initData() {
       await this.getActivity();
+      this.getNftList()
       this.$store.dispatch('wallet/restore')
       this.$store.dispatch('user/restore')
       console.log(this.$store.state.wallet.walletName)
@@ -666,6 +704,7 @@ export default {
         this.myScoreTotal = this.userData.scoreTotal
         this.myInviteCount = this.userData.inviteCount
         this.myEnhanceCount = this.userData.enhanceCount
+        
       }  else {
         this.walletDialogVisible = true
       }
@@ -673,7 +712,7 @@ export default {
     // 获取活动信息
     async getActivity() {
       await this.$axios
-        .get(`/api/activity/${this.activityId}`)
+        .get(process.env.VUE_APP_API_URL+`/api/activity/${this.activityId}`)
         .then(res => {
           // if (res.data.errcode == 0) {
           this.activityName = res.data.data.name;
@@ -905,10 +944,13 @@ export default {
       this.ExploreDialogVisible = true
     },
 
-    // // 开宝箱奖励
+    // 签到奖励
-    // boxAwardDialog(val) {
+    checkAwardDialog(val) {
-
+      this.awardData = val
-    // },
+      this.eventName = 'check_event'
+      this.dialogTitle = 'Congratulations'
+      this.ExploreDialogVisible = true
+    },
 
     // 关闭奖励弹窗
     ExploreHandleClose() {
@@ -947,8 +989,9 @@ export default {
               clearInterval(serTimeId)
             }
           } else {
-            alert(`领取成功, 获得积分: ${data.score}`)
+            // alert(`领取成功, 获得积分: ${data.score}`)
             this.$message.success(data.ticket)
+            this.checkAwardDialog(data)
             this.$refs.renewCheck.renewCheckInit()
             this.getGameStat();
             localStorage.removeItem(storeageKey)
@@ -987,7 +1030,7 @@ export default {
     // 检查签到并领取奖励
     async getUsercheckin() {
       // let res = await apiUsercheckin();
-      let res = await this.$axios.post('/api/user/checkin',{  },
+      let res = await this.$axios.post(process.env.VUE_APP_API_URL+'/api/user/checkin',{  },
             { headers: { Authorization: `Bearer ${this.token}` } })
             // console.log(res.data.data,'检查签到并领取奖励')
             return res.data.data
@@ -1034,11 +1077,17 @@ export default {
       this.logDialogVisible = false;
     },
 
+    // apiNftList获取nft合作列表
+    async getNftList() {
+      let res = await apiNftList()
+      console.log('apiNftList获取nft合作列表', res)
+    },
+
     // 复制链接
     copyLinkCode() {
       if(this.token) {
         let text = this.userData.code
-        let url = `http://192.168.100.216:8030/home/new=${text}/box=undefined/id=undefined`;
+        let url = `${location.protocol}//${location.host}/home/new=${text}/box=undefined/id=undefined`;
         let oInput = document.createElement("input");
         oInput.value = url;
         document.body.appendChild(oInput);
@@ -1062,11 +1111,7 @@ export default {
 
     // nav 导航
     navBtn(index) {
-      if(index == 4) {
-        this.navIndex = 3
-      } else {
       this.navIndex = index;
-      }
     },
     // 宝箱页面切换过来
     toExplore(val) {
@@ -1500,6 +1545,7 @@ export default {
               .content-right-left {
                 display: flex;
                 align-items: center;
+                width: 240px;
                 .img-logo {
                   width: 40px;
                   height: 40px;
@@ -1529,6 +1575,7 @@ export default {
               .btn {
                 border-radius: 15px;
                 color: #000;
+                margin-right: 10px;
                 cursor: pointer;
                 position: relative;
                 font-weight: normal;
@@ -1907,7 +1954,7 @@ export default {
     .box {
       width: 100%;
       height: 100%;
-      background: url('./../../assets/common/Right_box.png') no-repeat;
+      background: url('./../../assets/common/bg_p3.png') no-repeat;
       background-size: 100%;
       .box-top {
         width: 100%;
@@ -1915,6 +1962,7 @@ export default {
         display: flex;
         justify-content: space-between;
         .left {
+          width: 60%;
           .left-top {
             display: flex;
             justify-content: space-between;
@@ -2006,12 +2054,12 @@ export default {
           }
         }
         .right {
+          width: 30%;
           padding: 20px 30px;
           .right-header {
             display: flex;
             justify-content: space-between;
-            margin-bottom: 10px;
+            margin: 10px 50px 10px 0;
-            margin-top: 10px;
             .right-header-left {
               .right-header-nav {
                 width: 160px;
@@ -2106,6 +2154,8 @@ export default {
             }
           }
           .nav-btm {
+            width: 380px;
+
             margin: 10px auto;
             margin-bottom: 0px;
             .nav {

src/views/home/logDialog.vue

@@ -90,7 +90,7 @@ export default {
     // 我的邀请列表
     async getMyInvitationData() {
       let token = getToken();
-      let res = await this.$axios.get("/api/activity/invite_list", {
+      let res = await this.$axios.get(process.env.VUE_APP_API_URL+"/api/activity/invite_list", {
         params: "",
         headers: { Authorization: `Bearer ${token}` }
       });

src/views/home/ranking.vue

@@ -0,0 +1,489 @@
+<template>
+  <div class="ranking">
+    <div class="ranking-header">
+      {{ activityName }}
+    </div>
+    <div class="ranking-content">
+      <div class="ranking-content-left">
+        <div class="ranking-content-left-points">
+          <div class="list">
+            <div class="my-points">
+              <p>My Points</p>
+              <div class="list-btm">
+                <div class="points">
+                  <formatPrice />
+                  <span>{{ userData.scoreTotal }}</span>
+                  <img src="./../../assets/common/Icon_Points.png" alt="">
+                </div>
+              </div>
+            </div>
+            <div class="my-ranking">
+              <p>My Ranking</p>
+              <div class="list-btm">
+                <div class="ranking">10</div>
+              </div>
+            </div>
+          </div>
+        </div>
+        <div class="ranking-content-left-forward">
+          <div class="forward-list">
+            <li>
+              <div class="forward-list-item-star">
+                <img src="@/assets/box/Icon_Star_01.png" alt="">
+              </div>
+              <div class="forward-list-item-top">
+                <div class="user-img">
+                  <img :src="rankingTableData[0].avatar" alt="">
+                </div>
+              </div>
+              <div class="forward-list-item-btm">
+                <div class="name">{{ rankingTableData[1].nickname }}</div>
+                <div>{{ rankingTableData[1].score }}</div>
+              </div>
+            </li>
+            <li>
+              <div class="forward-list-item-star">
+                <img src="@/assets/box/Icon_Star_01.png" alt="">
+              </div>
+              <div class="forward-list-item-top">
+                <div class="user-img">
+                  <img :src="rankingTableData[0].avatar" alt="">
+                </div>
+                <!-- <div>{{ rankingTableData[0].nickname.slice(0,4) }}{{ '…'+rankingTableData[0].nickname.slice(-4) }}</div> -->
+              </div>
+              <div class="forward-list-item-btm">
+                <div class="name">{{ rankingTableData[0].nickname }}</div>
+                <div>{{ rankingTableData[0].score }}</div>
+              </div>
+            </li>
+            <li>
+              <div class="forward-list-item-star">
+                <img src="@/assets/box/Icon_Star_01.png" alt="">
+              </div>
+              <div class="forward-list-item-top">
+                <div class="user-img">
+                  <img :src="rankingTableData[0].avatar" alt="">
+                </div>
+              </div>
+              <div class="forward-list-item-btm">
+                <div class="name">{{ rankingTableData[2].nickname }}</div>
+                <div>{{ rankingTableData[2].score }}</div>
+              </div>
+            </li>
+          </div>
+        </div>
+      </div>
+      <div class="ranking-content-right">
+        <div class="ranking-content-right-list">
+          <li v-for="(item, index) in rankingTableData" :key="index">
+            <div class="left">
+              <div class="left-left">
+                <div class="rank">
+                  <img v-if="item.rank == 1" src="./../../assets/ranking/Ranking1.png" alt="">
+                  <img v-else-if="item.rank == 2" src="./../../assets/ranking/Ranking2.png" alt="">
+                  <img v-else-if="item.rank == 3" src="./../../assets/ranking/Ranking3.png" alt="">
+                  <span v-else>{{ item.rank }}</span>
+                </div>
+              </div>
+              <div class="left-right">
+                <div class="user-img">
+                  <img class="one-img" v-if="item.avatar != ''" :src="item.avatar" alt="">
+                  <img class="one-img" v-else src="./../../assets/home/Nav bar_character.png" alt="">
+                </div>
+                <div class="user-name">
+                  <div class="label">Name</div>
+                  <div class="name">{{ item.nickname }}</div>
+                </div>
+              </div>
+            </div>
+            <div class="right">
+              <div class="label">Points</div>
+              <div class="records">{{ item.score }}</div>
+            </div>
+          </li>
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+import { getToken } from './../../utils/cookies.js'
+import formatPrice from '@/components/formatPrice.vue'
+export default  {
+  components: {
+    
+  },
+  props: {
+    activityName: String,
+  },
+  data() {
+    return {
+      token: getToken(),
+      detailsDialog: false,
+      detailsList: [
+        {
+          action: 'Task',
+          time: '2024-03-08 12:59:37',
+          pts: '90'
+        }
+      ],
+      rankingTableData: [],
+      userData: [
+        {
+          scoreTotal: '0'
+        }
+      ]
+    }
+  },
+  mounted() {
+    
+    if(this.token) {
+      this.getLeaderBoard()
+      // this.getUserState()
+      this.userData = JSON.parse(localStorage.getItem("userData"));
+      this.getMyIntegralList()
+    }
+  },
+  methods: {
+    // 我的积分记录
+    async getMyIntegralList() {
+      let res = await this.$axios.get(process.env.VUE_APP_API_URL+`/api/user/checkin/list/all`,{ params: '',
+        headers: { Authorization: `Bearer ${this.token}` },
+      })
+      this.detailsList = res.data.data
+    },
+
+    // 获取总积分榜
+    async getLeaderBoard () {
+      let res = await this.$axios.get(process.env.VUE_APP_API_URL+`/api/activity/leaderboard/uaw_activity/0`)
+      console.log(res.data.data)
+      this.rankingTableData = res.data.data
+    },
+    // 获取用户状态
+    getUserState() {
+      this.$axios.get(process.env.VUE_APP_API_URL+'/api/user/state',{ params: '',
+          headers: { Authorization: `Bearer ${this.token}` },
+      }).then(res => {
+        this.userData = res.data.data
+        console.log(this.userData)
+        localStorage.setItem('userData', JSON.stringify(res.data.data))
+      })
+    },
+  },
+}
+
+</script>
+
+<style lang="scss" scoped>
+.ranking {
+  position: relative;
+  .ranking-header {
+    height: 40px;
+    line-height: 40px;
+    text-align: left;
+    position: absolute;
+    top: -50px;
+    left: 50px;
+    font-size: 42px;
+    font-weight: 700;
+    font-family: "Anton-Regular";
+  }
+  .ranking-content {
+    display: flex;
+    justify-content: space-around;
+    .ranking-content-left {
+      width: 60%;
+      position: relative;
+      .ranking-content-left-points {
+        width: 160px;
+        padding: 20px;
+        background: url('./../../assets/ranking/My points bg.png') no-repeat;
+        background-size: 100% 100%;
+        margin-top: 10px;
+        .list {
+          .my-points {
+            p {
+              text-align: left;
+              font-size: 12px;
+            }
+            .list-btm {
+              position: relative;
+              height: 40px;
+              margin-bottom: 20px;
+              .points {
+                width: 280px;
+                height: 140px;
+                background: url('@/assets/ranking/Point bg.png') no-repeat;
+                background-size: 100% 100%;
+                display: flex;
+                align-items: center;
+                justify-content: center;
+                position: absolute;
+                top: -88%;
+                left: 43%;
+                transform: translateX(-50%);
+                span {
+                  font-size: 28px;
+                  font-weight: 700;
+                  font-family: "Anton-Regular";
+                  color: #9950fd;
+                }
+                img {
+                  width: 16px;
+                  height: 22px;
+                  margin-left: 20px;
+                }
+              }
+            }
+          }
+          .my-ranking {
+            p {
+              font-size: 12px;
+              text-align: left;
+              margin-top: 40px;
+            }
+            .list-btm {
+              font-size: 28px;
+              font-weight: 700;
+              font-family: 'Anton-Regular';
+              .ranking {
+                margin-left: 10px;
+                color: #FFC35B;
+                text-align: left;
+              }
+            }
+          }
+        }
+      }
+      .ranking-content-left-forward {
+        width: 70%;
+        height: 500px;
+        background: url('@/assets/ranking/Background_shine.png') no-repeat;
+        background-size: 100% 100%;
+        margin: 0 auto;
+        padding: 10px;
+        position: absolute;
+        top: -15%;
+        left: 55%;
+        transform: translateX(-50%);
+        .forward-list {
+          width: 1000px;
+          height: 100%;
+          display: flex;
+          justify-content: space-evenly;
+          position: absolute;
+          left: 50%;
+          bottom: -38%;
+          transform: translateX(-50%);
+          position: relative;
+          li {
+            width: 300px;
+            height: 300px;
+            padding: 10px;
+            margin-top: 50px;
+            box-sizing: content-box;
+            background: url('@/assets/ranking/Bg_chest.png') no-repeat;
+            background-size: 100% 100%;
+            position: relative;
+            .forward-list-item-star {
+              position: absolute;
+              top: 0;
+              left: 50%;
+              transform: translateX(-50%);
+              width: 40px;
+              height: 40px;
+              img {
+                width: 100%;
+                height: 100%;
+              }
+            }
+            .forward-list-item-top {
+              position: absolute;
+              top: 40%;
+              left: 50%;
+              transform: translate(-50%, -50%);
+              .user-img {
+                width: 120px;
+                height: 120px;
+                border-radius: 50%;
+                overflow: hidden;
+                img {
+                  width: 100%;
+                  height: 100%;
+                }
+              }
+            }
+            .forward-list-item-btm {
+              font-size: 14px;
+              position: absolute;
+              bottom: 18%;
+              left: 50%;
+              transform: translateX(-50%);
+              .name {
+                font-weight: 700;
+                font-size: 16px;
+              }
+            }
+            &:nth-child(3) {
+              position: absolute;
+              right: 8%;
+              top: 30%;
+            }
+          }
+          li:nth-child(1) {
+            position: absolute;
+            left: 10%;
+            top: 30%;
+          }
+          li:nth-child(2) {
+            position: absolute;
+            top: -35%;
+            left: 50%;
+            transform: translateX(-50%);
+            width: 420px;
+            height: 420px;
+            .forward-list-item-star {
+              width: 60px;
+              height: 60px;
+            }
+            .forward-list-item-top {
+              .user-img {
+                width: 180px;
+                height: 180px;
+              }
+            }
+          }
+        }
+      }
+    }
+    .ranking-content-right {
+      width: 30%;
+      height: 680px;
+      padding: 0 30px;
+      box-sizing: border-box;
+      position: relative;
+      overflow-y: scroll;
+      .ranking-content-right-list {
+        
+        li {
+          display: flex;
+          align-items: center;
+          justify-content: space-between;
+          background: #2d2738;
+          padding: 8px 50px;
+          border-radius: 30px;
+          margin-top: 15px;
+          .left {
+            display: flex;
+            align-items: center;
+            .left-left {
+              width: 50px;
+              margin-right: 30px;
+              .rank {
+                span {
+                  font-size: 18px;
+                  font-weight: 700;
+                  // font-family: "Anton-Regular";
+                  color: #9950fd;
+                }
+                img {
+                  width: 40px;
+                  height: 30px;
+                }
+              }
+            }
+            .left-right {
+              display: flex;
+              align-items: center;
+              .user-img {
+                width: 45px;
+                height: 45px;
+                border-radius: 50%;
+                overflow: hidden;
+                img {
+                  width: 100%;
+                  height: 100%;
+                }
+              }
+              .user-name {
+                font-size: 16px;
+                margin-left: 20px;
+                line-height: 1.4;
+                .label {
+                  text-align: left;
+                  color: #5b5862;
+                  font-size: 12px;
+                }
+              }
+            }
+          }
+          .right {
+            line-height: 1.4;
+            .label {
+              text-align: left;
+              color: #5b5862;
+              font-size: 12px;
+            }
+            .records {
+              text-align: left;
+              // font-size: 12px;
+              // color: #9950fd;
+            }
+            .icon {
+              width: 10px;
+              height: 12px;
+              margin-left: 5px;
+              display: flex;
+              align-items: center;
+              img {
+                width: 100%;
+                height: 100%;
+              }
+            } 
+          }
+          &:nth-child(1) {
+            .left {
+              .user-img {
+                width: 40px;
+                height: 40px;
+                position: relative;
+                .one-bg {
+                  width: 60px;
+                  height: 60px;
+                  position: absolute;
+                  top: 50%;
+                  left: 50%;
+                  transform: translate(-50%, -50%);
+                }
+                .one-img {
+                  width: 40px;
+                  height: 40px;
+                  position: absolute;
+                  top: 50%;
+                  left: 50%;
+                  transform: translate(-50%, -50%)
+                } 
+              }
+            }
+          }
+        }
+      }
+      &::-webkit-scrollbar {
+        width: 5px;
+      }
+      &::-webkit-scrollbar-track{
+        background: #171220;
+        border-radius:2px;
+      }
+      &::-webkit-scrollbar-corner{
+        display: block;
+      }
+      &::-webkit-scrollbar-thumb{
+        height: 15px;
+        background: #9950fd;
+      }
+    }
+  }
+}
+</style>

src/views/ranking/index.vue

@@ -248,7 +248,7 @@ export default  {
   methods: {
     // 我的积分记录
     async getMyIntegralList() {
-      let res = await this.$axios.get(`/api/user/checkin/list/1month`,{ params: '',
+      let res = await this.$axios.get(process.env.VUE_APP_API_URL+`/api/user/checkin/list/all`,{ params: '',
         headers: { Authorization: `Bearer ${this.token}` },
       })
       this.detailsList = res.data.data
@@ -256,13 +256,13 @@ export default  {
 
     // 获取总积分榜
     async getLeaderBoard () {
-      let res = await this.$axios.get(`/api/activity/leaderboard/uaw_activity/0`)
+      let res = await this.$axios.get(process.env.VUE_APP_API_URL+`/api/activity/leaderboard/uaw_activity/0`)
       console.log(res.data.data)
       this.rankingTableData = res.data.data
     },
     // 获取用户状态
     getUserState() {
-      this.$axios.get('/api/user/state',{ params: '',
+      this.$axios.get(process.env.VUE_APP_API_URL+'/api/user/state',{ params: '',
           headers: { Authorization: `Bearer ${this.token}` },
       }).then(res => {
         this.userData = res.data.data

vue.config.js

@@ -4,65 +4,28 @@ const CopyWebpackPlugin = require("copy-webpack-plugin");
 function resolve(dir) {
   return path.join(__dirname, dir)
 }
-
 module.exports = defineConfig({
   transpileDependencies: true,
-  // configureWebpack: config => {
-  //   const plugins = [
-  //     new CopyWebpackPlugin(
-  //       {
-  //         patterns: [
-  //           {
-  //             from: __dirname + '/src/assets',
-  //             to: "assets"
-  //           },
-  //           // {
-  //           //   from: __dirname + '/src/assets/horse_avatar',
-  //           //   to: "assets/horse_avatar"
-  //           // },
-  //           // {
-  //           //   from: __dirname + '/src/assets/parts',
-  //           //   to: "assets/parts"
-  //           // },
-  //           // {
-  //           //   from: __dirname + '/src/assets/partsTwo',
-  //           //   to: "assets/partsTwo"
-  //           // },
-  //           // {
-  //           //   from: __dirname + '/src/assets/skills',
-  //           //   to: "assets/skills"
-  //           // },
-  //           // {
-  //           //   from: __dirname + '/src/assets/fusion',
-  //           //   to: "assets/fusion"
-  //           // }
-  //         ]
-  //       }
-  //     ),
-  //     //...其他的插件
-  //   ];
-  //   return { plugins }
-  // },
   lintOnSave: false,
   // productionSourceMap: false,
   publicPath: '/',
-  devServer: {
+  // devServer: {
-    open: false,
+  //   open: false,
-    // host: '0.0.0.0', // 允许外部ip访问
+  //   // host: '0.0.0.0', // 允许外部ip访问
-    port: 8030, // 端口
+  //   port: 8030, // 端口
-    https: false, // 启用https
+  //   https: false, // 启用https
-    // overlay: {
+  //   // overlay: {
-    //   warnings: true,
+  //   //   warnings: true,
-    //   errors: true
+  //   //   errors: true
-    // }, // 错误、警告在页面弹出
+  //   // }, // 错误、警告在页面弹出
-    proxy: {
+  //   proxy: {
-      '/api': {
+  //     '/api': {
-        target: process.env.VUE_APP_API_URL,
+  //       target: process.env.VUE_APP_API_URL,
-        changeOrigin: true, // 允许websockets跨域
+  //       changeOrigin: true, // 允许websockets跨域
-        pathRewrite: {
+  //       pathRewrite: {
-          '^/api': ''
+  //         '^/api': ''
-        }
+  //       }
-      },
+  //     },
-    }, // 代理转发配置，用于调试环境
+  //   }, // 代理转发配置，用于调试环境
-  },
+  // },
 })