Skip to content

yangchao / brains-h5

Go to a project
Commit 58896321 by yuhac
Options

Merge branch 'dev' of ssh://code.ledouya.com:2222/yangchao/brains-h5 into dev

2 parents 98a2bfb0 5681cda8
Expand all
Inline Side-by-side
Showing with 2075 additions and 1544 deletions
index.html
...@@ -12,7 +12,7 @@ ...@@ -12,7 +12,7 @@
<meta http-equiv="Pragma" content="no-cache"> <meta http-equiv="Pragma" content="no-cache">
<meta http-equiv="Cache-Control" content="no-cache"> <meta http-equiv="Cache-Control" content="no-cache">
<meta http-equiv="Expires" content="0"> <meta http-equiv="Expires" content="0">
<title>脑力中国</title> <title>摩天轮学习力</title>
</head> </head>
<body> <body>
<div id="app"></div> <div id="app"></div>
......
package-lock.json
{ {
"name": "help-h5", "name": "wisdom",
"version": "1.0.0", "version": "1.0.0",
"lockfileVersion": 1, "lockfileVersion": 1,
"requires": true, "requires": true,
...@@ -274,6 +274,14 @@ ...@@ -274,6 +274,14 @@
"integrity": "sha1-ePrtjD0HSrgfIrTphdeehzj3IPg=", "integrity": "sha1-ePrtjD0HSrgfIrTphdeehzj3IPg=",
"dev": true "dev": true
}, },
"async-validator": {
"version": "1.8.5",
"resolved": "https://registry.npmjs.org/async-validator/-/async-validator-1.8.5.tgz",
"integrity": "sha512-tXBM+1m056MAX0E8TL2iCjg8WvSyXu0Zc8LNtYqrVeyoL3+esHRZ4SieE9fKQyyU09uONjnMEjrNBMqT0mbvmA==",
"requires": {
"babel-runtime": "6.x"
}
},
"asynckit": { "asynckit": {
"version": "0.4.0", "version": "0.4.0",
"resolved": "http://registry.npm.taobao.org/asynckit/download/asynckit-0.4.0.tgz", "resolved": "http://registry.npm.taobao.org/asynckit/download/asynckit-0.4.0.tgz",
...@@ -571,8 +579,7 @@ ...@@ -571,8 +579,7 @@
"babel-helper-vue-jsx-merge-props": { "babel-helper-vue-jsx-merge-props": {
"version": "2.0.3", "version": "2.0.3",
"resolved": "http://registry.npm.taobao.org/babel-helper-vue-jsx-merge-props/download/babel-helper-vue-jsx-merge-props-2.0.3.tgz", "resolved": "http://registry.npm.taobao.org/babel-helper-vue-jsx-merge-props/download/babel-helper-vue-jsx-merge-props-2.0.3.tgz",
"integrity": "sha1-Iq69OzOQIyjlEyk6jkmSs4T58bY=", "integrity": "sha1-Iq69OzOQIyjlEyk6jkmSs4T58bY="
"dev": true
}, },
"babel-helpers": { "babel-helpers": {
"version": "6.24.1", "version": "6.24.1",
...@@ -1100,7 +1107,6 @@ ...@@ -1100,7 +1107,6 @@
"version": "6.26.0", "version": "6.26.0",
"resolved": "http://registry.npm.taobao.org/babel-runtime/download/babel-runtime-6.26.0.tgz", "resolved": "http://registry.npm.taobao.org/babel-runtime/download/babel-runtime-6.26.0.tgz",
"integrity": "sha1-llxwWGaOgrVde/4E/yM3vItWR/4=", "integrity": "sha1-llxwWGaOgrVde/4E/yM3vItWR/4=",
"dev": true,
"requires": { "requires": {
"core-js": "^2.4.0", "core-js": "^2.4.0",
"regenerator-runtime": "^0.11.0" "regenerator-runtime": "^0.11.0"
...@@ -2019,8 +2025,7 @@ ...@@ -2019,8 +2025,7 @@
"core-js": { "core-js": {
"version": "2.6.5", "version": "2.6.5",
"resolved": "http://registry.npm.taobao.org/core-js/download/core-js-2.6.5.tgz", "resolved": "http://registry.npm.taobao.org/core-js/download/core-js-2.6.5.tgz",
"integrity": "sha1-RLyNJJ5/sv9dAOA0Gn/7lPv2eJU=", "integrity": "sha1-RLyNJJ5/sv9dAOA0Gn/7lPv2eJU="
"dev": true
}, },
"core-util-is": { "core-util-is": {
"version": "1.0.2", "version": "1.0.2",
...@@ -2496,6 +2501,11 @@ ...@@ -2496,6 +2501,11 @@
"integrity": "sha1-9dJgKStmDghO/0zbyfCK0yR0SLU=", "integrity": "sha1-9dJgKStmDghO/0zbyfCK0yR0SLU=",
"dev": true "dev": true
}, },
"deepmerge": {
"version": "1.5.2",
"resolved": "https://registry.npmjs.org/deepmerge/-/deepmerge-1.5.2.tgz",
"integrity": "sha512-95k0GDqvBjZavkuvzx/YqVLv/6YYa17fz6ILMSf7neqQITCPbnfEnQvEgMPNjH4kgobe7+WIL0yJEHku+H3qtQ=="
},
"define-properties": { "define-properties": {
"version": "1.1.3", "version": "1.1.3",
"resolved": "http://registry.npm.taobao.org/define-properties/download/define-properties-1.1.3.tgz", "resolved": "http://registry.npm.taobao.org/define-properties/download/define-properties-1.1.3.tgz",
...@@ -2778,6 +2788,19 @@ ...@@ -2778,6 +2788,19 @@
"integrity": "sha1-scz2Gd9yla6he8aVHcaJYyYp5Kk=", "integrity": "sha1-scz2Gd9yla6he8aVHcaJYyYp5Kk=",
"dev": true "dev": true
}, },
"element-ui": {
"version": "2.13.0",
"resolved": "https://registry.npmjs.org/element-ui/-/element-ui-2.13.0.tgz",
"integrity": "sha512-KYsHWsBXYbLELS8cdfvgJTOMSUby3UEjvsPV1V1VmgJ/DdkOAS4z3MiOrPxrT9w2Cc5lZ4eVSQiGhYFR5NVChw==",
"requires": {
"async-validator": "~1.8.1",
"babel-helper-vue-jsx-merge-props": "^2.0.0",
"deepmerge": "^1.2.0",
"normalize-wheel": "^1.0.1",
"resize-observer-polyfill": "^1.5.0",
"throttle-debounce": "^1.0.1"
}
},
"elliptic": { "elliptic": {
"version": "6.4.1", "version": "6.4.1",
"resolved": "http://registry.npm.taobao.org/elliptic/download/elliptic-6.4.1.tgz", "resolved": "http://registry.npm.taobao.org/elliptic/download/elliptic-6.4.1.tgz",
...@@ -6042,6 +6065,11 @@ ...@@ -6042,6 +6065,11 @@
"sort-keys": "^1.0.0" "sort-keys": "^1.0.0"
} }
}, },
"normalize-wheel": {
"version": "1.0.1",
"resolved": "https://registry.npmjs.org/normalize-wheel/-/normalize-wheel-1.0.1.tgz",
"integrity": "sha1-rsiGr/2wRQcNhWRH32Ls+GFG7EU="
},
"npm-run-path": { "npm-run-path": {
"version": "2.0.2", "version": "2.0.2",
"resolved": "http://registry.npm.taobao.org/npm-run-path/download/npm-run-path-2.0.2.tgz", "resolved": "http://registry.npm.taobao.org/npm-run-path/download/npm-run-path-2.0.2.tgz",
...@@ -9037,8 +9065,7 @@ ...@@ -9037,8 +9065,7 @@
"regenerator-runtime": { "regenerator-runtime": {
"version": "0.11.1", "version": "0.11.1",
"resolved": "http://registry.npm.taobao.org/regenerator-runtime/download/regenerator-runtime-0.11.1.tgz", "resolved": "http://registry.npm.taobao.org/regenerator-runtime/download/regenerator-runtime-0.11.1.tgz",
"integrity": "sha1-vgWtf5v30i4Fb5cmzuUBf78Z4uk=", "integrity": "sha1-vgWtf5v30i4Fb5cmzuUBf78Z4uk="
"dev": true
}, },
"regenerator-transform": { "regenerator-transform": {
"version": "0.10.1", "version": "0.10.1",
...@@ -9202,6 +9229,11 @@ ...@@ -9202,6 +9229,11 @@
"integrity": "sha1-kl0mAdOaxIXgkc8NpcbmlNw9yv8=", "integrity": "sha1-kl0mAdOaxIXgkc8NpcbmlNw9yv8=",
"dev": true "dev": true
}, },
"resize-observer-polyfill": {
"version": "1.5.1",
"resolved": "https://registry.npmjs.org/resize-observer-polyfill/-/resize-observer-polyfill-1.5.1.tgz",
"integrity": "sha512-LwZrotdHOo12nQuZlHEmtuXdqGoOD0OhaxopaNFxWzInpEgaLWoVuAMbTzixuosCx2nEG58ngzW3vxdWoxIgdg=="
},
"resolve": { "resolve": {
"version": "1.10.0", "version": "1.10.0",
"resolved": "http://registry.npm.taobao.org/resolve/download/resolve-1.10.0.tgz", "resolved": "http://registry.npm.taobao.org/resolve/download/resolve-1.10.0.tgz",
...@@ -9972,6 +10004,11 @@ ...@@ -9972,6 +10004,11 @@
"integrity": "sha1-ry2LvJsE907hevK02QSPgHrNGKg=", "integrity": "sha1-ry2LvJsE907hevK02QSPgHrNGKg=",
"dev": true "dev": true
}, },
"throttle-debounce": {
"version": "1.1.0",
"resolved": "https://registry.npmjs.org/throttle-debounce/-/throttle-debounce-1.1.0.tgz",
"integrity": "sha512-XH8UiPCQcWNuk2LYePibW/4qL97+ZQ1AN3FNXwZRBNPPowo/NRU5fAlDCSNBJIYCKbioZfuYtMhG4quqoJhVzg=="
},
"through2": { "through2": {
"version": "2.0.5", "version": "2.0.5",
"resolved": "http://registry.npm.taobao.org/through2/download/through2-2.0.5.tgz", "resolved": "http://registry.npm.taobao.org/through2/download/through2-2.0.5.tgz",
...@@ -10554,6 +10591,11 @@ ...@@ -10554,6 +10591,11 @@
} }
} }
}, },
"vue-navigation": {
"version": "1.1.4",
"resolved": "https://registry.npm.taobao.org/vue-navigation/download/vue-navigation-1.1.4.tgz",
"integrity": "sha1-vpkBkGJGR9qjS4zVJfrU+21HJUI="
},
"vue-router": { "vue-router": {
"version": "3.0.2", "version": "3.0.2",
"resolved": "http://registry.npm.taobao.org/vue-router/download/vue-router-3.0.2.tgz", "resolved": "http://registry.npm.taobao.org/vue-router/download/vue-router-3.0.2.tgz",
......
package.json
...@@ -5,7 +5,7 @@ ...@@ -5,7 +5,7 @@
"author": "yangchao <408986770@qq.com>", "author": "yangchao <408986770@qq.com>",
"private": true, "private": true,
"scripts": { "scripts": {
"dev": "webpack-dev-server --inline --progress --config build/webpack.dev.conf.js --host 10.4.2.105", "dev": "webpack-dev-server --inline --progress --config build/webpack.dev.conf.js",
"start": "npm run dev", "start": "npm run dev",
"build": "node build/build.js" "build": "node build/build.js"
}, },
...@@ -16,6 +16,7 @@ ...@@ -16,6 +16,7 @@
"less-loader": "^4.1.0", "less-loader": "^4.1.0",
"lib-flexible": "^0.3.2", "lib-flexible": "^0.3.2",
"vue": "^2.5.2", "vue": "^2.5.2",
"vue-navigation": "^1.1.4",
"vue-router": "^3.0.1", "vue-router": "^3.0.1",
"vuex": "^3.1.0" "vuex": "^3.1.0"
}, },
...@@ -29,7 +30,7 @@ ...@@ -29,7 +30,7 @@
"babel-plugin-transform-vue-jsx": "^3.5.0", "babel-plugin-transform-vue-jsx": "^3.5.0",
"babel-preset-env": "^1.3.2", "babel-preset-env": "^1.3.2",
"babel-preset-stage-2": "^6.22.0", "babel-preset-stage-2": "^6.22.0",
"element-ui": "^2.4.7", "element-ui": "^2.4.7",
"chalk": "^2.0.1", "chalk": "^2.0.1",
"copy-webpack-plugin": "^4.0.1", "copy-webpack-plugin": "^4.0.1",
"css-loader": "^0.28.0", "css-loader": "^0.28.0",
......
src/App.vue
<template> <template>
<div id="app"> <div id="app">
<router-view/> <navigation>
<router-view/>
</navigation>
</div> </div>
</template> </template>
<script> <script>
import {mapActions} from 'vuex' import StoreUtil from "./store/stateStore";
export default {
name: 'App', export default {
methods: { name: 'App',
...mapActions({ methods: {},
getCategoryList: 'dispatchGetCategoryList', created() {
getQuestionList: 'dispatchGetQuestionList', //在页面加载时读取sessionStorage里的状态信息
getSpecialList: 'dispatchSpecialList', if (sessionStorage.getItem("store")) {
getHotKeys: 'dispatchGetHotKeys' this.$store.replaceState(Object.assign({}, StoreUtil.getState(), JSON.parse(sessionStorage.getItem("store"))))
}) }
},
created(){ //在页面刷新时将vuex里的信息保存到sessionStorage里
this.getCategoryList(); window.addEventListener("beforeunload", () => {
this.getQuestionList(); sessionStorage.setItem("store", JSON.stringify(StoreUtil.getState()))
this.getSpecialList(); });
this.getHotKeys();
} // bind event
} this.$navigation.on('forward', (to, from) => {
console.log('forward to', to, 'from ', from)
});
this.$navigation.on('back', (to, from) => {
console.log('back to', to, 'from ', from)
});
this.$navigation.on('replace', (to, from) => {
console.log('replace to', to, 'from ', from)
});
this.$navigation.on('refresh', (to, from) => {
console.log('refresh to', to, 'from ', from)
});
this.$navigation.on('reset', () => {
console.log('reset')
});
// and use [once, off] methods
this.$navigation.once('forward', () => {
console.log('appear once')
});
const off = () => {
console.log('1111-----will not appear')
};
// this.$navigation.on('forward', off);
// this.$navigation.off('forward', off);
}
}
</script> </script>
<style> <style>
......
src/api/article.js
import request from '../utils/request' import request from '../utils/request'
//文章列表 /**
export function getArticleList (data) { * 文章详情
return request({ * @param data
url : 'colleges/supportArticle/list' , * @return {AxiosPromise}
data */
})
}
//文章详情
export function getArticleDetails (data) { export function getArticleDetails (data) {
return request({ return request({url : 'brain/article/detail' , data})
url : 'colleges/supportArticle/detail' , }
data
})
}
\ No newline at end of file
src/api/category.js deleted 100644 → 0
import request from '../utils/request'
//分类列表
export function getCategoryList (data) {
return request({
url : 'colleges/supportCategory/list' ,
data
})
}
src/api/common.js
import request from '../utils/request' import request from '../utils/request'
/**
* 获取训练配置
* @param data
* @return {AxiosPromise}
*/
export function getCaseConfig (data) {
return request({url : 'brain/trainModelCase/config', data})
}
/**
* 获取实例详情
* @param data
* @return {AxiosPromise}
*/
export function getCaseDetail(data) {
return request({url : 'brain/trainModelCase/detail', data})
}
/**
* 获取模型详情
* @param data
* @return {AxiosPromise}
*/
export function getModelDetail(data) {
return request({url : 'brain/trainModel/detail', data})
}
export function collectUserInfo (data) { export function collectUserInfo (data) {
return request({ return request({
url : 'Colleges/Contacts/submit' , url : 'Colleges/Contacts/submit' ,
......
src/api/keywords.js deleted 100644 → 0
import request from '../utils/request'
//关键字
export function getKeywords (data) {
return request({
url : 'colleges/supportCategory/keywords' ,
data
})
}
\ No newline at end of file
src/api/question.js deleted 100644 → 0
import request from '../utils/request'
//获取问答列表
export function queryQuestionList (data) {
return request({
url : 'colleges/supportPlateAnswer/list' ,
data
})
}
\ No newline at end of file
src/api/special.js deleted 100644 → 0
import request from '../utils/request'
//专题列表
export function querySpecialList (data) {
return request({
url : 'colleges/supportPlateSpecial/list' ,
data
})
}
src/components/Drawer/index.less deleted 100644 → 0
.mask{
position: fixed;
top: 0;
left: 0;
right: 0;
bottom: 0;
background-color: rgba(0,0,0,.5);
z-index: 99;
}
.title{
font-size: 32px;
color: #000;
font-weight: 600;
}
.content{
position: fixed;
top: 0;
bottom: 0;
right: 0;
left: 170px;
background-color: #fff;
z-index: 100;
transition: all .3s linear;
transform: translateX(100%);
&.active{
transform: translateX(0);
}
}
.hd{
position: relative;
display: flex;
align-items: center;
justify-content: space-between;
padding: 24px 30px;
border-bottom: 1px solid #E8E8E8; /*no*/
.app-logo{
width: 280px;
height: 70px;
margin-left: 30px;
}
.icon-group{
width: 46px;
height: 46px;
}
}
.main-bd{
position: absolute;
left: 0;
right: 0;
top: 130px;
bottom: 0;
padding: 12px 30px 12px 60px;
overflow: auto;
.input-box{
display: flex;
align-items: center;
margin: 12px 0 20px;
.input{
flex: 1;
display: block;
padding: 14px 20px;
font-size: 30px;
color: #333;
border:1px solid #C6C6C6;/*no*/
border-radius:8px;
background-color: #F9F9F9;
}
.search-btn{
margin-left: 12px;
display: block;
font-size: 30px;/*px*/
color: #666;
min-width: 80px;
}
}
.hot-keys{
position: relative;
overflow: hidden;
.keys{
float: left;
display: block;
margin-left: 20px;
font-size: 20px;
color: #3091FE;
}
&.after{
content: '';
clear: both;
zoom: 1;
}
}
.item{
margin: 40px auto;
.top{
display: flex;
align-items: center;
.icon-arrow{
width: 20px;
height: 14px;
margin-left: 20px;
transition: all .2s linear;
&.rotate{
transform: rotate(180deg);
}
}
}
.sub-menu{
padding: 30px 0 0;
overflow: hidden;
.item-menu{
float: left;
font-size: 32px;
color: #666;
margin-right: 60px;
}
}
}
}
\ No newline at end of file
src/components/Drawer/index.vue deleted 100644 → 0
<template>
<div class='drawer-box' v-if="showDrawer">
<div class="mask" @click="toggleDrawerStatus"></div>
<div class="content" :class="{ active : animate }">
<div class="hd">
<img class="app-logo" src="http://static.ledouya.com/Flu7n1DcDv45J4qNSj9snKHmdTs2" @click="handleBack">
<img class="icon-group" src="../../assets/images/icon-close.png" @click="toggleDrawerStatus">
</div>
<div class="main-bd">
<div class="search-box">
<div class="title">首页</div>
<div class="input-box">
<input class="input" type="text" v-model="keywords" placeholder="请输入你想搜索的">
<a class="search-btn" href="javascript:;" @click="handleSearchBtnClick">搜索</a>
</div>
<div class="hot-keys">
<a class="keys" href="javascript:;" v-for="(item,index) in hotKeys" @click="handleKeyItemClick(item)">{{ item }}</a>
</div>
</div>
<!---->
<div class="cate-list" v-if="cateList[0].children">
<div class="item" v-for="(item,index) in cateList[0].children" :key="index">
<div class="top" @click.stop="toggleCateItem(index)">
<div class="title">{{ item.name }}</div>
<img class="icon-arrow" :class="{ rotate : !item.is_edit }" src="../../assets/images/arrow.png" alt="">
</div>
<div class="sub-menu" v-if="item.children" v-show="item.is_edit ">
<div class="item-menu" v-for="(target,idx) in item.children" @click.stop="handleCateClick(target)">{{ target.name }}</div>
</div>
</div>
</div>
</div>
</div>
</div>
</template>
<script>
import { mapGetters , mapMutations } from 'vuex'
export default{
data(){
return{
keywords : '' ,
animate : false
}
},
computed : {
...mapGetters({
hotKeys : 'getHotKeys' ,
showDrawer : 'getDrawerStatus' ,
cateList : 'getCategoryList' ,
showFormModal : 'getFormStatus'
})
},
watch : {
showDrawer : function () {
this.toggleFormStatus({ flag : false });
setTimeout(()=>{
if( this.showDrawer ) {
this.animate = true;
} else this.animate = false;
},100)
}
},
methods : {
...mapMutations([
'toggleDrawerStatus' ,
'toggleFormStatus'
]),
handleBack(){
this.toggleDrawerStatus();
this.$router.push({
path : '/'
})
},
toggleCateItem(index){
this.cateList[0].children[index].is_edit = !this.cateList[0].children[index].is_edit;
this.$store.commit('insertCategoryList',this.cateList)
},
handleSearchBtnClick(){
if( !this.keywords.trim().length ){
this.$message({
title : '温馨提示' ,
content : '请输入搜索关键字'
})
return ;
}
this.toggleDrawerStatus();
this.$router.push({
path : '/display/search?keywords=' + this.keywords
})
this.keywords = '';
},
handleKeyItemClick(item){
this.toggleDrawerStatus();
this.$router.push({
path : '/display/search?keywords=' + item
})
this.keywords = '';
},
handleCateClick(e){
this.toggleDrawerStatus();
this.$router.push({
path : `/display/${e.id}?cateName=${e.name}`
})
this.keywords = '';
}
}
}
</script>
<style scoped lang="less">
@import "./index.less";
</style>
\ No newline at end of file
src/components/Form/index.less deleted 100644 → 0
.mask{
position: fixed;
top: 0;
left: 0;
right: 0;
bottom: 0;
background-color: rgba(0,0,0,.5);
z-index: 3;
}
.content{
position: fixed;
padding-bottom: 30px;
bottom: 0;
left: 0;
right: 0;
background-color: #fff;
z-index: 9;
transition: all .3s linear;
transform: translateY(100%);
&.active{
transform: translateY(0);
}
}
.hd{
position: relative;
border-bottom: 1px solid #E8E8E8;/*no*/
.title{
padding: 30px;
font-size: 32px;/*px*/
text-align: center;
color: #999;
}
.icon-close{
position: absolute;
width: 46px;
height: 46px;
right: 30px;
top: 30px;
}
}
.bd{
padding: 30px;
position: relative;
text-align: center;
.text{
font-size: 30px;/*px*/
color: #333;
}
.tel-link{
display: block;
margin-top: 10px;
font-size: 40px;
color: #3091FE;
}
&:after{
content: '';
display: block;
position: absolute;
left: 30px;
right: 30px;
bottom: 0;
background-color: #E8E8E8;
height: 1px; /*no*/
}
}
.tips{
padding: 30px 24px 10px;
font-size: 30px;/*px*/
color: #333;
}
.form-box{
padding: 30px 24px;
.input{
padding: 24px 30px;
border : 1px solid #c6c6c6; /*no*/
width: 100%;
font-size: 30px;/*px*/
margin-bottom: 30px;
}
}
.submit-btn{
margin: 50px 24px 0;
background-color: #3091FE;
text-align: center;
color: #fff;
font-size: 32px;
padding: 25px 30px;
}
\ No newline at end of file
src/components/Form/index.vue deleted 100644 → 0
<template>
<div class='form-wrapper' v-show="showFormModal">
<div class="mask" @click.stop="toggleFormStatus( { flag : false })"></div>
<div class="content" :class="{ active : animate }">
<div class="hd">
<div class="title">开店咨询</div>
<img class="icon-close" src="../../assets/images/icon-close.png" alt="" @click.stop="toggleFormStatus( { flag : false })">
</div>
<div class="bd">
<div class="text">请拨打开店咨询热线：</div>
<a class="tel-link" href="tel:400-6865539">400-6865539</a>
</div>
<div class="tips">或者填写你的联系方式，我们会主动与你联系</div>
<div class="form-box">
<input type="text" class="input" placeholder="姓名" v-model="name">
<input type="tel" class="input" placeholder="手机号码" v-model="phone" maxlength="11">
<input type="text" class="input" placeholder="公司名称（选填）" v-model="company">
</div>
<div class="submit-btn" @click="handleSubmitBtnClick">提交信息</div>
</div>
<Loading :loading="loading"></Loading>
</div>
</template>
<script>
import { mapGetters , mapMutations } from 'vuex'
import Loading from '../../components/Loading'
//api
import { collectUserInfo } from '../../api/common'
export default{
components : {
Loading
},
data(){
return{
name : '' ,
phone : '',
company : '' ,
animate : false ,
loading : false
}
},
computed : {
...mapGetters({
showFormModal : 'getFormStatus'
})
},
watch : {
showFormModal : function () {
setTimeout(()=>{
this.animate = !this.animate;
},100)
}
},
methods : {
...mapMutations([
'toggleFormStatus'
]),
handleSubmitBtnClick(){
if(!this.validate()) return;
this.loading = true;
collectUserInfo({
name : this.name ,
phone : this.phone ,
title : this.company || this.phone ,
details : this.company || this.phone
}).then(res=>{
this.loading = false;
this.toggleFormStatus( { flag : false });
if(res.error === 0 ){
this.$message({
title : '温馨提示' ,
content : res.error_reason
})
}
})
},
validate(){
if(!this.name.trim().length){
this.$message({
title : '温馨提示' ,
content : '请输入姓名'
})
return false;
}
if(!this.phone.trim().length){
this.$message({
title : '温馨提示' ,
content : '请输入联系方式'
})
return false;
}
return true;
}
}
}
</script>
<style scoped lang="less">
@import "./index.less";
</style>
\ No newline at end of file
src/framework/core/baseCasePage.js 0 → 100644
import CaseUtil from "../service/base/caseUtil";
export default class BaseCasePage {
baseData = {
caseAlias: null,
modelAlias: null,
thirdToken: null,
caseConfig: {},
caseInfo: {},
};
baseShare = {
canShare: false,
sysShare: false,
shareInfo: {
title: '',
path: '',
imageUrl: '',
options: null
},
};
constructor(pageObj) {
console.log('---BaseCasePage-----');
if (pageObj.data) { // data域合并。
let _data = pageObj.data();
let data = this.baseData;
let share = JSON.parse(JSON.stringify(this.baseShare));
pageObj.data = function () {
if (!_data) _data = {};
let newData = JSON.parse(JSON.stringify(data));
if (_data.share) share = Object.assign(share, _data.share);
return Object.assign(newData, _data, {share: share});
};
}
//拦截入参，onLoad 事件特殊处理
if (pageObj.mounted) {
let _onLoad = pageObj.mounted;
pageObj.mounted = async function () {
//获取页面数据
let caseAlias = this.caseAlias ? this.caseAlias : '0';//默认值为
if (this.$route.query && this.$route.query.id) {
caseAlias = this.$route.query.id;
}
if (this.$route.query && this.$route.query.model_id) {
this.modelAlias = this.$route.query.model_id;
}
if (this.$route.query && this.$route.query.thirdToken) {
this.thirdToken = this.$route.query.thirdToken;
}
this.caseAlias = caseAlias;
// console.log(caseAlias, '---caseAlias----', this.thirdToken);
//根据caseAlias 获取页面数据-同步阻塞方法
await CaseUtil.loadCaseInfo(caseAlias, this.modelAlias, false, (caseInfo) => {
this.caseInfo = caseInfo;
this.caseConfig = caseInfo.config;
// console.log(this.caseConfig,'----this.caseInfo---');
_onLoad.call(this);
});
};
}
return pageObj;
}
}
src/framework/core/baseTrainPage.js 0 → 100644
import CaseUtil from "../service/base/caseUtil";
import BaseCasePage from "./baseCasePage";
export default class BaseTrainPage extends BaseCasePage{
baseData = {
level: 0,
levelConfig: {},
};
constructor(pageObj) {
console.log('---BaseTrainPage-----');
//拦截入参，onLoad 事件特殊处理
if (pageObj.mounted) {
let _onLoad = pageObj.mounted;
pageObj.mounted = async function () {
//获取当前level的配置数据
this.level = this.$route.query.level;
this.levelConfig = this.caseConfig[this.level];
await _onLoad.call(this);
};
super(pageObj);
if (pageObj.data) { // data域合并。
let _data = pageObj.data;
let data = this.baseData;
pageObj.data = function () {
return Object.assign(JSON.parse(JSON.stringify(data)), _data());
};
}
}
return pageObj;
}
}
src/framework/service/base/caseUtil.js 0 → 100644
/**
* 模型实例工具类
*/
import {getCaseConfig, getCaseDetail} from "../../../api/common";
import StoreUtil from "../../../store/stateStore";
import BaseConstant from "../../../store/constants/baseConstant";
import fa from "element-ui/src/locale/lang/fa";
export default class CaseUtil {
/**
* 获取case完整信息
* @param caseAlias
* @param modelAlias
* @param force
* @param callback
* @return {Promise<unknown>}
*/
static loadCaseInfo(caseAlias, modelAlias, force = false, callback = null) {
if (!caseAlias || !caseAlias.length) {
return false;
}
//缓存读取
if (!force && StoreUtil.getState().train.cases['case_' + caseAlias]) {
if (callback) callback(StoreUtil.getState().train.cases['case_' + caseAlias]);
return true;
}
//网络获取
let data = {
id: caseAlias,
model_id: modelAlias,
};
return new Promise(resolve => {
getCaseDetail(data).then((res) => {
// 执行数据存储
let info = res.data;
if (info.config) {
info.config = JSON.parse(info.config);
}
StoreUtil.stateSave(BaseConstant.BRAIN_TRAIN_CASE_INFO, info);
if (callback) callback(info);
});
resolve(true);
});
}
/**
* 获取case配置
* @param caseAlias
* @param modelAlias
* @param force
* @param callback
* @return {Promise<unknown>|null}
*/
static loadCaseConfig(caseAlias, modelAlias, force = false, callback = null) {
if (!caseAlias || !caseAlias.length) {
return null;
}
//缓存读取
//网络获取
let data = {
id: caseAlias,
model_id: modelAlias
};
return new Promise(resolve => {
getCaseConfig(data).then((res) => {
// 执行数据存储
if (callback) callback(res.data);
});
resolve(true);
});
}
static goToTrain(path,that){
StoreUtil.stateSave(BaseConstant.BRAIN_TRAIN_TRAIN_INFO_NOW, {
case_id: that.caseAlias,
model_id: that.modelAlias,
level: that.level,
level_config: that.caseConfig[that.level],
});
that.$router.push({
path: path,
query: {
level: that.level,
id: that.caseAlias,
model_id: that.modelAlias
}
});
}
}
src/framework/util/cookie.js 0 → 100644
// 获取 getUToken
export function getToken () {
return window.localStorage.getItem('token') ;
// return 'eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiIsImp0aSI6IiJ9.eyJpc3MiOiIiLCJhdWQiOiIiLCJqdGkiOiIiLCJpYXQiOjE1NDgyMTE3ODcsIm5iZiI6MTU0ODIxMTc4NywiZXhwIjoxNTc5NzQ3Nzg3LCJ0b2tlbiI6ImQ3ODI3NGRkZDJiZDU5MjYxN2NmY2I0NDFkNmY3YWQ1IiwidXRva2VuIjoiZDc4Mjc0ZGRkMmJkNTkyNjE3Y2ZjYjQ0MWQ2ZjdhZDUiLCJidG9rZW4iOiIxZGY0NmUwMmRiNDkyYjQ2MTEyMGMyNWEyMTk2NTNlYiIsInJvbGUiOiJ1c2VyIiwidWlkIjoiNDIiLCJvcGVuaWQiOiJvMVc2SnMxLVJySDJQc3oxU29uU0lkY05vNlBvIn0.Q8WDoUviFakJl1IVEpPmMMaS9EgfvzycBHfocuBkaXw'
}
//获取cookie、
export function getCookie(name) {
if(name === 'token'){
return "eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiIsImp0aSI6IiJ9.eyJpc3MiOiIiLCJhdWQiOiIiLCJqdGkiOiIiLCJpYXQiOjE1ODE1ODk1NTAsIm5iZiI6MTU4MTU4OTU1MCwiZXhwIjoxNTgyMTk0MzUwLCJ0b2tlbiI6IjAwYWZlYWZiM2IyZTg0YTNjZTI4NDU2N2I0NjE4Nzg4IiwiYnRva2VuIjoiMDBhZmVhZmIzYjJlODRhM2NlMjg0NTY3YjQ2MTg3ODgiLCJtdG9rZW4iOiIzYzcyNDg1ZGZiM2E3NTViYjVhOTZiYjg4ODVkZjU4OCIsImFjY291bnQiOiIxODcxMDg0NzMwOCIsInRva2VuX3R5cGUiOiJidXNpbmVzcyIsInJvbGUiOiJtYXN0ZXIiLCJpbmR1c3RyeV90eXBlIjoiIiwic291cmNlIjoicGMifQ.rlrK8BZTub_uiTmtcXVomaSU-XRuadLIzdxUNXSIQBU";
}
let arr, reg = new RegExp("(^| )" + name + "=([^;]*)(;|$)");
if (arr = document.cookie.match(reg))
return (arr[2]);
else
return null;
}
//设置cookie
export function setCookie (c_name, value, expiredays) {
let exdate = new Date();
exdate.setDate(exdate.getDate() + expiredays);
document.cookie = c_name + "=" + escape(value) + ((expiredays == null) ? "" : ";expires=" + exdate.toGMTString());
};
//删除cookie
export function delCookie (name) {
let exp = new Date();
exp.setTime(exp.getTime() - 1);
let cval = getCookie(name);
if (cval != null)
document.cookie = name + "=" + cval + ";expires=" + exp.toGMTString();
};
src/main.js
...@@ -3,25 +3,31 @@ ...@@ -3,25 +3,31 @@
import Vue from 'vue' import Vue from 'vue'
import App from './App' import App from './App'
import router from './router' import router from './router'
import store from './store' import StoreUtil from './store/stateStore';
import ElementUI from 'element-ui' import ElementUI from 'element-ui'
import 'element-ui/lib/theme-chalk/index.css' import 'element-ui/lib/theme-chalk/index.css'
import 'lib-flexible/flexible' import 'lib-flexible/flexible'
Vue.use(ElementUI) import Navigation from "vue-navigation";
Vue.config.productionTip = false
let store = StoreUtil.getStore();
Vue.use(ElementUI);
Vue.config.productionTip = false;
//global components //global components
import Message from './components/Message' import Message from './components/Message'
Vue.prototype.$message = Message.install; Vue.prototype.$message = Message.install;
Vue.use(Navigation, {router, store});
/* eslint-disable no-new */ /* eslint-disable no-new */
new Vue({ new Vue({
el: '#app', el: '#app',
router, router,
store, store,
components: { App }, components: {App},
template: '<App/>' template: '<App/>'
}) });
src/router/index.js
...@@ -3,7 +3,7 @@ import Router from 'vue-router' ...@@ -3,7 +3,7 @@ import Router from 'vue-router'
const _import = require('./_import_' + process.env.NODE_ENV) const _import = require('./_import_' + process.env.NODE_ENV)
Vue.use(Router) Vue.use(Router);
import Layout from '../views/layout/Layout.vue' import Layout from '../views/layout/Layout.vue'
...@@ -13,7 +13,7 @@ const constantRouterMap = [ ...@@ -13,7 +13,7 @@ const constantRouterMap = [
}, },
{ {
path: '/', path: '/',
component: Layout , component: Layout ,
children : [ children : [
{ {
path : '/' , path : '/' ,
...@@ -86,6 +86,11 @@ const constantRouterMap = [ ...@@ -86,6 +86,11 @@ const constantRouterMap = [
name : 'pi' , name : 'pi' ,
}, },
{ {
path : '/pi/preLearn' ,
component : _import('pi/preLearn') ,
name : 'preLearn' ,
},
{
path : '/pi/answerPi' , path : '/pi/answerPi' ,
component : _import('pi/answerPi') , component : _import('pi/answerPi') ,
name : 'answerPi' , name : 'answerPi' ,
...@@ -151,18 +156,23 @@ const constantRouterMap = [ ...@@ -151,18 +156,23 @@ const constantRouterMap = [
}, },
//国学经典 //国学经典
{ {
path : '/studiesChnia/index' , path : '/studiesChina/preLearn' ,
component : _import('studiesChnia/index') , component : _import('studiesChina/preLearn') ,
name : 'studiesChniaIndex' , name : 'preLearn' ,
},
{
path : '/studiesChina/index' ,
component : _import('studiesChina/index') ,
name : 'studiesChinaIndex' ,
}, },
{ {
path : '/studiesChnia/answerStudies' , path : '/studiesChina/answerStudies' ,
component : _import('studiesChnia/answerStudies') , component : _import('studiesChina/answerStudies') ,
name : 'answerStudies' , name : 'answerStudies' ,
}, },
{ {
path : '/studiesChnia/studiesResult' , path : '/studiesChina/studiesResult' ,
component : _import('studiesChnia/studiesResult') , component : _import('studiesChina/studiesResult') ,
name : 'studiesResult' , name : 'studiesResult' ,
}, },
] ]
......
src/store/actions/sys.js 0 → 100644
File mode changed
src/store/actions/train.js 0 → 100644
export const trainAction = {}
;
src/store/actions/user.js 0 → 100644
File mode changed
src/store/constants/baseConstant.js 0 → 100755
export default class BaseConstant {
static APP_ENV_INFO = 'app_env_info';
static APP_ACCESS_AUTH = 'app_access_auth';
static SYSTEM_LAUNCH_TOKEN = 'system_launch_token';
static SYSTEM_SYS_INFO = 'system_sys_info';
/**
* 系统类信息
* @type {string}
*/
static SYSTEM_INFO = 'system_info';
static SYSTEM_USER_LOCATION = 'system_user_location';
static USER_BASE_INFO = 'user_base_info';
static USER_OVERVIEW_INFO = 'user_overview_info';
static BRAIN_TRAIN_MODEL_INFO = 'brain_train_model_info';
static BRAIN_TRAIN_CASE_INFO = 'brain_train_case_info';
static BRAIN_TRAIN_CASE_CONFIG = 'brain_train_case_config';
static BRAIN_TRAIN_CASE_ANSWER = 'brain_train_case_answer';
static BRAIN_TRAIN_TRAIN_INFO_NOW = 'brain_train_train_info_now';
static BRAIN_TRAIN_CASE_INFO_NOW_CLEAN = 'brain_train_train_info_now_clean';
}
src/store/getters.js deleted 100644 → 0
const getters = {
nickname : state => state.app.userInfo.nickname || JSON.parse(sessionStorage.getItem('userInfo')).nickname,
routers : state => state.routers ,
subRouters : state => state.subRouters
}
export default getters
src/store/getters/app.js 0 → 100644
export const appGetter = {
};
src/store/getters/sys.js 0 → 100644
File mode changed
src/store/getters/user.js 0 → 100644
File mode changed
src/store/index.js
import Vue from 'vue' import Vue from 'vue';
import Vuex from 'vuex' import Vuex from 'vuex';
import createLogger from 'vuex/dist/logger';
import app from './modules/app' import {appModule} from './modules/app';
import {trainModule} from './modules/train';
Vue.use(Vuex) import {sysModule} from './modules/sys';
import {userModule} from './modules/user';
const state = {
baseURL : process.env.NODE_ENV === 'development' ? 'http://api.xuetang.test.ledianyun.com/' :'https://xuetang.api.ledianyun.com/' ,
}
Vue.use(Vuex);
const store = new Vuex.Store({ const store = new Vuex.Store({
modules : { modules: {
app, app: appModule,
randomNumber: [], //随机数字正确答案 train: trainModule,
myNumberAnswer: [], //我的随机数字答案 sys: sysModule,
randomLetter: [], //随机字母正确答案 user: userModule,
myLetterAnswer: [], //我的随机字母答案 },
forwardAnswer: [], //正向速算结果 state: {
reserveAnswer: [], //逆向速算结果 },
articleAnswer: [], //阅读理解结果 mutations: {},
}, plugins: [createLogger()],
state // strict: process.env.NODE_ENV !== 'production'
}) });
export default store
export default store;
src/store/modules/app.js
import { getCategoryList } from '../../api/category' import BaseConstant from '../constants/baseConstant';
import { queryQuestionList } from '../../api/question'
import { querySpecialList } from '../../api/special'
import { getKeywords } from '../../api/keywords'
const app = { const state = {
state : { platform: 'custom',
//分类列表 domains: {
categoryList : [] , //基础服务
//问答列表 serviceURL: 'https://pg.ledianyun.com/oem/qidian/api/',
questionList : [] , storeURL: 'https://pg.ledianyun.com/oem/qidian/api/',
//专题列表 openURL: 'https://pg.ledianyun.com/oem/qidian/api/'
specialList : [] , },
//热词列表 version: 'latest',
hotKeys : [], //当前环境
//目标分类 envVersion: 'develop',
targetCategory : {}, mtoken: '',
//form btoken: '',
showFormModal : false , authorize: {
//侧边栏 token: '',
showDrawer : false exp: 0
}, },
getters : { };
//获取分类
getCategoryList(state){
return state.categoryList.length ? state.categoryList : JSON.parse(sessionStorage.getItem('categoryList'));
},
//选中的文章信息
getTargetCategory(state){
return state.targetCategory;
},
//获取问答
getQuestionList(state){
return state.questionList.length ? state.questionList : JSON.parse(sessionStorage.getItem('questionList'));
},
//获取专题
getSpecialList(state){
return state.specialList.length ? state.specialList : JSON.parse(sessionStorage.getItem('specialList'));
},
//获取热词
getHotKeys(state){
return state.hotKeys.length ? state.hotKeys : JSON.parse(sessionStorage.getItem('hotKeys'));
},
//获取form状态
getFormStatus(state){
return state.showFormModal;
},
//获取状态
getDrawerStatus(state){
return state.showDrawer;
}
},
mutations : {
//插入分类
insertCategoryList(state,payload){
state.categoryList = payload;
sessionStorage.setItem('categoryList',JSON.stringify(payload));
},
//插入目标文章
insertTargetCategory(state,payload){
state.targetCategory = payload;
},
//插入问答
insertQuestionList(state,payload){
state.questionList = payload;
sessionStorage.setItem('questionList',JSON.stringify(payload));
},
//插入专题
insertSpecialList(state,payload){
state.specialList = payload;
sessionStorage.setItem('specialList',JSON.stringify(payload));
},
//插入热词
insertHotKeys(state,payload){
state.hotKeys = payload;
sessionStorage.setItem('hotKeys',JSON.stringify(payload));
},
//切换状态
toggleFormStatus(state,payload){
state.showFormModal = payload.flag;
},
//切换
toggleDrawerStatus(state){
state.showDrawer = !state.showDrawer
}
},
actions : {
//异步请求分类列表
dispatchGetCategoryList({ commit }){
//加载分类
let categoryList = JSON.parse(sessionStorage.getItem('categoryList'));
if( categoryList && categoryList.length ) return; console.log('---');
getCategoryList().then(res=>{ export const appModule = {
if(res.data && res.data.length){ // namespaced: true,
if(res.data[0].children) res.data[0].children[0].is_edit = true; state,
commit('insertCategoryList',res.data); getters: {},
} actions: {},
}) mutations: {
}, [BaseConstant.APP_ACCESS_AUTH](state, authorize) {
//异步请求问答列表 state.authorize = Object.assign(state.authorize, {
dispatchGetQuestionList({ commit }){ token: authorize.token,
let questionList = JSON.parse(sessionStorage.getItem('questionList')); exp: authorize.exp,
if( questionList && questionList.length ) return; });
},
queryQuestionList().then(res => { [BaseConstant.APP_ENV_INFO](state, action) {
if ( res.data && res.data.info ) { state = Object.assign(state, action);
res.data.info.map((v,index)=>{ },
if( index === 0 ) v.is_expand = true }
else v.is_expand = false };
})
commit('insertQuestionList',res.data.info)
}
})
},
//异步请求专题列表
dispatchSpecialList({ commit }){
let specialList = JSON.parse(sessionStorage.getItem('specialList'));
if( specialList && specialList.length ) return;
querySpecialList().then(res => {
if ( res.data && res.data.info ) {
commit('insertSpecialList',res.data.info)
}
})
},
//异步请求热词
dispatchGetHotKeys( { commit }){
let hotKeys = JSON.parse(sessionStorage.getItem('hotKeys'));
if( hotKeys && hotKeys.length ) return;
getKeywords().then(res=>{
if(res.data && res.data.length) {
commit('insertHotKeys',res.data);
}
})
}
}
}
export default app
\ No newline at end of file
src/store/modules/sys.js 0 → 100644
import BaseConstant from '../constants/baseConstant';
const state = {
launch_token: 'launch',
network: 'normal',
sysInfo: {},
location: {
latitude: 0,
longitude: 0,
location_time: null
},
launched:false,
};
export const sysModule = {
state,
getters: {},
actions: {},
mutations: {
[BaseConstant.SYSTEM_LAUNCH_TOKEN](state, action) {
state.launch_token = action;
},
[BaseConstant.SYSTEM_SYS_INFO](state, action) {
state.sysInfo = Object.assign(state.sysInfo, action);
},
[BaseConstant.SYSTEM_INFO](state, action) {
state = Object.assign(state, action);
},
init(state, action) {
state.launched = action;
},
}
};
src/store/modules/train.js 0 → 100644
import {trainMutation} from '../mutations/train';
import {trainAction} from '../actions/train';
const state = {
models: {}, //模型信息列表
cases: {},// 训练实例列表（包括配置信息）
currentCase: {
case_id: 0,
model_id:0,
level:0,
level_config:{},
data:{},
result:{},
result_detail:{}
},
randomNumber: [], //随机数字正确答案
myNumberAnswer: [], //我的随机数字答案
randomLetter: [], //随机字母正确答案
myLetterAnswer: [], //我的随机字母答案
forwardAnswer: [], //正向速算结果
reserveAnswer: [], //逆向速算结果
articleAnswer: [], //阅读理解结果
};
export const trainModule = {
// namespaced: true,
state,
mutations: trainMutation,
actions: trainAction,
};
src/store/modules/user.js 0 → 100644
import BaseConstant from '../constants/baseConstant';
const state = {
userBaseInfo: {}, //用户基础信息
};
export const userModule = {
state,
getters: {},
actions: {},
mutations: {
[BaseConstant.USER_BASE_INFO](state, action) {
state.userBaseInfo = Object.assign(state.userBaseInfo, action);
},
}
};
src/store/mutations/train.js 0 → 100644
import BaseConstant from '../constants/baseConstant';
export const trainMutation = {
[BaseConstant.BRAIN_TRAIN_MODEL_INFO](state, action) {
let model_id = action.id;
if (!state.models["model_" + model_id]) {
state.models["model_" + model_id] = {};
}
state.models["model_" + model_id] = Object.assign(state.models["model_" + model_id], action);
},
[BaseConstant.BRAIN_TRAIN_CASE_INFO](state, action) {
let case_id = action.id;
if (!state.cases["case_" + case_id]) {
state.cases["case_" + case_id] = {};
}
state.cases["case_" + case_id] = Object.assign(state.cases["case_" + case_id], action);
},
[BaseConstant.BRAIN_TRAIN_CASE_ANSWER](state, action) {
let model_name = action.model_name;
state[model_name] = action;
},
[BaseConstant.BRAIN_TRAIN_TRAIN_INFO_NOW](state, action) {
if (action.data) {
action.data = Object.assign(state.currentCase.data, action.data);
}
if (action.result) {
action.result = Object.assign(state.currentCase.result, action.result);
}
if (action.result_detail) {
action.result_detail = Object.assign(state.currentCase.result_detail, action.result_detail);
}
state.currentCase = Object.assign(state.currentCase, action);
},
[BaseConstant.BRAIN_TRAIN_CASE_INFO_NOW_CLEAN](state, action) {
state.currentCase = {
case_id: 0,
model_id:0,
level:0,
level_config:{},
data:{},
result:{},
result_detail:{}
};
},
};
src/store/stateStore.js 0 → 100644
import configStore from './index';
const store = configStore;
export default class StoreUtil {
static getStore() {
return store;
}
/**
* redux 快速存储方法
* @param handler
* @param data
*/
static stateSave(handler, data = null) {
store.commit(handler, data);
}
/**
* 获取到state
* @return {any}
*/
static getState() {
return store.state;
}
/**
* 本地缓存
* @param key
* @param data
* @param exp
*/
static localSave(key, data, exp = null) {
data = {
value: data,
exp: exp ? (new Date().getTime() / 1000 + exp) : null
};
window.localStorage.setItem(key, JSON.stringify(data));
}
/**
* 从本地缓存获取数据
* @param key
* @return {null|*}
*/
static localGet(key) {
let data = window.localStorage.getItem(key);
if (!data) {
return null;
}
data = JSON.parse(data);
if (data.exp && new Date().getTime() > data.exp) {
StoreUtil.localRemove(key);
}
return data.value;
}
/**
* 移除本地缓存
* @param key
*/
static localRemove(key) {
window.localStorage.removeItem(key);
}
/**
* 清空本地缓存
*/
static localClear() {
window.localStorage.clear();
}
}
src/stylesheets/app.css
...@@ -30,4 +30,45 @@ input::-webkit-inner-spin-button { ...@@ -30,4 +30,45 @@ input::-webkit-inner-spin-button {
} }
.content p{ .content p{
line-height: 20px; line-height: 20px;
} }
\ No newline at end of file
.m-selector {
display: flex;
align-items: center;
width: 100%;
justify-content: center;
flex-wrap: wrap;
color: #666;
margin-top: 20px;
}
.m-selector .item{
/*width: 46px;*/
min-width: 46px;
padding: 8px 6px;
height: 46px;
display: flex;
align-items: center;
justify-content: center;
border: 2px solid #666;
border-radius: 8px;
margin-left: 20px;
margin-top : 8px;
margin-bottom : 8px;
}
.m-selector .active {
color: #fff;
background: #409eff;
border-color: #409eff;
}
.startAnswer {
margin: 0 auto ;
padding: 16px 40px;
border-radius: 40px;
font-size: 16px;
background: #409EFF;
color: #fff;
display: flex;
align-items: center;
justify-content: center;
}
src/utils/request.js
// 请求 // 请求
import axios from 'axios' import axios from 'axios'
import StoreUtil from "../store/stateStore";
import {getCookie, setCookie} from "../framework/util/cookie";
const baseURL = process.env.NODE_ENV === 'development' ? 'http://api.xuetang.test.ledianyun.com/' :'https://xuetang.api.ledianyun.com/'; let isDev = process.env.NODE_ENV === 'development';
isDev = true;
const baseURL = isDev ? 'http://api.brain.test.ledianyun.com/' : 'https://api.brain.ledianyun.com/';
// create an axios instance // create an axios instance
const service = axios.create({ const service = axios.create({
baseURL : baseURL , // api的base_url baseURL: baseURL, // api的base_url
timeout : 30000, // request timeout timeout: 30000, // request timeout
method : 'post' , method: 'post',
transformRequest : [function (data) { transformRequest: [function (data) {
return JSON.stringify(data) return JSON.stringify(data)
}], }],
headers : { headers: {
'Content-Type' : 'application/json' 'Content-Type': 'application/json'
} }
}) });
// request interceptor // request interceptor
service.interceptors.request.use(config => { service.interceptors.request.use(config => {
//console.log(config) if (!config.body) config.body = {};
return config; config.body = Object.assign(config.body, {
} , error => { version: 'latest',
// Do something with request error third_token: StoreUtil.localGet('thirdToken')
console.log(error) });
return Promise.reject(error) //请求头
}) if (!config.body.notAuth) {
config.headers['token'] = getCookie('token');
}
return config;
}, error => {
// Do something with request error
console.log(error);
return Promise.reject(error)
});
// request interceptor // request interceptor
service.interceptors.response.use( response => { service.interceptors.response.use(response => {
if( response.data.error !== 0 ){ if (response.data.error == 10001 || response.data.error == 10002 || response.data.error == 10003
alert( response.data['error_reason'] ) || response.data.error == 10004 || !getCookie('token')) {
return {}; // window.localStorage.setItem('currentPath', window.location.href);
} setCookie('currentPath', window.location.href);
return response.data; window.location.href = store.state.testUrl + "api/wechat/auth?path=" + store.state.path;
} , error => { return {};
alert( error.message ) } else {
return Promise.reject(error) if (response.data.error !== 0) {
}) this.$message({
type: 'error',
content: response.data['error_reason']
});
return {};
}
return response.data;
}
}, error => {
alert(error.message);
return Promise.reject(error)
});
export default service export default service
\ No newline at end of file
src/views/fastReading/answerQuestion.vue
...@@ -10,7 +10,7 @@ ...@@ -10,7 +10,7 @@
<div class="question-item" v-for="(item,index) in questionList" v-if="(index+1) == subject_number"> <div class="question-item" v-for="(item,index) in questionList" v-if="(index+1) == subject_number">
<div class="question">{{index+1}}、{{item.question}}</div> <div class="question">{{index+1}}、{{item.question}}</div>
<div v-for="(i) in item.answer" class="answer"> <div v-for="(i) in item.answer" class="answer">
<input v-model="myAnswer" type="radio" :value="i" :name="i" />{{i}} <input v-model="myAnswer" type="radio" :value="i" :name="i"/>{{i}}
</div> </div>
</div> </div>
...@@ -28,6 +28,9 @@ ...@@ -28,6 +28,9 @@
<script> <script>
import {article} from "../../utils/article"; import {article} from "../../utils/article";
import StoreUtil from "../../store/stateStore";
import BaseConstant from "../../store/constants/baseConstant";
export default { export default {
name: "answerQuestion", name: "answerQuestion",
data() { data() {
...@@ -41,50 +44,70 @@ ...@@ -41,50 +44,70 @@
}, },
methods: { methods: {
pre() { pre() {
if(this.subject_number>1) { if (this.subject_number > 1) {
this.myAnswer = this.questionList[this.subject_number-2].myAnswer; this.myAnswer = this.questionList[this.subject_number - 2].myAnswer;
this.subject_number = this.subject_number - 1; this.subject_number = this.subject_number - 1;
} }
}, },
next() { next() {
if(this.subject_number<this.questionList.length) { if (this.subject_number < this.questionList.length) {
this.questionList[this.subject_number-1].myAnswer = this.myAnswer?this.myAnswer:'未作答'; this.questionList[this.subject_number - 1].myAnswer = this.myAnswer ? this.myAnswer : '未作答';
this.myAnswer = this.questionList[this.subject_number].myAnswer; this.myAnswer = this.questionList[this.subject_number].myAnswer;
this.subject_number = this.subject_number + 1; this.subject_number = this.subject_number + 1;
} }
}, },
submit() { submit() {
this.questionList[this.subject_number-1].myAnswer = this.myAnswer; this.questionList[this.subject_number - 1].myAnswer = this.myAnswer;
this.$store.state.articleAnswer = this.questionList; let answer_time_end = new Date().getTime();
StoreUtil.stateSave(BaseConstant.BRAIN_TRAIN_TRAIN_INFO_NOW, {
data: {
answer: this.questionList,
},
result: {
answer_time_end: answer_time_end,
}
});
this.$router.push({ this.$router.push({
path: '/fastReading/readResult', path: '/fastReading/readResult',
query: { query: {}
time: this.count_time
}
}) })
}, },
countDown() { countDown() {
this.timer = setInterval(()=>{ this.timer = setInterval(() => {
if(this.count_time > 0) { if (this.count_time > 0) {
this.count_time = this.count_time - 1; this.count_time = this.count_time - 1;
}else { } else {
clearInterval(this.timer); clearInterval(this.timer);
} }
},1000) }, 1000)
}, },
}, },
mounted() { mounted() {
this.count_time = this.$route.query.time; this.article_index = JSON.parse(JSON.stringify(StoreUtil.getState().train.currentCase.data.article_index));
this.countDown();
article[0].questionList.forEach((v,i)=>{ article[0].questionList.forEach((v, i) => {
this.questionList.push({ this.questionList.push({
question: v.question, question: v.question,
answer: v.answer, answer: v.answer,
myAnswer: '未作答', myAnswer: '未作答',
correctAnswer: v.correctAnswer correctAnswer: v.correctAnswer,
check: false,
}) })
}) });
StoreUtil.stateSave(BaseConstant.BRAIN_TRAIN_TRAIN_INFO_NOW, {
result: {
answer_time_start: new Date().getTime()
},
result_detail: {
q: []
}
});
this.count_time = this.$route.query.time;
this.countDown();
} }
} }
</script> </script>
...@@ -126,13 +149,16 @@ ...@@ -126,13 +149,16 @@
.question-list { .question-list {
margin-top: 30px; margin-top: 30px;
} }
.question-item { .question-item {
} }
.question { .question {
color: #333; color: #333;
font-size: 30px; font-size: 30px;
} }
.answer { .answer {
text-indent: 40px; text-indent: 40px;
font-size: 28px; font-size: 28px;
...@@ -142,6 +168,7 @@ ...@@ -142,6 +168,7 @@
align-items: center; align-items: center;
padding-left: 40px; padding-left: 40px;
} }
.operation { .operation {
width: 400px; width: 400px;
position: fixed; position: fixed;
...@@ -175,12 +202,14 @@ ...@@ -175,12 +202,14 @@
border-top-right-radius: 40px; border-top-right-radius: 40px;
background: #409eff; background: #409eff;
} }
.operation .item-3 { .operation .item-3 {
border-bottom-left-radius: 40px; border-bottom-left-radius: 40px;
border-top-left-radius: 40px; border-top-left-radius: 40px;
color: #999; color: #999;
border: 2px solid #999; border: 2px solid #999;
} }
.operation .item-4 { .operation .item-4 {
border-bottom-right-radius: 40px; border-bottom-right-radius: 40px;
border-top-right-radius: 40px; border-top-right-radius: 40px;
......
src/views/fastReading/index.vue
...@@ -16,13 +16,13 @@ ...@@ -16,13 +16,13 @@
<div>比赛规则</div> <div>比赛规则</div>
</div> </div>
<div class="explain"> <div class="explain">
1、选手在“国际脑力运动”线上平台报名参加脑力世界杯并选中本项比赛。 1、选手在“摩天轮脑力运动”线上平台报名参加脑力世界杯并选中本项比赛。
</div> </div>
<div class="explain"> <div class="explain">
1. Athlete register Intellectual World Cup on the "International Intellectual Sports" online platform and select this discipline. 1. Athlete register Intellectual World Cup on the "International Intellectual Sports" online platform and select this discipline.
</div> </div>
<div class="explain"> <div class="explain">
2、所有选手在“国际脑力运动”线上平台上点击进入本项目比赛倒计时页面，倒计时归零后立即开始比赛。 2、所有选手在“摩天轮脑力运动”线上平台上点击进入本项目比赛倒计时页面，倒计时归零后立即开始比赛。
</div> </div>
<div class="explain"> <div class="explain">
2. All athletes clicked into the countdown page on the "International Intellectual Sports" 2. All athletes clicked into the countdown page on the "International Intellectual Sports"
...@@ -87,26 +87,49 @@ ...@@ -87,26 +87,49 @@
<div class="explain"> <div class="explain">
3. The highest round score is the final score. 3. The highest round score is the final score.
</div> </div>
<div class="m-selector">
选择模式：
<div v-for="(item, index) in caseConfig" :key="index" :index="index" :item="item">
<div class="item" :class="{active: (level === index)}" @click="changLevel(index)">{{item.level_name}}
</div>
</div>
</div>
<div class="start" @click="start">开始训练</div> <div class="start" @click="start">开始训练</div>
</div> </div>
</template> </template>
<script> <script>
export default { import BaseCasePage from "../../framework/core/baseCasePage";
import CaseUtil from "../../framework/service/base/caseUtil";
export default new BaseCasePage({
name: "index", name: "index",
data() {
return {
level: 0,
}
},
methods: { methods: {
changLevel(level) {
if (level !== this.level) {
this.level = level;
}
},
start() { start() {
this.$router.push({ CaseUtil.goToTrain('/fastReading/readArticle',this);
path: '/fastReading/readArticle'
})
} }
},
mounted() {
} }
} })
</script> </script>
<style scoped> <style scoped>
.content { .content {
padding: 30px 24px 120px; padding: 30px 24px 156px;
} }
.title { .title {
display: flex; display: flex;
......
src/views/fastReading/readArticle.vue
<template> <template>
<div class="content"> <div class="content">
<div class="title">第1轮 <span>{{count_time}}s</span></div> <div class="title">
<div class="article" v-html="content"></div> <div class="circle">第{{article_index+1}}轮</div>
<div class="start" @click="start">阅读完成</div> <div class="limit_time">{{count_time}} s</div>
</div>
<div v-if="articles && articles.length" class="article" v-html="articles[0].content"></div>
<div class="startAnswer" @click="start">阅读完成</div>
</div> </div>
</template> </template>
<script> <script>
import {article} from "../../utils/article"; import BaseTrainPage from "../../framework/core/baseTrainPage";
import {getArticleDetails} from "../../api/article";
import StoreUtil from "../../store/stateStore";
import BaseConstant from "../../store/constants/baseConstant";
export default { export default new BaseTrainPage({
name: "readArticle", name: "readArticle",
data() { data() {
return { return {
content: article[0].text, article_index: 0,
count_time: 900, articles: [],
count_time: 0,
timer: '' timer: ''
} }
}, },
methods: { methods: {
start() { start() {
clearInterval(this.timer);
StoreUtil.stateSave(BaseConstant.BRAIN_TRAIN_TRAIN_INFO_NOW, {
data:{
articles: this.articles,
article_index: this.article_index,
questions: [],
},
result: {
learn_time_end: new Date().getTime()
}
});
this.$router.push({ this.$router.push({
path: '/fastReading/answerQuestion', path: '/fastReading/answerQuestion',
query: { query: {
level: this.level,
id: this.caseAlias,
model_id: this.modelAlias,
time: this.count_time time: this.count_time
} }
}) })
}, },
countDown() { countDown() {
this.timer = setInterval(()=>{ this.timer = setInterval(() => {
if(this.count_time > 0) { if (this.count_time > 0) {
this.count_time = this.count_time - 1; this.count_time = this.count_time - 1;
}else { } else {
clearInterval(this.timer); clearInterval(this.timer);
} }
},1000) }, 1000)
},
init() {
getArticleDetails({
ids: [this.levelConfig.article_ids[0]]
}).then((articles) => {
this.articles = [];
if (articles && articles.data) {
this.articles.push(...articles.data);
this.count_time = this.levelConfig.limit_remember_time;
this.countDown();
// 获取第一篇文章对应的问题
StoreUtil.stateSave(BaseConstant.BRAIN_TRAIN_TRAIN_INFO_NOW, {
result: {
learn_time_start: new Date().getTime()
}
});
} else {
this.$message({
type: 'error',
content: '文章不存在!'
});
}
})
}, },
}, },
mounted() { mounted() {
this.countDown() this.init()
} }
} })
</script> </script>
<style scoped> <style scoped>
.content { .content {
padding: 30px 24px; padding: 30px 24px;
} }
.title { .title {
display: flex;
align-items: center;
}
.circle {
font-size: 30px; font-size: 30px;
color: #333; color: #333;
} }
.limit_time {
width: 100px;
height: 60px;
display: flex;
align-items: center;
justify-content: center;
color: #017af7;
font-size: 28px;
margin-left: auto;
}
.title span { .title span {
color: #409eff; color: #409eff;
margin-left: 20px; margin-left: 20px;
} }
.article { .article {
margin-top: 30px; margin-top: 30px;
margin-bottom: 24px;
} }
.start {
margin: 60px auto ;
width: 500px;
height: 80px;
border-radius: 40px;
font-size: 32px;
background: #409EFF;
color: #fff;
display: flex;
align-items: center;
justify-content: center;
}
</style> </style>
src/views/fastReading/readResult.vue
<template> <template>
<div class="content"> <div class="content">
<div class="title">正向速算答题记录</div> <div class="title">阅读理解答题记录</div>
<div class="data-list"> <div class="data-list">
<div class="data-item" style="width: 1000%">正向速算：<span>得分{{score}}</span></div> <div class="data-item" style="width: 1000%">阅读理解：<span>得分{{result.score}}</span></div>
</div> </div>
<div class="data-list"> <div class="data-list">
<div class="data-item">答题数量：<span>{{number}}</span></div> <div class="data-item">答题数量：<span>{{result.question_numb}}</span></div>
<div class="data-item">正确数量：<span>{{correctNumber}}</span></div> <div class="data-item">正确数量：<span>{{result.right_numb}}</span></div>
<div class="data-item">答题用时：<span>{{900-residue_time}}s</span></div> <div class="data-item">答题用时：<span>{{use_time_desc}}</span></div>
<div class="data-item">剩余时间：<span>{{residue_time}}s</span></div> <div class="data-item">剩余时间：<span>{{result.answer_time_left}}s</span></div>
<div class="data-item">正确率：<span>{{percentage}}%</span></div> <div class="data-item">正确率：<span>{{result.right_rate}}%</span></div>
</div> </div>
<div class="answer">答案对比</div> <div class="answer">答案对比</div>
<div class="answer-list"> <div class="answer-list">
<div class="answer-item" v-for="(item,index) in answerList"> <div class="answer-item" v-for="(item,index) in answerList">
<div class="subject">{{index+1}}、{{item.question}}</div> <div class="subject">{{index+1}}、{{item.question}}</div>
<div class="subject" style="text-indent: 20px">你的答案：<span>{{item.myAnswer}}</span></div> <div v-if="item.check" class="subject subject-success" style="text-indent: 20px">你的答案：{{item.myAnswer}}</div>
<div v-else class="subject subject-error" style="text-indent: 20px">你的答案：{{item.myAnswer}}</div>
<div class="subject" style="text-indent: 20px">正确答案：{{item.correctAnswer}}</div> <div class="subject" style="text-indent: 20px">正确答案：{{item.correctAnswer}}</div>
</div> </div>
</div> </div>
<div class="operation"> <div class="operation">
<div class="item item-1">再来一局</div> <div class="item item-1" @click="again()">再来一局</div>
<div class="item item-2" @click="goback()">返回列表</div> <div class="item item-2" @click="goback()">返回列表</div>
</div> </div>
</div> </div>
</template> </template>
<script> <script>
import StoreUtil from "../../store/stateStore";
import BaseConstant from "../../store/constants/baseConstant";
import {secSimpleText} from "../../framework/util/func";
export default { export default {
name: "readResult", name: "readResult",
data() { data() {
return { return {
score: 0, //分数
number: '100', //答题数量
correctNumber: 0, //正确数量
percentage: 0, //正确率
answerList: [], answerList: [],
residue_time: '', //剩余时间 residue_time: '', //剩余时间
use_time_desc: '',
result: {
score: 0,
question_numb: 0,
right_numb: 0,
right_rate: 0,
learn_time: 0,
learn_left_time: 0,
answer_time: 0,
answer_time_left: 0,
use_time: 0
},
result_detail: {
question: [],
answer: []
}
} }
}, },
methods: { methods: {
goback() { goback() {
StoreUtil.stateSave(BaseConstant.BRAIN_TRAIN_CASE_INFO_NOW_CLEAN);
this.$router.push({ this.$router.push({
path: '/' path: '/'
}) })
},
again() {
let url = '/fastReading/index';
let query = {
id: StoreUtil.getState().train.currentCase.case_id,
model_id: StoreUtil.getState().train.currentCase.model_id
};
StoreUtil.stateSave(BaseConstant.BRAIN_TRAIN_CASE_INFO_NOW_CLEAN);
this.$router.push({
path: url,
query
})
} }
}, },
created() { mounted() {
this.residue_time = this.$route.query.time;
this.answerList = this.$store.state.articleAnswer; let data = StoreUtil.getState().train.currentCase.data;
this.number = this.answerList.length; let result = StoreUtil.getState().train.currentCase.result;
this.answerList.forEach(v=>{ let levelConfig = StoreUtil.getState().train.currentCase.level_config;
if(v.myAnswer == v.correctAnswer) { this.answerList = data.answer;
this.correctNumber = this.correctNumber + 1;
this.result.question_numb = this.answerList.length;
this.result.answer_time = result.answer_time_end - result.learn_time_start;
this.result.answer_time_left = levelConfig.limit_remember_time - this.result.answer_time/1000;
this.use_time_desc = secSimpleText(this.result.answer_time);
for (let i = 0; i < this.answerList.length; i++) {
if (('' + this.answerList[i].correctAnswer) === ('' + this.answerList[i].myAnswer)) {
this.result.right_numb += 1;
this.answerList[i].check = true;
} }
}) }
this.score = this.correctNumber * 19; this.result.right_rate = (this.result.right_numb / this.result.question_numb * 100).toFixed(2);
this.percentage = (this.correctNumber/this.number*100).toFixed(2); this.result.score = this.result.right_numb * 19;
this.result_detail.question = [
{
q: this.answerList,
a: []
}
];
this.result_detail.answer = [];
console.log(this.result, this.result_detail);
} }
} }
</script> </script>
...@@ -115,10 +166,17 @@ ...@@ -115,10 +166,17 @@
.answer-item .subject span { .answer-item .subject span {
color: red; color: red;
} }
.answer-item .subject-error {
color: red;
}
.answer-item .subject-success {
color: blue;
}
.operation { .operation {
width: 400px; width: 400px;
position: fixed; position: fixed;
bottom: 120px; bottom: 24px;
display: flex; display: flex;
left: 50%; left: 50%;
transform: translateX(-50%); transform: translateX(-50%);
......
src/views/forward/forwardResult.vue
...@@ -2,43 +2,58 @@ ...@@ -2,43 +2,58 @@
<div class="content"> <div class="content">
<div class="title">正向速算答题记录</div> <div class="title">正向速算答题记录</div>
<div class="data-list"> <div class="data-list">
<div class="data-item" style="width: 1000%">正向速算：<span>得分{{score}}</span></div> <div class="data-item" style="width: 1000%">正向速算：<span>得分{{result.score}}</span></div>
</div> </div>
<div class="data-list"> <div class="data-list">
<div class="data-item">答题数量：<span>{{number}}</span></div> <div class="data-item">答题数量：<span>{{result.question_numb}}</span></div>
<div class="data-item">正确数量：<span>{{correctNumber}}</span></div> <div class="data-item">正确数量：<span>{{result.right_numb}}</span></div>
<div class="data-item">答题用时：<span>{{540-residue_time}}s</span></div> <div class="data-item">答题用时：<span>{{use_time_desc}}</span></div>
<div class="data-item">剩余时间：<span>{{residue_time}}s</span></div> <div class="data-item">剩余时间：<span>{{result.answer_time_left}}s</span></div>
<div class="data-item">正确率：<span>{{percentage}}%</span></div> <div class="data-item">正确率：<span>{{result.right_rate}}%</span></div>
</div> </div>
<div class="answer">答案对比</div> <div class="answer">答案对比</div>
<div class="answer-list"> <div class="answer-list">
<div class="answer-item" v-for="(item,index) in answerList"> <div class="answer-item" v-for="(item,index) in answerList">
<div class="subject">{{index+1}}、{{item.subject}}</div> <div class="subject">{{index+1}}、{{item.subject}}</div>
<div class="subject" style="text-indent: 20px">你的答案：<span>{{item.myAnswer}}</span></div> <div v-if="item.check" class="subject subject-success" style="text-indent: 20px">你的答案：{{item.myAnswer}}</div>
<div v-else class="subject subject-error" style="text-indent: 20px">你的答案：{{item.myAnswer}}</div>
<div class="subject" style="text-indent: 20px">正确答案：{{item.correctAnswer}}</div> <div class="subject" style="text-indent: 20px">正确答案：{{item.correctAnswer}}</div>
</div> </div>
</div> </div>
<div class="operation"> <div class="operation">
<div class="item item-1">再来一局</div> <div class="item item-1" @click="again()">再来一局</div>
<div class="item item-2" @click="goback()">返回列表</div> <div class="item item-2" @click="goback()">返回列表</div>
</div> </div>
</div> </div>
</template> </template>
<script> <script>
import StoreUtil from "../../store/stateStore";
import BaseConstant from "../../store/constants/baseConstant";
import {secSimpleText} from "../../framework/util/func";
export default { export default {
name: "forwardResult", name: "forwardResult",
data() { data() {
return { return {
score: 0, //分数
number: '100', //答题数量
correctNumber: 0, //正确数量
percentage: 0, //正确率
answerList: [], answerList: [],
residue_time: '', //剩余时间 use_time_desc: '',
result: {
score: 0,
question_numb: 0,
right_numb: 0,
right_rate: 0,
learn_time: 0,
learn_left_time: 0,
answer_time: 0,
answer_time_left: 0,
use_time: 0
},
result_detail: {
question: [],
answer: []
}
} }
}, },
methods: { methods: {
...@@ -46,19 +61,54 @@ ...@@ -46,19 +61,54 @@
this.$router.push({ this.$router.push({
path: '/' path: '/'
}) })
},
again() {
let url = '/forward/index';
let query = {
id: StoreUtil.getState().train.currentCase.case_id,
model_id: StoreUtil.getState().train.currentCase.model_id,
};
console.log(this.type, '-type-');
StoreUtil.stateSave(BaseConstant.BRAIN_TRAIN_CASE_INFO_NOW_CLEAN);
this.$router.push({
path: url,
query
})
} }
}, },
created() { created() {
this.residue_time = this.$route.query.time; this.answerList = [];
this.answerList = this.$store.state.forwardAnswer; let data = StoreUtil.getState().train.currentCase.data;
let result = StoreUtil.getState().train.currentCase.result;
let levelConfig = StoreUtil.getState().train.currentCase.level_config;
this.answerList = data.answerList;
this.number = this.answerList.length; this.number = this.answerList.length;
this.answerList.forEach(v=>{
if(v.myAnswer == v.correctAnswer) { this.result.question_numb = this.answerList.length;
this.correctNumber = this.correctNumber + 1; this.result.answer_time = result.answer_time_end - result.answer_time_start;
this.result.answer_time_left = levelConfig.limit_remember_time - this.result.answer_time/1000;
this.use_time_desc = secSimpleText(this.result.answer_time);
for (let i = 0; i < this.answerList.length; i++) {
if (('' + this.answerList[i].correctAnswer) === ('' + this.answerList[i].myAnswer)) {
this.result.right_numb += 1;
this.answerList[i].check = true;
}
}
this.result.right_rate = (this.result.right_numb / this.result.question_numb * 100).toFixed(2);
this.result.score = this.result.right_numb * 19;
this.result_detail.question = [
{
q: this.answerList,
a: []
} }
}) ];
this.score = this.correctNumber * 19; this.result_detail.answer = [];
this.percentage = (this.correctNumber/this.number*100).toFixed(2);
console.log(this.result, this.result_detail);
} }
} }
</script> </script>
...@@ -67,6 +117,7 @@ ...@@ -67,6 +117,7 @@
.content { .content {
padding: 30px 24px 200px; padding: 30px 24px 200px;
} }
.title { .title {
width: 100%; width: 100%;
display: flex; display: flex;
...@@ -76,6 +127,7 @@ ...@@ -76,6 +127,7 @@
color: #000; color: #000;
margin-bottom: 20px; margin-bottom: 20px;
} }
.data-list { .data-list {
display: flex; display: flex;
flex-wrap: wrap; flex-wrap: wrap;
...@@ -91,6 +143,7 @@ ...@@ -91,6 +143,7 @@
.data-item span { .data-item span {
color: #1f72ff; color: #1f72ff;
} }
.answer { .answer {
background: #409eff; background: #409eff;
width: 150px; width: 150px;
...@@ -104,21 +157,31 @@ ...@@ -104,21 +157,31 @@
margin-bottom: 15px; margin-bottom: 15px;
border-radius: 8px; border-radius: 8px;
} }
.answer-list { .answer-list {
} }
.answer-item .subject {
.answer-item .subject {
margin-bottom: 10px; margin-bottom: 10px;
font-size: 28px; font-size: 28px;
color: #333; color: #333;
} }
.answer-item .subject span {
.answer-item .subject span {
color: red;
}
.answer-item .subject-error {
color: red; color: red;
} }
.answer-item .subject-success {
color: blue;
}
.operation { .operation {
width: 400px; width: 400px;
position: fixed; position: fixed;
bottom: 120px; bottom: 24px;
display: flex; display: flex;
left: 50%; left: 50%;
transform: translateX(-50%); transform: translateX(-50%);
......
src/views/forward/index.vue
...@@ -16,13 +16,13 @@ ...@@ -16,13 +16,13 @@
<div>比赛规则</div> <div>比赛规则</div>
</div> </div>
<div class="explain"> <div class="explain">
1、选手在“国际脑力运动”线上平台报名参加脑力世界杯并选中本项比赛。 1、选手在“摩天轮脑力运动”线上平台报名参加脑力世界杯并选中本项比赛。
</div> </div>
<div class="explain"> <div class="explain">
1. Athlete register Intellectual World Cup on the "International Intellectual Sports" online platform and select this discipline. 1. Athlete register Intellectual World Cup on the "International Intellectual Sports" online platform and select this discipline.
</div> </div>
<div class="explain"> <div class="explain">
2、所有选手在“国际脑力运动”线上平台上点击进入本项目比赛倒计时页面，倒计时归零后立即开始比赛。 2、所有选手在“摩天轮脑力运动”线上平台上点击进入本项目比赛倒计时页面，倒计时归零后立即开始比赛。
</div> </div>
<div class="explain"> <div class="explain">
2. All athletes clicked into the countdown page on the "International Intellectual Sports" online platform, 2. All athletes clicked into the countdown page on the "International Intellectual Sports" online platform,
...@@ -79,26 +79,47 @@ ...@@ -79,26 +79,47 @@
2. The highest round score is the final score. 2. The highest round score is the final score.
</div> </div>
<div class="m-selector">
选择模式：
<div v-for="(item, index) in caseConfig" :key="index" :index="index" :item="item">
<div class="item" :class="{active: (level === index)}" @click="changLevel(index)">{{item.level_name}}
</div>
</div>
</div>
<div class="start" @click="start">开始训练</div> <div class="start" @click="start">开始训练</div>
</div> </div>
</template> </template>
<script> <script>
export default { import BaseCasePage from "../../framework/core/baseCasePage";
import CaseUtil from "../../framework/service/base/caseUtil";
export default new BaseCasePage({
name: "index", name: "index",
data() {
return {
level: 0,
}
},
methods: { methods: {
changLevel(level) {
if (level !== this.level) {
this.level = level;
}
},
start() { start() {
this.$router.push({ CaseUtil.goToTrain('/forward/forwardAnswer',this);
path: '/forward/forwardAnswer'
})
} }
},
mounted() {
} }
} })
</script> </script>
<style scoped> <style scoped>
.content { .content {
padding: 30px 24px 120px; padding: 30px 24px 156px;
} }
.title { .title {
display: flex; display: flex;
......
src/views/home/components/Question.vue deleted 100644 → 0
<template>
<div class='question-box'>
<div class="title">常见问题</div>
<div class="list">
<div class="item" v-for="(item,index) in questionList" :key="index" @click.stop="toggleExpandArticle(index)">
<div class="hd">
<div class="text">{{ item.name }}</div>
<img class="icon-arrow" src="../../../assets/images/arrow-down.png" v-if="item.is_expand" >
<img class="icon-arrow" src="../../../assets/images/arrow-right.png" v-else>
</div>
<div class="article-box" v-if="item.item_list.length && item.is_expand">
<a :href="`/display/${target.category_id}/details/${target.id}`" class="article" v-for="(target,idx) in item.item_list" :key="target.id">· {{ target.title }}</a>
</div>
</div>
</div>
</div>
</template>
<script>
import { mapGetters } from 'vuex'
export default{
computed : {
...mapGetters({
questionList : 'getQuestionList'
})
},
methods : {
toggleExpandArticle(index){
this.questionList[index].is_expand = !this.questionList[index].is_expand;
this.$store.commit('insertQuestionList', this.questionList )
}
}
}
</script>
<style scoped lang="less">
.question-box{
padding: 30px 24px 0;
}
.title{
position: relative;
font-size: 30px;/*px*/
color: #999;
text-align: center;
&:after,&:before{
content: '';
display: block;
position: absolute;
top: 50%;
width: 40%;
border-bottom: 1px solid #E8E8E8; /*no*/
transform: translateY(-50%);
}
&:before{
left: 0;
}
&:after{
right: 0;
}
}
.item{
position: relative;
padding-top: 30px;
padding-bottom: 30px;
.hd{
display: flex;
align-items: center;
justify-content: space-between;
.text{
font-size: 34px;/*px*/
color: #111111;
font-weight:500;
}
.icon-arrow{
width: 30px;
height: 30px;
}
}
.article-box{
padding-top: 10px;
.article{
display: block;
margin: 10px 0;
color: #3091FE;
}
}
&:after{
content: '';
display: block;
position: absolute;
height: 1px;/*no*/
background-color: #E8E8E8;
left: -30px;
right: -30px;
bottom: 0;
}
}
</style>
\ No newline at end of file
src/views/home/components/Special.vue deleted 100644 → 0
<template>
<div class='special-box'>
<div class="title">热门专题</div>
<div class="list">
<a :href="item.link" class="item" v-for="(item,index) in specialList">
<img class="icon" :src="item.picture" :title="item.name">
<h2>{{ item.name }}</h2>
</a>
</div>
</div>
</template>
<script>
import { mapGetters } from 'vuex'
export default{
computed : {
...mapGetters({
specialList : 'getSpecialList'
})
},
methods : {
}
}
</script>
<style scoped lang="less">
.special-box{
padding: 30px 24px 0;
}
.title{
position: relative;
font-size: 30px;/*px*/
color: #999;
text-align: center;
&:after,&:before{
content: '';
display: block;
position: absolute;
top: 50%;
width: 40%;
border-bottom: 1px solid #E8E8E8; /*no*/
transform: translateY(-50%);
}
&:before{
left: 0;
}
&:after{
right: 0;
}
}
.list{
padding: 30px 24px 0;
overflow: hidden;
}
.item{
float: left;
text-align: center;
width: 25%;
margin-bottom: 30px;
.icon{
width: 90px;
height: 90px;
margin: 0 auto;
}
h2{
margin-top: 10px;
font-size: 30px;/*px*/
color: #666;
}
}
</style>
\ No newline at end of file
src/views/home/index.vue
...@@ -27,25 +27,24 @@ ...@@ -27,25 +27,24 @@
data() { data() {
return { return {
memory: [ memory: [
{ {
label: '国学经典', label: '国学经典',
path: '/studiesChnia/index' path: '/studiesChina/index?id=1&model_id=1'
}, },
{ {
label: '随机数字', label: '随机数字',
path: '/randomNumber/index' path: '/randomNumber/index?id=4&model_id=2'
}, },
{ {
label: '随机字母', label: '英语速记',
path: '/randomLetter/index' path: '/randomLetter/index?id=5&model_id=3'
}, },
{ {
label: '圆周率', label: '圆周率',
path: '/pi/index' path: '/pi/index?id=6&model_id=4'
}, },
{ {
label: '活力大脑对应', label: '活力大脑',
path: '/randomLetter/index' path: '/randomLetter/index'
}, },
{ {
...@@ -56,17 +55,17 @@ ...@@ -56,17 +55,17 @@
speed: [ speed: [
{ {
label: '原点凝视', label: '原点凝视',
path: '/stareOrigin/index' path: '/stareOrigin/index?id=7&model_id=6'
}, },
{ {
label: '之字运动', label: '之字运动',
path: '/zhiExercise/index' path: '/zhiExercise/index?id=8&model_id=7'
}, },
], ],
heartCount: [ heartCount: [
{ {
label: '正向训练', label: '正向训练',
path: '/forward/index' path: '/forward/index?id=9&model_id=8'
}, },
{ {
label: '逆向训练', label: '逆向训练',
...@@ -74,7 +73,7 @@ ...@@ -74,7 +73,7 @@
}, },
{ {
label: '阅读理解', label: '阅读理解',
path: '/fastReading/index' path: '/fastReading/index?id=10&model_id=5'
}, },
] ]
} }
......
src/views/home/result.vue
<template> <template>
<div class="content"> <div class="content">
<div class="title" v-if="type == 1">随机数字</div> <div class="title" v-if="type == 1">随机数字</div>
<div class="title" v-if="type == 2">随机字母</div> <div class="title" v-if="type == 2">英语速记</div>
<div class="title" v-if="type == 3">圆周率</div> <div class="title" v-if="type == 3">圆周率</div>
<div class="data-list"> <div class="data-list">
<div class="data-item">答题数量：<span>{{number}}</span></div> <div class="data-item">答题数量：<span>{{result.question_numb}}</span></div>
<div class="data-item">正确数量：<span>{{correctNumber}}</span></div> <div class="data-item">正确数量：<span>{{result.right_numb}}</span></div>
<div class="data-item">正确率：<span>{{percentage}}%</span></div> <div class="data-item">正确率：<span>{{result.right_rate}}%</span></div>
<div class="data-item">用时：<span>0分4秒98</span></div> <div class="data-item">用时：<span>{{use_time_desc}}</span></div>
</div> </div>
<div class="answer">你的答案</div> <div class="answer">你的答案</div>
<div class="list"> <div class="list">
<div class="item" v-for="(item,index) in myAnswer"> <div class="item" v-for="(item,index) in myAnswer">
<div class="data-1">{{item.txt}}</div> <div v-if="item.check" class="data-2">{{item.txt}}</div>
<div v-else class="data-1">{{item.txt}}</div>
</div> </div>
</div> </div>
<div class="answer">正确答案</div> <div class="answer">正确答案</div>
...@@ -29,53 +30,105 @@ ...@@ -29,53 +30,105 @@
</template> </template>
<script> <script>
import StoreUtil from "../../store/stateStore";
import {secSimpleText} from "../../framework/util/func";
import BaseConstant from "../../store/constants/baseConstant";
export default { export default {
name: "result", name: "result",
data() { data() {
return { return {
answer: 100,
myAnswer: [], myAnswer: [],
correctAnswer: [], correctAnswer: [],
number: 0,
correctNumber: 0,
percentage: 0,
type: 1, //1随机数字 2随机字母 3圆周率 type: 1, //1随机数字 2随机字母 3圆周率
use_time_desc: '',
result: {
score: 0,
question_numb: 0,
right_numb: 0,
right_rate: 0,
learn_time: 0,
learn_left_time: 0,
answer_time: 0,
answer_time_left: 0,
use_time: 0
},
result_detail: {
question: [],
answer: []
}
} }
}, },
methods: { methods: {
goback() { goback() {
StoreUtil.stateSave(BaseConstant.BRAIN_TRAIN_CASE_INFO_NOW_CLEAN);
this.$router.push({ this.$router.push({
path: '/' path: '/'
}) })
}, },
again() { again() {
let url = ''; let url = '';
if(this.type == 1) { let query = {
id: StoreUtil.getState().train.currentCase.case_id,
model_id: StoreUtil.getState().train.currentCase.model_id
};
console.log(this.type, '-type-');
if (this.type == 1) {
url = '/randomNumber/index'; url = '/randomNumber/index';
}else if(this.type == 2) { } else if (this.type == 2) {
url = '/randomLetter/index' url = '/randomLetter/index'
}else { } else {
url = '/pi/index' url = '/pi/index'
} }
StoreUtil.stateSave(BaseConstant.BRAIN_TRAIN_CASE_INFO_NOW_CLEAN);
this.$router.push({ this.$router.push({
path: url path: url,
query
}) })
} }
}, },
mounted() { mounted() {
if(this.$route.query&&this.$route.query.number) { this.type = this.$route.query.type;
this.correctNumber = this.$route.query.correctNumber;
this.number = this.$route.query.number; let data = StoreUtil.getState().train.currentCase.data;
this.type = this.$route.query.type; let result = StoreUtil.getState().train.currentCase.result;
if(this.type == 1 || this.type == 3) { let levelConfig = StoreUtil.getState().train.currentCase.level_config;
this.myAnswer = this.$store.state.myNumberAnswer; this.correctAnswer = data.correctAnswer;
this.correctAnswer = this.$store.state.randomNumber; this.myAnswer = data.answer;
}else if(this.type==2) { this.number = this.correctAnswer.length;
this.myAnswer = this.$store.state.myLetterAnswer;
this.correctAnswer = this.$store.state.randomLetter; this.result.question_numb = this.correctAnswer.length;
this.result.learn_time = result.learn_time_end - result.learn_time_start;
this.result.learn_left_time = levelConfig.limit_remember_time - this.result.learn_time;
this.result.answer_time = result.answer_time_end - result.answer_time_start;
this.result.use_time = result.answer_time_end - result.learn_time_start;
this.use_time_desc = secSimpleText(this.result.use_time);
for (let i = 0; i < this.correctAnswer.length; i++) {
if ((''+this.correctAnswer[i].num) === (''+this.myAnswer[i].txt)) {
this.result.right_numb += 1;
this.myAnswer[i].check = true;
} }
this.percentage = (this.correctNumber/this.number*100).toFixed(2);
} }
this.result.right_rate = (this.result.right_numb / this.result.question_numb * 100).toFixed(2);
this.result_detail.question = [
{
q: StoreUtil.getState().train.currentCase.result_detail.q,
a: this.correctAnswer
}
];
this.result_detail.answer = [
{
a: this.myAnswer,
check_result: 0
}
];
console.log(this.result, this.result_detail);
} }
} }
</script> </script>
...@@ -134,6 +187,7 @@ ...@@ -134,6 +187,7 @@
align-items: center; align-items: center;
justify-content: center; justify-content: center;
} }
.list .item .data-1 { .list .item .data-1 {
width: 90%; width: 90%;
height: 100%; height: 100%;
...@@ -142,6 +196,7 @@ ...@@ -142,6 +196,7 @@
align-items: center; align-items: center;
justify-content: center; justify-content: center;
} }
.list .item .data-2 { .list .item .data-2 {
width: 90%; width: 90%;
height: 100%; height: 100%;
...@@ -150,10 +205,11 @@ ...@@ -150,10 +205,11 @@
align-items: center; align-items: center;
justify-content: center; justify-content: center;
} }
.operation { .operation {
width: 400px; width: 400px;
position: fixed; position: fixed;
bottom: 120px; bottom: 24px;
display: flex; display: flex;
left: 50%; left: 50%;
transform: translateX(-50%); transform: translateX(-50%);
......
src/views/layout/Layout.vue
<template> <template>
<div class='app-wrapper'> <div class='app-wrapper'>
<!-- <app-nav></app-nav>-->
<router-view/> <router-view/>
<!-- <app-footer></app-footer>-->
<!-- <Form/>-->
<!-- <Drawer/>-->
</div> </div>
</template> </template>
<script> <script>
import AppNav from './components/AppNav.vue'
import AppFooter from './components/AppFooter.vue'
import Form from '../../components/Form'
import Drawer from '../../components/Drawer'
export default { export default {
components: { components: {
AppNav,
AppFooter,
Form,
Drawer
} }
} }
</script> </script>
......
src/views/layout/components/AppFooter.vue deleted 100644 → 0
<template>
<div class='ft-btn' @click.stop="toggleFormStatus( { flag : true })">开店咨询</div>
</template>
<script>
import { mapMutations } from 'vuex'
export default{
methods : {
...mapMutations([
'toggleFormStatus'
])
}
}
</script>
<style scoped lang="less">
.ft-btn{
position: fixed;
left: 0;
right: 0;
bottom: 0;
font-size: 32px; /*px*/
color: #fff;
padding: 25px 30px;
text-align: center;
background-color: #3091FE;
}
</style>
\ No newline at end of file
src/views/layout/components/AppNav.vue deleted 100644 → 0
<template>
<div class='app-nav'>
<img class="app-logo" src="http://static.ledouya.com/Flu7n1DcDv45J4qNSj9snKHmdTs2" @click="handleBack">
<img class="icon-group" src="../../../assets/images/icon-group.png" @click="toggleDrawerStatus">
</div>
</template>
<script>
import { mapMutations } from 'vuex'
export default{
methods : {
...mapMutations([
'toggleDrawerStatus'
]),
handleBack(){
this.$router.push({
path : '/'
})
}
}
}
</script>
<style scoped lang="less">
.app-nav{
position: fixed;
top: 0;
left: 0;
right: 0;
padding: 30px 24px;
display: flex;
align-items: center;
justify-content: space-between;
background-color: #fff;
z-index: 5;
}
.app-logo{
width: 280px;
height: 70px;
}
.icon-group{
width: 70px;
height: 70px;
}
</style>
\ No newline at end of file
src/views/pi/answerPi.vue
...@@ -12,7 +12,9 @@ ...@@ -12,7 +12,9 @@
<div class="answer-list"> <div class="answer-list">
<div class="item" v-for="(item,index) in answer"> <div class="item" v-for="(item,index) in answer">
<div class="data" :style="{background: item.focus?'#409eff':''}" @click="changeFocus(index)">{{item.txt}}</div> <div class="data" :style="{background: (index==focus)?'#409eff':''}" @click="changeFocus(index)">
{{item.txt}}
</div>
</div> </div>
</div> </div>
...@@ -26,14 +28,18 @@ ...@@ -26,14 +28,18 @@
<div class="item" @click="input(7)">7</div> <div class="item" @click="input(7)">7</div>
<div class="item" @click="input(8)">8</div> <div class="item" @click="input(8)">8</div>
<div class="item" @click="input(9)">9</div> <div class="item" @click="input(9)">9</div>
<div class="item delete">删除</div> <div class="item delete" @click="del">删除</div>
<div class="item zero" @click="input(0)">0</div> <div class="item zero" @click="input(0)">0</div>
</div> </div>
</div> </div>
</template> </template>
<script> <script>
export default { import StoreUtil from "../../store/stateStore";
import BaseConstant from "../../store/constants/baseConstant";
import BaseTrainPage from "../../framework/core/baseTrainPage";
export default new BaseTrainPage({
name: "answerPi", name: "answerPi",
data() { data() {
return { return {
...@@ -41,74 +47,91 @@ ...@@ -41,74 +47,91 @@
answer: [], answer: [],
focus: 0, focus: 0,
correctAnswer: [], correctAnswer: [],
correctNumber: 0
} }
}, },
methods:{ methods: {
//提交 //提交
submit() { submit() {
this.answer.forEach((v,i)=>{ let answer_time_end = new Date().getTime();
if(v.txt === this.correctAnswer[i].num) { StoreUtil.stateSave(BaseConstant.BRAIN_TRAIN_TRAIN_INFO_NOW, {
this.correctNumber = this.correctNumber + 1; data: {
answer: this.answer,
correctAnswer: this.correctAnswer
},
result: {
answer_time_end: answer_time_end,
} }
}) });
this.$store.state.myNumberAnswer = this.answer;
this.$router.push({ this.$router.push({
path: '/home/result', path: '/home/result',
query: { query: {
number: this.answerLength, type: 3,
correctNumber: this.correctNumber, level: this.level,
type: 3 id: this.caseAlias,
model_id: this.modelAlias
} }
}) });
}, },
//前插一位 //前插一位
pre() { pre() {
this.answer[this.focus].focus = false; this.answer.splice(this.focus, 0, {
this.answer.splice(this.focus,0,{
txt: '', txt: '',
focus: false, });
}) this.focus = this.focus;
this.answer[this.focus].focus = true;
this.answer.length = this.answerLength; this.answer.length = this.answerLength;
}, },
//后插一位 //后插一位
next(){ next() {
this.answer.splice(this.focus+1,0,{ this.answer.splice(this.focus + 1, 0, {
txt: '', txt: '',
focus: false, });
}) this.focus = this.focus + 1;
this.answer.length = this.answerLength; this.answer.length = this.answerLength;
}, },
//点击改变焦点 //点击改变焦点
changeFocus(i){ changeFocus(i) {
this.answer[this.focus].focus = false;
this.answer[i].focus = true; this.answer[i].focus = true;
this.focus = i; this.focus = i;
}, },
input(val) { input(val) {
this.answer[this.focus].txt = val; this.answer[this.focus].txt = val;
if(this.focus < this.answer.length-1) { if (this.focus < this.answer.length - 1) {
this.answer[this.focus].focus = false; this.focus++;
this.focus ++ ;
this.answer[this.focus].focus = true;
} }
},
} del() {
if (this.answer[this.focus].txt == '') {//当前无值，则进1删除
let oldFocusItem = this.focus;
this.focus = (oldFocusItem > 0) ? (oldFocusItem - 1) : 0;
this.answer[this.focus].txt = '';
} else {
this.answer[this.focus].txt = '';
}
},
}, },
mounted() { mounted() {
this.correctAnswer = this.$store.state.randomNumber; this.correctAnswer = JSON.parse(JSON.stringify(StoreUtil.getState().train.currentCase.data.randomNumber));
if(this.$route.query&&this.$route.query.number) { this.answerLength = this.correctAnswer.length;
this.answerLength = this.$route.query.number; let q = [];
for(let i=0; i< this.answerLength; i++) { this.answer = [];
this.answer.push({ for (let i = 0; i < this.answerLength; i++) {
txt: '', this.answer.push({
focus: i == 0 ? true : false, txt: '',
}) focus: i === 0,
} check: false,
});
q.push(this.correctAnswer[i].num);
} }
StoreUtil.stateSave(BaseConstant.BRAIN_TRAIN_TRAIN_INFO_NOW, {
result: {
answer_time_start: new Date().getTime()
},
result_detail: {
q: q.join(',')
}
});
} }
} })
</script> </script>
<style scoped> <style scoped>
...@@ -165,6 +188,7 @@ ...@@ -165,6 +188,7 @@
align-items: center; align-items: center;
flex-wrap: wrap; flex-wrap: wrap;
} }
.answer-list .item { .answer-list .item {
width: 5%; width: 5%;
height: 50px; height: 50px;
...@@ -172,6 +196,7 @@ ...@@ -172,6 +196,7 @@
align-items: center; align-items: center;
justify-content: center; justify-content: center;
} }
.answer-list .item .data { .answer-list .item .data {
width: 90%; width: 90%;
height: 100%; height: 100%;
...@@ -180,6 +205,7 @@ ...@@ -180,6 +205,7 @@
align-items: center; align-items: center;
justify-content: center; justify-content: center;
} }
.btn-list { .btn-list {
display: flex; display: flex;
align-items: center; align-items: center;
......
src/views/pi/index.vue
<template> <template>
<div class="content"> <div class="content">
<div class="line-style"> <div class="title">圆周率训练</div>
<div class="label">圆周率</div> <div class="m-selector">
</div> <div v-for="(item, index) in caseConfig" :key="index" :index="index" :item="item">
<div class="line-style"> <div class="item" :class="{active: (level === index)}" @click="changLevel(index)">{{item.level_name}}
<div class="label" style="margin-top: 6px">划辅助线</div> </div>
<div class="list">
<div class="item" :class="{active: checked == 0}" @click="change(0)">不划</div>
<div class="item" :class="{active: checked == 2}" @click="change(2)">2</div>
<div class="item" :class="{active: checked == 3}" @click="change(3)">3</div>
<div class="item" :class="{active: checked == 4}" @click="change(4)">4</div>
<div class="item" :class="{active: checked == 5}" @click="change(5)">5</div>
<div class="item" :class="{active: checked == 8}" @click="change(8)">8</div>
</div>
</div>
<div class="number-list">
<div class="number-data" v-for="(item,index) in numberList">
<div class="number-item" :key="index" :style="{borderRightColor: item.border?'#666':''}">{{item.num}}</div>
</div> </div>
</div> </div>
<el-button type="primary" class="start" @click="start">开始训练</el-button>
<div class="start" @click="accomplish">记忆完成</div>
</div> </div>
</template> </template>
<script> <script>
import {pi} from '@/utils/pi' import BaseCasePage from "../../framework/core/baseCasePage";
export default { import CaseUtil from "../../framework/service/base/caseUtil";
export default new BaseCasePage({
name: "index", name: "index",
data() { data() {
return { return {
checked: 0, level: 0,
number: 0,
numberList: []
} }
}, },
methods: { methods: {
change(val) { changLevel(level) {
if(this.checked == val) return; if (level !== this.level) {
this.checked = val; this.level = level;
this.numberList.forEach(v=>{
v.border = false
})
if(this.checked != 0) {
this.numberList.forEach((vv,ii)=>{
if((ii+1)%val == 0) {
vv.border = true;
}
})
} }
}, },
accomplish() { start() {
this.$router.push({ CaseUtil.goToTrain('/pi/preLearn',this);
path: '/pi/answerPi',
query: {
number: 200
}
})
} }
}, },
mounted() { mounted() {
this.numberList = pi;
this.numberList.forEach(v=>{
v.border = false
})
this.$store.state.randomNumber = this.numberList;
} }
} })
</script> </script>
<style scoped> <style scoped>
.content { .content {
padding: 30px 24px;
}
.line-style {
display: flex;
/*align-items: center;*/
margin-top: 20px;
}
.line-style .label {
font-size: 30px;
color: #333;
width: 150px;
}
.line-style .list {
display: flex; display: flex;
flex-direction: column;
padding-top: 48px;
align-items: center; align-items: center;
flex-wrap: wrap;
} }
.line-style .item {
height: 60px; .title {
display: flex; color: #1685ff;
align-items: center; font-size: 34px;
justify-content: center; font-weight: bold;
border: 2px solid #666; margin-bottom: 50px;
border-radius: 8px;
margin-left: 20px;
padding: 0 24px;
margin-bottom: 20px;
}
.line-style .active {
color: #fff;
background: #409eff;
border-color: #409eff;
}
.number-list {
display: flex;
flex-wrap: wrap;
/*margin-top: 20px;*/
}
.number-data {
width: 5%;
display: flex;
align-items: center;
justify-content: center;
}
.number-item {
width: 90%;
height: 50px;
display: flex;
align-items: center;
justify-content: center;
border-right: 2px solid transparent;
} }
.start { .start {
margin: 60px auto ; margin-top: 60px;
width: 500px; width: 500px;
height: 80px; height: 80px;
border-radius: 40px; border-radius: 40px;
font-size: 32px; font-size: 32px;
background: #409EFF;
color: #fff;
display: flex;
align-items: center;
justify-content: center;
} }
</style> </style>
src/views/pi/preLearn.vue 0 → 100644
<template>
<div class="content">
<div class="title">
<div class="circle">圆周率训练</div>
<div class="limit_time">{{count_time}} s</div>
</div>
<div class="line-style">
<div class="label" style="margin-top: 6px">划辅助线</div>
<div class="list">
<div class="item" :class="{active: checked == 0}" @click="change(0)">不划</div>
<div class="item" :class="{active: checked == 2}" @click="change(2)">2</div>
<div class="item" :class="{active: checked == 4}" @click="change(4)">4</div>
<div class="item" :class="{active: checked == 6}" @click="change(6)">6</div>
<div class="item" :class="{active: checked == 8}" @click="change(8)">8</div>
</div>
</div>
<div class="number-list">
<div class="number-data" v-for="(item,index) in numberList">
<div class="number-item" :key="index" :style="{borderRightColor: item.border?'#666':''}">{{item.num}}
</div>
</div>
</div>
<div class="start" @click="start">记忆完成</div>
</div>
</template>
<script>
import {getPi} from "../../utils/pi";
import BaseTrainPage from "../../framework/core/baseTrainPage";
import StoreUtil from "../../store/stateStore";
import BaseConstant from "../../store/constants/baseConstant";
export default new BaseTrainPage({
name: "preLearn",
data() {
return {
checked: 0,
count_time:0,
numberList: []
}
},
methods: {
countDown(down=true) {
this.timer = setInterval(() => {
if(down){
if (this.count_time > 0) {
this.count_time = this.count_time - 1;
console.log(this.count_time)
} else {
clearInterval(this.timer);
this.start();
}
}else{
this.count_time = this.count_time + 1;
}
}, 1000)
},
change(val) {
if (this.checked == val) return;
this.checked = val;
this.numberList.forEach(v => {
v.border = false
})
if (this.checked != 0) {
this.numberList.forEach((vv, ii) => {
if ((ii + 1) % val == 0) {
vv.border = true;
}
})
}
},
init() {
this.numberList = [];
let numb_start = this.levelConfig.numb_start;
let numb_end = this.levelConfig.numb_end;
let array = getPi(true, numb_start-1, numb_end);
for (let i = 0, len = array.length; i < len; i++) {
this.numberList.push({
num: array[i],
border: false
})
}
this.count_time = parseInt(this.levelConfig.limit_remember_time);
this.countDown(false);
StoreUtil.stateSave(BaseConstant.BRAIN_TRAIN_TRAIN_INFO_NOW, {
data: {
randomNumber: this.numberList,
},
result: {
learn_time_start: new Date().getTime()
}
});
},
start() {
clearInterval(this.timer);
StoreUtil.stateSave(BaseConstant.BRAIN_TRAIN_TRAIN_INFO_NOW, {
result: {
learn_time_end: new Date().getTime()
}
});
this.$router.push({
path: '/pi/answerPi',
query: {
level: this.level,
id: this.caseAlias,
model_id: this.modelAlias
}
});
}
},
mounted() {
this.init();
},
activated() {
console.log('activated')
},
deactivated() {
clearInterval(this.timer);
console.log('deactivated')
},
destroyed() {
clearInterval(this.timer);
console.log('destroyed')
}
})
</script>
<style scoped>
.content {
padding: 30px 24px;
}
.title {
display: flex;
align-items: center;
}
.circle {
font-size: 30px;
color: #333;
}
.limit_time {
width: 100px;
height: 60px;
display: flex;
align-items: center;
justify-content: center;
color: #017af7;
font-size: 28px;
margin-left: auto;
}
.line-style {
display: flex;
/*align-items: center;*/
margin-top: 20px;
}
.line-style .label {
font-size: 30px;
color: #333;
width: 150px;
}
.line-style .list {
display: flex;
align-items: center;
flex-wrap: wrap;
}
.line-style .item {
height: 60px;
display: flex;
align-items: center;
justify-content: center;
border: 2px solid #666;
border-radius: 8px;
margin-left: 20px;
padding: 0 24px;
margin-bottom: 20px;
}
.line-style .active {
color: #fff;
background: #409eff;
border-color: #409eff;
}
.number-list {
display: flex;
flex-wrap: wrap;
/*margin-top: 20px;*/
}
.number-data {
width: 5%;
display: flex;
align-items: center;
justify-content: center;
}
.number-item {
width: 90%;
height: 50px;
display: flex;
align-items: center;
justify-content: center;
border-right: 2px solid transparent;
}
.start {
margin: 60px auto;
width: 500px;
height: 80px;
border-radius: 40px;
font-size: 32px;
background: #409EFF;
color: #fff;
display: flex;
align-items: center;
justify-content: center;
}
</style>
src/views/randomLetter/answerLetter.vue
<template> <template>
<div class="content"> <div class="content">
<div class="title"> <div class="title">
<div>随机数字</div> <div>英语速记</div>
<div class="submit" @click="submit">提交</div> <div class="submit" @click="submit">提交</div>
</div> </div>
<div class="next-pre"> <div class="next-pre">
...@@ -12,7 +12,9 @@ ...@@ -12,7 +12,9 @@
<div class="answer-list"> <div class="answer-list">
<div class="item" v-for="(item,index) in answer"> <div class="item" v-for="(item,index) in answer">
<div class="data" :style="{background: item.focus?'#409eff':''}" @click="changeFocus(index)">{{item.txt}}</div> <div class="data" :style="{background: (index==focus)?'#409eff':''}" @click="changeFocus(index)">
{{item.txt}}
</div>
</div> </div>
</div> </div>
...@@ -38,7 +40,7 @@ ...@@ -38,7 +40,7 @@
<div class="item" @click="input('s')">s</div> <div class="item" @click="input('s')">s</div>
<div class="item" @click="input('t')">t</div> <div class="item" @click="input('t')">t</div>
<div class="item" @click="input('u')">u</div> <div class="item" @click="input('u')">u</div>
<div class="item delete">删除</div> <div class="item delete" @click="del">删除</div>
<div class="item" @click="input('v')">v</div> <div class="item" @click="input('v')">v</div>
<div class="item" @click="input('w')">w</div> <div class="item" @click="input('w')">w</div>
<div class="item" @click="input('x')">x</div> <div class="item" @click="input('x')">x</div>
...@@ -49,7 +51,11 @@ ...@@ -49,7 +51,11 @@
</template> </template>
<script> <script>
export default { import BaseTrainPage from "../../framework/core/baseTrainPage";
import StoreUtil from "../../store/stateStore";
import BaseConstant from "../../store/constants/baseConstant";
export default new BaseTrainPage({
name: "answerLetter", name: "answerLetter",
data() { data() {
return { return {
...@@ -57,74 +63,90 @@ ...@@ -57,74 +63,90 @@
answer: [], answer: [],
focus: 0, focus: 0,
correctAnswer: [], correctAnswer: [],
correctNumber: 0
} }
}, },
methods:{ methods: {
//提交 submit() { //提交
submit() { let answer_time_end = new Date().getTime();
this.answer.forEach((v,i)=>{ StoreUtil.stateSave(BaseConstant.BRAIN_TRAIN_TRAIN_INFO_NOW, {
if(v.txt === this.correctAnswer[i].num) { data: {
this.correctNumber = this.correctNumber + 1; answer: this.answer,
correctAnswer: this.correctAnswer
},
result: {
answer_time_end: answer_time_end,
} }
}) });
this.$store.state.myLetterAnswer = this.answer;
this.$router.push({ this.$router.push({
path: '/home/result', path: '/home/result',
query: { query: {
number: this.answerLength, type: 2,
correctNumber: this.correctNumber, level: this.level,
type: 2 id: this.caseAlias,
model_id: this.modelAlias
} }
}) });
}, },
//前插一位 //前插一位
pre() { pre() {
this.answer[this.focus].focus = false; this.answer.splice(this.focus, 0, {
this.answer.splice(this.focus,0,{
txt: '', txt: '',
focus: false, });
}) this.focus = this.focus;
this.answer[this.focus].focus = true;
this.answer.length = this.answerLength; this.answer.length = this.answerLength;
}, },
//后插一位 //后插一位
next(){ next() {
this.answer.splice(this.focus+1,0,{ this.answer.splice(this.focus + 1, 0, {
txt: '', txt: '',
focus: false, });
}) this.focus = this.focus + 1;
this.answer.length = this.answerLength; this.answer.length = this.answerLength;
}, },
//点击改变焦点 //点击改变焦点
changeFocus(i){ changeFocus(i) {
this.answer[this.focus].focus = false;
this.answer[i].focus = true; this.answer[i].focus = true;
this.focus = i; this.focus = i;
}, },
input(val) { input(val) {
this.answer[this.focus].txt = val; this.answer[this.focus].txt = val;
if(this.focus < this.answer.length-1) { if (this.focus < this.answer.length - 1) {
this.answer[this.focus].focus = false; this.focus++;
this.focus ++ ;
this.answer[this.focus].focus = true;
} }
},
} del() {
if (this.answer[this.focus].txt == '') {//当前无值，则进1删除
let oldFocusItem = this.focus;
this.focus = (oldFocusItem > 0) ? (oldFocusItem - 1) : 0;
this.answer[this.focus].txt = '';
} else {
this.answer[this.focus].txt = '';
}
},
}, },
mounted() { mounted() {
this.correctAnswer = this.$store.state.randomLetter; this.answer = [];
if(this.$route.query&&this.$route.query.number) { this.correctAnswer = JSON.parse(JSON.stringify(StoreUtil.getState().train.currentCase.data.randomNumber));
this.answerLength = this.$route.query.number; this.answerLength = this.correctAnswer.length;
for(let i=0; i< this.answerLength; i++) { let q = [];
this.answer.push({ for (let i = 0; i < this.answerLength; i++) {
txt: '', this.answer.push({
focus: i == 0 ? true : false, txt: '',
}) focus: i === 0,
} check: false,
});
q.push(this.correctAnswer[i].num);
} }
StoreUtil.stateSave(BaseConstant.BRAIN_TRAIN_TRAIN_INFO_NOW, {
result: {
answer_time_start: new Date().getTime()
},
result_detail: {
q: q.join(',')
}
});
} }
} })
</script> </script>
<style scoped> <style scoped>
...@@ -181,6 +203,7 @@ ...@@ -181,6 +203,7 @@
align-items: center; align-items: center;
flex-wrap: wrap; flex-wrap: wrap;
} }
.answer-list .item { .answer-list .item {
width: 5%; width: 5%;
height: 50px; height: 50px;
...@@ -188,6 +211,7 @@ ...@@ -188,6 +211,7 @@
align-items: center; align-items: center;
justify-content: center; justify-content: center;
} }
.answer-list .item .data { .answer-list .item .data {
width: 90%; width: 90%;
height: 100%; height: 100%;
...@@ -196,6 +220,7 @@ ...@@ -196,6 +220,7 @@
align-items: center; align-items: center;
justify-content: center; justify-content: center;
} }
.btn-list { .btn-list {
display: flex; display: flex;
align-items: center; align-items: center;
......
src/views/randomLetter/index.vue
<template> <template>
<div class="content"> <div class="content">
<div class="title">随机字母设置</div> <div class="title">随机字母训练</div>
<div class="number">记忆数量 <div class="m-selector">
<input type="number" placeholder="请输入记忆数量" class="input" v-model="number"> <div v-for="(item, index) in caseConfig" :key="index" :index="index" :item="item">
个 <div class="item" :class="{active: (level === index)}" @click="changLevel(index)">{{item.level_name}}
</div>
</div>
</div> </div>
<el-button type="primary" class="start" @click="start">开始训练</el-button> <el-button type="primary" class="start" @click="start">开始训练</el-button>
</div> </div>
</template> </template>
<script> <script>
export default { import BaseCasePage from "../../framework/core/baseCasePage";
import CaseUtil from "../../framework/service/base/caseUtil";
export default new BaseCasePage({
name: "index", name: "index",
data() { data() {
return { return {
number: 50 level: 0,
} }
}, },
methods: { methods: {
start() { changLevel(level) {
if(!this.number || this.number <= 0) { if (level !== this.level) {
alert('请输入正确的个数'); this.level = level;
return;
} }
if(this.number>320) { },
alert('记忆数量必须小于或等于320'); start() {
return; CaseUtil.goToTrain('/randomLetter/startMemoryLetter',this);
}
this.$router.push({
path : '/randomLetter/startMemoryLetter',
query: {
number: this.number
}
})
} }
},
mounted() {
} }
} })
</script> </script>
<style scoped> <style scoped>
.content { .content {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
...@@ -52,22 +53,7 @@ ...@@ -52,22 +53,7 @@
font-weight: bold; font-weight: bold;
margin-bottom: 50px; margin-bottom: 50px;
} }
.number {
display: flex;
align-items: center;
font-size: 30px;
}
.input {
width: 300px;
margin: 0 12px;
height: 70px;
border: 2px solid #617e99;
padding-left: 10px;
border-radius: 4px;
}
.el-input__inner {
height: 90px;
}
.start { .start {
margin-top: 60px; margin-top: 60px;
width: 500px; width: 500px;
......
src/views/randomLetter/startMemoryLetter.vue
<template> <template>
<div class="content"> <div class="content">
<div class="line-style"> <div class="title">
<div class="label">随机字母</div> <div class="circle">英语速记</div>
<div class="limit_time">{{count_time}} s</div>
</div> </div>
<div class="line-style"> <div class="line-style">
<div class="label" style="margin-top: 6px">划辅助线</div> <div class="label" style="margin-top: 6px">划辅助线</div>
<div class="list"> <div class="list">
<div class="item" :class="{active: checked == 0}" @click="change(0)">不划</div> <div class="item" :class="{active: checked == 0}" @click="change(0)">不划</div>
<div class="item" :class="{active: checked == 2}" @click="change(2)">2</div> <div class="item" :class="{active: checked == 2}" @click="change(2)">2</div>
<div class="item" :class="{active: checked == 3}" @click="change(3)">3</div>
<div class="item" :class="{active: checked == 4}" @click="change(4)">4</div> <div class="item" :class="{active: checked == 4}" @click="change(4)">4</div>
<div class="item" :class="{active: checked == 5}" @click="change(5)">5</div> <div class="item" :class="{active: checked == 6}" @click="change(5)">6</div>
<div class="item" :class="{active: checked == 8}" @click="change(8)">8</div> <div class="item" :class="{active: checked == 8}" @click="change(8)">8</div>
</div> </div>
</div> </div>
<div class="number-list"> <div class="number-list">
<div class="number-data" v-for="(item,index) in letterList"> <div class="number-data" v-for="(item,index) in numberList">
<div class="number-item" :key="index" :style="{borderRightColor: item.border?'#666':''}">{{item.num}}</div> <div class="number-item" :key="index" :style="{borderRightColor: item.border?'#666':''}">{{item.num}}
</div>
</div> </div>
</div> </div>
<div class="start" @click="goAnswer">记忆完成</div> <div class="start" @click="start">记忆完成</div>
</div> </div>
</template> </template>
<script> <script>
export default { import StoreUtil from "../../store/stateStore";
import BaseConstant from "../../store/constants/baseConstant";
import BaseTrainPage from "../../framework/core/baseTrainPage";
export default new BaseTrainPage({
name: "startMemoryLetter", name: "startMemoryLetter",
data() { data() {
return { return {
number: 0, count_time: 0,
checked: 0, checked: 0,
letterList: [] numberList: []
} }
}, },
methods: { methods: {
countDown() {
this.timer = setInterval(() => {
if (this.count_time > 0) {
this.count_time = this.count_time - 1;
console.log(this.count_time)
} else {
clearInterval(this.timer);
this.start();
}
}, 1000)
},
change(val) { change(val) {
if(this.checked == val) return; if (this.checked == val) return;
this.checked = val; this.checked = val;
this.letterList.forEach(v=>{ this.numberList.forEach(v => {
v.border = false v.border = false
}) });
if(this.checked != 0) { if (this.checked != 0) {
this.letterList.forEach((vv,ii)=>{ this.numberList.forEach((vv, ii) => {
if((ii+1)%val == 0) { if ((ii + 1) % val == 0) {
vv.border = true; vv.border = true;
} }
}) })
} }
}, },
goAnswer(){ init() {
this.numberList = [];
let number = this.levelConfig.numb_quantity;
for (let i = 0; i < number; i++) {
let arr = ['a', 'b', 'c', 'd', 'e', 'f', 'g', 'h', 'i', 'j', 'k', 'l', 'm', 'n', 'o', 'p', 'q', 'r', 's', 't', 'u', 'v', 'w', 'x', 'y', 'z'];
this.numberList.push({
num: arr[Math.floor(Math.random() * 26)],
border: false
})
}
this.count_time = this.levelConfig.limit_remember_time;
this.countDown();
StoreUtil.stateSave(BaseConstant.BRAIN_TRAIN_TRAIN_INFO_NOW, {
data: {
randomNumber: this.numberList,
},
result: {
learn_time_start: new Date().getTime()
}
});
},
start() {
clearInterval(this.timer);
StoreUtil.stateSave(BaseConstant.BRAIN_TRAIN_TRAIN_INFO_NOW, {
result: {
learn_time_end: new Date().getTime()
}
});
this.$router.push({ this.$router.push({
path: '/randomLetter/answerLetter', path: '/randomLetter/answerLetter',
query: { query: {
number: this.number level: this.level,
id: this.caseAlias,
model_id: this.modelAlias
} }
}) });
} }
}, },
mounted() { mounted() {
if(this.$route.query&&this.$route.query.number) { this.init();
this.number = this.$route.query.number; },
for(let i=0;i<this.number;i++) { activated() {
let arr = ['a','b','c','d','e','f','g','h','i','j','k','l','m','n','o','p','q','r','s','t','u','v','w','x','y','z']; console.log('activated')
this.letterList.push({ },
num: arr[Math.floor(Math.random()*26)], deactivated() {
border: false clearInterval(this.timer);
}) console.log('deactivated')
this.$store.state.randomLetter = this.letterList; },
} destroyed() {
} clearInterval(this.timer);
console.log('destroyed')
} }
} })
</script> </script>
<style scoped> <style scoped>
.content { .content {
padding: 30px 24px; padding: 30px 24px;
} }
.title {
display: flex;
align-items: center;
}
.circle {
font-size: 30px;
color: #333;
}
.limit_time {
width: 100px;
height: 60px;
display: flex;
align-items: center;
justify-content: center;
color: #017af7;
font-size: 28px;
margin-left: auto;
}
.line-style { .line-style {
display: flex; display: flex;
/*align-items: center;*/ /*align-items: center;*/
margin-top: 20px; margin-top: 20px;
} }
.line-style .label { .line-style .label {
font-size: 30px; font-size: 30px;
color: #333; color: #333;
width: 150px; width: 150px;
} }
.line-style .list { .line-style .list {
display: flex; display: flex;
align-items: center; align-items: center;
flex-wrap: wrap; flex-wrap: wrap;
} }
.line-style .item { .line-style .item {
height: 60px; height: 60px;
display: flex; display: flex;
...@@ -105,22 +180,26 @@ ...@@ -105,22 +180,26 @@
padding: 0 24px; padding: 0 24px;
margin-bottom: 20px; margin-bottom: 20px;
} }
.line-style .active { .line-style .active {
color: #fff; color: #fff;
background: #409eff; background: #409eff;
border-color: #409eff; border-color: #409eff;
} }
.number-list { .number-list {
display: flex; display: flex;
flex-wrap: wrap; flex-wrap: wrap;
margin-top: 20px; margin-top: 20px;
} }
.number-data { .number-data {
width: 5%; width: 5%;
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: center; justify-content: center;
} }
.number-item { .number-item {
width: 90%; width: 90%;
height: 50px; height: 50px;
...@@ -129,8 +208,9 @@ ...@@ -129,8 +208,9 @@
justify-content: center; justify-content: center;
border-right: 2px solid transparent; border-right: 2px solid transparent;
} }
.start { .start {
margin: 60px auto ; margin: 60px auto;
width: 500px; width: 500px;
height: 80px; height: 80px;
border-radius: 40px; border-radius: 40px;
......
src/views/randomNumber/answerNumber.vue
...@@ -12,7 +12,9 @@ ...@@ -12,7 +12,9 @@
<div class="answer-list"> <div class="answer-list">
<div class="item" v-for="(item,index) in answer"> <div class="item" v-for="(item,index) in answer">
<div class="data" :style="{background: item.focus?'#409eff':''}" @click="changeFocus(index)">{{item.txt}}</div> <div class="data" :style="{background: (index==focus)?'#409eff':''}" @click="changeFocus(index)">
{{item.txt}}
</div>
</div> </div>
</div> </div>
...@@ -26,14 +28,18 @@ ...@@ -26,14 +28,18 @@
<div class="item" @click="input(7)">7</div> <div class="item" @click="input(7)">7</div>
<div class="item" @click="input(8)">8</div> <div class="item" @click="input(8)">8</div>
<div class="item" @click="input(9)">9</div> <div class="item" @click="input(9)">9</div>
<div class="item delete">删除</div> <div class="item delete" @click="del">删除</div>
<div class="item zero" @click="input(0)">0</div> <div class="item zero" @click="input(0)">0</div>
</div> </div>
</div> </div>
</template> </template>
<script> <script>
export default { import StoreUtil from "../../store/stateStore";
import BaseConstant from "../../store/constants/baseConstant";
import BaseTrainPage from "../../framework/core/baseTrainPage";
export default new BaseTrainPage({
name: "answerNumber", name: "answerNumber",
data() { data() {
return { return {
...@@ -41,75 +47,90 @@ ...@@ -41,75 +47,90 @@
answer: [], answer: [],
focus: 0, focus: 0,
correctAnswer: [], correctAnswer: [],
correctNumber: 0
} }
}, },
methods:{ methods: {
//提交
submit() {
this.answer.forEach((v,i)=>{
if(v.txt === this.correctAnswer[i].num) {
console.log(v.txt,this.correctAnswer[i].num);
this.correctNumber = this.correctNumber + 1;
}
})
this.$store.state.myNumberAnswer = this.answer;
this.$router.push({
path: '/home/result',
query: {
number: this.answerLength,
correctNumber: this.correctNumber,
type: 1
}
})
},
//前插一位 //前插一位
pre() { pre() {
this.answer[this.focus].focus = false; this.answer.splice(this.focus, 0, {
this.answer.splice(this.focus,0,{
txt: '', txt: '',
focus: false, });
}) this.focus = this.focus;
this.answer[this.focus].focus = true;
this.answer.length = this.answerLength; this.answer.length = this.answerLength;
}, },
//后插一位 //后插一位
next(){ next() {
this.answer.splice(this.focus+1,0,{ this.answer.splice(this.focus + 1, 0, {
txt: '', txt: '',
focus: false, });
}) this.focus = this.focus+1;
this.answer.length = this.answerLength; this.answer.length = this.answerLength;
}, },
//点击改变焦点 //点击改变焦点
changeFocus(i){ changeFocus(i) {
this.answer[this.focus].focus = false;
this.answer[i].focus = true; this.answer[i].focus = true;
this.focus = i; this.focus = i;
}, },
input(val) { input(val) {
this.answer[this.focus].txt = val; this.answer[this.focus].txt = val;
if(this.focus < this.answer.length-1) { if (this.focus < this.answer.length - 1) {
this.answer[this.focus].focus = false; this.focus++;
this.focus ++ ;
this.answer[this.focus].focus = true;
} }
},
del() {
if(this.answer[this.focus].txt==''){//当前无值，则进1删除
let oldFocusItem = this.focus;
this.focus = (oldFocusItem > 0) ? (oldFocusItem - 1) : 0;
this.answer[this.focus].txt = '';
}else{
this.answer[this.focus].txt = '';
}
},
submit() { //提交
let answer_time_end = new Date().getTime();
StoreUtil.stateSave(BaseConstant.BRAIN_TRAIN_TRAIN_INFO_NOW, {
data: {
answer: this.answer,
correctAnswer: this.correctAnswer
},
result: {
answer_time_end: answer_time_end,
}
});
this.$router.push({
path: '/home/result',
query: {
type: 1,
level: this.level,
id: this.caseAlias,
model_id: this.modelAlias
}
})
} }
}, },
mounted() { mounted() {
this.correctAnswer = this.$store.state.randomNumber; this.answer = [];
if(this.$route.query&&this.$route.query.number) { this.correctAnswer = JSON.parse(JSON.stringify(StoreUtil.getState().train.currentCase.data.randomNumber));
this.answerLength = this.$route.query.number; this.answerLength = this.correctAnswer.length;
for(let i=0; i< this.answerLength; i++) { let q = [];
this.answer.push({ for (let i = 0; i < this.answerLength; i++) {
txt: '', this.answer.push({
focus: i == 0 ? true : false, txt: '',
}) focus: i === 0,
} check: false,
});
q.push(this.correctAnswer[i].num);
} }
StoreUtil.stateSave(BaseConstant.BRAIN_TRAIN_TRAIN_INFO_NOW, {
result: {
answer_time_start: new Date().getTime()
},
result_detail: {
q: q.join(',')
}
});
} }
} })
</script> </script>
<style scoped> <style scoped>
...@@ -166,6 +187,7 @@ ...@@ -166,6 +187,7 @@
align-items: center; align-items: center;
flex-wrap: wrap; flex-wrap: wrap;
} }
.answer-list .item { .answer-list .item {
width: 5%; width: 5%;
height: 50px; height: 50px;
...@@ -173,6 +195,7 @@ ...@@ -173,6 +195,7 @@
align-items: center; align-items: center;
justify-content: center; justify-content: center;
} }
.answer-list .item .data { .answer-list .item .data {
width: 90%; width: 90%;
height: 100%; height: 100%;
...@@ -181,6 +204,7 @@ ...@@ -181,6 +204,7 @@
align-items: center; align-items: center;
justify-content: center; justify-content: center;
} }
.btn-list { .btn-list {
display: flex; display: flex;
align-items: center; align-items: center;
......
src/views/randomNumber/index.vue
<template> <template>
<div class="content"> <div class="content">
<div class="title">随机数字设置</div> <div class="title">随机数字训练</div>
<div class="number">记忆数量 <div class="m-selector">
<input type="number" placeholder="请输入记忆数量" class="input" v-model="number"> <div v-for="(item, index) in caseConfig" :key="index" :index="index" :item="item">
个 <div class="item" :class="{active: (level === index)}" @click="changLevel(index)">{{item.level_name}}
</div>
</div>
</div> </div>
<el-button type="primary" class="start" @click="start">开始训练</el-button> <el-button type="primary" class="start" @click="start">开始训练</el-button>
</div> </div>
</template> </template>
<script> <script>
export default { import BaseCasePage from "../../framework/core/baseCasePage";
import CaseUtil from "../../framework/service/base/caseUtil";
export default new BaseCasePage({
name: "index", name: "index",
data() { data() {
return { return {
number: 50 level: 0,
} }
}, },
methods: { methods: {
start() { changLevel(level) {
if(!this.number || this.number <= 0) { if (level !== this.level) {
alert('请输入正确的个数'); this.level = level;
return;
} }
if(this.number>320) {
alert('记忆数量必须小于或等于320'); },
return; start() {
} CaseUtil.goToTrain('/randomNumber/startMemory',this);
this.$router.push({
path : '/randomNumber/startMemory',
query: {
number: this.number
}
})
} }
},
mounted() {
} }
} })
</script> </script>
<style scoped> <style scoped>
.content { .content {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
...@@ -52,22 +54,7 @@ ...@@ -52,22 +54,7 @@
font-weight: bold; font-weight: bold;
margin-bottom: 50px; margin-bottom: 50px;
} }
.number {
display: flex;
align-items: center;
font-size: 30px;
}
.input {
width: 300px;
margin: 0 12px;
height: 70px;
border: 2px solid #617e99;
padding-left: 10px;
border-radius: 4px;
}
.el-input__inner {
height: 90px;
}
.start { .start {
margin-top: 60px; margin-top: 60px;
width: 500px; width: 500px;
......
src/views/randomNumber/startMemory.vue
<template> <template>
<div class="content"> <div class="content">
<div class="line-style"> <div class="title">
<div class="label">随机数字</div> <div class="circle">随机数字</div>
<div class="limit_time">{{count_time}} s</div>
</div> </div>
<div class="line-style"> <div class="line-style">
<div class="label" style="margin-top: 6px">划辅助线</div> <div class="label" style="margin-top: 6px">划辅助线</div>
<div class="list"> <div class="list">
<div class="item" :class="{active: checked == 0}" @click="change(0)">不划</div> <div class="item" :class="{active: checked == 0}" @click="change(0)">不划</div>
<div class="item" :class="{active: checked == 2}" @click="change(2)">2</div> <div class="item" :class="{active: checked == 2}" @click="change(2)">2</div>
<div class="item" :class="{active: checked == 3}" @click="change(3)">3</div>
<div class="item" :class="{active: checked == 4}" @click="change(4)">4</div> <div class="item" :class="{active: checked == 4}" @click="change(4)">4</div>
<div class="item" :class="{active: checked == 5}" @click="change(5)">5</div> <div class="item" :class="{active: checked == 6}" @click="change(6)">6</div>
<div class="item" :class="{active: checked == 8}" @click="change(8)">8</div> <div class="item" :class="{active: checked == 8}" @click="change(8)">8</div>
</div> </div>
</div> </div>
<div class="number-list"> <div class="number-list">
<div class="number-data" v-for="(item,index) in numberList"> <div class="number-data" v-for="(item,index) in numberList">
<div class="number-item" :key="index" :style="{borderRightColor: item.border?'#666':''}">{{item.num}}</div> <div class="number-item" :key="index" :style="{borderRightColor: item.border?'#666':''}">{{item.num}}
</div>
</div> </div>
</div> </div>
<div class="start" @click="goAnswer">记忆完成</div> <div class="start" @click="start">记忆完成</div>
</div> </div>
</template> </template>
<script> <script>
export default { import BaseTrainPage from "../../framework/core/baseTrainPage";
import StoreUtil from "../../store/stateStore";
import BaseConstant from "../../store/constants/baseConstant";
export default new BaseTrainPage({
name: "startMemory", name: "startMemory",
data() { data() {
return { return {
checked: 0, checked: 0,
number: 0, count_time: 0,
numberList: [] numberList: []
} }
}, },
methods: { methods: {
//去答题 countDown() {
goAnswer() { this.timer = setInterval(() => {
this.$router.push({ if (this.count_time > 0) {
path: '/randomNumber/answerNumber', this.count_time = this.count_time - 1;
query: { console.log(this.count_time)
number: this.number } else {
clearInterval(this.timer);
this.start();
} }
}) }, 1000)
}, },
change(val) { change(val) {
if(this.checked == val) return; if (this.checked == val) return;
this.checked = val; this.checked = val;
this.numberList.forEach(v=>{ this.numberList.forEach(v => {
v.border = false v.border = false
}) });
if(this.checked != 0) { if (this.checked != 0) {
this.numberList.forEach((vv,ii)=>{ this.numberList.forEach((vv, ii) => {
if((ii+1)%val == 0) { if ((ii + 1) % val == 0) {
vv.border = true; vv.border = true;
} }
}) })
} }
} },
}, init() {
mounted() { this.numberList = [];
if(this.$route.query&&this.$route.query.number) { let number = this.levelConfig.numb_quantity;
this.number = this.$route.query.number; for (let i = 0; i < number; i++) {
for(let i=0;i<this.number;i++) {
this.numberList.push({ this.numberList.push({
num: Math.floor ( Math.random ( ) * 10 ), num: Math.floor(Math.random() * 10),
border: false border: false
}) });
this.$store.state.randomNumber = this.numberList;
} }
this.count_time = this.levelConfig.limit_remember_time;
this.countDown();
StoreUtil.stateSave(BaseConstant.BRAIN_TRAIN_TRAIN_INFO_NOW, {
data: {
randomNumber: this.numberList,
},
result: {
learn_time_start: new Date().getTime()
}
});
},
start() {
clearInterval(this.timer);
StoreUtil.stateSave(BaseConstant.BRAIN_TRAIN_TRAIN_INFO_NOW, {
result: {
learn_time_end: new Date().getTime()
}
});
this.$router.push({
path: '/randomNumber/answerNumber',
query: {
level: this.level,
id: this.caseAlias,
model_id: this.modelAlias
}
})
} }
},
mounted() {
this.init();
},
activated() {
console.log('activated')
},
deactivated() {
clearInterval(this.timer);
console.log('deactivated')
},
destroyed() {
clearInterval(this.timer);
console.log('destroyed')
} }
} })
</script> </script>
<style scoped> <style scoped>
.content { .content {
padding: 30px 24px; padding: 30px 24px;
} }
.title {
display: flex;
align-items: center;
}
.circle {
font-size: 30px;
color: #333;
}
.limit_time {
width: 100px;
height: 60px;
display: flex;
align-items: center;
justify-content: center;
color: #017af7;
font-size: 28px;
margin-left: auto;
}
.line-style { .line-style {
display: flex; display: flex;
/*align-items: center;*/
margin-top: 20px; margin-top: 20px;
} }
.line-style .label { .line-style .label {
font-size: 30px; font-size: 30px;
color: #333; color: #333;
width: 150px; width: 150px;
} }
.line-style .list { .line-style .list {
display: flex; display: flex;
align-items: center; align-items: center;
flex-wrap: wrap; flex-wrap: wrap;
} }
.line-style .item { .line-style .item {
height: 60px; height: 60px;
display: flex; display: flex;
...@@ -106,22 +178,26 @@ ...@@ -106,22 +178,26 @@
padding: 0 24px; padding: 0 24px;
margin-bottom: 20px; margin-bottom: 20px;
} }
.line-style .active { .line-style .active {
color: #fff; color: #fff;
background: #409eff; background: #409eff;
border-color: #409eff; border-color: #409eff;
} }
.number-list { .number-list {
display: flex; display: flex;
flex-wrap: wrap; flex-wrap: wrap;
margin-top: 20px; margin-top: 20px;
} }
.number-data { .number-data {
width: 5%; width: 5%;
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: center; justify-content: center;
} }
.number-item { .number-item {
width: 90%; width: 90%;
height: 50px; height: 50px;
...@@ -130,8 +206,9 @@ ...@@ -130,8 +206,9 @@
justify-content: center; justify-content: center;
border-right: 2px solid transparent; border-right: 2px solid transparent;
} }
.start { .start {
margin: 60px auto ; margin: 60px auto;
width: 500px; width: 500px;
height: 80px; height: 80px;
border-radius: 40px; border-radius: 40px;
......
src/views/reserve/index.vue
...@@ -15,13 +15,13 @@ ...@@ -15,13 +15,13 @@
<div>比赛规则</div> <div>比赛规则</div>
</div> </div>
<div class="explain"> <div class="explain">
1、选手在“国际脑力运动”线上平台报名参加脑力世界杯并选中本项比赛。 1、选手在“摩天轮脑力运动”线上平台报名参加脑力世界杯并选中本项比赛。
</div> </div>
<div class="explain"> <div class="explain">
1. Athlete register Intellectual World Cup on the "International Intellectual Sports" online platform and select this discipline. 1. Athlete register Intellectual World Cup on the "International Intellectual Sports" online platform and select this discipline.
</div> </div>
<div class="explain"> <div class="explain">
2、所有选手在“国际脑力运动”线上平台上点击进入本项目比赛倒计时页面，倒计时归零后立即开始比赛。 2、所有选手在“摩天轮脑力运动”线上平台上点击进入本项目比赛倒计时页面，倒计时归零后立即开始比赛。
</div> </div>
<div class="explain"> <div class="explain">
2. All athletes clicked into the countdown page on the "International Intellectual Sports" online platform, 2. All athletes clicked into the countdown page on the "International Intellectual Sports" online platform,
...@@ -85,7 +85,9 @@ ...@@ -85,7 +85,9 @@
</template> </template>
<script> <script>
export default { import BaseCasePage from "../../framework/core/baseCasePage";
export default new BaseCasePage({
name: "index", name: "index",
methods: { methods: {
start() { start() {
...@@ -93,8 +95,11 @@ ...@@ -93,8 +95,11 @@
path: '/reserve/reserveAnswer' path: '/reserve/reserveAnswer'
}) })
} }
},
mounted() {
} }
} })
</script> </script>
<style scoped> <style scoped>
......
src/views/stareOrigin/index.vue
...@@ -5,48 +5,68 @@ ...@@ -5,48 +5,68 @@
<div class="paragraph"><span>训练方法：</span>端正坐姿，将屏幕与视线垂直，3分钟内尽量不要眨眼，凝视图片黑色三角 <div class="paragraph"><span>训练方法：</span>端正坐姿，将屏幕与视线垂直，3分钟内尽量不要眨眼，凝视图片黑色三角
区中心，如果感觉图片在动，则表示你的注意力涣散。发生这种现象时，请迅速眨一下眼睛，调整注意力，使图片保持“静止”。 区中心，如果感觉图片在动，则表示你的注意力涣散。发生这种现象时，请迅速眨一下眼睛，调整注意力，使图片保持“静止”。
</div> </div>
<div class="m-selector">
模式：
<div v-for="(item, index) in caseConfig" :key="index" :index="index" :item="item">
<div class="item" :class="{active: (level === index)}" @click="changLevel(index)">{{item.level_name}}
</div>
</div>
</div>
<div class="start" @click="start">开始训练</div> <div class="start" @click="start">开始训练</div>
</div> </div>
</template> </template>
<script> <script>
export default { import BaseCasePage from "../../framework/core/baseCasePage";
import CaseUtil from "../../framework/service/base/caseUtil";
export default new BaseCasePage({
name: "index", name: "index",
data() { data() {
return { return {
level: 0,
} }
}, },
methods: { methods: {
changLevel(level) {
if (level !== this.level) {
this.level = level;
}
},
start() { start() {
this.$router.push({ CaseUtil.goToTrain('/stareOrigin/startOrigin', this);
path: '/stareOrigin/startOrigin'
})
} }
},
mounted() {
} }
} })
</script> </script>
<style scoped> <style scoped>
.content { .content {
padding: 48px 48px 140px 48px; padding: 48px 48px 140px 48px;
} }
.title { .title {
text-align: center; text-align: center;
color: #000000; color: #000000;
font-size: 34px; font-size: 34px;
font-weight: bold; font-weight: bold;
} }
.paragraph { .paragraph {
color: #666; color: #666;
font-size: 28px; font-size: 28px;
line-height: 58px; line-height: 58px;
margin-top: 20px; margin-top: 20px;
} }
.paragraph span { .paragraph span {
color: #000; color: #000;
font-weight: bold; font-weight: bold;
} }
.start { .start {
width: 500px; width: 500px;
height: 80px; height: 80px;
......
src/views/stareOrigin/startOrigin.vue
<template> <template>
<div class="content"> <div class="content">
<div class="time">{{msg}}</div> <div class="time">{{msg}}</div>
<img class="image" src="http://static.ledouya.com/Fr69BCullfyo0LibIfOdf1kIlx4v" alt=""> <img class="image" :src="pic_url" alt="">
</div> </div>
</template> </template>
<script> <script>
export default { import BaseTrainPage from "../../framework/core/baseTrainPage";
import StoreUtil from "../../store/stateStore";
import BaseConstant from "../../store/constants/baseConstant";
export default new BaseTrainPage({
name: "startOrigin", name: "startOrigin",
data() { data() {
return { return {
msg: '3分0秒', msg: '0分0秒',
timer: '', timer: '',
maxtime: 179 count_time: 0,
pic_url: 'http://static.ledouya.com/Fr69BCullfyo0LibIfOdf1kIlx4v'
} }
}, },
methods: { methods: {
CountDown() { countDown() {
this.timer = setInterval(()=>{ this.timer = setInterval(() => {
if (this.maxtime >= 0) { if (this.count_time >= 0) {
let minutes = Math.floor(this.maxtime / 60); let minutes = Math.floor(this.count_time / 60);
let seconds = Math.floor(this.maxtime % 60); let seconds = Math.floor(this.count_time % 60);
this.msg = minutes + "分" + seconds + "秒"; this.msg = minutes + "分" + seconds + "秒";
this.maxtime = this.maxtime - 1; this.count_time = this.count_time - 1;
} else{ } else {
clearInterval(this.timer); clearInterval(this.timer);
this.start();
} }
},1000) }, 1000)
},
init() {
this.count_time = parseInt(this.levelConfig.limit_remember_time);
this.msg = Math.floor(this.count_time / 60) + "分" + Math.floor(this.count_time % 60) + "秒";
this.countDown();
this.pic_url = this.levelConfig.pic_url;
StoreUtil.stateSave(BaseConstant.BRAIN_TRAIN_TRAIN_INFO_NOW, {
data: {
pic_url: this.levelConfig.pic_url,
},
result: {
learn_time_start: new Date().getTime()
}
});
},
start() {
clearInterval(this.timer);
StoreUtil.stateSave(BaseConstant.BRAIN_TRAIN_TRAIN_INFO_NOW, {
result: {
learn_time_end: new Date().getTime()
}
});
this.$message({
type: 'success',
content: '凝视结束!'
});
} }
}, },
mounted() { mounted() {
this.CountDown(); this.init();
},
activated() {
console.log('activated')
},
deactivated() {
clearInterval(this.timer);
console.log('deactivated')
},
destroyed() {
clearInterval(this.timer);
console.log('destroyed')
} }
} })
</script> </script>
<style scoped> <style scoped>
...@@ -43,11 +85,13 @@ ...@@ -43,11 +85,13 @@
flex-direction: column; flex-direction: column;
padding-top: 48px; padding-top: 48px;
} }
.time { .time {
color: #409eff; color: #409eff;
font-size: 30px; font-size: 30px;
margin-bottom: 20px; margin-bottom: 20px;
} }
.image { .image {
width: 90%; width: 90%;
} }
......
Markdown is supported
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!