算力积分

package.json

@@ -54,6 +54,7 @@
     "vue": "2.6.11",
     "vue-bar-graph": "1.2.0",
     "vue-calendar-heatmap": "0.8.4",
+    "vue-i18n": "6.1.3",
     "vue-loader": "15.9.2",
     "vue-router": "3.3.4",
     "vue-template-compiler": "2.6.11",
@@ -79,4 +80,4 @@
   "browserslist": [
     "defaults"
   ]
-}
+}

web_src/vuepages/const/index.js

@@ -0,0 +1,9 @@
+import { i18n } from '~/langs';
+
+export const SOURCE_TYPE = [{ k: 'ACCOMPLISH_TASK', v: i18n.t('accomplishTask') }, { k: 'ADMIN_OPERATE', v: i18n.t('adminOperate') }, { k: 'RUN_CLOUDBRAIN_TASK', v: i18n.t('runCloudBrainTask') }];
+export const CONSUME_STATUS = [{ k: 'OPERATING', v: i18n.t('operating') }, { k: 'SUCCEEDED', v: i18n.t('succeeded') }];
+export const POINT_ACTIONS = [
+  { k: 1, v: i18n.t('createPublicProject') }, { k: 6, v: i18n.t('dailyPutforwardTasks') }, { k: 7, v: i18n.t('dailyPR') }, { k: 10, v: i18n.t('comment') }, { k: 24, v: i18n.t('uploadDatasetFile') }, { k: 30, v: i18n.t('importNewModel') }, { k: 34, v: i18n.t('completeWechatCodeScanningVerification') },
+  { k: 35, v: i18n.t('dailyRunCloudbrainTasks') }, { k: 36, v: i18n.t('datasetRecommendedByThePlatform') }, { k: 37, v: i18n.t('submitNewPublicImage') }, { k: 38, v: i18n.t('imageRecommendedByThePlatform') }, { k: 39, v: i18n.t('firstChangeofAvatar') }, { k: 40, v: i18n.t('dailyCommit') }, { k: 41, v: i18n.t('dailyFirstForkProject') },
+];
+export const JOB_TYPE = [{ k: 'DEBUG', v: i18n.t('debugTask') }, { k: 'TRAIN', v: i18n.t('trainTask') }, { k: 'INFERENCE', v: i18n.t('inferenceTask') }, { k: 'BENCHMARK', v: i18n.t('benchmarkTask') }];

web_src/vuepages/langs/config/en-US.js

