Skip to content

Y
Ygopro Arena Web
Commit d2b9e1c9 authored by 铃兰's avatar 铃兰
Browse files
Options

profile页面增加了每月胜率，cards页面增加了期间使用率计算。

parent 24719f2c
Pipeline #22662 passed with stages
      in 2 minutes and 20 seconds
      Hide whitespace changes
      Inline Side-by-side
      Showing with 1144 additions and 941 deletions
      src/api.js
      View file @ d2b9e1c9
      ......@@ -10,154 +10,159 @@ const URL = "https://sapi.moecube.com:444/ygopro/arena"
      export default class Api {
      static uploadUrl = `${URL}/upload`
      static implUrl = `${URL}/impltrack`
      static clkUrl = `${URL}/clktrack`
      static getMonthlyWinRate() {
      let monthlyWinRateUrl = 'https://sapi.moecube.com:444/ygopro/analytics/matchup/type?source=mycard-athletic'
      return Vue.http.get(monthlyWinRateUrl)
      }
      static getDownloadUrl(url) {
      url = url.slice(7)
      var downloadUrl = `${URL}/download/${url}`
      return downloadUrl
      }
      static getCount(opt) {
      var request = query.stringify(opt);
      const url = `${config.COUNTER_URL}?${request}`;
      return Vue.http.get(url);
      }
      static getUserInfo(opt) {
      var request = query.stringify(opt);
      const url = `${URL}/user?${request}`;
      return Vue.http.get(url);
      }
      static getUsers(opt) {
      var request = query.stringify(opt);
      const url = `${URL}/users?${request}`;
      return Vue.http.get(url);
      }
      static getUserDueHistory(opt) {
      return Vue.http.get(`${URL}/history`, { 'params': opt });
      }
      static getDownloadUrls() {
      return Vue.http.get('https://api.github.com/repos/mycard/mycard/releases/latest')
      }
      static getAvatar(opt) {
      return Vue.http.get(`https://sapi.moecube.com:444/accounts/users/${opt.username}.avatar`)
      }
      static getCardInfo(opt) {
      var request = query.stringify(opt);
      const url = `${URL}/cardinfo?${request}`;
      return Vue.http.get(url);
      }
      static getDeckInfo(opt) {
      return Vue.http.get(`${URL}/deckinfo`, { 'params': opt });
      }
      static saveDeck(opt) {
      const url = `${URL}/deckinfo`
      return Vue.http.post(url, opt, { 'emulateJSON': true });
      }
      static saveDeckDemo(opt) {
      const url = `${URL}/deckdemo`
      return Vue.http.post(url, opt, { 'emulateJSON': true });
      }
      static getReport(opt) {
      return Vue.http.get(`${URL}/report`, { 'params': opt });
      }
      static getVoteList(opt) {
      return Vue.http.get(`${URL}/votes`, { 'params': opt });
      }
      static saveVote(opt) {
      const url = `${URL}/votes`
      return Vue.http.post(url, opt, { 'emulateJSON': true });
      }
      static voteStatus(opt) {
      const url = `${URL}/voteStatus`
      return Vue.http.post(url, opt, { 'emulateJSON': true });
      }
      static getVote(opt) {
      return Vue.http.get(`${URL}/vote`, { 'params': opt });
      }
      static submitVote(opt) {
      const url = `${URL}/submitVote`
      return Vue.http.post(url, opt, { 'emulateJSON': true });
      }
      static saveAds(opt) {
      const url = `${URL}/ads`
      return Vue.http.post(url, opt, { 'emulateJSON': true });
      }
      static getAdsList(opt) {
      return Vue.http.get(`${URL}/ads`, { 'params': opt });
      }
      static adsStatus(opt) {
      const url = `${URL}/adsStatus`
      return Vue.http.post(url, opt, { 'emulateJSON': true });
      }
      static getAd(opt) {
      return Vue.http.get(`${URL}/getAd`, { 'params': opt });
      }
      static adClick(opt) {
      const url = `${URL}/adClick`
      return Vue.http.post(url, opt, { 'emulateJSON': true });
      }
      static adImpl(opt) {
      const url = `${URL}/adImpl`
      return Vue.http.post(url, opt, { 'emulateJSON': true });
      }
      static getFirstWin(opt) {
      var request = query.stringify(opt);
      const url = `${URL}/firstwin?${request}`;
      return Vue.http.get(url);
      }
      static adSwitchChange(opt) {
      const url = `${URL}/adSwitchChange`
      return Vue.http.post(url, opt, { 'emulateJSON': true });
      }
      static saveActivity(opt) {
      const url = `${URL}/activity`
      return Vue.http.post(url, opt, { 'emulateJSON': true });
      }
      static saveLabel(opt) {
      const url = `${URL}/label`
      return Vue.http.post(url, opt, { 'emulateJSON': true });
      }
      static getLabel(opt) {
      return Vue.http.get(`${URL}/label`, { 'params': {} });
      }
      static uploadUrl = `${URL}/upload`
      static implUrl = `${URL}/impltrack`
      static clkUrl = `${URL}/clktrack`
      static getMonthlyWinRate() {
      let monthlyWinRateUrl = 'https://sapi.moecube.com:444/ygopro/analytics/matchup/type?source=mycard-athletic'
      return Vue.http.get(monthlyWinRateUrl)
      }
      static getDownloadUrl(url) {
      url = url.slice(7)
      var downloadUrl = `${URL}/download/${url}`
      return downloadUrl
      }
      static getCount(opt) {
      var request = query.stringify(opt);
      const url = `${config.COUNTER_URL}?${request}`;
      return Vue.http.get(url);
      }
      static getUserInfo(opt) {
      var request = query.stringify(opt);
      const url = `${URL}/user?${request}`;
      return Vue.http.get(url);
      }
      static getUsers(opt) {
      var request = query.stringify(opt);
      const url = `${URL}/users?${request}`;
      return Vue.http.get(url);
      }
      static getUserDueHistory(opt) {
      return Vue.http.get(`${URL}/history`, {'params': opt});
      }
      static getDownloadUrls() {
      return Vue.http.get('https://api.github.com/repos/mycard/mycard/releases/latest')
      }
      static getAvatar(opt) {
      return Vue.http.get(`https://sapi.moecube.com:444/accounts/users/${opt.username}.avatar`)
      }
      static getCardInfo(opt) {
      var request = query.stringify(opt);
      const url = `${URL}/cardinfo?${request}`;
      return Vue.http.get(url);
      }
      static getDeckInfo(opt) {
      return Vue.http.get(`${URL}/deckinfo`, {'params': opt});
      }
      static saveDeck(opt) {
      const url = `${URL}/deckinfo`
      return Vue.http.post(url, opt, {'emulateJSON': true});
      }
      static saveDeckDemo(opt) {
      const url = `${URL}/deckdemo`
      return Vue.http.post(url, opt, {'emulateJSON': true});
      }
      static getReport(opt) {
      return Vue.http.get(`${URL}/report`, {'params': opt});
      }
      static getVoteList(opt) {
      return Vue.http.get(`${URL}/votes`, {'params': opt});
      }
      static saveVote(opt) {
      const url = `${URL}/votes`
      return Vue.http.post(url, opt, {'emulateJSON': true});
      }
      static voteStatus(opt) {
      const url = `${URL}/voteStatus`
      return Vue.http.post(url, opt, {'emulateJSON': true});
      }
      static getVote(opt) {
      return Vue.http.get(`${URL}/vote`, {'params': opt});
      }
      static submitVote(opt) {
      const url = `${URL}/submitVote`
      return Vue.http.post(url, opt, {'emulateJSON': true});
      }
      static saveAds(opt) {
      const url = `${URL}/ads`
      return Vue.http.post(url, opt, {'emulateJSON': true});
      }
      static getAdsList(opt) {
      return Vue.http.get(`${URL}/ads`, {'params': opt});
      }
      static adsStatus(opt) {
      const url = `${URL}/adsStatus`
      return Vue.http.post(url, opt, {'emulateJSON': true});
      }
      static getAd(opt) {
      return Vue.http.get(`${URL}/getAd`, {'params': opt});
      }
      static adClick(opt) {
      const url = `${URL}/adClick`
      return Vue.http.post(url, opt, {'emulateJSON': true});
      }
      static adImpl(opt) {
      const url = `${URL}/adImpl`
      return Vue.http.post(url, opt, {'emulateJSON': true});
      }
      static getFirstWin(opt) {
      var request = query.stringify(opt);
      const url = `${URL}/firstwin?${request}`;
      return Vue.http.get(url);
      }
      static adSwitchChange(opt) {
      const url = `${URL}/adSwitchChange`
      return Vue.http.post(url, opt, {'emulateJSON': true});
      }
      static saveActivity(opt) {
      const url = `${URL}/activity`
      return Vue.http.post(url, opt, {'emulateJSON': true});
      }
      static saveLabel(opt) {
      const url = `${URL}/label`
      return Vue.http.post(url, opt, {'emulateJSON': true});
      }
      static getLabel(opt) {
      return Vue.http.get(`${URL}/label`, {'params': {}});
      }
      static getMonthlyHistory(opt) {
      const url = `https://sapi.moecube.com:444/ygopro/arena/historyScore`;
      return Vue.http.get(url, {params: opt});
      }
      // https://sapi.moecube.com:444/ygopro/arena/historyScore?username=id&season=yyyy-mm
      }
      src/components/Cards.vue
      View file @ d2b9e1c9
      <template>
      <div>
      <div class="content">
      <div class="container">
      <div>
      <h4 class="color-blue">
      <i class="glyphicon glyphicon-filter"></i>
      {{lang.qc}}
      </h4>
      <div class="well">
      <form action="" method="get" role="form" class="form-inline form-filter">
      <div class="form-group" style="margin-right: 10px;">
      <div class="input-group">
      <div class="input-group-addon">{{lang.time}}</div>
      <select name="type" class="form-control" id="type" v-on:change="onChange">
      <option value="day">{{lang.today}}</option>
      <option value="week">{{lang.week}}</option>
      <option value="halfmonth">{{lang.half_month}}</option>
      <option value="month">{{lang.month}}</option>
      <option value="season">{{lang.season}}</option>
      </select>
      </div>
      </div>
      <div class="form-group" style="margin-right: 10px;">
      <div class="input-group">
      <div class="input-group-addon">{{lang.source}}</div>
      <select name="server" class="form-control" id="server" v-on:change="onChange">
      <option value="mycard">MCPro</option>
      <option value="233">233</option>
      <option value="koishi">Koishi</option>
      <option value="koishi_tcg">Koishi_tcg</option>
      </select>
      </div>
      </div>
      <div class="form-group" style="margin-right: 10px;">
      <div class="input-group">
      <div class="input-group-addon">{{lang.type}}</div>
      <select name="source" class="form-control" id="source" v-on:change="onChange">
      <option value="athletic">{{lang.athletic}}</option>
      <option value="entertain">{{lang.entertain}}</option>
      <option value="custom">{{lang.custom}}</option>
      <option value="tag">{{lang.tag}}</option>
      </select>
      </div>
      </div>
      <div class="form-group" style="margin-right: 10px;">
      <div class="input-group">
      <div class="input-group-addon">{{lang.totalDeck}}</div>
      <span class="form-control">{{totalDeck}}</span>
      </div>
      </div>
      <div class="form-group" style="display:none">
      <button type="submit" id="search"
      class="form-control btn btn-primary">{{lang.search}}</button>
      </div>
      </form>
      </div>
      <h4 class="color-blue"><i class="glyphicon glyphicon-list-alt"></i> {{lang.table_data}} </h4>
      <div>
      <ul class="nav nav-tabs">
      <li :class="{ active: isActive }" v-if="isActive">
      <a href="#tab-0" role="tab" data-toggle="tab" @click='navClick("Deck")'><img class="tab-img" :src="img0" ></a>
      </li>
      <li :class="{ active: !isActive }">
      <a href="#tab-1" role="tab" data-toggle="tab" @click='navClick("Monster")'><img class="tab-img" :src="img1"></a>
      </li>
      <li>
      <a href="#tab-2" role="tab" data-toggle="tab" @click='navClick("Spell")'><img class="tab-img" :src="img2"></a>
      </li>
      <li>
      <a href="#tab-3" role="tab" data-toggle="tab" @click='navClick("Trap")' ><img class="tab-img" :src="img3"></a>
      </li>
      <li>
      <a href="#tab-4" role="tab" data-toggle="tab" @click='navClick("Side")'><img class="tab-img" :src="img4"></a>
      </li>
      <li>
      <a href="#tab-5" role="tab" data-toggle="tab" @click='navClick("Extra")'><img class="tab-img" :src="img5"></a>
      </li>
      </ul>
      <div class="tab-content">
      <div role="tabpanel" class="tab-pane" :class="{ active: isActive }" v-if="isActive"
      id="tab-0">
      <br>
      <div class="table-responsive" style="width:100%;overflow-x:auto;overflow-y:hidden;">
      <table id="deck" class="table table-striped table-bordered table-hover example"
      :width="width"></table>
      </div>
      </div>
      <div role="tabpanel" class="tab-pane" :class="{ active: !isActive }" id="tab-1">
      <br>
      <div class="table-responsive" style="width:100%;overflow-x:auto;overflow-y:hidden;">
      <table id="monster" class="table table-striped table-bordered table-hover example"
      :width="width"></table>
      </div>
      </div>
      <div role="tabpanel" class="tab-pane" id="tab-2">
      <br>
      <div class="table-responsive" style="width:100%;overflow-x:auto;overflow-y:hidden;">
      <table id="spell" class="table table-striped table-bordered table-hover example"
      :width="width"></table>
      </div>
      </div>
      <div role="tabpanel" class="tab-pane" id="tab-3">
      <br>
      <div class="table-responsive" style="width:100%;overflow-x:auto;overflow-y:hidden;">
      <table id="trap" class="table table-striped table-bordered table-hover example"
      :width="width"></table>
      </div>
      </div>
      <div role="tabpanel" class="tab-pane" id="tab-4">
      <br>
      <div class="table-responsive" style="width:100%;overflow-x:auto;overflow-y:hidden;">
      <table id="side" class="table table-striped table-bordered table-hover example"
      :width="width"></table>
      </div>
      </div>
      <div role="tabpanel" class="tab-pane" id="tab-5">
      <br>
      <div class="table-responsive" style="width:100%;overflow-x:auto;overflow-y:hidden;">
      <table id="ex" class="table table-striped table-bordered table-hover example"
      :width="width"></table>
      </div>
      </div>
      <div class="form-group" style="display:none">
      <button type="submit" id="search"
      class="form-control btn btn-primary">{{lang.search}}</button>
      </div>
      </div>
      </div>
      <div>
      <div class="content">
      <div class="container">
      <div>
      <h4 class="color-blue">
      <i class="glyphicon glyphicon-filter"></i>
      {{ lang.qc }}
      </h4>
      <div class="well">
      <form action="" method="get" role="form" class="form-inline form-filter">
      <div class="form-group" style="margin-right: 10px;">
      <div class="input-group">
      <div class="input-group-addon">{{ lang.time }}</div>
      <select name="type" class="form-control" id="type" v-on:change="onChange">
      <option value="day">{{ lang.today }}</option>
      <option value="week">{{ lang.week }}</option>
      <option value="halfmonth">{{ lang.half_month }}</option>
      <option value="month">{{ lang.month }}</option>
      <option value="season">{{ lang.season }}</option>
      </select>
      </div>
      </div>
      <div class="form-group" style="margin-right: 10px;">
      <div class="input-group">
      <div class="input-group-addon">{{ lang.source }}</div>
      <select name="server" class="form-control" id="server" v-on:change="onChange">
      <option value="mycard">MCPro</option>
      <option value="233">233</option>
      <option value="koishi">Koishi</option>
      <option value="koishi_tcg">Koishi_tcg</option>
      </select>
      </div>
      </div>
      <div class="form-group" style="margin-right: 10px;">
      <div class="input-group">
      <div class="input-group-addon">{{ lang.type }}</div>
      <select name="source" class="form-control" id="source" v-on:change="onChange">
      <option value="athletic">{{ lang.athletic }}</option>
      <option value="entertain">{{ lang.entertain }}</option>
      <option value="custom">{{ lang.custom }}</option>
      <option value="tag">{{ lang.tag }}</option>
      </select>
      </div>
      </div>
      <div class="form-group" style="margin-right: 10px;">
      <div class="input-group">
      <div class="input-group-addon">{{ lang.totalDeck }}</div>
      <span class="form-control">{{ totalDeck }}</span>
      </div>
      </div>
      <div class="form-group" style="display:none">
      <button type="submit" id="search"
      class="form-control btn btn-primary">{{ lang.search }}
      </button>
      </div>
      </form>
      </div>
      <h4 class="color-blue"><i class="glyphicon glyphicon-list-alt"></i> {{ lang.table_data }} </h4>
      <div>
      <ul class="nav nav-tabs">
      <li :class="{ active: isActive }" v-if="isActive">
      <a href="#tab-0" role="tab" data-toggle="tab" @click='navClick("Deck")'><img class="tab-img"
      :src="img0"></a>
      </li>
      <li :class="{ active: !isActive }">
      <a href="#tab-1" role="tab" data-toggle="tab" @click='navClick("Monster")'><img class="tab-img"
      :src="img1"></a>
      </li>
      <li>
      <a href="#tab-2" role="tab" data-toggle="tab" @click='navClick("Spell")'><img class="tab-img"
      :src="img2"></a>
      </li>
      <li>
      <a href="#tab-3" role="tab" data-toggle="tab" @click='navClick("Trap")'><img class="tab-img"
      :src="img3"></a>
      </li>
      <li>
      <a href="#tab-4" role="tab" data-toggle="tab" @click='navClick("Side")'><img class="tab-img"
      :src="img4"></a>
      </li>
      <li>
      <a href="#tab-5" role="tab" data-toggle="tab" @click='navClick("Extra")'><img class="tab-img"
      :src="img5"></a>
      </li>
      </ul>
      <div class="tab-content">
      <div role="tabpanel" class="tab-pane" :class="{ active: isActive }" v-if="isActive"
      id="tab-0">
      <br>
      <div class="table-responsive" style="width:100%;overflow-x:auto;overflow-y:hidden;">
      <table id="deck" class="table table-striped table-bordered table-hover example"
      :width="width"></table>
      </div>
      </div>
      <div role="tabpanel" class="tab-pane" :class="{ active: !isActive }" id="tab-1">
      <br>
      <div class="table-responsive" style="width:100%;overflow-x:auto;overflow-y:hidden;">
      <table id="monster" class="table table-striped table-bordered table-hover example"
      :width="width"></table>
      </div>
      </div>
      <div role="tabpanel" class="tab-pane" id="tab-2">
      <br>
      <div class="table-responsive" style="width:100%;overflow-x:auto;overflow-y:hidden;">
      <table id="spell" class="table table-striped table-bordered table-hover example"
      :width="width"></table>
      </div>
      </div>
      <div role="tabpanel" class="tab-pane" id="tab-3">
      <br>
      <div class="table-responsive" style="width:100%;overflow-x:auto;overflow-y:hidden;">
      <table id="trap" class="table table-striped table-bordered table-hover example"
      :width="width"></table>
      </div>
      </div>
      <div role="tabpanel" class="tab-pane" id="tab-4">
      <br>
      <div class="table-responsive" style="width:100%;overflow-x:auto;overflow-y:hidden;">
      <table id="side" class="table table-striped table-bordered table-hover example"
      :width="width"></table>
      </div>
      </div>
      <div role="tabpanel" class="tab-pane" id="tab-5">
      <br>
      <div class="table-responsive" style="width:100%;overflow-x:auto;overflow-y:hidden;">
      <table id="ex" class="table table-striped table-bordered table-hover example"
      :width="width"></table>
      </div>
      <Footads></Footads>
      </div>
      <div class="form-group" style="display:none">
      <button type="submit" id="search"
      class="form-control btn btn-primary">{{ lang.search }}
      </button>
      </div>
      </div>
      </div>
      </div>
      </div>
      <Footads></Footads>
      </div>
      </div>
      </div>
      </template>
      <script>
      import Footads from './Footads'
      import tb_language from './tb_lang.js'
      import {
      mapGetters
      } from 'vuex'
      import API from '../api';
      import img0 from '../assets/img/500x300_deck.png'
      import img1 from '../assets/img/500x300_monster.png'
      import img2 from '../assets/img/500x300_Spell.png'
      import img3 from '../assets/img/500x300_Trap.png'
      import img4 from '../assets/img/500x300_side.png'
      import img5 from '../assets/img/ExtraWithBorder.png'
      var dt = require('datatables.net')
      var dt2 = require('datatables.net-bs')
      import "../assets/css/dataTables.bootstrap.min.css"
      var monsterTable;
      var spellTable;
      var trapTable;
      var exTable;
      var sideTable;
      var deckTable;
      const placeholder={
      Deck:'请输入卡组名..',
      Monster:'请输入怪兽卡名..',
      Spell:'请输入魔法卡名..',
      Trap:'请输入陷阱卡名..',
      Side:'请输入卡片名..',
      Extra:'请输入卡片名..',
      import Footads from './Footads'
      import tb_language from './tb_lang.js'
      import {
      mapGetters
      } from 'vuex'
      import API from '../api';
      import img0 from '../assets/img/500x300_deck.png'
      import img1 from '../assets/img/500x300_monster.png'
      import img2 from '../assets/img/500x300_Spell.png'
      import img3 from '../assets/img/500x300_Trap.png'
      import img4 from '../assets/img/500x300_side.png'
      import img5 from '../assets/img/ExtraWithBorder.png'
      var dt = require('datatables.net')
      var dt2 = require('datatables.net-bs')
      import "../assets/css/dataTables.bootstrap.min.css"
      var monsterTable;
      var spellTable;
      var trapTable;
      var exTable;
      var sideTable;
      var deckTable;
      const placeholder = {
      Deck: '请输入卡组名..',
      Monster: '请输入怪兽卡名..',
      Spell: '请输入魔法卡名..',
      Trap: '请输入陷阱卡名..',
      Side: '请输入卡片名..',
      Extra: '请输入卡片名..',
      }
      export default {
      components: {
      Footads
      },
      created: function () {
      var regex_match =
      /(nokia|iphone|android|motorola|^mot-|softbank|foma|docomo|kddi|up.browser|up.link|htc|dopod|blazer|netfront|helio|hosin|huawei|novarra|CoolPad|webos|techfaith|palmsource|blackberry|alcatel|amoi|ktouch|nexian|samsung|^sam-|s[cg]h|^lge|ericsson|philips|sagem|wellcom|bunjalloo|maui|symbian|smartphone|midp|wap|phone|windows ce|iemobile|^spice|^bird|^zte-|longcos|pantech|gionee|^sie-|portalmmm|jigs browser|hiptop|^benq|haier|^lct|operas*mobi|opera*mini|320x320|240x320|176x220)/i;
      var u = navigator.userAgent;
      if (null == u) {
      return true;
      }
      var result = regex_match.exec(u);
      if (null == result) {
      } else {
      this.width = "250%"
      }
      var lang = localStorage.getItem('lang') || 'cn';
      this.init(lang)
      },
      mounted: function () {
      this.init2();
      },
      data() {
      return {
      totalDeck: 0,
      type: "",
      isActive: true,
      width: "100%",
      img0: img0,
      img1: img1,
      img2: img2,
      img3: img3,
      img4: img4,
      img5: img5,
      }
      },
      computed: {
      ...mapGetters({
      lang: 'getLang',
      }),
      },
      watch: {
      lang: function (val) {
      // console.log('lang change1', val)
      this.init2()
      },
      },
      methods: {
      period(){
      // 计算禁卡表发布时间间隔
      const today = new Date();
      const year = today.getFullYear();
      const dates = [
      new Date(year, 0, 1),
      new Date(year, 3, 1),
      new Date(year, 6, 1),
      new Date(year, 9, 1),
      ];
      const season = dates.reduce((min, date) => {
      const diff = Math.floor((today - date) / (1000 * 60 * 60 * 24));
      if (today >= date && diff >= 0 && diff < min) {
      return diff;
      }
      return min;
      }, Infinity);
      // 根据select设定对应天数
      const periodMap = {
      day: 1,
      week: 7,
      halfmonth: 15,
      month: 30,
      season: season
      };
      var selectedType = $("#type").val();
      return periodMap[selectedType] || 1;
      },
      navClick(data) {
      // console.log('%c ---------------------src' + '\\' + 'components' + '\\' + 'Cards.vue---------------------%c:238', 'background:#f034c6', 'background:#14f1a4',
      // data)
      $(".input-sm").attr("placeholder", placeholder[data])
      },
      init: function (lang) {
      if (lang === "cn") {
      this.isActive = true;
      } else {
      this.isActive = false;
      }
      export default {
      components: {
      Footads
      },
      created: function() {
      var regex_match =
      /(nokia|iphone|android|motorola|^mot-|softbank|foma|docomo|kddi|up.browser|up.link|htc|dopod|blazer|netfront|helio|hosin|huawei|novarra|CoolPad|webos|techfaith|palmsource|blackberry|alcatel|amoi|ktouch|nexian|samsung|^sam-|s[cg]h|^lge|ericsson|philips|sagem|wellcom|bunjalloo|maui|symbian|smartphone|midp|wap|phone|windows ce|iemobile|^spice|^bird|^zte-|longcos|pantech|gionee|^sie-|portalmmm|jigs browser|hiptop|^benq|haier|^lct|operas*mobi|opera*mini|320x320|240x320|176x220)/i;
      var u = navigator.userAgent;
      if (null == u) {
      return true;
      }
      var result = regex_match.exec(u);
      if (null == result) {} else {
      this.width = "250%"
      }
      var lang = localStorage.getItem('lang') || 'cn';
      this.init(lang)
      },
      mounted: function() {
      this.init2();
      },
      data() {
      return {
      isActive: true,
      totalDeck: 0,
      width: "100%",
      img0: img0,
      img1: img1,
      img2: img2,
      img3: img3,
      img4: img4,
      img5: img5,
      }
      },
      computed: {
      ...mapGetters({
      lang: 'getLang',
      }),
      },
      watch: {
      lang: function(val) {
      // console.log('lang change1', val)
      this.init2()
      },
      },
      methods: {
      navClick(data){
      console.log('%c ---------------------src'+'\\'+'components'+'\\'+'Cards.vue---------------------%c:238','background:#f034c6','background:#14f1a4',
      data)
      $(".input-sm").attr("placeholder",placeholder[data])
      // this.lang = language[lang]
      this.getCount()
      },
      init2: function () {
      var lang = localStorage.getItem('lang') || 'cn';
      if (lang === "cn") {
      this.isActive = true;
      } else {
      this.isActive = false;
      }
      var self = this;
      this.getCount().then(function (count) {
      self.totalDeck = count; // 设置totalDeck的值
      // 在获取到count后调用init2
      },
      init: function(lang) {
      if (lang === "cn") {
      this.isActive = true;
      } else {
      this.isActive = false;
      }
      // this.lang = language[lang]
      this.getCount()
      },
      init2: function() {
      var lang = localStorage.getItem('lang') || 'cn';
      if (lang === "cn") {
      this.isActive = true;
      } else {
      this.isActive = false;
      }
      function renderPage() {
      function renderPage() {
      if (monsterTable) {
      monsterTable.clear();
      monsterTable.destroy();
      }
      if (spellTable) {
      spellTable.clear();
      spellTable.destroy();
      }
      if (trapTable) {
      trapTable.clear();
      trapTable.destroy();
      }
      if (exTable) {
      exTable.clear();
      exTable.destroy();
      }
      if (sideTable) {
      sideTable.clear();
      sideTable.destroy();
      }
      var server = $("#server").val() || "mycard"
      var source = $("#source").val() || "athletic"
      var final_source = server + "-" + source
      $.get('https://sapi.moecube.com:444/ygopro/analytics/single/type', {
      type: $("#type").val(),
      lang: localStorage.getItem('lang') || 'cn',
      extra: 'name',
      source: final_source
      }, function(data) {
      var monster = data.monster;
      var spell = data.spell;
      var trap = data.trap;
      var side = data.side;
      var ex = data.ex;
      monsterTable = renderTable("#monster", monster)
      spellTable = renderTable("#spell", spell)
      trapTable = renderTable("#trap", trap)
      exTable = renderTable("#ex", ex)
      sideTable = renderTable("#side", side)
      });
      //卡组api https://sapi.moecube.com:444/ygopro/analytics/deck/type?type=day&source=mycard-entertain
      //只显示中文
      var lang = localStorage.getItem('lang') || 'cn';
      if (lang === "cn") {
      if (deckTable) {
      deckTable.clear();
      deckTable.destroy();
      }
      $.get('https://sapi.moecube.com:444/ygopro/analytics/deck/type', {
      type: $("#type").val(),
      source: final_source
      }, function(data) {
      var obj = data;
      if (typeof obj === 'string')
      obj = JSON.parse(data);
      var rank = 1;
      var processData = obj.map(function(x) {
      var tagStr = [];
      var deckName = x.name;
      for (var i = 0; i < x.tags.length; i++) {
      var tagName = x.tags[i].name || x.tags[i].toString() || "";
      var short_tagName = tagName.replace(deckName + "-", "");
      tagStr.push(short_tagName)
      }
      return [rank++, x.name, x.count, tagStr.join(" , ")];
      });
      deckTable = $("#deck").DataTable({
      data: processData,
      pageLength: 25,
      order: [
      [2, "desc"]
      ],
      "ordering": true,
      columns: [{
      title: tb_language[lang].rank
      },
      {
      title: tb_language[lang].deck
      },
      {
      title: tb_language[lang].count
      },
      {
      title: tb_language[lang].topTags
      },
      ],
      "columnDefs": [{
      "render": function(data, type, row) {
      // return "<span title='" + data + "'>" + data + "</span>";
      // return "<img src='imag.png' />";
      return "<a href='?name=" + data + "#/deck'>" +
      data + "</a>";
      },
      "targets": 1
      }, ],
      "language": tb_language[lang]
      });
      });
      }
      if (monsterTable) {
      monsterTable.clear();
      monsterTable.destroy();
      }
      if (spellTable) {
      spellTable.clear();
      spellTable.destroy();
      }
      if (trapTable) {
      trapTable.clear();
      trapTable.destroy();
      }
      if (exTable) {
      exTable.clear();
      exTable.destroy();
      }
      if (sideTable) {
      sideTable.clear();
      sideTable.destroy();
      }
      var server = $("#server").val() || "mycard"
      var source = $("#source").val() || "athletic"
      var final_source = server + "-" + source
      $.get('https://sapi.moecube.com:444/ygopro/analytics/single/type', {
      type: $("#type").val(),
      lang: localStorage.getItem('lang') || 'cn',
      extra: 'name',
      source: final_source
      }, function (data) {
      var monster = data.monster;
      var spell = data.spell;
      var trap = data.trap;
      var side = data.side;
      var ex = data.ex;
      monsterTable = renderTable("#monster", monster)
      spellTable = renderTable("#spell", spell)
      trapTable = renderTable("#trap", trap)
      exTable = renderTable("#ex", ex)
      sideTable = renderTable("#side", side)
      // console.log(data)
      });
      //卡组api https://sapi.moecube.com:444/ygopro/analytics/deck/type?type=day&source=mycard-entertain
      //只显示中文
      var lang = localStorage.getItem('lang') || 'cn';
      if (lang === "cn") {
      if (deckTable) {
      deckTable.clear();
      deckTable.destroy();
      }
      $.get('https://sapi.moecube.com:444/ygopro/analytics/deck/type', {
      type: $("#type").val(),
      source: final_source
      }, function (data) {
      var obj = data;
      if (typeof obj === 'string')
      obj = JSON.parse(data);
      var rank = 1;
      var processData = obj.map(function (x) {
      var tagStr = [];
      var deckName = x.name;
      for (var i = 0; i < x.tags.length; i++) {
      var tagName = x.tags[i].name || x.tags[i].toString() || "";
      var short_tagName = tagName.replace(deckName + "-", "");
      tagStr.push(short_tagName)
      }
      function renderTable(tableID, tableData) {
      tableData = tableData || [];
      var lang = localStorage.getItem('lang') || 'cn';
      var langIndex = (lang === 'en' ? 'en-US' : 'zh-CN');
      var rank = 1;
      var processData = tableData.map(function(d) {
      return [rank++, d.name ? d.name[langIndex] : "未知卡片", d.frequency, d.putone, d
      .puttwo, d.putthree, d.id
      ];
      });
      var table = $(tableID).DataTable({
      data: processData,
      pageLength: 50,
      order: [
      [2, "desc"]
      ],
      "ordering": true,
      columns: [{
      title: tb_language[lang].rank
      },
      {
      title: tb_language[lang].cardName
      },
      {
      title: tb_language[lang].used
      },
      {
      title: tb_language[lang].put1
      },
      {
      title: tb_language[lang].put2
      },
      {
      title: tb_language[lang].put3
      },
      ],
      "columnDefs": [{
      "render": function(data, type, row) {
      return "<a href='https://www.ourocg.cn/search/" + row[6] +
      "'>" + data + "</a>";
      },
      "targets": 1
      }, ],
      "language": tb_language[lang]
      });
      $(".input-sm").attr("placeholder",placeholder.Deck)
      return table;
      }
      renderPage();
      $("#search").click(function() {
      renderPage();
      return false;
      })
      },
      onChange: function() {
      $("#search").trigger('click')
      this.getCount()
      var period = self.period();
      var PickRate = (0 < (x.count / (self.totalDeck * period)) && (x.count / (self.totalDeck * period)) < 1)
      ? ((x.count / (self.totalDeck * period) * 100)).toFixed(2) + "%" : "-";
      // 出现-是数据算出来不在0-1之间
      return [rank++, x.name, x.count, PickRate, tagStr.join(" , ")];
      });
      deckTable = $("#deck").DataTable({
      data: processData,
      pageLength: 25,
      order: [
      [2, "desc"]
      ],
      ordering: true,
      columns: [
      {
      title: tb_language[lang].rank
      },
      {
      title: tb_language[lang].deck
      },
      {
      title: tb_language[lang].count
      },
      {
      title: tb_language[lang].PickRate
      },
      {
      title: tb_language[lang].topTags
      },
      ],
      columnDefs: [
      {
      render: function (data, type, row) {
      return "<a href='?name=" + data + "#/deck'>" + data + "</a>";
      },
      targets: 1
      }
      ],
      language: tb_language[lang]
      });
      });
      }
      }
      function renderTable(tableID, tableData) {
      tableData = tableData || [];
      var lang = localStorage.getItem('lang') || 'cn';
      var langIndex = (lang === 'en' ? 'en-US' : 'zh-CN');
      var rank = 1;
      var processData = tableData.map(function (d) {
      var period = self.period();
      var PickRate = (parseInt(d.putone) + parseInt(d.puttwo) + parseInt(d.putthree)) / self.totalDeck / period;
      PickRate = (0 < PickRate && PickRate < 1) ? (PickRate * 100).toFixed(2) + "%" : "-";
      // 使用率出现-是数据算出来不在0-1之间
      return [
      rank++, d.name ? d.name[langIndex] : "未知卡片",
      d.frequency,
      PickRate,
      d.putone,
      d.puttwo,
      d.putthree,
      d.id
      ];
      });
      var table = $(tableID).DataTable({
      data: processData,
      pageLength: 50,
      order: [
      [2, "desc"]
      ],
      "ordering": true,
      columns: [{
      title: tb_language[lang].rank
      },
      getCount: function() {
      var server = $("#server").val() || "mycard"
      var source = $("#source").val() || "athletic"
      var opt = {
      type: $("#type").val() || "day",
      source: server + "-" + source
      }
      var self = this
      API.getCount(opt).then((res) => {
      if (isNaN(res.data)) {
      self.totalDeck = 0
      } else {
      self.totalDeck = res.data
      }
      });
      }
      },
      events: {
      'lang-change': function(lang) {
      this.init(lang)
      this.onChange()
      }
      },
      {
      title: tb_language[lang].cardName
      },
      {
      title: tb_language[lang].used
      },
      {
      title: tb_language[lang].PickRate
      },
      {
      title: tb_language[lang].put1
      },
      {
      title: tb_language[lang].put2
      },
      {
      title: tb_language[lang].put3
      },
      ],
      "columnDefs": [{
      "render": function (data, type, row) {
      return "<a href='https://www.ourocg.cn/search/" + row[6] +
      "'>" + data + "</a>";
      },
      "targets": 1
      },],
      "language": tb_language[lang]
      });
      $(".input-sm").attr("placeholder", placeholder.Deck)
      return table;
      }
      renderPage();
      $("#search").click(function () {
      renderPage();
      return false;
      })
      });
      },
      onChange: function () {
      $("#search").trigger('click')
      this.getCount()
      },
      getCount: function () {
      var server = $("#server").val() || "mycard"
      var source = $("#source").val() || "athletic"
      var opt = {
      type: $("#type").val() || "day",
      source: server + "-" + source
      }
      return API.getCount(opt).then((res) => {
      if (isNaN(res.data)) {
      return 0;
      } else {
      return res.data;
      }
      });
      }
      },
      events: {
      'lang-change': function (lang) {
      this.init(lang)
      this.onChange()
      }
      },
      }
      </script>
      <style scoped>
      #deck {
      margin-top:20px!important;
      border:1px solid black;
      }
      </style>
      \ No newline at end of file
      #deck {
      margin-top: 20px !important;
      border: 1px solid black;
      }
      </style>
      src/components/Profile.vue
      View file @ d2b9e1c9
      ......@@ -6,121 +6,139 @@
      <div class="thumbnail">
      <img v-bind:src="user.avatar_url" style="height:200px;margin-top:13px;">
      <div class="caption">
      <h3> <i class="glyphicon glyphicon-user"></i> <strong>{{user.username}}</strong></h3>
      <p class="text-muted" style="font-size:20px;">今日首胜: {{activity.today}}/1 </p>
      <p class="text-muted" v-if="showActivity" style="font-size:20px;">{{activity.name}}首胜: {{activity.total}}/{{activity.max}} </p>
      <h3><i class="glyphicon glyphicon-user"></i> <strong>{{ user.username }}</strong></h3>
      <p class="text-muted" style="font-size:20px;">今日首胜: {{ activity.today }}/1 </p>
      <p class="text-muted" v-if="showActivity" style="font-size:20px;">{{ activity.name }}首胜:
      {{ activity.total }}/{{ activity.max }} </p>
      </div>
      </div>
      </div>
      <div class="col-md-9">
      <div class="panel panel-default">
      <div class="panel-heading">
      <h3 class="panel-title">{{lang.athletic}} </h3>
      <h3 class="panel-title">{{ lang.athletic }} </h3>
      </div>
      <div class="table-responsive">
      <table class="table table-striped table-bordered table-hover">
      <tbody>
      <tr>
      <td>D.P </td>
      <td>{{user_info.pt}} </td>
      </tr>
      <tr>
      <td>{{lang.athletic_rank}} </td>
      <td>{{user_info.arena_rank}} </td>
      </tr>
      <tr>
      <td>{{lang.win}} </td>
      <td>{{user_info.athletic_win}} </td>
      </tr>
      <tr>
      <td>{{lang.lose}} </td>
      <td>{{user_info.athletic_lose}} </td>
      </tr>
      <tr>
      <td>{{lang.draw}} </td>
      <td>{{user_info.athletic_draw}} </td>
      </tr>
      <tr>
      <td>{{lang.all}} </td>
      <td>{{user_info.athletic_all}} </td>
      </tr>
      <tr>
      <td>{{lang.ratio}} </td>
      <td>{{user_info.athletic_wl_ratio}}% </td>
      </tr>
      <tr>
      <td>D.P</td>
      <td>{{ user_info.pt }}</td>
      </tr>
      <tr>
      <td>{{ lang.athletic_rank }}</td>
      <td>{{ user_info.arena_rank }}</td>
      </tr>
      <tr>
      <td>{{ lang.win }}</td>
      <td>{{ user_info.athletic_win }}</td>
      </tr>
      <tr>
      <td>{{ lang.lose }}</td>
      <td>{{ user_info.athletic_lose }}</td>
      </tr>
      <tr>
      <td>{{ lang.draw }}</td>
      <td>{{ user_info.athletic_draw }}</td>
      </tr>
      <tr>
      <td>{{ lang.all }}</td>
      <td>{{ user_info.athletic_all }}</td>
      </tr>
      <tr>
      <td>{{ lang.ratio }}</td>
      <td>{{ user_info.athletic_wl_ratio }}%</td>
      </tr>
      </tbody>
      </table>
      </div>
      </div>
      <div class="panel panel-default">
      <div class="panel-heading">
      <h3 class="panel-title">{{lang.entertain}} </h3>
      <h3 class="panel-title">{{ lang.entertain }} </h3>
      </div>
      <div class="table-responsive">
      <table class="table table-striped table-bordered table-hover">
      <tbody>
      <tr>
      <td>EXP </td>
      <td>{{user_info.exp}} </td>
      </tr>
      <tr>
      <td>{{lang.exp_rank}} </td>
      <td>{{user_info.exp_rank}} </td>
      </tr>
      <tr>
      <td>{{lang.win}} </td>
      <td>{{user_info.entertain_win}} </td>
      </tr>
      <tr>
      <td>{{lang.lose}} </td>
      <td>{{user_info.entertain_lose}} </td>
      </tr>
      <tr>
      <td>{{lang.draw}} </td>
      <td>{{user_info.entertain_draw}} </td>
      </tr>
      <tr>
      <td>{{lang.all}} </td>
      <td>{{user_info.entertain_all}} </td>
      </tr>
      <tr>
      <td>EXP</td>
      <td>{{ user_info.exp }}</td>
      </tr>
      <tr>
      <td>{{ lang.exp_rank }}</td>
      <td>{{ user_info.exp_rank }}</td>
      </tr>
      <tr>
      <td>{{ lang.win }}</td>
      <td>{{ user_info.entertain_win }}</td>
      </tr>
      <tr>
      <td>{{ lang.lose }}</td>
      <td>{{ user_info.entertain_lose }}</td>
      </tr>
      <tr>
      <td>{{ lang.draw }}</td>
      <td>{{ user_info.entertain_draw }}</td>
      </tr>
      <tr>
      <td>{{ lang.all }}</td>
      <td>{{ user_info.entertain_all }}</td>
      </tr>
      </tbody>
      </table>
      </div>
      </div>
      <div class="panel panel-default">
      <div class="panel-heading">
      <h3 class="panel-title">{{ lang.monthlyHistory }} </h3>
      </div>
      <!--<div class="panel-body">-->
      <!--<div style="width:100%;overflow-x:auto;overflow-y:hidden;">
      <table id="rank" class="table table-striped table-bordered table-hover example" ></table>
      </div>-->
      <div class="table-responsive" style="width:100%;overflow-x:auto;overflow-y:hidden;">
      <table id="monthly_rank" class="table table-striped table-bordered table-hover example"
      :class="{ scroll: isMobile }"></table>
      </div>
      </div>
      <div class="alert alert-info alert-dismissible" role="alert">
      <button type="button" class="close" data-dismiss="alert" aria-label="Close"><span aria-hidden="true">&times;</span></button> {{lang.tagInfo}}
      <button type="button" class="close" data-dismiss="alert" aria-label="Close"><span
      aria-hidden="true">&times;</span></button>
      {{ lang.tagInfo }}
      </div>
      <div class="panel panel-default">
      <div class="panel-heading">
      <h3 class="panel-title">{{lang.athleticDueHistory}} </h3>
      <h3 class="panel-title">{{ lang.athleticDueHistory }} </h3>
      </div>
      <!--<div class="panel-body">-->
      <!--<div style="width:100%;overflow-x:auto;overflow-y:hidden;">
      <table id="rank" class="table table-striped table-bordered table-hover example" ></table>
      </div>-->
      <div class="table-responsive" style="width:100%;overflow-x:auto;overflow-y:hidden;">
      <table id="athletic_rank" class="table table-striped table-bordered table-hover example" :class="{ scroll: isMobile }"></table>
      <table id="athletic_rank" class="table table-striped table-bordered table-hover example"
      :class="{ scroll: isMobile }"></table>
      </div>
      <!--</div>-->
      <!--<div class="table-responsive" style="width:100%;overflow-x:auto;overflow-y:hidden;">
      <table id="rank" class="table table-striped table-bordered table-hover example" :class="{ scroll: isMobile }" ></table>
      </div>-->
      </div>
      <div class="panel panel-default">
      <div class="panel-heading">
      <h3 class="panel-title">{{lang.entertainDueHistory}} </h3>
      <h3 class="panel-title">{{ lang.entertainDueHistory }} </h3>
      </div>
      <!--<div class="panel-body">-->
      <!--<div style="width:100%;overflow-x:auto;overflow-y:hidden;">
      <table id="rank" class="table table-striped table-bordered table-hover example" ></table>
      </div>-->
      <div class="table-responsive" style="width:100%;overflow-x:auto;overflow-y:hidden;">
      <table id="entertain_rank" class="table table-striped table-bordered table-hover example" :class="{ scroll: isMobile }"></table>
      <table id="entertain_rank" class="table table-striped table-bordered table-hover example"
      :class="{ scroll: isMobile }"></table>
      </div>
      <!--</div>-->
      <!--<div class="table-responsive" style="width:100%;overflow-x:auto;overflow-y:hidden;">
      ......@@ -128,9 +146,6 @@
      </div>-->
      </div>
      </div>
      </div>
      </div>
      ......@@ -138,99 +153,99 @@
      </template>
      <script>
      import querystring from 'querystring';
      import API from '../api'
      import { mapGetters } from 'vuex'
      var rankTable;
      var rankTable2;
      import moment from 'moment'
      import tb_language from './tb_lang.js'
      export default {
      data() {
      return {
      isMobile: false,
      activity: {
      today: 0,
      name: '新年充电活动',
      max: '15'
      },
      showActivity: false,
      user_info: {
      exp: 0,
      pt: 500,
      entertain_win: 0,
      entertain_lose: 0,
      entertain_draw: 0,
      entertain_all: 0,
      entertain_wl_ratio: 0,
      exp_rank: 0,
      athletic_win: 0,
      athletic_lose: 0,
      athletic_draw: 0,
      athletic_all: 0,
      athletic_wl_ratio: 0,
      arena_rank: 0
      }
      }
      },
      computed: {
      ...mapGetters({
      lang: 'getLang',
      user: 'getUser'
      }),
      },
      mounted: function () {
      var _this = this
      $("#search").click(function () {
      _this.renderPage();
      })
      // this.init()
      // window.onhashchange = this.init;
      this.renderPage();
      },
      created: function () {
      var regex_match = /(nokia|iphone|android|motorola|^mot-|softbank|foma|docomo|kddi|up.browser|up.link|htc|dopod|blazer|netfront|helio|hosin|huawei|novarra|CoolPad|webos|techfaith|palmsource|blackberry|alcatel|amoi|ktouch|nexian|samsung|^sam-|s[cg]h|^lge|ericsson|philips|sagem|wellcom|bunjalloo|maui|symbian|smartphone|midp|wap|phone|windows ce|iemobile|^spice|^bird|^zte-|longcos|pantech|gionee|^sie-|portalmmm|jigs browser|hiptop|^benq|haier|^lct|operas*mobi|opera*mini|320x320|240x320|176x220)/i;
      var u = navigator.userAgent;
      if (null == u) {
      return true;
      }
      var result = regex_match.exec(u);
      if (null == result) {
      this.isMobile = false;
      } else {
      this.isMobile = true;
      }
      let opt = {
      'username': this.user.username
      }
      API.getUserInfo(opt).then((res) => {
      this.user_info = res.data
      console.log('%c ---------------------src'+'\\'+'components'+'\\'+'Profile.vue---------------------%c:219','background:#ed162b','background:#7d382d',
      res)
      });
      },
      methods: {
      exchangeUserInfo(info){
      let userName=this.user.username
      let exchangeInfo=info
      if(info.usernamea!=userName)
      {
      exchangeInfo={
      "type":info.type,
      "start_time":info.start_time,
      import querystring from 'querystring';
      import API from '../api'
      import {mapGetters} from 'vuex'
      import moment from 'moment'
      import tb_language from './tb_lang.js'
      var rankTable;
      var rankTable2;
      var rankTable3;
      export default {
      data() {
      return {
      isMobile: false,
      activity: {
      today: 0,
      name: '新年充电活动',
      max: '15'
      },
      showActivity: false,
      user_info: {
      exp: 0,
      pt: 500,
      entertain_win: 0,
      entertain_lose: 0,
      entertain_draw: 0,
      entertain_all: 0,
      entertain_wl_ratio: 0,
      exp_rank: 0,
      athletic_win: 0,
      athletic_lose: 0,
      athletic_draw: 0,
      athletic_all: 0,
      athletic_wl_ratio: 0,
      arena_rank: 0
      },
      }
      },
      computed: {
      ...mapGetters({
      lang: 'getLang',
      user: 'getUser'
      }),
      },
      mounted: function () {
      var _this = this
      $("#search").click(function () {
      _this.renderPage();
      })
      // this.init()
      // window.onhashchange = this.init;
      this.renderPage();
      },
      created: function () {
      var regex_match = /(nokia|iphone|android|motorola|^mot-|softbank|foma|docomo|kddi|up.browser|up.link|htc|dopod|blazer|netfront|helio|hosin|huawei|novarra|CoolPad|webos|techfaith|palmsource|blackberry|alcatel|amoi|ktouch|nexian|samsung|^sam-|s[cg]h|^lge|ericsson|philips|sagem|wellcom|bunjalloo|maui|symbian|smartphone|midp|wap|phone|windows ce|iemobile|^spice|^bird|^zte-|longcos|pantech|gionee|^sie-|portalmmm|jigs browser|hiptop|^benq|haier|^lct|operas*mobi|opera*mini|320x320|240x320|176x220)/i;
      var u = navigator.userAgent;
      if (null == u) {
      return true;
      }
      var result = regex_match.exec(u);
      if (null == result) {
      this.isMobile = false;
      } else {
      this.isMobile = true;
      }
      let opt = {
      'username': this.user.username
      }
      API.getUserInfo(opt).then((res) => {
      this.user_info = res.data
      // console.log('%c ---------------------src' + '\\' + 'components' + '\\' + 'Profile.vue---------------------%c:219', 'background:#ed162b', 'background:#7d382d',
      // res)
      });
      },
      methods: {
      exchangeUserInfo(info) {
      let userName = this.user.username
      let exchangeInfo = info
      if (info.usernamea != userName) {
      exchangeInfo = {
      "type": info.type,
      "start_time": info.start_time,
      "isfirstwin": info.isfirstwin,
      "end_time": info.end_time,
      "usernamea": info.usernameb,
      ......@@ -246,157 +261,251 @@
      "pta_ex": info.ptb_ex,
      "ptb_ex": info.pta_ex,
      "winner": info.winner,
      }
      }
      // console.log('%c ---------------------src' + '\\' + 'components' + '\\' + 'Profile.vue---------------------%c:227', 'background:#1b5fbd', 'background:#ce8e6b',
      // exchangeInfo)
      return exchangeInfo
      },
      exchangeUserInfo3(info) {
      let userName = this.user.username
      let exchangeInfo = info
      if (info.usernamea !== userName) {
      exchangeInfo = {
      "username":info.username,
      "season": info.season,
      "rank": info.rank,
      "pt": info.pt,
      "note": info.note,
      "entertainmentWin": info.entertainmentWin,
      "entertainmentLose": info.entertainmentLose,
      "entertainmentDraw": info.entertainmentDraw,
      "correction": info.correction,
      "athleticWin": info.athleticWin,
      "athleticLose": info.athleticLose,
      "athleticDraw": info.athleticDraw,
      }
      console.log('%c ---------------------src'+'\\'+'components'+'\\'+'Profile.vue---------------------%c:227','background:#1b5fbd','background:#ce8e6b',
      exchangeInfo)
      return exchangeInfo
      },
      init: function () {
      },
      }
      // console.log('%c ---------------------src' + '\\' + 'components' + '\\' + 'Profile.vue---------------------%c:227', 'background:#1b5fbd', 'background:#ce8e6b',
      // exchangeInfo)
      return exchangeInfo
      },
      init: function () {
      },
      renderPage: function () {
      if (rankTable) {
      rankTable.destroy();
      }
      if (rankTable2) {
      rankTable2.destroy();
      }
      if (rankTable3) {
      rankTable3.destroy();
      }
      var username = this.user.username
      var type = 1;
      rankTable = this.renderRankTable("#athletic_rank", [], "DP");
      rankTable2 = this.renderRankTable("#entertain_rank", [], "");
      rankTable3 = this.renderRankTable3("#monthly_rank", [], "");
      if (!username) return;
      API.getUserDueHistory({username: username, type: "1", page_num: 100}).then((res) => {
      renderPage: function () {
      if (rankTable) {
      rankTable.destroy();
      }
      rankTable = this.renderRankTable("#athletic_rank", res.data.data, "DP")
      }, (res) => {
      });
      API.getUserDueHistory({username: username, type: "2", page_num: 100}).then((res) => {
      if (rankTable2) {
      rankTable2.destroy();
      }
      rankTable2 = this.renderRankTable("#entertain_rank", res.data.data, "")
      }, (res) => {
      // console.log('%c ---------------------src' + '\\' + 'components' + '\\' + 'Profile.vue---------------------%c:258', 'background:#ef98b5', 'background:#53116e',
      // res)
      });
      var username = this.user.username
      var type = 1;
      rankTable = this.renderRankTable("#athletic_rank", [], "DP");
      rankTable2 = this.renderRankTable("#entertain_rank", [], "");
      if (!username) return;
      API.getUserDueHistory({ username: username, type: "1", page_num: 100 }).then((res) => {
      if (rankTable) {
      rankTable.destroy();
      }
      rankTable = this.renderRankTable("#athletic_rank", res.data.data, "DP")
      }, (res) => {
      });
      API.getUserDueHistory({ username: username, type: "2", page_num: 100 }).then((res) => {
      if (rankTable2) {
      rankTable2.destroy();
      }
      rankTable2 = this.renderRankTable("#entertain_rank", res.data.data, "")
      }, (res) => {
      console.log('%c ---------------------src'+'\\'+'components'+'\\'+'Profile.vue---------------------%c:258','background:#ef98b5','background:#53116e',
      res)
      });
      var _this = this;
      API.getFirstWin({ username: username }).then((res) => {
      _this.activity = res.data
      if (_this.activity.name && _this.activity.name.trim().length > 0) {
      _this.showActivity = true;
      }
      }, (res) => {
      console.log('%c ---------------------src'+'\\'+'components'+'\\'+'Profile.vue---------------------%c:271','background:#c85336','background:#a4c933',
      res)
      });
      },
      // 获取用户每个月的战斗历史数据
      var monthly = [];
      function fetchData(username, monthOffset) {
      var date = moment().subtract(monthOffset, 'months').format('YYYY-MM');
      let opt = {
      'username': username,
      'season': date,
      };
      return API.getMonthlyHistory(opt)
      .then(response => {
      const res = response.data;
      // console.log(res);
      // 判断是否有返回数据
      if (res) {
      // 继续请求前一个月的数据
      monthly.push(res);
      return fetchData(username, monthOffset + 1);
      } else {
      // 当不再返回数据时，结束递归，并返回最终的 monthly 数组
      return monthly;
      }
      });
      }
      fetchData(username, 1).then(res => {
      if (rankTable3) {
      rankTable3.destroy();
      }
      rankTable3 = this.renderRankTable3("#monthly_rank", monthly, "")
      });
      renderRankTable: function (id, tableData, ttype) {
      tableData = tableData || [];
      var lang = localStorage.getItem('lang') || 'cn';
      var rank = 1;
      console.log('%c ---------------------src'+'\\'+'components'+'\\'+'Profile.vue---------------------%c:284','background:#c896f3','background:#f332b2',
      tableData)
      var _this = this;
      API.getFirstWin({username: username}).then((res) => {
      _this.activity = res.data
      if (_this.activity.name && _this.activity.name.trim().length > 0) {
      _this.showActivity = true;
      }
      }, (res) => {
      // console.log('%c ---------------------src' + '\\' + 'components' + '\\' + 'Profile.vue---------------------%c:271', 'background:#c85336', 'background:#a4c933',
      // res)
      });
      },
      let that=this
      var processData = tableData.map(function (d) {
      d=that.exchangeUserInfo(d)
      return [d.usernamea, d.usernameb, moment(d.start_time).format('YYYY-MM-DD HH:mm'),
      renderRankTable: function (id, tableData, ttype) {
      tableData = tableData || [];
      var lang = localStorage.getItem('lang') || 'cn';
      var rank = 1;
      // console.log('%c ---------------------src' + '\\' + 'components' + '\\' + 'Profile.vue---------------------%c:284', 'background:#c896f3', 'background:#f332b2',
      // tableData)
      let that = this
      var processData = tableData.map(function (d) {
      d = that.exchangeUserInfo(d)
      return [d.usernamea, d.usernameb, moment(d.start_time).format('YYYY-MM-DD HH:mm'),
      moment(d.end_time).format('YYYY-MM-DD HH:mm'), d.userscorea, d.userscoreb,
      d.pta, d.pta_ex, d.ptb, d.ptb_ex];
      });
      var table = $(id).DataTable({
      paging: true,
      searching: false,
      ordering: false,
      lengthChange: false,
      info: false,
      data: processData,
      columns: [
      { title: tb_language[lang].playerA },
      { title: tb_language[lang].playerB },
      { title: tb_language[lang].startTime },
      { title: tb_language[lang].endTime },
      ],
      "columnDefs": [
      {
      "render": function (data, type, row) {
      var userscorea = row[4];
      var userscoreb = row[5];
      var diff = (parseFloat(row[6]) - parseFloat(row[7])).toFixed(2)
      if (diff > 0) {
      diff = "+" + diff
      }
      var append = diff + ttype
      if (ttype === "") {
      append = ""
      }
      if (userscorea < 0) {
      return "<a href='#/userinfo?username=" + encodeURIComponent(data) + "'><span class='label label-danger'>" + data + "</span></a> " + append;
      }
      if (userscorea > userscoreb) {
      return "<a href='#/userinfo?username=" + encodeURIComponent(data) + "'><span class='label label-success'>" + data + "</span></a> " + append;
      }
      return "<a href='#/userinfo?username=" + encodeURIComponent(data) + "'><span class='label label-info'>" + data + "</span></a> " + append;
      },
      "targets": 0
      });
      var table = $(id).DataTable({
      paging: true,
      searching: false,
      ordering: false,
      lengthChange: false,
      info: false,
      data: processData,
      columns: [
      {title: tb_language[lang].playerA},
      {title: tb_language[lang].playerB},
      {title: tb_language[lang].startTime},
      {title: tb_language[lang].endTime},
      ],
      "columnDefs": [
      {
      "render": function (data, type, row) {
      var userscorea = row[4];
      var userscoreb = row[5];
      var diff = (parseFloat(row[6]) - parseFloat(row[7])).toFixed(2)
      if (diff > 0) {
      diff = "+" + diff
      }
      var append = diff + ttype
      if (ttype === "") {
      append = ""
      }
      if (userscorea < 0) {
      return "<a href='#/userinfo?username=" + encodeURIComponent(data) + "'><span class='label label-danger'>" + data + "</span></a> " + append;
      }
      if (userscorea > userscoreb) {
      return "<a href='#/userinfo?username=" + encodeURIComponent(data) + "'><span class='label label-success'>" + data + "</span></a> " + append;
      }
      return "<a href='#/userinfo?username=" + encodeURIComponent(data) + "'><span class='label label-info'>" + data + "</span></a> " + append;
      },
      {
      "render": function (data, type, row) {
      var userscorea = row[4];
      var userscoreb = row[5];
      var diff = (parseFloat(row[8]) - parseFloat(row[9])).toFixed(2)
      if (diff > 0) {
      diff = "+" + diff
      }
      var append = diff + ttype
      if (ttype === "") {
      append = ""
      }
      if (userscoreb < 0) {
      return "<a href='#/userinfo?username=" + encodeURIComponent(data) + "'><span class='label label-danger'>" + data + "</span></a> " + append;
      }
      if (userscorea < userscoreb) {
      return "<a href='#/userinfo?username=" + encodeURIComponent(data) + "'><span class='label label-success'>" + data + "</span></a> " + append;
      }
      return "<a href='#/userinfo?username=" + encodeURIComponent(data) + "'><span class='label label-info'>" + data + "</span></a> " + append;
      },
      "targets": 1
      "targets": 0
      },
      {
      "render": function (data, type, row) {
      var userscorea = row[4];
      var userscoreb = row[5];
      var diff = (parseFloat(row[8]) - parseFloat(row[9])).toFixed(2)
      if (diff > 0) {
      diff = "+" + diff
      }
      var append = diff + ttype
      if (ttype === "") {
      append = ""
      }
      if (userscoreb < 0) {
      return "<a href='#/userinfo?username=" + encodeURIComponent(data) + "'><span class='label label-danger'>" + data + "</span></a> " + append;
      }
      if (userscorea < userscoreb) {
      return "<a href='#/userinfo?username=" + encodeURIComponent(data) + "'><span class='label label-success'>" + data + "</span></a> " + append;
      }
      return "<a href='#/userinfo?username=" + encodeURIComponent(data) + "'><span class='label label-info'>" + data + "</span></a> " + append;
      },
      ],
      "language": lang === 'en' ? tb_language.en : tb_language.cn
      });
      "targets": 1
      },
      ],
      "language": lang === 'en' ? tb_language.en : tb_language.cn
      });
      return table;
      },
      return table;
      },
      renderRankTable3: function (id, tableData) {
      tableData = tableData || [];
      var lang = localStorage.getItem('lang') || 'cn'
      let that = this
      var processData = tableData.map(function (d) {
      console.log(tableData)
      d = that.exchangeUserInfo3(d);
      var pt=Math.round(d.pt);
      var totoal=d.athleticWin+d.athleticLose;
      return [
      moment(d.season).format('YYYY-MM'),
      d.rank,
      pt,
      d.athleticWin,
      d.athleticLose,
      totoal
      ];
      });
      var table = $(id).DataTable({
      paging: true,
      searching: false,
      ordering: false,
      lengthChange: false,
      info: false,
      data: processData,
      "pageLength": 12, // 设置每页显示12行数据
      columns: [
      {title: tb_language[lang].season},
      {title: tb_language[lang].rank},
      {title: tb_language[lang].pt},
      {title: tb_language[lang].athleticWin},
      {title: tb_language[lang].athleticLose},
      {title: tb_language[lang].total},
      ],
      "columnDefs": [
      ],
      "language": lang === 'en' ? tb_language.en : tb_language.cn
      });
      return table;
      },
      }
      },
      }
      </script>
      \ No newline at end of file
      </script>
      src/components/lang.js
      View file @ d2b9e1c9
      ......@@ -41,6 +41,7 @@ module.exports = {
      dueHistory: '最近决斗记录',
      athleticDueHistory: '竞技场决斗记录',
      entertainDueHistory: '娱乐场决斗记录',
      monthlyHistory: '每月决斗记录',
      tagInfo: '绿色表示获胜方，红色则表示掉线。',
      rates: '卡组胜率',
      ......@@ -155,6 +156,7 @@ module.exports = {
      side: 'Side',
      extra: 'Extra',
      dueHistory: 'Recent Due History',
      monthlyHistory: 'Monthly Rank Record',
      athleticDueHistory: 'Athletic Due History',
      entertainDueHistory: 'Entertain Due History',
      tagInfo: 'Green tag represents the winner.Red tag represents player lost connection.',
      ......
      src/components/tb_lang.js
      View file @ d2b9e1c9
      module.exports = {
      cn: {
      "sProcessing": "处理中...",
      "sLengthMenu": "显示 _MENU_ 项结果",
      "sZeroRecords": "没有匹配结果",
      "sInfo": "显示第 _START_ 至 _END_ 项结果，共 _TOTAL_ 项",
      "sInfoEmpty": "显示第 0 至 0 项结果，共 0 项",
      "sInfoFiltered": "(由 _MAX_ 项结果过滤)",
      "sInfoPostFix": "",
      "sSearch": "搜索:",
      "sUrl": "",
      "sEmptyTable": "表中数据为空",
      "sLoadingRecords": "载入中...",
      "sInfoThousands": ",",
      "oPaginate": {
      "sFirst": "首页",
      "sPrevious": "上页",
      "sNext": "下页",
      "sLast": "末页"
      },
      "oAria": {
      "sSortAscending": ": 以升序排列此列",
      "sSortDescending": ": 以降序排列此列"
      },
      rank: "排名",
      name: "用户名",
      exp: "EXP",
      pt: "D.P",
      win: "胜局",
      lose: "负局",
      wl: "胜率",
      cardName: "卡名",
      used: "使用量",
      put1: "投入1",
      put2: "投入2",
      put3: "投入3",
      cn: {
      "sProcessing": "处理中...",
      "sLengthMenu": "显示 _MENU_ 项结果",
      "sZeroRecords": "没有匹配结果",
      "sInfo": "显示第 _START_ 至 _END_ 项结果，共 _TOTAL_ 项",
      "sInfoEmpty": "显示第 0 至 0 项结果，共 0 项",
      "sInfoFiltered": "(由 _MAX_ 项结果过滤)",
      "sInfoPostFix": "",
      "sSearch": "搜索:",
      "sUrl": "",
      "sEmptyTable": "表中数据为空",
      "sLoadingRecords": "载入中...",
      "sInfoThousands": ",",
      "oPaginate": {
      "sFirst": "首页",
      "sPrevious": "上页",
      "sNext": "下页",
      "sLast": "末页"
      },
      "oAria": {
      "sSortAscending": ": 以升序排列此列",
      "sSortDescending": ": 以降序排列此列"
      },
      rank: "排名",
      name: "用户名",
      exp: "EXP",
      pt: "D.P",
      win: "胜局",
      lose: "负局",
      wl: "胜率",
      athleticWin:'竞技场胜利',
      athleticLose:'竞技场失败',
      season:'时间',
      total:'合计',
      cardName: "卡名",
      used: "使用量",
      put1: "投入1",
      put2: "投入2",
      put3: "投入3",
      deck: "卡组",
      count: "使用数",
      topTags: "热门标签",
      deck: "卡组",
      count: "使用数",
      PickRate : "使用率",
      topTags: "热门标签",
      playerA: '玩家A',
      playerB: '玩家B',
      startTime: '开始时间',
      endTime: '结束时间',
      playerA: '玩家A',
      playerB: '玩家B',
      startTime: '开始时间',
      endTime: '结束时间',
      },
      en: {
      "oPaginate": {
      "sPrevious": "Pre",
      },
      en: {
      "oPaginate": {
      "sPrevious": "Pre",
      },
      rank: "Rank",
      name: "Name",
      exp: "EXP",
      pt: "D.P",
      win: "Win",
      lose: "Lose",
      wl: "W/L",
      cardName: "Card Name",
      used: "Used",
      put1: "Put one ",
      put2: "Put two ",
      put3: "Put three ",
      rank: "Rank",
      name: "Name",
      exp: "EXP",
      pt: "D.P",
      win: "Win",
      lose: "Lose",
      wl: "W/L",
      deck: "Deck",
      count: "Count",
      topTags: "Top Tags",
      cardName: "Card Name",
      used: "Used",
      PickRate:"Pick Rate",
      put1: "Put one ",
      put2: "Put two ",
      put3: "Put three ",
      athleticWin:'Win',
      athleticLose:'Lose',
      season:'Time',
      total:'Total',
      deck: "Deck",
      count: "Count",
      topTags: "Top Tags",
      playerA: 'PlayerA',
      playerB: 'PlayerA',
      startTime: 'Start Time',
      endTime: 'End Time',
      }
      playerA: 'PlayerA',
      playerB: 'PlayerA',
      startTime: 'Start Time',
      endTime: 'End Time',
      }
      }
      Markdown is supported
      0% or
      You are about to add 0 people to the discussion. Proceed with caution.
      Finish editing this message first!
      Please register or to comment