@@ -0,0 +1,68 @@
+const en = {
+  loading: 'Loading...',
+  noData: 'No Data',
+  date: 'Date',
+
+  accomplishTask: 'Accomplish Task',
+  adminOperate: 'Administrator Operation',
+  runCloudBrainTask: 'Run CloudBrain Task',
+  operating: 'Operating',
+  succeeded: 'Succeeded',
+  debugTask: 'Debug Task',
+  trainTask: 'Train Task',
+  inferenceTask: 'Inference Task',
+  benchmarkTask: 'Benchmark Task',
+  createPublicProject: 'Create Public Projects',
+  dailyPutforwardTasks: 'Daily Put Forward Tasks',
+  dailyPR: 'Daily PR',
+  comment: 'Comment',
+  uploadDatasetFile: 'Upload Dataset Files',
+  importNewModel: 'Import New Models',
+  completeWechatCodeScanningVerification: 'Complete Wechat Code Scanning Verification',
+  dailyRunCloudbrainTasks: 'Daily Run Cloudbrain Tasks',
+  datasetRecommendedByThePlatform: 'Dataset Recommended by the Platform',
+  submitNewPublicImage: 'Submit New Public Images',
+  imageRecommendedByThePlatform: 'Image Recommended by the Platform',
+  firstChangeofAvatar: 'First Change of Avatar',
+  dailyCommit: 'Daily Commit',
+  dailyFirstForkProject: 'Daily First Fork Project',
+  calcPointDetails: 'Calculation Points Details',
+  calcPointAcquisitionInstructions: 'Calculation Points Acquisition Instructions',
+  CurrAvailableCalcPoints: 'Currently Available Calculation Points',
+  totalGainCalcPoints: 'Total Gain of Calculation Points',
+  totalConsumeCalcPoints: 'Total Consume of Calculation Points',
+  totalGainDetail: 'Total gain Detail',
+  totalConsumeDetail: 'Total Consume Detail',
+  serialNumber: 'Serial Number',
+  time: 'Time',
+  scene: 'Scene',
+  behaviorOfPoint: 'Behavior Of Point',
+  explanation: 'Explanation',
+  points: 'Points',
+  status: 'Status',
+  runTime: 'Run Time',
+  taskName: 'Task Name',
+
+  createdRepository: 'created repository ',
+  openedIssue: 'opened issue ',
+  createdPullRequest: 'created pull request ',
+  commentedOnIssue: 'commented on issue ',
+  uploadDataset: 'upload dataset ',
+  createdNewModel: 'created new model ',
+  firstBindingWechatRewards: 'first binding wechat rewards',
+  created: 'created ',
+  type: ' type ',
+  dataset: 'dataset ',
+  setAsRecommendedDataset: ' was set as recommended dataset',
+  committedImage: 'committed image ',
+  image: 'image ',
+  setAsRecommendedImage: ' was set as recommended image',
+  updatedAvatar: 'updated avatar',
+  pushedBranch: 'pushed to {branch} at ',
+  dailyMaxTips: `can't get full points when reach the daily upper limit`,
+  memory: 'Memory',
+  sharedMemory: 'Shared Memory',
+  ';': ', ',
+}
+
+export default en;

web_src/vuepages/langs/config/zh-CN.js

@@ -0,0 +1,68 @@
+const zh = {
+  loading: '加载中...',
+  noData: '暂无数据',
+  date: '日期',
+
+  accomplishTask: '积分任务',
+  adminOperate: '管理员操作',
+  runCloudBrainTask: '运行云脑任务',
+  operating: '进行中',
+  succeeded: '已完成',
+  debugTask: '调试任务',
+  trainTask: '训练任务',
+  inferenceTask: '推理任务',
+  benchmarkTask: '评测任务',
+  createPublicProject: '创建公开项目',
+  dailyPutforwardTasks: '每日提出任务',
+  dailyPR: '每日提出PR',
+  comment: '发表评论',
+  uploadDatasetFile: '上传数据集文件',
+  importNewModel: '导入新模型',
+  completeWechatCodeScanningVerification: '完成微信扫码验证',
+  dailyRunCloudbrainTasks: '每日运行云脑任务',
+  datasetRecommendedByThePlatform: '数据集被平台推荐',
+  submitNewPublicImage: '提交新公开镜像',
+  imageRecommendedByThePlatform: '镜像被平台推荐',
+  firstChangeofAvatar: '首次更换头像',
+  dailyCommit: '每日commit',
+  dailyFirstForkProject: '每日首次Fork项目',
+  calcPointDetails: '算力积分明细',
+  calcPointAcquisitionInstructions: '积分获取说明',
+  CurrAvailableCalcPoints: '当前可用算力积分(分)',
+  totalGainCalcPoints: '总获取算力积分(分)',
+  totalConsumeCalcPoints: '总消耗算力积分(分)',
+  totalGainDetail: '总获取明细',
+  totalConsumeDetail: '总消耗明细',
+  serialNumber: '流水号',
+  time: '时间',
+  scene: '场景',
+  behaviorOfPoint: '积分行为',
+  explanation: '说明',
+  points: '积分',
+  status: '状态',
+  runTime: '运行时长',
+  taskName: '任务名称',
+
+  createdRepository: '创建了项目',
+  openedIssue: '创建了任务',
+  createdPullRequest: '创建了合并请求',
+  commentedOnIssue: '评论了任务',
+  uploadDataset: '上传了数据集文件',
+  createdNewModel: '导入了新模型',
+  firstBindingWechatRewards: '首次绑定微信奖励',
+  created: '创建了',
+  type: '类型',
+  dataset: '数据集',
+  setAsRecommendedDataset: '被设置为推荐数据集',
+  committedImage: '提交了镜像',
+  image: '镜像',
+  setAsRecommendedImage: '被设置为推荐镜像',
+  updatedAvatar: '更新了头像',
+  pushedBranch: '推送了{branch}分支代码到',
+  dailyMaxTips: '达到每日上限积分，不能拿满分',
+  memory: '内存',
+  sharedMemory: '共享内存',
+  ';': '；',
+}
+
+export default zh;

web_src/vuepages/langs/index.js

@@ -0,0 +1,16 @@
+import Vue from 'vue';
+import VueI18n from 'vue-i18n';
+import jsCookie from 'js-cookie';
+import zh from './config/zh-CN';
+import en from './config/en-US';
+
+Vue.use(VueI18n);
+
+export const lang = jsCookie.get('lang') || 'zh-CN';
+export const i18n = new VueI18n({
+  locale: lang,
+  messages: {
+    'zh-CN': zh,
+    'en-US': en
+  },
+});

web_src/vuepages/pages/reward/point/const.js

@@ -1,7 +0,0 @@
-export const SOURCE_TYPE = [{ k: 'ACCOMPLISH_TASK', v: '积分任务' }, { k: 'ADMIN_OPERATE', v: '管理员操作' }, { k: 'RUN_CLOUDBRAIN_TASK', v: '运行云脑任务' }];
-export const CONSUME_STATUS = [{ k: 'OPERATING', v: '进行中' }, { k: 'SUCCEEDED', v: '已完成' }];
-export const POINT_ACTIONS = [
-  { k: 1, v: '创建公开项目' }, { k: 6, v: '每日提出任务' }, { k: 7, v: '每日提出PR' }, { k: 10, v: '发表评论' }, { k: 24, v: '上传数据集文件' }, { k: 30, v: '导入新模型' }, { k: 34, v: '完成微信扫码验证' },
-  { k: 35, v: '每日运行云脑任务' }, { k: 36, v: '数据集被平台推荐' }, { k: 37, v: '提交新公开镜像' }, { k: 38, v: '镜像被平台推荐' }, { k: 39, v: '首次更换头像' }, { k: 40, v: '每日commit' }, { k: 41, v: '每日首次Fork项目' },
-];
-export const JOB_TYPE = [{ k: 'DEBUG', v: '调试任务' }, { k: 'TRAIN', v: '训练任务' }, { k: 'INFERENCE', v: '推理任务' }, { k: 'BENCHMARK', v: '评测任务' }];

web_src/vuepages/pages/reward/point/utils.js

@@ -1,6 +1,7 @@
 
 import { formatDate } from 'element-ui/lib/utils/date-util';
-import { SOURCE_TYPE, CONSUME_STATUS, POINT_ACTIONS, JOB_TYPE } from './const';
+import { SOURCE_TYPE, CONSUME_STATUS, POINT_ACTIONS, JOB_TYPE } from '~/const';
+import { i18n } from '~/langs';
 
 const getSourceType = (key) => {
   const find = SOURCE_TYPE.filter(item => item.k === key);
@@ -35,15 +36,15 @@ const getJobTypeLink = (record, type) => {
       break;
     case 'TRAIN':
       if (cloudbrain.Type === 1) {
-        link += `/modelarts/train-job/${cloudbrain.ID}`;
+        link += `/modelarts/train-job/${cloudbrain.JobID}`;
       } else if (cloudbrain.Type === 0) {
-        link += `/cloudbrain/train-job/${cloudbrain.ID}`;
+        link += `/cloudbrain/train-job/${cloudbrain.JobID}`;
       } else if (cloudbrain.Type === 2) {
-        link += `/grampus/train-job/${cloudbrain.ID}`;
+        link += `/grampus/train-job/${cloudbrain.JobID}`;
       }
       break;
     case 'INFERENCE':
-      link += `/modelarts/inference-job/${cloudbrain.ID}`;
+      link += `/modelarts/inference-job/${cloudbrain.JobID}`;
       break;
     case 'BENCHMARK':
       link += `/cloudbrain/benchmark/${cloudbrain.ID}`;
@@ -76,48 +77,51 @@ export const getRewardPointRecordInfo = (record) => {
     } else if (record.SourceType === 'ACCOMPLISH_TASK') {
       switch (record?.Action?.OpType) {
         case 1: // 创建公开项目 - 创建了项目OpenI/aiforge
-          out.remark = `创建了项目<a href="${record.Action.RepoLink}" rel="nofollow">${record.Action.ShortRepoFullDisplayName}</a>`;
+          out.remark = `${i18n.t('createdRepository')}<a href="${record.Action.RepoLink}" rel="nofollow">${record.Action.ShortRepoFullDisplayName}</a>`;
           break;
         case 6: // 每日提出任务 - 创建了任务PCL-Platform.Intelligence/AISynergy#19
-          out.remark = `创建了任务<a href="${record.Action.RepoLink}/issues/${record.Action.IssueInfos[0]}" rel="nofollow">${record.Action.ShortRepoFullDisplayName}#${record.Action.IssueInfos[0]}</a>`;
+          out.remark = `${i18n.t('openedIssue')}<a href="${record.Action.RepoLink}/issues/${record.Action.IssueInfos[0]}" rel="nofollow">${record.Action.ShortRepoFullDisplayName}#${record.Action.IssueInfos[0]}</a>`;
           break;
         case 7: // 每日提出PR - 创建了合并请求OpenI/aiforge#1
-          out.remark = `创建了合并请求<a href="${record.Action.RepoLink}/pulls/${record.Action.IssueInfos[0]}" rel="nofollow">${record.Action.ShortRepoFullDisplayName}#${record.Action.IssueInfos[0]}</a>`;
+          out.remark = `${i18n.t('createdPullRequest')}<a href="${record.Action.RepoLink}/pulls/${record.Action.IssueInfos[0]}" rel="nofollow">${record.Action.ShortRepoFullDisplayName}#${record.Action.IssueInfos[0]}</a>`;
           break;
         case 10: // 发表评论 - 评论了任务PCL-Platform.Intelligence/AISynergy#19
-          out.remark = `评论了任务<a href="${record.Action.CommentLink}" rel="nofollow">${record.Action.ShortRepoFullDisplayName}#${record.Action.IssueInfos[0]}</a>`;
+          out.remark = `${i18n.t('commentedOnIssue')}<a href="${record.Action.CommentLink}" rel="nofollow">${record.Action.ShortRepoFullDisplayName}#${record.Action.IssueInfos[0]}</a>`;
           break;
         case 24: // 上传数据集文件 - 上传了数据集文件MMISTData.zip
-          out.remark = `上传了数据集文件<a href="${record.Action.RepoLink}/datasets" rel="nofollow">${record.Action.RefName}</a>`;
+          out.remark = `${i18n.t('uploadDataset')}<a href="${record.Action.RepoLink}/datasets" rel="nofollow">${record.Action.RefName}</a>`;
           break;
         case 30: // 导入新模型 - 导入了新模型resnet50_qx7l
-          out.remark = '导入了新模型{{}}';
+          out.remark = `${i18n.t('createdNewModel')}<a href="${record.Action.RepoLink}/modelmanage/show_model_info?name=${record.Action.RefName}" rel="nofollow">${record.Action.RefName}</a>`;
           break;
         case 34: // 完成微信扫码验证 - 首次绑定微信奖励
-          out.remark = '首次绑定微信奖励';
+          out.remark = `${i18n.t('firstBindingWechatRewards')}`;
           break;
         case 35: // 每日运行云脑任务 - 创建了(CPU/GPU/NPU)类型(调试/训练/推理/评测)任务tangl202204131431995
-          out.remark = `创建了${record.Action?.Cloudbrain?.ComputeResource}类型${getJobType(record.Action?.Cloudbrain?.JobType)}<a href="${getJobTypeLink(record, 'INCREASE')}" rel="nofollow">${record.Action.RefName}</a>`;
+          out.remark = `${i18n.t('created')}${record.Action?.Cloudbrain?.ComputeResource}${i18n.t('type')}${getJobType(record.Action?.Cloudbrain?.JobType)} <a href="${getJobTypeLink(record, 'INCREASE')}" rel="nofollow">${record.Action.RefName}</a>`;
           break;
         case 36: // 数据集被平台推荐 - 数据集XXX被设置为推荐数据集
-          out.remark = `数据集<a href="${record.Action.RepoLink}/datasets" rel="nofollow">${record.Action.Content && record.Action.Content.split('|')[1]}</a>被设置为推荐数据集`;
+          out.remark = `${i18n.t('dataset')}<a href="${record.Action.RepoLink}/datasets" rel="nofollow">${record.Action.Content && record.Action.Content.split('|')[1]}</a>${i18n.t('setAsRecommendedDataset')}`;
           break;
         case 37: // 提交新公开镜像 - 提交了镜像jiangxiang_ceshi_tang03
-          out.remark = `提交了镜像<span style="font-weight:bold;">${record.Action.Content && record.Action.Content.split('|')[1]}</span>`;
+          out.remark = `${i18n.t('committedImage')}<span style="font-weight:bold;">${record.Action.Content && record.Action.Content.split('|')[1]}</span>`;
           break;
         case 38: // 镜像被平台推荐 - 镜像XXX被设置为推荐镜像
-          out.remark = `镜像<span style="font-weight:bold;">${record.Action.Content && record.Action.Content.split('|')[1]}</span>被设置为推荐镜像`;
+          out.remark = `${i18n.t('image')}<span style="font-weight:bold;">${record.Action.Content && record.Action.Content.split('|')[1]}</span>${i18n.t('setAsRecommendedImage')}`;
           break;
         case 39: // 首次更换头像 - 更新了头像
-          out.remark = '更新了头像';
+          out.remark = `${i18n.t('updatedAvatar')}`;
           break;
         case 40: // 每日commit - 推送了xxxx分支的代码到OpenI/aiforge
           const words = record.Action.RefName.split('/');
           const branch = words[words.length - 1];
-          out.remark = `推送了<a href="${record.Action.RepoLink}/src/branch/${branch}" rel="nofollow">${branch}</a>分支的代码到<a href="${record.Action.RepoLink}" rel="nofollow">${record.Action.ShortRepoFullDisplayName}</a>`;
+          // out.remark = `推送了<a href="${record.Action.RepoLink}/src/branch/${branch}" rel="nofollow">${branch}</a>分支的代码到<a href="${record.Action.RepoLink}" rel="nofollow">${record.Action.ShortRepoFullDisplayName}</a>`;
+          out.remark = `${i18n.t('pushedBranch', {
+            branch: `<a href="${record.Action.RepoLink}/src/branch/${branch}" rel="nofollow">${branch}</a>`
+          })}<a href="${record.Action.RepoLink}" rel="nofollow">${record.Action.ShortRepoFullDisplayName}</a>`;
           break;
         case 41: // 每日首次Fork项目 - 创建了项目OpenI/fork_aiforge
-          out.remark = `创建了项目<a href="${record.Action.RepoLink}" rel="nofollow">${record.Action.ShortRepoFullDisplayName}</a>`;
+          out.remark = `${i18n.t('createdRepository')}<a href="${record.Action.RepoLink}" rel="nofollow">${record.Action.ShortRepoFullDisplayName}</a>`;
           break;
         default:
           break;
@@ -125,6 +129,10 @@ export const getRewardPointRecordInfo = (record) => {
     } else if (record.SourceType === 'RUN_CLOUDBRAIN_TASK') {
       //
     }
+    if (record.LossAmount !== 0) {
+      out.amount = record.Amount - record.LossAmount;
+      out.remark += `${out.remark ? i18n.t(';') : ''}${i18n.t('dailyMaxTips')}`
+    }
   } else if (record.OperateType === 'DECREASE') {
     if (record.SourceType === 'ADMIN_OPERATE') {
       out.remark = record.Remark;
@@ -134,7 +142,7 @@ export const getRewardPointRecordInfo = (record) => {
       out.taskName = `<a href="${getJobTypeLink(record, 'DECREASE')}" rel="nofollow">${record?.Cloudbrain?.DisplayJobName}</a>`;
       if (record?.Cloudbrain?.ComputeResource === 'CPU/GPU') {
         const resourceSpec = record?.Cloudbrain?.ResourceSpec?.ResourceSpec;
-        out.remark = `【${getJobType(record?.Cloudbrain?.JobType)}】【${record?.Cloudbrain?.ComputeResource}】【GPU: ${resourceSpec?.gpu}, CPU: ${resourceSpec?.cpu}, 内存: ${(resourceSpec?.memMiB / 1024).toFixed(2)}GB, 共享内存: ${(resourceSpec?.shareMemMiB / 1024).toFixed(2)}GB】`;
+        out.remark = `【${getJobType(record?.Cloudbrain?.JobType)}】【${record?.Cloudbrain?.ComputeResource}】【GPU: ${resourceSpec?.gpu}, CPU: ${resourceSpec?.cpu}, ${i18n.t('memory')}: ${(resourceSpec?.memMiB / 1024).toFixed(2)}GB, ${i18n.t('sharedMemory')}: ${(resourceSpec?.shareMemMiB / 1024).toFixed(2)}GB】`;
       } else {
         out.remark = `【${getJobType(record?.Cloudbrain?.JobType)}】【${record?.Cloudbrain?.ComputeResource}】【${record?.Cloudbrain?.ResourceSpec.FlavorInfo.desc}】`;
       }

web_src/vuepages/pages/reward/point/vp-point.js

@@ -1,11 +1,16 @@
 import Vue from 'vue';
 import ElementUI from 'element-ui';
 import 'element-ui/lib/theme-chalk/index.css';
-
-Vue.use(ElementUI);
+import localeEn from 'element-ui/lib/locale/lang/en';
+import localeZh from 'element-ui/lib/locale/lang/zh-CN';
+import { i18n, lang } from '~/langs';
 import App from './vp-point.vue';
 
+Vue.use(ElementUI, {
+  locale: lang === 'zh-CN' ? localeZh : localeEn
+});
+
 new Vue({
-  el: '#__vue-root',
+  i18n,
   render: (h) => h(App),
-});
+}).$mount('#__vue-root');

web_src/vuepages/pages/reward/point/vp-point.vue

@@ -1,97 +1,105 @@
 <template>
   <div class="__reward-pointer-c">
-    <div class="ui container" style="width:80%">
+    <div class="ui container" style="width:80%;min-width:1200px;">
       <div class="__r_p_header">
         <div>
-          <p class="__title">算力积分明细</p>
+          <p class="__title">{{ $t('calcPointDetails') }}</p>
         </div>
         <div style="padding: 0 5px; font-size: 14px">
           <span>
             <i class="question circle icon link" style="color: rgba(3, 102, 214, 1)" data-position="right center"
               data-variation="mini"></i>
-            <a href="/reward/point/rule" target="_blank" style="color: rgba(3, 102, 214, 1)">积分获取说明</a>
+            <a href="/reward/point/rule" target="_blank" style="color: rgba(3, 102, 214, 1)">{{
+                $t('calcPointAcquisitionInstructions')
+            }}</a>
           </span>
         </div>
       </div>
       <div class="__r_p_summary">
         <div class="__r_p_summary_item-c __flex-1">
           <div class="__val">{{ summaryInfo.available }}</div>
-          <div class="__exp">当前可用算力积分(分)</div>
+          <div class="__exp">{{ $t('CurrAvailableCalcPoints') }}</div>
         </div>
         <div class="__r_p_summary_line"></div>
         <div class="__r_p_summary_item-c __flex-1">
           <div class="__val">{{ summaryInfo.gain }}</div>
-          <div class="__exp">总获取算力积分(分)</div>
+          <div class="__exp">{{ $t('totalGainCalcPoints') }}</div>
         </div>
         <div class="__r_p_summary_item-c __flex-1">
           <div class="__val">{{ summaryInfo.used }}</div>
-          <div class="__exp">总消耗算力积分(分)</div>
+          <div class="__exp">{{ $t('totalConsumeCalcPoints') }}</div>
         </div>
       </div>
       <div class="__r_p_tab">
         <div class="__r_p_tab-item" :class="tabIndex === 0 ? '__focus' : ''" style="border-radius: 5px 0px 0px 5px"
           @click="tabChange(0)">
-          总获取明细
+          {{ $t('totalGainDetail') }}
         </div>
         <div class="__r_p_tab-item" :class="tabIndex === 1 ? '__focus' : ''" style="border-radius: 0px 5px 5px 0px"
           @click="tabChange(1)">
-          总消耗明细
+          {{ $t('totalConsumeDetail') }}
         </div>
       </div>
       <div class="__r_p_table">
         <div v-show="tabIndex === 0">
           <el-table :data="tableData" row-key="sn" style="width: 100%" v-loading="loading" stripe>
-            <el-table-column column-key="sn" prop="sn" label="流水号" align="center" header-align="center" width="180">
+            <el-table-column column-key="sn" prop="sn" :label="$t('serialNumber')" align="center" header-align="center"
+              width="180">
             </el-table-column>
-            <el-table-column column-key="date" prop="date" label="时间" align="center" header-align="center" width="180">
+            <el-table-column column-key="date" prop="date" :label="$t('time')" align="center" header-align="center"
+              width="180">
             </el-table-column>
-            <el-table-column column-key="sourceType" prop="sourceType" label="场景" align="center" header-align="center"
-              width="180"></el-table-column>
-            <el-table-column column-key="action" prop="action" label="积分行为" align="center" header-align="center"
-              width="200"></el-table-column>
-            <el-table-column column-key="remark" prop="remark" label="说明" align="left" header-align="center">
+            <el-table-column column-key="sourceType" prop="sourceType" :label="$t('scene')" align="center"
+              header-align="center" width="180"></el-table-column>
+            <el-table-column column-key="action" prop="action" :label="$t('behaviorOfPoint')" align="center"
+              header-align="center" width="200"></el-table-column>
+            <el-table-column column-key="remark" prop="remark" :label="$t('explanation')" align="left" min-width="200"
+              header-align="center">
               <template slot-scope="scope">
                 <span v-html="scope.row.remark"></span>
               </template>
             </el-table-column>
-            <el-table-column column-key="amount" prop="amount" label="积分" align="center" header-align="center"
-              width="120"></el-table-column>
+            <el-table-column column-key="amount" prop="amount" :label="$t('points')" align="center"
+              header-align="center" width="120"></el-table-column>
             <template slot="empty">
-              <span>{{ loading ? "加载加..." : "暂无数据" }}</span>
+              <span>{{ loading ? $t('loading') : $t('noData') }}</span>
             </template>
           </el-table>
         </div>
         <div v-show="tabIndex === 1">
           <el-table :data="tableData" row-key="sn" style="width: 100%" v-loading="loading" stripe>
-            <el-table-column column-key="sn" prop="sn" label="流水号" align="center" header-align="center" width="180">
+            <el-table-column column-key="sn" prop="sn" :label="$t('serialNumber')" align="center" header-align="center"
+              width="180">
             </el-table-column>
-            <el-table-column column-key="date" prop="date" label="时间" align="center" header-align="center" width="180">
+            <el-table-column column-key="date" prop="date" :label="$t('time')" align="center" header-align="center"
+              width="180">
             </el-table-column>
-            <el-table-column column-key="status" prop="status" label="状态" align="center" header-align="center"
-              width="120">
+            <el-table-column column-key="status" prop="status" :label="$t('status')" align="center"
+              header-align="center" width="120">
               <template slot-scope="scope">
                 <span :style="{ color: scope.row.statusColor }">{{ scope.row.status }}</span>
               </template>
             </el-table-column>
-            <el-table-column column-key="sourceType" prop="sourceType" label="场景" align="center" header-align="center"
-              width="180"></el-table-column>
-            <el-table-column column-key="duration" prop="duration" label="运行时长" align="center" header-align="center"
-              width="120"></el-table-column>
-            <el-table-column column-key="remark" prop="remark" label="说明" align="left" header-align="center">
+            <el-table-column column-key="sourceType" prop="sourceType" :label="$t('scene')" align="center"
+              header-align="center" width="180"></el-table-column>
+            <el-table-column column-key="duration" prop="duration" :label="$t('runTime')" align="center"
+              header-align="center" width="120"></el-table-column>
+            <el-table-column column-key="remark" prop="remark" :label="$t('explanation')" align="left" min-width="200"
+              header-align="center">
               <template slot-scope="scope">
                 <span v-html="scope.row.remark"></span>
               </template>
             </el-table-column>
-            <el-table-column column-key="taskName" prop="taskName" label="任务名称" align="center" header-align="center"
-              width="180">
+            <el-table-column column-key="taskName" prop="taskName" :label="$t('taskName')" align="center"
+              header-align="center" width="180">
               <template slot-scope="scope">
                 <span v-html="scope.row.taskName"></span>
               </template>
             </el-table-column>
-            <el-table-column column-key="amount" prop="amount" label="积分" align="center" header-align="center"
-              width="120"></el-table-column>
+            <el-table-column column-key="amount" prop="amount" :label="$t('points')" align="center"
+              header-align="center" width="120"></el-table-column>
             <template slot="empty">
-              <span>{{ loading ? "加载加..." : "暂无数据" }}</span>
+              <span>{{ loading ? $t('loading') : $t('noData') }}</span>
             </template>
           </el-table>
         </div>
@@ -111,7 +119,7 @@
 </template>
 
 <script>
-import { getPoint, getPointAccount, getPointList } from "../../../apis/modules/point";
+import { getPoint, getPointAccount, getPointList } from "~/apis/modules/point";
 import { getRewardPointRecordInfo } from './utils';
 export default {
   data() {
@@ -162,8 +170,8 @@ export default {
       this.loading = true;
       getPointList({
         operate: this.tabIndex === 0 ? 'INCREASE' : 'DECREASE',
-        pageSize: this.pageInfo.pageSize,
         page: this.pageInfo.curpage,
+        // pageSize: this.pageInfo.pageSize,
       })
         .then((res) => {
           this.loading = false;

webpack.config.js

@@ -266,6 +266,7 @@ module.exports = {
     symlinks: false,
     alias: {
       vue$: 'vue/dist/vue.esm.js', // needed because vue's default export is the runtime only
+      '~': resolve(__dirname, 'web_src/vuepages')
     },
     extensions: ['.tsx', '.ts', '.js']
   },

webpack_pro.config.js

@@ -20,6 +20,11 @@ for (const path of glob('web_src/less/themes/*.less')) {
   themes[parse(path).name] = [path];
 }
 
+const vuePages = {};
+for (const path of glob('web_src/vuepages/**/vp-*.js')) {
+  vuePages[parse(path).name] = [path];
+}
+
 const isProduction = process.env.NODE_ENV !== 'development';
 
 module.exports = {
@@ -37,6 +42,7 @@ module.exports = {
     ],
     icons: glob('node_modules/@primer/octicons/build/svg/**/*.svg'),
     ...themes,
+    ...vuePages,
   },
   devtool: false,
   output: {
@@ -260,6 +266,7 @@ module.exports = {
     symlinks: false,
     alias: {
       vue$: 'vue/dist/vue.esm.js', // needed because vue's default export is the runtime only
+      '~': resolve(__dirname, 'web_src/vuepages')
     },
     extensions: ['.tsx', '.ts', '.js']
   },